From a4a8a28ec3247ab35a68dbbc3d9ad8a7f0dcaad2 Mon Sep 17 00:00:00 2001
From: yaoyuhao <yaoyuhao@ydool.com>
Date: Wed, 24 Jul 2024 15:24:39 +0800
Subject: [PATCH] gx

---
 src/view/sy_map.vue | 175 +++++++++++++++++++++++++++-----------------
 1 file changed, 106 insertions(+), 69 deletions(-)

diff --git a/src/view/sy_map.vue b/src/view/sy_map.vue
index 58addc9..4fabb34 100644
--- a/src/view/sy_map.vue
+++ b/src/view/sy_map.vue
@@ -1,16 +1,21 @@
 <template>
   <div class="module">
     <teleport to="body">
-      <div id="map" style="width: 100vw; height: 100vh; "></div>
-      <div class="left" style="width: 517px;">
+      <div id="map" style="width: 100vw; height: 100vh"></div>
+      <div class="left" style="width: 517px">
         <div class="lyx">
           <div class="title">
             <div class="title_name">{{ title_choose }}</div>
             <div class="title_line"></div>
           </div>
           <div class="content">
-            <div class="content_item" v-for="(item, index) in personTotal" :class="{ choose: item.id == choose.person }"
-              @click="changeRs(item.id)" :key="index">
+            <div
+              class="content_item"
+              v-for="(item, index) in personTotal"
+              :class="{ choose: item.id == choose.person }"
+              @click="changeRs(item.id)"
+              :key="index"
+            >
               <div class="content_item_name">{{ item.name }}</div>
               <div class="content_item_value">{{ item.value }}</div>
             </div>
@@ -22,26 +27,39 @@
             <div class="title_line"></div>
           </div>
           <div class="content">
-            <div class="content_item" v-for="(item, index) in tsbqTotal" :class="{ choose: item.id == choose.bq }"
-              @click="changebq(item.id)" :key="index">
+            <div
+              class="content_item"
+              v-for="(item, index) in tsbqTotal"
+              :class="{ choose: item.id == choose.bq }"
+              @click="changebq(item.id)"
+              :key="index"
+            >
               <div class="content_item_name">{{ item.name }}</div>
               <div class="content_item_value">{{ item.value }}</div>
             </div>
           </div>
         </div>
       </div>
-      <div class="right" style="width: 517px;">
+      <div class="right" style="width: 517px">
         <div class="jbggfwq">
           <div class="title">
             <div class="title_name">基本公共服务圈</div>
             <div class="title_line"></div>
           </div>
           <div class="jbggfwq_content">
-            <div class="jbggfwq_content_item" v-for="(item, index) in jbfwqTotal" :key="index">
+            <div
+              class="jbggfwq_content_item"
+              v-for="(item, index) in jbfwqTotal"
+              :key="index"
+            >
               <div class="jbggfwq_content_item_left">{{ item.name }}</div>
               <div class="jbggfwq_content_item_right">
-                <div class="jbggfwq_content_item_right_item" v-for="itemm in item.child"
-                  :class="{ choose: itemm.id == choose.fwq }" @click="changeFwq(itemm.id, itemm.fwqList, itemm.center)">
+                <div
+                  class="jbggfwq_content_item_right_item"
+                  v-for="itemm in item.child"
+                  :class="{ choose: itemm.id == choose.fwq }"
+                  @click="changeFwq(itemm.id, itemm.fwqList, itemm.center)"
+                >
                   {{ itemm.name }}
                 </div>
               </div>
@@ -54,8 +72,13 @@
             <div class="title_line"></div>
           </div>
           <div class="zyys_content">
-            <div class="zyys_content_item" v-for="(item, index) in yaosuTotal"
-              :class="{ choose: item.id == choose.yaosu, wz: item.wz == true }" @click="changeys(item.id)" :key="index">
+            <div
+              class="zyys_content_item"
+              v-for="(item, index) in yaosuTotal"
+              :class="{ choose: item.id == choose.yaosu, wz: item.wz == true }"
+              @click="changeys(item.id)"
+              :key="index"
+            >
               <img :src="item.img" class="zyys_content_item_left" />
               <div class="zyys_content_item_right">{{ item.name }}</div>
             </div>
@@ -63,9 +86,7 @@
         </div>
       </div>
     </teleport>
-
   </div>
-
 </template>
 <script setup>
 import {
@@ -368,9 +389,9 @@ const addPolygonCounty = () => {
         console.log(item.name);
         let jdCenter = [];
         if (item.name == "溪口镇") {
-          title_choose.value = '龙游县'
-          title_choose.value = title_choose.value + `>${item.name}`;
-          console.log(title_choose.value);
+          if (!title_choose.value.includes("溪口镇")) {
+            title_choose.value = title_choose.value + `>${polygon.name}`;
+          }
           loadCs();
           addPolygonCountyCs();
           mapTownCount.map((item) => {
@@ -378,7 +399,15 @@ const addPolygonCounty = () => {
               jdCenter = item.center;
             }
           });
-          goMapCenter(jdCenter, 14);
+          addCs();
+          goMapCenter(jdCenter, 13);
+        } else {
+          cs_qk_arr.value.forEach((item, index) => {
+            map.removeOverlay(cs_qk_arr.value[index]);
+          });
+          cs_name_arr.value.forEach((item, index) => {
+            map.removeOverlay(cs_name_arr.value[index]);
+          });
         }
       });
     }
@@ -471,32 +500,32 @@ const createCustomOverlayJd = (polygon, indexx) => {
     div.appendChild(title);
     title.appendChild(document.createTextNode(this.properties.title));
     content.appendChild(div);
-    div.onclick = function () {
-      let jdCenter = [];
-      if (polygon.name == "溪口镇") {
-        if (!title_choose.value.includes("溪口镇")) {
-          title_choose.value = title_choose.value + `>${polygon.name}`;
-        }
-        chooseArr.value.push("jd_noNumber");
-        loadCs();
-        addPolygonCountyCs();
-        mapTownCount.map((item) => {
-          if (item.name == "溪口镇") {
-            jdCenter = item.center;
-          }
-        });
-        center_now.value = jdCenter;
-        addCs();
-        goMapCenter(jdCenter, 14);
-      }else{
-        cs_qk_arr.value.forEach((item,index) => {
-          map.removeOverlay(cs_qk_arr.value[index]);
-        });
-          cs_name_arr.value.forEach((item,index) => {
-          map.removeOverlay(cs_name_arr.value[index]);
-        });
-      }
-    };
+    // div.onclick = function () {
+    //   let jdCenter = [];
+    //   if (polygon.name == "溪口镇") {
+    //     if (!title_choose.value.includes("溪口镇")) {
+    //       title_choose.value = title_choose.value + `>${polygon.name}`;
+    //     }
+    //     chooseArr.value.push("jd_noNumber");
+    //     loadCs();
+    //     addPolygonCountyCs();
+    //     mapTownCount.map((item) => {
+    //       if (item.name == "溪口镇") {
+    //         jdCenter = item.center;
+    //       }
+    //     });
+    //     center_now.value = jdCenter;
+    //     addCs();
+    //     goMapCenter(jdCenter, 14);
+    //   } else {
+    //     cs_qk_arr.value.forEach((item, index) => {
+    //       map.removeOverlay(cs_qk_arr.value[index]);
+    //     });
+    //     cs_name_arr.value.forEach((item, index) => {
+    //       map.removeOverlay(cs_name_arr.value[index]);
+    //     });
+    //   }
+    // };
     return content;
   }
   jdm_arr.value[indexx] = new BMapGL.CustomOverlay(createLabelDOM, {
@@ -544,21 +573,21 @@ const createCustomOverlayJd2 = (polygon, indexx) => {
     div.appendChild(number);
     number.appendChild(document.createTextNode(this.properties.number));
     content.appendChild(div);
-    div.onclick = function () {
-      let jdCenter = [];
-      if (polygon.name == "溪口镇") {
-        title_choose.value = title_choose.value + `>${polygon.name}`;
-        loadCs();
-        addPolygonCountyCs();
-        mapTownCount.map((item) => {
-          if (item.name == "溪口镇") {
-            jdCenter = item.center;
-          }
-        });
-        addCs2();
-        goMapCenter(jdCenter, 14);
-      }
-    };
+    // div.onclick = function () {
+    //   let jdCenter = [];
+    //   if (polygon.name == "溪口镇") {
+    //     title_choose.value = title_choose.value + `>${polygon.name}`;
+    //     loadCs();
+    //     addPolygonCountyCs();
+    //     mapTownCount.map((item) => {
+    //       if (item.name == "溪口镇") {
+    //         jdCenter = item.center;
+    //       }
+    //     });
+    //     addCs2();
+    //     goMapCenter(jdCenter, 14);
+    //   }
+    // };
     return content;
   }
   jdm_number_arr.value[indexx] = new BMapGL.CustomOverlay(createLabelDOM, {
@@ -603,7 +632,7 @@ const createCs2 = (polygon, indexx) => {
     div.style.alignItems = "center";
     div.style.cursor = "pointer";
     div.style.padding = "5px";
-    div.style.minWidth = "100px";
+    div.style.minWidth = "90px";
     div.style.background = `url(${xcbg}) no-repeat 0/100% 100%`;
     div.style.transform = "translateY(50px)";
     div.setAttribute("name", this.properties.title);
@@ -619,7 +648,7 @@ const createCs2 = (polygon, indexx) => {
     var number = document.createElement("div");
     number.style.fontSize = "10px";
     number.style.fontWeight = "600";
-    number.style.color = "rgba(0, 255, 189, 1)";
+    number.style.color = "black";
     div.appendChild(number);
     number.appendChild(document.createTextNode(this.properties.number));
     content.appendChild(div);
@@ -1638,13 +1667,17 @@ onMounted(() => {
   bottom: 0;
   width: 520px;
   height: 960px;
-  background: linear-gradient(270deg,
+  background: linear-gradient(
+      270deg,
       rgba(0, 52, 131, 0.69) 0%,
       rgba(0, 32, 83, 0.77) 50%,
-      rgba(0, 60, 131, 0.74) 100%),
-    radial-gradient(128% 99% at 100% 46%,
+      rgba(0, 60, 131, 0.74) 100%
+    ),
+    radial-gradient(
+      128% 99% at 100% 46%,
       rgba(0, 48, 125, 0.29) 0%,
-      rgba(0, 61, 134, 0.42) 100%);
+      rgba(0, 61, 134, 0.42) 100%
+    );
   box-shadow: inset 0px 0px 56px 0px rgba(173, 221, 255, 0.5);
   backdrop-filter: blur(3px);
   padding: 30px 26px;
@@ -1802,13 +1835,17 @@ onMounted(() => {
   bottom: 0;
   width: 520px;
   height: 960px;
-  background: linear-gradient(270deg,
+  background: linear-gradient(
+      270deg,
       rgba(0, 52, 131, 0.69) 0%,
       rgba(0, 32, 83, 0.77) 50%,
-      rgba(0, 60, 131, 0.74) 100%),
-    radial-gradient(128% 99% at 100% 46%,
+      rgba(0, 60, 131, 0.74) 100%
+    ),
+    radial-gradient(
+      128% 99% at 100% 46%,
       rgba(0, 48, 125, 0.29) 0%,
-      rgba(0, 61, 134, 0.42) 100%);
+      rgba(0, 61, 134, 0.42) 100%
+    );
   box-shadow: inset 0px 0px 56px 0px rgba(173, 221, 255, 0.5);
   backdrop-filter: blur(3px);
   padding: 30px 26px;