Pārlūkot izejas kodu

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

# Conflicts:
#	src/types/components.d.ts
愿你天天开心 10 mēneši atpakaļ
vecāks
revīzija
e1f01498bf

+ 0 - 0
src/assets/images/dotIcon/1_expert_hover .png → src/assets/images/dotIcon/1_expert_hover.png


+ 4 - 4
src/components/Map/index.vue

@@ -394,15 +394,15 @@ onUnmounted(() => {
 
 <style lang="scss" scoped>
 @import 'map.scss';
-.map-container {
-  width: 100%;
-  height: 100%;
-}
 .map-container2 {
   width: 100%;
   height: 100%;
   position: relative;
   overflow: hidden;
+}
+.map-container {
+  width: 100%;
+  height: 100%;
   .zoom-text {
     position: absolute;
     bottom: 0;

+ 1 - 0
src/types/components.d.ts

@@ -24,6 +24,7 @@ declare module 'vue' {
     ElButton: typeof import('element-plus/es')['ElButton']
     ElCard: typeof import('element-plus/es')['ElCard']
     ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
+    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']

+ 1 - 0
src/views/emergencyCommandMap/LeftSection/index.vue

@@ -280,6 +280,7 @@ onUnmounted(() => {
   display: flex;
   flex-direction: column;
   font-size: 36px;
+  margin-right: 65px;
   .weather-card {
     width: 1922px;
     height: 230px;

+ 1 - 1
src/views/emergencyCommandMap/MiddleSection.vue

@@ -5,6 +5,7 @@
       <div class="btn-active" style="margin-left: 40px">指挥调度</div>
     </div>
     <GlobalMap />
+    <slot />
   </div>
 </template>
 
@@ -19,7 +20,6 @@ const handleQuery1 = () => {
 
 <style lang="scss" scoped>
 .middle-section {
-  margin: 0 91px;
   flex: 1;
   height: 2140px;
   animation: slideAndFade 1.5s;

+ 4 - 3
src/views/emergencyCommandMap/RightSection/index.vue

@@ -35,10 +35,10 @@
     <RightTop :event-id="eventId" />
     <PublicOpinionSupervision />
     <JointDuty />
+    <StartPlan v-if="startPlanState.show" v-model:show="startPlanState.show" :title="startPlanState.title" :event-id="startPlanState.eventId" />
+    <SelectPlan v-model="selectPlanState.show" :title="selectPlanState.title" :temp-event-id="eventId" @update-plan="updatePlan" />
+    <RenWuDengJi v-if="renWuDengJiState.show" v-model:show="renWuDengJiState.show" :event-id="eventId" />
   </div>
-  <StartPlan v-if="startPlanState.show" v-model:show="startPlanState.show" :title="startPlanState.title" :event-id="startPlanState.eventId" />
-  <SelectPlan v-model="selectPlanState.show" :title="selectPlanState.title" :temp-event-id="eventId" @update-plan="updatePlan" />
-  <RenWuDengJi v-if="renWuDengJiState.show" v-model:show="renWuDengJiState.show" :event-id="eventId" />
 </template>
 
 <script lang="ts" setup>
@@ -164,6 +164,7 @@ const updatePlan = (data: { eventId: string }) => {
   flex-direction: column;
   font-size: 36px;
   padding-top: 57px;
+  margin-left: 65px;
   .task-header {
     display: flex;
     justify-content: space-around; /* 使按钮在div内均匀分布 */

+ 44 - 3
src/views/emergencyCommandMap/index.vue

@@ -3,9 +3,12 @@
     <div class="bg">
       <HeaderSection />
       <div class="dashboard-content">
-        <LeftSection />
-        <MiddleSection />
-        <RightSection />
+        <LeftSection v-show="showLeftSection" />
+        <MiddleSection>
+          <i class="left-icon" @click="handleTelescoping('left')" />
+          <i class="right-icon" @click="handleTelescoping('right')" />
+        </MiddleSection>
+        <RightSection v-show="showRightSection" />
       </div>
       <FooterSection style="position: absolute; bottom: 0; left: 0" />
     </div>
@@ -18,9 +21,24 @@ import RightSection from './RightSection/index.vue';
 import MiddleSection from './MiddleSection.vue';
 import autofit from 'autofit.js';
 import { getTransformScale } from '@/utils';
+import useAppStore from '@/store/modules/app';
 
+const appStore = useAppStore();
 const containerRef = ref();
 let scale = ref({ scaleX: 1, scaleY: 1 });
+let showLeftSection = computed(() => {
+  return appStore.showLeftSection;
+});
+let showRightSection = computed(() => {
+  return appStore.showRightSection;
+});
+const handleTelescoping = (type: string) => {
+  if (type === 'left') {
+    appStore.toggleLeftSection();
+  } else if (type === 'right') {
+    appStore.toggleRightSection();
+  }
+};
 provide('containerScale', () => scale.value);
 onMounted(() => {
   if (location.hostname != 'localhost___') {
@@ -66,4 +84,27 @@ onUnmounted(() => {
     overflow: hidden;
   }
 }
+.left-icon {
+  position: absolute;
+  bottom: 110px;
+  left: 0;
+  z-index: 9;
+  width: 152px;
+  height: 158px;
+  background: url('@/assets/images/left.png') no-repeat;
+  background-size: 100% 100%;
+  cursor: pointer;
+}
+
+.right-icon {
+  position: absolute;
+  bottom: 110px;
+  right: 0;
+  z-index: 9;
+  width: 152px;
+  height: 158px;
+  background: url('@/assets/images/right.png') no-repeat;
+  background-size: 100% 100%;
+  cursor: pointer;
+}
 </style>

+ 5 - 5
src/views/globalMap/RightMenu/DrawTools.vue

@@ -4,7 +4,7 @@
       <div class="item-label">画笔选择</div>
       <i class="color-box" :style="{ backgroundColor: colorList[drawerColorIndex]?.value }" />
       <!--弹窗选择器-->
-      <div v-show="showColorSelect" ref="selectBoxRef" class="select-box" style="top: -149px; padding-bottom: 20px">
+      <div v-show="showColorSelect" ref="selectBoxRef" class="select-box" style="top: -242px; padding-bottom: 20px">
         <div class="box-content">
           <div
             v-for="(item, index) in colorList"
@@ -21,7 +21,7 @@
     <div class="draw-item" @mouseover="showDrawTypeSelect = true" @mouseleave="showDrawTypeSelect = false">
       <div class="item-label">框面类型</div>
       <!--弹窗选择器-->
-      <div v-show="showDrawTypeSelect" ref="selectBoxRef2" class="select-box" style="top: -82px; padding-bottom: 20px">
+      <div v-show="showDrawTypeSelect" ref="selectBoxRef2" class="select-box" style="top: -127px; padding-bottom: 20px">
         <div class="box-content">
           <div
             v-for="(item, index) in drawTypeList"
@@ -37,7 +37,7 @@
     <div class="draw-item" @mouseover="showGraphicsTypeSelect = true" @mouseleave="showGraphicsTypeSelect = false">
       <div class="item-label">图像类型</div>
       <!--弹窗选择器-151-->
-      <div v-show="showGraphicsTypeSelect" ref="selectBoxRef2" class="select-box" style="top: -115.5px; padding-bottom: 20px">
+      <div v-show="showGraphicsTypeSelect" ref="selectBoxRef2" class="select-box" style="top: -184.5px; padding-bottom: 20px">
         <div class="box-content">
           <div
             v-for="(item, index) in graphicsTypeList"
@@ -345,8 +345,8 @@ const analysisSpatial = (data) => {
 <style lang="scss" scoped>
 .draw-tools-container {
   position: absolute;
-  bottom: -600px;
-  left: -6770px;
+  right: 255px;
+  bottom: 390px;
   background-color: #304468;
   border-radius: 5px;
   display: flex;

+ 13 - 7
src/views/globalMap/RightMenu/SpatialAnalysis.vue

@@ -30,15 +30,16 @@
       </div>
     </div>
   </div>
-  <DrawTools @handleAnalysisData="handleAnalysisData" />
 </template>
 
 <script lang="ts" setup name="AnalyzeDataDialog">
-import DrawTools from './DrawTools.vue';
 import { validateNum } from '@/utils/ruoyi';
 import { getSpatialAnalysis } from '@/api/globalMap';
 import { deepClone } from '@/utils';
 
+const props = defineProps({
+  updateLocation: []
+});
 const emits = defineEmits(['handleMenu']);
 const keyword = ref('');
 let analysisData = ref({
@@ -77,6 +78,16 @@ const filteredSubItems = (parentItem) => {
   });
 };
 const location = ref([]);
+watch(
+  () => props.updateLocation,
+  () => {
+    location.value = props.updateLocation;
+  },
+  {
+    immediate: true,
+    deep: true
+  }
+);
 watch(
   () => location,
   () => {
@@ -98,11 +109,6 @@ watch(
     deep: true
   }
 );
-
-const handleAnalysisData = (data) => {
-  location.value = data;
-  emits('handleMenu', '空间分析');
-};
 </script>
 
 <style lang="scss" scoped>

+ 14 - 6
src/views/globalMap/RightMenu/index.vue

@@ -23,7 +23,7 @@
         <!--图层分析-->
         <LayerAnalysis v-if="menuState.showMenu && menuState.menuData[menuState.activeIndex]?.name === '图层分析'" :point-type="pointType" />
         <!--空间分析-->
-        <SpatialAnalysis v-if="menuState.showMenu && menuState.menuData[menuState.activeIndex]?.name === '空间分析'" @handle-menu="handleMenu" />
+        <SpatialAnalysis v-if="menuState.showMenu && menuState.menuData[menuState.activeIndex]?.name === '空间分析'" :updateLocation="location" @handle-menu="handleMenu" />
         <!--江湖河库-->
         <Reservoir v-if="menuState.showMenu && menuState.menuData[menuState.activeIndex]?.name === '江湖河库'" />
         <!--路网视频-->
@@ -109,13 +109,19 @@ const clickMenu = (index) => {
   menuState.showMenu = true;
   menuState.activeIndex = index;
 };
-
+let location = ref([]);
 // 显示菜单
-const handleMenu = (name) => {
+const handleMenu = (name, data) => {
   let index = menuState.menuData.findIndex((item) => {
     return item.name === name;
   });
-  if (index > -1) {
+  if (name === '空间分析') {
+    menuState.showMenu = true;
+    menuState.activeIndex = index;
+    nextTick(() => {
+      location.value = data;
+    });
+  } else if (index > -1) {
     clickMenu(index);
   }
 };
@@ -142,8 +148,10 @@ const updateMenu = (type, menu) => {
     }
   }
 };
-
-defineExpose({ handleMenu, clickContractMenu, updateMenu });
+const getMenuState = () => {
+  return menuState;
+};
+defineExpose({ handleMenu, clickContractMenu, updateMenu, getMenuState });
 </script>
 
 <style lang="scss" scoped>

+ 5 - 5
src/views/globalMap/data/mapData.ts

@@ -4128,14 +4128,14 @@ export const iconList = {
     size: [40, 40]
   },
   '2': {
-    image: getImageUrl('2_rescue_supplies'),
+    image: getImageUrl('2_rescue_supplies.png'),
     imageHover: getImageUrl('2_rescue_supplies_hover.png'),
     size: [40, 40]
   },
   '3': {
-    image: getImageUrl('3_emergency_shelter'),
+    image: getImageUrl('3_emergency_shelter.png'),
     imageHover: getImageUrl('3_emergency_shelter_hover.png'),
-    size: [19, 31]
+    size: [40, 40]
   },
   '4': {
     image: getImageUrl('4_easy_flood_point.png'),
@@ -4148,8 +4148,8 @@ export const iconList = {
     size: [19, 31]
   },
   '5': {
-    image: getImageUrl('5_shcool.png'),
-    imageHover: getImageUrl('5_shcool_hover.png'),
+    image: getImageUrl('5_school.png'),
+    imageHover: getImageUrl('5_school_hover.png'),
     size: [40, 40]
   },
   '6': {

+ 6 - 2
src/views/globalMap/index.vue

@@ -13,6 +13,7 @@
       <SwitchMapTool :active-map="activeMap" class="tool-box" @switch-map="switchMap" />
       <!--时间轴-->
       <TimeAxis />
+      <DrawTools v-if="showDrawTools" @handleAnalysisData="handleAnalysisData" />
       <NearbyVideos v-if="showNearbyVideos" v-model="showNearbyVideos" :location="location" />
     </div>
   </div>
@@ -30,6 +31,7 @@ import { deepClone } from '@/utils';
 import { getPointInfo } from '@/api/globalMap';
 import RightMenu from './RightMenu/index.vue';
 import { PointType } from '@/api/globalMap/type';
+import DrawTools from '@/views/globalMap/RightMenu/DrawTools.vue';
 
 const rightMenuRef = ref(null);
 const mapData = reactive(logicalData);
@@ -41,7 +43,6 @@ let activeMap = ref('logical');
 const switchMap = (key) => {
   activeMap.value = key;
 };
-
 let pointType = ref<PointType[]>([]);
 let markerList = ref([]);
 const addMarkers = (item) => {
@@ -69,6 +70,7 @@ const addMarkers = (item) => {
       const data = res.data && res.data.list ? res.data?.list : [];
       markerList.value = data;
       data.forEach((item2) => {
+        debugger
         // 获取图标
         if (iconList[item2.dataType]) {
           item2.icon = iconList[item2.dataType].image;
@@ -141,7 +143,9 @@ const selectSearchMarker = (item) => {
   }
   dom.addSearchMarker(item2);
 };
-
+const handleAnalysisData = (data) => {
+  rightMenuRef.value.handleMenu('空间分析', data);
+};
 // 获取地图元素操作
 const getMap = () => {
   if (['satellite2', 'satellite3'].includes(activeMap.value)) {

+ 1 - 0
src/views/routineCommandMap/LeftSection/index.vue

@@ -238,6 +238,7 @@ onMounted(() => {
   display: flex;
   flex-direction: column;
   font-size: 36px;
+  margin-right: 65px;
 }
 .card {
   width: 100%;

+ 0 - 1
src/views/routineCommandMap/MiddleSection.vue

@@ -24,7 +24,6 @@ const handleQuery2 = () => {
 
 <style lang="scss" scoped>
 .middle-section {
-  margin: 0 91px;
   flex: 1;
   height: 2140px;
   animation: slideAndFade 1.5s;

+ 1 - 0
src/views/routineCommandMap/RightSection/index.vue

@@ -122,6 +122,7 @@ onMounted(() => {
   display: flex;
   flex-direction: column;
   font-size: 36px;
+  margin-left: 65px;
 }
 
 .card {