Tb9 bug 修改

zrch-risk-client-39/src/views/baosong/data/tb9.data.ts

@@ -121,8 +121,7 @@ export const tableFormData = [
         otherOption: true,
         otherField: 'COLA03',
       },
-
-      { type: 'brspace' },
+      { type: 'br' },
       { type: 'text', value: '已识别的重要业务总数' },
       { type: 'number', field: 'COL21', unit: '个' },
       { type: 'text', value: '，重要业务详细情况如下' },
@@ -130,22 +129,35 @@ export const tableFormData = [
       {
         serialNumber: '1006',
         code: 'TB90031',
-        type: 'MultiColumnTable',
+        type: 'VxeTable',
         project: '重要业务详细情况',
-        content: [
-          { name: '一级业务名称', formType: 'input', field: 'C24A002' },
-          { name: '二级业务名称', formType: 'input', field: 'C24A003' },
-          { name: '交易渠道', formType: 'input', field: 'C24A004' },
-          { name: '涉及重要信息系统(与TB3系统名称保持一致)', formType: 'input', field: 'C24A005' },
-          { name: '日均流量(万笔)', formType: 'input', field: 'C24A006' },
-          { name: '业务恢复指标RTO(分钟)', formType: 'number', field: 'COL24' },
-          { name: '业务恢复指标RPO(分钟)', formType: 'number', field: 'COL25' },
-          { name: '业务归口管理部门', formType: 'input', field: 'COL26' },
-          { name: '业务影响分析开展部门', formType: 'input', field: 'COL27' },
-          { name: '完成时间', formType: 'date', field: 'COL28' },
-          { name: '报告经高管层或业务连续性管理委员会审批', formType: 'yesno', field: 'COL29' },
+        columns: [
+          { field: 'C24A002', title: '一级业务名称', width: 200, editRender: { name: 'VxeInput' } },
+          { field: 'C24A003', title: '二级业务名称', width: 200, editRender: { name: 'VxeInput' } },
+          { field: 'C24A004', title: '交易渠道', width: 200, editRender: { name: 'VxeInput' } },
+          { field: 'C24A005', title: '涉及重要信息系统', width: 300, editRender: { name: 'VxeInput' } },
+          { field: 'C24A006', title: '日均流量(万笔)', width: 200, editRender: { name: 'VxeInput' } },
+          { field: 'COL24', title: '业务恢复指标RTO(分钟)', width: 200, editRender: { name: 'VxeNumberInput' } },
+          { field: 'COL25', title: '业务恢复指标RPO(分钟)', width: 200, editRender: { name: 'VxeNumberInput' } },
+          { field: 'COL26', title: '业务归口管理部门', width: 200, editRender: { name: 'VxeInput' } },
+          { field: 'COL27', title: '业务影响分析开展部门', width: 200, editRender: { name: 'VxeInput' } },
+          { field: 'COL28', title: '完成时间', width: 200, editRender: { name: 'VxeDatePicker' } },
+          {
+            field: 'COL29',
+            title: '报告审批',
+            width: 300,
+            editRender: {
+              name: 'VxeSelect',
+              options: [
+                { label: '是', value: '是' },
+                { label: '否', value: '否' },
               ],
             },
+          },
+          { title: '操作', slots: { default: 'action' }, width: 100 },
+        ],
+        datas: [],
+      },
     ],
     remarks: {
       rows: 10,
@@ -239,44 +251,107 @@ export const tableFormData = [
       { type: 'number', field: 'COL48', unit: '%' },
       { type: 'br' },
       { type: 'text', value: '（3）近三年是否开展业务数据被恶意篡改的应急演练' },
-      { type: 'yesno', field: 'C24A001' },
+      { type: 'radio-group', field: 'C24A001', options: ['是', '否'] },
       { type: 'brspace' },
       {
         serialNumber: '1006',
         code: 'TB90051',
-        type: 'MultiColumnTable',
-        project: '演练明细 ',
-        content: [
-          { name: '演练日期', formType: 'date', field: 'COL50' },
+        type: 'VxeTable',
+        project: '演练明细',
+        columns: [
+          { field: 'COL50', title: '演练日期', width: 150, editRender: { name: 'VxeDatePicker' } },
           {
-            name: '牵头部门',
-            formType: 'radio-group',
             field: 'COL51',
-            options: ['信息科技部门', '风险管理部门', '内部审计部门', '合规部门', '业务部门', '其他'],
-            otherOption: true,
-            otherField: 'COL52',
+            title: '牵头部门',
+            width: 200,
+            editRender: {
+              name: 'VxeSelect',
+              options: [
+                { label: '信息科技部门', value: '信息科技部门' },
+                { label: '风险管理部门', value: '风险管理部门' },
+                { label: '内部审计部门', value: '内部审计部门' },
+                { label: '合规部门', value: '合规部门' },
+                { label: '业务部门', value: '业务部门' },
+                { label: '其他', value: '其他' },
+              ],
+            },
           },
+          { field: 'COL52', title: '牵头部门其他', width: 150, editRender: { name: 'VxeInput' } },
           {
-            name: '参与部门',
-            formType: 'checkbox-group',
             field: 'COL53',
-            options: ['办公室', '信息科技部门', '风险管理部门', '内部审计部门', '合规部门', '业务部门', '后勤保障部门', '其他'],
-            otherOption: true,
-            otherField: 'COL54',
+            title: '参与部门',
+            width: 250,
+            editRender: {
+              name: 'VxeSelect',
+              options: [
+                { label: '办公室', value: '办公室' },
+                { label: '信息科技部门', value: '信息科技部门' },
+                { label: '风险管理部门', value: '风险管理部门' },
+                { label: '内部审计部门', value: '内部审计部门' },
+                { label: '合规部门', value: '合规部门' },
+                { label: '业务部门', value: '业务部门' },
+                { label: '后勤保障部门', value: '后勤保障部门' },
+                { label: '其他', value: '其他' },
+              ],
             },
+          },
+          { field: 'COL54', title: '参与部门其他', width: 150, editRender: { name: 'VxeInput' } },
           {
-            name: '演练内容',
-            formType: 'checkbox-group',
             field: 'COL55',
-            options: ['关键基础设施演练 ', '重要信息系统演练 ', '重要业务演练', '其他'],
-            otherOption: true,
-            otherField: 'COLA05',
+            title: '演练内容',
+            width: 200,
+            editRender: {
+              name: 'VxeSelect',
+              options: [
+                { label: '关键基础设施演练', value: '关键基础设施演练' },
+                { label: '重要信息系统演练', value: '重要信息系统演练' },
+                { label: '重要业务演练', value: '重要业务演练' },
+                { label: '其他', value: '其他' },
+              ],
+            },
+          },
+          { field: 'COLA05', title: '演练内容其他', width: 150, editRender: { name: 'VxeInput' } },
+          {
+            field: 'COL56',
+            title: '演练方式',
+            width: 200,
+            editRender: {
+              name: 'VxeSelect',
+              options: [
+                { label: '模拟', value: '模拟' },
+                { label: '切换测试', value: '切换测试' },
+                { label: '切换并真实接管业务', value: '切换并真实接管业务' },
+              ],
+            },
+          },
+          { field: 'COL57', title: '涵盖范围', width: 200, editRender: { name: 'VxeInput' } },
+          {
+            field: 'COL58',
+            title: '高管审批',
+            width: 120,
+            editRender: {
+              name: 'VxeSelect',
+              options: [
+                { label: '是', value: '是' },
+                { label: '否', value: '否' },
+              ],
+            },
+          },
+          {
+            field: 'COL59',
+            title: '演练后评估改进应急预案',
+            width: 200,
+            editRender: {
+              name: 'VxeSelect',
+              options: [
+                { label: '是', value: '是' },
+                { label: '否', value: '否' },
+              ],
+            },
           },
-          { name: '演练方式', formType: 'checkbox-group', field: 'COL56', options: ['模拟 ', '切换测试 ', '切换并真实接管业务'] },
-          { name: '涵盖范围 ', formType: 'input', field: 'COL57' },
-          { name: '高管审批', formType: 'yesno', field: 'COL58' },
-          { name: '演练后评估改进应急预案', formType: 'yesno', field: 'COL59' },
+          { title: '操作', slots: { default: 'action' }, width: 100 },
         ],
+        datas: [],
       },
     ],
 

zrch-risk-client-39/src/views/baosong/report/components/Tb9.vue

@@ -98,7 +98,7 @@
             
             <!-- Vxe表格 -->
             <template v-else-if="row.type === 'VxeTable'">
-              <MyVxeTable1
+              <MyVxeTable
                 :title="row.project"
                 :data="row.data"
                 :columns="row.columns"
@@ -205,7 +205,19 @@
                     </vxe-checkbox-group>
                   </span> 
                 </div>
-                
+                <div v-else-if="item.type === 'VxeTable'">
+                  <MyVxeTable
+                    :title="item.project"
+                    :data="item.data"
+                    :columns="item.columns"
+                    :pcode="item.code"
+                    :footerData="item.footerData"
+                    :showFooter="item.showFooter"
+                    :ref="(el) => setMyVxeTableRef(el, item.code)"
+                    :disabled="!item.hasRight"
+                    style="margin:0px;padding:0px"
+                  />
+              </div>
                 <!-- 普通输入框 -->
                 <template v-else>
                   <div class="input-wrapper">
@@ -310,7 +322,7 @@ import { useRoute } from 'vue-router'
 // 组件导入
 import MultiColumnTable from '../tableComponents/MultiColumnTable.vue'
 import AttachTable from '../tableComponents/AttachTable.vue'
-import MyVxeTable1 from '../tableComponents/MyVxeTable.vue'
+import MyVxeTable from '../tableComponents/MyVxeTable.vue'
 import HistoryFillCheck from './check/HistoryFillCheck.vue'
 import ValidationDrawer from './check/ValidationDrawer.vue'
 
@@ -572,7 +584,6 @@ const validateForm = async (): Promise<boolean> => {
 
 const prepareFormData = async () => {
   formValues.value = []
-  
   // 处理主表单数据
   for (const [key, value] of Object.entries(formData)) {
     if (value !== undefined && value !== null && value !== '') {
@@ -584,7 +595,7 @@ const prepareFormData = async () => {
   // 处理子表格数据
   await Promise.all([
     collectAttachTableData(),
-    collectMultiTableData(),
+    //collectMultiTableData(),
     collectVxeTableData()
   ])
 }
@@ -707,6 +718,11 @@ const fillSimpleFields = async (row: TableRow, valueMap: Record<string, string>)
   if (!row.content || !Array.isArray(row.content)) return
   
   for (const item of row.content) {
+    if (item.type === 'VxeTable' && item.code) {
+      await fillVxeTable(item, valueMap)
+      continue
+    }
+    
     if (!item.field) continue
     
     const key = getFieldKey(row.code, item.field)
@@ -725,7 +741,6 @@ const fillSimpleFields = async (row: TableRow, valueMap: Record<string, string>)
       formData[key] = dataVal
     }
     
-    // 处理特殊字段类型
     if (item.type === 'checkboxAndInput' && item.optionItemField) {
       await fillCheckboxInputFields(row, item, valueMap)
     }

zrch-risk-client-39/src/views/baosong/report/tableComponents/MyVxeTable.vue

 <template>
-  <div>
+  <div class="my-vxe-table-wrapper">
     <vxe-grid ref="refGrid" v-bind="gridOptions" v-on="gridEvents" :footerData="setFooterData">
       <template #select="{ row, column }">
         <vxe-select v-model="row[column.field]" filterable @change="handleCol4Change(row, column, $event)">
@@ -81,7 +81,7 @@
     },
     rowHeight: {
       type: [Number, String],
-      default: 40,
+      default: '30',
     },
   });
 
@@ -115,11 +115,18 @@
       trigger: 'click',
       mode: 'row',
     },
-    height: props.height,
+    maxHeight: 400,
+    scrollX: {
+      enabled: true,
+      gt: 0,
+    },
+    scrollY: {
+      enabled: true,
+      gt: 0,
+    },
     rowConfig: {
       useKey: true,
       resizable: true,
-      height: props.rowHeight,
     },
     columnConfig: {
       useKey: true,
@@ -130,6 +137,10 @@
       custom: true,
       buttons: [{ name: '添加', mode: 'text', status: 'primary', code: 'myAdd', icon: 'vxe-icon-add' }],
     },
+    modalConfig: {
+      showZoom: true,
+      resize: true,
+    },
     columns: props.columns,
     data: props.data || [],
     footerData: props.footerData || [],
@@ -215,7 +226,7 @@
       ...formData,
       datas: newDatas,
       footer: formFooterData,
-      footerPcode: props.footerData[0].pcode,
+      footerPcode: props.footerData?.[0]?.pcode,
     };
   };
 
@@ -254,4 +265,17 @@
     setFormData,
   });
 </script>
--
+
+<style lang="less" scoped>
+.my-vxe-table-wrapper {
+  width: 100%;
+  
+  :deep(.vxe-grid) {
+    width: 100%;
+  }
+  
+  :deep(.vxe-table) {
+    width: 100%;
+  }
+}
+</style>