首頁 探索 說明
登入
feiniao
/
feiniao-farm-h5
4
0
複刻 0
檔案 問題管理 0 合併請求 0 Wiki
瀏覽代碼

Merge branch 'master' of http://www.sysuimars.cn:3000/feiniao/feiniao-farm-h5

lxf 2 月之前
父節點
6a422a2559 0183d9f86e
當前提交
f8beb43806
共有 21 個文件被更改，包括 287 次插入 和 1271 次删除
統一視圖 顯示文件統計
  1. 11 9
      package-lock.json
  2. 1 0
      package.json
  3. 1 1
      public/index.html
  4. 二進制
      src/assets/img/home/garden-icon-1.png
  5. 二進制
      src/assets/img/home/garden-icon-2.png
  6. 二進制
      src/assets/img/home/garden-icon-3.png
  7. 二進制
      src/assets/img/home/garden-title.png
  8. 二進制
      src/assets/img/home/go-back.png
  9. 二進制
      src/assets/img/home/invite-bg.png
  10. 二進制
      src/assets/img/home/t.png
  11. 6 6
      src/router/globalRoutes.js
  12. 150 0
      src/views/old_mini/create_farm/editMap.vue
  13. 99 0
      src/views/old_mini/create_farm/map/editMap.js
  14. 0 159
      src/views/old_mini/farm/components/invitePopup.vue
  15. 0 156
      src/views/old_mini/farm/components/traceSourcePopup.vue
  16. 0 481
      src/views/old_mini/farm/index.vue
  17. 0 403
      src/views/old_mini/farm/map/index.js
  18. 0 42
      src/views/old_mini/farm/map/map.scss
  19. 1 1
      src/views/old_mini/home/components/homeFloatingPanel.vue
  20. 1 1
      src/views/old_mini/home/index.vue
  21. 17 12
      yarn.lock

+ 11 - 9
package-lock.json
查看文件 

@@ -35,6 +35,7 @@
 
         "nprogress": "^0.2.0",
 
         "nprogress": "^0.2.0",
 
         "ol": "^6.15.1",
 
         "ol": "^6.15.1",
 
         "ol-ext": "^3.2.4",
 
         "ol-ext": "^3.2.4",
 
+        "proj4": "^2.19.10",
 
         "qs": "^6.11.0",
 
         "qs": "^6.11.0",
 
         "qweather-icons": "^1.6.0",
 
         "qweather-icons": "^1.6.0",
 
         "vant": "^4.9.4",
 
         "vant": "^4.9.4",
 
@@ -17579,13 +17580,15 @@
 
       }
 
       }
 
     },
 
     },
 
     "node_modules/proj4": {
 
     "node_modules/proj4": {
 
-      "version": "2.12.1",
 
-      "resolved": "https://registry.npmjs.org/proj4/-/proj4-2.12.1.tgz",
 
-      "integrity": "sha512-vmhP3hmstjXjzFwg8QXJwpoj4n7GVrXk3ZW3DzNK/Ur4cuwXq7ZiMXaWYvLYLQbX8n4MXgbwTr4lthOUZltBpA==",
 
-      "license": "MIT",
 
+      "version": "2.19.10",
 
+      "resolved": "https://registry.npmjs.org/proj4/-/proj4-2.19.10.tgz",
 
+      "integrity": "sha512-uL6/C6kA8+ncJAEDmUeV8PmNJcTlRLDZZa4/87CzRpb8My4p+Ame4LhC4G3H/77z2icVqcu3nNL9h5buSdnY+g==",
 
       "dependencies": {
 
       "dependencies": {
 
         "mgrs": "1.0.0",
 
         "mgrs": "1.0.0",
 
-        "wkt-parser": "^1.3.3"
 
+        "wkt-parser": "^1.5.1"
 
+      },
 
+      "funding": {
 
+        "url": "https://github.com/sponsors/ahocevar"
 
       }
 
       }
 
     },
 
     },
 
     "node_modules/protocol-buffers-schema": {
 
     "node_modules/protocol-buffers-schema": {
 
@@ -21261,10 +21264,9 @@
 
       }
 
       }
 
     },
 
     },
 
     "node_modules/wkt-parser": {
 
     "node_modules/wkt-parser": {
 
-      "version": "1.3.3",
 
-      "resolved": "https://registry.npmjs.org/wkt-parser/-/wkt-parser-1.3.3.tgz",
 
-      "integrity": "sha512-ZnV3yH8/k58ZPACOXeiHaMuXIiaTk1t0hSUVisbO0t4RjA5wPpUytcxeyiN2h+LZRrmuHIh/1UlrR9e7DHDvTw==",
 
-      "license": "MIT"
 
+      "version": "1.5.2",
 
+      "resolved": "https://registry.npmjs.org/wkt-parser/-/wkt-parser-1.5.2.tgz",
 
+      "integrity": "sha512-1ZUiV1FTwSiSrgWzV9KXJuOF2BVW91KY/mau04BhnmgOdroRQea7Q0s5TVqwGLm0D2tZwObd/tBYXW49sSxp3Q=="
 
     },
 
     },
 
     "node_modules/word-wrap": {
 
     "node_modules/word-wrap": {
 
       "version": "1.2.3",
 
       "version": "1.2.3",

+ 1 - 0
package.json
查看文件 

@@ -38,6 +38,7 @@
 
     "nprogress": "^0.2.0",
 
     "nprogress": "^0.2.0",
 
     "ol": "^6.15.1",
 
     "ol": "^6.15.1",
 
     "ol-ext": "^3.2.4",
 
     "ol-ext": "^3.2.4",
 
+    "proj4": "^2.19.10",
 
     "qs": "^6.11.0",
 
     "qs": "^6.11.0",
 
     "qweather-icons": "^1.6.0",
 
     "qweather-icons": "^1.6.0",
 
     "vant": "^4.9.4",
 
     "vant": "^4.9.4",

+ 1 - 1
public/index.html
查看文件 

@@ -3,7 +3,7 @@
 
   <head>
 
   <head>
 
     <meta charset="utf-8">
 
     <meta charset="utf-8">
 
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
-    <meta name="viewport" content="width=device-width,initial-scale=1.0">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0 ,maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
 
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
 
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
 
     <title>飞鸟管家</title>
 
     <title>飞鸟管家</title>
 
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/qweather-icons@1.3.0/font/qweather-icons.css">
 
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/qweather-icons@1.3.0/font/qweather-icons.css">

二進制
src/assets/img/home/garden-icon-1.png
查看文件


二進制
src/assets/img/home/garden-icon-2.png
查看文件


二進制
src/assets/img/home/garden-icon-3.png
查看文件


二進制
src/assets/img/home/garden-title.png
查看文件


二進制
src/assets/img/home/go-back.png
查看文件


二進制
src/assets/img/home/invite-bg.png
查看文件


二進制
src/assets/img/home/t.png
查看文件


+ 6 - 6
src/router/globalRoutes.js
查看文件 

@@ -18,12 +18,6 @@ export default [
 
         meta: { showTabbar: true, keepAlive: true },
 
         meta: { showTabbar: true, keepAlive: true },
 
         component: () => import("@/views/old_mini/home/index.vue"),
 
         component: () => import("@/views/old_mini/home/index.vue"),
 
     },
 
     },
 
-    {
 
-        path: "/farm",
 
-        name: "Farm",
 
-        meta: { showTabbar: true, keepAlive: true },
 
-        component: () => import("@/views/old_mini/farm/index.vue"),
 
-    },
 
     //个人中心
 
     //个人中心
 
     {
 
     {
 
         path: "/mine",
 
         path: "/mine",
 
@@ -78,4 +72,10 @@ export default [
 
         name: "CreateFarm",
 
         name: "CreateFarm",
 
         component: () => import("@/views/old_mini/create_farm/index.vue"),
 
         component: () => import("@/views/old_mini/create_farm/index.vue"),
 
     },
 
     },
 
+    // 编辑地图
 
+    {
 
+        path: "/edit_map",
 
+        name: "EditMap",
 
+        component: () => import("@/views/old_mini/create_farm/editMap.vue"),
 
+    },
 
 ];
 
 ];

+ 150 - 0
src/views/old_mini/create_farm/editMap.vue
查看文件 

@@ -0,0 +1,150 @@
 
+<template>
 
+    <div class="edit-map">
 
+        <custom-header name="创建农场"></custom-header>
 
+        <div class="edit-map-content">
 
+            <div class="edit-map-tip">操作提示：拖动圆点，即可调整地块边界</div>
 
+            <div class="map-container" ref="mapContainer"></div>
 
+            <div class="edit-map-footer">
 
+                <div class="footer-back" @click="goBack">
 
+                    <img class="back-icon" src="@/assets/img/home/go-back.png" alt="" />
 
+                </div>
 
+                <div class="footer-address-box">
 
+                    <div class="footer-address">
 
+                        <div class="address-title">富丽华丽园-18栋-1单元</div>
 
+                        <div class="address-detail">广东省广州市从化区富江道</div>
 
+                    </div>
 
+                    <div class="address-btn" @click="goBack">修改地址</div>
 
+                </div>
 
+                <div class="edit-map-footer-btn">
 
+                    <div class="btn-cancel" @click="goBack">取消</div>
 
+                    <div class="btn-confirm" @click="confirm">确认</div>
 
+                </div>
 
+            </div>
 
+        </div>
 
+    </div>
 
+</template>
 
+
 
+<script setup>
 
+import customHeader from "@/components/customHeader.vue";
 
+import { ref, onMounted } from "vue";
 
+import EditMap from "./map/editMap.js";
 
+import { useRouter } from "vue-router";
 
+
 
+const router = useRouter();
 
+const mapContainer = ref(null);
 
+const editMap = new EditMap();
 
+const mapData = {
 
+    farmCode: "LBY",
 
+    farmId: "766",
 
+    id: 2,
 
+    isGenerateReport: 1,
 
+    name: "分区2",
 
+    pointCount: 131,
 
+    pointWkt: "POINT (113.6142086995688 23.585836479509055)",
 
+    regionCode: "LBY-MR-2",
 
+    wkt: "MULTIPOLYGON (((113.61348988377155 23.58617369800422, 113.61395837633405 23.58622555407246, 113.61414076654707 23.58622555407246, 113.61436964832843 23.5862774101407, 113.61478628474084 23.586468741036786, 113.61491681896747 23.58652417337007, 113.61512424307672 23.586449071517652, 113.61491503077356 23.585742756367924, 113.61479880177082 23.585596129050916, 113.61473800497858 23.585451289764112, 113.61438931780664 23.585286780835393, 113.61410858003889 23.585299297865365, 113.61385645239149 23.585249229909184, 113.61378135053907 23.585288569029306, 113.61357571446003 23.585283204611276, 113.61347200232355 23.585342213209604, 113.61338080721704 23.585506721974614, 113.61335934954492 23.585665866485304, 113.61342193444922 23.58616296916816, 113.61348988377155 23.58617369800422)))",
 
+};
 
+onMounted(() => {
 
+    editMap.initMap("POINT (113.6142086995688 23.585836479509055)", mapContainer.value);
 
+    // editMap.setAreaGeometry([{ featureWkt: mapData.wkt }]);
 
+});
 
+const goBack = () => {
 
+    router.back();
 
+};
 
+const confirm = () => {
 
+    console.log("confirm");
 
+};
 
+</script>
 
+
 
+<style lang="scss" scoped>
 
+.edit-map {
 
+    width: 100%;
 
+    height: 100vh;
 
+    overflow: hidden;
 
+    .edit-map-content {
 
+        width: 100%;
 
+        height: 100%;
 
+        position: relative;
 
+        .edit-map-tip {
 
+            position: absolute;
 
+            top: 23px;
 
+            left: calc(50% - 256px / 2);
 
+            z-index: 1;
 
+            font-size: 12px;
 
+            color: #fff;
 
+            padding: 9px 20px;
 
+            background: rgba(0, 0, 0, 0.5);
 
+            border-radius: 20px;
 
+        }
 
+        .map-container {
 
+            width: 100%;
 
+            height: 100%;
 
+        }
 
+        .edit-map-footer {
 
+            position: absolute;
 
+            bottom: 80px;
 
+            left: 12px;
 
+            width: calc(100% - 24px);
 
+            display: flex;
 
+            flex-direction: column;
 
+            align-items: flex-end;
 
+            .footer-back {
 
+                padding: 6px 7px 9px;
 
+                background: #fff;
 
+                border-radius: 8px;
 
+                .back-icon {
 
+                    width: 20px;
 
+                    height: 18px;
 
+                }
 
+            }
 
+            .footer-address-box {
 
+                width: 100%;
 
+                box-sizing: border-box;
 
+                margin: 19px 0 14px 0;
 
+                display: flex;
 
+                justify-content: space-between;
 
+                align-items: center;
 
+                background: #fff;
 
+                border-radius: 14px;
 
+                padding: 14px 12px;
 
+                .footer-address {
 
+                    font-size: 12px;
 
+                    color: rgba(0, 0, 0, 0.6);
 
+                    .address-title {
 
+                        font-weight: 500;
 
+                        font-size: 16px;
 
+                        color: #000;
 
+                    }
 
+                }
 
+                .address-btn {
 
+                    color: #2199f8;
 
+                    border: 1px solid #2199f8;
 
+                    border-radius: 25px;
 
+                    padding: 6px 10px;
 
+                }
 
+            }
 
+            .edit-map-footer-btn {
 
+                display: flex;
 
+                justify-content: center;
 
+                align-items: center;
 
+                width: 100%;
 
+                div {
 
+                    width: 92px;
 
+                    text-align: center;
 
+                    color: #666666;
 
+                    font-size: 16px;
 
+                    padding: 8px 0;
 
+                    border-radius: 25px;
 
+                    background: #fff;
 
+                }
 
+                .btn-confirm {
 
+                    background: #000;
 
+                    background-image: linear-gradient(180deg, #76c3ff 0%, #2199f8 100%);
 
+                    margin-left: 16px;
 
+                    color: #fff;
 
+                }
 
+            }
 
+        }
 
+    }
 
+}
 
+</style>

+ 99 - 0
src/views/old_mini/create_farm/map/editMap.js
查看文件 

@@ -0,0 +1,99 @@
 
+import * as KMap from "@/utils/ol-map/KMap";
 
+import * as util from "@/common/ol_common.js";
 
+import config from "@/api/config.js";
 
+import Style from "ol/style/Style";
 
+import Icon from "ol/style/Icon";
 
+import { Point } from 'ol/geom';
 
+import Feature from "ol/Feature";
 
+import * as proj from "ol/proj";
 
+import { getArea } from 'ol/sphere.js';
 
+import WKT from "ol/format/WKT.js";
 
+import proj4 from "proj4"
 
+import { register } from "ol/proj/proj4";
 
+proj4.defs("EPSG:38572","+proj=merc +a=6378137 +b=6378137 +lat_ts=0 +lon_0=0 +x_0=0 +y_0=0 +k=1 +units=m +nadgrids=@null +wktext +no_defs +type=crs");
 
+register(proj4);
 
+
 
+/**
 
+ * @description 地图层对象
 
+ */
 
+class EditMap {
 
+  constructor() {
 
+    let that = this;
 
+    let vectorStyle = new KMap.VectorStyle();
 
+    this.vectorStyle = vectorStyle;
 
+
 
+    // 位置图标
 
+    this.clickPointLayer = new KMap.VectorLayer("clickPointLayer", 9999, {
 
+      style: (f) => {
 
+        return new Style({
 
+          image: new Icon({
 
+            src: require("@/assets/img/home/garden-point.png"),
 
+            scale: 0.5,
 
+            anchor: [0.5, 1],
 
+          }),
 
+        });
 
+      },
 
+    });
 
+  }
 
+
 
+  initMap(location, target) {
 
+    let level = 16;
 
+    let coordinate = util.wktCastGeom(location).getFirstCoordinate();
 
+    this.kmap = new KMap.Map(target, level, coordinate[0], coordinate[1], null, 8, 22);
 
+    let xyz2 = config.base_img_url3 + "map/lby/{z}/{x}/{y}.png";
 
+    this.kmap.addXYZLayer(xyz2, { minZoom: 8, maxZoom: 22 }, 2);
 
+    this.kmap.addLayer(this.clickPointLayer.layer);
 
+    this.setMapPoint(coordinate)
 
+
 
+    this.kmap.initDraw((e) => {
 
+      // showContent.isShow = true
 
+    })
 
+    this.kmap.startDraw()
 
+    this.kmap.modifyDraw()
 
+  }
 
+
 
+  setAreaGeometry(geometryArr) {
 
+    let that = this
 
+    geometryArr.map(item => {
 
+      that.kmap.setLayerWkt(item.featureWkt)
 
+    })
 
+  }
 
+
 
+  clearLayer(){
 
+    // this.kmap.removeLayer(this.clickPointLayer.layer)
 
+    this.kmap.polygonLayer.source.clear();
 
+  }
 
+
 
+  getAreaGeometry() {
 
+    const features = this.kmap.getLayerFeatures()
 
+    let geometryArr = []
 
+    let area = 0
 
+    // 获取图层上的Polygon，转成geoJson用于回显
 
+    features.forEach(item => {
 
+      geometryArr.push({featureWkt: new WKT().writeFeature(item)})
 
+      let geom = item.getGeometry().clone()
 
+      geom.transform(proj.get("EPSG:4326"), proj.get("EPSG:38572"))
 
+      let areaItem = getArea(geom)
 
+      areaItem = (areaItem + areaItem / 2) / 1000;
 
+      area += areaItem
 
+    })
 
+    return {geometryArr, area: area.toFixed(2)}
 
+  }
 
+
 
+  setMapPosition(center) {
 
+    this.kmap.getView().animate({
 
+      center,
 
+      zoom: 16,
 
+      duration: 500,
 
+    });
 
+    this.setMapPoint(center)
 
+  }
 
+
 
+  setMapPoint(coordinate) {
 
+    this.clickPointLayer.source.clear()
 
+    let point = new Feature(new Point(coordinate))
 
+    this.clickPointLayer.addFeature(point)
 
+  }
 
+}
 
+
 
+export default EditMap;

+ 0 - 159
src/views/old_mini/farm/components/invitePopup.vue
查看文件 

@@ -1,159 +0,0 @@
 
-<template>
 
-    <popup class="invite-popup" v-model:show="showPopup" round closeable>
 
-        <div class="title">
 
-            <div>您当前的邀请次数</div>
 
-            <span>还剩余1次</span>
 
-        </div>
 
-        <div class="progress-wrap">
 
-            <span>今天邀请次数</span>
 
-            <el-progress class="progress" :percentage="80" :stroke-width="8" color="#D9D9D9" :format="format" />
 
-        </div>
 
-        <div class="garden">
 
-            <div class="name">请选择果园</div>
 
-            <div class="list">
 
-                <div :class="['list-item',{active:active===index}]" v-for="(item,index) in 3" :key="index" @click="handleActive(index)">
 
-                    <el-avatar :size="39" src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg" />
 
-                    <span>荔博园</span>
 
-                </div>
 
-            </div>
 
-        </div>
 
-        <div class="tips">由于认养树有限,转发将消耗一次名额</div>
 
-        <div class="button" @click="handleOk">立即转发</div>
 
-    </popup>
 
-</template>
 
-
 
-<script setup>
 
-import { Popup } from "vant";
 
-import { ref, watch } from "vue";
 
-
 
-const props = defineProps({
 
-    show:{
 
-        type:Boolean,
 
-        defalut:false
 
-    }
 
-})
 
-
 
-const format = (percentage) => (`4/5`)
 
-
 
-const active = ref(0)
 
-const handleActive = (index) =>{
 
-    active.value = index
 
-}
 
-
 
-const showPopup = ref(false);
 
-const handleOk = () =>{
 
-    showPopup.value = false
 
-}
 
-
 
-watch(()=>props.show,()=>{
 
-    showPopup.value = true
 
-})
 
-</script>
 
-
 
-<style lang="scss" scoped>
 
-.invite-popup {
 
-    width: 84%;
 
-    padding: 24px 20px;
 
-    
-    .title {
 
-        font-size: 24px;
 
-        margin-bottom: 20px;
 
-        text-align: center;
 
-        position: relative;
 
-        font-weight: 500;
 
-        span {
 
-            color: #01bedb;
 
-            letter-spacing: 1px;
 
-            position: relative;
 
-            z-index: 2;
 
-        }
 
-        &::before {
 
-            content: "";
 
-            position: absolute;
 
-            bottom: 0;
 
-            left: 80px;
 
-            background: url("@/assets/img/home/popup-line.png") no-repeat center center / 100% 100%;
 
-            width: 116px;
 
-            height: 10px;
 
-        }
 
-    }
 
-    .progress-wrap{
 
-        display: flex;
 
-        align-items: center;
 
-        color: #3B3A3A;
 
-        font-size: 12px;
 
-        border-bottom: 1px solid #F5F5F5;
 
-        padding-bottom: 16px;
 
-        .progress{
 
-            width: calc(100% - 88px);
 
-            margin-left: 4px;
 
-            ::v-deep{
 
-                .el-progress-bar__outer{
 
-                    overflow: unset;
 
-                }
 
-                .el-progress-bar__inner{
 
-                    &::before{
 
-                        content: '';
 
-                        position: absolute;
 
-                        top: -4px;
 
-                        width: 19px;
 
-                        height: 14px;
 
-                        background: #D5D5D5;
 
-                        border: 1px solid #FFFFFF;
 
-                        border-radius: 20px;
 
-                        margin-left: -21px;
 
-                    }
 
-                }
 
-                .el-progress__text{
 
-                    font-size: 12px;
 
-                    color: #999999;
 
-                    min-width: auto;
 
-                    margin-right: -14px;
 
-                }
 
-            }
 
-        }
 
-    }
 
-    .garden{
 
-        margin: 16px 0 36px 0;
 
-        .name{
 
-            font-weight: 500;
 
-        }
 
-        .list{
 
-            display: flex;
 
-            margin-top: 8px;
 
-            .list-item{
 
-                flex: 1;
 
-                border: 1px solid #E5E5E5;
 
-                border-radius: 8px;
 
-                display: flex;
 
-                flex-direction: column;
 
-                align-items: center;
 
-                padding: 10px;
 
-                &.active{
 
-                    border-color: #0FD6F4;
 
-                    background: #EAFCFF;
 
-                }
 
-            }
 
-            .list-item + .list-item{
 
-                margin-left: 9px;
 
-            }
 
-        }
 
-    }
 
-    .tips{
 
-        font-size: 12px;
 
-        color: #999999;
 
-        text-align: center;
 
-    }
 
-    .button {
 
-        margin-top: 10px;
 
-        background: linear-gradient(0deg, #18e0ff, #00c5e3);
 
-        border-radius: 30px;
 
-        font-size: 18px;
 
-        padding: 11px;
 
-        box-sizing: border-box;
 
-        text-align: center;
 
-        color: #fff;
 
-        font-weight: 500;
 
-    }
 
-}
 
-</style>

+ 0 - 156
src/views/old_mini/farm/components/traceSourcePopup.vue
查看文件 

@@ -1,156 +0,0 @@
 
-<template>
 
-    <div class="trace-source-popup" v-show="showPopup">
 
-        <div class="title">
 
-            <span>认养溯源</span>
 
-        </div>
 
-        <div class="tabs">
 
-            <div :class="['tab-item',{active:active===index}]" v-for="(item,index) in tabsList" :key="index" @click="handleActive(index)">{{item}}</div>
 
-        </div>
 
-        <div class="box" v-show="active===0">
 
-            这里是介绍果树当下情况，以及未来长势的文案。这里是介绍果树当下情况，以及未来长势的文案。
 
-            这里是介绍果树当下情况，以
 
-        </div>
 
-        <div class="table" v-show="active===1">
 
-            <div class="th">
 
-                <div class="td width">序号</div>
 
-                <div class="td">农事名称</div>
 
-                <div class="td">农事配方</div>
 
-                <div class="td">服务主体</div>
 
-                <div class="td">药品安全性</div>
 
-            </div>
 
-            <div class="tr">
 
-                <div class="td width">01</div>
 
-                <div class="td">药品安全</div>
 
-                <div class="td">药品+全性</div>
 
-                <div class="td">
 
-                    农资:大雨科技<br/>
 
-                    专家:为帮问
 
-                </div>
 
-                <div class="td">符合NY/T496标准</div>
 
-            </div>
 
-            <div class="tr">
 
-                <div class="td width">02</div>
 
-                <div class="td">药品安全</div>
 
-                <div class="td">药品+全性</div>
 
-                <div class="td">
 
-                    农资:大雨科技<br/>
 
-                    专家:为帮问
 
-                </div>
 
-                <div class="td">符合NY/T496标准</div>
 
-            </div>
 
-        </div>
 
-    </div>
 
-</template>
 
-
 
-<script setup>
 
-import { ref, watch } from "vue";
 
-
 
-const props = defineProps({
 
-    show:{
 
-        type:Boolean,
 
-        defalut:false
 
-    }
 
-})
 
-
 
-const showPopup = ref(false);
 
-
 
-const active = ref(0)
 
-const tabsList = ["成长记录","农事记录"]
 
-const handleActive = (index) =>{
 
-    active.value = index
 
-}
 
-
 
-watch(()=>props.show,()=>{
 
-    showPopup.value = true
 
-})
 
-</script>
 
-
 
-<style lang="scss" scoped>
 
-.trace-source-popup{
 
-    width: calc(100% - 16px);
 
-    min-height: 182px;
 
-    background: #fff;
 
-    position: absolute;
 
-    bottom: 8px;
 
-    left: 8px;
 
-    border-radius: 10px;
 
-    padding: 12px;
 
-    box-sizing: border-box;
 
-    z-index: 3;
 
-    .title{
 
-        font-size: 16px;
 
-        font-weight: 500;
 
-        position: relative;
 
-        span{
 
-            position: relative;
 
-            z-index: 2;
 
-        }
 
-        &::after {
 
-            content: "";
 
-            position: absolute;
 
-            bottom: 0;
 
-            left: 0;
 
-            background: linear-gradient(60deg, #18e0ff, rgba(24, 224, 255, 0));
 
-            width: 87px;
 
-            height: 8px;
 
-            border-radius: 20px;
 
-            z-index: 1;
 
-        }
 
-    }
 
-    .tabs{
 
-        margin-top: 12px;
 
-        display: flex;
 
-        margin-bottom: 25px;
 
-        .tab-item{
 
-            color: #666666;
 
-            margin-right: 20px;
 
-            &.active{
 
-                color: #000;
 
-                font-weight: 500;
 
-                position: relative;
 
-                &::after {
 
-                    content: "";
 
-                    position: absolute;
 
-                    bottom: -5px;
 
-                    left: calc(50% - 10px);
 
-                    background: #10C2DD;
 
-                    width: 20px;
 
-                    height: 3px;
 
-                    border-radius: 20px;
 
-                }
 
-            }
 
-        }
 
-    }
 
-    .box{
 
-        border: 1px solid #CCCCCC;
 
-        border-radius: 8px;
 
-        padding: 8px 12px;
 
-    }
 
-    .table{
 
-        border: 1px solid #CCCCCC;
 
-        border-radius: 8px;
 
-        .th,.tr{
 
-            background: #f5f5f5;
 
-            border-radius: 8px 8px 0 0;
 
-            display: flex;
 
-            .td{
 
-                width: 25%;
 
-                text-align: center;
 
-                padding: 10px 0;
 
-                &.width{
 
-                    width: 10%;
 
-                }
 
-            }
 
-        }
 
-        .tr{
 
-            background: #fff;
 
-            &:last-child{
 
-                border-radius: 0 0 8px 8px;
 
-            }
 
-        }
 
-        .tr + .tr{
 
-            border-top: 1px solid #CCCCCC;
 
-        }
 
-    }
 
-}
 
-</style>

+ 0 - 481
src/views/old_mini/farm/index.vue
查看文件 

@@ -1,481 +0,0 @@
 
-<template>
 
-    <div class="farm-index" :style="{ height: `calc(100vh - ${tabBarHeight}px)` }">
 
-        <!-- 地图 -->
 
-        <div class="map-container" id="map-container"></div>
 
-
 
-        <div class="select-box yes-events" v-show="showBox">
 
-            <div class="box-1" v-show="boxStep === 1">
 
-                <div class="box-title">
 
-                    <div>请选择认养品种</div>
 
-                    <div class="icon"></div>
 
-                </div>
 
-                <div class="select-list">
 
-                    <div
 
-                        class="select-item"
 
-                        v-for="(item, i) in fruitType"
 
-                        :key="i"
 
-                        @click="selectFruitType(item, i)"
 
-                        :class="{ active: activeFruitType === i }"
 
-                    >
 
-                        <img class="type-img" src="@/assets/img/home/t.png" alt="" />
 
-                        <div class="item-name">{{ item.name }}</div>
 
-                        <div class="item-desc">{{ item.desc }}</div>
 
-                    </div>
 
-                </div>
 
-            </div>
 
-
 
-            <div class="box-2" v-show="boxStep === 2">
 
-                <div class="box-title">
 
-                    <div>
 
-                        <span class="done-step" @click="backStep"
 
-                            >已选择品种<el-icon><ArrowRight /></el-icon></span
 
-                        >请选择树龄
 
-                    </div>
 
-                    <div class="icon"></div>
 
-                </div>
 
-                <div class="select-list tree-list">
 
-                    <div
 
-                        class="select-item"
 
-                        v-for="(item, i) in treeAge"
 
-                        :key="i"
 
-                        @click="selectAge(item, i)"
 
-                        :class="{ active: activeAge === i }"
 
-                    >
 
-                        <img class="type-img tree" src="@/assets/img/home/tree.png" alt="" />
 
-                        <!-- <div class="item-name">{{ item.name }}</div> -->
 
-                        <div class="item-desc">{{ item.desc }}</div>
 
-                    </div>
 
-                </div>
 
-            </div>
 
-            <div class="select-btn" @click="handleNextStep">确认</div>
 
-        </div>
 
-
 
-        <Popup v-model:show="showTips" round>
 
-            <div class="tips-wrap">
 
-                <div class="tips-t">
 
-                    <div class="tips-icon">
 
-                        <img src="@/assets/img/home/warning.png" alt="" />
 
-                    </div>
 
-                    <div class="tips-text">
 
-                        <div><span>30年以上树龄</span> 的树</div>
 
-                        <div>今天已被抢光了</div>
 
-                    </div>
 
-                    <div class="tips-step">
 
-                        <span class="step-text">今天认养进度</span>
 
-                        <Progress class="step-progress" inactive :percentage="100" />
 
-                        <span class="step-value">5/5</span>
 
-                    </div>
 
-                </div>
 
-                <div class="tips-btn">
 
-                    <div class="btn normal">明天再来吧</div>
 
-                    <div class="btn primary">再选选其他</div>
 
-                </div>
 
-            </div>
 
-        </Popup>
 
-
 
-        <!-- 改名字 -->
 
-        <Popup v-model:show="showNamePopup" round>
 
-            <div class="name-popup">
 
-                <div class="imgBg">
 
-                    <div class="roll-box">
 
-                        <!-- <SwiperText></SwiperText> -->
 
-                    </div>
 
-                    <div class="text1">HI~</div>
 
-                    <div class="text1">亲爱的主人</div>
 
-                    <div class="text2">今天你正式成为我的守候者</div>
 
-                    <div class="text2">请为我取一个特别的名字吧~</div>
 
-                    <div class="edit-box">
 
-                        <el-input class="input" v-model="treeName" />
 
-                    </div>
 
-                    <div class="tips-btn">
 
-                        <div class="btn primary" @click="handleOpen">开启守护之旅</div>
 
-                    </div>
 
-                </div>
 
-            </div>
 
-        </Popup>
 
-
 
-        <!-- 邀请按钮、飞巡实况 -->
 
-        <div class="btn-group" v-show="traceSourceShow">
 
-            <div class="invite" @click="handleInvite">
 
-                <Icon class="icon" size="14" name="share" />
 
-                <span>邀请认养</span>
 
-                <span>1/5</span>
 
-            </div>
 
-            <img class="video" src="@/assets/img/home/video-img.png" alt="">
 
-        </div>
 
-
 
-        <!-- 邀请弹窗 -->
 
-        <invite-popup :show="inviteShow"></invite-popup>
 
-
 
-        <!-- 溯源弹窗 -->
 
-        <trace-source-popup :show="traceSourceShow"></trace-source-popup>
 
-    </div>
 
-</template>
 
-
 
-<script setup>
 
-//导入mars3d插件（按需使用，需要先npm install）
 
-import "mars3d-space";
 
-import FarmMap from "./map/index.js";
 
-import { onMounted, computed, ref, onUnmounted } from "vue";
 
-import { useStore } from "vuex";
 
-import { Popup, Progress ,Icon} from "vant";
 
-import invitePopup from "./components/invitePopup.vue"
 
-import traceSourcePopup from "./components/traceSourcePopup.vue"
 
-import { useRouter } from "vue-router";
 
-import eventBus from "@/api/eventBus";
 
-const router = useRouter();
 
-const store = useStore();
 
-const tabBarHeight = computed(() => store.state.home.tabBarHeight);
 
-
 
-const farmMap = new FarmMap();
 
-
 
-onMounted(() => {
 
-    farmMap.initMap("POINT (113.61702297075017 23.584863449735067)", "map-container");
 
-    eventBus.on('map:photo',clickPhoto)
 
-});
 
-
 
-onUnmounted(()=>{
 
-    eventBus.off('map:photo',clickPhoto)
 
-})
 
-
 
-//果树照片点击事件
 
-function clickPhoto(){
 
-    router.push('/photo')
 
-}
 
-
 
-const fruitType = ref([
 
-    { name: "糯米糍", desc: "香甜多汁 果肉细腻" },
 
-    { name: "桂味", desc: "香甜多汁 果肉细腻" },
 
-    { name: "井岗红糯", desc: "香甜多汁 果肉细腻" },
 
-]);
 
-
 
-const treeAge = ref([
 
-    { name: "10-30年", desc: "10-30年" },
 
-    { name: "30年以上", desc: "30年以上" },
 
-    { name: "0-10年", desc: "0-10年" },
 
-]);
 
-
 
-// 底部框
 
-const showBox = ref(true);
 
-const boxStep = ref(1);
 
-
 
-// 选品种
 
-const activeFruitType = ref(null);
 
-function selectFruitType(item, i) {
 
-    activeFruitType.value = i;
 
-    farmMap.highlightCategory(i);
 
-    console.log("i", i);
 
-}
 
-
 
-function backStep() {
 
-    boxStep.value = boxStep.value - 1;
 
-}
 
-
 
-// 选树龄
 
-
 
-const showTips = ref(false);
 
-const activeAge = ref(1);
 
-function handleNextStep() {
 
-    if (boxStep.value === 1) {
 
-        boxStep.value = boxStep.value + 1;
 
-    } else {
 
-        if (activeAge.value !== 1) {
 
-            showNamePopup.value = true;
 
-        } else {
 
-            showTips.value = true;
 
-        }
 
-    }
 
-}
 
-
 
-function selectAge(item, i) {
 
-    activeAge.value = i;
 
-    farmMap.highlightAge(activeFruitType.value, i + 1);
 
-}
 
-
 
-// 名字
 
-const showNamePopup = ref(false);
 
-const treeName = ref("");
 
-const handleOpen = () =>{
 
-    boxStep.value = boxStep.value + 1;
 
-    showNamePopup.value = false
 
-    traceSourceShow.value = !traceSourceShow.value
 
-    farmMap.addDemoGraphic()
 
-}
 
-
 
-//邀请弹窗
 
-const inviteShow = ref(false)
 
-const handleInvite = () =>{
 
-    inviteShow.value = !inviteShow.value
 
-}
 
-
 
-//溯源弹窗
 
-const traceSourceShow = ref(false)
 
-</script>
 
-
 
-<style lang="scss" scoped>
 
-.farm-index {
 
-    position: relative;
 
-    width: 100%;
 
-    height: calc(100vh - 50px);
 
-    overflow: hidden;
 
-    .map-container {
 
-        width: 100%;
 
-        height: 100%;
 
-    }
 
-    .select-box {
 
-        position: absolute;
 
-        bottom: 8px;
 
-        left: 8px;
 
-        right: 9px;
 
-        width: calc(100% - 18px);
 
-        background: #fff;
 
-        border-radius: 16px;
 
-        padding: 16px;
 
-        box-sizing: border-box;
 
-        text-align: center;
 
-        .box-title {
 
-            display: flex;
 
-            justify-content: space-between;
 
-            color: #000000;
 
-            font-size: 16px;
 
-            font-weight: bold;
 
-        }
 
-        .select-list {
 
-            padding: 10px 0;
 
-            display: flex;
 
-            align-items: center;
 
-            justify-content: space-around;
 
-            overflow-x: auto;
 
-            min-height: 118px;
 
-            .select-item {
 
-                display: flex;
 
-                flex-direction: column;
 
-                justify-content: center;
 
-                align-items: center;
 
-                padding: 6px 8px;
 
-                box-shadow: 0 0 4px 0px #ccc;
 
-                border-radius: 8px;
 
-                flex: none;
 
-                transition: all 0.3s;
 
-                &.active {
 
-                    border: 1px solid #0fd6f4;
 
-                    .type-img {
 
-                        width: 48px;
 
-                        height: 48px;
 
-                        &.tree {
 
-                            width: 78px;
 
-                            height: 60px;
 
-                        }
 
-                    }
 
-                    .item-name {
 
-                        font-size: 14px;
 
-                    }
 
-                    .item-desc {
 
-                        font-size: 10px;
 
-                    }
 
-                }
 
-                &.tree-list {
 
-                    .item-desc {
 
-                        font-size: 10px;
 
-                    }
 
-                    &.active {
 
-                        .item-desc {
 
-                            font-size: 12px;
 
-                        }
 
-                    }
 
-                }
 
-                .type-img {
 
-                    width: 32px;
 
-                    height: 32px;
 
-                    border-radius: 50%;
 
-                    object-fit: cover;
 
-                    transition: all 0.3s;
 
-                    &.tree {
 
-                        width: 50px;
 
-                        height: 40px;
 
-                    }
 
-                }
 
-                .item-name {
 
-                    padding: 2px 0 1px 0;
 
-                    font-size: 12px;
 
-                    color: #333333;
 
-                    transition: all 0.3s;
 
-                }
 
-                .item-desc {
 
-                    color: #bbbbbb;
 
-                    font-size: 8px;
 
-                    transition: all 0.3s;
 
-                }
 
-            }
 
-            .select-item + .select-item {
 
-                margin-left: 20px;
 
-            }
 
-        }
 
-        .select-btn {
 
-            font-size: 14px;
 
-            color: #fff;
 
-            background: linear-gradient(#18e0ff, #00c5e3);
 
-            padding: 0 80px;
 
-            height: 40px;
 
-            border-radius: 30px;
 
-            text-align: center;
 
-            display: inline-flex;
 
-            align-items: center;
 
-            justify-content: center;
 
-        }
 
-    }
 
-
 
-    .tips-wrap {
 
-        padding: 24px 16px 20px 16px;
 
-        .tips-t {
 
-            display: flex;
 
-            flex-direction: column;
 
-            justify-content: center;
 
-            align-items: center;
 
-            .tips-icon {
 
-                img {
 
-                    width: 64px;
 
-                }
 
-            }
 
-            .tips-text {
 
-                font-size: 18px;
 
-                color: #000;
 
-                padding: 12px 0;
 
-                span {
 
-                    color: #ffa600;
 
-                }
 
-            }
 
-            .tips-step {
 
-                display: flex;
 
-                align-items: center;
 
-                color: #999999;
 
-                font-size: 12px;
 
-                padding: 12px 0 32px 0;
 
-                .step-text {
 
-                    padding-right: 6px;
 
-                }
 
-                .step-progress {
 
-                    flex: 1;
 
-                    width: 152px;
 
-                }
 
-                .step-value {
 
-                    padding-left: 4px;
 
-                }
 
-            }
 
-        }
 
-    }
 
-    .tips-btn {
 
-        display: flex;
 
-        align-items: center;
 
-        justify-content: center;
 
-        .btn {
 
-            padding: 0 26px;
 
-            border-radius: 30px;
 
-            font-size: 16px;
 
-            height: 49px;
 
-            display: inline-flex;
 
-            align-items: center;
 
-            justify-content: center;
 
-            box-sizing: border-box;
 
-        }
 
-        .normal {
 
-            border: 1px solid #999999;
 
-            color: #000;
 
-        }
 
-        .primary {
 
-            color: #fff;
 
-            background: linear-gradient(#18e0ff, #00c5e3);
 
-        }
 
-        .btn + .btn {
 
-            margin-left: 13px;
 
-        }
 
-    }
 
-
 
-    .name-popup {
 
-        .imgBg {
 
-            width: 303px;
 
-            height: 491px;
 
-            padding-top: 5px;
 
-            border-radius: 16px;
 
-            background-image: url("https://birdseye-img.sysuimars.com/birdseye-look-mini/foster/renamebg.png");
 
-            background-size: 100% 100%;
 
-            .roll-box {
 
-                background: #ffffff38;
 
-                width: 90%;
 
-                height: 23px;
 
-                margin: 0 14px 34px 10px;
 
-                border-radius: 16px;
 
-                padding-left: 12px;
 
-                padding-right: 12px;
 
-                box-sizing: border-box;
 
-            }
 
-            .text1 {
 
-                color: #000;
 
-                font-weight: bold;
 
-                font-size: 22px;
 
-                margin: 10px 35px 0px 25px;
 
-            }
 
-            .text2 {
 
-                color: #075366;
 
-                font-weight: bold;
 
-                font-size: 14px;
 
-                margin: 10px 35px 0px 25px;
 
-            }
 
-            .edit-box {
 
-                margin-top: 22px;
 
-                margin-bottom: 60px;
 
-                height: 94px;
 
-                width: 100%;
 
-                display: flex;
 
-                align-items: center;
 
-                justify-content: center;
 
-                .input {
 
-                    width: 96%;
 
-                    height: 40px;
 
-                    border-radius: 20px;
 
-                    color: #066199;
 
-                    text-align: center;
 
-                    padding-left: 30px;
 
-                    padding-right: 30px;
 
-                    box-sizing: border-box;
 
-
 
-                    ::v-deep {
 
-                        .el-input__wrapper {
 
-                            border-radius: 20px;
 
-                        }
 
-                    }
 
-                }
 
-            }
 
-        }
 
-    }
 
-
 
-    // 邀请按钮、飞巡实况
 
-    .btn-group{
 
-        position: absolute;
 
-        z-index: 2;
 
-        right: 8px;
 
-        bottom: 200px;
 
-        .invite{
 
-            width: 60px;
 
-            height: 60px;
 
-            border-radius: 50%;
 
-            background: url('@/assets/img/home/invite-bg.png') no-repeat center center /100% 100%;
 
-            margin-bottom: 6px;
 
-            display: flex;
 
-            align-items: center;
 
-            flex-direction: column;
 
-            justify-content: center;
 
-            color: #fff;
 
-            font-size: 10px;
 
-            .icon{
 
-               margin-top: -7px;
 
-               transform: scaleX(-1);
 
-            }
 
-        }
 
-        .video{
 
-            width: 60px;
 
-            height: 54px;
 
-        }
 
-    }
 
-}
 
-</style>

+ 0 - 403
src/views/old_mini/farm/map/index.js
查看文件 

@@ -1,403 +0,0 @@
 
-import config from "@/api/config.js";
 
-
 
-//引入cesium基础库
 
-import "mars3d-cesium/Build/Cesium/Widgets/widgets.css";
 
-import * as Cesium from "mars3d-cesium";
 
-import './map.scss'
 
-
 
-//导入mars3d主库
 
-import "mars3d/mars3d.css";  //v3.8.6及之前版本使用 import "mars3d/dist/mars3d.css";
 
-import * as mars3d from "mars3d";
 
-import "mars3d-tdt";
 
-import GeoUtils from "@/utils/turf_util.js"
 
-import { LayerType } from "mars3d";
 
-import eventBus from "@/api/eventBus";
 
-
 
-/**
 
- * @description 智能巡园地图层对象
 
- */
 
-class FarmMap {
 
-    constructor() {
 
-    }
 
-    //初始化地图
 
-    initMap(location, targetId) {
 
-        mars3d.Token.updateAll({ tianditu: 'e95115c454a663cd052d96019fd83840' })
 
-        // lat纬度，lng经度，alt高度，heading方向角度值，pitch俯仰角度值
 
-        let mapOptions = {
 
-            scene: {
 
-                // center: { lat: coord[1], lng: coord[0], alt: 1000, heading: 0, pitch: 0 },
 
-                showSun: true,
 
-                showMoon: false,
 
-                showSkyBox: false,
 
-                scene3DOnly: true,
 
-                skyBox: {
 
-                    type: "ground",
 
-                    sources: {
 
-                        positiveX: "//data.mars3d.cn/img/skybox-near/lantian/Right.jpg",
 
-                        negativeX: "//data.mars3d.cn/img/skybox-near/lantian/Left.jpg",
 
-                        positiveY: "//data.mars3d.cn/img/skybox-near/lantian/Front.jpg",
 
-                        negativeY: "//data.mars3d.cn/img/skybox-near/lantian/Back.jpg",
 
-                        positiveZ: "//data.mars3d.cn/img/skybox-near/lantian/Up.jpg",
 
-                        negativeZ: "//data.mars3d.cn/img/skybox-near/lantian/Down.jpg"
 
-                    }
 
-                },
 
-                backgroundImage: "url(//birdseye-img.sysuimars.com/birdseye-look-mini/home/20250123113804.png)",
 
-                backgroundColor: "rgba(0,0,0,0)",
 
-                sceneMode: Cesium.SceneMode.SCENE3D,
 
-                showSkyAtmosphere: false,
 
-                requestRenderMode: true, // 显式渲染
 
-                cameraController: {
 
-                    enableRotate: true,
 
-                    enableTilt: false,
 
-                    enableTranslate: true,
 
-                },
 
-                shadowMap: {
 
-                    enabled: false,
 
-                    softShadows: true
 
-                },
 
-                fog: false,
 
-                globe: {
 
-                    show: true,
 
-                    showGroundAtmosphere: false,
 
-                    enableLighting: true,
 
-                    backgroundImage: "url(//data.mars3d.cn/img/busines/background1.jpg)",
 
-                }
 
-            },
 
-            basemaps: [{ name: "天地图", type: "tdt", layer: "img_d", show: true }],
 
-            // basemaps: [],
 
-            terrain: {
 
-                show: true,
 
-                type: LayerType.tdt
 
-            },
 
-            locationBar: {},
 
-            control: {
 
-                contextmenu: false
 
-            }
 
-
 
-        };
 
-        let map = new mars3d.Map(targetId, mapOptions); //支持的参数请看API文档：http://mars3d.cn/api/Map.html
 
-        map.fixedLight = true // 固定光照，避免gltf模型随时间存在亮度不一致。
 
-        // 固定光照方向
 
-        map.scene.light = new Cesium.DirectionalLight({
 
-            direction: map.scene.camera.direction
 
-        })
 
-        map.scene.globe.depthTestAgainstTerrain = true
 
-
 
-        // let xyz = config.base_img_url3 + "map/lby/{z}/{x}/{y}.png";
 
-        // map.addLayer(new mars3d.layer.XyzLayer({ url: xyz }), true);
 
-        this.map = map;
 
-        this.mapNum = 0
 
-        // this.initModel(coord)
 
-        // this.initInfo()
 
-        const point = [113.617022, 23.5848634]
 
-        // this.addGardenAndTree(point)
 
-        this.addGraphicPoint(point)
 
-        this.graphicLayer = new mars3d.layer.GraphicLayer();
 
-        this.map.addLayer(this.graphicLayer);
 
-        // this.addAreaGraphic()// 添加区域
 
-        // this.cameraMoveStart()
 
-        // this.scrollWall()// 走马灯围栏效果
 
-        // this.wallEntity()//实心围墙效果
 
-
 
-        // 飞行到 500m 高度
 
-        this.map.camera.flyTo({
 
-            destination: Cesium.Cartesian3.fromDegrees(113.6149629, 23.58594117, 500),
 
-            duration: 3 // 3秒飞行
 
-        });
 
-
 
-        // 创建图层
 
-        this.treeGraphicLayer = new mars3d.layer.GraphicLayer();
 
-        this.map.addLayer(this.treeGraphicLayer);
 
-        // 创建图层
 
-        this.treePointGraphicLayer = new mars3d.layer.GraphicLayer();
 
-        this.map.addLayer(this.treePointGraphicLayer);
 
-
 
-        this.pointsData = [
 
-            { lng: 113.6149629, lat: 23.58594117, id: 1, fruitType: 1, age: 1, },
 
-            { lng: 113.6146207, lat: 23.58591316, id: 2, fruitType: 2, age: 2, },
 
-            { lng: 113.6147351, lat: 23.586311962, id: 3, fruitType: 1, age: 2, },
 
-            { lng: 113.6144588, lat: 23.58577547, id: 4, fruitType: 3, age: 3, },
 
-            { lng: 113.6139674, lat: 23.58594271, id: 5, fruitType: 0, age: 1, },
 
-        ];
 
-
 
-        // 3秒后绘制范围和点
 
-        setTimeout(() => {
 
-            this.drawPolygon(); // 画范围
 
-            this.addBluePoints(); // 加蓝色点
 
-        }, 3000);
 
-    }
 
-
 
-    drawPolygon() {
 
-        const polygon = new mars3d.graphic.PolygonEntity({
 
-          positions: [
 
-            [113.6149629, 23.5851594117, 80],
 
-            [113.6142961914, 23.58524871517, 80],
 
-            [113.614396297, 23.585358145, 80],
 
-            [113.614496379, 23.58547545, 80],
 
-          ],
 
-          style: {
 
-            color: "#000000",
 
-            opacity: 0.3,
 
-            outline: true,
 
-            // outlineWidth: 3,
 
-            // outlineColor: "#ffffff",
 
-            outlineStyle: {
 
-              width: 1.5,
 
-              materialType: mars3d.MaterialType.LineBloom,
 
-              materialOptions: {
 
-                color: "#18E0FF",
 
-                glow: 3.0,
 
-                showRatio: -0.5,
 
-                speed: 0
 
-              }
 
-            },
 
-          },
 
-          attr: { remark: "示例1" }
 
-        })
 
-        this.treeGraphicLayer.addGraphic(polygon);
 
-    }
 
-
 
-    // 2️⃣ **添加蓝色点**
 
-    addBluePoints() {
 
-        this.mapPoint = []
 
-        this.pointsData.forEach((point) => {
 
-            let pointEntity = new mars3d.graphic.PointEntity({
 
-                position: Cesium.Cartesian3.fromDegrees(point.lng, point.lat, 100),
 
-                style: {
 
-                    pixelSize: 12,
 
-                    // color: "rgba(24, 224, 255, 0.6)",
 
-                    color: "rgba(24, 224, 255, 0.6)",
 
-                    outline: true,
 
-                    outlineColor: "#fff"
 
-                },
 
-                attr: { id: point.id, fruitType: point.fruitType, age: point.age }
 
-            });
 
-            this.mapPoint.push(pointEntity)
 
-            this.treePointGraphicLayer.addGraphic(pointEntity);
 
-        });
 
-    }
 
-
 
-    // 2️⃣ **根据品种高亮显示**
 
- highlightCategory(selectedCategory) {
 
-    console.log('this.pointsData', this.mapPoint);
 
-    this.mapPoint.forEach((point) => {
 
-      if (point.attr.fruitType === selectedCategory) {
 
-        point.setStyle({ opacity: 1.0, color: "rgba(24, 224, 255, 0.6)" }); // 高亮
 
-      } else {
 
-        point.setStyle({ opacity: 1, color: "rgba(255, 255, 255, 0.8)" }); // 透明
 
-      }
 
-    });
 
-  }
 
-
 
-//   筛选树龄
 
-  // 4️⃣ **更新点位样式**
 
-  highlightAge(selectedFruitType, selectedAge) {
 
-    this.mapPoint.forEach((point) => {
 
-      const { fruitType, age, id } = point.attr;
 
-      
-    //   if (fruitType !== selectedFruitType) {
 
-    //     point.setStyle({ opacity: 0.1 }); // 其他品种点透明
 
-    //   } else {
 
-    //     point.setStyle({ opacity: 1.0 }); // 选中品种显示
 
-  
-    //     if (selectedAge) {
 
-    //       if (selectedAge === age) {
 
-    //         point.setStyle({ color: "rgba(24, 224, 255, 0.6)" }); // 符合树龄的变蓝色
 
-    //       } else {
 
-    //         point.setStyle({ color: "rgba(255, 255, 255, 0.8)" }); // 不符合树龄的变黑色
 
-    //       }
 
-    //     } else {
 
-    //       point.setStyle({ color: "rgba(255, 255, 255, 0.8)" }); // 还原颜色
 
-    //     }
 
-    //   }
 
-
 
-      if (fruitType === selectedFruitType && age === selectedAge) {
 
-        point.setStyle({ color: "rgba(24, 224, 255, 0.6)" }); // 符合树龄的变蓝色
 
-        console.log('ppp', point);
 
-      } else {
 
-        point.setStyle({ color: "rgba(255, 255, 255, 0.8)" }); // 不符合树龄的变黑色
 
-      }
 
-    });
 
-  }
 
-
 
-    // 地图开始移动事件
 
-    cameraMoveStart() {
 
-        let that = this
 
-        this.map.on(mars3d.EventType.cameraMoveStart, () => {
 
-            that.mapNum++
 
-            if (that.mapNum > 1) {
 
-                eventBus.emit('mars3d:cameraMoveStart');
 
-            }
 
-        });
 
-    }
 
-
 
-    //初始化模型
 
-    initModel(coord) {
 
-        //entity方式
 
-        let graphicLayer = new mars3d.layer.GraphicLayer()
 
-        this.map.addLayer(graphicLayer)
 
-        for (let i = 0.001; i < 0.01; i += 0.001) {
 
-            let graphic = new mars3d.graphic.ModelEntity({
 
-                position: [coord[0] + i, coord[1] + i, 70.6],
 
-                clampToGround: true,
 
-                style: {
 
-                    url: '/fengche.gltf',
 
-                    heading: 0,
 
-                    scale: 10,
 
-                    minimumPixelSize: 100,
 
-                },
 
-            })
 
-            graphicLayer.addGraphic(graphic)
 
-        }
 
-
 
-    }
 
-    initInfo() {
 
-        let that = this
 
-        this.map.on(mars3d.EventType.click, (event) => {
 
-            // console.log('customProperties',event.graphic?.attr);
 
-            if (event.graphic?.type === 'polygon') {
 
-                // eventBus.emit('map:clickArea')
 
-                return
 
-            }
 
-            eventBus.emit('mars3d:cameraMoveStart');
 
-            let point = mars3d.LngLatPoint.fromCartesian(event.cartesian); //转为经纬度
 
-            console.log(point)
 
-        });
 
-    }
 
-
 
-
 
-    // 点位
 
-    addGraphicPoint(coord) {
 
-        let graphicLayer = new mars3d.layer.GraphicLayer()
 
-        this.map.addLayer(graphicLayer)
 
-        const graphic = new mars3d.graphic.BillboardEntity({
 
-            position: [coord[0], coord[1], 100],
 
-            style: {
 
-                image: "/lby-point.png",
 
-                scale: 1,
 
-                horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
 
-                verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
 
-                // label: {
 
-                //     text: "果园",
 
-                //     font_size: 18,
 
-                //     color: "#ffffff",
 
-                //     pixelOffsetY: -60,
 
-                //     distanceDisplayCondition: true,
 
-                //     distanceDisplayCondition_far: 500000,
 
-                //     distanceDisplayCondition_near: 0
 
-                // }
 
-            },
 
-            attr: { remark: "示例点击" }
 
-        })
 
-        graphicLayer.addGraphic(graphic)
 
-
 
-
 
-        const graphic2 = new mars3d.graphic.BillboardEntity({
 
-            position: [113.746646, 22.970229, 100],
 
-            style: {
 
-                image: "/point-2.png",
 
-                scale: 1,
 
-                horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
 
-                verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
 
-                label: {
 
-                    text: "果园",
 
-                    font_size: 18,
 
-                    color: "#ffffff",
 
-                    pixelOffsetY: -60,
 
-                    distanceDisplayCondition: true,
 
-                    distanceDisplayCondition_far: 500000,
 
-                    distanceDisplayCondition_near: 0
 
-                }
 
-            },
 
-            attr: { remark: "示例点击" }
 
-        })
 
-        graphicLayer.addGraphic(graphic2)
 
-
 
-        this.bindLayerPopup(graphicLayer)
 
-    }
 
-    // 在图层绑定Popup弹窗
 
-    bindLayerPopup(graphicLayer) {
 
-        graphicLayer.bindPopup(function (event) {
 
-            if (event.graphics?.length > 1) {
 
-                return `您单击了重叠图标，该区域有${event.graphics.length}个对象` // 如果存在坐标完全相同的图标点时
 
-            }
 
-
 
-            const attr = event.graphic.attr || {}
 
-            attr["xxx"] = event.graphic.type
 
-            attr["xxx"] = "绑定的Popup"
 
-            attr["xxxx"] = "xxxxxx"
 
-
 
-            return mars3d.Util.getTemplateHtml({ title: "xxx果园", template: "all", attr })
 
-        }, { useGraphicPostion: true })
 
-    }
 
-    // 添加模型
 
-    addGardenAndTree(coord) {
 
-        // 创建矢量图层
 
-        let graphicLayer = new mars3d.layer.GraphicLayer()
 
-        this.map.addLayer(graphicLayer)
 
-        // 创建并添加gltf模型实体
 
-        // const graphic = new mars3d.graphic.ModelEntity({
 
-        //     name: '示例模型',
 
-        //     position: [coord[0], coord[1], 0], // 模型位置
 
-        //     style: {
 
-        //         url: '/garden.glb', // 模型URL
 
-        //         // scale: 20, // 模型缩放比例
 
-        //         minimumPixelSize: 50, // 模型最小像素尺寸
 
-        //         heading: 90, // 模型朝向
 
-        //         // 其他样式参数...
 
-        //     },
 
-        //     attr: {
 
-        //         remark: '示例1' // 自定义属性
 
-        //     }
 
-        // });
 
-
 
-        // 将模型实体添加到图层中
 
-        // graphicLayer.addGraphic(graphic);
 
-    }
 
-
 
-    // 树🌲
 
-    addDemoGraphic() {
 
-        const graphic = new mars3d.graphic.DivGraphic({
 
-          position: [116.510732, 31.403786, 176.4],
 
-          style: {
 
-            html:`
 
-                <div class="tree-wrap">
 
-                    <img class="photo" src="${require('@/assets/img/home/photo-icon.png')}" alt="">
 
-                    <img class="tree"src="${require('@/assets/img/home/tree-icon.png')}" alt="">
 
-                    <div class="bar">
 
-                        <div class="value"></div>
 
-                    </div>
 
-                    <div class="text-bg">
 
-                        预计还差<span>15</span>天会成熟
 
-                    </div>
 
-                </div>
 
-            `,
 
-            offsetY: 100,
 
-            horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
 
-            verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
 
-            scaleByDistance: new Cesium.NearFarScalar(900, 1,4000, 0.1)
 
-          },
 
-        })
 
-        this.graphicLayer.addGraphic(graphic)
 
-        this.map.camera.flyTo({
 
-            destination: Cesium.Cartesian3.fromDegrees(116.510732, 31.403786, 900),
 
-            duration: 3 // 3秒飞行
 
-        });
 
-
 
-        // 监听 graphic 的点击事件
 
-        graphic.on(mars3d.EventType.click, (event) => {
 
-            const container = graphic._container; // 获取实际的 DOM 容器
 
-            if (container) {
 
-                const textBg = container.querySelector('.photo'); // 获取子元素
 
-                if (textBg) {
 
-                    textBg.addEventListener('click', (event) => {
 
-                        event.stopPropagation(); // 阻止事件冒泡
 
-                        eventBus.emit('map:photo')
 
-                    });
 
-                }
 
-            }
 
-        });
 
-    }
 
-}
 
-
 
-export default FarmMap;

+ 0 - 42
src/views/old_mini/farm/map/map.scss
查看文件 

@@ -1,42 +0,0 @@
 
-.tree-wrap{
 
-    width: 160px;
 
-    display: flex;
 
-    flex-direction: column;
 
-    align-items: center;
 
-    .photo{
 
-        width: 90px;
 
-        height: 80px;
 
-        margin: 0 0 -10px 30px;
 
-    }
 
-    .tree{
 
-        width: 160px;
 
-        height: 153px;
 
-    }
 
-    .bar{
 
-        width: 100%;
 
-        height: 12px;
 
-        background: rgba(255, 255, 255, 0.5);
 
-        border-radius: 20px;
 
-        position: relative;
 
-        .value{
 
-            width: 30%;
 
-            height: 100%;
 
-            border-radius: 20px;
 
-            background: linear-gradient(0deg,#00DBC1,#A2F3FF);
 
-        }
 
-    }
 
-    .text-bg{
 
-        background: url('@/assets/img/home/tree-text-bg.png') no-repeat center center /100% 100%;
 
-        width: 100%;
 
-        height: 25px;
 
-        font-size: 12px;
 
-        color: #fff;
 
-        line-height: 25px;
 
-        margin-top: 10px;
 
-        text-align: center;
 
-        span{
 
-            color: #3CE3D8;
 
-            font-size: 15px;
 
-        }
 
-    }
 
-}

+ 1 - 1
src/views/old_mini/home/components/homeFloatingPanel.vue
查看文件 

@@ -156,7 +156,7 @@ const handleClick = (e) => {
 
     e.preventDefault();
 
     e.preventDefault();
 
 };
 
 };
 
 
 
-const activeTab = ref(1);
 
+const activeTab = ref(0);
 
 const tabs = ref(["农事任务", "农场档案"]);
 
 const tabs = ref(["农事任务", "农场档案"]);
 
 
 
 const handleTabClick = (index) => {
 
 const handleTabClick = (index) => {

+ 1 - 1
src/views/old_mini/home/index.vue
查看文件 

@@ -61,7 +61,7 @@ const weatherExpanded = (isExpandedValue) => {
 
 };
 
 };
 
 
 
 const zIndex = ref(1);
 
 const zIndex = ref(1);
 
-const showAddButton = ref(false);
 
+const showAddButton = ref(true);
 
 const heightChange = (height) => {
 
 const heightChange = (height) => {
 
     zIndex.value = 1;
 
     zIndex.value = 1;
 
     showAddButton.value = true;
 
     showAddButton.value = true;

+ 17 - 12
yarn.lock
查看文件 

@@ -1365,10 +1365,10 @@
 
     read-package-json-fast "^3.0.0"
 
     read-package-json-fast "^3.0.0"
 
     which "^3.0.0"
 
     which "^3.0.0"
 
 
 
-"@parcel/watcher-win32-x64@2.5.1":
 
+"@parcel/watcher-darwin-arm64@2.5.1":
 
   version "2.5.1"
 
   version "2.5.1"
 
-  resolved "https://registry.npmjs.org/@parcel/watcher-win32-x64/-/watcher-win32-x64-2.5.1.tgz"
 
-  integrity sha512-9lHBdJITeNR++EvSQVUcaZoWupyHfXe1jZvGZ06O/5MflPcuPLtEphScIBL+AiCWBO46tDSHzWyD0uDmmZqsgA==
 
+  resolved "https://registry.npmjs.org/@parcel/watcher-darwin-arm64/-/watcher-darwin-arm64-2.5.1.tgz"
 
+  integrity sha512-eAzPv5osDmZyBhou8PoF4i6RQXAfeKL9tjb3QzYuccXFMQU0ruIc/POh30ePnaOyD1UXdlKguHBmsTs53tVoPw==
 
 
 
 "@parcel/watcher@^2.4.1":
 
 "@parcel/watcher@^2.4.1":
 
   version "2.5.1"
 
   version "2.5.1"
 
@@ -6156,6 +6156,11 @@ fs.realpath@^1.0.0:
 
   resolved "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz"
 
   resolved "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz"
 
   integrity sha1-FQStJSMVjKpA20onh8sBQRmU6k8= sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==
 
   integrity sha1-FQStJSMVjKpA20onh8sBQRmU6k8= sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==
 
 
 
+fsevents@~2.3.2:
 
+  version "2.3.3"
 
+  resolved "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz"
 
+  integrity sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==
 
+
 
 function-bind@^1.1.1, function-bind@^1.1.2:
 
 function-bind@^1.1.1, function-bind@^1.1.2:
 
   version "1.1.2"
 
   version "1.1.2"
 
   resolved "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz"
 
   resolved "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz"
 
@@ -9086,13 +9091,13 @@ progress@^2.0.0:
 
   resolved "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz"
 
   resolved "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz"
 
   integrity sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==
 
   integrity sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==
 
 
 
-proj4@^2.8.1:
 
-  version "2.12.1"
 
-  resolved "https://registry.npmjs.org/proj4/-/proj4-2.12.1.tgz"
 
-  integrity sha512-vmhP3hmstjXjzFwg8QXJwpoj4n7GVrXk3ZW3DzNK/Ur4cuwXq7ZiMXaWYvLYLQbX8n4MXgbwTr4lthOUZltBpA==
 
+proj4@^2.19.10, proj4@^2.8.1:
 
+  version "2.19.10"
 
+  resolved "https://registry.npmjs.org/proj4/-/proj4-2.19.10.tgz"
 
+  integrity sha512-uL6/C6kA8+ncJAEDmUeV8PmNJcTlRLDZZa4/87CzRpb8My4p+Ame4LhC4G3H/77z2icVqcu3nNL9h5buSdnY+g==
 
   dependencies:
 
   dependencies:
 
     mgrs "1.0.0"
 
     mgrs "1.0.0"
 
-    wkt-parser "^1.3.3"
 
+    wkt-parser "^1.5.1"
 
 
 
 promise-all-reject-late@^1.0.0:
 
 promise-all-reject-late@^1.0.0:
 
   version "1.0.1"
 
   version "1.0.1"
 
@@ -11118,10 +11123,10 @@ win-release@^1.0.0:
 
   dependencies:
 
   dependencies:
 
     semver "^5.0.1"
 
     semver "^5.0.1"
 
 
 
-wkt-parser@^1.3.3:
 
-  version "1.3.3"
 
-  resolved "https://registry.npmjs.org/wkt-parser/-/wkt-parser-1.3.3.tgz"
 
-  integrity sha512-ZnV3yH8/k58ZPACOXeiHaMuXIiaTk1t0hSUVisbO0t4RjA5wPpUytcxeyiN2h+LZRrmuHIh/1UlrR9e7DHDvTw==
 
+wkt-parser@^1.5.1:
 
+  version "1.5.2"
 
+  resolved "https://registry.npmjs.org/wkt-parser/-/wkt-parser-1.5.2.tgz"
 
+  integrity sha512-1ZUiV1FTwSiSrgWzV9KXJuOF2BVW91KY/mau04BhnmgOdroRQea7Q0s5TVqwGLm0D2tZwObd/tBYXW49sSxp3Q==
 
 
 
 word-wrap@^1.2.3:
 
 word-wrap@^1.2.3:
 
   version "1.2.3"
 
   version "1.2.3"