吉安感知网项目-前端
shuishen
2026-01-17 61ba454886313c6fde3d565f033a70b81b80eeec
applications/drone-command/src/views/detectionCountermeasure/detectionRange/DetectionRangeDialog.vue
@@ -1,7 +1,7 @@
<template>
   <el-dialog
      v-model="visible"
      class="ztzf-page-map-view-dialog"
      class="command-page-map-view-dialog"
      :show-close="false"
      :close-on-click-modal="false"
      destroy-on-close
@@ -9,7 +9,15 @@
   >
      <div class="dialog-container">
         <div class="left-container">
            <div class="leftMap ztzf-cesium" id="detectionRangeMap"></div>
            <CommonCesiumMap
               ref="mapRef"
               class="leftMap command-cesium"
               :active="visible"
               :flat-mode="false"
               :terrain="true"
               :layer-mode="4"
               :boundary="false"
            />
         </div>
         <div class="right-container">
@@ -47,8 +55,8 @@
            <el-form v-else ref="formRef" class="dialog-form" :model="formData" :rules="rules" label-width="110px">
               <el-form-item label="侦测设备" prop="deviceId">
                  <el-select
                     class="ztzf-data-cockpit-select"
                     popper-class="ztzf-data-cockpit-select-popper"
                     class="command-data-cockpit-select"
                     popper-class="command-data-cockpit-select-popper"
                     v-model="formData.deviceId"
                     placeholder="请选择"
                     clearable
@@ -59,8 +67,8 @@
               </el-form-item>
               <el-form-item label="设备类型" prop="deviceType">
                  <el-select
                     class="ztzf-data-cockpit-select"
                     popper-class="ztzf-data-cockpit-select-popper"
                     class="command-data-cockpit-select"
                     popper-class="command-data-cockpit-select-popper"
                     v-model="formData.deviceType"
                     placeholder="请选择"
                     clearable
@@ -75,7 +83,7 @@
               </el-form-item>
               <el-form-item label="设备位置" prop="deployLocation">
                  <el-input
                     class="ztzf-data-cockpit-search-input"
                     class="command-data-cockpit-search-input"
                     v-model="formData.deployLocation"
                     disabled
                     placeholder="请选择位置"
@@ -87,7 +95,7 @@
               </el-form-item>
               <el-form-item label="设备编号" prop="deviceSn">
                  <el-input
                     class="ztzf-data-cockpit-search-input"
                     class="command-data-cockpit-search-input"
                     v-model="formData.deviceSn"
                     placeholder="请输入"
                     clearable
@@ -95,7 +103,7 @@
               </el-form-item>
               <el-form-item label="设备型号" prop="deviceModel">
                  <el-input
                     class="ztzf-data-cockpit-search-input"
                     class="command-data-cockpit-search-input"
                     v-model="formData.deviceModel"
                     placeholder="请输入"
                     clearable
@@ -103,7 +111,7 @@
               </el-form-item>
               <el-form-item label="覆盖范围(m)" prop="effectiveRangeKm">
                  <el-input-number
                     class="ztzf-data-cockpit-search-input"
                     class="command-data-cockpit-search-input"
                     v-model="formData.effectiveRangeKm"
                     :min="0"
                     :precision="2"
@@ -138,7 +146,7 @@
   detectionRangePageApi,
   detectionRangeSubmitApi,
} from '@/api/detectionCountermeasure/detectionRange'
import { PublicCesium } from '@/utils/cesium/publicCesium'
import CommonCesiumMap from '@/components/map-container/common-cesium-map.vue'
import * as Cesium from 'cesium'
import deviceZcImg from '@/assets/images/dataCockpit/device-zc.svg'
@@ -161,6 +169,7 @@
const submitting = ref(false) // 提交中
const deviceOptions = ref([])
const dialogReadonly = computed(() => dialogMode.value === 'view')
const mapRef = ref(null)
let viewer
let redPointEntity
let rangeCircleEntity
@@ -338,17 +347,12 @@
function initMap() {
   if (viewer) return
   const publicCesiumInstance = new PublicCesium({
      dom: 'detectionRangeMap',
      flatMode: false,
      terrain: true,
      layerMode: 4,
      boundary: false,
   })
   const map = mapRef.value?.getMap()
   if (!map?.viewer) return
   viewer = map.viewer
   if (!dialogReadonly.value) {
      publicCesiumInstance.addLeftClickEvent(null, handleMapClick)
      map.publicCesium?.addLeftClickEvent?.(null, handleMapClick)
   }
   viewer = publicCesiumInstance.getViewer()
}
function handleMapClick(click) {