diff --git a/frontend/.env.development b/frontend/.env.development
index 4754193..9140849 100644
--- a/frontend/.env.development
+++ b/frontend/.env.development
@@ -15,6 +15,6 @@ VITE_APP_BASE_URL = 'http://10.84.121.21:8093'
 
 
 # 开发环境导入预览地址
-VITE_APP_BASE_API_URL = 'http://172.16.21.14:8096'
+VITE_APP_BASE_API_URL = 'http://10.84.121.21:8093'
 ## 开发环境预览 图片视频地址 
 VITE_APP_PREVIEW_URL = 'https://211.99.26.225:12125'
diff --git a/frontend/.prettierrc.js b/frontend/.prettierrc.js
index 7a42426..0a62ee5 100644
--- a/frontend/.prettierrc.js
+++ b/frontend/.prettierrc.js
@@ -32,5 +32,5 @@ module.exports = {
   // Vue文件脚本和样式标签缩进
   vueIndentScriptAndStyle: false,
   // 换行符使用 lf 结尾是 可选值"<auto|lf|crlf|cr>"
-  endOfLine: 'lf'
+  endOfLine: 'lf',
 };
diff --git a/frontend/dist.rar b/frontend/dist.rar
new file mode 100644
index 0000000..2229983
Binary files /dev/null and b/frontend/dist.rar differ
diff --git a/frontend/src/api/guoYuSheShiShuJuTianBao/index.ts b/frontend/src/api/guoYuSheShiShuJuTianBao/index.ts
index ce9b666..3e86214 100644
--- a/frontend/src/api/guoYuSheShiShuJuTianBao/index.ts
+++ b/frontend/src/api/guoYuSheShiShuJuTianBao/index.ts
@@ -1,7 +1,7 @@
 import request from '@/utils/request';
 
 // 分页查询过鱼数据
-export function getFishDraftPage(data:any) {
+export function getFishDraftPage(data: any) {
   return request({
     url: '/data/fishDraft/page',
     method: 'post',
@@ -9,7 +9,7 @@ export function getFishDraftPage(data:any) {
   });
 }
 //新增过鱼数据
-export function addFishDraft(queryParams:any) {
+export function addFishDraft(queryParams: any) {
   return request({
     url: '/data/fishDraft/saveDraft',
     method: 'post',
@@ -17,7 +17,7 @@ export function addFishDraft(queryParams:any) {
   });
 }
 //修改过鱼数据
-export function editFishDraft(queryParams:any) {
+export function editFishDraft(queryParams: any) {
   return request({
     url: '/data/fishDraft/updateDraft',
     method: 'post',
@@ -25,7 +25,7 @@ export function editFishDraft(queryParams:any) {
   });
 }
 //删除 过鱼数据
-export function delFishDraft(data:any) {
+export function delFishDraft(data: any) {
   return request({
     url: '/data/fishDraft/batchRemoveDraft',
     method: 'post',
@@ -33,22 +33,22 @@ export function delFishDraft(data:any) {
   });
 }
 //提交过鱼数据
-export function submitFishDraft(data:any) {
+export function submitFishDraft(data: any) {
   return request({
     url: '/data/fishDraft/submitDrafts',
     method: 'post',
     data
   });
 }
-//提交全部过鱼数据 
+//提交全部过鱼数据
 export function batchApproveAll() {
   return request({
     url: '/data/fishDraft/submitDraftsAll',
-    method: 'post',
+    method: 'post'
   });
 }
 //审批过鱼数据
-export function successFishDraft(data:any) {
+export function successFishDraft(data: any) {
   return request({
     url: '/data/fishDraft/batchApprove',
     method: 'post',
@@ -56,7 +56,7 @@ export function successFishDraft(data:any) {
   });
 }
 //驳回过鱼数据
-export function rejectFishDraft(data:any) {
+export function rejectFishDraft(data: any) {
   return request({
     url: '/data/fishDraft/reject',
     method: 'post',
@@ -64,7 +64,7 @@ export function rejectFishDraft(data:any) {
   });
 }
 // 导入zip
-export function importFishZip(data:FormData) {
+export function importFishZip(data: FormData) {
   return request({
     url: '/data/fishDraft/importZip',
     method: 'post',
@@ -73,7 +73,7 @@ export function importFishZip(data:FormData) {
   });
 }
 // 取消导入任务
-export function cancelImportTask(data:any) {
+export function cancelImportTask(data: any) {
   return request({
     url: '/data/fishDraft/cancelImport',
     method: 'post',
@@ -95,7 +95,7 @@ export function getLastImportResult() {
     method: 'get'
   });
 }
-export function deleteFile(params:any) {
+export function deleteFile(params: any) {
   return request({
     url: '/data/fishDraft/deleteFile',
     method: 'get',
@@ -103,10 +103,18 @@ export function deleteFile(params:any) {
   });
 }
 // 批量保存草稿
-export function batchSaveDraft(data:any) {
+export function batchSaveDraft(data: any) {
   return request({
     url: '/data/fishDraft/batchSaveDraft',
     method: 'post',
     data
   });
-}
\ No newline at end of file
+}
+// 批量删除 审批已驳回的
+export function batchRemoveDraft(data: any) {
+  return request({
+    url: '/data/approvalMain/batchDelete',
+    method: 'post',
+    data
+  });
+}
diff --git a/frontend/src/components/BasicTable/index.vue b/frontend/src/components/BasicTable/index.vue
index db157bb..d7079b9 100644
--- a/frontend/src/components/BasicTable/index.vue
+++ b/frontend/src/components/BasicTable/index.vue
@@ -34,8 +34,6 @@ interface Props {
   rowKey?: string;
   // 外部传入的搜索/过滤参数，变化时会自动触发刷新
   searchParams?: Record<string, any>;
-  // 是否只加载一次，默认 false
-  isOneLoad?: boolean;
   // 默认每页显示数量
   defaultPageSize?: number;
   getCheckboxProps?: (record: any) => any;
@@ -46,7 +44,6 @@ const props = withDefaults(defineProps<Props>(), {
   enableRowSelection: false,
   rowKey: "id",
   data: () => ([]),
-  isOneLoad: true,
   searchParams: () => ({}),
   defaultPageSize: 20,
   getCheckboxProps: undefined,
@@ -143,7 +140,6 @@ const getList = async (filter?: Record<string, any>) => {
       totalCount = res?.data?.total || res?.total || 0;
     }
 
-
     tableData.value = records;
     total.value = totalCount;
 
diff --git a/frontend/src/components/MapModal/column.config.ts b/frontend/src/components/MapModal/column.config.ts
index 9bb530e..8e17baa 100644
--- a/frontend/src/components/MapModal/column.config.ts
+++ b/frontend/src/components/MapModal/column.config.ts
@@ -17,8 +17,9 @@ const BasicColumns: Array<any> = [
     filed: 'ennm',
     visible: true,
     ruleTips: 'a4d3b02a466677324278a9a153fb4adb',
-    type: '',
-    url: ''
+    type: 'select',
+    url: '',
+    value: '拉西瓦'
   },
   {
     key: '1CE83818DA304429BEBA965DBACE2FE0',
@@ -26,8 +27,9 @@ const BasicColumns: Array<any> = [
     filed: 'baseName',
     visible: true,
     ruleTips: 'a4d3b02a466677324278a9a153fb4adb',
-    type: '',
-    url: ''
+    type: 'select',
+    url: '',
+    value: '黄河上游干流'
   },
   {
     key: '1CE83818DA304429BEBA965DBACE2FE0',
@@ -35,8 +37,9 @@ const BasicColumns: Array<any> = [
     filed: 'addvcdName',
     visible: true,
     ruleTips: 'a4d3b02a466677324278a9a153fb4adb',
-    type: '',
-    url: ''
+    type: 'input',
+    url: '',
+    value: '共和县,贵南县'
   },
   {
     key: '1CE83818DA304429BEBA965DBACE2FE0',
@@ -44,8 +47,10 @@ const BasicColumns: Array<any> = [
     filed: 'stlc',
     visible: true,
     ruleTips: 'a4d3b02a466677324278a9a153fb4adb',
-    type: '',
-    url: ''
+    type: 'input',
+    url: '',
+    value: '青海省贵德县、青海省贵南',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: '1CE83818DA304429BEBA965DBACE2FE0',
@@ -53,8 +58,10 @@ const BasicColumns: Array<any> = [
     filed: 'hbrvcdName',
     visible: true,
     ruleTips: 'a4d3b02a466677324278a9a153fb4adb',
-    type: '',
-    url: ''
+    type: 'select',
+    url: '',
+    value: '黄河干流上游',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: '1CE83818DA304429BEBA965DBACE2FE0',
@@ -62,8 +69,9 @@ const BasicColumns: Array<any> = [
     filed: 'hynm',
     visible: true,
     ruleTips: 'a4d3b02a466677324278a9a153fb4adb',
-    type: '',
-    url: ''
+    type: 'select',
+    url: '',
+    value: '青海黄河上游水电开发有限责任公司'
   },
   {
     key: '1CE83818DA304429BEBA965DBACE2FE0',
@@ -71,8 +79,9 @@ const BasicColumns: Array<any> = [
     filed: 'topHynm',
     visible: true,
     ruleTips: 'a4d3b02a466677324278a9a153fb4adb',
-    type: '',
-    url: ''
+    type: 'select',
+    url: '',
+    value: '国家电投集团'
   },
   {
     key: '2950C68264BF494B9C5E1748569D026C',
@@ -80,9 +89,12 @@ const BasicColumns: Array<any> = [
     filed: 'lgtd',
     visible: true,
     ruleTips: 'a4d3b02a466677324278a9a153fb4adb',
-    type: '',
+    type: 'number',
+    toFixed: 6,
     url: '',
-    unitConfig: ['Other', 'LGTD' ]
+    unitConfig: ['Other', 'LGTD'],
+    value: '101.184969',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: '70423E92994B4620A73BA6DCF3861669',
@@ -90,9 +102,12 @@ const BasicColumns: Array<any> = [
     filed: 'lttd',
     visible: true,
     ruleTips: 'a4d3b02a466677324278a9a153fb4adb',
-    type: '',
+    type: 'number',
+    toFixed: 6,
     url: '',
-    unitConfig: ['Other', 'LTTD' ]
+    unitConfig: ['Other', 'LTTD'],
+    value: '36.070816',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: '3EAC90E681014714A32E425A7C691D7D',
@@ -100,8 +115,9 @@ const BasicColumns: Array<any> = [
     filed: 'bldsttCcodeName',
     visible: true,
     ruleTips: 'a4d3b02a466677324278a9a153fb4adb',
-    type: '',
-    url: ''
+    type: 'select',
+    url: '',
+    value: '已建'
   },
   {
     key: '3EAC90E681014714A32E425A7C691D7D',
@@ -111,7 +127,8 @@ const BasicColumns: Array<any> = [
     ruleTips: 'a4d3b02a466677324278a9a153fb4adb',
     type: 'date',
     format: 'YYYY-MM-DD',
-    url: ''
+    url: '',
+    value: '2010-08-01'
   },
   {
     key: 'D77E04DF590342959214F8ACD4D3ECC1',
@@ -121,7 +138,9 @@ const BasicColumns: Array<any> = [
     ruleTips: 'a4d3b02a466677324278a9a153fb4adb',
     type: 'date',
     format: 'YYYY-MM-DD',
-    url: ''
+    url: '',
+    value: '2009-04-01',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: '68C8F7DD279F4A33A1D3EE23243F1C33',
@@ -131,7 +150,8 @@ const BasicColumns: Array<any> = [
     ruleTips: 'a4d3b02a466677324278a9a153fb4adb',
     type: 'date',
     format: 'YYYY-MM-DD',
-    url: ''
+    url: '',
+    value: '2009-04-15'
   },
   {
     key: '17bccbfa812362fa403c0bed06e58d0d',
@@ -150,378 +170,322 @@ const BasicColumns: Array<any> = [
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '132160.00'
   },
   {
     key: '955B3BC9DAE24965AB0C08482519AF06',
     name: '距河源距离(km)',
     filed: 'dstcrvr',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '32.80'
   },
   {
     key: '6E07FD8EC9A145A686317C3A07A897B9',
     name: '多年平均降雨量(mm)',
     filed: 'avyrp',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '259.00'
   },
   {
     key: '80376049D8D94894B687C583CE376EFA',
     name: '多年平均年径流量(亿m³)',
     filed: 'avw',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '208'
   },
   {
     key: '403300B4F41549E09A3F8D5F7610CC61',
     name: '多年平均流量(m³/s)',
     filed: 'avq',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '660',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: '403300B4F41549E09A3F8D5F7610CC62',
     name: '1月多年平均流量(m³/s)',
     filed: 'avq01',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
     type: 'number',
     toFixed: 0,
-    url: ''
+    url: '',
+    value: '495'
   },
   {
     key: '403300B4F41549E09A3F8D5F7610CC63',
     name: '2月多年平均流量(m³/s)',
     filed: 'avq02',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
     type: 'number',
     toFixed: 0,
-    url: ''
+    url: '',
+    value: '438'
   },
   {
     key: '403300B4F41549E09A3F8D5F7610CC64',
     name: '3月多年平均流量(m³/s)',
     filed: 'avq03',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
     type: 'number',
     toFixed: 0,
-    url: ''
+    url: '',
+    value: '524'
   },
   {
     key: '403300B4F41549E09A3F8D5F7610CC65',
     name: '4月多年平均流量(m³/s)',
     filed: 'avq04',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
     type: 'number',
     toFixed: 0,
-    url: ''
+    url: '',
+    value: '674'
   },
   {
     key: '403300B4F41549E09A3F8D5F7610CC66',
     name: '5月多年平均流量(m³/s)',
     filed: 'avq05',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
     type: 'number',
     toFixed: 0,
-    url: ''
+    url: '',
+    value: '781'
   },
   {
     key: '403300B4F41549E09A3F8D5F7610CC67',
     name: '6月多年平均流量(m³/s)',
     filed: 'avq06',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
     type: 'number',
     toFixed: 0,
-    url: ''
+    url: '',
+    value: '826'
   },
   {
     key: '403300B4F41549E09A3F8D5F7610CC68',
     name: '7月多年平均流量(m³/s)',
     filed: 'avq07',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
     type: 'number',
     toFixed: 0,
-    url: ''
+    url: '',
+    value: '1004'
   },
   {
     key: '403300B4F41549E09A3F8D5F7610CC69',
     name: '8月多年平均流量(m³/s)',
     filed: 'avq08',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
     type: 'number',
     toFixed: 0,
-    url: ''
+    url: '',
+    value: '975'
   },
   {
     key: '403300B4F41549E09A3F8D5F7610CC70',
     name: '9月多年平均流量(m³/s)',
     filed: 'avq09',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
     type: 'number',
     toFixed: 0,
-    url: ''
+    url: '',
+    value: '783'
   },
   {
     key: '403300B4F41549E09A3F8D5F7610CC71',
     name: '10月多年平均流量(m³/s)',
     filed: 'avq10',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
     type: 'number',
     toFixed: 0,
-    url: ''
+    url: '',
+    value: '698'
   },
   {
     key: '403300B4F41549E09A3F8D5F7610CC72',
     name: '11月多年平均流量(m³/s)',
     filed: 'avq11',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
     type: 'number',
     toFixed: 0,
-    url: ''
+    url: '',
+    value: '624'
   },
   {
     key: '403300B4F41549E09A3F8D5F7610CC73',
     name: '12月多年平均流量(m³/s)',
     filed: 'avq12',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
     type: 'number',
     toFixed: 0,
-    url: ''
+    url: '',
+    value: '547'
   },
   {
     key: '0B1B33B4C6E24C02B843AC3EBED456E3',
     name: '实测最大流量(m³/s)',
     filed: 'obmxq',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '4900'
   },
   {
     key: '68681C3323A6477888D53EF248A93E69',
     name: '实测最小流量(m³/s)',
     filed: 'obmnq',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '92'
   },
   {
     key: '9B17D694765240C5A4A92858B4D2B5CE',
     name: '调查历史最大流量(m³/s)',
     filed: 'hmxq',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '6300'
   },
   {
     key: 'A3EEB5D482B24B939744FFF9C2BDEB7B',
     name: '设计入库洪水流量(m³/s)',
     filed: 'dsnfqfrq',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '4250'
   },
   {
     key: 'c4a678e3da7f474f858d3f54dbf03d78',
     name: '设计洪水重现期(年)',
     filed: 'dsrcin',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
-    type: '',
-    url: ''
+    type: 'input',
+    url: '',
+    value: '1000',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: 'EEDCC9BB01CA4E689E6D568D214B8A02',
     name: '校核入库洪水流量(m³/s)',
     filed: 'ckfqfqr',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '6310'
   },
   {
     key: '3cb4538327ca4472815a4410a19b8bfb',
     name: '校核洪水重现期(年)',
     filed: 'chrcin',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
-    type: '',
-    url: ''
+    type: 'input',
+    url: '',
+    value: '5000',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: '111D74CBAAC440AF8CC52F6F180EDB12',
     name: '实测最大洪量（三天）(亿m³)',
     filed: 'obmxw3',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '59'
   },
   {
     key: '6D75D094E0374FCC846624B04C4F53A1',
     name: '设计洪量（三天）(亿m³)',
     filed: 'dsw3',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '71'
   },
   {
     key: 'DF1CD1709E464C55B26531CD7A8E5034',
     name: '校核洪量（三天）(亿m³)',
     filed: 'ckw3',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '82'
   },
   {
     key: 'A86F9510EC804536A967A57747B57AA5',
     name: '多年平均输沙量(万t)',
     filed: 'avsd',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '102'
   },
   {
     key: 'C2C7C34AAEB945178EE10C241DFB311B',
     name: '多年平均含沙量(kg/m³)',
     filed: 'avs',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '0'
   },
   {
     key: '8784E8C676C04C19B456DFF4DE831C1D',
     name: '实测最大含沙量(kg/m³)',
     filed: 'obmxs',
-
     visible: true,
-
     ruleTips: '17bccbfa812362fa403c0bed06e58d0d',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '117'
   },
   {
     key: '1b2c05e5ad59d6dda928317fac64a490',
     name: '水库',
     filed: '1b2c05e5ad59d6dda928317fac64a490',
-
     visible: false,
-
     ruleTips: '',
-
     type: '',
     url: ''
   },
@@ -529,210 +493,183 @@ const BasicColumns: Array<any> = [
     key: 'E3FD7C1ACCC84EEBAB017EAF807EEDD5',
     name: '校核洪水位(m)',
     filed: 'ckflz',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
-
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '2457.00'
   },
   {
     key: '6146A4A36B454DA4BFE4910739F69C93',
     name: '设计洪水位(m)',
     filed: 'dsflz',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
-
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '2452.00'
   },
   {
     key: 'AA4EF70648BF44A3929FF64D3CFCFDE1',
     name: '正常蓄水位(m)',
     filed: 'normz',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
-
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '2452.00',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: '31E54152BE924B07B27A12FBE8D46C00',
     name: '防洪高水位(m)',
     filed: 'uzfc',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
-
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '2452.00'
   },
   {
     key: 'C7179D8F029546478C17A61E157823C1',
     name: '防洪限制水位(m)',
     filed: 'fsltdz',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
-
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '-'
   },
   {
     key: '53D370FA41344467B3BAF95A6C69E263',
     name: '年消落水位(m)',
     filed: 'ydownz',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
-
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '-'
   },
   {
     key: 'E550041810614850BB1DF15EA2711499',
     name: '死水位(m)',
     filed: 'ddz',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
-
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '2440.00',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: 'D682B174871D4B6D9484978E24E9C0BF',
     name: '正常蓄水位水库面积(km²)',
     filed: 'nrzar',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '13.00'
   },
   {
     key: 'A6F751FA185C4573851431CF9ADD00B1',
     name: '回水长度(km)',
     filed: 'bcklen',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '32.80'
   },
   {
     key: '766B432F01154EA1971FCFBB858DB4F8',
     name: '总库容(亿m³)',
     filed: 'ttcp',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '10.79',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: 'C4BA9EA14F25470CA45EBBB57CBFCB26',
     name: '正常蓄水位以下库容(亿m³)',
     filed: 'nmzcp',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '10'
   },
   {
     key: 'F6178CC33A2F41579E15F7453484657A',
     name: '防洪库容(亿m³)',
     filed: 'fldcp',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '-'
   },
   {
     key: 'D3682105F25C4CEFA46AE657908F553B',
     name: '调节库容(亿m³)',
     filed: 'actcp',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '2',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: '5F4E514E8BE94C83B83E0349110AB65C',
     name: '死库容(亿m³)',
     filed: 'ddcp',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '9'
   },
   {
     key: '6BD119F2EE554E3A97703E2AA7B2CFEE',
     name: '库容系数(%)',
     filed: 'cpsc',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '1'
   },
   {
     key: '5144864F346A4429BF900CC356088BFD',
     name: '调节性能',
     filed: 'rgcpName',
-
     visible: true,
-
     ruleTips: '1b2c05e5ad59d6dda928317fac64a490',
-
-    type: '',
-    url: ''
+    type: 'select',
+    url: '',
+    value: '日调节',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: 'b06aaa1411e77fa50d181687829fcabf',
     name: '下泄流量及相应下游水位',
     filed: 'b06aaa1411e77fa50d181687829fcabf',
-
     visible: false,
-
     ruleTips: '',
-
     type: '',
     url: ''
   },
@@ -740,207 +677,173 @@ const BasicColumns: Array<any> = [
     key: '4C1681794D05410E80CCB6A5FA12C7F9',
     name: '设计洪水位时最大下泄流量(m³/s)',
     filed: 'dsflzmxq',
-
     visible: true,
-
     ruleTips: 'b06aaa1411e77fa50d181687829fcabf',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '4250'
   },
   {
     key: 'F7A1359F103B4B3690D85088548C4D79',
     name: '设计洪水位时最大下泄流量相应下游水位(m)',
     filed: 'dsflzxyz',
-
     visible: true,
-
     ruleTips: 'b06aaa1411e77fa50d181687829fcabf',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '2244'
   },
   {
     key: 'B4EB16357CCB4CD4A0CDBD3BE0049AAF',
     name: '校核洪水位时最大下泄流量(m³/s)',
     filed: 'ckflzmxq',
-
     visible: true,
-
     ruleTips: 'b06aaa1411e77fa50d181687829fcabf',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '6310'
   },
   {
     key: '857610E46FB440038101CD0C3412CDF2',
     name: '校核洪水位时最大下泄流量相应下游水位(m)',
     filed: 'ckflzxyz',
-
     visible: true,
-
     ruleTips: 'b06aaa1411e77fa50d181687829fcabf',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '2247'
   },
   {
     key: '6660B967FFFF4CE699E0B1253C80B7DA',
     name: '枯水期调节流量(m³/s)',
     filed: 'ksqadjq',
-
     visible: true,
-
     ruleTips: 'b06aaa1411e77fa50d181687829fcabf',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '-'
   },
   {
     key: '67016E170F27489EAAB3532C6621351D',
     name: '枯水期调节流量相应下游水位(m)',
     filed: 'ksqxyz',
-
     visible: true,
-
     ruleTips: 'b06aaa1411e77fa50d181687829fcabf',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '-'
   },
   {
     key: '44D7D057E84446B488CD96990DD5089A',
     name: '发电最大引用流量(m³/s)',
     filed: 'gemaxrq',
-
     visible: true,
-
     ruleTips: 'b06aaa1411e77fa50d181687829fcabf',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '-'
   },
   {
     key: '6BB95D0165684E9EB3E425268A45277E',
     name: '发电最大引用流量相应下游水位(m)',
     filed: 'mxgeqxyz',
-
     visible: true,
-
     ruleTips: 'b06aaa1411e77fa50d181687829fcabf',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '2240'
   },
   {
     key: '6f8386f3b948dbf3a3507611c2e2f777',
     name: '工程效益指标',
     filed: '6f8386f3b948dbf3a3507611c2e2f777',
-
     visible: false,
-
     ruleTips: '',
-
     type: '',
     url: ''
   },
   {
     key: 'A3872CE4C88B46EF8F4D407F59E5CB98',
-    name: '装机容量(MW)',
+    name: '装机容量(万kW)',
     filed: 'ttpwr',
-
     visible: true,
-
     ruleTips: '6f8386f3b948dbf3a3507611c2e2f777',
-
     type: 'number',
     toFixed: 2,
     url: '',
-
-    unitConfig: ['Other', 'ZJRL' ]
+    unitConfig: ['Other', 'ZJRL'],
+    value: '420.00',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: 'A0C8FE7AB24747C383EECBBA0F1C4FD9',
     name: '装机台数(台)',
     filed: 'gncnt',
-
     visible: true,
-
     ruleTips: '6f8386f3b948dbf3a3507611c2e2f777',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '6',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: '575AAC99880C479B948ABE38EA0603DC',
     name: '容量构成(台*MW)',
     filed: 'gntp',
-
     visible: true,
-
     ruleTips: '6f8386f3b948dbf3a3507611c2e2f777',
-
-    type: '',
-    url: ''
+    type: 'input',
+    url: '',
+    value: '6*700'
   },
   {
     key: 'FE01484725814B89A4C2C155EFC2ED53',
     name: '保证出力(MW)',
     filed: 'grntpwr',
-
     visible: true,
-
     ruleTips: '6f8386f3b948dbf3a3507611c2e2f777',
-
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '99.00'
   },
   {
     key: '08E626F3271745CD84ECB9CC2C9FE1D0',
     name: '多年平均年发电量(亿kW·h)',
     filed: 'yrge',
-
     visible: true,
-
     ruleTips: '6f8386f3b948dbf3a3507611c2e2f777',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '102',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: 'ED9678BE10CD44E68F00D1497880FC0A',
     name: '年利用小时数(h)',
     filed: 'ushr',
-
     visible: true,
-
     ruleTips: '6f8386f3b948dbf3a3507611c2e2f777',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '2430'
   },
   {
     key: '35DD75EACA0C4454B1FB11BEB0A6CB3C',
     name: '机组综合出力系数',
     filed: 'k',
-
     visible: true,
-
     ruleTips: '6f8386f3b948dbf3a3507611c2e2f777',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '9'
   },
   {
     key: 'd085d8361a89374da7a301690c1be32f',
     name: '大坝',
     filed: 'd085d8361a89374da7a301690c1be32f',
-
     visible: false,
-
     ruleTips: '',
-
     type: '',
     url: ''
   },
@@ -948,62 +851,53 @@ const BasicColumns: Array<any> = [
     key: '8C39E0D195944439B85E18ABA5F1DB04',
     name: '坝型',
     filed: 'dmtp',
-
     visible: true,
-
     ruleTips: 'd085d8361a89374da7a301690c1be32f',
-
-    type: '',
-    url: ''
+    type: 'select',
+    url: '',
+    value: '对数螺旋双曲拱坝',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: 'A62C7BB814A345699D9AB29DFBE2509E',
     name: '坝顶高程(m)',
     filed: 'dmcrel',
-
     visible: true,
-
     ruleTips: 'd085d8361a89374da7a301690c1be32f',
-
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '2460.00'
   },
   {
     key: '5C8284B23C794F7CAD2D36363420B520',
     name: '最大坝高(m)',
     filed: 'mxdmhg',
-
     visible: true,
-
     ruleTips: 'd085d8361a89374da7a301690c1be32f',
-
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '250.00',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   },
   {
     key: '5B14BAC64C094489A8F78F36A9301AC3',
     name: '坝顶长度(m)',
     filed: 'dmlen',
-
     visible: true,
-
     ruleTips: 'd085d8361a89374da7a301690c1be32f',
-
     type: 'number',
     toFixed: 2,
-    url: ''
+    url: '',
+    value: '466.40'
   },
   {
     key: '0d98c74797e49d00bcc4c17c9d557a2b',
     name: '其他',
     filed: '0d98c74797e49d00bcc4c17c9d557a2b',
-
     visible: false,
-
     ruleTips: '',
-
     type: '',
     url: ''
   },
@@ -1011,80 +905,42 @@ const BasicColumns: Array<any> = [
     key: '44A80DC39F6845AF837D0E707549E5E3',
     name: '单独年发电量(亿kW·h)',
     filed: 'sgyge',
-
     visible: true,
-
     ruleTips: '0d98c74797e49d00bcc4c17c9d557a2b',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '102'
   },
   {
     key: '3C242CDBD87440AD83BE9BC40BBEFE3F',
     name: '联合年发电量(亿kW·h)',
     filed: 'unyge',
-
     visible: true,
-
     ruleTips: '0d98c74797e49d00bcc4c17c9d557a2b',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '102'
   },
-  // {
-  //
-  //     "key": "1EAEED21DF32418F8E1064041EA2F20C",
-  //     "name": "控制流域面积(km²)",
-  //     "filed": "cntrar",
-  //     "children": [],
-  //     "visible": true,
-  //     "fixed": "",
-  //     "ellipsis": true,
-  //     "wrap": false,
-  //     "dictType": "",
-  //     "dictCode": "",
-  //     "dictDatas": {},
-  //     "fromType": "",
-  //     "dataFormat": "",
-  //     "selectMode": "",
-  //     "unit": "",
-  //     "remark": "",
-  //     "rules": "",
-  //     "ruleTips": "0d98c74797e49d00bcc4c17c9d557a2b",
-  //     "notRows": [],
-  //     "action": {},
-  //     "type": "",
-  //     "url": "",
-  //     "params": "",
-  //     "datas": [],
-  //     "chartColor": "",
-  //     "elementCode": "",
-  //     "disabledDate": true,
-  //     "multiLink": false
-  // },
   {
     key: '6F02E38952364606BC231D5E912C3BB4',
     name: '利用落差(m)',
     filed: 'gap',
-
     visible: true,
-
     ruleTips: '0d98c74797e49d00bcc4c17c9d557a2b',
-
-    type: '',
-    url: ''
+    type: 'number',
+    url: '',
+    value: '205'
   },
   {
     key: '3CDF9BC2F53440BD8B75CD30C7E4D5F0',
     name: '开发方式',
     filed: 'dvtpName',
-
     visible: true,
-
     ruleTips: '0d98c74797e49d00bcc4c17c9d557a2b',
-
-    type: '',
-    url: ''
+    type: 'select',
+    url: '',
+    value: '堤坝式',
+    vlsr: '大中型电站图册、全国水雨情信息网（黄河中游水电基地）'
   }
 ];
 
@@ -1099,7 +955,7 @@ const basicFilterColumns: Array<any> = [
     merge: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'keyName',
@@ -1109,7 +965,7 @@ const basicFilterColumns: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: '1001000',
@@ -1119,7 +975,7 @@ const basicFilterColumns: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: '1002000',
@@ -1129,7 +985,7 @@ const basicFilterColumns: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: '1003000',
@@ -1139,7 +995,7 @@ const basicFilterColumns: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: '1004000|1005000',
@@ -1149,7 +1005,7 @@ const basicFilterColumns: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: '1009000',
@@ -1159,7 +1015,7 @@ const basicFilterColumns: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: '1011000',
@@ -1169,7 +1025,7 @@ const basicFilterColumns: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: '1013000',
@@ -1179,7 +1035,7 @@ const basicFilterColumns: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   }
 ];
 
@@ -1339,31 +1195,31 @@ const tabs: any = {
       url: ''
     }
   ],
-  list: [ ],
-  options: [ ],
+  list: [],
+  options: [],
   title: '',
   showTitle: true,
-  remarks: [ ],
-  summarys: [ ],
-  footers: [ ],
+  remarks: [],
+  summarys: [],
+  footers: [],
   returnDictData: false,
   checkbox: false,
   pages: true,
   width: 102,
   options_text: '',
   options_type: '',
-  rowNums: [ ],
+  rowNums: [],
   order: true,
   unit: {
     m: '水位',
     'm³/s': '流量'
   },
-  elem: [ 1, 2, 3, 4, 5 ],
-  split: [ 2 ],
-  stacking: [ ],
-  rowCheckRes: [ ],
-  warnList: [ ],
-  rows: [ ]
+  elem: [1, 2, 3, 4, 5],
+  split: [2],
+  stacking: [],
+  rowCheckRes: [],
+  warnList: [],
+  rows: []
 };
 
 //预警提示 -设计参数变更提示
@@ -1376,7 +1232,7 @@ const tableColumns1: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'contrastphase',
@@ -1386,7 +1242,7 @@ const tableColumns1: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'currentstage',
@@ -1396,7 +1252,7 @@ const tableColumns1: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'phasevalue',
@@ -1406,7 +1262,7 @@ const tableColumns1: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'stagevalue',
@@ -1416,7 +1272,7 @@ const tableColumns1: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'messagename',
@@ -1426,7 +1282,7 @@ const tableColumns1: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   }
 ];
 
@@ -1440,7 +1296,7 @@ const tableColumns2: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'addvnm',
@@ -1450,7 +1306,7 @@ const tableColumns2: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'rvnm',
@@ -1460,7 +1316,7 @@ const tableColumns2: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'kyhzhb',
@@ -1470,7 +1326,7 @@ const tableColumns2: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'prdsgn',
@@ -1480,7 +1336,7 @@ const tableColumns2: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'eiarqst',
@@ -1490,7 +1346,7 @@ const tableColumns2: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'zxsjhb',
@@ -1500,7 +1356,7 @@ const tableColumns2: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'isbuild',
@@ -1510,7 +1366,7 @@ const tableColumns2: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'file',
@@ -1520,7 +1376,7 @@ const tableColumns2: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { },
+    setting: {},
 
     notExport: true
   }
@@ -1536,7 +1392,7 @@ const tableColumns3: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'addvnm',
@@ -1546,7 +1402,7 @@ const tableColumns3: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'rvnm',
@@ -1556,7 +1412,7 @@ const tableColumns3: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'kyhzhb',
@@ -1566,7 +1422,7 @@ const tableColumns3: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'prdsgn',
@@ -1576,7 +1432,7 @@ const tableColumns3: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'eiarqst',
@@ -1586,7 +1442,7 @@ const tableColumns3: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'zxsjhb',
@@ -1596,7 +1452,7 @@ const tableColumns3: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'isbuild',
@@ -1606,7 +1462,7 @@ const tableColumns3: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'file',
@@ -1616,7 +1472,7 @@ const tableColumns3: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { },
+    setting: {},
 
     notExport: true
   }
@@ -1632,7 +1488,7 @@ const tableColumns4: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'addvnm',
@@ -1642,7 +1498,7 @@ const tableColumns4: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'status',
@@ -1652,7 +1508,7 @@ const tableColumns4: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   }
 ];
 
@@ -1667,7 +1523,7 @@ const tableColumns5: Array<any> = [
     merge: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'ftp',
@@ -1677,7 +1533,7 @@ const tableColumns5: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'fsz',
@@ -1687,7 +1543,7 @@ const tableColumns5: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'fcnt',
@@ -1697,7 +1553,7 @@ const tableColumns5: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'stlc',
@@ -1707,7 +1563,7 @@ const tableColumns5: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'rvnm',
@@ -1717,7 +1573,7 @@ const tableColumns5: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'fage',
@@ -1727,7 +1583,7 @@ const tableColumns5: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'bjtp',
@@ -1737,7 +1593,7 @@ const tableColumns5: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'bjftp',
@@ -1747,7 +1603,7 @@ const tableColumns5: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'bjfcnt',
@@ -1757,7 +1613,7 @@ const tableColumns5: Array<any> = [
     visible: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   },
   {
     key: 'normal',
@@ -1768,30 +1624,30 @@ const tableColumns5: Array<any> = [
     merge: true,
 
     ruleTips: '',
-    setting: { }
+    setting: {}
   }
 ];
 
 //生态流量
-const EcologicalFlowColumns: Array<any> = [ ];
+const EcologicalFlowColumns: Array<any> = [];
 
 //生态流量泄放设施
-const FlowDischargeColumns: Array<any> = [ ];
+const FlowDischargeColumns: Array<any> = [];
 
 //水质
-const WaterQualityColumns: Array<any> = [ ];
+const WaterQualityColumns: Array<any> = [];
 
 //水温
-const WaterTemperatureColumns: Array<any> = [ ];
+const WaterTemperatureColumns: Array<any> = [];
 
 //流量
-const FlowMeasureColumns: Array<any> = [ ];
+const FlowMeasureColumns: Array<any> = [];
 
 //垂向水温
-const VerticalWaterTemperatureColumns: Array<any> = [ ];
+const VerticalWaterTemperatureColumns: Array<any> = [];
 
 //自定义监测数据
-const NormalColumns: Array<any> = [ ];
+const NormalColumns: Array<any> = [];
 
 export {
   BasicColumns,
diff --git a/frontend/src/components/MapModal/components/BasicInfo.vue b/frontend/src/components/MapModal/components/BasicInfo.vue
index 315fef9..2e8e163 100644
--- a/frontend/src/components/MapModal/components/BasicInfo.vue
+++ b/frontend/src/components/MapModal/components/BasicInfo.vue
@@ -2,10 +2,71 @@
   <a-spin :spinning="loading">
     <div class="modal-baseic-container">
       <a-row>
-        <a-col :span="!item.visible ? 24 : 12" v-for="item in tabledata" :key="item.key">
-          <div class="col-title" v-if="!item.visible">{{ item.name }}：</div>
-          <div class="col-left" v-if="item.visible">{{ item.name }}：</div>
-          <div class="col-right" v-if="item.visible">{{ item.value }}</div>
+        <a-col
+          :span="!item.visible ? 24 : 12"
+          v-for="(item, index) in tabledata"
+          :key="item.key"
+        >
+          <div class="col-title" v-if="!item.visible">
+            {{ item.name }}：
+            <div v-if="modelStore.isBasicEdit && index == 0">
+              <a-button
+                v-if="!isEdit"
+                type="primary"
+                size="small"
+                class="mr-2"
+                @click="editBtn"
+              >
+                编辑信息
+              </a-button>
+              <a-button v-else type="primary" size="small" class="mr-2" @click="saveBtn">
+                保存信息
+              </a-button>
+              <a-button type="primary" size="small"> 修改记录 </a-button>
+            </div>
+          </div>
+          <div class="col-left" v-if="item.visible">
+            <a-tooltip :title="item.name.length > 10 ? item.name : ''"
+              >{{ item.name }}：
+            </a-tooltip>
+          </div>
+          <div class="col-right" v-if="item.visible">
+            <a-tooltip :title="!isEdit ? item.vlsr : ''">
+              <span v-if="!isEdit">{{ item.value || "-" }}</span>
+              <span v-else>
+                <!-- {{ item.value }} -->
+                <a-input
+                  v-if="item.type == 'input'"
+                  v-model:value="item.value"
+                  :placeholder="item.name"
+                  size="small"
+                ></a-input>
+                <a-select
+                  v-else-if="item.type == 'select'"
+                  v-model:value="item.value"
+                  :placeholder="item.name"
+                  size="small"
+                  class="w-full"
+                ></a-select>
+                <!-- <div v-else-if="item.type == 'date'">{{ item.value }}2222</div> -->
+                <a-date-picker
+                  v-else-if="item.type == 'date'"
+                  v-model:value="item.value"
+                  :format="item.format"
+                  :value-format="item.format"
+                  :picker="item.picker"
+                  class="w-full"
+                ></a-date-picker>
+                <a-input-number
+                  v-else-if="item.type == 'number'"
+                  v-model:value="item.value"
+                  :placeholder="item.name"
+                  size="small"
+                  class="w-full"
+                ></a-input-number>
+              </span>
+            </a-tooltip>
+          </div>
         </a-col>
       </a-row>
     </div>
@@ -13,624 +74,637 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, onMounted } from "vue";
-import { BasicColumns,tabsWithTwoColumns } from "../column.config";
-import {useModelStore} from "@/store/modules/model";
-
-const modelInfo = useModelStore();
-
-
 import dayjs from "dayjs";
+import { ref, onMounted, nextTick } from "vue";
+import { BasicColumns, tabsWithTwoColumns } from "../column.config";
+import { useModelStore } from "@/store/modules/model";
+
+const modelStore = useModelStore();
 
 const props = defineProps({
   url: {
     type: String,
-    default: ''
-  }
-})
-
+    default: "",
+  },
+});
+const value1 = ref(dayjs("2009-04-01"));
 const loading = ref(false);
 const tabledata = ref([]);
+console.log(BasicColumns);
 const columnsConfig = ref([
-    {
-      type: 'eng',
-      columns: BasicColumns
-    },
-    {
-      type: 'zh',
-      columns: tabsWithTwoColumns
-    }
-  ])
+  {
+    type: "ENG",
+    columns: BasicColumns,
+  },
+  {
+    type: "zh",
+    columns: tabsWithTwoColumns,
+  },
+]);
+const isEdit = ref(false);
+const editBtn = () => {
+  nextTick(() => {
+    isEdit.value = true;
+    tabledata.value.forEach((item) => {
+      if (item.type == "date") item.value = dayjs(item.value).format(item.format);
+    });
+  });
+};
+const saveBtn = () => {
+  isEdit.value = false;
+  console.log(tabledata.value);
+};
 onMounted(() => {
   loading.value = true;
   const data = {
-    msStbprpT:{
-  "_tls": {},
-  "id": "008640203800000001",
-  "recordUser": "A62AB110-D4EC-FF3E-F293-140AB60CAE61",
-  "recordTime": "2023-05-18 01:16:30",
-  "modifyTime": null,
-  "displayRecordUser": null,
-  "isolateType": null,
-  "dvtpName": "堤坝式",
-  "ftpName": null,
-  "coenvwStateName": "正常",
-  "displayDepartment": null,
-  "stcd": "008640203800000001",
-  "stnm": "拉西瓦",
-  "sttp": "6F79EB95-AF0D-E3BF-64B4-9B29765A86B3",
-  "sttpCode": "ENG",
-  "sttpName": "电站",
-  "sttpFullPath": "HST,ENG,",
-  "sttpTreeLevel": 2,
-  "blprdId": "4768AE91-F4D4-D501-9C01-82FD4D5A4591",
-  "blprdCode": "1011000",
-  "blprdName": "竣工",
-  "blprdCcode": "1011000",
-  "blprdCname": "竣工",
-  "lgtd": 101.184969,
-  "lttd": 36.070816,
-  "stlc": "青海省贵德县、青海省贵南",
-  "dtmnm": null,
-  "dtmel": 2476.423,
-  "dtpr": null,
-  "frgrd": null,
-  "esstym": null,
-  "bgfrym": null,
-  "atcunit": null,
-  "admauth": null,
-  "locality": null,
-  "stbk": null,
-  "stazt": null,
-  "dstrvm": 240,
-  "drna": null,
-  "phcd": null,
-  "usfl": 1,
-  "comments": null,
-  "rstcd": null,
-  "ennm": "拉西瓦",
-  "engLctn1Code": null,
-  "engLctn1Name": null,
-  "engLctn2Code": null,
-  "engLctn2Name": null,
-  "engLctn3Code": null,
-  "engLctn3Name": null,
-  "engIwtCode": null,
-  "engIwtName": null,
-  "engMwtCode": null,
-  "engMwtName": null,
-  "engRwtCode": null,
-  "engRwtName": null,
-  "engDwtCode": null,
-  "engDwtName": null,
-  "baseId": "08",
-  "baseName": "黄河上游干流",
-  "hbrvcd": "SJLY1U",
-  "hbrvcdName": "黄河干流上游",
-  "rvcd": "SJLY1",
-  "rvcdName": "黄河上游",
-  "rvcdFullPath": "HHLY4,DA_HHGLSX,SJLY1,",
-  "rvcdpx": "hhglshy03",
-  "rvcdpxName": "黄河干流上游",
-  "rvcdpxFullPath": "hh,huangh02,hhglshy03,",
-  "addvcd": "632521,632525",
-  "addvcdName": "共和县,贵南县",
-  "addvcdFullPath": "630000,632500,632521,,630000,632500,632525,",
-  "hycd": "7204",
-  "hynm": "青海黄河上游水电开发有限责任公司",
-  "hycdFullPath": "072,07204,",
-  "country": "china",
-  "countryName": "中国",
-  "reachcd": "SJLY1",
-  "reachcdName": "黄河干流",
-  "reachcdWwqtg": null,
-  "stCode": null,
-  "stName": null,
-  "fhstcd": null,
-  "fhstnm": null,
-  "stdsdt": null,
-  "pststdt": null,
-  "pesstdt": null,
-  "ststdt": "2006-03-01 00:00:00",
-  "stwddt": null,
-  "introduce": "拉西瓦水电站位于青海省境内的黄河干流上，是黄河上游龙羊峡至青铜峡河段规划的第二座大型梯级电站。位于贵德县拉西瓦镇。拉西瓦水电站最大坝高250米，一期蓄水水位高程2370米，水库正常蓄水位高程为2452米，总库容10.79亿立方米，6台机组总装机容量420万千瓦，多年平均发电量102.23亿千瓦时，动态投资149.86亿元。电站于2004年河床截流，开始坝肩开挖，目前已全部建成并发电。拉西瓦水电站是黄河上最大的水电站和清洁能源基地，也是黄河流域大坝最高、装机容量最大、发电量最多的水电站。电站2009年4月，首批两台机组投产发电，其中6号机组是中国电力装机容量8亿千瓦的标志；2010年8月，拉西瓦水电站一期五台机组全部正式并网发电。",
-  "logo": "20230629193929351067400571417576",
-  "inffile": "20230606155125634651022121174460",
-  "stsr": null,
-  "mway": 2,
-  "mwayName": "自动",
-  "dtin": 1,
-  "dtinName": "已接入",
-  "dtinSrc": "自动对接",
-  "dtinType": 0,
-  "dtinTypeName": "自建水质站",
-  "dtinTm": null,
-  "tbWay": "自动对接",
-  "tbFrequency": "24",
-  "isBriefing": null,
-  "bldstt": "10",
-  "bldsttName": "水电工程-环境影响后评价",
-  "bldsttCcode": "2",
-  "bldsttCcodeName": "已建",
-  "inv": null,
-  "invinmn": null,
-  "watp": null,
-  "watpName": null,
-  "wwqtg": null,
-  "wwqtgName": null,
-  "wtDeviceType": null,
-  "wtDeviceTypeName": null,
-  "sttpsub": null,
-  "sttpMmType": null,
-  "thematicMap": null,
-  "schedulepa": null,
-  "lsdwrsn": null,
-  "engtp": 1,
-  "ttpwr": 4200,
-  "prsc": "1",
-  "scrsc": 1,
-  "prgr": null,
-  "fn": "1,2,",
-  "bsssin": "VII",
-  "frssin": null,
-  "adjustEng": null,
-  "dmat": null,
-  "ishvbrrg": null,
-  "monthReport": 1,
-  "blsys": null,
-  "rgcp": "8",
-  "rgcpName": "日调节",
-  "dmtp": "对数螺旋双曲拱坝",
-  "dvtp": "1",
-  "hlstp": null,
-  "cntp": null,
-  "chngrd": null,
-  "eqmnStr": null,
-  "eqmnmwrStr": null,
-  "fsltdzStr": null,
-  "fldcpStr": null,
-  "dtinEnv": 2,
-  "meastrgCnt": null,
-  "measimplCnt": null,
-  "runState": 4,
-  "runStateName": "4",
-  "stdState": 0,
-  "stdStateName": "不达标",
-  "k": 9.16,
-  "px": "2010103",
-  "tp": null,
-  "avq": 660,
-  "avs": 0.05,
-  "avw": 208,
-  "box": null,
-  "clo": null,
-  "cnt": null,
-  "ddz": 2440,
-  "dtz": 0,
-  "fid": null,
-  "gap": 205,
-  "geq": 2268,
-  "htz": null,
-  "sgq": null,
-  "src": null,
-  "url": "20230718101009446516141871003053",
-  "wsc": null,
-  "ztz": null,
-  "aptl": 9,
-  "area": null,
-  "attm": null,
-  "avsd": 102,
-  "bhhd": null,
-  "bhhl": null,
-  "cftp": null,
-  "ckw3": 82,
-  "cnun": null,
-  "cpsc": 0.72,
-  "ddcp": 8.56,
-  "ddst": null,
-  "ddzm": 0,
-  "ddzs": 0,
-  "dshl": null,
-  "dsun": null,
-  "dsw1": 0,
-  "dsw3": 71,
-  "fdar": null,
-  "fdcz": 0,
-  "fdfw": 0,
-  "fdgd": 88.24,
-  "fdgl": 0,
-  "fdld": 0.03,
-  "fdll": null,
-  "fdqt": 0,
-  "fdrk": null,
-  "fdxs": null,
-  "fdyd": 0,
-  "fdzs": 0,
-  "flkq": null,
-  "fzrv": null,
-  "gapm": 0,
-  "gaps": 0,
-  "geqm": 2268,
-  "geqs": 0,
-  "gntp": "6*700",
-  "hhrz": null,
-  "hlrz": null,
-  "hmxq": 6300,
-  "hmxw": null,
-  "hpdw": null,
-  "jldt": null,
-  "lsdw": null,
-  "mark": null,
-  "mxsn": 0,
-  "pren": null,
-  "prov": null,
-  "roll": null,
-  "rstp": null,
-  "rvgr": null,
-  "sort": null,
-  "spun": null,
-  "syjq": null,
-  "thgm": null,
-  "thnl": 0,
-  "thtp": null,
-  "ttcp": 10.79,
-  "ushr": 2430,
-  "uzfc": 2452,
-  "vast": null,
-  "xntp": null,
-  "ydxs": null,
-  "yrge": 102.23,
-  "zbbh": null,
-  "zxzw": null,
-  "actcp": 1.5,
-  "aiodt": "2009-04-15 00:00:00",
-  "angle": null,
-  "avq01": 494.83,
-  "avq02": 437.93,
-  "avq03": 523.54,
-  "avq04": 674.22,
-  "avq05": 780.86,
-  "avq06": 825.63,
-  "avq07": 1004.21,
-  "avq08": 974.87,
-  "avq09": 783.11,
-  "avq10": 697.66,
-  "avq11": 623.62,
-  "avq12": 546.52,
-  "avyrp": 259,
-  "avyrq": null,
-  "caned": null,
-  "cells": null,
-  "chflw": null,
-  "chmxq": null,
-  "ckflz": 2457,
-  "dcshg": null,
-  "ddzgq": null,
-  "dlmhg": null,
-  "dmlen": 466.4,
-  "dsavq": null,
-  "dselq": null,
-  "dsflz": 2452,
-  "dsmxq": null,
-  "dtsrc": null,
-  "dyntz": 0,
-  "dzlmt": null,
-  "edttm": "2002-06-01 00:00:00",
-  "edtun": "西北勘测设计院",
-  "excel": "zy_青海->Sheet1",
-  "fbmhg": null,
-  "flksz": null,
-  "fzrpj": null,
-  "gncnt": 6,
-  "hzlmt": null,
-  "jskgc": 0,
-  "jsktp": null,
-  "mngap": null,
-  "mxgap": null,
-  "mxgeq": 2280,
-  "mxhls": null,
-  "mzlmt": null,
-  "nmzcp": 10.06,
-  "normz": 2452,
-  "nravh": 0,
-  "nravz": 0,
-  "nrzar": 13,
-  "obmnq": 92,
-  "obmxq": 4900,
-  "obmxs": 117,
-  "paixu": null,
-  "piodt": "2009-04-01 00:00:00",
-  "pitch": null,
-  "pstcd": null,
-  "range": null,
-  "rcffr": null,
-  "runtm": null,
-  "rvlen": null,
-  "rvsfq": null,
-  "scale": null,
-  "sgyge": 102.23,
-  "slope": null,
-  "sswdt": null,
-  "stage": null,
-  "swsdt": null,
-  "syjhg": null,
-  "syjsz": null,
-  "ttshg": null,
-  "units": null,
-  "unyge": 102.3,
-  "wirrg": null,
-  "xswtp": "表孔、深孔、底孔",
-  "ydcsv": null,
-  "ydjkz": null,
-  "ydzcd": null,
-  "yrgeb": 0,
-  "acimel": null,
-  "adjcpm": 0,
-  "adjcps": 0,
-  "arirrg": null,
-  "bcklen": 32.8,
-  "chfelq": null,
-  "chfldr": null,
-  "chrcin": "5000",
-  "cntrar": 132160,
-  "cntrsc": null,
-  "dlmcnt": null,
-  "dmcrel": 2460,
-  "dmrktp": "花岗岩",
-  "dnavwt": null,
-  "dsimel": null,
-  "dsnstt": "可研",
-  "dsrcin": "1000",
-  "fbmcnt": null,
-  "fsltdz": null,
-  "grntrt": null,
-  "gsmqcd": null,
-  "gsmqcl": null,
-  "gsmqkd": null,
-  "height": null,
-  "hhrztm": null,
-  "jcdt": "2010-08-01 00:00:00",
-  "hjjldw": null,
-  "hlrztm": null,
-  "hmninq": null,
-  "hmxinq": null,
-  "hmxotq": null,
-  "hntjzl": "368.18",
-  "hpsprq": null,
-  "jbtxcs": null,
-  "jhfdgk": null,
-  "ksqxyz": null,
-  "lsdwlc": null,
-  "mxdmhg": 250,
-  "nravwt": null,
-  "nrupar": 132160,
-  "obmxw3": 58.9,
-  "outcnt": null,
-  "rdmdis": null,
-  "rsvrtp": null,
-  "sgushr": null,
-  "stindx": "坝上水位,坝下水位,入库流量,出库流量,生态流量,发电流量,发电量,平均出力",
-  "stjznq": null,
-  "syjcnt": null,
-  "syjwdp": null,
-  "ttpwrb": 0,
-  "ttpwrm": 0,
-  "ttpwrs": 0,
-  "ttscnt": null,
-  "unushr": null,
-  "wqtype": null,
-  "wrAvg": 1.845,
-  "wschgc": null,
-  "wspply": null,
-  "wvtpel": null,
-  "ydcscd": null,
-  "ydcskd": null,
-  "ydcspd": null,
-  "ydjkhg": null,
-  "ydownz": null,
-  "ydyyxs": null,
-  "ymbqrk": 0.165,
-  "ymbqxz": null,
-  "ymscrk": 0,
-  "ysdlen": 1.7086,
-  "zjxydz": null,
-  "zzflar": null,
-  "zzfldx": null,
-  "zzfldxName": null,
-  "zzflgy": null,
-  "zzflrw": null,
-  "zzfltm": null,
-  "chnlnth": null,
-  "ckfqfqr": 6310,
-  "dstcrvr": 32.8,
-  "dtfrqcy": null,
-  "fbmdbgc": null,
-  "fzrdmxz": null,
-  "fzrjkhg": null,
-  "fzrtdsz": null,
-  "gemaxrq": null,
-  "grntpwr": 99,
-  "heading": null,
-  "hlscoef": null,
-  "jyyjyfs": null,
-  "jyyyyfs": null,
-  "ksqadjq": null,
-  "mintemp": null,
-  "mxdmhgl": 0,
-  "mxdmhgr": 0,
-  "mxshptn": null,
-  "oprtnun": null,
-  "outelev": null,
-  "protobj": null,
-  "protobjName": null,
-  "prottyp": null,
-  "quality": null,
-  "qxdbhcd": null,
-  "qxdbhfw": null,
-  "qxdbhmj": null,
-  "rvcdtow": "hhglshy03",
-  "srcunit": null,
-  "stjzysq": null,
-  "syjyyfs": null,
-  "ttszdss": null,
-  "updcklc": null,
-  "updcktp": null,
-  "wtType": null,
-  "ydcscnt": null,
-  "ydjkcnt": null,
-  "yrcpcty": null,
-  "yrgensa": 0,
-  "zzflcnt": null,
-  "zzfllvl": null,
-  "boundary": null,
-  "building": null,
-  "ckflzfrq": null,
-  "ckflzmxq": 6310,
-  "ckflzxyz": 2247.25,
-  "cutTime": null,
-  "dcsqskgs": null,
-  "dlmmxwdp": null,
-  "dnmnavwt": null,
-  "dnmxavwt": null,
-  "dsflzfrq": null,
-  "dsflzmxq": 4250,
-  "dsflzxyz": 2243.94,
-  "dsnfqfrq": 4250,
-  "eiarptid": null,
-  "engSort": 2452,
-  "eqrratio": null,
-  "estrydis": 240,
-  "fbmmxwdp": null,
-  "fzryxwdp": null,
-  "grntpwrm": 990,
-  "grntpwrs": 0,
-  "hlsconst": null,
-  "hmninqtm": null,
-  "hmxinqtm": null,
-  "hmxotqtm": null,
-  "impdstrz": null,
-  "jghbysrq": null,
-  "jgjdsbys": null,
-  "jljdsbys": null,
-  "jwupdate": null,
-  "jyyjyytm": null,
-  "lagTime": null,
-  "mxgeqxyz": 2240.2,
-  "myavmnat": null,
-  "nrmnavwt": null,
-  "nrmxavwt": null,
-  "outdsgnz": null,
-  "password": null,
-  "protmthd": null,
-  "protocol": null,
-  "psfishtm": null,
-  "sbfascrq": null,
-  "skymbctz": 0.7005,
-  "styphpsp": null,
-  "syjjyyfs": null,
-  "username": null,
-  "xsjdhbys": null,
-  "xsjdsbys": null,
-  "ymbqrknc": 0,
-  "ztgcsgdw": null,
-  "ztgcsjdw": null,
-  "zzflbjfs": null,
-  "zzflbjfsName": null,
-  "zzflfllc": null,
-  "zzflfllcName": null,
-  "zzfljslc": null,
-  "zzflyzms": null,
-  "zzflyzmsName": null,
-  "downdcklc": null,
-  "downdcktp": null,
-  "eqreviewm": null,
-  "fishlurmv": null,
-  "fpssmnmon": null,
-  "frequency": null,
-  "frntwllhg": null,
-  "grntpwrmn": 0,
-  "grntpwrmx": 0,
-  "opHeight": null,
-  "perimeter": null,
-  "psfishcnt": null,
-  "psfishtyp": null,
-  "qxdbhhxcd": null,
-  "qxdbhwwcd": null,
-  "restplcnt": null,
-  "ststicinv": 21.0215,
-  "szhljsjhl": null,
-  "thrsmdays": null,
-  "aiEnabled": null,
-  "channelNo": null,
-  "eiadtfrqcy": null,
-  "fhLastWt": null,
-  "fhLastZq": null,
-  "frameRate": null,
-  "frntwlltyp": null,
-  "grntpwrnsa": 0,
-  "osgbtitles": null,
-  "outflrelev": null,
-  "aiExtCode": null,
-  "aiExtName": null,
-  "averagetemp": null,
-  "centerElev": null,
-  "centerLgtd": null,
-  "centerLttd": null,
-  "description": null,
-  "wtHgtType": null,
-  "aiFrequency": null,
-  "center1Elev": null,
-  "center1Lgtd": null,
-  "center1Lttd": null,
-  "intranetUrl": null,
-  "wtFirstHgt": null,
-  "chiefbasineng": null,
-  "deviceSerial": null,
-  "clippingPlanes": null,
-  "destinationElev": null,
-  "destinationLgtd": null,
-  "destinationLttd": null,
-  "destinationType": null,
-  "orientationRoll": null,
-  "reviseSiteElev": null,
-  "zVariationDmax": null,
-  "zVariationHmax": null,
-  "orientationPitch": null,
-  "orientationHeading": null,
-  "destinationElevWcs": null,
-  "destinationLgtdWcs": null,
-  "destinationLttdWcs": null,
-  "destinationElevWgs84": null,
-  "destinationLgtdWgs84": null,
-  "destinationLttdWgs84": null,
-  "reviseSiteElevFactor": null,
-  "isTempStorage": null,
-  "departmentId": null,
-  "coenvwState": "1",
-  "playWay": null,
-  "wts": null,
-  "wtsName": null,
-  "uzfccp": null,
-  "dataState": 1,
-  "stdSstate": 3,
-  "stdSstateName": "未正常运行",
-  "rgcpCode": "9",
-  "orderIndex": null,
-  "location": null,
-  "accuracy": null,
-  "engineeringTitle": null,
-  "engineeringContent": null,
-  "engineeringPicture": null,
-  "warnState": "11",
-  "accessWay": null,
-  "storageWay": null,
-  "isVdControl": null,
-  "1controlMode": null,
-  "precis": null,
-  "iconRotate": null,
-  "topHycd": null,
-  "topHynm": "国家电投集团"
-},
+    msStbprpT: {
+      _tls: {},
+      id: "008640203800000001",
+      recordUser: "A62AB110-D4EC-FF3E-F293-140AB60CAE61",
+      recordTime: "2023-05-18 01:16:30",
+      modifyTime: null,
+      displayRecordUser: null,
+      isolateType: null,
+      dvtpName: "堤坝式",
+      ftpName: null,
+      coenvwStateName: "正常",
+      displayDepartment: null,
+      stcd: "008640203800000001",
+      stnm: "拉西瓦",
+      sttp: "6F79EB95-AF0D-E3BF-64B4-9B29765A86B3",
+      sttpCode: "ENG",
+      sttpName: "电站",
+      sttpFullPath: "HST,ENG,",
+      sttpTreeLevel: 2,
+      blprdId: "4768AE91-F4D4-D501-9C01-82FD4D5A4591",
+      blprdCode: "1011000",
+      blprdName: "竣工",
+      blprdCcode: "1011000",
+      blprdCname: "竣工",
+      lgtd: 101.184969,
+      lttd: 36.070816,
+      stlc: "青海省贵德县、青海省贵南",
+      dtmnm: null,
+      dtmel: 2476.423,
+      dtpr: null,
+      frgrd: null,
+      esstym: null,
+      bgfrym: null,
+      atcunit: null,
+      admauth: null,
+      locality: null,
+      stbk: null,
+      stazt: null,
+      dstrvm: 240,
+      drna: null,
+      phcd: null,
+      usfl: 1,
+      comments: null,
+      rstcd: null,
+      ennm: "拉西瓦",
+      engLctn1Code: null,
+      engLctn1Name: null,
+      engLctn2Code: null,
+      engLctn2Name: null,
+      engLctn3Code: null,
+      engLctn3Name: null,
+      engIwtCode: null,
+      engIwtName: null,
+      engMwtCode: null,
+      engMwtName: null,
+      engRwtCode: null,
+      engRwtName: null,
+      engDwtCode: null,
+      engDwtName: null,
+      baseId: "08",
+      baseName: "黄河上游干流",
+      hbrvcd: "SJLY1U",
+      hbrvcdName: "黄河干流上游",
+      rvcd: "SJLY1",
+      rvcdName: "黄河上游",
+      rvcdFullPath: "HHLY4,DA_HHGLSX,SJLY1,",
+      rvcdpx: "hhglshy03",
+      rvcdpxName: "黄河干流上游",
+      rvcdpxFullPath: "hh,huangh02,hhglshy03,",
+      addvcd: "632521,632525",
+      addvcdName: "共和县,贵南县",
+      addvcdFullPath: "630000,632500,632521,,630000,632500,632525,",
+      hycd: "7204",
+      hynm: "青海黄河上游水电开发有限责任公司",
+      hycdFullPath: "072,07204,",
+      country: "china",
+      countryName: "中国",
+      reachcd: "SJLY1",
+      reachcdName: "黄河干流",
+      reachcdWwqtg: null,
+      stCode: null,
+      stName: null,
+      fhstcd: null,
+      fhstnm: null,
+      stdsdt: null,
+      pststdt: null,
+      pesstdt: null,
+      ststdt: "2006-03-01 00:00:00",
+      stwddt: null,
+      introduce:
+        "拉西瓦水电站位于青海省境内的黄河干流上，是黄河上游龙羊峡至青铜峡河段规划的第二座大型梯级电站。位于贵德县拉西瓦镇。拉西瓦水电站最大坝高250米，一期蓄水水位高程2370米，水库正常蓄水位高程为2452米，总库容10.79亿立方米，6台机组总装机容量420万千瓦，多年平均发电量102.23亿千瓦时，动态投资149.86亿元。电站于2004年河床截流，开始坝肩开挖，目前已全部建成并发电。拉西瓦水电站是黄河上最大的水电站和清洁能源基地，也是黄河流域大坝最高、装机容量最大、发电量最多的水电站。电站2009年4月，首批两台机组投产发电，其中6号机组是中国电力装机容量8亿千瓦的标志；2010年8月，拉西瓦水电站一期五台机组全部正式并网发电。",
+      logo: "20230629193929351067400571417576",
+      inffile: "20230606155125634651022121174460",
+      stsr: null,
+      mway: 2,
+      mwayName: "自动",
+      dtin: 1,
+      dtinName: "已接入",
+      dtinSrc: "自动对接",
+      dtinType: 0,
+      dtinTypeName: "自建水质站",
+      dtinTm: null,
+      tbWay: "自动对接",
+      tbFrequency: "24",
+      isBriefing: null,
+      bldstt: "10",
+      bldsttName: "水电工程-环境影响后评价",
+      bldsttCcode: "2",
+      bldsttCcodeName: "已建",
+      inv: null,
+      invinmn: null,
+      watp: null,
+      watpName: null,
+      wwqtg: null,
+      wwqtgName: null,
+      wtDeviceType: null,
+      wtDeviceTypeName: null,
+      sttpsub: null,
+      sttpMmType: null,
+      thematicMap: null,
+      schedulepa: null,
+      lsdwrsn: null,
+      engtp: 1,
+      ttpwr: 4200,
+      prsc: "1",
+      scrsc: 1,
+      prgr: null,
+      fn: "1,2,",
+      bsssin: "VII",
+      frssin: null,
+      adjustEng: null,
+      dmat: null,
+      ishvbrrg: null,
+      monthReport: 1,
+      blsys: null,
+      rgcp: "8",
+      rgcpName: "日调节",
+      dmtp: "对数螺旋双曲拱坝",
+      dvtp: "1",
+      hlstp: null,
+      cntp: null,
+      chngrd: null,
+      eqmnStr: null,
+      eqmnmwrStr: null,
+      fsltdzStr: null,
+      fldcpStr: null,
+      dtinEnv: 2,
+      meastrgCnt: null,
+      measimplCnt: null,
+      runState: 4,
+      runStateName: "4",
+      stdState: 0,
+      stdStateName: "不达标",
+      k: 9.16,
+      px: "2010103",
+      tp: null,
+      avq: 660,
+      avs: 0.05,
+      avw: 208,
+      box: null,
+      clo: null,
+      cnt: null,
+      ddz: 2440,
+      dtz: 0,
+      fid: null,
+      gap: 205,
+      geq: 2268,
+      htz: null,
+      sgq: null,
+      src: null,
+      url: "20230718101009446516141871003053",
+      wsc: null,
+      ztz: null,
+      aptl: 9,
+      area: null,
+      attm: null,
+      avsd: 102,
+      bhhd: null,
+      bhhl: null,
+      cftp: null,
+      ckw3: 82,
+      cnun: null,
+      cpsc: 0.72,
+      ddcp: 8.56,
+      ddst: null,
+      ddzm: 0,
+      ddzs: 0,
+      dshl: null,
+      dsun: null,
+      dsw1: 0,
+      dsw3: 71,
+      fdar: null,
+      fdcz: 0,
+      fdfw: 0,
+      fdgd: 88.24,
+      fdgl: 0,
+      fdld: 0.03,
+      fdll: null,
+      fdqt: 0,
+      fdrk: null,
+      fdxs: null,
+      fdyd: 0,
+      fdzs: 0,
+      flkq: null,
+      fzrv: null,
+      gapm: 0,
+      gaps: 0,
+      geqm: 2268,
+      geqs: 0,
+      gntp: "6*700",
+      hhrz: null,
+      hlrz: null,
+      hmxq: 6300,
+      hmxw: null,
+      hpdw: null,
+      jldt: null,
+      lsdw: null,
+      mark: null,
+      mxsn: 0,
+      pren: null,
+      prov: null,
+      roll: null,
+      rstp: null,
+      rvgr: null,
+      sort: null,
+      spun: null,
+      syjq: null,
+      thgm: null,
+      thnl: 0,
+      thtp: null,
+      ttcp: 10.79,
+      ushr: 2430,
+      uzfc: 2452,
+      vast: null,
+      xntp: null,
+      ydxs: null,
+      yrge: 102.23,
+      zbbh: null,
+      zxzw: null,
+      actcp: 1.5,
+      aiodt: "2009-04-15 00:00:00",
+      angle: null,
+      avq01: 494.83,
+      avq02: 437.93,
+      avq03: 523.54,
+      avq04: 674.22,
+      avq05: 780.86,
+      avq06: 825.63,
+      avq07: 1004.21,
+      avq08: 974.87,
+      avq09: 783.11,
+      avq10: 697.66,
+      avq11: 623.62,
+      avq12: 546.52,
+      avyrp: 259,
+      avyrq: null,
+      caned: null,
+      cells: null,
+      chflw: null,
+      chmxq: null,
+      ckflz: 2457,
+      dcshg: null,
+      ddzgq: null,
+      dlmhg: null,
+      dmlen: 466.4,
+      dsavq: null,
+      dselq: null,
+      dsflz: 2452,
+      dsmxq: null,
+      dtsrc: null,
+      dyntz: 0,
+      dzlmt: null,
+      edttm: "2002-06-01 00:00:00",
+      edtun: "西北勘测设计院",
+      excel: "zy_青海->Sheet1",
+      fbmhg: null,
+      flksz: null,
+      fzrpj: null,
+      gncnt: 6,
+      hzlmt: null,
+      jskgc: 0,
+      jsktp: null,
+      mngap: null,
+      mxgap: null,
+      mxgeq: 2280,
+      mxhls: null,
+      mzlmt: null,
+      nmzcp: 10.06,
+      normz: 2452,
+      nravh: 0,
+      nravz: 0,
+      nrzar: 13,
+      obmnq: 92,
+      obmxq: 4900,
+      obmxs: 117,
+      paixu: null,
+      piodt: "2009-04-01 00:00:00",
+      pitch: null,
+      pstcd: null,
+      range: null,
+      rcffr: null,
+      runtm: null,
+      rvlen: null,
+      rvsfq: null,
+      scale: null,
+      sgyge: 102.23,
+      slope: null,
+      sswdt: null,
+      stage: null,
+      swsdt: null,
+      syjhg: null,
+      syjsz: null,
+      ttshg: null,
+      units: null,
+      unyge: 102.3,
+      wirrg: null,
+      xswtp: "表孔、深孔、底孔",
+      ydcsv: null,
+      ydjkz: null,
+      ydzcd: null,
+      yrgeb: 0,
+      acimel: null,
+      adjcpm: 0,
+      adjcps: 0,
+      arirrg: null,
+      bcklen: 32.8,
+      chfelq: null,
+      chfldr: null,
+      chrcin: "5000",
+      cntrar: 132160,
+      cntrsc: null,
+      dlmcnt: null,
+      dmcrel: 2460,
+      dmrktp: "花岗岩",
+      dnavwt: null,
+      dsimel: null,
+      dsnstt: "可研",
+      dsrcin: "1000",
+      fbmcnt: null,
+      fsltdz: null,
+      grntrt: null,
+      gsmqcd: null,
+      gsmqcl: null,
+      gsmqkd: null,
+      height: null,
+      hhrztm: null,
+      jcdt: "2010-08-01 00:00:00",
+      hjjldw: null,
+      hlrztm: null,
+      hmninq: null,
+      hmxinq: null,
+      hmxotq: null,
+      hntjzl: "368.18",
+      hpsprq: null,
+      jbtxcs: null,
+      jhfdgk: null,
+      ksqxyz: null,
+      lsdwlc: null,
+      mxdmhg: 250,
+      nravwt: null,
+      nrupar: 132160,
+      obmxw3: 58.9,
+      outcnt: null,
+      rdmdis: null,
+      rsvrtp: null,
+      sgushr: null,
+      stindx: "坝上水位,坝下水位,入库流量,出库流量,生态流量,发电流量,发电量,平均出力",
+      stjznq: null,
+      syjcnt: null,
+      syjwdp: null,
+      ttpwrb: 0,
+      ttpwrm: 0,
+      ttpwrs: 0,
+      ttscnt: null,
+      unushr: null,
+      wqtype: null,
+      wrAvg: 1.845,
+      wschgc: null,
+      wspply: null,
+      wvtpel: null,
+      ydcscd: null,
+      ydcskd: null,
+      ydcspd: null,
+      ydjkhg: null,
+      ydownz: null,
+      ydyyxs: null,
+      ymbqrk: 0.165,
+      ymbqxz: null,
+      ymscrk: 0,
+      ysdlen: 1.7086,
+      zjxydz: null,
+      zzflar: null,
+      zzfldx: null,
+      zzfldxName: null,
+      zzflgy: null,
+      zzflrw: null,
+      zzfltm: null,
+      chnlnth: null,
+      ckfqfqr: 6310,
+      dstcrvr: 32.8,
+      dtfrqcy: null,
+      fbmdbgc: null,
+      fzrdmxz: null,
+      fzrjkhg: null,
+      fzrtdsz: null,
+      gemaxrq: null,
+      grntpwr: 99,
+      heading: null,
+      hlscoef: null,
+      jyyjyfs: null,
+      jyyyyfs: null,
+      ksqadjq: null,
+      mintemp: null,
+      mxdmhgl: 0,
+      mxdmhgr: 0,
+      mxshptn: null,
+      oprtnun: null,
+      outelev: null,
+      protobj: null,
+      protobjName: null,
+      prottyp: null,
+      quality: null,
+      qxdbhcd: null,
+      qxdbhfw: null,
+      qxdbhmj: null,
+      rvcdtow: "hhglshy03",
+      srcunit: null,
+      stjzysq: null,
+      syjyyfs: null,
+      ttszdss: null,
+      updcklc: null,
+      updcktp: null,
+      wtType: null,
+      ydcscnt: null,
+      ydjkcnt: null,
+      yrcpcty: null,
+      yrgensa: 0,
+      zzflcnt: null,
+      zzfllvl: null,
+      boundary: null,
+      building: null,
+      ckflzfrq: null,
+      ckflzmxq: 6310,
+      ckflzxyz: 2247.25,
+      cutTime: null,
+      dcsqskgs: null,
+      dlmmxwdp: null,
+      dnmnavwt: null,
+      dnmxavwt: null,
+      dsflzfrq: null,
+      dsflzmxq: 4250,
+      dsflzxyz: 2243.94,
+      dsnfqfrq: 4250,
+      eiarptid: null,
+      engSort: 2452,
+      eqrratio: null,
+      estrydis: 240,
+      fbmmxwdp: null,
+      fzryxwdp: null,
+      grntpwrm: 990,
+      grntpwrs: 0,
+      hlsconst: null,
+      hmninqtm: null,
+      hmxinqtm: null,
+      hmxotqtm: null,
+      impdstrz: null,
+      jghbysrq: null,
+      jgjdsbys: null,
+      jljdsbys: null,
+      jwupdate: null,
+      jyyjyytm: null,
+      lagTime: null,
+      mxgeqxyz: 2240.2,
+      myavmnat: null,
+      nrmnavwt: null,
+      nrmxavwt: null,
+      outdsgnz: null,
+      password: null,
+      protmthd: null,
+      protocol: null,
+      psfishtm: null,
+      sbfascrq: null,
+      skymbctz: 0.7005,
+      styphpsp: null,
+      syjjyyfs: null,
+      username: null,
+      xsjdhbys: null,
+      xsjdsbys: null,
+      ymbqrknc: 0,
+      ztgcsgdw: null,
+      ztgcsjdw: null,
+      zzflbjfs: null,
+      zzflbjfsName: null,
+      zzflfllc: null,
+      zzflfllcName: null,
+      zzfljslc: null,
+      zzflyzms: null,
+      zzflyzmsName: null,
+      downdcklc: null,
+      downdcktp: null,
+      eqreviewm: null,
+      fishlurmv: null,
+      fpssmnmon: null,
+      frequency: null,
+      frntwllhg: null,
+      grntpwrmn: 0,
+      grntpwrmx: 0,
+      opHeight: null,
+      perimeter: null,
+      psfishcnt: null,
+      psfishtyp: null,
+      qxdbhhxcd: null,
+      qxdbhwwcd: null,
+      restplcnt: null,
+      ststicinv: 21.0215,
+      szhljsjhl: null,
+      thrsmdays: null,
+      aiEnabled: null,
+      channelNo: null,
+      eiadtfrqcy: null,
+      fhLastWt: null,
+      fhLastZq: null,
+      frameRate: null,
+      frntwlltyp: null,
+      grntpwrnsa: 0,
+      osgbtitles: null,
+      outflrelev: null,
+      aiExtCode: null,
+      aiExtName: null,
+      averagetemp: null,
+      centerElev: null,
+      centerLgtd: null,
+      centerLttd: null,
+      description: null,
+      wtHgtType: null,
+      aiFrequency: null,
+      center1Elev: null,
+      center1Lgtd: null,
+      center1Lttd: null,
+      intranetUrl: null,
+      wtFirstHgt: null,
+      chiefbasineng: null,
+      deviceSerial: null,
+      clippingPlanes: null,
+      destinationElev: null,
+      destinationLgtd: null,
+      destinationLttd: null,
+      destinationType: null,
+      orientationRoll: null,
+      reviseSiteElev: null,
+      zVariationDmax: null,
+      zVariationHmax: null,
+      orientationPitch: null,
+      orientationHeading: null,
+      destinationElevWcs: null,
+      destinationLgtdWcs: null,
+      destinationLttdWcs: null,
+      destinationElevWgs84: null,
+      destinationLgtdWgs84: null,
+      destinationLttdWgs84: null,
+      reviseSiteElevFactor: null,
+      isTempStorage: null,
+      departmentId: null,
+      coenvwState: "1",
+      playWay: null,
+      wts: null,
+      wtsName: null,
+      uzfccp: null,
+      dataState: 1,
+      stdSstate: 3,
+      stdSstateName: "未正常运行",
+      rgcpCode: "9",
+      orderIndex: null,
+      location: null,
+      accuracy: null,
+      engineeringTitle: null,
+      engineeringContent: null,
+      engineeringPicture: null,
+      warnState: "11",
+      accessWay: null,
+      storageWay: null,
+      isVdControl: null,
+      "1controlMode": null,
+      precis: null,
+      iconRotate: null,
+      topHycd: null,
+      topHynm: "国家电投集团",
+    },
     stcdValVoList: [
       {
         stcd: "008640600400000001",
@@ -4949,15 +5023,16 @@ onMounted(() => {
     stBaseInfo: {},
   };
   let columns = [];
-  columns = columnsConfig.value.find((item) => item.type == modelInfo.info.type).columns;
-  
+  columns = columnsConfig.value.find((item) => item.type == modelStore.params.sttp)
+    .columns;
+
   columns.forEach((item) => {
     if (item.visible) {
       if (item.type == "date") {
         if (data.msStbprpT[item.filed] && data.msStbprpT[item.filed] !== "-") {
           item.value = dayjs(data.msStbprpT[item.filed] || "").format(item.format);
         } else {
-          item.value = "-";
+          item.value = null;
         }
       } else {
         if (item.type == "number") {
@@ -4965,18 +5040,43 @@ onMounted(() => {
             if (item.filed == "ttpwr") {
               item.value =
                 (Number(data.msStbprpT[item.filed] || 0) / 10).toFixed(item.toFixed) ||
-                "-";
+                null;
             } else {
               item.value =
-                Number(data.msStbprpT[item.filed] || 0).toFixed(item.toFixed) || "-";
+                Number(data.msStbprpT[item.filed] || 0).toFixed(item.toFixed) || null;
             }
           } else {
-            item.value = "-";
+            item.value = null;
           }
         } else {
-          item.value = data.msStbprpT[item.filed] || "-";
+          item.value = data.msStbprpT[item.filed] || null;
         }
       }
+      let stcdItem = data.stcdValVoList.find((stcdItem) => {
+        let str = "";
+        let arr = [
+          "baseName",
+          "addvcdName",
+          "hbrvcdName",
+          "bldsttCcodeName",
+          "dvtpName",
+          "rgcpName",
+        ];
+        if (arr.includes(item.filed)) {
+          // 删除name后缀
+          str = item.filed.replace("Name", "");
+        } else {
+          str = item.filed;
+        }
+        return stcdItem.attrKey == str;
+      });
+      if (stcdItem && stcdItem.attrKey == "rgcp") {
+        console.log(stcdItem);
+      }
+      if (stcdItem && stcdItem.vlsr) {
+        item.vlsr = stcdItem.vlsr;
+      }
+      // console.log(stcdItem);
     }
   });
   tabledata.value = columns;
@@ -5005,6 +5105,7 @@ onMounted(() => {
     color: rgba(0, 0, 0, 0.65);
     padding: 0 !important;
     .col-title {
+      width: 100%;
       font-weight: 400;
       font-size: 14px;
       height: 44px;
@@ -5014,6 +5115,9 @@ onMounted(() => {
       text-overflow: ellipsis;
       display: block;
       text-indent: 24px;
+      display: flex;
+      justify-content: space-between;
+      padding-right: 10px;
     }
     .col-left {
       background: #f4f7f9;
diff --git a/frontend/src/components/MapModal/index.vue b/frontend/src/components/MapModal/index.vue
index 36a8d62..cab5d7d 100644
--- a/frontend/src/components/MapModal/index.vue
+++ b/frontend/src/components/MapModal/index.vue
@@ -10,10 +10,10 @@
     class="map-modal"
   >
     <a-tabs :active-key="currentActiveKey" @change="onTabChange">
-      <a-tab-pane v-for="tab in tabsConfig" :key="tab.key" :tab="tab.title">
+      <a-tab-pane v-for="tab in tabsConfig" :key="tab.key" :tab="tab.name">
         <div class="content">
           <!-- 基本信息组件 -->
-          <BasicInfo v-if="currentActiveKey === 'basicInfo'"  :url="tab.url" />
+          <BasicInfo v-if="currentActiveKey === 'basicInfo'" :url="tab.url" />
           <!-- 地图组件 -->
           <!-- <MapView v-else-if="currentActiveKey === 'mapView'" :data="modalData" /> -->
           <!-- 周边配套组件 -->
@@ -23,6 +23,14 @@
           /> -->
         </div>
       </a-tab-pane>
+      <template #rightExtra>
+      <a-tooltip :title="!isEngConfig ? '' : '该电站无专题配置'">
+        <a-button type="primary" :disabled="isEngConfig">
+          <i class="icon iconfont icon-topic mr-[5px]"></i>
+          电站专题
+          </a-button
+        ></a-tooltip>
+      </template>
     </a-tabs>
   </a-modal>
 </template>
@@ -31,6 +39,13 @@
 import { ref, watch } from "vue";
 // 导入预定义的 Tab 内容组件
 import BasicInfo from "./components/BasicInfo.vue";
+import { useModelStore } from "@/store/modules/model";
+import { handleTabs } from "./setting.config";
+
+const modelStore = useModelStore();
+const tabsConfig = ref([]);
+// 判断是否显示电站专题配置
+const isEngConfig = ref(true);
 // import MapView from './components/MapView.vue';
 // import SurroundingInfo from './components/SurroundingInfo.vue';
 
@@ -46,7 +61,6 @@ const props = defineProps<{
   visible: boolean;
   title?: string;
   activeKey?: string; // 外部控制的当前激活 tab
-  tabsConfig?: TabItem[]; // Tab 配置列表，用于生成 Tab 头
   data?: any; // 可选：传递给内部组件的数据
 }>();
 
@@ -71,7 +85,13 @@ watch(
   },
   { immediate: true }
 );
-
+watch(
+  () => modelStore.params,
+  (newVal) => {
+    tabsConfig.value = handleTabs(newVal);
+  },
+  { deep: true, immediate: true }
+);
 // 监听内部 tab 切换
 const onTabChange = (key: string) => {
   currentActiveKey.value = key;
diff --git a/frontend/src/components/MapModal/setting.config.ts b/frontend/src/components/MapModal/setting.config.ts
index 746be23..9184ff7 100644
--- a/frontend/src/components/MapModal/setting.config.ts
+++ b/frontend/src/components/MapModal/setting.config.ts
@@ -12,95 +12,98 @@
 // import { Utility } from '@zebras/qgc-share/utils/Utility'
 
 // // 水电站   √
-// const ENGTabs: Array<any> = [
-//     {
-//         name: '基础信息',
-//         key: 'basicInfo',
-//         type: 'basic',
-//         url: '/bbi/siteBipc/getSiteBasicInfo'
-//     },
-//     {
-//         name: '阶段属性',
-//         key: 'basicFilter',
-//         type: 'basicFilter',
-//         url: '/eng/engBasisInfo/getEngBaseInfo'
-//     },
-//     {
-//         name: '实时视频',
-//         key: 'videoInfo',
-//         type: 'video',
-//         url: '/video/dataStcdFrame/getVideoMonitorList'
-//     },
-//     {
-//         name: '全景影像',
-//         key: 'panoramaInfo',
-//         type: 'panorama'
-//     },
-//     {
-//         name: '监测数据',
-//         key: 'monitorInfo',
-//         type: 'tabsWithTwo',
-//         code: 'dzxq.tabs.jcsj'
-//     },
-//     {
-//         name: '预警提示',
-//         key: 'tableTabs',
-//         type: 'tableTabs',
-//         code: 'dzxq-yjts',
-//         tabs: [
-//             {
-//                 name: '设计参数变更提示',
-//                 key: 'DesignParameterChangePrompt',
-//                 type: 'table',
-//                 hiddenChart: true,
-//                 tableUrl: '/dec-lygk-base-server/base/engWarning/GetKendoList'
-//             },
-//             {
-//                 name: '施工期环保措施落实预警',
-//                 key: 'ImplementEarlyWarning',
-//                 type: 'table',
-//                 hiddenChart: true,
-//                 tableUrl: '/dec-lygk-base-server/base/engWarning/sgqhbss/GetKendoListCust'
-//             },
-//             {
-//                 name: '环保设施建设预警',
-//                 key: 'ConstructionEarlyWarning',
-//                 type: 'table',
-//                 hiddenChart: true,
-//                 tableUrl: '/dec-lygk-base-server/base/engWarning/hbssjs/GetKendoListCust'
-//             },
-//             {
-//                 name: '环保设施运行预警',
-//                 key: 'RunEarlyWarning',
-//                 type: 'table',
-//                 hiddenChart: true,
-//                 tableUrl: '/dec-lygk-base-server/base/engWarning/hbssyx/GetKendoListCust'
-//             },
-//             {
-//                 name: '鱼类放流预警',
-//                 key: 'ReleaseEarlyWarning',
-//                 type: 'table',
-//                 hiddenChart: true,
-//                 tableUrl: '/dec-lygk-base-server/base/engWarning/ylfl/GetKendoListCust'
-//             }
-//         ]
-//     },
-//     Session.getAppCode() === 'hbb' ? {
-//         name: '查看报告',
-//         key: 'attachment',
-//         type: 'attachment'
-//     } : null,
-//     {
-//         name: '批复文件',
-//         key: 'approval',
-//         type: 'approval'
-//     },
-//     // {
-//     //     name: "特征曲线",
-//     //     key: "characteristicCurve",
-//     //     type: "characteristicCurve"
-//     // }
-// ].filter(Boolean)
+const ENGTabs: Array<any> = [
+  {
+    name: '基础信息',
+    key: 'basicInfo',
+    type: 'basic',
+    url: '/bbi/siteBipc/getSiteBasicInfo'
+  },
+  {
+    name: '阶段属性',
+    key: 'basicFilter',
+    type: 'basicFilter',
+    url: '/eng/engBasisInfo/getEngBaseInfo'
+  },
+  {
+    name: '实时视频',
+    key: 'videoInfo',
+    type: 'video',
+    url: '/video/dataStcdFrame/getVideoMonitorList'
+  },
+  {
+    name: '全景影像',
+    key: 'panoramaInfo',
+    type: 'panorama'
+  },
+  {
+    name: '监测数据',
+    key: 'monitorInfo',
+    type: 'tabsWithTwo',
+    code: 'dzxq.tabs.jcsj'
+  },
+  {
+    name: '预警提示',
+    key: 'tableTabs',
+    type: 'tableTabs',
+    code: 'dzxq-yjts',
+    tabs: [
+      {
+        name: '设计参数变更提示',
+        key: 'DesignParameterChangePrompt',
+        type: 'table',
+        hiddenChart: true,
+        tableUrl: '/dec-lygk-base-server/base/engWarning/GetKendoList'
+      },
+      {
+        name: '施工期环保措施落实预警',
+        key: 'ImplementEarlyWarning',
+        type: 'table',
+        hiddenChart: true,
+        tableUrl:
+          '/dec-lygk-base-server/base/engWarning/sgqhbss/GetKendoListCust'
+      },
+      {
+        name: '环保设施建设预警',
+        key: 'ConstructionEarlyWarning',
+        type: 'table',
+        hiddenChart: true,
+        tableUrl:
+          '/dec-lygk-base-server/base/engWarning/hbssjs/GetKendoListCust'
+      },
+      {
+        name: '环保设施运行预警',
+        key: 'RunEarlyWarning',
+        type: 'table',
+        hiddenChart: true,
+        tableUrl:
+          '/dec-lygk-base-server/base/engWarning/hbssyx/GetKendoListCust'
+      },
+      {
+        name: '鱼类放流预警',
+        key: 'ReleaseEarlyWarning',
+        type: 'table',
+        hiddenChart: true,
+        tableUrl: '/dec-lygk-base-server/base/engWarning/ylfl/GetKendoListCust'
+      }
+    ]
+  },
+  {
+    name: '查看报告',
+    key: 'attachment',
+    type: 'attachment'
+  },
+  {
+    name: '批复文件',
+    key: 'approval',
+    type: 'approval'
+  }
+  // {
+  //     name: "特征曲线",
+  //     key: "characteristicCurve",
+  //     type: "characteristicCurve"
+  // }
+].filter(Boolean);
 // // 水电站生态流量   √
 // const ENGEQTabs: Array<any> = [
 //     {
@@ -1076,15 +1079,15 @@
 // //     }
 // // ]
 
-// //其他配置
-// const CommonTabs: any = [
-//     {
-//         name: '基础信息',
-//         key: 'basicInfo',
-//         type: 'basic',
-//         url: '/bbi/siteBipc/getSiteBasicInfo'
-//     }
-// ]
+// 其他配置
+const CommonTabs: any = [
+  {
+    name: '基础信息',
+    key: 'basicInfo',
+    type: 'basic',
+    url: '/bbi/siteBipc/getSiteBasicInfo'
+  }
+];
 
 // // 气象站
 // const WeatherTabs: any = [
@@ -1139,157 +1142,158 @@
 // ]
 
 // //mway : 1-是人工 ， 2-是自动 dtinType: 0-自建 1-国家 2-人工
-// const handleTabs = (modaldata: any) => {
-//     console.log('modaldata', modaldata)
-//     if (!modaldata?.sttp) return
-//     let sttp = modaldata?.sttp ? modaldata?.sttp.toUpperCase() : ''
-//     switch (sttp) {
-//         case 'ENG':
-//             if (modaldata?.eqtp == 'QEC') {
-//                 const { page } = Utility.parseQueryString()
-//                 if (page == 'shengTaiLiuLiangManZuQingKuangJiangJu') {
-//                     return ENGEQTabsJuangJu
-//                 } else {
-//                     return ENGEQTabs
-//                 }
-//             } else {
-//                 return Session.getAppCode() === 'hbb' ? ENGTabs.filter((e) => e.name !== '阶段属性') : ENGTabs
-//             }
-//         case 'ENG_ALARM':
-//             return DZGJ
-//         case 'EQ':
-//             return EQTabs
-//         case 'DW':
-//         case 'DW_1':
-//         case 'DW_2':
-//         case 'DW_3':
-//         case 'DW_4':
-//         case 'DW_5':
-//             return DWTabs
-//         case 'FP': //todo，后续再删除多余代码
-//         case 'FP_1': //todo，后续再删除多余代码
-//         // case "FP_2":   //todo，后续再删除多余代码
-//         case 'FP_3': //todo，后续再删除多余代码
-//         case 'FP_4': //todo，后续再删除多余代码
-//             // case "FP_5":   //todo，后续再删除多余代码
-//             if (Session.getAppCode() === 'hbb') {
-//                 // mway为2的时侯显示在线监测数据
-//                 if (modaldata.bldsttCcode == '1' || modaldata.bldsttCcode == '0' || modaldata.bldstt == '1' || modaldata.bldstt == '0') {
-//                     return [
-//                         ...FPTabs1 //建设情况
-//                     ]
-//                 } else {
-//                     if (modaldata.mway != 2) {
-//                         return FPTabs.filter((item) => item.name !== '在线监测数据')
-//                     } else {
-//                         return [
-//                             ...FPTabs //有监测数据
-//                         ]
-//                     }
-//                 }
-//             } else {
-//                 if (modaldata.bldsttCcode == '1' || modaldata.bldsttCcode == '0' || modaldata.bldstt == '1' || modaldata.bldstt == '0') {
-//                     return [
-//                         ...FPTabs1
-//                         // {
-//                         //     name: "系统运行记录",
-//                         //     key: "FishSystemRunState",  //Normal1
-//                         //     type: "FishSystemRunState",  //Normal
-//                         //     tabs: []
-//                         // }
-//                     ]
-//                 } else {
-//                     return [
-//                         ...FPTabs
-//                         // {
-//                         //     name: "系统运行记录",
-//                         //     key: "FishSystemRunState",  //Normal1
-//                         //     type: "FishSystemRunState",  //Normal
-//                         //     tabs: []
-//                         // }
-//                     ]
-//                 }
-//             }
-//         case 'FP_2': //todo，后续再删除多余代码
-//         case 'FP_5': //todo，后续再删除多余代码
-//             if (modaldata.bldsttCcode == '1' || modaldata.bldsttCcode == '0' || modaldata.bldstt == '1' || modaldata.bldstt == '0') {
-//                 return FPTabs1
-//             } else {
-//                 return FPTabs
-//             }
-//         case 'ZQ':
-//             return ZQTabs
-//         case 'FB':
-//             if (modaldata.bldstt == '1' || modaldata.bldstt == '0') {
-//                 return FBTabs1
-//             } else {
-//                 return FBTabs
-//             }
-//         case 'FH':
-//             return FHTabs
-//         case 'VD_FB':
-//         case 'VD_FP':
-//         case 'VD_SG':
-//         case 'VD_VP':
-//         case 'VD_EQ':
-//         case 'VD_DW':
-//         case 'VD_FH':
-//         case 'VD_OTWE':
-//         case 'VD_OTTE':
-//         case 'VD_FBP':
-//         case 'VD_FC':
-//         case 'VD_WQ':
-//         case 'VD_TE':
-//         case 'VD_WE':
-//         case 'VD_EQS':
-//         case 'VD_WT':
-//         case 'VD_FBFM':
-//         case 'VD_FBI':
-//         case 'VD_PR':
-//         case 'VD_FPB':
-//         case 'VD_GZFC':
-//         case 'VD_FPC':
-//         case 'VD_VA':
-//         case 'VD':
-//             return videoTabs
-//         case 'VD_SN':
-//         case 'VD_WVD': 
-//             return noLiveVideoTabs
-//         case 'VP':
-//             return VPTabs
-//         case 'VA':
-//             return VATabs
-//         case 'WQFB':
-//             return WQFBTabs
-//         case 'WQ':
-//             const _tabs = [...WQTabs]
-//             if (modaldata?.dtinType == 2 || modaldata?.dtinType == 1) _tabs.splice(2, 1)//国家站 人工站把视频tab去除
-//             return _tabs
-//         case 'WQDTA':
-//             return WQDTATabs
-//         case 'LL':
-//             return FLOWTabs
-//         case 'WT':
-//         case 'WTRV':
-//             if (modaldata.enfc == '1') {
-//                 return WTTabs1
-//             } else {
-//                 return WTTabs
-//             }
-//         case 'WE':
-//             return WETabs
-//         case 'MM':
-//             return WeatherTabs
-//         case 'WARN':
-//             return WaterQualityMonitoring
-//         case 'AI':
-//             return AIPrediction
-//         case 'AI_Basic':
-//             return AIbasic
-//         default:
-//             return CommonTabs
-//     }
-// }
+const handleTabs = (modaldata: any) => {
+  console.log('modaldata', modaldata);
+  if (!modaldata?.sttp) return;
+  let sttp = modaldata?.sttp ? modaldata?.sttp.toUpperCase() : '';
+  switch (sttp) {
+    case 'ENG':
+      return ENGTabs;
+    // if (modaldata?.eqtp == 'QEC') {
+    //     const { page } = Utility.parseQueryString()
+    //     if (page == 'shengTaiLiuLiangManZuQingKuangJiangJu') {
+    //         return ENGEQTabsJuangJu
+    //     } else {
+    //         return ENGEQTabs
+    //     }
+    // } else {
+    //     return Session.getAppCode() === 'hbb' ? ENGTabs.filter((e) => e.name !== '阶段属性') : ENGTabs
+    // }
+    //     case 'ENG_ALARM':
+    //         return DZGJ
+    //     case 'EQ':
+    //         return EQTabs
+    //     case 'DW':
+    //     case 'DW_1':
+    //     case 'DW_2':
+    //     case 'DW_3':
+    //     case 'DW_4':
+    //     case 'DW_5':
+    //         return DWTabs
+    //     case 'FP': //todo，后续再删除多余代码
+    //     case 'FP_1': //todo，后续再删除多余代码
+    //     // case "FP_2":   //todo，后续再删除多余代码
+    //     case 'FP_3': //todo，后续再删除多余代码
+    //     case 'FP_4': //todo，后续再删除多余代码
+    //         // case "FP_5":   //todo，后续再删除多余代码
+    //         if (Session.getAppCode() === 'hbb') {
+    //             // mway为2的时侯显示在线监测数据
+    //             if (modaldata.bldsttCcode == '1' || modaldata.bldsttCcode == '0' || modaldata.bldstt == '1' || modaldata.bldstt == '0') {
+    //                 return [
+    //                     ...FPTabs1 //建设情况
+    //                 ]
+    //             } else {
+    //                 if (modaldata.mway != 2) {
+    //                     return FPTabs.filter((item) => item.name !== '在线监测数据')
+    //                 } else {
+    //                     return [
+    //                         ...FPTabs //有监测数据
+    //                     ]
+    //                 }
+    //             }
+    //         } else {
+    //             if (modaldata.bldsttCcode == '1' || modaldata.bldsttCcode == '0' || modaldata.bldstt == '1' || modaldata.bldstt == '0') {
+    //                 return [
+    //                     ...FPTabs1
+    //                     // {
+    //                     //     name: "系统运行记录",
+    //                     //     key: "FishSystemRunState",  //Normal1
+    //                     //     type: "FishSystemRunState",  //Normal
+    //                     //     tabs: []
+    //                     // }
+    //                 ]
+    //             } else {
+    //                 return [
+    //                     ...FPTabs
+    //                     // {
+    //                     //     name: "系统运行记录",
+    //                     //     key: "FishSystemRunState",  //Normal1
+    //                     //     type: "FishSystemRunState",  //Normal
+    //                     //     tabs: []
+    //                     // }
+    //                 ]
+    //             }
+    //         }
+    //     case 'FP_2': //todo，后续再删除多余代码
+    //     case 'FP_5': //todo，后续再删除多余代码
+    //         if (modaldata.bldsttCcode == '1' || modaldata.bldsttCcode == '0' || modaldata.bldstt == '1' || modaldata.bldstt == '0') {
+    //             return FPTabs1
+    //         } else {
+    //             return FPTabs
+    //         }
+    //     case 'ZQ':
+    //         return ZQTabs
+    //     case 'FB':
+    //         if (modaldata.bldstt == '1' || modaldata.bldstt == '0') {
+    //             return FBTabs1
+    //         } else {
+    //             return FBTabs
+    //         }
+    //     case 'FH':
+    //         return FHTabs
+    //     case 'VD_FB':
+    //     case 'VD_FP':
+    //     case 'VD_SG':
+    //     case 'VD_VP':
+    //     case 'VD_EQ':
+    //     case 'VD_DW':
+    //     case 'VD_FH':
+    //     case 'VD_OTWE':
+    //     case 'VD_OTTE':
+    //     case 'VD_FBP':
+    //     case 'VD_FC':
+    //     case 'VD_WQ':
+    //     case 'VD_TE':
+    //     case 'VD_WE':
+    //     case 'VD_EQS':
+    //     case 'VD_WT':
+    //     case 'VD_FBFM':
+    //     case 'VD_FBI':
+    //     case 'VD_PR':
+    //     case 'VD_FPB':
+    //     case 'VD_GZFC':
+    //     case 'VD_FPC':
+    //     case 'VD_VA':
+    //     case 'VD':
+    //         return videoTabs
+    //     case 'VD_SN':
+    //     case 'VD_WVD':
+    //         return noLiveVideoTabs
+    //     case 'VP':
+    //         return VPTabs
+    //     case 'VA':
+    //         return VATabs
+    //     case 'WQFB':
+    //         return WQFBTabs
+    //     case 'WQ':
+    //         const _tabs = [...WQTabs]
+    //         if (modaldata?.dtinType == 2 || modaldata?.dtinType == 1) _tabs.splice(2, 1)//国家站 人工站把视频tab去除
+    //         return _tabs
+    //     case 'WQDTA':
+    //         return WQDTATabs
+    //     case 'LL':
+    //         return FLOWTabs
+    //     case 'WT':
+    //     case 'WTRV':
+    //         if (modaldata.enfc == '1') {
+    //             return WTTabs1
+    //         } else {
+    //             return WTTabs
+    //         }
+    //     case 'WE':
+    //         return WETabs
+    //     case 'MM':
+    //         return WeatherTabs
+    //     case 'WARN':
+    //         return WaterQualityMonitoring
+    //     case 'AI':
+    //         return AIPrediction
+    //     case 'AI_Basic':
+    //         return AIbasic
+    default:
+      return CommonTabs;
+  }
+};
 
 // const modalTabSetting = {
 //     footer: false,
@@ -1309,4 +1313,21 @@
 //     className: 'map-tabs'
 // }
 
-// export { ENGTabs, DWTabs, WQTabs, FLOWTabs, EQTabs, FBTabs, WETabs, FPTabs, VPTabs, FHTabs, WTTabs, VATabs, WTTabs1, handleTabs, modalTabSetting, modalTabSettingLy }
+export {
+  ENGTabs,
+  //   DWTabs,
+  //   WQTabs,
+  //   FLOWTabs,
+  //   EQTabs,
+  //   FBTabs,
+  //   WETabs,
+  //   FPTabs,
+  //   VPTabs,
+  //   FHTabs,
+  //   WTTabs,
+  //   VATabs,
+  //   WTTabs1,
+  handleTabs
+  //   modalTabSetting,
+  //   modalTabSettingLy
+};
diff --git a/frontend/src/components/previewMedia/index.vue b/frontend/src/components/previewMedia/index.vue
new file mode 100644
index 0000000..703c4d7
--- /dev/null
+++ b/frontend/src/components/previewMedia/index.vue
@@ -0,0 +1,315 @@
+<template>
+  <!-- 媒体预览 Modal -->
+  <a-modal
+    :open="visible"
+    :title="videoPreviewTitle"
+    :footer="null"
+    width="900px"
+    @cancel="closeMediaPreview"
+    :zIndex="2000"
+  >
+    <div class="flex h-[60vh] gap-4">
+      <!-- 左侧：混合列表 (图片+视频) -->
+      <div class="w-1/4 overflow-y-auto border-r pr-2 media-list-container">
+        <div
+          v-for="(item, index) in previewList"
+          :key="index"
+          class="mb-2 cursor-pointer list-item"
+          :class="{ select: index == currentMediaIndex }"
+          @click="currentMediaIndex = index"
+        >
+          <span class="file-name">{{ item.name }}</span>
+          <!-- 删除按钮 -->
+          <div
+            class="list-item-delete"
+            v-if="isDel"
+            @click.stop="handleDeleteMedia(item, index)"
+          >
+            <CloseCircleOutlined />
+          </div>
+        </div>
+      </div>
+
+      <!-- 右侧：动态预览区域 -->
+      <div
+        class="w-3/4 flex flex-col items-center justify-center bg-gray-100 relative p-4"
+      >
+        <a-spin v-if="imageLoading" tip="图片加载中..." size="large" />
+        <!-- 图片预览 -->
+        <div
+          v-if="
+            currentMediaItem &&
+            currentMediaItem.url != '' &&
+            currentMediaItem.type === 'image'
+          "
+        >
+          <img
+            v-show="!imageLoading && !imageLoadError"
+            :src="currentMediaItem.url"
+            alt="preview"
+            class="max-w-full max-h-[50vh] object-contain"
+            @load="onImageLoad"
+            @error="onImageError"
+          />
+
+          <!-- 3. 加载失败提示 -->
+          <div
+            v-if="!imageLoading && imageLoadError"
+            class="text-gray-400 flex flex-col items-center"
+          >
+            <ExclamationCircleOutlined style="font-size: 24px; margin-bottom: 8px" />
+            <span>图片加载失败</span>
+          </div>
+        </div>
+        <div
+          v-else-if="
+            currentMediaItem &&
+            currentMediaItem.url == '' &&
+            currentMediaItem.type === 'image'
+          "
+          class="text-gray-400"
+        >
+          暂无图片预览
+        </div>
+
+        <!-- 视频预览 -->
+        <video
+          v-else-if="
+            currentMediaItem &&
+            currentMediaItem.url != '' &&
+            currentMediaItem.type === 'video'
+          "
+          :src="currentMediaItem.url"
+          controls
+          autoplay
+          class="max-w-full max-h-[50vh]"
+        >
+          您的浏览器不支持视频播放
+        </video>
+        <div
+          v-else-if="
+            currentMediaItem &&
+            currentMediaItem.url == '' &&
+            currentMediaItem.type === 'video'
+          "
+          class="text-gray-400"
+        >
+          暂无视频预览
+        </div>
+
+        <!-- 底部切换控制 -->
+        <div class="absolute bottom-4 flex gap-4 z-10">
+          <a-button
+            shape="circle"
+            :icon="h(LeftOutlined)"
+            @click="prevMedia"
+            :disabled="currentMediaIndex === 0"
+          />
+          <span class="self-center text-gray-600 bg-white px-2 rounded shadow-sm">
+            {{ currentMediaIndex + 1 }} / {{ previewList.length }}
+          </span>
+          <a-button
+            shape="circle"
+            :icon="h(RightOutlined)"
+            @click="nextMedia"
+            :disabled="currentMediaIndex === previewList.length - 1"
+          />
+        </div>
+      </div>
+    </div>
+  </a-modal>
+</template>
+
+<script setup lang="ts">
+import { ref, nextTick, computed, watch, h } from "vue";
+import { message, Modal } from "ant-design-vue"; // 假设使用 ant-design-vue
+import {
+  LeftOutlined,
+  RightOutlined,
+  CloseCircleOutlined,
+  ExclamationCircleOutlined,
+} from "@ant-design/icons-vue";
+import { deleteFile } from "@/api/guoYuSheShiShuJuTianBao";
+// 图片加载状态
+const imageLoading = ref(false);
+const imageLoadError = ref(false);
+
+interface MediaItem {
+  id: string;
+  type: "image" | "video";
+  name: string;
+  url: string;
+}
+const props = defineProps<{
+  visible: boolean;
+  videoPreviewTitle: string;
+  previewList: MediaItem[];
+  previewListIndex: number;
+  taskId?: string;
+  isDel?: boolean;
+}>();
+
+const emit = defineEmits(["update:visible", "deleteMedia"]);
+const currentMediaIndex = ref(props.previewListIndex);
+
+// 计算当前选中的项
+const currentMediaItem = computed(() => props.previewList[currentMediaIndex.value]);
+
+const closeMediaPreview = () => {
+  emit("update:visible", false);
+  nextTick(() => {
+    currentMediaIndex.value = 0;
+  });
+};
+
+// 【新增】统一切换逻辑
+const prevMedia = () => {
+  if (currentMediaIndex.value > 0) {
+    currentMediaIndex.value--;
+  }
+};
+// 【新增】统一下一逻辑
+const nextMedia = () => {
+  if (currentMediaIndex.value < props.previewList.length - 1) {
+    currentMediaIndex.value++;
+  }
+};
+
+// 【新增】统一删除逻辑
+const handleDeleteMedia = (item: any, index: number) => {
+  Modal.confirm({
+    title: "确认删除",
+    content: "确定要从预览列表中移除该项吗？",
+    zIndex: 2002,
+    onOk: async () => {
+      return new Promise(async (resolve, reject) => {
+        const params = {
+          id: item.id,
+          taskId: props.taskId,
+          type:
+            props.videoPreviewTitle == "图片预览"
+              ? 1
+              : props.videoPreviewTitle == "视频预览"
+              ? 2
+              : 0,
+          filename: item.name,
+        };
+        try {
+          let res: any = await deleteFile(params);
+          if (res && res?.code == 0) {
+            message.success("删除成功");
+
+            emit("deleteMedia", item, props.videoPreviewTitle, index);
+            if (props.previewList.length === 0) {
+              closeMediaPreview();
+            } else {
+              // 调整索引
+              if (index <= currentMediaIndex.value) {
+                currentMediaIndex.value = Math.max(0, currentMediaIndex.value - 1);
+              }
+            }
+            resolve(true);
+          } else {
+            message.error("删除失败");
+            reject();
+          }
+        } catch (e) {
+          message.error("删除失败");
+          reject();
+        }
+      }).catch(() => console.log("Oops errors!"));
+    },
+  });
+};
+
+// 【新增】图片加载完成回调
+const onImageLoad = () => {
+  imageLoading.value = false;
+  imageLoadError.value = false;
+};
+
+// 【新增】图片加载失败回调
+const onImageError = () => {
+  imageLoading.value = false;
+  imageLoadError.value = true;
+};
+watch(
+  () => props.previewListIndex,
+  (newIndex) => {
+    currentMediaIndex.value = newIndex;
+  }
+);
+watch(
+  () => props.visible,
+  (newVisible) => {
+    if (newVisible) {
+      if (props.videoPreviewTitle == "图片预览") {
+        imageLoading.value = true;
+        imageLoadError.value = false;
+      }
+    }
+  }
+);
+watch(currentMediaIndex, (newIndex) => {
+  const item = props.previewList[newIndex];
+  if (item && item.type === "image") {
+    imageLoading.value = true;
+    imageLoadError.value = false;
+  } else {
+    imageLoading.value = false;
+    imageLoadError.value = false;
+  }
+});
+</script>
+<style scoped lang="scss">
+.media-list-container {
+  background-color: rgb(234, 241, 251);
+  padding: 10px;
+
+  .list-item {
+    width: 100%;
+    height: 36px;
+    line-height: 36px;
+    padding: 0 10px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    cursor: pointer;
+    border-radius: 4px;
+    transition: all 0.3s;
+
+    &:hover {
+      background-color: rgba(255, 255, 255, 0.5);
+    }
+
+    .file-name {
+      flex: 1;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      font-size: 13px;
+    }
+
+    &.select {
+      color: #ffffff;
+      background-color: rgb(37, 93, 138);
+    }
+
+    .list-item-delete {
+      color: red;
+      cursor: pointer;
+      opacity: 0;
+      transition: opacity 0.3s;
+      margin-left: 8px;
+
+      &:hover {
+        transform: scale(1.1);
+      }
+    }
+
+    &:hover .list-item-delete {
+      opacity: 1;
+    }
+  }
+}
+</style>
diff --git a/frontend/src/layout/components/AppMain.vue b/frontend/src/layout/components/AppMain.vue
index 8c54946..8d7bc79 100644
--- a/frontend/src/layout/components/AppMain.vue
+++ b/frontend/src/layout/components/AppMain.vue
@@ -2,8 +2,12 @@
 import { computed } from "vue";
 import { useTagsViewStore } from "@/store/modules/tagsView";
 import { useRoute } from "vue-router";
+import MapModal from "@/components/MapModal/index.vue";
+import { useModelStore } from "@/store/modules/model";
 // import GisView from "@/components/gis/GisView.vue";
 
+const modelStore = useModelStore();
+
 const tagsViewStore = useTagsViewStore();
 
 const router = useRoute();
@@ -22,6 +26,13 @@ const routeKey = computed(() => router.path + Math.random());
         </transition>
       </router-view>
     </div>
+
+    <MapModal
+      v-model:visible="modelStore.modalVisible"
+      v-model:active-key="modelStore.currentTabKey"
+      :title="modelStore.title"
+      :tabs-config="modelStore.tabList"
+    />
   </section>
 </template>
 
diff --git a/frontend/src/store/modules/model.ts b/frontend/src/store/modules/model.ts
index 0326686..2226a06 100644
--- a/frontend/src/store/modules/model.ts
+++ b/frontend/src/store/modules/model.ts
@@ -3,12 +3,23 @@ import { ref } from 'vue';
 
 export const useModelStore = defineStore('model', () => {
   // state
-  const info = ref<{
-    type: string;
+  const modalVisible = ref(false);
+  const currentTabKey = ref("basicInfo");
+  const tabList = ref([]);
+  const title = ref('');
+  const isBasicEdit = ref(false);
+
+  const params = ref<{
+    sttp: string;
   }>({
-    type: 'zh'
+    sttp: 'eng'
   });
   return {
-    info,
+    params,
+    modalVisible,
+    currentTabKey,
+    tabList,
+    title,
+    isBasicEdit,
   };
 });
diff --git a/frontend/src/views/home/shuiDianKaiFaZhuangKuang.vue b/frontend/src/views/home/shuiDianKaiFaZhuangKuang.vue
index 5f94f16..ddbd963 100644
--- a/frontend/src/views/home/shuiDianKaiFaZhuangKuang.vue
+++ b/frontend/src/views/home/shuiDianKaiFaZhuangKuang.vue
@@ -4,10 +4,9 @@ import JidiSelectorMod from "@/modules/jidiSelectorMod.vue";
 import RightDrawer from "@/components/RightDrawer/index.vue";
 import jidiInfoMod from "@/modules/jidiInfoMod/index.vue";
 import shuidianhuangjingjieruMod from "@/modules/shuidianhuangjingjieruMod/index.vue";
-import MapModal from "@/components/MapModal/index.vue";
 import { useModelStore } from "@/store/modules/model";
 
-const modelInfo = useModelStore();
+const modelStore = useModelStore();
 // import { getQgcStaticData } from "@/api/ecoFlow";
 onMounted(() => {
   // const params = {
@@ -26,29 +25,23 @@ onMounted(() => {
   // });
 });
 
-const modalVisible = ref(false);
-const currentTabKey = ref("basicInfo");
-const projectData = ref({ id: 1, name: "测试项目" });
-
-const tabList = [
-  { key: "basicInfo", title: "基础信息", url: "" },
-  { key: "mapView", title: "地图视图", url: "" },
-  { key: "surrounding", title: "周边配套", url: "" },
-];
-
 const showMapModal = () => {
-  modalVisible.value = true;
-  currentTabKey.value = "basicInfo";
-  modelInfo.info.type = "eng";
+  modelStore.modalVisible = true;
+  modelStore.params.sttp = "ENG";
+  modelStore.title = "三峡 详情信息";
+  modelStore.currentTabKey = "basicInfo";
+  modelStore.isBasicEdit = true;
 };
 const showMapModal1 = () => {
-  modalVisible.value = true;
-  currentTabKey.value = "basicInfo";
-  modelInfo.info.type = "zh";
-};
-
-const onTabChange = (key: string) => {
-  console.log("Tab 切换为:", key);
+  modelStore.modalVisible = true;
+  modelStore.params.sttp = "ENG";
+  modelStore.title = "三峡222 详情信息";
+  modelStore.currentTabKey = "basicInfo";
+  modelStore.isBasicEdit = false;
+  // modelStore.modalVisible = true;
+  // modelStore.params.sttp = "zh";
+  // modelStore.title = '三峡222 详情信息';
+  // modelStore.currentTabKey = "mapView";
 };
 </script>
 
@@ -60,16 +53,8 @@ const onTabChange = (key: string) => {
     <div class="rightContent">
       <RightDrawer>
         <!-- <a-button @click="showMapModal">打开电站地图弹窗</a-button>
-       <a-button @click="showMapModal1">打开地图弹窗1</a-button>
+       <a-button @click="showMapModal1">打开地图弹窗1</a-button> -->
 
-        <MapModal
-          v-model:visible="modalVisible"
-          v-model:active-key="currentTabKey"
-          title="三峡 详情信息"
-          :tabs-config="tabList"
-          :data="projectData"
-          @change="onTabChange"
-        /> -->
         <jidiInfoMod />
         <shuidianhuangjingjieruMod />
       </RightDrawer>
diff --git a/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuHistory/index.vue b/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuHistory/index.vue
index ba37e67..8c7cf47 100644
--- a/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuHistory/index.vue
+++ b/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuHistory/index.vue
@@ -1,90 +1,67 @@
 <template>
   <div class="guoYuSheShiShuJuHistory-page">
-    <GuoYuSheShiShuJuHistorySearch ref="searchRef" class="search-container" :guoyuStatus="guoyuStatus"
-      :direction="direction" @reset="handleReset" @search-finish="handleSearchFinish" />
+    <GuoYuSheShiShuJuHistorySearch
+      ref="searchRef"
+      class="search-container"
+      :guoyuStatus="guoyuStatus"
+      :direction="direction"
+      @reset="handleReset"
+      @search-finish="handleSearchFinish"
+    />
 
     <div class="table-container" ref="tableContainerRef">
-      <BasicTable ref="tableRef" :columns="columns" :scroll-y="tableScrollY" :list-url="getFishDraftPage"
-        :search-params="{}" :transform-data="customTransform">
+      <BasicTable
+        ref="tableRef"
+        :columns="columns"
+        :scroll-y="tableScrollY"
+        :list-url="getFishDraftPage"
+        :search-params="{}"
+        :transform-data="customTransform"
+      >
         <template #bodyCell="{ column, record }">
           <template v-if="column.key === 'action' || column.dataIndex === 'action'">
             <div class="flex">
-              <a-button type="link" size="small" @click="handleView(record)">查看</a-button>
+              <a-button type="link" size="small" @click="handleView(record)"
+                >查看</a-button
+              >
             </div>
           </template>
         </template>
       </BasicTable>
     </div>
+    <!-- 预览媒体组件 -->
+    <PreviewMedia
+      ref="previewMediaRef"
+      v-model:visible="mediaPreviewVisible"
+      :previewList="previewList"
+      :previewListIndex="previewListIndex"
+      :videoPreviewTitle="videoPreviewTitle"
+    />
 
-    <a-modal v-model:open="mediaPreviewVisible" :title="videoPreviewTitle" :footer="null" width="900px"
-      @cancel="closeMediaPreview" :zIndex="2000">
-      <div class="flex h-[60vh] gap-4">
-        <div class="w-1/4 overflow-y-auto border-r pr-2 media-list-container">
-          <div v-for="(item, index) in previewList" :key="index" class="mb-2 cursor-pointer list-item"
-            :class="{ select: index === currentMediaIndex }" @click="currentMediaIndex = index">
-            <span class="file-name">{{ item.name }}</span>
-          </div>
-        </div>
-
-        <div class="w-3/4 flex flex-col items-center justify-center bg-gray-100 relative p-4">
-          <a-image v-if="
-            currentMediaItem &&
-            currentMediaItem.url != '' &&
-            (currentMediaItem.type === 'image' || currentMediaItem.type === 'formImage')
-          " :src="currentMediaItem.url" class="max-w-full max-h-full object-contain" />
-          <div v-else-if="
-            currentMediaItem &&
-            currentMediaItem.url == '' &&
-            (currentMediaItem.type === 'image' || currentMediaItem.type === 'formImage')
-          " class="text-gray-400">
-            暂无图片预览
-          </div>
-
-          <video v-else-if="
-            currentMediaItem &&
-            currentMediaItem.url != '' &&
-            (currentMediaItem.type === 'video' || currentMediaItem.type === 'formVideo')
-          " :src="currentMediaItem.url" controls autoplay class="max-w-full max-h-[50vh]">
-            您的浏览器不支持视频播放
-          </video>
-          <div v-else-if="
-            currentMediaItem &&
-            currentMediaItem.url == '' &&
-            (currentMediaItem.type === 'video' || currentMediaItem.type === 'formVideo')
-          " class="text-gray-400">
-            暂无视频预览
-          </div>
-
-          <div class="absolute bottom-4 flex gap-4 z-10">
-            <a-button shape="circle" :icon="h(LeftOutlined)" @click="prevMedia" :disabled="currentMediaIndex === 0" />
-            <span class="self-center text-gray-600 bg-white px-2 rounded shadow-sm">
-              {{ currentMediaIndex + 1 }} / {{ previewList.length }}
-            </span>
-            <a-button shape="circle" :icon="h(RightOutlined)" @click="nextMedia"
-              :disabled="currentMediaIndex === previewList.length - 1" />
-          </div>
-        </div>
-      </div>
-    </a-modal>
-
-    <EditModal ref="editModalRef" v-model:visible="editModalVisible" :is-view="true" :direction="direction"
-      :initial-values="currentRecord" @cancel="editModalCancel" @preview-click="handlePreviewClick" />
+    <EditModal
+      ref="editModalRef"
+      v-model:visible="editModalVisible"
+      :is-view="true"
+      :direction="direction"
+      :initial-values="currentRecord"
+      @cancel="editModalCancel"
+      @preview-click="handlePreviewClick"
+    />
   </div>
 </template>
 
 <script lang="ts" setup>
 import { ref, computed, onMounted, h, nextTick } from "vue";
-import { message } from "ant-design-vue";
-import { LeftOutlined, RightOutlined } from "@ant-design/icons-vue";
 import BasicTable from "@/components/BasicTable/index.vue";
+import PreviewMedia from "@/components/previewMedia/index.vue";
 import GuoYuSheShiShuJuHistorySearch from "./guoYuSheShiShuJuHistorySearch.vue";
 import EditModal from "../guoYuSheShiShuJuTianBao/guoYuSheShiShuJuTianBaoForm.vue";
 import { getFishDraftPage } from "@/api/guoYuSheShiShuJuTianBao";
+
 import { Tag } from "ant-design-vue";
 import { getDictItemsByCode } from "@/api/dict";
 
 const baseUrl = import.meta.env.VITE_APP_PREVIEW_URL;
-const baseUrlPreview = import.meta.env.VITE_APP_BASE_URL;
 
 interface FormData {
   [key: string]: any;
@@ -100,8 +77,6 @@ interface ColumnConfig {
 }
 
 const tableRef = ref<any>(null);
-const searchRef = ref<any>(null);
-const editModalRef = ref<any>(null);
 
 const direction = ref<any>([]);
 const guoyuStatus = ref<any>([]);
@@ -174,17 +149,13 @@ const videoPreviewTitle = ref("视频预览");
 
 interface MediaItem {
   id: string;
-  type: "image" | "video" | "formVideo" | "formImage";
+  type: "image" | "video";
   name: string;
   url: string;
 }
 
 const previewList = ref<MediaItem[]>([]);
-const currentMediaIndex = ref(0);
-const tablePreviewRecord = ref<any>({});
-
-const currentMediaItem = computed(() => previewList.value[currentMediaIndex.value]);
-
+const previewListIndex = ref(0);
 const columns = computed(() => {
   return [
     ...baseColumnsConfig.map((col) => {
@@ -231,59 +202,23 @@ const editModalCancel = () => {
 const handlePreviewClick = (record: any, type: string, index: number) => {
   const mixedList: MediaItem[] = [];
   if (type === "image") {
-    tablePreviewRecord.value = record;
-    videoPreviewTitle.value = "图片预览";
-    const nameList = record.picpthList;
-    nameList.forEach((item: any) => {
-      mixedList.push({
-        id: record.id,
-        type: "image",
-        name: item.name,
-        url:
-          baseUrlPreview +
-          "/data/fishDraft/previewFile?filename=" +
-          item.name +
-          "&taskId=" +
-          "" +
-          "&type=1",
-      });
-    });
-  } else if (type === "video") {
-    tablePreviewRecord.value = record;
-    videoPreviewTitle.value = "视频预览";
-    const nameList = record.vdpthList;
-    nameList.forEach((item: any) => {
-      mixedList.push({
-        id: record.id,
-        type: "video",
-        name: item.name,
-        url:
-          baseUrlPreview +
-          "/data/fishDraft/previewFile?filename=" +
-          item.name +
-          "&taskId=" +
-          "" +
-          "&type=2",
-      });
-    });
-  } else if (type === "formImage") {
     videoPreviewTitle.value = "图片预览";
     const nameList = JSON.parse(JSON.stringify(record)).picpthList;
     nameList.forEach((item: any) => {
       mixedList.push({
         id: record.id,
-        type: "formImage",
+        type: "image",
         name: item.name,
         url: item.url,
       });
     });
-  } else if (type === "formVideo") {
+  } else if (type === "video") {
     videoPreviewTitle.value = "视频预览";
     const nameList = JSON.parse(JSON.stringify(record)).vdpthList;
     nameList.forEach((item: any) => {
       mixedList.push({
         id: record.id,
-        type: "formVideo",
+        type: "video",
         name: item.name,
         url: item.url,
       });
@@ -291,32 +226,12 @@ const handlePreviewClick = (record: any, type: string, index: number) => {
   }
 
   mediaPreviewVisible.value = true;
-  currentMediaIndex.value = index;
+  previewListIndex.value = index;
   nextTick(() => {
     previewList.value = mixedList;
   });
 };
 
-const prevMedia = () => {
-  if (currentMediaIndex.value > 0) {
-    currentMediaIndex.value--;
-  }
-};
-
-const nextMedia = () => {
-  if (currentMediaIndex.value < previewList.value.length - 1) {
-    currentMediaIndex.value++;
-  }
-};
-
-const closeMediaPreview = () => {
-  mediaPreviewVisible.value = false;
-  nextTick(() => {
-    previewList.value = [];
-    currentMediaIndex.value = 0;
-  });
-};
-
 const customTransform = (res: any) => {
   const rawRecords = res?.data?.records || [];
   const modifiedRecords = rawRecords.map((item: any) => {
@@ -349,13 +264,13 @@ const handleSearchFinish = (values: any) => {
       field: "strdt",
       operator: "gte",
       dataType: "date",
-      value: values.strdt[0] + ' 00:00:00',
+      value: values.strdt[0] + " 00:00:00",
     },
     {
       field: "strdt",
       operator: "lte",
       dataType: "date",
-      value: values.strdt[1] + ' 23:59:59',
+      value: values.strdt[1] + " 23:59:59",
     },
     values.direction && {
       field: "direction",
@@ -367,7 +282,7 @@ const handleSearchFinish = (values: any) => {
       field: "status",
       operator: "eq",
       dataType: "string",
-      value: 'APPROVED',
+      value: "APPROVED",
     },
     values.stcd && {
       field: "stcd",
@@ -456,39 +371,4 @@ onMounted(() => {
   overflow: hidden;
   position: relative;
 }
-
-.media-list-container {
-  background-color: rgb(234, 241, 251);
-  padding: 10px;
-
-  .list-item {
-    width: 100%;
-    height: 36px;
-    line-height: 36px;
-    padding: 0 10px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    cursor: pointer;
-    border-radius: 4px;
-    transition: all 0.3s;
-
-    &:hover {
-      background-color: rgba(255, 255, 255, 0.5);
-    }
-
-    .file-name {
-      flex: 1;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      font-size: 13px;
-    }
-
-    &.select {
-      color: #ffffff;
-      background-color: rgb(37, 93, 138);
-    }
-  }
-}
 </style>
diff --git a/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuTianBao/guoYuSheShiShuJuTianBaoForm.vue b/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuTianBao/guoYuSheShiShuJuTianBaoForm.vue
index 886060b..4e94897 100644
--- a/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuTianBao/guoYuSheShiShuJuTianBaoForm.vue
+++ b/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuTianBao/guoYuSheShiShuJuTianBaoForm.vue
@@ -18,7 +18,7 @@
     >
       <a-row :gutter="16">
         <a-col :span="12">
-        <a-form-item label="流域" name="hbrvcd">
+          <a-form-item label="流域" name="hbrvcd">
             <a-select
               v-model:value="formData.hbrvcd"
               :loading="hbrvcdLoading"
@@ -413,7 +413,7 @@ const emit = defineEmits<{
   (e: "update:visible", value: boolean): void;
   (e: "cancel"): void;
   (e: "ok", values: any): void;
-  (e: "preview-click", record: any, type: string, index: number): void;
+  (e: "preview-click", record: any, type: string, index: number, action: string): void;
 }>();
 
 // 表单引用
@@ -654,13 +654,12 @@ const initForm = () => {
 
 // 视频预览
 const handleVideoPreview = () => {
-  emit("preview-click", { vdpthList: videoFileList.value }, "formVideo", 0);
+  emit("preview-click", { vdpthList: videoFileList.value }, "video", 0, "preview");
 };
 
 // 预览图片
 const handleImagePreview = async (file: any) => {
-  emit("preview-click", { picpthList: imageFileList.value }, "formImage", 0);
-  return Promise.reject();
+  emit("preview-click", { picpthList: imageFileList.value }, "image", 0, "preview");
 };
 // 确认操作
 const handleOk = async () => {
@@ -809,7 +808,7 @@ watch(
     if (newVisible) {
       // 弹窗打开时，初始化数据
       // getBaseDropdownSelect();// 基地
-      getHbrvcdDropdownSelect();// 流域
+      getHbrvcdDropdownSelect(); // 流域
       getEngInfoDropdownSelect(formData.hbrvcd);
       getFpssDropdownSelect(formData.rstcd, formData.hbrvcd);
       initForm();
@@ -819,7 +818,7 @@ watch(
 );
 // 暴露变量
 defineExpose({
-  localLoading
+  localLoading,
 });
 </script>
 
diff --git a/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuTianBao/guoYuSheShiShuJuTianBaoTable.vue b/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuTianBao/guoYuSheShiShuJuTianBaoTable.vue
index c6159ca..872aa33 100644
--- a/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuTianBao/guoYuSheShiShuJuTianBaoTable.vue
+++ b/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuTianBao/guoYuSheShiShuJuTianBaoTable.vue
@@ -9,7 +9,7 @@
     row-key="id"
   >
     <template #bodyCell="{ column, record, index }">
-<!--     
+      <!--     
       <template v-if="column.key === 'index' || column.dataIndex === 'index'">
         {{ index + 1 }}
       </template> -->
@@ -144,14 +144,14 @@
         </template>
 
         <!-- 过鱼时间 -->
-        <template v-else-if="column.dataIndex === 'strdt'">
+        <template v-else-if="column.dataIndex === 'strdtStr'">
           <a-date-picker
-            v-model:value="editingData.strdt"
+            v-model:value="editingData.strdtStr"
             show-time
             style="width: 100%"
             format="YYYY-MM-DD HH:mm:ss"
             value-format="YYYY-MM-DD HH:mm:ss"
-            @change="(val) => delWarning(val, 'strdt')"
+            @change="(val) => delWarning(val, 'strdtStr')"
           />
         </template>
 
@@ -251,7 +251,7 @@
           <div
             class="text"
             :class="{ text_warning: record.picpthsWarnings.includes(item.name) }"
-            @click="emit('preview-click', record, 'image', index)"
+            @click="emit('preview-click', record, 'image', index, 'delete')"
           >
             {{ item.name }}
           </div>
@@ -263,7 +263,7 @@
           <div
             class="text"
             :class="{ text_warning: record.vdpthsWarnings.includes(item.name) }"
-            @click="emit('preview-click', record, 'video', index)"
+            @click="emit('preview-click', record, 'video', index, 'delete')"
           >
             {{ item.name }}
           </div>
@@ -307,7 +307,15 @@ const rowStates = reactive<Record<number, any>>({});
 const editingData = ref<any>(null);
 
 const modalColumns = ref([
-  { dataIndex: "rowIndex", key: "rowIndex", title: "序号", width: 60, dataIndexKey: "rowIndex",align: "center",fixed: "left" },
+  {
+    dataIndex: "rowIndex",
+    key: "rowIndex",
+    title: "序号",
+    width: 60,
+    dataIndexKey: "rowIndex",
+    align: "center",
+    fixed: "left",
+  },
   {
     dataIndex: "hbrvnm",
     key: "hbrvnm",
@@ -330,9 +338,9 @@ const modalColumns = ref([
     width: 150,
   },
   {
-    dataIndex: "strdt",
-    key: "strdt",
-    dataIndexKey: "strdt",
+    dataIndex: "strdtStr",
+    key: "strdtStr",
+    dataIndexKey: "strdtStr",
     title: "过鱼时间",
     width: 190,
   },
@@ -577,6 +585,10 @@ const startEdit = (index: number) => {
     editingData.value.stcd = null;
     delWarning(null, "stcd");
   }
+  if (editingData.value.warnings.includes("strdt")) {
+    editingData.value.strdt = null;
+    delWarning(null, "strdt");
+  }
 
   // 3. 预加载下拉选项 (基于 editingData 的值)
   if (editingData.value.hbrvcd == "" || editingData.value.hbrvcd == undefined) {
@@ -652,6 +664,7 @@ const saveEdit = async (index: number) => {
   // 2. 创建新数组，替换对应索引的数据
   const newData = [...props.fileTableData];
   newData[index] = { ...editingData.value };
+  newData[index].strdt = newData[index].strdtStr;
   emit("update:fileLoading", true);
   try {
     const res: any = await revalidateAndUpdateRow({
@@ -687,7 +700,7 @@ const handlePreviewDelete = async (index: number) => {
     });
     if (res && res?.code == 0) {
       message.success("删除成功");
-      
+
       props.getFileList();
       editingRowIndex.value = null;
       editingData.value = null;
diff --git a/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuTianBao/index.vue b/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuTianBao/index.vue
index 739ff6f..47cc373 100644
--- a/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuTianBao/index.vue
+++ b/frontend/src/views/shuJuTianBao/guoYuSheShiShuJuTianBao/index.vue
@@ -185,142 +185,28 @@
       @ok="handleEditSubmit"
       @preview-click="handlePreviewClick"
     />
-
-    <!-- 媒体预览 Modal -->
-    <a-modal
-      v-model:open="mediaPreviewVisible"
-      :title="videoPreviewTitle"
-      :footer="null"
-      width="900px"
-      @cancel="closeMediaPreview"
-      :zIndex="2000"
-    >
-      <div class="flex h-[60vh] gap-4">
-        <!-- 左侧：混合列表 (图片+视频) -->
-        <div class="w-1/4 overflow-y-auto border-r pr-2 media-list-container">
-          <div
-            v-for="(item, index) in previewList"
-            :key="index"
-            class="mb-2 cursor-pointer list-item"
-            :class="{ select: index === currentMediaIndex }"
-            @click="currentMediaIndex = index"
-          >
-            <span class="file-name">{{ item.name }}</span>
-            <!-- 删除按钮 -->
-            <div
-              class="list-item-delete"
-              v-if="item.type != 'formVideo' && item.type != 'formImage'"
-              @click.stop="handleDeleteMedia(item, index)"
-            >
-              <CloseCircleOutlined />
-            </div>
-          </div>
-        </div>
-
-        <!-- 右侧：动态预览区域 -->
-        <div
-          class="w-3/4 flex flex-col items-center justify-center bg-gray-100 relative p-4"
-        >
-          <a-spin v-if="imageLoading" tip="图片加载中..." size="large" />
-          <!-- 图片预览 -->
-          <div
-            v-if="
-              currentMediaItem &&
-              currentMediaItem.url != '' &&
-              (currentMediaItem.type === 'image' || currentMediaItem.type === 'formImage')
-            "
-          >
-            <img
-              v-show="!imageLoading && !imageLoadError"
-              :src="currentMediaItem.url"
-              alt="preview"
-              class="max-w-full max-h-[50vh] object-contain"
-              @load="onImageLoad"
-              @error="onImageError"
-            />
-
-            <!-- 3. 加载失败提示 -->
-            <div
-              v-if="!imageLoading && imageLoadError"
-              class="text-gray-400 flex flex-col items-center"
-            >
-              <ExclamationCircleOutlined style="font-size: 24px; margin-bottom: 8px" />
-              <span>图片加载失败</span>
-            </div>
-          </div>
-          <div
-            v-else-if="
-              currentMediaItem &&
-              currentMediaItem.url == '' &&
-              (currentMediaItem.type === 'image' || currentMediaItem.type === 'formImage')
-            "
-            class="text-gray-400"
-          >
-            暂无图片预览
-          </div>
-
-          <!-- 视频预览 -->
-          <video
-            v-else-if="
-              currentMediaItem &&
-              currentMediaItem.url != '' &&
-              (currentMediaItem.type === 'video' || currentMediaItem.type === 'formVideo')
-            "
-            :src="currentMediaItem.url"
-            controls
-            autoplay
-            class="max-w-full max-h-[50vh]"
-          >
-            您的浏览器不支持视频播放
-          </video>
-          <div
-            v-else-if="
-              currentMediaItem &&
-              currentMediaItem.url == '' &&
-              (currentMediaItem.type === 'video' || currentMediaItem.type === 'formVideo')
-            "
-            class="text-gray-400"
-          >
-            暂无视频预览
-          </div>
-
-          <!-- 底部切换控制 -->
-          <div class="absolute bottom-4 flex gap-4 z-10">
-            <a-button
-              shape="circle"
-              :icon="h(LeftOutlined)"
-              @click="prevMedia"
-              :disabled="currentMediaIndex === 0"
-            />
-            <span class="self-center text-gray-600 bg-white px-2 rounded shadow-sm">
-              {{ currentMediaIndex + 1 }} / {{ previewList.length }}
-            </span>
-            <a-button
-              shape="circle"
-              :icon="h(RightOutlined)"
-              @click="nextMedia"
-              :disabled="currentMediaIndex === previewList.length - 1"
-            />
-          </div>
-        </div>
-      </div>
-    </a-modal>
+    <!-- 预览媒体组件 -->
+    <PreviewMedia
+      ref="previewMediaRef"
+      v-model:visible="mediaPreviewVisible"
+      :previewList="previewList"
+      :previewListIndex="previewListIndex"
+      :videoPreviewTitle="videoPreviewTitle"
+      :taskId="taskId"
+      :isDel="isPreviewMediaDelete"
+      @deleteMedia="handleDeleteMedia"
+    />
   </div>
 </template>
 
 <script lang="ts" setup>
 import { ref, computed, onMounted, h, nextTick, watch } from "vue";
 import { message, Modal } from "ant-design-vue"; // 假设使用 ant-design-vue
-import {
-  LeftOutlined,
-  RightOutlined,
-  CloseCircleOutlined,
-  ExclamationCircleOutlined,
-} from "@ant-design/icons-vue"; // 引入图标组件
 import BasicTable from "@/components/BasicTable/index.vue";
 import GuoYuSheShiShuJuTianBaoSearch from "./guoYuSheShiShuJuTianBaoSearch.vue";
 import GuoYuSheShiShuJuTianBaoTable from "./guoYuSheShiShuJuTianBaoTable.vue";
 import EditModal from "./guoYuSheShiShuJuTianBaoForm.vue";
+import PreviewMedia from "@/components/previewMedia/index.vue";
 import { checkPerm } from "@/directive/permission";
 import {
   getFishDraftPage,
@@ -335,11 +221,11 @@ import {
   checkImportStatus,
   batchSaveDraft,
   getLastImportResult,
-  deleteFile,
   batchApproveAll,
 } from "@/api/guoYuSheShiShuJuTianBao";
 import { Tag } from "ant-design-vue"; // 确保导入 Tag
 import { getDictItemsByCode } from "@/api/dict";
+import { fr } from "element-plus/es/locale/index.mjs";
 
 const baseUrl = import.meta.env.VITE_APP_PREVIEW_URL;
 const baseUrlApi = import.meta.env.VITE_APP_BASE_API_URL;
@@ -358,9 +244,6 @@ interface ColumnConfig {
 }
 const fileInputRef = ref<any>(null);
 const tableRef = ref<any>(null);
-// 图片加载状态
-const imageLoading = ref(false);
-const imageLoadError = ref(false);
 // 字典项
 const direction = ref<any>([]);
 const guoyuStatus = ref<any>([]);
@@ -435,20 +318,18 @@ const isView = ref(false);
 const currentRecord = ref<FormData | null>(null);
 
 const mediaPreviewVisible = ref(false);
+const isPreviewMediaDelete = ref(false);
 const videoPreviewTitle = ref("视频预览");
 interface MediaItem {
   id: string;
-  type: "image" | "video" | "formVideo" | "formImage";
+  type: "image" | "video";
   name: string;
   url: string;
 }
 const previewList = ref<MediaItem[]>([]);
-const currentMediaIndex = ref(0);
+const previewListIndex = ref(0);
 const tablePreviewRecord = ref<any>({});
 
-// 计算当前选中的项
-const currentMediaItem = computed(() => previewList.value[currentMediaIndex.value]);
-
 // 表格数据
 const fileTableData = ref<any[]>([]);
 const batchData = ref<any[]>([]);
@@ -810,6 +691,9 @@ const importBtn = async () => {
             if (visible.value) importBtn();
           }, 5000);
         }
+      } else if (currentTask.status == "FAILED") {
+        message.error(currentTask.statusText);
+        fileLoading.value = false;
       } else if (currentTask.status == "VALIDATED") {
         nextTick(async () => {
           modalTableRef.value.editingRowIndex = null;
@@ -839,13 +723,6 @@ const fileChange = (file: File) => {
     const formData = new FormData();
     formData.append("file", file);
     await importFishZip(formData);
-    try {
-      setTimeout(() => {
-        if (visible.value) importBtn();
-      }, 5000);
-    } catch (error) {
-      message.error("导入失败");
-    }
   });
 };
 // 获取文件列表
@@ -994,167 +871,95 @@ const handleSearchFinish = (values: any) => {
   tableRef.value?.getList(filter);
 };
 // 处理预览点击 (由子组件触发)
-const handlePreviewClick = (record: any, type: string, index: number) => {
+const handlePreviewClick = (record: any, type: string, index: number, action: string) => {
   const mixedList: MediaItem[] = [];
-  if (type === "image") {
-    imageLoading.value = true;
-    imageLoadError.value = false;
+  if (action === "delete") {
+    isPreviewMediaDelete.value = true;
     tablePreviewRecord.value = record;
+  } else if (action === "preview") {
+    isPreviewMediaDelete.value = false;
+  }
+  if (type === "image") {
     videoPreviewTitle.value = "图片预览";
     const nameList = record.picpthList;
+
     nameList.forEach((item: any) => {
+      let url = "";
+      if (action === "preview") {
+        url = item.url;
+      } else if (action === "delete") {
+        url =
+          baseUrlApi +
+          "/data/fishDraft/previewFile?filename=" +
+          item.name +
+          "&taskId=" +
+          taskId.value +
+          "&type=1";
+      }
       mixedList.push({
         id: record.id,
         type: "image",
         name: item.name,
-        url:
+        url: url,
+      });
+    });
+  } else if (type === "video") {
+    videoPreviewTitle.value = "视频预览";
+    const nameList = record.vdpthList;
+    nameList.forEach((item: any) => {
+      let url = "";
+      if (action === "preview") {
+        url = item.url;
+      } else if (action === "delete") {
+        url =
           baseUrlApi +
           "/data/fishDraft/previewFile?filename=" +
           item.name +
           "&taskId=" +
           taskId.value +
-          "&type=1",
-      });
-    });
-  } else if (type === "video") {
-    tablePreviewRecord.value = record;
-    videoPreviewTitle.value = "视频预览";
-    const nameList = record.vdpthList;
-    nameList.forEach((item: any) => {
+          "&type=2";
+      }
       mixedList.push({
         id: record.id,
         type: "video",
         name: item.name, // 视频通常没有单独的名称字段，可根据需要调整
-        url:
-          baseUrlApi +
-          "/data/fishDraft/previewFile?filename=" +
-          item.name +
-          "&taskId=" +
-          taskId.value +
-          "&type=2",
-      });
-    });
-  } else if (type === "formImage") {
-    imageLoading.value = true;
-    imageLoadError.value = false;
-    videoPreviewTitle.value = "图片预览";
-    const nameList = JSON.parse(JSON.stringify(record)).picpthList;
-    nameList.forEach((item: any) => {
-      mixedList.push({
-        id: record.id,
-        type: "formImage",
-        name: item.name, // 视频通常没有单独的名称字段，可根据需要调整
-        url: item.url,
-      });
-    });
-  } else if (type === "formVideo") {
-    videoPreviewTitle.value = "视频预览";
-    const nameList = JSON.parse(JSON.stringify(record)).vdpthList;
-    nameList.forEach((item: any) => {
-      mixedList.push({
-        id: record.id,
-        type: "formVideo",
-        name: item.name, // 视频通常没有单独的名称字段，可根据需要调整
-        url: item.url,
+        url: url,
       });
     });
   }
 
   mediaPreviewVisible.value = true;
-  currentMediaIndex.value = index;
+  previewListIndex.value = index;
   nextTick(() => {
+    console.log(mixedList);
     previewList.value = mixedList;
   });
 };
 
-// 【新增】统一切换逻辑
-const prevMedia = () => {
-  if (currentMediaIndex.value > 0) {
-    currentMediaIndex.value--;
+const handleDeleteMedia = (item: any, type: string, index: number) => {
+  previewList.value.splice(index, 1);
+  if (type == "图片预览") {
+    if (previewList.value.length == 0) {
+      tablePreviewRecord.value.picpthList = [];
+      tablePreviewRecord.value.picpthsWarnings = [];
+    } else {
+      tablePreviewRecord.value.picpthList.splice(index, 1);
+      tablePreviewRecord.value.picpthsWarnings = tablePreviewRecord.value.picpthsWarnings.filter(
+        (warningName: any) => warningName !== item.name
+      );
+    }
+  } else {
+    if (previewList.value.length == 0) {
+      tablePreviewRecord.value.vdpthList = [];
+      tablePreviewRecord.value.vdpthsWarnings = [];
+    } else {
+      tablePreviewRecord.value.vdpthList.splice(index, 1);
+      tablePreviewRecord.value.vdpthsWarnings = tablePreviewRecord.value.vdpthsWarnings.filter(
+        (warningName: any) => warningName !== item.name
+      );
+    }
   }
 };
-// 【新增】统一下一逻辑
-const nextMedia = () => {
-  if (currentMediaIndex.value < previewList.value.length - 1) {
-    currentMediaIndex.value++;
-  }
-};
-
-// 【新增】统一删除逻辑
-const handleDeleteMedia = (item: any, index: number) => {
-  Modal.confirm({
-    title: "确认删除",
-    content: "确定要从预览列表中移除该项吗？",
-    zIndex: 2002,
-    onOk: async () => {
-      return new Promise(async (resolve, reject) => {
-        const params = {
-          id: item.id,
-          taskId: taskId.value,
-          type:
-            videoPreviewTitle.value == "图片预览"
-              ? 1
-              : videoPreviewTitle.value == "视频预览"
-              ? 2
-              : 0,
-          filename: item.name,
-        };
-        try {
-          let res: any = await deleteFile(params);
-          if (res && res?.code == 0) {
-            message.success("删除成功");
-            previewList.value.splice(index, 1);
-            if (videoPreviewTitle.value == "图片预览") {
-              if (previewList.value.length == 0) {
-                tablePreviewRecord.value.picpthList = [];
-                tablePreviewRecord.value.picpthsWarnings = [];
-              } else {
-                tablePreviewRecord.value.picpthList.splice(index, 1);
-                tablePreviewRecord.value.picpthsWarnings = tablePreviewRecord.value.picpthsWarnings.filter(
-                  (warningName: any) => warningName !== item.name
-                );
-              }
-            } else {
-              if (previewList.value.length == 0) {
-                tablePreviewRecord.value.vdpthList = [];
-                tablePreviewRecord.value.vdpthsWarnings = [];
-              } else {
-                tablePreviewRecord.value.vdpthList.splice(index, 1);
-                tablePreviewRecord.value.vdpthsWarnings = tablePreviewRecord.value.vdpthsWarnings.filter(
-                  (warningName: any) => warningName !== item.name
-                );
-              }
-            }
-
-            if (previewList.value.length === 0) {
-              mediaPreviewVisible.value = false;
-            } else {
-              // 调整索引
-              if (index <= currentMediaIndex.value) {
-                currentMediaIndex.value = Math.max(0, currentMediaIndex.value - 1);
-              }
-            }
-            resolve(true);
-          } else {
-            message.error("删除失败");
-            reject();
-          }
-        } catch (e) {
-          message.error("删除失败");
-          reject();
-        }
-      }).catch(() => console.log("Oops errors!"));
-    },
-  });
-};
-
-const closeMediaPreview = () => {
-  mediaPreviewVisible.value = false;
-  nextTick(() => {
-    previewList.value = [];
-    currentMediaIndex.value = 0;
-  });
-};
 const tableContainerRef = ref<HTMLElement | null>(null);
 const tableScrollY = ref<number | undefined>(undefined);
 // 计算表格主体高度（减去表头、分页器、内边距等）
@@ -1174,28 +979,6 @@ const observer = new ResizeObserver(() => {
   calcTableScrollY();
 });
 
-// 【新增】图片加载完成回调
-const onImageLoad = () => {
-  imageLoading.value = false;
-  imageLoadError.value = false;
-};
-
-// 【新增】图片加载失败回调
-const onImageError = () => {
-  imageLoading.value = false;
-  imageLoadError.value = true;
-};
-watch(currentMediaIndex, (newIndex) => {
-  const item = previewList.value[newIndex];
-  if (item && (item.type === "image" || item.type === "formImage")) {
-    imageLoading.value = true;
-    imageLoadError.value = false;
-  } else {
-    imageLoading.value = false;
-    imageLoadError.value = false;
-  }
-});
-
 // --- 生命周期 ---
 onMounted(() => {
   nextTick(() => {
@@ -1248,57 +1031,6 @@ onMounted(() => {
   /* 为绝对定位元素提供参考（如果需要） */
 }
 
-.media-list-container {
-  background-color: rgb(234, 241, 251);
-  padding: 10px;
-
-  .list-item {
-    width: 100%;
-    height: 36px;
-    line-height: 36px;
-    padding: 0 10px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    cursor: pointer;
-    border-radius: 4px;
-    transition: all 0.3s;
-
-    &:hover {
-      background-color: rgba(255, 255, 255, 0.5);
-    }
-
-    .file-name {
-      flex: 1;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      font-size: 13px;
-    }
-
-    &.select {
-      color: #ffffff;
-      background-color: rgb(37, 93, 138);
-    }
-
-    .list-item-delete {
-      color: red;
-      cursor: pointer;
-      opacity: 0;
-      transition: opacity 0.3s;
-      margin-left: 8px;
-
-      &:hover {
-        transform: scale(1.1);
-      }
-    }
-
-    &:hover .list-item-delete {
-      opacity: 1;
-    }
-  }
-}
-
 .buttonStyle {
   width: 100%;
   display: flex;
diff --git a/frontend/src/views/shuJuTianBao/shengPiJiLu/approvalDetailSearch.vue b/frontend/src/views/shuJuTianBao/shengPiJiLu/approvalDetailSearch.vue
index dddd2bb..5bb9512 100644
--- a/frontend/src/views/shuJuTianBao/shengPiJiLu/approvalDetailSearch.vue
+++ b/frontend/src/views/shuJuTianBao/shengPiJiLu/approvalDetailSearch.vue
@@ -1,7 +1,14 @@
 <template>
   <div class="approval-detail-search">
-    <BasicSearch  ref="basicSearchRef" :searchList="searchList" :initial-values="initSearchData" :zhujianfujian="'fu'" @reset="handleReset"
-      @finish="onSearchFinish" @values-change="onValuesChange">
+    <BasicSearch
+      ref="basicSearchRef"
+      :searchList="searchList"
+      :initial-values="initSearchData"
+      :zhujianfujian="'fu'"
+      @reset="handleReset"
+      @finish="onSearchFinish"
+      @values-change="onValuesChange"
+    >
       <template #ftp="{ onChange }">
         <fishSearch v-model="localTypeDate" width="200px" @update:modelValue="onChange" />
       </template>
@@ -62,10 +69,10 @@ const searchList: any = computed(() => [
     type: "RangePicker",
     name: "strdt",
     label: "过鱼时间",
-    picker: "month",
+    picker: "date",
     fieldProps: {
-      format: "YYYY-MM",
-      valueFormat: "YYYY-MM",
+      format: "YYYY-MM-DD",
+      valueFormat: "YYYY-MM-DD",
       allowClear: false,
     },
     presets: DateSetting.RangeButton.month,
diff --git a/frontend/src/views/shuJuTianBao/shengPiJiLu/index.vue b/frontend/src/views/shuJuTianBao/shengPiJiLu/index.vue
index 64c58e8..ead1e5e 100644
--- a/frontend/src/views/shuJuTianBao/shengPiJiLu/index.vue
+++ b/frontend/src/views/shuJuTianBao/shengPiJiLu/index.vue
@@ -1,349 +1,396 @@
 <template>
-    <div class="shengPiJiLu-page">
-        <!-- 搜索区域组件，具体 props 需根据实际子组件调整 -->
-        <GuoYuSheShiShuJuTianBaoSearch @search-finish="handleSearchFinish" @reset="handleReset"
-            :selected-count="selectedRows.length" @batch-approve="handleBatchApprove" @batch-reject="handleBatchReject" />
-        <!-- 主表格 -->
-        <BasicTable ref="tableRef" :columns="columns" :list-url="queryPageList" :search-params="computedSearchParams"
-            :scroll-y="650" :enable-row-selection="true" @selection-change="handleSelectionChange">
-            <!-- 使用 bodyCell 插槽自定义单元格渲染 -->
-            <template #bodyCell="{ column, record }">
-                <template v-if="column.key === 'action' || column.dataIndex === 'action'">
-                    <div class="flex">
-                        <a-button type="link" size="small" @click="handleShowDetail(record)">详情</a-button>
-                        <a-button type="link" size="small" @click="handleShowApprovalLog(record)">审批记录</a-button>
-                        <!-- <a-button type="link" size="small" @click="handleShowChangeLog(record)">变更详情</a-button> -->
-                    </div>
-                </template>
-                <template v-if="column.dataIndex === 'bizType'">
-                    {{ handName(record.bizType, yeWuType) }}
-                </template>
-                <!-- <template v-if="column.dataIndex === 'status'">
+  <div class="shengPiJiLu-page">
+    <!-- 搜索区域组件，具体 props 需根据实际子组件调整 -->
+    <GuoYuSheShiShuJuTianBaoSearch
+      @search-finish="handleSearchFinish"
+      @reset="handleReset"
+      :selected-count="selectedRows.length"
+      @batch-approve="handleBatchApprove"
+      @batch-reject="handleBatchReject"
+      @batch-delete="handleBatchDelete"
+    />
+    <!-- 主表格 -->
+    <BasicTable
+      ref="tableRef"
+      :columns="columns"
+      :list-url="queryPageList"
+      :search-params="computedSearchParams"
+      :scroll-y="650"
+      :enable-row-selection="true"
+      @selection-change="handleSelectionChange"
+    >
+      <!-- 使用 bodyCell 插槽自定义单元格渲染 -->
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'action' || column.dataIndex === 'action'">
+          <div class="flex">
+            <a-button type="link" size="small" @click="handleShowDetail(record)"
+              >详情</a-button
+            >
+            <a-button type="link" size="small" @click="handleShowApprovalLog(record)"
+              >审批记录</a-button
+            >
+            <!-- <a-button type="link" size="small" @click="handleShowChangeLog(record)">变更详情</a-button> -->
+          </div>
+        </template>
+        <template v-if="column.dataIndex === 'bizType'">
+          {{ handName(record.bizType, yeWuType) }}
+        </template>
+        <!-- <template v-if="column.dataIndex === 'status'">
                     {{ handName(record.status, shenStatus) }}
                 </template> -->
+      </template>
+    </BasicTable>
+
+    <!-- 审批操作日志弹框 -->
+    <a-modal
+      v-model:open="approvalLogVisible"
+      title="审批操作日志"
+      width="1600px"
+      :footer="null"
+      :destroy-on-close="false"
+    >
+      <div class="approval-log-modal-content">
+        <ApprovalLogSearch
+          :action-type-dict="actionTypeDict"
+          @search-finish="handleApprovalLogSearch"
+          @reset="handleApprovalLogReset"
+        />
+        <BasicTable
+          ref="approvalLogTableRef"
+          :columns="approvalLogColumns"
+          :list-url="getApprovalLogList"
+          :scroll-y="500"
+        >
+          <template #bodyCell="{ column, record }">
+            <template v-if="column.dataIndex === 'action'">
+              {{ handName(record.action, actionTypeDict) }}
             </template>
+          </template>
         </BasicTable>
+      </div>
+    </a-modal>
 
-        <!-- 审批操作日志弹框 -->
-        <a-modal v-model:open="approvalLogVisible" title="审批操作日志" width="1600px" :footer="null"
-            :destroy-on-close="false">
-            <div class="approval-log-modal-content">
-                <ApprovalLogSearch :action-type-dict="actionTypeDict" @search-finish="handleApprovalLogSearch"
-                    @reset="handleApprovalLogReset" />
-                <BasicTable ref="approvalLogTableRef" :columns="approvalLogColumns" :list-url="getApprovalLogList"
-                    :scroll-y="500">
-                    <template #bodyCell="{ column, record }">
-                        <template v-if="column.dataIndex === 'action'">
-                            {{ handName(record.action, actionTypeDict) }}
-                        </template>
-                    </template>
-                </BasicTable>
-            </div>
-        </a-modal>
+    <!-- 数据变更记录弹框 -->
+    <a-modal
+      v-model:open="changeLogVisible"
+      title="数据变更记录"
+      width="1600px"
+      :footer="null"
+      :destroy-on-close="false"
+    >
+      <div class="change-log-modal-content">
+        <ChangeLogSearch
+          :operation-type-dict="operationTypeDict"
+          @search-finish="handleChangeLogSearch"
+          @reset="handleChangeLogReset"
+        />
+        <BasicTable
+          ref="changeLogTableRef"
+          :columns="changeLogColumns"
+          :list-url="getApprovalChangeLogList"
+          :scroll-y="500"
+        >
+          <template #bodyCell="{ column, record }">
+            <template v-if="column.dataIndex === 'operationType'">
+              {{ handName(record.operationType, operationTypeDict) }}
+            </template>
+            <template v-if="column.dataIndex === 'bizType'">
+              {{ handName(record.bizType, yeWuType) }}
+            </template>
+            <template v-if="column.dataIndex === 'changeJson'">
+              <pre style="max-height: 200px; overflow: auto; margin: 0">{{
+                record.changeJson
+              }}</pre>
+            </template>
+          </template>
+        </BasicTable>
+      </div>
+    </a-modal>
 
-        <!-- 数据变更记录弹框 -->
-        <a-modal v-model:open="changeLogVisible" title="数据变更记录" width="1600px" :footer="null" :destroy-on-close="false">
-            <div class="change-log-modal-content">
-                <ChangeLogSearch :operation-type-dict="operationTypeDict" @search-finish="handleChangeLogSearch"
-                    @reset="handleChangeLogReset" />
-                <BasicTable ref="changeLogTableRef" :columns="changeLogColumns" :list-url="getApprovalChangeLogList"
-                    :scroll-y="500">
-                    <template #bodyCell="{ column, record }">
-                        <template v-if="column.dataIndex === 'operationType'">
-                            {{ handName(record.operationType, operationTypeDict) }}
-                        </template>
-                        <template v-if="column.dataIndex === 'bizType'">
-                            {{ handName(record.bizType, yeWuType) }}
-                        </template>
-                        <template v-if="column.dataIndex === 'changeJson'">
-                            <pre style="max-height: 200px; overflow: auto; margin: 0;">{{ record.changeJson }}</pre>
-                        </template>
-                    </template>
-                </BasicTable>
-            </div>
-        </a-modal>
+    <!-- 详情信息弹框 -->
+    <a-modal
+      v-model:open="detailVisible"
+      title="详情信息"
+      width="1800px"
+      :footer="null"
+      :destroy-on-close="true"
+    >
+      <div class="detail-modal-content">
+        <!-- 搜索组件 -->
+        <ApprovalDetailSearch
+          :guoyu-status="guoyuStatus"
+          :direction="direction"
+          @search-finish="handleDetailSearchFinish"
+          @reset="handleDetailReset"
+        />
 
-        <!-- 详情信息弹框 -->
-        <a-modal v-model:open="detailVisible" title="详情信息" width="1800px" :footer="null" :destroy-on-close="false">
-            <div class="detail-modal-content">
-                <!-- 搜索组件 -->
-                <ApprovalDetailSearch :guoyu-status="guoyuStatus" :direction="direction"
-                    @search-finish="handleDetailSearchFinish" @reset="handleDetailReset" />
+        <!-- 表格组件 -->
+        <BasicTable
+          ref="detailTableRef"
+          :columns="detailColumns"
+          :list-url="getFishDraftPage"
+          :scroll-y="'500px'"
+          :transform-data="customTransform"
+        >
+          <template #bodyCell="{ column, record }">
+            <template v-if="column.dataIndex === 'isfs'">
+              <a-tag
+                :color="record.isfs === 1 || record.isfs === '1' ? 'success' : 'error'"
+              >
+                {{ record.isfs === 1 || record.isfs === "1" ? "是" : "否" }}
+              </a-tag>
+            </template>
+            <template v-if="column.dataIndex === 'direction'">
+              {{ handName(record.direction, direction) }}
+            </template>
+            <template v-if="column.key === 'action' || column.dataIndex === 'action'">
+              <a-button type="link" size="small" @click="handleView(record)"
+                >查看</a-button
+              >
+            </template>
+          </template>
+        </BasicTable>
+      </div>
+    </a-modal>
 
-                <!-- 表格组件 -->
-                <BasicTable ref="detailTableRef" :columns="detailColumns" :isOneLoad="false" :list-url="getFishDraftPage"
-                    :scroll-y="'500px'" :transform-data="customTransform">
-                    <template #bodyCell="{ column, record }">
-                        <template v-if="column.dataIndex === 'isfs'">
-                            <a-tag :color="record.isfs === 1 || record.isfs === '1' ? 'success' : 'error'">
-                                {{ record.isfs === 1 || record.isfs === '1' ? '是' : '否' }}
-                            </a-tag>
-                        </template>
-                        <template v-if="column.dataIndex === 'direction'">
-                            {{ handName(record.direction, direction) }}
-                        </template>
-                        <template v-if="column.key === 'action' || column.dataIndex === 'action'">
-                            <a-button type="link" size="small" @click="handleView(record)">查看</a-button>
-                        </template>
-                    </template>
-                </BasicTable>
-            </div>
-        </a-modal>
+    <!-- 查看详情弹框 -->
+    <EditModal
+      ref="editModalRef"
+      v-model:visible="viewModalVisible"
+      :is-view="true"
+      :direction="direction"
+      :initial-values="currentViewRecord"
+      @cancel="handleViewCancel"
+      @preview-click="handlePreviewClick"
+    />
+    <!-- 预览媒体组件 -->
+    <PreviewMedia
+      ref="previewMediaRef"
+      v-model:visible="mediaPreviewVisible"
+      :previewList="previewList"
+      :previewListIndex="previewListIndex"
+      :videoPreviewTitle="videoPreviewTitle"
+      :isDel="false"
+    />
 
-        <!-- 查看详情弹框 -->
-        <EditModal ref="editModalRef" v-model:visible="viewModalVisible" :is-view="true" :direction="direction"
-            :initial-values="currentViewRecord" @cancel="handleViewCancel" @preview-click="handlePreviewClick" />
+    <!-- 批量审批弹框 -->
+    <a-modal
+      v-model:open="batchApproveVisible"
+      title="批量审批确认"
+      :confirm-loading="batchApproveLoading"
+      @ok="handleBatchApproveConfirm"
+      @cancel="handleBatchApproveCancel"
+      width="600px"
+    >
+      <a-form :model="batchApproveForm">
+        <a-form-item label="选中记录数">
+          <span>{{ selectedRows.length }} 条</span>
+        </a-form-item>
+        <a-form-item label="审批意见">
+          <a-textarea
+            v-model:value="batchApproveForm.approveComment"
+            :rows="4"
+            placeholder="请输入审批意见（必填）"
+            :maxlength="500"
+            show-count
+          />
+        </a-form-item>
+      </a-form>
+    </a-modal>
 
-        <!-- 媒体预览 Modal -->
-        <a-modal v-model:open="mediaPreviewVisible" :title="videoPreviewTitle" :footer="null" width="900px"
-            @cancel="closeMediaPreview" :z-index="2000">
-            <div class="flex h-[60vh] gap-4">
-                <!-- 左侧：混合列表 (图片+视频) -->
-                <div class="w-1/4 overflow-y-auto border-r pr-2 media-list-container">
-                    <div v-for="(item, index) in previewList" :key="index" class="mb-2 cursor-pointer list-item"
-                        :class="{ select: index === currentMediaIndex }" @click="currentMediaIndex = index">
-                        <span class="file-name">{{ item.name }}</span>
-                    </div>
-                </div>
-
-                <!-- 右侧：动态预览区域 -->
-                <div class="w-3/4 flex flex-col items-center justify-center bg-gray-100 relative p-4">
-                    <!-- 图片预览 -->
-                    <a-image v-if="
-                        currentMediaItem &&
-                        currentMediaItem.url != '' &&
-                        (currentMediaItem.type === 'image' || currentMediaItem.type === 'formImage')
-                    " :src="currentMediaItem.url" class="max-w-full max-h-full object-contain" />
-                    <div v-else-if="
-                        currentMediaItem &&
-                        currentMediaItem.url == '' &&
-                        (currentMediaItem.type === 'image' || currentMediaItem.type === 'formImage')
-                    " class="text-gray-400">
-                        暂无图片预览
-                    </div>
-
-                    <!-- 视频预览 -->
-                    <video v-else-if="
-                        currentMediaItem &&
-                        currentMediaItem.url != '' &&
-                        (currentMediaItem.type === 'video' || currentMediaItem.type === 'formVideo')
-                    " :src="currentMediaItem.url" controls autoplay class="max-w-full max-h-[50vh]">
-                        您的浏览器不支持视频播放
-                    </video>
-                    <div v-else-if="
-                        currentMediaItem &&
-                        currentMediaItem.url == '' &&
-                        (currentMediaItem.type === 'video' || currentMediaItem.type === 'formVideo')
-                    " class="text-gray-400">
-                        暂无视频预览
-                    </div>
-
-                    <!-- 底部切换控制 -->
-                    <div class="absolute bottom-4 flex gap-4 z-10">
-                        <a-button shape="circle" :icon="h(LeftOutlined)" @click="prevMedia"
-                            :disabled="currentMediaIndex === 0" />
-                        <span class="self-center text-gray-600 bg-white px-2 rounded shadow-sm">
-                            {{ currentMediaIndex + 1 }} / {{ previewList.length }}
-                        </span>
-                        <a-button shape="circle" :icon="h(RightOutlined)" @click="nextMedia"
-                            :disabled="currentMediaIndex === previewList.length - 1" />
-                    </div>
-                </div>
-            </div>
-        </a-modal>
-
-        <!-- 批量审批弹框 -->
-        <a-modal v-model:open="batchApproveVisible" title="批量审批确认" :confirm-loading="batchApproveLoading"
-            @ok="handleBatchApproveConfirm" @cancel="handleBatchApproveCancel" width="600px">
-            <a-form :model="batchApproveForm">
-                <a-form-item label="选中记录数">
-                    <span>{{ selectedRows.length }} 条</span>
-                </a-form-item>
-                <a-form-item label="审批意见">
-                    <a-textarea v-model:value="batchApproveForm.approveComment" :rows="4" placeholder="请输入审批意见（必填）"
-                        :maxlength="500" show-count />
-                </a-form-item>
-            </a-form>
-        </a-modal>
-
-        <!-- 批量驳回弹框 -->
-        <a-modal v-model:open="batchRejectVisible" title="批量驳回确认" :confirm-loading="batchRejectLoading"
-            @ok="handleBatchRejectConfirm" @cancel="handleBatchRejectCancel" width="600px">
-            <a-form :model="batchRejectForm">
-                <a-form-item label="选中记录数">
-                    <span>{{ selectedRows.length }} 条</span>
-                </a-form-item>
-                <a-form-item label="驳回原因" required>
-                    <a-textarea v-model:value="batchRejectForm.rejectReason" :rows="4" placeholder="请输入驳回原因（必填）"
-                        :maxlength="500" show-count />
-                </a-form-item>
-            </a-form>
-        </a-modal>
-    </div>
+    <!-- 批量驳回弹框 -->
+    <a-modal
+      v-model:open="batchRejectVisible"
+      title="批量驳回确认"
+      :confirm-loading="batchRejectLoading"
+      @ok="handleBatchRejectConfirm"
+      @cancel="handleBatchRejectCancel"
+      width="600px"
+    >
+      <a-form :model="batchRejectForm">
+        <a-form-item label="选中记录数">
+          <span>{{ selectedRows.length }} 条</span>
+        </a-form-item>
+        <a-form-item label="驳回原因" required>
+          <a-textarea
+            v-model:value="batchRejectForm.rejectReason"
+            :rows="4"
+            placeholder="请输入驳回原因（必填）"
+            :maxlength="500"
+            show-count
+          />
+        </a-form-item>
+      </a-form>
+    </a-modal>
+  </div>
 </template>
 
 <script lang="ts" setup>
-import { ref, reactive, onMounted, h, computed, nextTick } from 'vue';
-import dayjs from "dayjs";
-import { queryPageList, getApprovalLogList, getApprovalChangeLogList, batchApproveByApprovalId, batchReject } from '@/api/shengPiJiLu';
-import { Tag, message } from "ant-design-vue";
-import { LeftOutlined, RightOutlined } from "@ant-design/icons-vue";
+import { ref, onMounted, h, computed, nextTick } from "vue";
+import {
+  queryPageList,
+  getApprovalLogList,
+  getApprovalChangeLogList,
+  batchApproveByApprovalId,
+  batchReject,
+} from "@/api/shengPiJiLu";
+import { Tag, message, Modal } from "ant-design-vue";
 import BasicTable from "@/components/BasicTable/index.vue";
 import GuoYuSheShiShuJuTianBaoSearch from "./shengPiJiLuSearch.vue";
 import ApprovalLogSearch from "./approvalLogSearch.vue";
 import ChangeLogSearch from "./changeLogSearch.vue";
 import ApprovalDetailSearch from "./approvalDetailSearch.vue";
 import EditModal from "@/views/shuJuTianBao/guoYuSheShiShuJuTianBao/guoYuSheShiShuJuTianBaoForm.vue";
-import { getDictItemsByCode } from '@/api/dict';
-import { getFishDraftPage } from "@/api/guoYuSheShiShuJuTianBao";
-import { set } from 'lodash';
-
+import { getDictItemsByCode } from "@/api/dict";
+import { getFishDraftPage, batchRemoveDraft } from "@/api/guoYuSheShiShuJuTianBao";
+import PreviewMedia from "@/components/previewMedia/index.vue";
 const baseUrl = import.meta.env.VITE_APP_PREVIEW_URL;
-const baseUrlPreview = import.meta.env.VITE_APP_BASE_URL;
-
 let columns = ref([
-    {
-        dataIndex: "hbrvnm",
-        key: "hbrvnm",
-        title: "流域",
-        width: 120,
-        fixed: "left",
-    },
-    { dataIndex: "ennm", key: "ennm", title: "电站名称", width: 200, fixed: "left",
-     customRender: ({ text }: any) => {
-            if (!text) return "-";
-            
-            const str = String(text);
-            // 按逗号分割（支持中文逗号和英文逗号）
-            const items = str.split(/[,，]/);
-            
-            // 如果数量超过6个，截取前6个并添加省略号
-            let displayText = "";
-            if (items.length > 6) {
-                displayText = items.slice(0, 6).join("，") + " ...";
-            } else {
-                displayText = str;
-            }
+  {
+    dataIndex: "hbrvnm",
+    key: "hbrvnm",
+    title: "流域",
+    width: 120,
+    fixed: "left",
+  },
+  {
+    dataIndex: "ennm",
+    key: "ennm",
+    title: "电站名称",
+    width: 200,
+    fixed: "left",
+    customRender: ({ text }: any) => {
+      if (!text) return "-";
 
-            // 返回 span 标签，title 属性用于悬停显示全称
-            return h('span', { 
-                title: str, 
-                style: { 
-                    cursor: 'default' 
-                } 
-            }, displayText);
+      const str = String(text);
+      // 按逗号分割（支持中文逗号和英文逗号）
+      const items = str.split(/[,，]/);
+
+      // 如果数量超过6个，截取前6个并添加省略号
+      let displayText = "";
+      if (items.length > 6) {
+        displayText = items.slice(0, 6).join("，") + " ...";
+      } else {
+        displayText = str;
+      }
+
+      // 返回 span 标签，title 属性用于悬停显示全称
+      return h(
+        "span",
+        {
+          title: str,
+          style: {
+            cursor: "default",
+          },
         },
+        displayText
+      );
     },
-    {
-        title: '审批批次号',
-        dataIndex: 'approvalNo',
-        key: 'approvalNo',
-        width: 160,
-        fixed: 'left'
-    },
-    {
-        title: '数据条数',
-        dataIndex: 'dataCount',
-        key: 'dataCount',
-        width: 100,
-        align: 'center'
-    },
-    {
-        title: '提交人',
-        dataIndex: 'applyUserName',
-        key: 'applyUserName',
-        width: 120,
-        align: 'center'
-    },
-    {
-        title: '提交时间',
-        dataIndex: 'applyTime',
-        key: 'applyTime',
-        width: 160,
-        align: 'center'
-
-    },
-    {
-        title: '审批状态',
-        dataIndex: 'status',
-        key: 'status',
-        width: 80,
-        align: 'center',
-        customRender: ({ text }: any) => {
-            let data = shenStatus.value.find((item: any) => item.itemCode === text);
-            return h(
-                Tag,
-                {
-                    color: data?.custom1 || "error", // Antdv Tag 的颜色预设
-                },
-                () => data?.dictName || "-"
-            );
+  },
+  {
+    title: "审批批次号",
+    dataIndex: "approvalNo",
+    key: "approvalNo",
+    width: 160,
+    fixed: "left",
+  },
+  {
+    title: "数据条数",
+    dataIndex: "dataCount",
+    key: "dataCount",
+    width: 100,
+    align: "center",
+  },
+  {
+    title: "提交人",
+    dataIndex: "applyUserName",
+    key: "applyUserName",
+    width: 120,
+    align: "center",
+  },
+  {
+    title: "提交时间",
+    dataIndex: "applyTime",
+    key: "applyTime",
+    width: 160,
+    align: "center",
+  },
+  {
+    title: "审批状态",
+    dataIndex: "status",
+    key: "status",
+    width: 80,
+    align: "center",
+    customRender: ({ text }: any) => {
+      let data = shenStatus.value.find((item: any) => item.itemCode === text);
+      return h(
+        Tag,
+        {
+          color: data?.custom1 || "error", // Antdv Tag 的颜色预设
         },
-
+        () => data?.dictName || "-"
+      );
     },
-    {
-        title: '审批人',
-        dataIndex: 'approverName',
-        key: 'approverName',
-        width: 120,
-        align: 'center'
-    },
-    {
-        title: '审批时间',
-        dataIndex: 'approveTime',
-        key: 'approveTime',
-        width: 160,
-        align: 'center'
-
-    },
-    {
-        title: '审批备注',
-        dataIndex: 'remark',
-        key: 'remark',
-        ellipsis: true,
-
-    },
-    {
-        title: '操作',
-        key: 'action',
-        width: 120,
-        fixed: 'right',
-    }
+  },
+  {
+    title: "审批人",
+    dataIndex: "approverName",
+    key: "approverName",
+    width: 120,
+    align: "center",
+  },
+  {
+    title: "审批时间",
+    dataIndex: "approveTime",
+    key: "approveTime",
+    width: 160,
+    align: "center",
+  },
+  {
+    title: "审批备注",
+    dataIndex: "remark",
+    key: "remark",
+    ellipsis: true,
+  },
+  {
+    title: "操作",
+    key: "action",
+    width: 120,
+    fixed: "right",
+  },
 ]);
-const tableRef = ref()
+const tableRef = ref();
 const handleSearchFinish = (values: any) => {
-    console.log(values);
-    const filters = [
-        values.status && {
-            field: "status",
-            operator: "eq",
-            dataType: "string",
-            value: values.status,
-        },
-        values.hbrvcd !== "all" && {
-            field: "hbrvcd",
-            operator: "eq",
-            dataType: "string",
-            value: values.hbrvcd,
-        },
-        values.stcd && {
-            field: "stcd",
-            operator: "eq",
-            dataType: "string",
-            value: values.stcd,
-        },
-    ].filter(Boolean);
+  console.log(values);
+  const filters = [
+    values.status && {
+      field: "status",
+      operator: "eq",
+      dataType: "string",
+      value: values.status,
+    },
+    values.hbrvcd !== "all" && {
+      field: "hbrvcd",
+      operator: "eq",
+      dataType: "string",
+      value: values.hbrvcd,
+    },
+    values.stcd && {
+      field: "stcd",
+      operator: "eq",
+      dataType: "string",
+      value: values.stcd,
+    },
+  ].filter(Boolean);
 
-
-    const filter = {
-        logic: "and",
-        filters: filters,
-
-    };
-    tableRef.value?.getList(filter);
+  const filter = {
+    logic: "and",
+    filters: filters,
+  };
+  tableRef.value?.getList(filter);
 };
 const handleReset = (values) => {
-    handleSearchFinish(values);
+  handleSearchFinish(values);
 };
 
 // 审批操作日志弹框相关
@@ -351,39 +398,38 @@ const approvalLogVisible = ref(false);
 const approvalLogTableRef = ref();
 
 const approvalLogColumns = ref([
-    {
-        title: '操作类型',
-        dataIndex: 'action',
-        key: 'action',
-        width: 120,
-        align: 'center'
-    },
-    {
-        title: '操作人',
-        dataIndex: 'operatorName',
-        key: 'operatorName',
-        width: 150,
-        align: 'center'
-    },
-    {
-        title: '操作时间',
-        dataIndex: 'operateTime',
-        key: 'operateTime',
-        width: 180
-    },
-    {
-        title: '创建时间',
-        dataIndex: 'createdAt',
-        key: 'createdAt',
-        width: 180
-    },
-    {
-        title: '审批意见',
-        dataIndex: 'commentInfo',
-        key: 'commentInfo',
-        ellipsis: true,
-    },
-
+  {
+    title: "操作类型",
+    dataIndex: "action",
+    key: "action",
+    width: 120,
+    align: "center",
+  },
+  {
+    title: "操作人",
+    dataIndex: "operatorName",
+    key: "operatorName",
+    width: 150,
+    align: "center",
+  },
+  {
+    title: "操作时间",
+    dataIndex: "operateTime",
+    key: "operateTime",
+    width: 180,
+  },
+  {
+    title: "创建时间",
+    dataIndex: "createdAt",
+    key: "createdAt",
+    width: 180,
+  },
+  {
+    title: "审批意见",
+    dataIndex: "commentInfo",
+    key: "commentInfo",
+    ellipsis: true,
+  },
 ]);
 
 // 数据变更记录弹框相关
@@ -391,49 +437,48 @@ const changeLogVisible = ref(false);
 const changeLogTableRef = ref();
 
 const changeLogColumns = ref([
-    {
-        title: '业务类型',
-        dataIndex: 'bizType',
-        key: 'bizType',
-        width: 120,
-        align: 'center'
-    },
-    {
-        title: '操作类型',
-        dataIndex: 'operationType',
-        key: 'operationType',
-        width: 120,
-        align: 'center'
-    },
-    {
-        title: '操作人',
-        dataIndex: 'operatorName',
-        key: 'operatorName',
-        width: 150,
-        align: 'center'
-    },
-    {
-        title: '操作时间',
-        dataIndex: 'operateTime',
-        key: 'operateTime',
-        width: 180
-    },
-    {
-        title: '创建时间',
-        dataIndex: 'createdAt',
-        key: 'createdAt',
-        width: 180
-    },
-    {
-        title: '变更内容',
-        dataIndex: 'changeJson',
-        key: 'changeJson',
-        ellipsis: true
-    },
-
+  {
+    title: "业务类型",
+    dataIndex: "bizType",
+    key: "bizType",
+    width: 120,
+    align: "center",
+  },
+  {
+    title: "操作类型",
+    dataIndex: "operationType",
+    key: "operationType",
+    width: 120,
+    align: "center",
+  },
+  {
+    title: "操作人",
+    dataIndex: "operatorName",
+    key: "operatorName",
+    width: 150,
+    align: "center",
+  },
+  {
+    title: "操作时间",
+    dataIndex: "operateTime",
+    key: "operateTime",
+    width: 180,
+  },
+  {
+    title: "创建时间",
+    dataIndex: "createdAt",
+    key: "createdAt",
+    width: 180,
+  },
+  {
+    title: "变更内容",
+    dataIndex: "changeJson",
+    key: "changeJson",
+    ellipsis: true,
+  },
 ]);
 
-const currentApprovalId = ref('');
+const currentApprovalId = ref("");
 const actionTypeDict = ref([]);
 const operationTypeDict = ref([]);
 
@@ -445,371 +490,338 @@ const direction = ref([]);
 
 // 查看详情弹框相关
 const viewModalVisible = ref(false);
-const editModalRef = ref<any>(null);
 const currentViewRecord = ref<any>(null);
 
 // 媒体预览相关
 const mediaPreviewVisible = ref(false);
 const videoPreviewTitle = ref("预览");
 interface MediaItem {
-    id: string;
-    type: "image" | "video" | "formVideo" | "formImage";
-    name: string;
-    url: string;
+  id: string;
+  type: "image" | "video";
+  name: string;
+  url: string;
 }
 const previewList = ref<MediaItem[]>([]);
-const currentMediaIndex = ref(0);
-const tablePreviewRecord = ref<any>({});
-
-const currentMediaItem = computed(() => previewList.value[currentMediaIndex.value]);
-
+const previewListIndex = ref(0);
 // 详情表格列定义（删除状态列）
 const detailColumns = ref([
-    { dataIndex: "hbrvnm", key: "hbrvnm", title: "流域", width: 120, fixed: "left" },
-    { dataIndex: "ennm", key: "ennm", title: "电站名称", width: 120, fixed: "left" },
-    { dataIndex: "stnm", key: "stnm", title: "过鱼设施名称", width: 150, fixed: "left" },
-    { dataIndex: "strdt", key: "strdt", title: "过鱼时间", width: 150 },
-    { dataIndex: "ftpName", key: "ftpName", title: "鱼种类", width: 120 },
-    {
-        dataIndex: "isfs",
-        key: "isfs",
-        title: "是否鱼苗",
-        width: 74,
-    },
-    {
-        dataIndex: "direction",
-        key: "direction",
-        title: "游向",
-        width: 80,
-    },
-    { dataIndex: "fcnt", key: "fcnt", title: "过鱼数量(尾)", width: 120 },
-    { dataIndex: "fsz", key: "fsz", title: "体长(cm)", width: 110 },
-    { dataIndex: "fwet", key: "fwet", title: "平均体重(g)", width: 110 },
-    { dataIndex: "wt", key: "wt", title: "水温(℃)", width: 80 },
-    { dataIndex: "tm", key: "tm", title: "填报时间", width: 150 },
-    {
-        title: "操作",
-        key: "action",
-        dataIndex: "action",
-        fixed: "right",
-        width: 100,
-        align: "center",
-    },
+  { dataIndex: "hbrvnm", key: "hbrvnm", title: "流域", width: 120, fixed: "left" },
+  { dataIndex: "ennm", key: "ennm", title: "电站名称", width: 120, fixed: "left" },
+  { dataIndex: "stnm", key: "stnm", title: "过鱼设施名称", width: 150, fixed: "left" },
+  { dataIndex: "strdt", key: "strdt", title: "过鱼时间", width: 150 },
+  { dataIndex: "ftpName", key: "ftpName", title: "鱼种类", width: 120 },
+  {
+    dataIndex: "isfs",
+    key: "isfs",
+    title: "是否鱼苗",
+    width: 74,
+  },
+  {
+    dataIndex: "direction",
+    key: "direction",
+    title: "游向",
+    width: 80,
+  },
+  { dataIndex: "fcnt", key: "fcnt", title: "过鱼数量(尾)", width: 120 },
+  { dataIndex: "fsz", key: "fsz", title: "体长(cm)", width: 110 },
+  { dataIndex: "fwet", key: "fwet", title: "平均体重(g)", width: 110 },
+  { dataIndex: "wt", key: "wt", title: "水温(℃)", width: 80 },
+  { dataIndex: "tm", key: "tm", title: "填报时间", width: 150 },
+  {
+    title: "操作",
+    key: "action",
+    dataIndex: "action",
+    fixed: "right",
+    width: 100,
+    align: "center",
+  },
 ]);
 
 // 数据转换函数
 const customTransform = (res: any) => {
-    const rawRecords = res?.data?.records || [];
-    const modifiedRecords = rawRecords.map((item: any) => {
-        return {
-            ...item,
-            picpthList: item.picpth
-                ? item.picpth.split(",").map((item: string) => baseUrl + "/?" + item) || []
-                : [],
-        };
-    });
+  const rawRecords = res?.data?.records || [];
+  const modifiedRecords = rawRecords.map((item: any) => {
     return {
-        records: modifiedRecords,
-        total: res?.data?.total || 0,
+      ...item,
+      picpthList: item.picpth
+        ? item.picpth.split(",").map((item: string) => baseUrl + "/?" + item) || []
+        : [],
     };
+  });
+  return {
+    records: modifiedRecords,
+    total: res?.data?.total || 0,
+  };
 };
 
 // 详情搜索处理
 const handleDetailSearchFinish = (values: any) => {
-    console.log('详情搜索:', values);
-    const filters = [
-        values.ftp && {
-            field: "ftp",
-            operator: "eq",
-            dataType: "string",
-            value: values.ftp,
-        },
-        values.strdt && {
-            field: "strdt",
-            operator: "gte",
-            dataType: "date",
-            value: values.strdt[0] + " 00:00:00",
-        },
-        values.strdt && {
-            field: "strdt",
-            operator: "lte",
-            dataType: "date",
-            value: values.strdt[1] + " 23:59:59",
-        },
-        values.direction && {
-            field: "direction",
-            operator: "eq",
-            dataType: "string",
-            value: values.direction,
-        },
-        values.rstcd && {
-            field: "rstcd",
-            operator: "eq",
-            dataType: "string",
-            value: values.rstcd,
-        },
-        values.hbrvcd !== "all" && {
-            field: "hbrvcd",
-            operator: "eq",
-            dataType: "string",
-            value: values.hbrvcd,
-        },
-        approvalId.value && {
-            field: "approvalId",      // 字段名
-            operator: "eq",           // 等于操作符
-            dataType: "string",       // 字符串类型
-            value: approvalId.value  // 从 record 中获取审批批次号
-        }
+  console.log("详情搜索:", values);
+  const filters = [
+    values.ftp && {
+      field: "ftp",
+      operator: "eq",
+      dataType: "string",
+      value: values.ftp,
+    },
+    values.strdt && {
+      field: "strdt",
+      operator: "gte",
+      dataType: "date",
+      value: values.strdt[0] + " 00:00:00",
+    },
+    values.strdt && {
+      field: "strdt",
+      operator: "lte",
+      dataType: "date",
+      value: values.strdt[1] + " 23:59:59",
+    },
+    values.direction && {
+      field: "direction",
+      operator: "eq",
+      dataType: "string",
+      value: values.direction,
+    },
+    values.rstcd && {
+      field: "rstcd",
+      operator: "eq",
+      dataType: "string",
+      value: values.rstcd,
+    },
+    values.hbrvcd !== "all" && {
+      field: "hbrvcd",
+      operator: "eq",
+      dataType: "string",
+      value: values.hbrvcd,
+    },
+    approvalId.value && {
+      field: "approvalId", // 字段名
+      operator: "eq", // 等于操作符
+      dataType: "string", // 字符串类型
+      value: approvalId.value, // 从 record 中获取审批批次号
+    },
+  ].filter(Boolean);
 
-    ].filter(Boolean);
-
-    const filter = {
-        logic: "and",
-        filters: filters,
-    };
-    detailTableRef.value?.getList(filter);
+  const filter = {
+    logic: "and",
+    filters: filters,
+  };
+  detailTableRef.value?.getList(filter);
 };
 
 // 详情重置处理
 const handleDetailReset = (values: any) => {
-    console.log('详情重置:', values);
-    handleDetailSearchFinish(values);
+  console.log("详情重置:", values);
+  handleDetailSearchFinish(values);
 };
 
 // 显示详情弹框
-const approvalId = ref('');
+const approvalId = ref("");
 const handleShowDetail = (record: any) => {
-    approvalId.value = record.id;
-    setTimeout(() => {
-        detailVisible.value = true;
-    }, 300);
+  approvalId.value = record.id;
+  setTimeout(() => {
+    detailVisible.value = true;
+  }, 300);
 };
 
 // 查看单条记录
 const handleView = (record: any) => {
-    currentViewRecord.value = { ...record };
-    viewModalVisible.value = true;
+  currentViewRecord.value = { ...record };
+  viewModalVisible.value = true;
 };
 
 // 关闭查看弹框
 const handleViewCancel = () => {
-    viewModalVisible.value = false;
+  viewModalVisible.value = false;
 };
 
 // 处理预览点击
 const handlePreviewClick = (record: any, type: string, index: number) => {
-    const mixedList: MediaItem[] = [];
-    if (type === "formImage") {
-        videoPreviewTitle.value = "图片预览";
-        const nameList = JSON.parse(JSON.stringify(record)).picpthList;
-        nameList.forEach((item: any) => {
-            mixedList.push({
-                id: record.id,
-                type: "formImage",
-                name: item.name,
-                url: item.url,
-            });
-        });
-    } else if (type === "formVideo") {
-        videoPreviewTitle.value = "视频预览";
-        const nameList = JSON.parse(JSON.stringify(record)).vdpthList;
-        nameList.forEach((item: any) => {
-            mixedList.push({
-                id: record.id,
-                type: "formVideo",
-                name: item.name,
-                url: item.url,
-            });
-        });
-    }
-
-    mediaPreviewVisible.value = true;
-    currentMediaIndex.value = index;
-    nextTick(() => {
-        previewList.value = mixedList;
+  const mixedList: MediaItem[] = [];
+  if (type === "image") {
+    videoPreviewTitle.value = "图片预览";
+    const nameList = JSON.parse(JSON.stringify(record)).picpthList;
+    nameList.forEach((item: any) => {
+      mixedList.push({
+        id: record.id,
+        type: "image",
+        name: item.name,
+        url: item.url,
+      });
     });
-};
-
-// 上一个媒体
-const prevMedia = () => {
-    if (currentMediaIndex.value > 0) {
-        currentMediaIndex.value--;
-    }
-};
-
-// 下一个媒体
-const nextMedia = () => {
-    if (currentMediaIndex.value < previewList.value.length - 1) {
-        currentMediaIndex.value++;
-    }
-};
-
-// 关闭媒体预览
-const closeMediaPreview = () => {
-    mediaPreviewVisible.value = false;
-    nextTick(() => {
-        previewList.value = [];
-        currentMediaIndex.value = 0;
+  } else if (type === "video") {
+    videoPreviewTitle.value = "视频预览";
+    const nameList = JSON.parse(JSON.stringify(record)).vdpthList;
+    nameList.forEach((item: any) => {
+      mixedList.push({
+        id: record.id,
+        type: "video",
+        name: item.name,
+        url: item.url,
+      });
     });
+  }
+
+  mediaPreviewVisible.value = true;
+  previewListIndex.value = index;
+  nextTick(() => {
+    previewList.value = mixedList;
+  });
 };
 
 // 显示审批操作日志弹框
 const handleShowApprovalLog = (record: any) => {
-    currentApprovalId.value = record.id;
-    approvalLogVisible.value = true;
-    // 延迟调用，确保弹框和 BasicTable 组件完全渲染
-    setTimeout(() => {
-        const filter = {
-            logic: "and",
-            filters: [
-                {
-                    field: "approvalId",
-                    operator: "eq",
-                    dataType: "string",
-                    value: record.id,
-                }
-            ],
-            sort:[
-                { field: "operateTime", order: "desc" }
-            ]
-        };
-        approvalLogTableRef.value?.getList(filter);
-    }, 300);
+  currentApprovalId.value = record.id;
+  approvalLogVisible.value = true;
+  // 延迟调用，确保弹框和 BasicTable 组件完全渲染
+  setTimeout(() => {
+    const filter = {
+      logic: "and",
+      filters: [
+        {
+          field: "approvalId",
+          operator: "eq",
+          dataType: "string",
+          value: record.id,
+        },
+      ],
+      sort: [{ field: "operateTime", order: "desc" }],
+    };
+    approvalLogTableRef.value?.getList(filter);
+  }, 300);
 };
 
 // 审批日志搜索处理
 const handleApprovalLogSearch = (values: any) => {
-    console.log('审批日志搜索:', values);
-    const filters = [
-        {
-            field: "approvalId",
-            operator: "eq",
-            dataType: "string",
-            value: currentApprovalId.value,
-        },
-        values.action && {
-            field: "action",
-            operator: "eq",
-            dataType: "string",
-            value: values.action,
-        },
-    ].filter(Boolean);
+  console.log("审批日志搜索:", values);
+  const filters = [
+    {
+      field: "approvalId",
+      operator: "eq",
+      dataType: "string",
+      value: currentApprovalId.value,
+    },
+    values.action && {
+      field: "action",
+      operator: "eq",
+      dataType: "string",
+      value: values.action,
+    },
+  ].filter(Boolean);
 
-    const filter = {
-        logic: "and",
-        filters: filters,
-    };
-    approvalLogTableRef.value?.getList(filter);
+  const filter = {
+    logic: "and",
+    filters: filters,
+  };
+  approvalLogTableRef.value?.getList(filter);
 };
 
 // 审批日志重置处理
 const handleApprovalLogReset = (values: any) => {
-    console.log('审批日志重置:', values);
-    handleApprovalLogSearch(values);
+  console.log("审批日志重置:", values);
+  handleApprovalLogSearch(values);
 };
 
 // 显示数据变更记录弹框
 const handleShowChangeLog = (record: any) => {
-    currentApprovalId.value = record.id;
-    changeLogVisible.value = true;
-    // 延迟调用，确保弹框和 BasicTable 组件完全渲染
-    setTimeout(() => {
-        const filter = {
-            logic: "and",
-            filters: [
-                {
-                    field: "approvalId",
-                    operator: "eq",
-                    dataType: "string",
-                    value: record.id,
-                }
-            ]
-        };
-        changeLogTableRef.value?.getList(filter);
-    }, 300);
+  currentApprovalId.value = record.id;
+  changeLogVisible.value = true;
+  // 延迟调用，确保弹框和 BasicTable 组件完全渲染
+  setTimeout(() => {
+    const filter = {
+      logic: "and",
+      filters: [
+        {
+          field: "approvalId",
+          operator: "eq",
+          dataType: "string",
+          value: record.id,
+        },
+      ],
+    };
+    changeLogTableRef.value?.getList(filter);
+  }, 300);
 };
 
 // 变更日志搜索处理
 const handleChangeLogSearch = (values: any) => {
-    console.log('变更日志搜索:', values);
-    const filters = [
-        {
-            field: "approvalId",
-            operator: "eq",
-            dataType: "string",
-            value: currentApprovalId.value,
-        },
-        values.operationType && {
-            field: "operationType",
-            operator: "eq",
-            dataType: "string",
-            value: values.operationType,
-        },
-    ].filter(Boolean);
+  console.log("变更日志搜索:", values);
+  const filters = [
+    {
+      field: "approvalId",
+      operator: "eq",
+      dataType: "string",
+      value: currentApprovalId.value,
+    },
+    values.operationType && {
+      field: "operationType",
+      operator: "eq",
+      dataType: "string",
+      value: values.operationType,
+    },
+  ].filter(Boolean);
 
-    const filter = {
-        logic: "and",
-        filters: filters,
-    };
-    changeLogTableRef.value?.getList(filter);
+  const filter = {
+    logic: "and",
+    filters: filters,
+  };
+  changeLogTableRef.value?.getList(filter);
 };
 
 // 变更日志重置处理
 const handleChangeLogReset = (values: any) => {
-    console.log('变更日志重置:', values);
-    handleChangeLogSearch(values);
+  console.log("变更日志重置:", values);
+  handleChangeLogSearch(values);
 };
 
 // 初始化
 onMounted(() => {
-    dictNmae();
+  dictNmae();
 
-    // 获取过鱼设施相关字典
-    getDictItemsByCode({ dictCode: 'direction' }).then((res) => {
-        direction.value = res.data;
-    });
-    getDictItemsByCode({ dictCode: 'approvalStatus' }).then((res) => {
-        guoyuStatus.value = res.data;
-    });
+  // 获取过鱼设施相关字典
+  getDictItemsByCode({ dictCode: "direction" }).then((res) => {
+    direction.value = res.data;
+  });
+  getDictItemsByCode({ dictCode: "approvalStatus" }).then((res) => {
+    guoyuStatus.value = res.data;
+  });
 });
 
-const shenStatus = ref([])
-const yeWuType = ref([])
+const shenStatus = ref([]);
+const yeWuType = ref([]);
 const dictNmae = () => {
-    getDictItemsByCode({ dictCode: 'approvalStatus' }).then((res) => {
-        shenStatus.value = res.data;
+  getDictItemsByCode({ dictCode: "approvalStatus" }).then((res) => {
+    shenStatus.value = res.data;
+  });
+  getDictItemsByCode({ dictCode: "yeWuType" }).then((res) => {
+    yeWuType.value = res.data;
+  });
+  // TODO: 待补充操作类型字典
+  getDictItemsByCode({ dictCode: "caoType" }).then((res) => {
+    res.data.forEach((item: any) => {
+      if (item.itemCode == "UPDATE" || item.itemCode == "DELETE") {
+        operationTypeDict.value.push(item);
+      } else {
+        actionTypeDict.value.push(item);
+      }
     });
-    getDictItemsByCode({ dictCode: 'yeWuType' }).then((res) => {
-        yeWuType.value = res.data;
-    });
-    // TODO: 待补充操作类型字典
-    getDictItemsByCode({ dictCode: 'caoType' }).then((res) => {
-
-
-        res.data.forEach((item: any) => {
-            if (item.itemCode == 'UPDATE' || item.itemCode == 'DELETE') {
-                operationTypeDict.value.push(item);
-            } else {
-                actionTypeDict.value.push(item)
-            }
-        })
-    });
-}
+  });
+};
 const handName = (val: any, arr: any) => {
-    let dictName1 = ''
-    arr.forEach((item: any) => {
-        if (item.itemCode == val) {
-            dictName1 = item.dictName
-        }
-    })
-    return dictName1
-}
+  let dictName1 = "";
+  arr.forEach((item: any) => {
+    if (item.itemCode == val) {
+      dictName1 = item.dictName;
+    }
+  });
+  return dictName1;
+};
 
 // 批量审批相关状态
 const batchApproveVisible = ref(false);
 const batchApproveLoading = ref(false);
 const batchApproveForm = ref({
-    approveComment: ''
+  approveComment: "",
 });
 const selectedRows = ref<any[]>([]);
 
@@ -817,228 +829,237 @@ const selectedRows = ref<any[]>([]);
 const batchRejectVisible = ref(false);
 const batchRejectLoading = ref(false);
 const batchRejectForm = ref({
-    rejectReason: ''
+  rejectReason: "",
 });
 
 // 监听表格选中变化
 const handleSelectionChange = (rows: any[], data: any) => {
-    selectedRows.value = data;
+  selectedRows.value = data;
 };
 
 // 打开批量审批弹框
 const handleBatchApprove = () => {
-    if (selectedRows.value.length === 0) {
-        message.warning('请至少选择一条记录');
-        return;
-    }
-    batchApproveForm.value.approveComment = '';
-    batchApproveVisible.value = true;
+  if (selectedRows.value.length === 0) {
+    message.warning("请至少选择一条记录");
+    return;
+  }
+  batchApproveForm.value.approveComment = "";
+  batchApproveVisible.value = true;
 };
 
 // 确认批量审批
 const handleBatchApproveConfirm = async () => {
-    // 验证审批意见
-    // if (!batchApproveForm.value.approveComment || batchApproveForm.value.approveComment.trim() === '') {
-    //     message.warning('请填写审批意见');
-    //     return;
-    // }
+  // 验证审批意见
+  // if (!batchApproveForm.value.approveComment || batchApproveForm.value.approveComment.trim() === '') {
+  //     message.warning('请填写审批意见');
+  //     return;
+  // }
 
-    // 检查是否有已通过的记录
-    const hasApprovedRecord = selectedRows.value.some(row => row.status != 'PENDING');
-    if (hasApprovedRecord) {
-        message.warning('当前有选中的数据中含有已通过或已驳回的记录，请重试。');
-        return;
+  // 检查是否有已通过的记录
+  const hasApprovedRecord = selectedRows.value.some((row) => row.status != "PENDING");
+  if (hasApprovedRecord) {
+    message.warning("当前有选中的数据中含有已通过或已驳回的记录，请重试。");
+    return;
+  }
+
+  batchApproveLoading.value = true;
+  try {
+    // 获取选中行的主键ID作为 approvalIds
+    const approvalIds = selectedRows.value.map((row) => row.id).filter((id) => id);
+
+    if (approvalIds.length === 0) {
+      message.warning("选中的记录缺少有效的ID");
+      batchApproveLoading.value = false;
+      return;
     }
 
-    batchApproveLoading.value = true;
-    try {
-        // 获取选中行的主键ID作为 approvalIds
-        const approvalIds = selectedRows.value.map(row => row.id).filter(id => id);
+    const res: any = await batchApproveByApprovalId({
+      approvalIds,
+      approveComment: batchApproveForm.value.approveComment,
+    });
+    if (res.code == "0") {
+      message.success("批量审批成功");
+      batchApproveVisible.value = false;
+      batchApproveForm.value.approveComment = "";
 
-        if (approvalIds.length === 0) {
-            message.warning('选中的记录缺少有效的ID');
-            batchApproveLoading.value = false;
-            return;
-        }
-
-        const res: any = await batchApproveByApprovalId({
-            approvalIds,
-            approveComment: batchApproveForm.value.approveComment
-        });
-        if (res.code == '0') {
-            message.success('批量审批成功');
-            batchApproveVisible.value = false;
-            batchApproveForm.value.approveComment = '';
-
-            // 清空选中状态
-            tableRef.value?.clearSelection();
-
-            // 刷新表格（保持当前搜索条件）
-            handleSearchFinish(searchData.value);
-        }
-
-    } catch (error) {
-        // console.error('批量审批失败:', error);
-        // message.error('批量审批失败，请稍后重试');
-    } finally {
-        batchApproveLoading.value = false;
+      // 清空选中状态
+      tableRef.value?.clearSelection();
+      tableRef.value?.refresh();
     }
+  } catch (error) {
+    // console.error('批量审批失败:', error);
+    // message.error('批量审批失败，请稍后重试');
+  } finally {
+    batchApproveLoading.value = false;
+  }
 };
 
 // 取消批量审批
 const handleBatchApproveCancel = () => {
-    batchApproveVisible.value = false;
-    batchApproveForm.value.approveComment = '';
+  batchApproveVisible.value = false;
+  batchApproveForm.value.approveComment = "";
 };
 
 // 打开批量驳回弹框
 const handleBatchReject = () => {
-    if (selectedRows.value.length === 0) {
-        message.warning('请至少选择一条记录');
-        return;
+  if (selectedRows.value.length === 0) {
+    message.warning("请至少选择一条记录");
+    return;
+  }
+  batchRejectForm.value.rejectReason = "";
+  batchRejectVisible.value = true;
+};
+// 批量删除
+const handleBatchDelete = () => {
+  if (selectedRows.value.length === 0) {
+    message.warning("请至少选择一条记录");
+    return;
+  }
+  for (let index = 0; index < selectedRows.value.length; index++) {
+    if (selectedRows.value[index].status != "REJECTED") {
+      return message.warning("只能删除已驳回记录，请重试。");
     }
-    batchRejectForm.value.rejectReason = '';
-    batchRejectVisible.value = true;
+  }
+  Modal.confirm({
+    title: "确认删除",
+    content: "确定要删除选中的记录吗？",
+    zIndex: 2002,
+    onOk: async () => {
+      return new Promise(async (resolve, reject) => {
+        let ids = [];
+        selectedRows.value.forEach((item: any) => {
+          ids.push(item.id);
+        });
+        const params = {
+          ids: ids,
+        };
+        try {
+          let res: any = await batchRemoveDraft(params);
+          if (res && res?.code == 0) {
+            message.success("删除成功");
+            tableRef.value?.clearSelection();
+            tableRef.value?.refresh();
+            resolve(true);
+          } else {
+            message.error("删除失败");
+            reject();
+          }
+        } catch (e) {
+          message.error("删除失败");
+          reject();
+        }
+      }).catch(() => console.log("Oops errors!"));
+    },
+  });
 };
 
 // 确认批量驳回
 const handleBatchRejectConfirm = async () => {
-    // 验证驳回原因
-    if (!batchRejectForm.value.rejectReason || batchRejectForm.value.rejectReason.trim() === '') {
-        message.warning('请填写驳回原因');
-        return;
+  //   // 验证驳回原因
+  if (
+    !batchRejectForm.value.rejectReason ||
+    batchRejectForm.value.rejectReason.trim() === ""
+  ) {
+    message.warning("请填写驳回原因");
+    return;
+  }
+
+  // 检查是否有非 PENDING 状态的记录
+  const hasNonPendingRecord = selectedRows.value.some((row) => row.status !== "PENDING");
+  if (hasNonPendingRecord) {
+    message.warning("当前选中的数据中含有非待审批状态的记录，无法驳回。");
+    return;
+  }
+
+  batchRejectLoading.value = true;
+  try {
+    // 获取选中行的主键ID作为 approvalIds
+    const approvalIds = selectedRows.value.map((row) => row.id).filter((id) => id);
+
+    if (approvalIds.length === 0) {
+      message.warning("选中的记录缺少有效的ID");
+      batchRejectLoading.value = false;
+      return;
     }
 
-    // 检查是否有非 PENDING 状态的记录
-    const hasNonPendingRecord = selectedRows.value.some(row => row.status !== 'PENDING');
-    if (hasNonPendingRecord) {
-        message.warning('当前选中的数据中含有非待审批状态的记录，无法驳回。');
-        return;
-    }
-
-    batchRejectLoading.value = true;
-    try {
-        // 获取选中行的主键ID作为 approvalIds
-        const approvalIds = selectedRows.value.map(row => row.id).filter(id => id);
-
-        if (approvalIds.length === 0) {
-            message.warning('选中的记录缺少有效的ID');
-            batchRejectLoading.value = false;
-            return;
-        }
-
-        const res: any = await batchReject({
-            approvalIds,
-            rejectReason: batchRejectForm.value.rejectReason
-        });
-        if (res.code == '0') {
-            message.success('批量驳回成功');
-            batchRejectVisible.value = false;
-            batchRejectForm.value.rejectReason = '';
-        }
-
-    } catch (error) {
-        // message.error('批量驳回失败，请稍后重试');
-    } finally {
-        batchRejectLoading.value = false;
+    const res: any = await batchReject({
+      approvalIds,
+      rejectReason: batchRejectForm.value.rejectReason,
+    });
+    if (res.code == "0") {
+      message.success("批量驳回成功");
+      batchRejectVisible.value = false;
+      batchRejectForm.value.rejectReason = "";
+      tableRef.value?.clearSelection();
+      tableRef.value?.refresh();
     }
+  } catch (error) {
+    // message.error('批量驳回失败，请稍后重试');
+  } finally {
+    batchRejectLoading.value = false;
+  }
 };
 
 // 取消批量驳回
 const handleBatchRejectCancel = () => {
-    batchRejectVisible.value = false;
-    batchRejectForm.value.rejectReason = '';
+  batchRejectVisible.value = false;
+  batchRejectForm.value.rejectReason = "";
 };
 
 // 搜索相关数据
 const searchData = ref<any>({
-    hbrvcd: 'all',
-    status: '',
+  hbrvcd: "all",
+  status: "",
 });
 
 // 搜索相关弹框
 const paramsTab = ref({
-    sort: [
-        {
-            field: "applyTime",
-            dir: "desc",
-            needSortFlag: true
-        },
-    ],
-})
+  sort: [
+    {
+      field: "applyTime",
+      dir: "desc",
+      needSortFlag: true,
+    },
+  ],
+});
 
 // 使用 computed 包装 searchParams，避免深度监听误触发
 const computedSearchParams = computed(() => ({
-    sort: paramsTab.value.sort
+  sort: paramsTab.value.sort,
 }));
 </script>
 
 <style scoped lang="scss">
 .shengPiJiLu-page {
-    width: 100%;
-    height: 100%;
-    background-color: #ffffff;
-    padding: 20px;
+  width: 100%;
+  height: 100%;
+  background-color: #ffffff;
+  padding: 20px;
 }
 
 .approval-log-modal-content {
-    display: flex;
-    flex-direction: column;
-    gap: 16px;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
 }
 
 .change-log-modal-content {
-    display: flex;
-    flex-direction: column;
-    gap: 16px;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
 }
 
 .detail-modal-content {
-    display: flex;
-    flex-direction: column;
-    gap: 16px;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
 }
 
 .caozuo {
-    width: 100%;
-    display: flex;
-    align-items: center;
-    justify-content: flex-end;
-    margin-bottom: 20px;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  margin-bottom: 20px;
 }
-
-.media-list-container {
-    background-color: rgb(234, 241, 251);
-    padding: 10px;
-
-    .list-item {
-        width: 100%;
-        height: 36px;
-        line-height: 36px;
-        padding: 0 10px;
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        cursor: pointer;
-        border-radius: 4px;
-        transition: all 0.3s;
-
-        &:hover {
-            background-color: rgba(255, 255, 255, 0.5);
-        }
-
-        .file-name {
-            flex: 1;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            white-space: nowrap;
-            font-size: 13px;
-        }
-
-        &.select {
-            color: #ffffff;
-            background-color: rgb(37, 93, 138);
-        }
-    }
-}
-</style>
\ No newline at end of file
+</style>
diff --git a/frontend/src/views/shuJuTianBao/shengPiJiLu/shengPiJiLuSearch.vue b/frontend/src/views/shuJuTianBao/shengPiJiLu/shengPiJiLuSearch.vue
index dadba1e..382959b 100644
--- a/frontend/src/views/shuJuTianBao/shengPiJiLu/shengPiJiLuSearch.vue
+++ b/frontend/src/views/shuJuTianBao/shengPiJiLu/shengPiJiLuSearch.vue
@@ -1,116 +1,121 @@
 <template>
-    <div class="guoYuSheShiShuJuTianBao-search">
-        <BasicSearch ref="basicSearchRef" :searchList="searchList" :initial-values="initSearchData" :zhujianfujian="'zhu'"
-            @finish="onSearchFinish" @values-change="onValuesChange" @reset="handleReset">
-            <template #actions>
-                <a-tooltip title="批量审批">
-                    <a-button :disabled="selectedCount === 0" @click="$emit('batch-approve')">
-                        <template #icon>
-                            <CheckSquareOutlined />
-                        </template>
-                        批量审批
-                    </a-button>
-                </a-tooltip>
-
-                <a-tooltip title="批量驳回">
-                    <a-button :disabled="selectedCount === 0" @click="$emit('batch-reject')">
-                        <template #icon>
-                            <CloseCircleOutlined />
-                        </template>
-                        批量驳回
-                    </a-button>
-                </a-tooltip>
-
+  <div class="guoYuSheShiShuJuTianBao-search">
+    <BasicSearch
+      ref="basicSearchRef"
+      :searchList="searchList"
+      :initial-values="initSearchData"
+      :zhujianfujian="'zhu'"
+      @finish="onSearchFinish"
+      @values-change="onValuesChange"
+      @reset="handleReset"
+    >
+      <template #actions>
+        <a-tooltip title="批量审批">
+          <a-button :disabled="selectedCount === 0" @click="$emit('batch-approve')">
+            <template #icon>
+              <CheckSquareOutlined />
             </template>
-        </BasicSearch>
-    </div>
+            批量审批
+          </a-button>
+        </a-tooltip>
+
+        <a-tooltip title="批量驳回">
+          <a-button :disabled="selectedCount === 0" @click="$emit('batch-reject')">
+            <template #icon>
+              <CloseCircleOutlined />
+            </template>
+            批量驳回
+          </a-button>
+        </a-tooltip>
+        <a-tooltip title="批量删除">
+          <a-button :disabled="selectedCount === 0" @click="$emit('batch-delete')">
+            批量删除
+          </a-button>
+        </a-tooltip>
+      </template>
+    </BasicSearch>
+  </div>
 </template>
 
 <script lang="ts" setup>
 import { ref, computed, onMounted } from "vue";
 import BasicSearch from "@/components/BasicSearch/index.vue"; // 确保路径正确
-import { getDictItemsByCode } from '@/api/dict';
-import {
-    CheckSquareOutlined,
-    CloseCircleOutlined,
-} from "@ant-design/icons-vue";
+import { getDictItemsByCode } from "@/api/dict";
+import { CheckSquareOutlined, CloseCircleOutlined } from "@ant-design/icons-vue";
 // --- Props & Emits ---
 interface Props {
-    selectedCount?: number;
+  selectedCount?: number;
 }
 
 const props = withDefaults(defineProps<Props>(), {
-    selectedCount: 0
+  selectedCount: 0,
 });
 
 const emit = defineEmits<{
-    (e: "reset", values: any): void;
-    (e: "searchFinish", values: any): void;
-    (e: "batch-approve"): void;
-    (e: "batch-reject"): void;
+  (e: "reset", values: any): void;
+  (e: "searchFinish", values: any): void;
+  (e: "batch-approve"): void;
+  (e: "batch-reject"): void;
+  (e: "batch-delete"): void;
 }>();
 
-
 // 模拟 initSearchData
 const initSearchData = {
-    hbrvcd:'all',
-    stcd:'',
-    status: '',
+  hbrvcd: "all",
+  stcd: "",
+  status: "",
 };
 
 const searchData = ref<any>({ ...initSearchData });
 
 const searchList: any = computed(() => [
-    {
-        type: "waterStation",
-        name: "hbrvcd",
-        label: "流域",
-        fieldProps: {
-            allowClear: true,
-        },
-        options: [],
+  {
+    type: "waterStation",
+    name: "hbrvcd",
+    label: "流域",
+    fieldProps: {
+      allowClear: true,
     },
+    options: [],
+  },
 
-    {
-        type: "Select",
-        name: "status",
-        label: "审批状态",
-        fieldProps: {
-            allowClear: true,
-        },
-        options: statusData.value,
+  {
+    type: "Select",
+    name: "status",
+    label: "审批状态",
+    fieldProps: {
+      allowClear: true,
     },
-
+    options: statusData.value,
+  },
 ]);
 // --- Methods ---
 
-
-
 // 2. 搜索表单逻辑
 const onSearchFinish = (values: any) => {
-    console.log(values);
+  console.log(values);
 
-    emit("searchFinish", values);
+  emit("searchFinish", values);
 };
 const handleReset = () => {
-    emit("reset", initSearchData);
+  emit("reset", initSearchData);
 };
 
 const onValuesChange = (changedValues: any, allValues: any) => {
-    // 同步更新本地 searchData，以便其他逻辑使用
-    searchData.value = { ...searchData.value, ...allValues };
+  // 同步更新本地 searchData，以便其他逻辑使用
+  searchData.value = { ...searchData.value, ...allValues };
 };
 
 // --- Lifecycle ---
 onMounted(() => {
-    emit("searchFinish", initSearchData);
-    getstatusData()
+  emit("searchFinish", initSearchData);
+  getstatusData();
 });
-const statusData = ref(false)
+const statusData = ref(false);
 const getstatusData = () => {
-    getDictItemsByCode({ dictCode: "approvalStatus" }).then((res) => {
-        statusData.value = res.data;
-    });
+  getDictItemsByCode({ dictCode: "approvalStatus" }).then((res) => {
+    statusData.value = res.data;
+  });
 };
 </script>
-<style lang="scss"></style>
\ No newline at end of file
+<style lang="scss"></style>