feat:添加地图点位列表和品种列表接口

src/api/modules/ownership.js

@@ -1,20 +0,0 @@
-const config = require("../config")
-
-module.exports = {
-    list: {
-        url: config.base_url + "plugin_ownership/list/{gardenId}",
-        type: "get",
-    },
-    save: {
-        url: config.base_url + "plugin_ownership/save",
-        type: "post",
-    },
-    get: {
-        url: config.base_url + "plugin_ownership/get",
-        type: "get",
-    },
-    delete: {
-        url: config.base_url + "plugin_ownership/delete",
-        type: "get",
-    },
-}

src/api/modules/variety.js

@@ -0,0 +1,12 @@
+const config = require("../config")
+
+module.exports = {
+    speciesItemList: {
+        url: config.base_url + "lz_sample/speciesItemList",
+        type: "get",
+    },
+    pointList: {
+        url: config.base_url + "lz_sample/list",
+        type: "post",
+    }
+}

src/components/fnHeader.vue

@@ -36,7 +36,7 @@
 <script setup>
 import { onMounted, onUnmounted, ref } from "vue";
 import { useRouter } from "vue-router";
-import { convertPointToString } from "@/utils/index";
+import { convertPointToArray } from "@/utils/index";
 import eventBus from "@/api/eventBus";
 
 const router = useRouter();
@@ -97,7 +97,7 @@ function formatTimeToHHmmss(date) {
 const options = ref([]);
 const userInfo = JSON.parse(sessionStorage.getItem("userinfo"));
 const getGardenList = () => {
-    const location = convertPointToString(userInfo.location);
+    const location = convertPointToArray(userInfo.location);
     const params = {
         userId: userInfo.userId,
         show3dFarm: true,

src/components/navigation.vue

@@ -45,11 +45,13 @@ function gardenOrganId(farmId){
         options.value = res.data
         areaId.value = res.data[0].id
         eventBus.emit('area:id',{areaId:areaId.value,farmId})
+        sessionStorage.setItem('regionId',areaId.value)
     })
 }
 
 const changeSelect = (e) =>{
     eventBus.emit('area:id',{areaId:areaId.value,farmId:organId.value})
+    sessionStorage.setItem('regionId',e)
 }
 
 onMounted(()=>{

src/utils/index.js

@@ -185,7 +185,7 @@ export function parseMultiPolygon(multipolygonStr,type="MULTIPOLYGON") {
 }
 
 //POINT (113.61702297075017 23.584863449735067) 转换为 113.61702297075017,23.584863449735067 方法
-export function convertPointToString(pointString) {
+export function convertPointToArray(pointString) {
     // 去除字符串两端的空格（如果有的话）
     pointString = pointString.trim();
    
@@ -198,7 +198,7 @@ export function convertPointToString(pointString) {
       const latitude = match[2];
    
       // 将它们用逗号连接起来并返回
-      return `${longitude},${latitude}`;
+      return [longitude,latitude];
     } else {
       // 如果没有匹配到，返回原始字符串或抛出错误（根据需要）
       return pointString; // 或者 throw new Error('Invalid point string format');

src/views/home/index.vue

@@ -47,7 +47,7 @@
         <div class="list">
           <chart-box name="农事列表" arrow="arrow-left" :class="{'list-wrap': rightIndex===0}">
             <template v-if="rightIndex===0">
-              <!-- <album></album> -->
+              <album></album>
               <!-- <img class="tabs" src="@/assets/images/home/ns-tabs.png" alt="">
               <div class="img-box">
                 <img @click="handleAct(item)" v-for="item in 2" :key="item" :src="require(`@/assets/images/home/0${act<=2&&act==item?item+'-act':item}.png`)" alt="">

src/views/home/map/blueRegionLayer.js

@@ -29,7 +29,7 @@ class BlueRegionLayer {
                 feature.setStyle(this.vectorStyle.getPolygonStyle(item.color+opacity, strokeColor, 1));
                 this.blueRegionLayer.addFeature(feature);
             }
-            this.kmap.fit(this.blueRegionLayer.source.getExtent(), [200, 200, 200, 200]);
+            this.kmap.fit(this.blueRegionLayer.source.getExtent(), {padding:[100,100,100,100]});
         }
     }
 }

src/views/varietyMap/index.vue

@@ -9,7 +9,7 @@
                 </div>
                 <chart-box class="left-cont" name="品种列表" color="yellow">
                     <div class="box">
-                        <div class="add-cont">
+                        <div class="add-cont" v-if="baseData.length===0">
                             <div>暂无数据</div>
                             <div class="tips-text">请先添加品种，再框选右侧区域，进行品种确权</div>
                             <div class="button" @click="handleAdd">
@@ -17,6 +17,16 @@
                                 添加品种
                             </div>
                         </div>
+                        <template v-else>
+                            <div class="box-item" v-for="item in baseData" :key="item.speciesItemId">
+                                <div>{{item.speciesItemName}}</div>
+                                <span>{{item.sampleCount}}颗</span>
+                            </div>
+                            <div class="button" @click="handleAdd">
+                                <el-icon class="icon"><Plus /></el-icon>
+                                添加品种
+                            </div>
+                        </template>
                     </div>
                 </chart-box>
             </div>
@@ -100,8 +110,15 @@ const handleClear = () =>{
     eventBus.emit('handle:clear')
 }
 
+const baseData = ref([])
 const getList = () => {
-    console.log("000");
+    const params = {
+        farmId:sessionStorage.getItem('farmId'),
+        regionId:sessionStorage.getItem('regionId')
+    }
+    VE_API.variety.speciesItemList(params).then(res =>{
+        baseData.value = res.data || []
+    })
 };
 
 const checkedCities = ref(["0"]);
@@ -180,6 +197,27 @@ const handleClose = () => {
                     padding: 16px 12px;
                     box-sizing: border-box;
                     overflow-y: auto;
+                    display: flex;
+                    flex-direction: column;
+                    align-items: center;
+                    .button {
+                        color: #ffd489;
+                        display: flex;
+                        align-items: center;
+                        justify-content: center;
+                        border-radius: 8px;
+                        border: 1px solid #ffd489;
+                        padding: 8px 16px;
+                        background: rgba(255, 212, 137, 0.1);
+                        margin-top: 24px;
+                        width: 120px;
+                        font-size: 16px;
+                        box-sizing: border-box;
+                        cursor: pointer;
+                        .icon {
+                            margin-right: 4px;
+                        }
+                    }
                     .add-cont {
                         display: flex;
                         flex-direction: column;
@@ -190,20 +228,22 @@ const handleClose = () => {
                             text-align: center;
                             color: #9f9f9f;
                             font-size: 15px;
-                            margin: 8px 0 24px 0;
+                            margin-top: 8px;
                         }
-                        .button {
-                            color: #ffd489;
-                            display: flex;
-                            align-items: center;
-                            border-radius: 8px;
-                            border: 1px solid #ffd489;
-                            padding: 8px 16px;
-                            background: rgba(255, 212, 137, 0.1);
-                            cursor: pointer;
-                            .icon {
-                                margin-right: 4px;
-                            }
+                    }
+                    .box-item{
+                        width: 94%;
+                        display: flex;
+                        align-items: center;
+                        justify-content: space-between;
+                        border-radius: 5px;
+                        border: 1px solid #666666;
+                        padding: 12px;
+                        div{
+                            font-size: 18px;
+                        }
+                        span{
+                            color: #9f9f9f;
                         }
                     }
                 }

src/views/varietyMap/map.vue

@@ -6,14 +6,13 @@
 import { ref, onMounted, onUnmounted } from "vue";
 import AMapLoader from "@amap/amap-jsapi-loader";
 import eventBus from "@/api/eventBus";
+import { convertPointToArray } from "@/utils/index";
 
 const map = ref(null);
 const mouseTool = ref(null);
 const selectedArea = ref(null);
 const selectedPoints = ref([]);
-const allPoints = ref([
-    { lng: 113.61448114737868, lat: 23.585550924763083 }, // 示例点位
-]);
+const allPoints = ref([]);
 const defalutIcon = ref(null)
 const activeIcon = ref(null)
 
@@ -30,8 +29,8 @@ const initMap = async () => {
         }).then((AMap) => {
             // 创建地图实例
             map.value = new AMap.Map("map-container", {
-                zoom: 17, // 初始缩放级别
-                center: [113.61448114737868 ,23.585550924763083],
+                zoom: 18, // 初始缩放级别
+                center: [113.6149629 ,23.58594117],
                 layers: [
                     // 卫星
                     new AMap.TileLayer.Satellite(),
@@ -60,11 +59,12 @@ const initMap = async () => {
             // 添加示例点位
             allPoints.value.forEach((point) => {
                 point.icon = new AMap.Marker({
-                    position: [point.lng, point.lat],
+                    position: point.lngLat,
                     map: map.value,
                     icon:defalutIcon.value,
-                    offset: defalutOffset.value
+                    offset: defalutOffset.value,
                 });
+                point.type = 'defalutIcon'
             });
             startRectangleSelection()
 
@@ -104,6 +104,7 @@ const clearSelection = () => {
         selectedPoints.value.forEach(item =>{
           item.icon.setIcon(defalutIcon.value)
           item.icon.setOffset(defalutOffset.value)
+          item.type = 'defalutIcon'
         })
         selectedPoints.value = []; // 清空选中的点位
     }
@@ -115,18 +116,42 @@ const checkPointsInArea = () => {
 
     const bounds = selectedArea.value.getBounds(); // 获取框选区域的边界
     selectedPoints.value = allPoints.value.filter((point) => {
-        return bounds.contains([point.lng, point.lat]); // 判断点位是否在框选区域内
+        return bounds.contains(point.lngLat); // 判断点位是否在框选区域内
     });
     selectedPoints.value.forEach(item =>{
-      item.icon.setIcon(activeIcon.value)
-      item.icon.setOffset(activeOffset.value)
+        if(item.type==='defalutIcon'){
+            item.icon.setIcon(activeIcon.value)
+            item.icon.setOffset(activeOffset.value)
+            item.type = 'activeIcon'
+        }else{
+            item.icon.setIcon(defalutIcon.value)
+            item.icon.setOffset(defalutOffset.value)
+            item.type = 'defalutIcon'
+        }
     })
-    eventBus.emit('map:list',selectedPoints.value)
+    const arr = selectedPoints.value.filter(item =>item.type==='activeIcon')
+    eventBus.emit('map:list',arr)
 };
 
+const getList = () =>{
+    const params = {
+        farmId:sessionStorage.getItem('farmId'),
+        regionId:sessionStorage.getItem('regionId')
+    }
+    VE_API.variety.pointList(params).then(res =>{
+        allPoints.value = res.data.map(item =>{
+            return{
+                ...item,
+                lngLat:convertPointToArray(item.point)
+            }
+        })
+        initMap();
+    })
+}
+
 // 组件挂载时初始化地图
 onMounted(() => {
-    initMap();
+    getList()
     eventBus.on('handle:clear',clearSelection)
 });