From e17c0a2eceac008182504bdd40143658ab494c0b Mon Sep 17 00:00:00 2001
From: 张含笑 <zhx18749296735@163.com>
Date: Wed, 29 Oct 2025 16:52:01 +0800
Subject: [PATCH] feat:新增/编辑
---
src/views/layerManagement/components/rightEdit.vue | 105 +++++++++++++++++++++++++++++++++++++++++++++++-----
1 files changed, 94 insertions(+), 11 deletions(-)
diff --git a/src/views/layerManagement/components/rightEdit.vue b/src/views/layerManagement/components/rightEdit.vue
index d56e34c..d8ab6ae 100644
--- a/src/views/layerManagement/components/rightEdit.vue
+++ b/src/views/layerManagement/components/rightEdit.vue
@@ -18,13 +18,13 @@
<div class="itemRow">
<div class="label">围栏名称</div>
<div>
- <el-input class="ztzf-input inputName" v-model="detailData.name" placeholder="围栏名称" />
+ <el-input class="ztzf-input inputName" v-model="formData.name" placeholder="围栏名称" />
</div>
</div>
<div class="itemRow">
<div class="label">围栏备注</div>
<div>
- <el-input v-model="detailData.description" :rows="5" type="textarea" placeholder="请输入" />
+ <el-input v-model="formData.description" :rows="5" type="textarea" placeholder="请输入" />
</div>
</div>
</div>
@@ -42,11 +42,11 @@
<div class="infpItem">
<div class="itemData">
<div class="title">创建时间</div>
- <div class="num"><span>{{detailData.create_time}}</span></div>
+ <div class="num"><span>{{formData?.create_time}}</span></div>
</div>
<div class="itemData">
<div class="title">创建人</div>
- <div class="num"><span>{{detailData.create_name}}</span></div>
+ <div class="num"><span>{{formData?.create_name}}</span></div>
</div>
</div>
</div>
@@ -61,6 +61,28 @@
import { deitFenceApi } from '@/api/layer/index';
const emit = defineEmits([ 'callParentMethod']);
const layerParams = inject('layerParams');
+const options = [
+ {
+ value: 'Option1',
+ label: '111',
+ },
+ {
+ value: 'Option2',
+ label: 'Option2',
+ },
+ {
+ value: 'Option3',
+ label: 'Option3',
+ },
+ {
+ value: 'Option4',
+ label: 'Option4',
+ },
+ {
+ value: 'Option5',
+ label: 'Option5',
+ },
+]
const formData = ref({
folder_id: '',
name: '',
@@ -73,15 +95,29 @@
geo_data: '',
});
const detailData = ref(null)
+const totalArea = ref(null)
+const totalCount = ref(null)
detailData.value = layerParams.value.editDetailData
-const totalArea = layerParams.value.total_area
-const totalCount = layerParams.value.total_count
-console.log('layerParams',detailData.value
-);
+ totalArea.value = layerParams.value.total_area
+ totalCount.value = layerParams.value.total_count
+console.log('2222222',layerParams.value.decideWhetherToAddOrEdit);
-const cancelHandel = () => {
+const clearAllData = () => {
+ detailData.value = {}
+ // 清空回显相关数据
+ detailData.value = {};
+ totalArea.value = null;
+ totalCount.value = null;
+ // 重置判断状态（可选，根据业务需求是否需要）
+ layerParams.value.decideWhetherToAddOrEdit = 1;
+ // 重置面板状态和缓存数据
layerParams.value.addNest = false;
layerParams.value.editNest = false;
+ layerParams.value.editDetailData = null;
+ layerParams.value.polygonPosition = null;
+};
+const cancelHandel = () => {
+ clearAllData()
emit('callParentMethod');
};
const submitHandle = () => {
@@ -99,10 +135,57 @@
console.log('保存',res);
})
- layerParams.value.addNest = false;
- layerParams.value.editNest = false;
+ clearAllData()
emit('callParentMethod');
};
+onMounted(() => {
+ // 先清空表单，避免残留旧数据
+ formData.value = {
+ folder_id: '',
+ name: '',
+ description: '',
+ is_enabled: false,
+ area: '',
+ altitude: '',
+ control_start_time: '',
+ control_end_time: '',
+ geo_data: '',
+ };
+
+ // 获取判断状态（默认设为 1，防止未定义时报错）
+ const addOrEditStatus = layerParams.value.decideWhetherToAddOrEdit || 1;
+
+ if (addOrEditStatus === 2) {
+ // 编辑状态：回显数据（从 layerParams.editDetailData 读取）
+ const editData = layerParams.value.editDetailData || {};
+ // 表单数据回显（将编辑数据赋值给 formData，与表单字段一一对应）
+ formData.value = {
+ folder_id: editData.folder_id || '', // 文件夹ID（需与下拉框 options 的 value 匹配）
+ name: editData.name || '', // 围栏名称
+ description: editData.description || '', // 围栏备注
+ is_enabled: editData.is_enabled || false, // 是否启用
+ area: editData.area || '', // 面积
+ altitude: editData.altitude || '', // 高度
+ control_start_time: editData.control_start_time || '', // 控制开始时间
+ control_end_time: editData.control_end_time || '', // 控制结束时间
+ geo_data: editData.geo_data || '', // 地理数据（编辑时回显原始坐标）
+ };
+ // 下拉框回显（若 editData 中有文件夹名称，需匹配 options 的 value）
+ // 假设 editData.folder_name 是文件夹名称，需找到对应的 value 赋值给 formData.area
+ const matchedFolder = options.find(item => item.label === (editData.folder_name || ''));
+ if (matchedFolder) {
+ formData.value.area = matchedFolder.value;
+ }
+
+ // 回显总数和总面积（编辑时可能需要展示）
+ totalArea.value = layerParams.value.total_area || 0;
+ totalCount.value = layerParams.value.total_count || 0;
+ } else {
+ // 新增状态：不回显数据，清空总数和总面积
+ totalArea.value = null;
+ totalCount.value = null;
+ }
+});
</script>
<style scoped lang="scss">
--
Gitblit v1.9.3