feat: 表单多数据部件支持重复器表格

app_Web/src/components/widgets/form-control/form-mdctrl/form-mdctrl.tsx

-import { defineComponent, getCurrentInstance, h, watch } from 'vue';
+import { computed, defineComponent, getCurrentInstance, h, watch } from 'vue';
 import { useController, useNamespace } from '@ibiz-template/vue-util';
-import { FormMDCtrlModel } from '@ibiz-template/model';
+import {
+  FormMDCtrlModel,
+  IPSDEFormDetail,
+  IPSDEFormItem,
+} from '@ibiz-template/model';
 import '@ibiz-template/theme/style/components/widgets/form/form-mdctrl.scss';
 import { FormMDCtrlController } from '@ibiz-template/controller';
 
@@ -26,6 +30,28 @@ export const FormMDCtrl = defineComponent({
 
     const c = props.controller;
 
+    const columns = computed(() => {
+      const formDetails =
+        c.model.source.getPSDEFormDetails() as IPSDEFormDetail[];
+      const formItems = formDetails.filter(
+        formDetail => formDetail.detailType === 'FORMITEM',
+      ) as IPSDEFormItem[];
+      return formItems.map(formItem => {
+        const width = formItem.labelWidth;
+        return {
+          align: 'center',
+          ellipsis: true,
+          key: formItem.id,
+          minWidth: width,
+          resizable: true,
+          sortable: false,
+          title: formItem.caption,
+          tooltip: false,
+          width,
+        };
+      });
+    });
+
     watch(
       () => c.form.isLoaded,
       (n, o) => {
@@ -35,9 +61,19 @@ export const FormMDCtrl = defineComponent({
       },
     );
 
-    return { ns, c };
+    return { ns, c, columns };
   },
   render() {
+    // 重复器表格
+    const renderGridContent = () => {
+      return (
+        <i-table
+          class={this.ns.b('grid-content')}
+          columns={this.columns}
+          data={this.c.contentCtrlData}
+        ></i-table>
+      );
+    };
     const renderFormContent = () => {
       return (
         this.c.contentCtrlData.length > 0 &&
@@ -89,6 +125,14 @@ export const FormMDCtrl = defineComponent({
       );
     };
 
+    const renderContent = () => {
+      // 重复器表格
+      if (this.c.mdCtrlType === 'REPEATER' && this.c.detailStyle === 'STYLE2') {
+        return renderGridContent();
+      }
+      return renderFormContent();
+    };
+
     const renderMainContent = () => {
       return (
         <div class={this.ns.b('main')}>
@@ -107,7 +151,7 @@ export const FormMDCtrl = defineComponent({
                 </i-button>
               )}
             </div>,
-            renderFormContent(),
+            renderContent(),
           ]}
         </div>
       );