Merge remote-tracking branch 'origin/dev' into dev

src/assets/styles/element-ui.scss

@@ -527,7 +527,7 @@
   border-radius: 0 !important;
   .el-picker-panel {
     background: rgba(5, 18, 53, 0.85) !important;
-    box-shadow:inset  0 0 40px rgba(26, 144, 255, 0.5) !important;
+    //box-shadow:inset  0 0 40px rgba(26, 144, 255, 0.5) !important;
     color: #b1cae0;
   }
   .el-date-table {
@@ -536,13 +536,24 @@
   .el-date-picker {
     width: 934px;
   }
+  .el-popper__arrow:before {
+    border: 4px solid #2C81FF !important;
+    background-color: rgba(5, 18, 53, 1) !important;
+  }
   .el-date-picker .el-picker-panel__content {
     width: auto !important;
   }
   .el-date-picker__header {
-    margin: 0 12px !important;
+    margin: 12px 12px 0 !important;
     height: 75px;
     line-height: 75px;
+    .arrow-left, .arrow-right, .d-arrow-left, .d-arrow-right {
+      font-size: 38px;
+      color: #ffffff;
+      &:hover {
+        color: #7af0e9;
+      }
+    }
   }
   .el-date-picker__header-label {
     color: #b1cae0;

src/assets/styles/index.scss

@@ -55,10 +55,10 @@ html {
   box-sizing: border-box;
 }
 
-html.dark .svg-icon,
-html.dark svg {
-  fill: var(--el-text-color-regular);
-}
+//html.dark .svg-icon,
+//html.dark svg {
+//  fill: var(--el-text-color-regular);
+//}
 
 #app {
   height: 100%;
@@ -534,3 +534,12 @@ aside {
   left: 141px;
   font-size: 60px;
 }
+
+.amap-marker {
+  .amap-icon {
+    img {
+      width: 100%;
+      height: 100%;
+    }
+  }
+}

src/assets/styles/variables.module.scss

@@ -22,46 +22,46 @@
   // ele
   --brder-color: #e8e8e8
 }
-html.dark {
-  --menuBg: #1d1e1f;
-  --menuColor: #bfcbd9;
-  --menuActiveText: #f4f4f5;
-  --menuHover: #171819;
-
-  --subMenuBg: #1d1e1f;
-  --subMenuActiveText: #1d1e1f;
-  --subMenuHover: #171819;
-  --subMenuTitleHover: #171819;
-
-  --fixedHeaderBg: #171819;
-  --tableHeaderBg: var(--el-bg-color);
-  --tableHeaderTextColor: var(--el-text-color);
-
-  // 覆盖ele 高亮当前行的标准暗色
-  .el-tree-node__content {
-    --el-color-primary-light-9: #262727;
-  }
-  // vxe-table 主题
-  --vxe-font-color: #98989E;
-  --vxe-primary-color: #2C7ECF;
-  --vxe-icon-background-color: #98989E;
-  --vxe-table-font-color: #98989E;
-  --vxe-table-resizable-color: #95969a;
-  --vxe-table-header-background-color: #28282A;
-  --vxe-table-body-background-color: #151518;
-  --vxe-table-background-color: #4a5663;
-  --vxe-table-border-width: 1px;
-  --vxe-table-border-color: #37373A;
-  --vxe-toolbar-background-color: #37373A;
-
-  // 工作流
-  --bpmn-panel-border: #37373A;
-  --bpmn-panel-box-shadow: #37373A;
-  --bpmn-panel-bar-background-color: #37373A;
-
-  // ele
-  --brder-color: #37373A
-}
+//html.dark {
+//  --menuBg: #1d1e1f;
+//  --menuColor: #bfcbd9;
+//  --menuActiveText: #f4f4f5;
+//  --menuHover: #171819;
+//
+//  --subMenuBg: #1d1e1f;
+//  --subMenuActiveText: #1d1e1f;
+//  --subMenuHover: #171819;
+//  --subMenuTitleHover: #171819;
+//
+//  --fixedHeaderBg: #171819;
+//  --tableHeaderBg: var(--el-bg-color);
+//  --tableHeaderTextColor: var(--el-text-color);
+//
+//  // 覆盖ele 高亮当前行的标准暗色
+//  .el-tree-node__content {
+//    --el-color-primary-light-9: #262727;
+//  }
+//  // vxe-table 主题
+//  --vxe-font-color: #98989E;
+//  --vxe-primary-color: #2C7ECF;
+//  --vxe-icon-background-color: #98989E;
+//  --vxe-table-font-color: #98989E;
+//  --vxe-table-resizable-color: #95969a;
+//  --vxe-table-header-background-color: #28282A;
+//  --vxe-table-body-background-color: #151518;
+//  --vxe-table-background-color: #4a5663;
+//  --vxe-table-border-width: 1px;
+//  --vxe-table-border-color: #37373A;
+//  --vxe-toolbar-background-color: #37373A;
+//
+//  // 工作流
+//  --bpmn-panel-border: #37373A;
+//  --bpmn-panel-box-shadow: #37373A;
+//  --bpmn-panel-bar-background-color: #37373A;
+//
+//  // ele
+//  --brder-color: #37373A
+//}
 
 // base color
 $blue: #324157;

src/components/HeaderSection/index.vue

@@ -28,16 +28,25 @@
           <div class="text">{{ item.label }}</div>
         </div>
       </div>
-      <i class="userIcon" />
+      <div ref="userRef" class="userIcon" @click="handleShowBox">
+        <div v-show="showBox" class="log-out-box">
+          <div class="log-out" @click="handleShowTip">退出登录</div>
+        </div>
+      </div>
     </div>
+    <Dialog v-model="showTip" class="tip" type="xs" title="提示" @close="showTip = false" @confirm="logout">确定注销并退出系统吗？</Dialog>
   </div>
 </template>
 
 <script lang="ts" setup name="headerSection">
 import usePermissionStore from '@/store/modules/permission';
+import useUserStore from '@/store/modules/user';
+import { onClickOutside} from "@vueuse/core";
 
 const router = useRouter();
+const userStore = useUserStore();
 const permissionStore = usePermissionStore();
+const userRef = ref();
 // type 1 系统内地址 2 外链
 const menuState = computed(() => {
   return permissionStore.menuState;
@@ -56,6 +65,22 @@ const clickMenu = (item) => {
     router.push({ path: item.path });
   }
 };
+let showBox = ref(false);
+let showTip = ref(false);
+onClickOutside(userRef, (event) => {
+  showBox.value = false;
+});
+const handleShowBox = () => {
+  showBox.value = true;
+};
+const handleShowTip = () => {
+  showBox.value = false;
+  showTip.value = true;
+};
+const logout = async () => {
+  await userStore.logout();
+  location.href = import.meta.env.VITE_APP_CONTEXT_PATH + '#/';
+};
 </script>
 
 <style lang="scss" scoped>
@@ -169,6 +194,29 @@ const clickMenu = (item) => {
       margin-top: 54px;
       margin-left: 57px;
       margin-right: 57px;
+      cursor: pointer;
+      position: relative;
+      .log-out-box {
+        position: absolute;
+        bottom: -100px;
+        left: -30px;
+        border: 1px solid #2db3e9;
+        .log-out {
+          width: 200px;
+          display: flex;
+          flex-direction: column;
+          justify-content: center;
+          align-items: center;
+          padding: 20px 0;
+          color: #ffffff;
+          font-size: 38px;
+          background: #0d2c70;
+          cursor: pointer;
+          &:hover {
+            background: #1b4ea5;
+          }
+        }
+      }
     }
   }
 }

src/components/LineWidthSelect/index.vue

@@ -18,7 +18,7 @@ interface Props {
   options: object[];
 }
 const props = withDefaults(defineProps<Props>(), {});
-const emits = defineEmits('update:modelValue');
+const emits = defineEmits(['update:modelValue']);
 
 let show = ref();
 const handleShow = () => {

src/components/Map/map.scss

@@ -25,7 +25,7 @@ $vh_base: 2520;
     overflow-y: auto;
     width: 100%;
     &::-webkit-scrollbar {
-      width: vw(6);
+      width: vw(12);
     }
   }
   .table {

src/hooks/AMap/useAMap.ts

@@ -93,6 +93,8 @@ export function useAMap(options) {
       context.marker.setOffset(new AMap.Pixel(-size / 2, -size / 2));
       context.marker.setContent(div);
       context.marker.on('click', (e) => {
+        const bounds = e.target.getBounds();
+        map.setZoomAndCenter(map.getZoom() + 1, bounds.getCenter());
       });
     };
     const _renderMarker = function (context) {
@@ -206,9 +208,13 @@ export function useAMap(options) {
     // 打开InfoWindow，并设置其内容和位置
     infoWindow.setContent(content);
     infoWindow.open(map, lnglat);
+    // 解决2.0版本无法滚动问题
+    infoWindow.on('mouseover', () => map.setStatus({ zoomEnable: false }));
+    infoWindow.on('mouseout', () => map.setStatus({ zoomEnable: true }));
   };
 
   const hideInfo = (e) => {
+    map.setStatus({ zoomEnable: true });
     if (!!infoWindow) {
       infoWindow.close();
       if (!!clickMarker && e) {
@@ -239,12 +245,12 @@ export function useAMap(options) {
       ];
       options.forEach((option) => {
         const holes = result.districtList[0].boundaries;
-        if (option.offset) {
-
-          holes.forEach((items) => {
-
-          })
-        }
+        // if (option.offset) {
+        //
+        //   holes.forEach((items) => {
+        //
+        //   })
+        // }
         let pathArray = [outer];
         pathArray.push.apply(pathArray, holes);
         const polygon = new AMap.Polygon({

src/views/emergencyCommandMap/LeftSection/VideoMonitor.vue

@@ -50,7 +50,7 @@
           <div v-for="(item, index) in editData" :key="index" class="box-item">
             <div class="edit-img">
               <span class="edit-title">{{ item.name }}</span>
-              <div class="close-btn" @click="deleteItem(index)">x</div>
+              <div class="close-btn" @click="deleteItem(index)"></div>
             </div>
           </div>
           <div class="flex" style="flex-direction: column; align-items: center">
@@ -257,7 +257,7 @@ initData();
         position: absolute;
         bottom: 17px;
         right: 20px;
-
+        z-index: 99;
         display: flex;
         .label {
           width: 411px;
@@ -325,7 +325,7 @@ initData();
       position: absolute;
       bottom: 17px;
       right: 20px;
-
+      z-index: 99;
       display: flex;
       .label {
         width: 411px;

src/views/globalMap/RightMenu/Fireproofing.vue

@@ -86,6 +86,10 @@ const initData = () => {
     total.value = res.total;
   });
 };
+const handleCancel = () => {
+  queryParams.keyword = '';
+  initData();
+};
 initData();
 </script>
 

src/views/globalMap/RightMenu/GridPointRainfall.vue

@@ -0,0 +1,48 @@
+<template>
+  <Dialog custom-show title="格点雨量" :height="'1000px'" hide-footer @close="handleClose">
+    <div class="gradient-text title">雨量统计：{{address}}({{location[0]}}, {{location[1]}})</div>
+    <Chart :option="chartOption" style="height: 700px" />
+  </Dialog>
+</template>
+
+<script lang="ts" setup name="GridPointRainfall">
+import { option9 } from '@/views/globalMap/RightMenu/echartOptions';
+import AMapLoader from '@amap/amap-jsapi-loader';
+
+interface Props {
+  modelValue: boolean;
+  location?: string | number[];
+}
+const props = withDefaults(defineProps<Props>(), {});
+const emits = defineEmits(['update:modelValue']);
+let address = ref('');
+let chartOption = ref(option9);
+const handleClose = () => {
+  emits('update:modelValue', false);
+};
+let AMap, geocoder;
+onMounted(() => {
+  AMapLoader.load({
+    key: '30d3d8448efd68cb0b284549fd41adcf', // 申请好的Web端开发者Key，首次调用 load 时必填
+    version: '2.0', // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
+    plugins: ['AMap.PlaceSearch', 'AMap.ContextMenu', 'AMap.PolygonEditor', 'AMap.Geocoder'] // 插件列表
+  }).then((res) => {
+    AMap = res;
+    geocoder = new AMap.Geocoder({
+      // city 指定进行编码查询的城市，支持传入城市名、adcode 和 citycode
+      city: '010'
+    });
+    geocoder.getAddress(props.location, (status, result) => {
+      if (status === 'complete' && result.info === 'OK') {
+        address.value = result.regeocode.formattedAddress;
+      }
+    });
+  });
+  chartOption.value.series[0].data = [820, 932, 901, 934, 1290, 1330];
+  chartOption.value.series[1].data = ['', '', '', '', '', 1330, 901, 934, 1290, 1330, 1320];
+});
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/globalMap/RightMenu/Helicopter.vue

@@ -9,7 +9,7 @@
             <el-icon class="el-input__icon"><search /></el-icon>
           </template>
         </el-input>
-        <el-button class="btn" @click="handleCancel">取消</el-button>
+        <div class="btn" @click="handleCancel">取消</div>
       </div>
     </div>
     <div class="flex-container">

src/views/globalMap/RightMenu/KeyVehicles.vue

@@ -8,7 +8,7 @@
             <el-icon class="el-input__icon"><search /></el-icon>
           </template>
         </el-input>
-        <el-button class="btn" @click="handleCancel">取消</el-button>
+        <div class="btn" @click="handleCancel">取消</div>
       </div>
     </div>
     <div>两客一危一重货</div>

src/views/globalMap/RightMenu/LayerAnalysis.vue

@@ -1,25 +1,27 @@
 <template>
   <div class="menu-content">
     <div class="gradient-text title">图层分析</div>
-    <div class="box">
-      <div
-        v-for="(item, index) in dataList"
-        :key="index"
-        :class="item.checked ? 'box-item box-item-active' : 'box-item'"
-        :title="item.name"
-        @click="handleClick(item)"
-      >
-        <div class="text1">{{ item.name }}</div>
-        <div class="text2">{{ item.value }}</div>
+    <div class="scroll-box">
+      <div class="box">
+        <div
+          v-for="(item, index) in dataList"
+          :key="index"
+          :class="item.checked ? 'box-item box-item-active' : 'box-item'"
+          :title="item.name"
+          @click="handleClick(item)"
+        >
+          <div class="text1">{{ item.name }}</div>
+          <div class="text2">{{ item.value }}</div>
+        </div>
+      </div>
+      <div class="box2">
+        <div class="box2-title">各区县分布统计</div>
+        <Chart :option="chartOption1" style="width: 100%; height: 948px" />
+      </div>
+      <div class="box2">
+        <div class="box2-title">类型统计</div>
+        <Chart :option="chartOption2" style="width: 100%; height: 422px; margin-top: 60px" />
       </div>
-    </div>
-    <div class="box2">
-      <div class="box2-title">各区县分布统计</div>
-      <Chart :option="chartOption1" style="width: 100%; height: 948px" />
-    </div>
-    <div class="box2">
-      <div class="box2-title">类型统计</div>
-      <Chart :option="chartOption2" style="width: 100%; height: 422px; margin-top: 60px" />
     </div>
   </div>
 </template>
@@ -240,6 +242,12 @@ const handleClick = (item) => {
   font-size: 36px;
   position: relative;
   color: #fff;
+  .scroll-box {
+    width: 100%;
+    height: 100%;
+    position: relative;
+    overflow-y: auto;
+  }
 }
 .title {
   font-size: 60px;

src/views/globalMap/RightMenu/Mitigation.vue

@@ -86,6 +86,10 @@ const initData = () => {
     total.value = res.total;
   });
 };
+const handleCancel = () => {
+  queryParams.keyword = '';
+  initData();
+};
 initData();
 </script>
 

src/views/globalMap/RightMenu/MobileCommandVehicle.vue

@@ -9,7 +9,7 @@
             <el-icon class="el-input__icon"><search /></el-icon>
           </template>
         </el-input>
-        <el-button class="btn" @click="handleCancel">取消</el-button>
+        <div class="btn" @click="handleCancel">取消</div>
       </div>
     </div>
     <div class="flex-container">

src/views/globalMap/RightMenu/MobilePlatform.vue

@@ -9,7 +9,7 @@
             <el-icon class="el-input__icon"><search /></el-icon>
           </template>
         </el-input>
-        <el-button class="btn" @click="handleCancel">取消</el-button>
+        <div class="btn" @click="handleCancel">取消</div>
       </div>
     </div>
     <!--    </div>-->

src/views/globalMap/RightMenu/MobileUnmannedVehicle.vue

@@ -9,7 +9,7 @@
             <el-icon class="el-input__icon"><search /></el-icon>
           </template>
         </el-input>
-        <el-button class="btn" @click="handleCancel">取消</el-button>
+        <div class="btn" @click="handleCancel">取消</div>
       </div>
     </div>
     <div class="flex-container">

src/views/globalMap/RightMenu/OnlinePlotting/index.vue

@@ -69,14 +69,14 @@
       </div>
     </div>
     <div v-else-if="menuActive1 === 1" class="tab-content3">
-      <div class="box1">
-        <div class="box-item">
-          <div class="btn">
-            <div class="merge-icon"></div>
-            合并
-          </div>
-        </div>
-      </div>
+<!--      <div class="box1">-->
+<!--        <div class="box-item">-->
+<!--          <div class="btn">-->
+<!--            <div class="merge-icon"></div>-->
+<!--            合并-->
+<!--          </div>-->
+<!--        </div>-->
+<!--      </div>-->
       <div class="params-box">
         <el-input v-model="queryParams.pattern_name" class="custom-input" placeholder="请输入" @input="handleQuery">
           <template #prefix>
@@ -103,11 +103,11 @@
               <div class="edit-icon"></div>
               编辑
             </div>
-            <div class="line2"></div>
-            <div class="btn">
-              <div class="share-icon"></div>
-              分享
-            </div>
+<!--            <div class="line2"></div>-->
+<!--            <div class="btn">-->
+<!--              <div class="share-icon"></div>-->
+<!--              分享-->
+<!--            </div>-->
           </div>
         </div>
         <div class="footer">
@@ -248,13 +248,13 @@ const menu = ref([
           { name: '细箭头', value: 'marker', image: getImageUrl('thinarrow'), icon: getImageUrl('thinarrow'), size: [166, 88] }
         ]
       },
-      {
-        name: '导航',
-        value: 'navigation',
-        children: [
-          { name: '导航', value: 'marker', image: getImageUrl('navigation'), icon: getImageUrl('navigation'), size: [166, 88] }
-        ]
-      },
+      // {
+      //   name: '导航',
+      //   value: 'navigation',
+      //   children: [
+      //     { name: '导航', value: 'marker', image: getImageUrl('navigation'), icon: getImageUrl('navigation'), size: [166, 88] }
+      //   ]
+      // },
       {
         name: '扑救队伍',
         value: 'firefightingTeam',
@@ -266,7 +266,7 @@ const menu = ref([
           { name: '武警', value: 'marker', image: getImageUrl('armedpolice'), icon: getImageUrl('armedpolice'), size: [166, 88] },
           { name: '森林警察', value: 'marker', image: getImageUrl('forestpoliceman'), icon: getImageUrl('forestpoliceman'), size: [166, 88] },
           { name: '扑火队伍', value: 'marker', image: getImageUrl('firefightingteam'), icon: getImageUrl('firefightingteam'), size: [166, 88] },
-          { name: '扑火队伍路线', value: 'marker', image: getImageUrl('Firefightingteamroute'), icon: getImageUrl('Firefightingteamroute'), size: [166, 88] }
+          // { name: '扑火队伍路线', value: 'marker', image: getImageUrl('Firefightingteamroute'), icon: getImageUrl('Firefightingteamroute'), size: [166, 88] }
         ]
       },
       {
@@ -293,20 +293,20 @@ const menu = ref([
 
         ]
       },
-      {
-        name: '其他',
-        value: 'other',
-        children: [
-          { name: '危险区域', value: 'marker', image: getImageUrl('dangerousarea'), icon: getImageUrl('dangerousarea'), size: [166, 88] },
-          { name: '隔离带开采', value: 'marker', image: getImageUrl('Isolationzonemining'), icon: getImageUrl('Isolationzonemining'), size: [166, 88] },
-          { name: '应急庇护场所', value: 'marker', image: getImageUrl('emergencyshelter'), icon: getImageUrl('emergencyshelter'), size: [166, 88] },
-          { name: '风力风向', value: 'marker', image: getImageUrl('windspeedanddirection'), icon: getImageUrl('windspeedanddirection'), size: [166, 88] },
-          { name: '测距', value: 'marker', image: getImageUrl('ranging'), icon: getImageUrl('ranging'), size: [166, 88] },
-          { name: '大风', value: 'marker', image: getImageUrl('strongwind'), icon: getImageUrl('strongwind'), size: [166, 88] },
-          { name: '人工降雨', value: 'marker', image: getImageUrl('artificialrainfall'), icon: getImageUrl('artificialrainfall'), size: [166, 88] },
-          { name: '台风', value: 'marker', image: getImageUrl('typhoon'), icon: getImageUrl('typhoon'), size: [166, 88] }
-        ]
-      }
+      // {
+      //   name: '其他',
+      //   value: 'other',
+      //   children: [
+      //     { name: '危险区域', value: 'marker', image: getImageUrl('dangerousarea'), icon: getImageUrl('dangerousarea'), size: [166, 88] },
+      //     { name: '隔离带开采', value: 'marker', image: getImageUrl('Isolationzonemining'), icon: getImageUrl('Isolationzonemining'), size: [166, 88] },
+      //     { name: '应急庇护场所', value: 'marker', image: getImageUrl('emergencyshelter'), icon: getImageUrl('emergencyshelter'), size: [166, 88] },
+      //     { name: '风力风向', value: 'marker', image: getImageUrl('windspeedanddirection'), icon: getImageUrl('windspeedanddirection'), size: [166, 88] },
+      //     { name: '测距', value: 'marker', image: getImageUrl('ranging'), icon: getImageUrl('ranging'), size: [166, 88] },
+      //     { name: '大风', value: 'marker', image: getImageUrl('strongwind'), icon: getImageUrl('strongwind'), size: [166, 88] },
+      //     { name: '人工降雨', value: 'marker', image: getImageUrl('artificialrainfall'), icon: getImageUrl('artificialrainfall'), size: [166, 88] },
+      //     { name: '台风', value: 'marker', image: getImageUrl('typhoon'), icon: getImageUrl('typhoon'), size: [166, 88] }
+      //   ]
+      // }
     ]
   },
   {
@@ -828,12 +828,6 @@ onMounted(() => {
     background: url('@/assets/images/map/rightMenu/onlinePlotting/merge.png') no-repeat;
   }
 }
-.line2 {
-  width: 3px;
-  height: 24px;
-  background-color: #a7ccdf;
-  margin: 0 70px;
-}
 .line2 {
   width: 3px;
   height: 24px;

src/views/globalMap/RightMenu/SatellitePhone.vue

@@ -8,7 +8,7 @@
             <el-icon class="el-input__icon"><search /></el-icon>
           </template>
         </el-input>
-        <el-button class="btn" @click="handleCancel">取消</el-button>
+        <div class="btn" @click="handleCancel">取消</div>
       </div>
     </div>
     <div>卫星电话</div>

src/views/globalMap/RightMenu/TyphoonVideo.vue

@@ -8,7 +8,7 @@
             <el-icon class="el-input__icon"><search /></el-icon>
           </template>
         </el-input>
-        <el-button class="btn" @click="handleCancel">取消</el-button>
+        <div class="btn" @click="handleCancel">取消</div>
       </div>
     </div>
     <!--    <div class="section-box">-->

src/views/globalMap/RightMenu/echartOptions.ts

@@ -707,3 +707,98 @@ export const option8 = {
     }
   ]
 };
+
+// 格点雨量
+export const option9 = {
+  legend: {
+    show: true,
+    icon: 'rect',
+    itemWidth: 75,
+    itemHeight: 42,
+    itemGap: 30,
+    textStyle: {
+      fontSize: '32',
+      color: '#A8CCDE'
+    },
+    data: ['过去累计雨量', '未来累计雨量']
+  },
+  color: ['#467cd1', '#bcbcbc'],
+  xAxis: {
+    type: 'category',
+    axisLabel: {
+      textStyle: {
+        color: '#a7ccdf',
+        fontFamily: '微软雅黑',
+        fontSize: 32
+      }
+    },
+    data: ['-24h', '-12h', '-6h', '-3h', '-1h', '现在', '1h', '3h', '24h', '40h', '70h']
+  },
+  yAxis: {
+    type: 'value',
+    axisLabel: {
+      textStyle: {
+        color: '#a7ccdf',
+        fontFamily: '微软雅黑',
+        fontSize: 32
+      }
+    },
+    splitLine: {
+      lineStyle: {
+        color: '#0c2c5a'
+      }
+    },
+    axisLine: {
+      show: false
+    }
+  },
+  series: [
+    {
+      name: '过去累计雨量',
+      data: [],
+      label: {
+        show: true, // 显示标签
+        color: '#a7ccdf',
+        fontFamily: '微软雅黑',
+        fontSize: 32,
+        position: 'top' // 标签位置，可以是 'top'、'bottom'、'left'、'right' 等
+      },
+      markLine: {
+        symbol: 'none',
+        data: [
+          {
+            xAxis: 5, // "现在"的索引为1（从0开始计数）
+            yAxis: null, // yAxis为null表示竖线贯穿整个y轴
+            label: { show: false },
+            lineStyle: {
+              width: 6,
+              color: 'red',
+              type: 'solid'
+            }
+          }
+        ]
+      },
+      lineStyle: {
+        width: 6
+      },
+      type: 'line',
+      smooth: true
+    },
+    {
+      name: '未来累计雨量',
+      label: {
+        show: true, // 显示标签
+        color: '#a7ccdf',
+        fontFamily: '微软雅黑',
+        fontSize: 32,
+        position: 'top' // 标签位置，可以是 'top'、'bottom'、'left'、'right' 等
+      },
+      data: [],
+      lineStyle: {
+        width: 6
+      },
+      type: 'line',
+      smooth: true
+    }
+  ]
+};

src/views/globalMap/RightMenu/index.vue

@@ -143,6 +143,14 @@ const clickBtn = (direction: string) => {
     scrollListRef.value.scrollTop += 168;
   }
 };
+const showIndexMenu = (name) => {
+  let index = menuState.menuData.findIndex((item) => {
+    return item.name === name;
+  });
+  if (index > -1) {
+    clickMenu(index);
+  }
+};
 // 点击菜单
 const clickMenu = (index) => {
   menuState.showMenu = true;
@@ -190,7 +198,7 @@ const updateMenu = (type, menu) => {
 const getMenuState = () => {
   return menuState;
 };
-defineExpose({ handleMenu, clickContractMenu, updateMenu, getMenuState });
+defineExpose({ handleMenu, showIndexMenu, clickContractMenu, updateMenu, getMenuState });
 </script>
 
 <style lang="scss" scoped>

src/views/globalMap/index.vue

@@ -26,6 +26,7 @@
       <TimeAxis />
       <DrawTools v-if="showDrawTools" @handle-analysis-data="handleAnalysisData" />
       <NearbyVideos v-if="showNearbyVideos" v-model="showNearbyVideos" :location="location" />
+      <GridPointRainfall v-if="showRainfall" v-model="showRainfall" :location="location" />
       <MaterialDetail v-if="showWarehouse" v-model="showWarehouse" :warehouse-data="warehouseData" />
       <CommunicationSupport v-if="communicationSupport.show" @close="handleHideCommunicationSupport" />
     </div>
@@ -47,6 +48,7 @@ import RightMenu from './RightMenu/index.vue';
 import { PointType } from '@/api/globalMap/type';
 import DrawTools from '@/views/globalMap/RightMenu/DrawTools.vue';
 import CommunicationSupport from '@/views/globalMap/RightMenu/CommunicationSupport.vue';
+import GridPointRainfall from '@/views/globalMap/RightMenu/GridPointRainfall.vue';
 
 const rightMenuRef = ref(null);
 const mapData = reactive(logicalData);
@@ -57,7 +59,7 @@ let leftMenuRef = ref(null);
 //  vectorgraph satellite imageMap 废弃：logical satellite2 satellite3
 let activeMap = ref('satellite');
 // 附近视频菜单数据
-let videoMenu = ref({});
+let tempMenu = ref({});
 const communicationSupport = reactive({
   show: false,
   data: {}
@@ -134,23 +136,25 @@ const clickMenu = (item, dataList) => {
     rightMenuRef.value.updateMenu(item.checked ? '1' : '2', item);
   } else if (item.path === '2') {
     let checked = item.checked ? '1' : '2';
-    let index = findChecked(dataList, item.name);
     // 打点信息
     addMarkers(item);
-    if (item.checked || (!item.checked && index === 0)) {
-      rightMenuRef.value.updateMenu(
-        checked,
-        ['易涝隐患点', '无人机', '铁塔运行监测', '物资与装备', '通讯保障'].includes(item.name)
-          ? item
-          : { name: '图层分析', meta: { icon: 'icon1' } }
-      );
+    if (['易涝隐患点', '无人机', '铁塔运行监测', '物资与装备', '通讯保障'].includes(item.name)) {
+      rightMenuRef.value.updateMenu(checked, item);
+    } else {
+      let index = findChecked(dataList, item.name);
+      if (item.checked && index > 0) {
+        // 已有图层分析直接切换到该index
+        rightMenuRef.value.showIndexMenu('图层分析');
+      } else if (item.checked || (!item.checked && index === 0)) {
+        rightMenuRef.value.updateMenu(checked, { name: '图层分析', meta: { icon: 'icon1' } });
+      }
     }
   } else if (item.path === '3') {
     // 通讯保障
     communicationSupport.show = !communicationSupport.show;
     communicationSupport.data = item;
   } else if (item.path === '4') {
-    videoMenu.value = item;
+    tempMenu.value = item;
     // 附近视频
     map = getMap();
     //为地图注册click事件获取鼠标点击出的经纬度坐标
@@ -238,13 +242,24 @@ const trackPlayback = (data) => {
   return {};
 };
 let showNearbyVideos = ref(false);
+let showRainfall = ref(false);
 let location = ref([]);
 watch(showNearbyVideos, () => {
   if (!showNearbyVideos.value) {
     location.value = [];
-    if (!!videoMenu.value) {
-      leftMenuRef.value.setMenuChange(videoMenu.value, false);
-      videoMenu.value = {};
+    if (!!tempMenu.value) {
+      leftMenuRef.value.setMenuChange(tempMenu.value, false);
+      tempMenu.value = {};
+      map.off('click', handleClickMap);
+    }
+  }
+});
+watch(showRainfall, () => {
+  if (!showRainfall.value) {
+    location.value = [];
+    if (!!tempMenu.value) {
+      leftMenuRef.value.setMenuChange(tempMenu.value, false);
+      tempMenu.value = {};
       map.off('click', handleClickMap);
     }
   }
@@ -256,7 +271,11 @@ const handleShowVideo = (data) => {
 };
 const handleClickMap = (e) => {
   location.value = [e.lnglat.getLng(), e.lnglat.getLat()];
-  showNearbyVideos.value = true;
+  if (!!tempMenu.value && tempMenu.value.name === '附近视频') {
+    showNearbyVideos.value = true;
+  } else if (!!tempMenu.value && tempMenu.value.name === '格点雨量') {
+    showRainfall.value = true;
+  }
 };
 let showWarehouse = ref(false);
 let warehouseData = ref('');