6/24 统一地图组件入口，规范地图方法，属性。 完成天地图和高德切换

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

@@ -5,7 +5,7 @@
       <div class="title">
         <div>基本信息</div>
       </div>
-      <div class="bodybox">
+      <div class="bodyBox">
         <el-form ref="formRef" :model="form" :rules="rules" label-width="120px" label-position="right">
           <el-form-item label="巡检计划名称" prop="planName">
             <el-input v-model="form.planName" placeholder="请输入"></el-input>
@@ -22,7 +22,7 @@
                 v-for="(item, index) in 7"
                 :key="index"
               >
-                <div class="iconbox">
+                <div class="iconBox">
                   <el-icon v-show="checkoutWeek.includes(item)"><Check /></el-icon>
                 </div>
                 <span class="ml-5px">{{ numToWeek(item) }}</span>
@@ -64,7 +64,7 @@
             <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>
-            <GD ref="GDef" :disabled="true"></GD>
+            <MapWrapper :disabled="true" ref="MapWrapperRef"></MapWrapper>
           </el-form-item>
           <el-form-item>
             <el-button type="primary" @click="submit">提交</el-button>
@@ -83,7 +83,9 @@ import { numToWeek } from '@/utils/time';
 import { ref } from 'vue';
 import { addPlan, getPlan, updatePlan } from '@/api/system/InspectionPlan';
 import { Check } from '@element-plus/icons-vue';
-import GD from '@/components/Map/GD.vue';
+import MapWrapper from '@/components/Map/index.vue';
+import { PointVO } from '@/api/system/InspectionPoint/type';
+import { LngLat } from '@/components/Map/type';
 
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const { com_inspection_remind_tiime } = toRefs<any>(proxy?.useDict('com_inspection_remind_tiime'));
@@ -123,7 +125,7 @@ function checkoutWeekFun(val: number) {
 // 提醒时间
 
 // 巡检计划id
-const editid = ref(null);
+const editId = ref(null);
 
 // 初始化
 // 路线列表
@@ -132,8 +134,8 @@ async function init() {
   const res = await listRoute();
   playlist.value = res.rows;
   if (route.query.id) {
-    editid.value = route.query.id;
-    getPlan(editid.value).then((res) => {
+    editId.value = route.query.id;
+    getPlan(editId.value).then((res) => {
       form.value = {
         id: res.data.id,
         planName: res.data.planName, // 巡检计划名称
@@ -176,21 +178,21 @@ function outback() {
   router.back();
 }
 
-const GDef = ref(null);
+const MapWrapperRef = ref<InstanceType<typeof MapWrapper>>();
 
 function handleChangeMap(val: string) {
   if (val) {
-    GDef.value.clearMapMarker();
+    MapWrapperRef.value.clearMapMarker();
     const find = playlist.value.find((item) => item.id === val);
     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);
+      find.points.forEach((item: PointVO) => {
+        const angular = item.location.split(',').map(Number).filter(Boolean) as LngLat;
+        MapWrapperRef.value.addMarker_more(angular, item.pointName, item.id);
       });
     }
     // 巡检路线
     if (find.pathPoints) {
-      GDef.value.renderSavedPath(find.pathPoints);
+      MapWrapperRef.value.renderSavedPath(find.pathPoints);
     }
   }
 }
@@ -208,7 +210,7 @@ function submit() {
 
   formRef.value?.validate(async (valid: boolean) => {
     if (valid) {
-      if (editid.value) {
+      if (editId.value) {
         updatePlan(form.value).then(() => {
           ElMessage.success('编辑成功');
           outback();
@@ -229,7 +231,7 @@ function submit() {
   margin-top: 20px;
   padding: 30px;
   background-color: white;
-  .bodybox {
+  .bodyBox {
     width: 600px;
     margin: 20px auto 0;
   }
@@ -264,7 +266,7 @@ function submit() {
           color: #44a0ff;
         }
       }
-      .deleteaction {
+      .deleteAction {
         margin-left: 10px;
         cursor: pointer;
         &:hover {
@@ -284,7 +286,7 @@ function submit() {
     color: #000;
     display: flex;
     align-items: center;
-    .iconbox {
+    .iconBox {
       width: 30px;
       height: 30px;
       margin-left: 5px;