From 9612691947c7be66a5a02aa577f58a5df9604916 Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Tue, 13 Jan 2026 10:04:30 +0800
Subject: [PATCH] feat: 管控，类型用字典
---
applications/drone-command/src/views/areaManage/partition/FormDiaLog.vue | 53 +++++++++-----------------
applications/drone-command/src/views/areaManage/partition/index.vue | 38 +++++++++++--------
2 files changed, 41 insertions(+), 50 deletions(-)
diff --git a/applications/drone-command/src/views/areaManage/partition/FormDiaLog.vue b/applications/drone-command/src/views/areaManage/partition/FormDiaLog.vue
index c5b99ab..d6979f0 100644
--- a/applications/drone-command/src/views/areaManage/partition/FormDiaLog.vue
+++ b/applications/drone-command/src/views/areaManage/partition/FormDiaLog.vue
@@ -12,10 +12,10 @@
<div>区域位置: {{ formatLocation(formData) }}</div>
</el-col>
<el-col :span="24">
- <div>区域面积: {{ formData.areaSize }}</div>
+ <div>区域面积: {{ formData.areaSize }}㎡</div>
</el-col>
<el-col :span="24">
- <div>区域类型: {{ getOptionLabel(formData.areaType, areaTypeOptions) }}</div>
+ <div>区域类型: {{ getDictLabel(formData.areaType, dictObj.areaType) }}</div>
</el-col>
<el-col :span="24">
<div>触发条件: {{ formData.triggerCondition }}</div>
@@ -24,7 +24,7 @@
<div>响应机制: {{ formData.responseMechanism }}</div>
</el-col>
<el-col :span="24">
- <div>管控级别: {{ getOptionLabel(formData.controlLevel, controlLevelOptions) }}</div>
+ <div>管控级别: {{ getDictLabel(formData.controlLevel, dictObj.controlLevel) }}</div>
</el-col>
<el-col :span="24">
<div>关联派出所: {{ formData.policeStationName }}</div>
@@ -48,17 +48,17 @@
</el-col>
<el-col :span="24">
<el-form-item label="区域面积" prop="areaSize">
- {{ formData.areaSize }}
+ {{ formData.areaSize }}㎡
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="区域类型" prop="areaType">
<el-select v-model="formData.areaType" placeholder="请选择" clearable>
<el-option
- v-for="item in areaTypeOptions"
- :key="item.value"
- :label="item.label"
- :value="item.value"
+ v-for="item in dictObj.areaType"
+ :key="item.dictKey"
+ :label="item.dictValue"
+ :value="item.dictKey"
/>
</el-select>
</el-form-item>
@@ -77,10 +77,10 @@
<el-form-item label="管控级别" prop="controlLevel">
<el-select v-model="formData.controlLevel" placeholder="请选择" clearable>
<el-option
- v-for="item in controlLevelOptions"
- :key="item.value"
- :label="item.label"
- :value="item.value"
+ v-for="item in dictObj.controlLevel"
+ :key="item.dictKey"
+ :label="item.dictValue"
+ :value="item.dictKey"
/>
</el-select>
</el-form-item>
@@ -131,10 +131,10 @@
</template>
<script setup>
-import { computed, nextTick, onMounted, ref, watch } from 'vue'
+import { computed, inject, nextTick, onMounted, ref, watch } from 'vue'
import { ElMessage } from 'element-plus'
import { fwAreaDivideDetailApi, fwAreaDivideSubmitApi, fwDevicePageApi, fwPoliceStationPageApi } from './partitionApi'
-import { fieldRules } from '@ztzf/utils'
+import { fieldRules, getDictLabel } from '@ztzf/utils'
import { PublicCesium } from '@/utils/cesium/publicCesium'
import { DrawPolygon } from '@/utils/cesium/DrawPolygon'
import { cartesian3Convert } from '@/utils/cesium/mapUtil'
@@ -156,16 +156,6 @@
triggerCondition: '', // 触发条件
})
-const areaTypeOptions = [
- { label: '报警区', value: '报警区' },
- { label: '重点管制区', value: '重点管制区' },
-]
-const controlLevelOptions = [
- { label: '日常', value: '日常' },
- { label: '重点', value: '重点' },
- { label: '严密', value: '严密' },
-]
-
const emit = defineEmits(['success'])
const formRef = ref(null) // 表单实例
const formData = ref(initForm()) // 表单数据
@@ -178,6 +168,7 @@
const deviceIdList = ref([]) // 关联设备ID
const policeStationOptions = ref([]) // 关联派出所
const deviceOptions = ref([]) // 关联设备
+const dictObj = inject('dictObj')
let viewer
let drawPolygonExample
let pointList = []
@@ -204,7 +195,7 @@
formData.value.flyDateEnd = end || ''
formData.value.deviceIds = deviceIdList.value.length ? deviceIdList.value.join(',') : ''
let str = [...pointList, pointList[0]].map(item => `${item.longitude} ${item.latitude}`).join(',')
- formData.value.geom = `POLYGON((${str})) | 4326`
+ formData.value.geom = `POLYGON((${str}))`
await fwAreaDivideSubmitApi(formData.value)
ElMessage.success(dialogMode.value === 'add' ? '新增成功' : '更新成功')
visible.value = false
@@ -226,19 +217,13 @@
// 格式化区域位置
function formatLocation(row) {
if (row?.longitude == null || row?.latitude == null) return ''
- return `${row.longitude}, ${row.latitude}`
+ return `${_.round(row.longitude,6)}, ${_.round(row.latitude,6)}`
}
// 格式化可飞行时间段
function formatFlyDate(row) {
if (!row?.flyDateStart && !row?.flyDateEnd) return ''
return `${row.flyDateStart || '-'} ~ ${row.flyDateEnd || '-'}`
-}
-
-// 获取选项文本
-function getOptionLabel(value, options) {
- const match = options.find(item => item.value === value)
- return match?.label ?? value ?? ''
}
// 初始化地图实例
@@ -280,10 +265,10 @@
if (!str) return []
return str
.replace('POLYGON((', '')
- .replace(')) | 4326', '')
+ .replace('))', '')
.split(',')
.map(pair => {
- const [lat, lon] = pair.trim().split(' ').map(Number)
+ const [lon, lat] = pair.trim().split(' ').map(Number)
return [lon, lat]
})
}
diff --git a/applications/drone-command/src/views/areaManage/partition/index.vue b/applications/drone-command/src/views/areaManage/partition/index.vue
index 11bbd56..b9a8769 100644
--- a/applications/drone-command/src/views/areaManage/partition/index.vue
+++ b/applications/drone-command/src/views/areaManage/partition/index.vue
@@ -10,7 +10,12 @@
<el-col :span="4">
<el-form-item label="区域类型" prop="areaType">
<el-select v-model="searchParams.areaType" placeholder="请选择" clearable @change="handleSearch">
- <el-option v-for="item in areaTypeOptions" :key="item.value" :label="item.label" :value="item.value" />
+ <el-option
+ v-for="item in dictObj.areaType"
+ :key="item.dictKey"
+ :label="item.dictValue"
+ :value="item.dictKey"
+ />
</el-select>
</el-form-item>
</el-col>
@@ -38,14 +43,14 @@
<el-table-column prop="areaSize" label="区域面积" />
<el-table-column prop="areaType" label="区域类型">
<template v-slot="{ row }">
- {{ getOptionLabel(row.areaType, areaTypeOptions) }}
+ {{ getDictLabel(row.areaType, dictObj.areaType) }}
</template>
</el-table-column>
<el-table-column prop="triggerCondition" label="触发条件" />
<el-table-column prop="responseMechanism" label="响应机制" />
<el-table-column prop="controlLevel" label="管控级别">
<template v-slot="{ row }">
- {{ getOptionLabel(row.controlLevel, controlLevelOptions) }}
+ {{ getDictLabel(row.controlLevel, dictObj.controlLevel) }}
</template>
</el-table-column>
<el-table-column prop="policeStationName" label="关联派出所" />
@@ -80,6 +85,8 @@
import { ElMessage, ElMessageBox } from 'element-plus'
import { fwAreaDividePageApi, fwAreaDivideRemoveApi } from './partitionApi'
import FormDiaLog from './FormDiaLog.vue'
+import { getDictionaryByCode } from '@/api/system/dictbiz'
+import { getDictLabel } from '@ztzf/utils'
const initSearchParams = () => ({
areaName: '', // 区域名称
@@ -87,16 +94,6 @@
current: 1, // 当前页
size: 10, // 每页大小
})
-
-const areaTypeOptions = [
- { label: '报警区', value: '报警区' },
- { label: '重点管制区', value: '重点管制区' },
-]
-const controlLevelOptions = [
- { label: '日常', value: '日常' },
- { label: '重点', value: '重点' },
- { label: '严密', value: '严密' },
-]
const searchParams = ref(initSearchParams()) // 查询参数
const total = ref(0) // 总条数
@@ -158,9 +155,17 @@
return `${row.flyDateStart || '-'} ~ ${row.flyDateEnd || '-'}`
}
-function getOptionLabel(value, options) {
- const match = options.find(item => item.value === value)
- return match?.label ?? value ?? ''
+const dictObj = ref({
+ areaType: [], //区域类型
+ controlLevel: [], //管控级别
+})
+provide('dictObj', dictObj)
+
+// 获取字典
+function getDictList() {
+ getDictionaryByCode('areaType,controlLevel').then(res => {
+ dictObj.value = res.data.data
+ })
}
// 新增/编辑/查看 弹框
@@ -173,6 +178,7 @@
onMounted(() => {
getList()
+ getDictList()
})
</script>
<style scoped lang="scss"></style>
--
Gitblit v1.9.3