定点分析调整

src/assets/styles/variables.module.scss

@@ -20,7 +20,9 @@
   --bpmn-panel-bar-background-color: #f5f7fa;
 
   // ele
-  --brder-color: #e8e8e8
+  --brder-color: #e8e8e8;
+
+  --el-menu-icon-width: 16px !important;
 }
 html.dark {
   --menuBg: #304156;

src/layout/components/Sidebar/SidebarItem.vue

@@ -134,17 +134,17 @@ const getIconClass = (item) => {
   }
 }
 
-.nest-menu .el-sub-menu__title .menu-title {
+.nest-menu .menu-title {
   margin-left: 10px;
 }
-.nest-menu .el-menu-item .menu-title {
-  margin-left: 10px;
 
-}
-.nest-menu .nest-menu .el-menu-item .menu-title {
+.nest-menu .nest-menu .menu-title {
   margin-left: 3px;
 }
 
+.nest-menu .nest-menu .nest-menu .menu-title {
+  margin-left: -3px;
+}
 
 .is-opened {
   :deep(.el-sub-menu__title) {

src/types/components.d.ts

@@ -28,6 +28,8 @@ declare module 'vue' {
     ElBadge: typeof import('element-plus/es')['ElBadge']
     ElButton: typeof import('element-plus/es')['ElButton']
     ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
+    ElCheckboxButton: typeof import('element-plus/es')['ElCheckboxButton']
+    ElCheckboxGroup: typeof import('element-plus/es')['ElCheckboxGroup']
     ElCol: typeof import('element-plus/es')['ElCol']
     ElColorPicker: typeof import('element-plus/es')['ElColorPicker']
     ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
@@ -44,23 +46,34 @@ declare module 'vue' {
     ElIcon: typeof import('element-plus/es')['ElIcon']
     ElImage: typeof import('element-plus/es')['ElImage']
     ElInput: typeof import('element-plus/es')['ElInput']
+    ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
+    ElLink: typeof import('element-plus/es')['ElLink']
     ElMenu: typeof import('element-plus/es')['ElMenu']
     ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
     ElOption: typeof import('element-plus/es')['ElOption']
     ElPagination: typeof import('element-plus/es')['ElPagination']
     ElPopover: typeof import('element-plus/es')['ElPopover']
+    ElRadio: typeof import('element-plus/es')['ElRadio']
+    ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
     ElRow: typeof import('element-plus/es')['ElRow']
     ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
     ElSelect: typeof import('element-plus/es')['ElSelect']
     ElSlider: typeof import('element-plus/es')['ElSlider']
+    ElStep: typeof import('element-plus/es')['ElStep']
+    ElSteps: typeof import('element-plus/es')['ElSteps']
     ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
     ElSwitch: typeof import('element-plus/es')['ElSwitch']
+    ElTable: typeof import('element-plus/es')['ElTable']
+    ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
+    ElTabPane: typeof import('element-plus/es')['ElTabPane']
+    ElTabs: typeof import('element-plus/es')['ElTabs']
     ElTag: typeof import('element-plus/es')['ElTag']
     ElText: typeof import('element-plus/es')['ElText']
     ElTimeline: typeof import('element-plus/es')['ElTimeline']
     ElTimelineItem: typeof import('element-plus/es')['ElTimelineItem']
     ElTooltip: typeof import('element-plus/es')['ElTooltip']
     ElTree: typeof import('element-plus/es')['ElTree']
+    ElTreeSelect: typeof import('element-plus/es')['ElTreeSelect']
     ElUpload: typeof import('element-plus/es')['ElUpload']
     ExcelEditor: typeof import('./../components/ExcelEditor/index.vue')['default']
     FileUpload: typeof import('./../components/FileUpload/index.vue')['default']
@@ -72,6 +85,9 @@ declare module 'vue' {
     HikvisionPlayer: typeof import('./../components/HKVideo/hikvision-player.vue')['default']
     HKVideo: typeof import('./../components/HKVideo/index.vue')['default']
     IconSelect: typeof import('./../components/IconSelect/index.vue')['default']
+    IEpCaretBottom: typeof import('~icons/ep/caret-bottom')['default']
+    IEpCaretTop: typeof import('~icons/ep/caret-top')['default']
+    IEpUploadFilled: typeof import('~icons/ep/upload-filled')['default']
     IFrame: typeof import('./../components/iFrame/index.vue')['default']
     ImagePreview: typeof import('./../components/ImagePreview/index.vue')['default']
     ImageUpload: typeof import('./../components/ImageUpload/index.vue')['default']

src/views/globalMap/RightMenu/FixedPointAnalysis.vue

@@ -67,7 +67,7 @@
         <div class="route-list">
           <div v-for="(item, index) in routeData" :key="index" class="route-item2" @click="drawRoute(item)">
             <div class="text-box1">
-              <div :class="'tag' + index">{{ getTag(index) }}</div>
+              <div :class="'tag tag' + index">{{ getTag(index) }}</div>
               <div class="text1">{{ item.strategy }}</div>
             </div>
             <div class="route-info">
@@ -123,7 +123,7 @@ let showAddress = ref(true);
 let routeData = ref([]);
 let routeLine, startMarker, endMarker;
 let routesAddress = ref('');
-let AMap, map, driving, geocoder;
+let AMap, map, geocoder;
 let eventList = ref([]);
 let selectData = ref({
   event_title: '',
@@ -146,16 +146,18 @@ let total = ref(0);
 let dataList = ref([]);
 const toSelect = () => {
   map.on('click', handleClickMap);
+  showAddress.value = false;
+  routeData.value = [];
+  clearMarker();
+  clearLine();
 };
 const handleClickMap = (e) => {
-  map.off('click', handleClickMap);
-  tempState.longitude = e.lnglat.getLng();
-  tempState.latitude = e.lnglat.getLat();
-  geocoder.getAddress([tempState.longitude, tempState.latitude], (status, result) => {
-    if (status === 'complete' && result.info === 'OK') {
-      tempState.address = result.regeocode.formattedAddress;
-    }
-  });
+  if (AMapType.includes(props.activeMap)) {
+    map.off('click', handleClickMap);
+  } else {
+    map.un('click', handleClickMap);
+  }
+  getAddress([e.lnglat.getLng(), e.lnglat.getLat()]);
 };
 const confirmSelect = () => {
   selectEvent(
@@ -180,10 +182,7 @@ const selectEvent = (item, unFitView) => {
   tempState.address = '';
   tempState.longitude = '';
   tempState.latitude = '';
-  if (!!selectMarker) {
-    selectMarker.setMap(null);
-    selectMarker = null;
-  }
+  clearMarker();
   if (AMapType.includes(props.activeMap)) {
     // 以 icon URL 的形式创建一个途经点
     const icon = new AMap.Icon({
@@ -215,6 +214,9 @@ const selectEvent = (item, unFitView) => {
     );
     const vectorLayer = getMapUtils().getVectorLayer();
     vectorLayer.getSource().addFeature(feature);
+    if (!unFitView) {
+      map.getView().setCenter([item.longitude, item.latitude]);
+    }
   }
   getList();
 };
@@ -256,19 +258,8 @@ const handleRoutes = async (item) => {
 
 const drawRoute = (route) => {
   const path = parseRouteToPath(route);
+  clearLine();
   if (AMapType.includes(props.activeMap)) {
-    if (!!startMarker) {
-      map.remove(startMarker);
-      startMarker = null;
-    }
-    if (!!endMarker) {
-      map.remove(endMarker);
-      endMarker = null;
-    }
-    if (!!routeLine) {
-      routeLine.setMap(null);
-      routeLine = null;
-    }
     const icon1 = new AMap.Icon({
       size: new AMap.Size(19, 31),
       image: startImg
@@ -306,18 +297,6 @@ const drawRoute = (route) => {
   } else {
     const vectorLayer = getMapUtils().getVectorLayer();
     const source = vectorLayer.getSource();
-    if (!!startMarker) {
-      source.removeFeaure(startMarker);
-      startMarker = null;
-    }
-    if (!!endMarker) {
-      source.removeFeaure(endMarker);
-      endMarker = null;
-    }
-    if (!!routeLine) {
-      source.removeFeaure(routeLine);
-      routeLine = null;
-    }
     startMarker = new Feature({
       geometry: new Point(path[0])
     });
@@ -418,16 +397,10 @@ const getList = () => {
     total.value = res.total;
   });
 };
-onMounted(async () => {
-  const gcj02Coord = gcoord.transform(props.location, gcoord.WGS84, gcoord.GCJ02);
-  tempState.longitude = props.location[0];
-  tempState.latitude = props.location[1];
-  map = getMapUtils().getMap();
-  if (AMapType.includes(props.activeMap)) {
-    AMap = getMapUtils().getAMap();
-    //构造路线导航类
-    driving = new AMap.Driving({});
-  }
+const getAddress = async (location) => {
+  const gcj02Coord = gcoord.transform(location, gcoord.WGS84, gcoord.GCJ02);
+  tempState.longitude = location[0];
+  tempState.latitude = location[1];
   // 调用高德逆向地理编码 API
   const response = await fetch(`https://restapi.amap.com/v3/geocode/regeo?key=${amapKey}&location=${gcj02Coord[0]},${gcj02Coord[1]}`);
   const result = await response.json();
@@ -436,6 +409,56 @@ onMounted(async () => {
   if (result.status === '1' && result.regeocode) {
     tempState.address = result.regeocode.formatted_address;
   }
+};
+const clearMarker = () => {
+  if (!selectMarker) return;
+  if (AMapType.includes(props.activeMap)) {
+    selectMarker.remove();
+    selectMarker = null;
+  } else {
+    const vectorLayer = getMapUtils().getVectorLayer();
+    const source = vectorLayer.getSource();
+    source.removeFeature(selectMarker);
+    selectMarker = null;
+  }
+};
+const clearLine = () => {
+  if (AMapType.includes(props.activeMap)) {
+    if (!!startMarker) {
+      startMarker.remove();
+      startMarker = null;
+    }
+    if (!!endMarker) {
+      endMarker.remove();
+      endMarker = null;
+    }
+    if (!!routeLine) {
+      routeLine.remove();
+      routeLine = null;
+    }
+  } else {
+    const vectorLayer = getMapUtils().getVectorLayer();
+    const source = vectorLayer.getSource();
+    if (!!startMarker) {
+      source.removeFeature(startMarker);
+      startMarker = null;
+    }
+    if (!!endMarker) {
+      source.removeFeature(endMarker);
+      endMarker = null;
+    }
+    if (!!routeLine) {
+      source.removeFeature(routeLine);
+      routeLine = null;
+    }
+  }
+};
+onMounted(() => {
+  map = getMapUtils().getMap();
+  if (AMapType.includes(props.activeMap)) {
+    AMap = getMapUtils().getAMap();
+  }
+  getAddress(props.location);
 });
 </script>
 
@@ -617,6 +640,7 @@ onMounted(async () => {
         height: 12px;
         background: url('@/assets/images/electronicDisasterMapManage/close.png') no-repeat;
         background-size: 100% 100%;
+        cursor: pointer;
         margin-left: 5px;
       }
     }
@@ -628,26 +652,21 @@ onMounted(async () => {
       cursor: pointer;
       .text-box1 {
         display: flex;
-        .tag0 {
+        .tag {
           color: #fff;
-          background-color: #e65d63;
+          background-color: #2c81ff;
           border-radius: 10px;
           padding: 2px 6px;
           font-size: 12px;
         }
+        .tag0 {
+          background-color: #e65d63;
+        }
         .tag1 {
-          color: #fff;
           background-color: #f0b13c;
-          border-radius: 10px;
-          padding: 2px 6px;
-          font-size: 12px;
         }
         .tag2 {
-          color: #fff;
           background-color: #6bc26b;
-          border-radius: 10px;
-          padding: 2px 6px;
-          font-size: 12px;
         }
         .text1 {
           font-size: 14px;