fix: 【公共】基础表单增加子表控件的demo

src/views/form-demo/index.vue

@@ -1,9 +1,8 @@
 <template>
   <div>
     <a-form name="form">
-
       <a-form-item label="人员单选选择器" name="userSelector">
-        <OrgUserSelector  v-model:selected-data="userSelector" :multiple="SELECT_MULTIPLE.ONE" />
+        <OrgUserSelector v-model:selected-data="userSelector" :multiple="SELECT_MULTIPLE.ONE" />
       </a-form-item>
 
       <a-form-item label="人员多选选择器" name="userSelectors">
@@ -11,42 +10,70 @@
       </a-form-item>
 
       <a-form-item label="组织单选选择器" name="orgSelector">
-        <OrgUserSelector  v-model:selected-data="orgSelector" :multiple="SELECT_MULTIPLE.ONE"  :scene-type="SCENE_TYPE.ORG"/>
+        <OrgUserSelector v-model:selected-data="orgSelector" :multiple="SELECT_MULTIPLE.ONE" :scene-type="SCENE_TYPE.ORG" />
       </a-form-item>
 
       <a-form-item label="组织多选选择器" name="orgSelectors">
-        <OrgUserSelector v-model:selected-data="orgSelectors" :multiple="SELECT_MULTIPLE.MORE"  :scene-type="SCENE_TYPE.ORG"/>
+        <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>
     </a-form>
   </div>
 </template>
 
 <script setup>
   import OrgUserSelector from '/@/components/BsUi/OrgUserSelector/index.vue';
-  import { ref } from 'vue';
-  import {SCENE_TYPE, SELECT_MULTIPLE} from '/@/components/BsUi/constant.js';
+  import { reactive, ref } from 'vue';
+  import { SCENE_TYPE, SELECT_MULTIPLE } from '/@/components/BsUi/constant.js';
+  import { BsSubTableInput } from '/@/components/BsUi/index.js';
+
+  const batchTable = ref([
+    {
+      id: '1',
+      name: '韩晓辉',
+      sex: '男',
+    },
+  ]);
+
+  const columns = ref([
+    {
+      title: '姓名',
+      field: 'name',
+    },
+    {
+      title: '性别',
+      field: 'sex',
+    },
+  ]);
+
+  const handleAdd = ({ tableData }) => {
+    batchTable.value = [...tableData, { name: '甘雨' + new Date().getTime(), sex: '女' + new Date().getTime(), id: new Date().getTime() }];
+  };
+
   const userSelectors = ref([
     {
       name: '韩晓辉0',
       id: 'eqwifjqiwejf',
       parentName: '无限畅联',
       parentId: '1',
-      nodeType: "USER"
+      nodeType: 'USER',
     },
     {
       name: '韩晓辉1',
       id: 'fqioweoiq',
       parentName: '无限畅联',
       parentId: '1',
-      nodeType: "USER"
+      nodeType: 'USER',
     },
     {
       name: '韩晓辉55',
       id: 'jfslkf',
       parentName: '无限畅联',
       parentId: '1',
-      nodeType: "USER"
+      nodeType: 'USER',
     },
   ]);
 
@@ -55,12 +82,10 @@
     id: '1',
     parentName: '无限畅联',
     parentId: '1',
-    nodeType: "USER"
+    nodeType: 'USER',
   });
 
   const orgSelector = ref({});
 
   const orgSelectors = ref([]);
-
-
 </script>