src/view/sy_map.vue

@@ -154,9 +154,9 @@
           </div>
         </div>
       </div>
-      <div class="btns" v-if="showEdit">
+      <div class="btns">
         <div class="btnopen" @click="openEdit">编辑</div>
-        <div class="btnsave" @click="saveEdit">保存</div>
+        <div class="btnsave">保存</div>
         <div class="btnclose" @click="closeEdit">取消</div>
       </div>
 
@@ -230,7 +230,7 @@ import http from "@/utils/request.js";
 import mapTown from "@/assets/json/ly.json";
 import { VideoCamera } from "@element-plus/icons-vue";
 // import xkz from "@/assets/json/xkz.json";
-// import cssj from "@/assets/json/cssj.json";
+import cssj from "@/assets/json/cssj.json";
 import j0 from "@/assets/images/map/j0.png";
 import j1 from "@/assets/images/map/j1.png";
 import j2 from "@/assets/images/map/j2.png";
@@ -281,11 +281,7 @@ const cs_un_choose_arr = ref([]); //单点社区其他区块(灰色)
 const cs_dd_arr = ref([]); //单点社区名
 //存放村社区块
 const csqk = ref({});
-var cssj;
+// var cssj
-//存放村社id用于编辑
-const changeCsqkId = ref("");
-//用于显示编辑栏
-const showEdit = ref(false);
 //头部标题
 const title_choose = ref("");
 const title_jd = ref("");
@@ -808,8 +804,8 @@ const initMap = () => {
   //添加街道名
   addJd();
 };
-const getCssj = async () => {
+const getCssj = () => {
-  await http
+  http
     .get("/api/ggfwyth/regionalDivision/getCsRegionalDivision")
     .then((res) => {
       if (res.code == 200) {
@@ -817,84 +813,42 @@ const getCssj = async () => {
       }
     });
 };
-//存放编辑的地块数据
+
 var arrJWD = [[[]]];
+var arr1;
+var iii;
 //百度bd09墨卡托坐标转换百度bd09经纬度坐标
-const bd09 = (x, y) => {
+const bd09 = async (x, y, index) => {
+  iii=index;
   var ggPoint = new BMapGL.Point(x, y);
   var pointArr = [];
   pointArr.push(ggPoint);
   var convertor = new BMapGL.Convertor();
   convertor.translate(pointArr, COORDINATES_BD09_MC, COORDINATES_BD09, (e) => {
-    let arr1 = [];
+    arr1 = [];
     arr1.push(e.points[0].lng);
     arr1.push(e.points[0].lat);
     console.log("arr1", arr1);
+    arr1.push(iii);
     arrJWD[0][0].push(arr1);
   });
 };
+
 //开启编辑
 const openEdit = () => {
-  arrJWD = [[[]]];
   cs_choose_arr.value[0].enableEditing();
   console.log(cs_choose_arr.value[0]);
 };
 
-//保存编辑
+//关闭编辑
-const saveEdit = async () => {
+const closeEdit = () => {
   cs_choose_arr.value[0].disableEditing();
   console.log(cs_choose_arr.value[0]);
-  for (const item of cs_choose_arr.value[0].points) {
+  cs_choose_arr.value[0].points.forEach((item, index) => {
-    if (item?.latLng) {
+    bd09(item.lng, item.lat, index);
-      let arr1 = [];
+  });
-      arr1.push(item?.latLng.lng);
-      arr1.push(item?.latLng.lat);
-      arrJWD[0][0].push(arr1);
-    } else {
-      bd09(item.lng, item.lat);
-      //延迟0.1秒，保证convertor.translate执行完
-      await new Promise((resolve) => setTimeout(resolve, 100));
-    }
-  }
   console.log("arrJWD", arrJWD);
-  saveDK();
 };
-//取消编辑
-const closeEdit = async () => {
-  cs_choose_arr.value[0].disableEditing();
-  cs_choose_arr.value.forEach((item, index) => {
-    map.removeOverlay(cs_choose_arr.value[index]);
-  });
-  addCsChoose();
-  showEdit.value = false;
-};
-//上传编辑的地块
-const saveDK = async () => {
-  await http
-    .post(
-      `/api/ggfwyth/regionalDivision/addCsManagerRegionalDivision?id=${
-        changeCsqkId.value
-      }&data=${JSON.stringify(arrJWD)}`
-    )
-    .then((res) => {
-      if (res.code == 200) {
-        ElMessage.success("编辑成功");
-      }
-    });
-  await getCssj();
-  await loadCs(cfJd.value);
-  cs_choose_arr.value.forEach((item, index) => {
-    map.removeOverlay(cs_choose_arr.value[index]);
-  });
-  chooseCsList.value.length = 0;
-  xkzDk.forEach((itemm, indexx) => {
-    if (itemm.name == cfCs.value) {
-      chooseCsList.value.push(itemm);
-      addCsChoose();
-    }
-  });
-};
-
 //点击龙游县初始化
 const csh = () => {
   clear();
@@ -2567,7 +2521,7 @@ const createCustomOverlayJd2 = (polygon, indexx) => {
 //------------------------------
 //---------村社级别------------
 //加载村社信息
-const loadCs = async (name) => {
+const loadCs = (name) => {
   xkzCenter.length = 0;
   xkzDk.length = 0;
   cssj.forEach((item, index) => {
@@ -2580,24 +2534,20 @@ const loadCs = async (name) => {
       for (let w in v.geometry.coordinates) {
         if (v.geometry.coordinates[w][0].length < 60) continue;
         xkzDk.push({
-          id: v.id,
           name: v.properties.name,
           point: v.geometry.coordinates[w],
         });
       }
       xkzCenter.push({
-        id: v.id,
         name: v.properties.name,
         center: v.properties.center,
       });
     } else {
       xkzDk.push({
-        id: v.id,
         name: v.properties.name,
         point: v.geometry.coordinates[0],
       });
       xkzCenter.push({
-        id: v.id,
         name: v.properties.name,
         center: v.properties.center,
       });
@@ -2699,6 +2649,18 @@ const addCsChoose = () => {
         zIndex: 99,
       });
       map.addOverlay(cs_choose_arr.value[index]);
+      cs_choose_arr.value[index].addEventListener("click", (e) => {
+        console.log(4444444444, e);
+
+        // e.overlay 可能包含了你点击的面
+        if (e.overlay && e.overlay.type === "Polygon") {
+          var vertices = e.overlay.getPath(); // 获取面的所有顶点
+          var coordinates = vertices.map(function (point) {
+            return { lng: point.lng, lat: point.lat };
+          });
+          console.log(coordinates); // 打印所有坐标
+        }
+      });
     }
   });
 };
@@ -2974,11 +2936,6 @@ const DGcreateCs = (polygon, indexx) => {
     },
   });
   map.addOverlay(cs_dd_arr.value[indexx]);
-  cs_dd_arr.value[indexx].addEventListener("click", () => {
-    console.log(polygon.id);
-    changeCsqkId.value = polygon.id;
-    showEdit.value = !showEdit.value;
-  });
 };
 //添加单个村社(+数量)
 const DGcreateCs2 = (polygon, indexx) => {
@@ -3099,7 +3056,7 @@ onMounted(async () => {
   getData();
   BMAP();
   getFwq();
-  getCssj();
+  // getCssj();
   await getDataBq();
   loadingss.value = false;
 });
@@ -3671,8 +3628,8 @@ onMounted(async () => {
   z-index: 999;
   position: absolute;
   color: #ffffff;
-  top: 15%;
+  top: 120px;
-  right: 30%;
+  left: 600px;
   display: flex;
   cursor: pointer;
   .btnopen {