second commit

2025-12-25 18:33:15 +08:00
parent 78407f1cbd
commit 6a6ddba71a
34 changed files with 527 additions and 1226 deletions
--- a/src/components/Map/index.vue
+++ b/src/components/Map/index.vue
@@ -113,12 +113,35 @@ const addMonitorToMap = () => {
          id: item.id,
          symbol: $configs.getDevicePointSymbol('_monitor', { ...item, name: item.videoName }),
          properties: item,
-          zIndex: 1
+          zIndex: 2
        }
      )
      marker.addTo(vector.monitor)
      drawSector('_monitor', [ item.longitude, item.latitude ], 5 * 1000, item.id, 30)
      marker.on('click', (evt) => {
+        // 先隐藏所有扇形
+        changeSectorsInLayer('sectors_monitor', false)
+
+        // 确保扇形图层是可见的
+        if (!vector.sectors_monitor.isVisible()) {
+          vector.sectors_monitor.show()
+        }
+
+        // 显示当前点击项的所有相关扇形（圆、椭圆、线）
+        const baseId = `sector__monitor${item.id}`
+        const circleGeometry = vector.sectors_monitor.getGeometryById(baseId + '_circle')
+        const ellipseGeometry = vector.sectors_monitor.getGeometryById(baseId + '_ellipse')
+        const lineGeometry = vector.sectors_monitor.getGeometryById(baseId + '_line')
+
+        if (circleGeometry) {
+          circleGeometry.show()
+        }
+        if (ellipseGeometry) {
+          ellipseGeometry.show()
+        }
+        if (lineGeometry) {
+          lineGeometry.show()
+        }
        mapStore.updateWindowInfo({ visible: true, type: '_monitor', data: { ...item } })
      })
    }
@@ -144,18 +167,46 @@ const addUAVToMap = () => {
          id: item.id,
          symbol: $configs.getDevicePointSymbol('_UAV', { ...item, name: item.videoName }),
          properties: item,
-          zIndex: 1
+          zIndex: 2
        }
      )
      marker.addTo(vector.UAV)
      drawSector('_UAV', [ item.longitude, item.latitude ], 5 * 1000, item.id)
      marker.on('click', (evt) => {
+        // 先隐藏所有扇形
+        changeSectorsInLayer('sectors_UAV', false)
+
+        // 确保扇形图层是可见的
+        if (!vector.sectors_UAV.isVisible()) {
+          vector.sectors_UAV.show()
+        }
+
+        // 显示当前点击项的所有相关扇形（圆、椭圆、线）
+        const baseId = `sector__UAV${item.id}`
+        const circleGeometry = vector.sectors_UAV.getGeometryById(baseId + '_circle')
+
+        if (circleGeometry) {
+          circleGeometry.show()
+        }
        mapStore.updateWindowInfo({ visible: true, type: '_UAV', data: { ...item } })
      })
    }
  })
  vector.UAV.show()
 }
+// 添加辅助函数来隐藏所有扇形
+const changeSectorsInLayer = (layerName, show) => {
+  if (vector[layerName]) {
+    const allGeometries = vector[layerName].getGeometries()
+    allGeometries.forEach(geometry => {
+      if(show) {
+        geometry.show()
+      }else{
+        geometry.hide()
+      }
+    })
+  }
+}
 // 需要监控的起始角度和结束角度,修改视野范围可以传递经纬度坐标
 const drawSector = (type, center, radius, id, angle) => {
  const sectorId = `sector_${type}${id}`
@@ -171,7 +222,7 @@ const drawSector = (type, center, radius, id, angle) => {
  }

  let circle = new maptalks.Circle(center, radius, {
-     id: sectorId,
+    id: sectorId + '_circle',
    symbol: {
      lineColor: '#1CA8FF',
      lineWidth: 1,
@@ -182,12 +233,14 @@ const drawSector = (type, center, radius, id, angle) => {
  })
  if(angle) {
    let ellipse = new maptalks.Sector(center, radius - 1 * 1000, angle - 30, angle + 30, {
+      id: sectorId + '_ellipse',
      symbol: {
        lineColor: '#FF8D1C',
        polygonFill: '#ff8d1c29'
      }
    })
    let line = new maptalks.Sector(center, radius + 1 * 1000, angle, angle, {
+      id: sectorId + '_line',
      symbol: {
        lineColor: '#FF8D1C',
        polygonFill: '#ff8d1c29',
@@ -199,7 +252,8 @@ const drawSector = (type, center, radius, id, angle) => {
    vector['sectors' + type].addGeometry(circle)
  }
  // 添加到可视域图层
-    vector['sectors' + type].hide()
+  changeSectorsInLayer('sectors' + type, false)
+    // vector['sectors' + type].hide()
  }
 /**
 * 叠加ais基站数据
@@ -219,7 +273,7 @@ const addAisStationToMap = () => {
          id: item.id,
          symbol: $configs.getDevicePointSymbol('_ais_station', { ...item }),
          properties: item,
-          zIndex: 1
+          zIndex: 2
        }
      )
      marker.addTo(vector.ais_station)
@@ -247,7 +301,7 @@ const addEnvironmentalToMap = () => {
          id: item.id,
          symbol: $configs.getDevicePointSymbol('_environmental', { ...item }),
          properties: item,
-          zIndex: 1
+          zIndex: 2
        }
      )
      marker.addTo(vector.environmental)
@@ -336,18 +390,22 @@ watch(() => fence.value, () => {
 watch(() => sector.value.monitor, (newVal) => {
  if(vector.sectors_monitor) {
    if(newVal) {
-      vector.sectors_monitor.show()
+      // vector.sectors_monitor.show()
+      changeSectorsInLayer('sectors_monitor', true)
    } else {
-      vector.sectors_monitor.hide()
+      // vector.sectors_monitor.hide()
+      changeSectorsInLayer('sectors_monitor', false)
    }
  }
 })
 watch(() => sector.value.UAV, (newVal) => {
  if(vector.sectors_UAV) {
    if(newVal) {
-      vector.sectors_UAV.show()
+      // vector.sectors_UAV.show()
+      changeSectorsInLayer('sectors_UAV', true)
    } else {
-      vector.sectors_UAV.hide()
+      // vector.sectors_UAV.hide()
+      changeSectorsInLayer('sectors_UAV', false)
    }
  }
 })
@@ -425,6 +483,8 @@ onUnmounted(() => {
  border-radius: 0;
  padding: 0;
  .el-dialog__header{
+    display: flex;
+    justify-content: space-between;
    padding: 0 16px;
    background: linear-gradient(0deg, rgba(10, 169, 255, 0) 0%, rgba(10, 169, 255, 0.5) 100%);
    .title{
--- a/src/components/Map/lbtbox/boatTerminal.js
+++ b/src/components/Map/lbtbox/boatTerminal.js
@@ -54,16 +54,16 @@ const setStyleToBoatLayer = (key, zIndex) => {
                type: 'interval',
                stops: [
                  [ 5, 5 ],
-                  [ 10, 10 ],
-                  [ 11, 0 ]
+                  [ 10, 10 ]
+                  // [ 11, 0 ]
                ]
              },
              markerHeight: {
                type: 'interval',
                stops: [
                  [ 5, 10 ],
-                  [ 10, 20 ],
-                  [ 11, 0 ]
+                  [ 10, 20 ]
+                  // [ 11, 0 ]
                ]
              },
              markerFill: {
--- a/src/components/Map/map-config.js
+++ b/src/components/Map/map-config.js
@@ -2,7 +2,8 @@ import { getAssetsFile } from '@/utils/common'
 // 底图配置
 const baseLayerConfig = {
  baseConfig: {
-    satellite: [ 'tdt_image', 'tdt_cia' ],
+    // satellite: [ 'tdt_image', 'tdt_cia' ],
+    satellite: [ 'tdt_image' ],
    sea: [ 'sea' ],
    light: [ 'light' ],
    dark: [ 'tdt_ter', 'tdt_tbo', 'tdt_cta' ]
@@ -39,7 +40,8 @@ const baseLayerConfig = {
      maxAvailableZoom: 18,
      subdomains: [ '0', '1', '2', '3', '4', '5', '6', '7' ],
      urlTemplate:
-        'https://inner.qdlimap.cn:9443/gisAssistant/wmts/grid_tile/tianditu/img_w/{z}/{y}/{x}'
+      'http://198.16.74.211:5000/{z}/{x}/{y}.png'
+        // 'https://inner.qdlimap.cn:9443/gisAssistant/wmts/grid_tile/tianditu/img_w/{z}/{y}/{x}'
    },
    tdt_tbo: {
      max: 18,
--- a/src/components/Map/window/index.vue
+++ b/src/components/Map/window/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <DialogComponent @mousedown="drag" :style="{ resize: 'both', overflow: 'auto' }" v-if="visible && option[type]" :title="option[type].title" :width="type==='_UAV' ? 1800:395" :draggable="true" :modal="false" @close="close">
+  <DialogComponent @mousedown="drag" @resize="handleResize" :style="{ resize: 'both', overflow: 'auto' }" v-if="visible && option[type]" :title="option[type].title" :width="type==='_UAV' ? 1800:395" :draggable="true" :modal="false" @close="close">
    <component :is="option[type].component" ref="component"/>
  </DialogComponent>
 </template>
@@ -11,7 +11,7 @@ import MonitorComponent from './monitor.vue'
 import UAVComponent from './uav.vue'
 import MeteorologyComponent from './meteorology.vue'
 import useMapStore from '@/store/modules/map'
-import { dragEvent } from '@/utils/common'
+import { dragEvent, resizeEvent } from '@/utils/common'

 const mapStore = useMapStore()

@@ -43,12 +43,22 @@ const close = () => {
 *
 */
 const drag = (e) => {
-  dragEvent(e, 'el-dialog-title', () => {
-    if(component.value.HikCCTV) {
-      component.value.HikCCTV.initResize(false)
-    }
-  })
+  if(e.target.className.includes('el-dialog-title')) {
+     dragEvent(e, 'el-dialog-title', () => {
+      if(component.value.HikCCTV) {
+        component.value.HikCCTV.initResize(false)
+      }
+    })
+  }else{
+    resizeEvent(e, 'el-dialog', () => {
+      if(component.value?.HikCCTV) {
+        component.value.HikCCTV.initResize()
+      }
+    })
+  }
+
 }
+
 </script>

 <style lang="scss" scoped>
--- a/src/components/Map/window/monitor.vue
+++ b/src/components/Map/window/monitor.vue
@@ -169,7 +169,8 @@ defineExpose({
  }
 }
 .monitor-cctv{
-    height: 289px;
+    min-height: 289px;
    width: 100%;
+    height: -webkit-fill-available;
 }
 </style>=>
--- a/src/components/Map/window/trawler.vue
+++ b/src/components/Map/window/trawler.vue
@@ -205,10 +205,8 @@ const handleExitServo = () => {
 const handleTrack = () => {
  globalMap = GlobalMap.instance
  findAISPointPositionByMmsi({ mmsi: data.value.terminalCode }).then(res => {
-    if (res.success) {
-      const arr = res.result[data.value.terminalCode]
+      const arr = res.data[data.value.terminalCode]
      new ShipPathInMap(globalMap.map, globalMap.map.getLayer('track'), formatTrackData(arr))
-    }
  }).finally(() => {
    mapStore.updateWindowInfo(false)
  })