Kaynağa Gözat

修复打开视频点位,移动地图会再次打开问题

Hwf 3 hafta önce
ebeveyn
işleme
60909d5549

+ 5 - 1
src/components/HKVideo/video-dialog.vue

@@ -8,6 +8,7 @@
     hide-footer
     height="500px"
     draggable
+    @close="handleClose"
     @changeTagsData="changeTagsData"
   >
     <div class="video-box">
@@ -24,7 +25,7 @@ interface Props {
 }
 
 const props = defineProps<Props>();
-const emits = defineEmits(['update:modelValue', 'changeTagsData']);
+const emits = defineEmits(['update:modelValue', 'changeTagsData', 'close']);
 const show = computed({
   get() {
     return props.modelValue;
@@ -36,6 +37,9 @@ const show = computed({
 const changeTagsData = (data: any) => {
   emits('changeTagsData', data);
 };
+const handleClose = () => {
+  emits('close');
+};
 </script>
 
 <style lang="scss" scoped>

+ 16 - 11
src/hooks/AMap/useAMap.ts

@@ -415,20 +415,24 @@ export function useAMap(options) {
     map.setStatus({ zoomEnable: true });
     if (!!infoWindow) {
       infoWindow.close();
-      if (!!clickMarker && flag) {
-        const extData = clickMarker.getExtData ? clickMarker.getExtData() : clickMarker;
-        for (let i = 0; i < addPoints.length; i++) {
-          if (addPoints[i].id === extData.id) {
-            addPoints[i].icon = addPoints[i].image;
-            clickMarker.setContent(getContent(addPoints[i].icon, addPoints[i].size));
-            clickMarker = null;
-            // addMarker(addPoints);
-            break;
-          }
-        }
+      if (flag) {
+        clearHoverMarker();
       }
     }
   };
+  const clearHoverMarker = () => {
+    if (!!clickMarker) {
+      const extData = clickMarker.getExtData ? clickMarker.getExtData() : clickMarker;
+      for (let i = 0; i < addPoints.length; i++) {
+        if (addPoints[i].id === extData.id) {
+          addPoints[i].icon = addPoints[i].image;
+          clickMarker.setContent(getContent(addPoints[i].icon, addPoints[i].size));
+          clickMarker = null;
+          break;
+        }
+      }
+    }
+  }
   let maskPolygon;
   const creatMask = (options, name = '茂名市') => {
     new AMap.DistrictSearch({
@@ -805,6 +809,7 @@ export function useAMap(options) {
     getScale,
     showInfo,
     hideInfo,
+    clearHoverMarker,
     creatMask,
     removeMask,
     creatMask2,

+ 6 - 1
src/utils/olMap/olMap.ts

@@ -988,7 +988,12 @@ export class olMap {
   hideInfo(flag?: boolean) {
     this.map.removeOverlay(this.infoWindow);
     this.infoWindow = null;
-    if (!!flag && this.clickMarker) {
+    if (!!flag) {
+      this.clearHoverMarker();
+    }
+  }
+  clearHoverMarker() {
+    if (this.clickMarker) {
       const selectData = this.clickMarker.get('extData');
       this.clickMarker.setStyle(
         new Style({

+ 5 - 1
src/views/globalMap/index.vue

@@ -51,7 +51,7 @@
       <!--应急人员详情-->
       <EmergencyCrew v-if="showPeople" v-model="showPeople" :id="teamId" />
       <!--视频详情-->
-      <VideoDialog v-if="showVideoDetail" v-model="showVideoDetail" :videoMonitorData="videoDetail" />
+      <VideoDialog v-if="showVideoDetail" v-model="showVideoDetail" :videoMonitorData="videoDetail" @close="handleVideoDetailClose" />
     </div>
   </div>
 </template>
@@ -413,6 +413,10 @@ const handleShowVideo2 = (data, flag) => {
   videoDetail.value = data;
   showVideoDetail.value = true;
 };
+const handleVideoDetailClose = () => {
+  videoDetail.value = [];
+  mapUtils.clearHoverMarker();
+};
 const handleClickMap = (e) => {
   if (mapStore.isAMap) {
     location.value = [e.lnglat.lng, e.lnglat.lat];