吉安感知网项目-前端
shuishen
2026-02-03 89380e6260a75d1d3b94de687ebcc2f50d50659d
applications/drone-command/src/views/areaManage/defenseZone/FormDiaLog.vue
@@ -15,10 +15,12 @@
         <div class="right-container">
            <div class="header">
               {{ titleEnum[dialogMode] }}
               <span>{{ titleEnum[dialogMode] }}</span>
               <el-icon class="close-btn" @click.stop="visible = false"><Close /></el-icon>
            </div>
            <div class="dialog-container" v-if="readonly">
            <div class="content" v-if="readonly">
               <div class="detail-title">防区详情</div>
               <el-row>
                  <el-col :span="24">
@@ -34,11 +36,11 @@
               <div class="detail-title">关联场景</div>
               <div class="command-table-container">
                  <div class="command-table-content">
                     <el-table class="command-data-cockpit-table" :data="sceneList" row-key="id">
                     <el-table class="command-table" :data="sceneList" row-key="id">
                        <el-table-column prop="sceneName" label="场景名称" />
                        <el-table-column prop="sceneType" label="场景类型">
                           <template v-slot="{ row }">
                              {{ getDictLabel(row.sceneType, dictObj.sceneType) }}
                              {{ getDictLabel(row.sceneType, dictObj.CommandSceneType) }}
                           </template>
                        </el-table-column>
                     </el-table>
@@ -49,7 +51,7 @@
            <el-form class="dialog-form" v-else ref="formRef" :model="formData" :rules="rules" :disabled="readonly"
               label-width="96px">
               <el-form-item label="防区名称" prop="zoneName">
                  <el-input class="command-data-cockpit-search-input" v-model="formData.zoneName" maxlength="50"
                  <el-input class="command-input" v-model="formData.zoneName" maxlength="50"
                     placeholder="请输入" clearable />
               </el-form-item>
               <el-form-item label="防区面积" prop="zoneArea">
@@ -62,19 +64,19 @@
                        关联场景
                     </div>
                     <el-input class="command-data-cockpit-search-input" v-model="searchName" placeholder="请输入"
                     <el-input class="command-input" v-model="searchName" placeholder="请输入"
                        clearable></el-input>
                  </div>
                  <el-form-item prop="defenseSceneIds" label-width="0">
                     <el-table class="command-data-cockpit-table" ref="sceneTableRef"
                     <el-table class="command-table" ref="sceneTableRef"
                        :data="sceneList.filter(item => item.sceneName.includes(searchName))" row-key="id"
                        @selection-change="handleSceneSelectionChange">
                        <el-table-column type="selection" width="55" :reserve-selection="true" />
                        <el-table-column prop="sceneName" label="场景名称" />
                        <el-table-column prop="sceneType" label="场景类型">
                           <template v-slot="{ row }">
                              {{ getDictLabel(row.sceneType, dictObj.sceneType) }}
                              {{ getDictLabel(row.sceneType, dictObj.CommandSceneType) }}
                           </template>
                        </el-table-column>
                     </el-table>
@@ -83,7 +85,7 @@
            </el-form>
            <div class="footer">
               <el-button color="#2B2B4C" @click="handleCancel">{{ readonly ? '关闭' : '取消' }}</el-button>
               <el-button v-if="dialogMode != 'view'" color="#2B2B4C" @click="handleCancel">{{ readonly ? '关闭' : '取消' }}</el-button>
               <el-button color="#284FE3" v-if="!readonly" type="primary" :loading="submitting"
                  :disabled="submitting" @click="handleSubmit">
                  确定
@@ -95,16 +97,20 @@
</template>
<script setup>
import { Close } from '@element-plus/icons-vue'
import { computed, inject, nextTick, ref } from 'vue'
import { ElMessage } from 'element-plus'
import { fwDefenseZoneDetailApi, fwDefenseZoneSubmitApi } from './defenseZoneApi'
import { fwDefenseSceneListApi } from '@/views/areaManage/sceneConfig/sceneConfigApi'
import { fieldRules, geomAnalysis, getDictLabel } from '@ztzf/utils'
import CommonCesiumMap from '@/components/map-container/common-cesium-map.vue'
import { DrawPolygon } from '@/utils/cesium/DrawPolygon'
import { DrawPolygon } from '@ztzf/utils'
import { cartesian3Convert } from '@/utils/cesium/mapUtil'
import * as turf from '@turf/turf'
import * as Cesium from 'cesium'
import { saveOperationLog } from '@ztzf/apis'
import { useRoute } from 'vue-router'
// 初始化表单
const initForm = () => ({
@@ -128,13 +134,14 @@
const selectedSceneRows = ref([]) // 选中场景
const dictObj = inject('dictObj')
const mapRef = ref(null)
const route = useRoute()
let viewer
let drawPolygonExample
let pointList = []
const rules = {
   zoneName: fieldRules(true, 50),
   defenseSceneIds: fieldRules(true),
   defenseSceneIds: fieldRules(false),
   zoneArea: fieldRules(true),
}
@@ -158,6 +165,11 @@
      const str = [...pointList, pointList[0]].map(item => `${item.longitude} ${item.latitude}`).join(',')
      formData.value.geom = `POLYGON((${str}))`
      await fwDefenseZoneSubmitApi(formData.value)
      saveOperationLog({
         requestUri: route.path,
         title: `${route.name || '防区管理'}-${dialogMode.value === 'add' ? '新增' : '编辑'}`,
         type: 1,
      })
      ElMessage.success(dialogMode.value === 'add' ? '新增成功' : '更新成功')
      visible.value = false
      emit('success')