6/23 更改高德地图组件，统一入口

src/views/system/inspection/Plan/addInspectionPlan.vue

@@ -61,10 +61,10 @@
             </el-select>
           </el-form-item>
           <el-form-item label="计划路线">
-            <el-select @change="handlChangeMap" v-model="form.routeIds" placeholder="请选择" style="width: 100%">
+            <el-select @change="handleChangeMap" v-model="form.routeIds" placeholder="请选择" style="width: 100%">
               <el-option v-for="item in playlist" :key="item.value" :label="item.routeName" :value="item.id" />
             </el-select>
-            <div class="mapbox" id="PlanMapBox"></div>
+            <GD ref="GDef" :disabled="true"></GD>
           </el-form-item>
           <el-form-item>
             <el-button type="primary" @click="submit">提交</el-button>
@@ -81,9 +81,10 @@ import { listRoute } from '@/api/system/InspectionRoute';
 import PageHeader from '@/components/Pageheader/index.vue';
 import { numToWeek } from '@/utils/time';
 import { ref } from 'vue';
-import AMapLoader from '@amap/amap-jsapi-loader';
 import { addPlan, getPlan, updatePlan } from '@/api/system/InspectionPlan';
 import { Check } from '@element-plus/icons-vue';
+import GD from '@/components/Map/GD.vue';
+
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const { com_inspection_remind_tiime } = toRefs<any>(proxy?.useDict('com_inspection_remind_tiime'));
 
@@ -165,88 +166,37 @@ async function init() {
         taskTime.value = [['', '']];
       }
 
-      handlChangeMap(res.data.routeIds);
+      handleChangeMap(res.data.routeIds);
     });
   }
 }
 
-init();
-
 // 返回
 function outback() {
   router.back();
 }
 
-const AMapLib = ref(null);
-const map = ref(null);
-const mapReady = ref(false);
+const GDef = ref(null);
 
-const markerlist = [];
-function handlChangeMap(val: string) {
-  map.value.remove(markerlist);
+function handleChangeMap(val: string) {
   if (val) {
+    GDef.value.clearMapMarker();
     const find = playlist.value.find((item) => item.id === val);
-    if (find) {
-      if (find.points && find.points.length > 0) {
-        find.points.forEach((item: { location: string; pointName: any }, index: number) => {
-          const angular = item.location.split(',').map(Number);
-          const marker = new AMapLib.value.Marker({
-            position: new AMapLib.value.LngLat(angular[0], angular[1]), //经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
-            title: item.pointName,
-            content: `
-    <div style="display:flex;align-items:center;justify-content:center;width:30px;height:30px;line-height:18px;border-radius:50%;background-color:rgba(26,117,255,0.3);">
-      <div
-        style=" width: 20px;
-          border-radius: 50%;
-          height: 20px;
-          line-height: 20px;
-          background-color: rgba(26,117,255,1);
-          color: #ffffff;
-          font-size: 20px;
-          text-align: center;"
-      >${index + 1}</div>
-    </div>`
-          });
-          //将创建的点标记添加到已有的地图实例：
-          map.value.add(marker);
-          markerlist.push(marker);
-        });
-      }
-      if (find.pathPoints && typeof find.pathPoints === 'string') {
-        const path = JSON.parse(find.pathPoints);
-        //创建 Polyline 实例
-        const polyline = new AMapLib.value.Polyline({
-          path: path,
-          strokeWeight: 2, //线条宽度
-          strokeColor: 'red', //线条颜色
-          lineJoin: 'round' //折线拐点连接处样式
-        });
-        map.value.add(polyline);
-        markerlist.push(polyline);
-      }
-      map.value.setFitView();
+    if (find.points && find.points.length > 0) {
+      find.points.forEach((item) => {
+        const angular = item.location.split(',').map(Number).filter(Boolean);
+        GDef.value.addMarker_more(angular, item.pointNames, item.id);
+      });
+    }
+    // 巡检路线
+    if (find.pathPoints) {
+      GDef.value.renderSavedPath(find.pathPoints);
     }
   }
 }
-const autoloader = import.meta.env.VITE_GCJ02_KEY_GD;
-const VITE_GCJ02_JS_CODE_GD = import.meta.env.VITE_GCJ02_JS_CODE_GD;
 
-onMounted(async () => {
-  await nextTick();
-  window._AMapSecurityConfig = { securityJsCode: VITE_GCJ02_JS_CODE_GD };
-  AMapLoader.load({
-    key: autoloader,
-    version: '2.0',
-    plugins: ['AMap.Scale', 'AMap.Marker']
-  }).then(async (AMap) => {
-    AMapLib.value = AMap;
-    map.value = new AMap.Map('PlanMapBox', {
-      viewMode: '3D',
-      zoom: 11,
-      center: [116.397428, 39.90923]
-    });
-    mapReady.value = true;
-  });
+onMounted(() => {
+  init();
 });
 const formRef = ref();
 function submit() {