fix: 【公共】基础表格、基础表单修改

src/views/form-demo/index.vue

@@ -17,28 +17,71 @@
         <OrgUserSelector v-model:selected-data="orgSelectors" :multiple="SELECT_MULTIPLE.MORE" :scene-type="SCENE_TYPE.ORG" />
       </a-form-item>
 
-      <a-form-item label="子表" name="batchTable">
-        <BsSubTableInput :customColumns="columns" v-model:value="batchTable" :row-key="id" @add="handleAdd" />
+      <a-form-item label="通用子表" name="batchTable">
+        <BsSubTableInput v-model:value="batchTable" @add="handleAdd" :table-options="tableOptions" />
+      </a-form-item>
+
+      <a-form-item label="自定义子表" name="batchTable1">
+        <BsSubTableInput
+          :table-options="tableOptions"
+          v-model:value="batchTable1"
+          :is-show-add-btn="false"
+          :is-show-batch-delete-btn="false"
+          :opt-btn-slots="batchTableOptBtnSlots"
+          :is-edit-row="false"
+        >
+          <template #custom1>
+            <a-button type="text" style="width: 100%"> 自定义按钮1</a-button>
+          </template>
+          <template #custom2>
+            <a-button type="text" style="width: 100%"> 自定义按钮2 </a-button>
+          </template>
+        </BsSubTableInput>
+      </a-form-item>
+
+      <a-form-item label="多文件上传">
+        <BsFileUploadSubTable v-model:value="fileList" />
       </a-form-item>
     </a-form>
   </div>
 </template>
 
 <script setup>
-  import OrgUserSelector from '/@/components/BsUi/OrgUserSelector/index.vue';
   import { reactive, ref } from 'vue';
   import { SCENE_TYPE, SELECT_MULTIPLE } from '/@/components/BsUi/constant.js';
-  import { BsSubTableInput } from '/@/components/BsUi/index.js';
+  import { BsSubTableInput, BsFileUploadSubTable, BsOrgUserSelector as OrgUserSelector } from '/@/components/BsUi/index.js';
+  import useBsDict from '/@/utils/dict.js';
+
+  const fileList = ref([
+    {
+      fileId: 845,
+      fileName: '已处理@2x.png',
+      fileUrl: 'http://59.110.6.97:9000/upload/public/common/b952203ba2a24c69bdedf78f09153db2_20250908134830.png',
+      fileKey: 'public/common/b952203ba2a24c69bdedf78f09153db2_20250908134830.png',
+      fileSize: 11252,
+      fileType: 'png',
+    },
+    {
+      fileId: 846,
+      fileName: '已处理@2x (1).png',
+      fileUrl: 'http://59.110.6.97:9000/upload/public/common/87b7a3c555c549b8b81c6ed25259a17f_20250908134830.png',
+      fileKey: 'public/common/87b7a3c555c549b8b81c6ed25259a17f_20250908134830.png',
+      fileSize: 10647,
+      fileType: 'png',
+    },
+  ]);
+
+  // const fileList = ref([]);
 
   const batchTable = ref([
     {
       id: '1',
       name: '韩晓辉',
-      sex: '男',
+      sex: '1',
     },
   ]);
 
-  const columns = ref([
+  const columns1 = ref([
     {
       title: '姓名',
       field: 'name',
@@ -49,8 +92,40 @@
     },
   ]);
 
+  const tableOptions = ref({
+    gridOptions: {
+      columns: [
+        {
+          title: '姓名',
+          field: 'name',
+          editRender: { name: 'VxeInput' },
+        },
+        {
+          title: '性别',
+          field: 'sex',
+          editRender: {
+            name: 'VxeSelect',
+            props: {
+              multiple: false,
+              filterable: true,
+            },
+            options: useBsDict.getDictList('SYS_SEX'),
+          },
+        },
+      ],
+      editRules: {
+        name: [{ required: true, message: '必须填写' }],
+        sex: [{ required: true, message: '必须填写' }],
+      },
+    },
+  });
+
+  const batchTable1 = ref([]);
+
+  const batchTableOptBtnSlots = ref(['custom1', 'custom2']);
+
   const handleAdd = ({ tableData }) => {
-    batchTable.value = [...tableData, { name: '甘雨' + new Date().getTime(), sex: '女' + new Date().getTime(), id: new Date().getTime() }];
+    console.log('handleAdd', tableData);
   };
 
   const userSelectors = ref([

src/views/table-demo/components/AddOrEditDrawer.vue

@@ -15,7 +15,7 @@
       :footer-render="() => null"
       :form-id="formOptions.formId"
       ref="bsFormRef"
-    ></bs-form>
+    />
   </bs-drawer>
 </template>
 
@@ -36,7 +36,7 @@
     getDrawerPropsValue: getDVal,
   } = useBsDrawer({
     drawerOptions: {
-      width: '500px',
+      width: '700px',
       title: '标题',
       visible: false,
       drawerExtraProps: {
@@ -72,7 +72,7 @@
         },
         {
           id: '2',
-          label: '表格选择器',
+          label: '表格选择器(多选)',
           component: 'bs-table-selector',
           componentProps: {
             multiple: '1',
@@ -108,7 +108,7 @@
               },
             },
             modalOptions: {
-              title: '表格选择器',
+              title: '表格选择器(多选)',
             },
           },
           field: 'name1',
@@ -126,6 +126,110 @@
             ],
           },
         },
+        {
+          id: '3',
+          label: '表格选择器(单选)',
+          component: 'bs-table-selector',
+          componentProps: {
+            multiple: '0',
+            placeholder: '请选择',
+            labelField: 'name',
+            valueField: 'id',
+            tableOptions: {
+              gridOptions: {
+                loading: false,
+                columns: [
+                  {
+                    field: 'id',
+                    title: 'ID',
+                  },
+                  {
+                    field: 'name',
+                    title: '名字',
+                  },
+                ],
+                rowKey: 'id',
+                data: [],
+              },
+              async request() {
+                return {
+                  list: Array.from({ length: 10 })
+                    .fill(0)
+                    .map((v, idx) => ({
+                      id: idx,
+                      name: 'name' + idx,
+                    })),
+                  total: 10,
+                };
+              },
+            },
+            modalOptions: {
+              title: '表格选择器单选',
+            },
+          },
+          field: 'name2',
+          sort: '2',
+          visible: '1',
+          required: '1',
+          formItemExtraProps: {
+            rules: [
+              {
+                validator: (_, value) => {
+                  // return Promise.reject(new Error('报错'));
+                  return Promise.resolve();
+                },
+              },
+            ],
+          },
+        },
+        {
+          id: '4',
+          label: '子表',
+          component: 'bs-sub-table-input',
+          componentProps: {
+            tableOptions: {
+              gridOptions: {
+                loading: false,
+                columns: [
+                  {
+                    field: 'id',
+                    title: 'ID',
+                    visible: false,
+                  },
+                  {
+                    field: 'name',
+                    title: '名字',
+                    editRender: { name: 'VxeInput' },
+                  },
+                  {
+                    field: 'phone',
+                    title: '电话',
+                    editRender: { name: 'VxeInput' },
+                  },
+                ],
+                rowKey: 'id',
+                editRules: {
+                  name: [{ required: true, message: '必须填写' }],
+                  phone: [{ required: true, message: '必须填写' }],
+                },
+              },
+            },
+          },
+          field: 'name3',
+          sort: '2',
+          visible: '1',
+          required: '1',
+          formItemExtraProps: {
+            rules: [
+              {
+                validator: (_, value) => {
+                  // return Promise.reject(new Error('报错'));
+                  return Promise.resolve();
+                },
+              },
+            ],
+          },
+        },
       ],
       formData: {
         name: '韩晓辉',
@@ -135,10 +239,11 @@
             name: 'name1',
           },
         ],
-        // name1: {
-        //   id: 1,
-        //   name: 'name1',
-        // },
+        name2: {
+          id: 1,
+          name: 'name1',
+        },
+        name3: [],
       },
       formId: 'formId',
       formExtraProps: {},