@tmagic/form 1.6.1 → 1.7.0-beta.1

package/src/table/useTableColumns.ts

@@ -0,0 +1,194 @@
+import { computed, h, inject, type Ref } from 'vue';
+import { cloneDeep } from 'lodash-es';
+
+import type { TableColumnOptions } from '@tmagic/design';
+import type { FormState, TableColumnConfig } from '@tmagic/form-schema';
+
+import Container from '../containers/Container.vue';
+import type { ContainerChangeEventData } from '../schema';
+import { display as displayFunc, getDataByPage, sortArray } from '../utils/form';
+
+import ActionsColumn from './ActionsColumn.vue';
+import SortColumn from './SortColumn.vue';
+import type { TableProps } from './type';
+
+export const useTableColumns = (
+  props: TableProps,
+  emit: (event: 'select' | 'change' | 'addDiffCount', ...args: any[]) => void,
+  currentPage: Ref<number>,
+  pageSize: Ref<number>,
+  modelName: Ref<string | number>,
+) => {
+  const mForm = inject<FormState | undefined>('mForm');
+
+  const display = (fuc: any) => displayFunc(mForm, fuc, props);
+
+  const lastData = computed(() =>
+    props.config.pagination
+      ? getDataByPage(props.lastValues[modelName.value], currentPage.value, pageSize.value)
+      : props.lastValues[modelName.value] || [],
+  );
+
+  const itemExtra = (fuc: any, index: number) => {
+    if (typeof fuc === 'function') {
+      return fuc(mForm, {
+        values: mForm?.initValues,
+        model: props.model,
+        formValue: mForm ? mForm.values : props.model,
+        prop: props.prop,
+        index,
+      });
+    }
+
+    return fuc;
+  };
+
+  const selection = computed(() => {
+    if (typeof props.config.selection === 'function') {
+      return props.config.selection(mForm, { model: props.model[modelName.value] });
+    }
+    return props.config.selection;
+  });
+
+  const getProp = (index: number) => {
+    return `${props.prop}${props.prop ? '.' : ''}${index + 1 + currentPage.value * pageSize.value - 1}`;
+  };
+
+  const makeConfig = (config: TableColumnConfig, row: any) => {
+    const newConfig = cloneDeep(config);
+    if (typeof config.itemsFunction === 'function') {
+      newConfig.items = config.itemsFunction(row);
+    }
+    delete newConfig.display;
+    return newConfig;
+  };
+
+  const changeHandler = (v: any, eventData: ContainerChangeEventData) => {
+    emit('change', props.model, eventData);
+  };
+
+  const onAddDiffCount = () => emit('addDiffCount');
+
+  const columns = computed<TableColumnOptions[]>(() => {
+    const columns: TableColumnOptions[] = [];
+
+    if (props.config.itemExtra && !props.config.dropSort) {
+      columns.push({
+        props: {
+          fixed: 'left',
+          width: 30,
+          type: 'expand',
+        },
+        cell: ({ $index }: any) =>
+          h('span', {
+            innerHTML: itemExtra(props.config.itemExtra, $index),
+            class: 'm-form-tip',
+          }),
+      });
+    }
+
+    columns.push({
+      props: {
+        label: '操作',
+        fixed: props.config.fixed === false ? undefined : 'left',
+        width: props.config.operateColWidth || 112,
+        align: 'center',
+      },
+      cell: ({ row, $index }: any) =>
+        h(ActionsColumn, {
+          row,
+          index: $index,
+          model: props.model,
+          config: props.config,
+          prop: props.prop,
+          disabled: props.disabled,
+          sortKey: props.sortKey,
+          name: modelName.value,
+          currentPage: currentPage.value,
+          pageSize: pageSize.value,
+          onChange: (v: any) => {
+            emit('change', v);
+          },
+        }),
+    });
+
+    if (props.sort && props.model[modelName.value] && props.model[modelName.value].length > 1) {
+      columns.push({
+        props: {
+          label: '排序',
+          width: 80,
+        },
+        cell: ({ $index }: any) =>
+          h(SortColumn, {
+            index: $index,
+            model: props.model,
+            disabled: props.disabled,
+            name: modelName.value,
+            currentPage: currentPage.value,
+            pageSize: pageSize.value,
+            onSwap: (index1: number, index2: number) => {
+              const newData = sortArray(props.model[modelName.value], index1, index2, props.sortKey);
+              emit('change', newData);
+              mForm?.$emit('field-change', newData);
+            },
+          }),
+      });
+    }
+
+    if (selection.value) {
+      columns.push({
+        props: {
+          align: 'center',
+          headerAlign: 'center',
+          type: 'selection',
+          width: 45,
+        },
+      });
+    }
+
+    if (props.showIndex && props.config.showIndex) {
+      columns.push({
+        props: {
+          label: '序号',
+          width: 60,
+        },
+        cell: ({ $index }: any) => h('span', $index + 1 + currentPage.value * pageSize.value),
+      });
+    }
+
+    for (const column of props.config.items) {
+      if (column.type !== 'hidden' && display(column.display)) {
+        columns.push({
+          props: {
+            prop: column.name,
+            label: column.label,
+            width: column.width,
+            sortable: column.sortable,
+            sortOrders: ['ascending', 'descending'],
+            class: props.config.dropSort === true ? 'el-table__column--dropable' : '',
+          },
+          cell: ({ row, $index }: any) =>
+            h(Container, {
+              labelWidth: '0',
+              disabled: props.disabled,
+              prop: getProp($index),
+              rules: column.rules,
+              config: makeConfig(column, row),
+              model: row,
+              lastValues: lastData.value[$index],
+              isCompare: props.isCompare,
+              size: props.size,
+              onChange: changeHandler,
+              onAddDiffCount,
+            }),
+        });
+      }
+    }
+
+    return columns;
+  });
+
+  return {
+    columns,
+  };
+};

package/src/theme/container.scss

@@ -3,3 +3,20 @@
     display: inline-flex;
   }
 }
+
+.m-form-container {
+  &.has-tip {
+    display: flex;
+    align-items: baseline;
+
+    .tmagic-design-form-item {
+      flex: 1;
+    }
+  }
+
+  .tmagic-design-form-item {
+    &.show-diff {
+      background: #f7dadd;
+    }
+  }
+}

package/src/theme/form.scss

@@ -19,17 +19,21 @@
     height: 100%;
   }
 
-  .el-table {
+  .tmagic-design-table {
     .cell > div.m-form-container {
       display: block;
+
+      &.has-tip {
+        display: flex;
+      }
     }
   }
 
-  .el-tabs {
+  .tmagic-design-tabs {
     margin-bottom: 10px;
   }
 
-  .el-form-item.tmagic-form-hidden {
+  .tmagic-design-form-item.tmagic-form-hidden {
     > .el-form-item__label {
       display: none;
     }
@@ -39,5 +43,13 @@
     > .t-form__label {
       display: none;
     }
+
+    > .t-form__controls {
+      margin-left: 0 !important;
+    }
+  }
+
+  &.t-form:not(.t-form-inline) .t-form__item:last-of-type {
+    margin-bottom: var(--td-comp-margin-xxl);
   }
 }

package/src/utils/form.ts

@@ -21,6 +21,8 @@ import dayjs from 'dayjs';
 import utc from 'dayjs/plugin/utc';
 import { cloneDeep } from 'lodash-es';
 
+import { getValueByKeyPath } from '@tmagic/utils';
+
 import {
   ChildConfig,
   ContainerCommonConfig,
@@ -31,6 +33,7 @@ import {
   FormValue,
   HtmlField,
   Rule,
+  SortProp,
   TabPaneConfig,
   TypeFunction,
 } from '../schema';
@@ -89,8 +92,13 @@ const setValue = (mForm: FormState | undefined, value: FormValue, initValue: For
 
   // 如果fieldset配置checkbox，checkbox的值保存在value中
   if (type === 'fieldset' && checkbox) {
-    if (typeof value[name] === 'object') {
-      value[name].value = typeof initValue[name] === 'object' ? initValue[name].value || 0 : 0;
+    const checkboxName = typeof checkbox === 'object' && typeof checkbox.name === 'string' ? checkbox.name : 'value';
+    const checkboxFalseValue =
+      typeof checkbox === 'object' && typeof checkbox.falseValue !== 'undefined' ? checkbox.falseValue : 0;
+
+    if (name && typeof value[name] === 'object') {
+      value[name][checkboxName] =
+        typeof initValue[name] === 'object' ? initValue[name][checkboxName] || checkboxFalseValue : checkboxFalseValue;
     }
   }
 };
@@ -136,6 +144,18 @@ const initValueItem = function (
 
   setValue(mForm, value, initValue, item);
 
+  if (type === 'table') {
+    if (item.defautSort) {
+      sortChange(value[name], item.defautSort);
+    } else if (item.defaultSort) {
+      sortChange(value[name], item.defaultSort);
+    }
+
+    if (item.sort && item.sortKey) {
+      value[name].sort((a: any, b: any) => b[item.sortKey] - a[item.sortKey]);
+    }
+  }
+
   return value;
 };
 
@@ -197,6 +217,7 @@ export const filterFunction = <T = any>(
       prop: props.prop,
       config: props.config,
       index: props.index,
+      getFormValue: (prop: string) => getValueByKeyPath(prop, mForm?.values || props.model),
     });
   }
 
@@ -297,3 +318,36 @@ export const datetimeFormatter = (
   }
   return defaultValue;
 };
+
+export const getDataByPage = (data: any[] = [], pagecontext: number, pagesize: number) =>
+  data.filter(
+    (item: any, index: number) => index >= pagecontext * pagesize && index + 1 <= (pagecontext + 1) * pagesize,
+  );
+
+export const sortArray = (data: any[], newIndex: number, oldIndex: number, sortKey?: string) => {
+  if (newIndex === oldIndex) {
+    return data;
+  }
+
+  if (newIndex < 0 || newIndex >= data.length || oldIndex < 0 || oldIndex >= data.length) {
+    return data;
+  }
+
+  const newData = data.toSpliced(newIndex, 0, ...data.splice(oldIndex, 1));
+
+  if (sortKey) {
+    for (let i = newData.length - 1, v = 0; i >= 0; i--, v++) {
+      newData[v][sortKey] = i;
+    }
+  }
+
+  return newData;
+};
+
+export const sortChange = (data: any[], { prop, order }: SortProp) => {
+  if (order === 'ascending') {
+    data = data.sort((a: any, b: any) => a[prop] - b[prop]);
+  } else if (order === 'descending') {
+    data = data.sort((a: any, b: any) => b[prop] - a[prop]);
+  }
+};

package/types/index.d.ts

@@ -1,6 +1,6 @@
 import { App } from 'vue';
 import * as _tmagic_form_schema from '@tmagic/form-schema';
-import { FormState, FormConfig, TabPaneConfig, FormValue, FilterFunction, Rule, ChildConfig, FieldsetConfig, PanelConfig, RowConfig, TabConfig, TableConfig, GroupListConfig, FieldProps, TextConfig, NumberConfig, NumberRangeConfig, TextareaConfig, HiddenConfig, DateConfig, DateTimeConfig, TimeConfig, CheckboxConfig, SwitchConfig, DaterangeConfig, ColorPickConfig, CheckboxGroupConfig, RadioGroupConfig, DisplayConfig, LinkConfig, SelectConfig, SelectOption, SelectGroupOption, CascaderConfig, DynamicFieldConfig } from '@tmagic/form-schema';
+import { FormState, FormConfig, TabPaneConfig, FormValue, FilterFunction, Rule, SortProp, ChildConfig, FieldsetConfig, FlexLayoutConfig, PanelConfig, RowConfig, TabConfig, TableConfig, GroupListConfig, FieldProps, TextConfig, NumberConfig, NumberRangeConfig, TextareaConfig, HiddenConfig, DateConfig, DateTimeConfig, TimeConfig, CheckboxConfig, SwitchConfig, DaterangeConfig, ColorPickConfig, CheckboxGroupConfig, RadioGroupConfig, DisplayConfig, LinkConfig, SelectConfig, SelectOption, SelectGroupOption, CascaderConfig, DynamicFieldConfig } from '@tmagic/form-schema';
 export * from '@tmagic/form-schema';
 import * as _vue_runtime_core from '@vue/runtime-core';
 import * as _vue_reactivity from '@vue/reactivity';
@@ -28,6 +28,9 @@ declare const initValue: (mForm: FormState | undefined, { initValues, config }:
     config: FormConfig;
 }) => Promise<FormValue>;
 declare const datetimeFormatter: (v: string | Date, defaultValue?: string, format?: string) => string | number;
+declare const getDataByPage: (data: any[] | undefined, pagecontext: number, pagesize: number) => any[];
+declare const sortArray: (data: any[], newIndex: number, oldIndex: number, sortKey?: string) => any[];
+declare const sortChange: (data: any[], { prop, order }: SortProp) => void;
 
 declare const useAddField: (prop?: string) => void;
 
@@ -53,7 +56,7 @@ type __VLS_Props$u = {
     preventSubmitDefault?: boolean;
     extendState?: (_state: FormState) => Record<string, any> | Promise<Record<string, any>>;
 };
-declare const __VLS_export$u: _vue_runtime_core.DefineComponent<__VLS_Props$u, {
+declare const __VLS_export$v: _vue_runtime_core.DefineComponent<__VLS_Props$u, {
     values: _vue_reactivity.Ref<FormValue, FormValue>;
     lastValuesProcessed: _vue_reactivity.Ref<FormValue, FormValue>;
     formState: FormState;
@@ -62,6 +65,7 @@ declare const __VLS_export$u: _vue_runtime_core.DefineComponent<__VLS_Props$u, {
     changeHandler: (v: FormValue, eventData: ContainerChangeEventData) => void;
     resetForm: () => void;
     submitForm: (native?: boolean) => Promise<any>;
+    getTextByName: (name: string, config?: FormConfig) => string | undefined;
 }, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
     change: (...args: any[]) => void;
     error: (...args: any[]) => void;
@@ -88,7 +92,7 @@ declare const __VLS_export$u: _vue_runtime_core.DefineComponent<__VLS_Props$u, {
     parentValues: Record<string, any>;
     stepActive: string | number;
 }, {}, {}, {}, string, _vue_runtime_core.ComponentProvideOptions, false, {}, any>;
-declare const _default$v: typeof __VLS_export$u;
+declare const _default$w: typeof __VLS_export$v;
 
 type __VLS_Props$t = {
     config?: FormConfig;
@@ -149,6 +153,7 @@ declare const __VLS_base$4: _vue_runtime_core.DefineComponent<__VLS_Props$t, {
         changeHandler: (v: FormValue, eventData: ContainerChangeEventData) => void;
         resetForm: () => void;
         submitForm: (native?: boolean) => Promise<any>;
+        getTextByName: (name: string, config?: FormConfig) => string | undefined;
     }, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
         change: (...args: any[]) => void;
         error: (...args: any[]) => void;
@@ -207,6 +212,7 @@ declare const __VLS_base$4: _vue_runtime_core.DefineComponent<__VLS_Props$t, {
         changeHandler: (v: FormValue, eventData: ContainerChangeEventData) => void;
         resetForm: () => void;
         submitForm: (native?: boolean) => Promise<any>;
+        getTextByName: (name: string, config?: FormConfig) => string | undefined;
     }, {}, {}, {}, {
         disabled: boolean;
         labelWidth: string;
@@ -252,6 +258,7 @@ declare const __VLS_base$4: _vue_runtime_core.DefineComponent<__VLS_Props$t, {
         changeHandler: (v: FormValue, eventData: ContainerChangeEventData) => void;
         resetForm: () => void;
         submitForm: (native?: boolean) => Promise<any>;
+        getTextByName: (name: string, config?: FormConfig) => string | undefined;
     }, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
         change: (...args: any[]) => void;
         error: (...args: any[]) => void;
@@ -310,6 +317,7 @@ declare const __VLS_base$4: _vue_runtime_core.DefineComponent<__VLS_Props$t, {
         changeHandler: (v: FormValue, eventData: ContainerChangeEventData) => void;
         resetForm: () => void;
         submitForm: (native?: boolean) => Promise<any>;
+        getTextByName: (name: string, config?: FormConfig) => string | undefined;
     }, {}, {}, {}, {
         disabled: boolean;
         labelWidth: string;
@@ -345,8 +353,8 @@ declare const __VLS_base$4: _vue_runtime_core.DefineComponent<__VLS_Props$t, {
     config: FormConfig;
     confirmText: string;
 }, {}, {}, {}, string, _vue_runtime_core.ComponentProvideOptions, false, {}, any>;
-declare const __VLS_export$t: __VLS_WithSlots$4<typeof __VLS_base$4, __VLS_Slots$4>;
-declare const _default$u: typeof __VLS_export$t;
+declare const __VLS_export$u: __VLS_WithSlots$4<typeof __VLS_base$4, __VLS_Slots$4>;
+declare const _default$v: typeof __VLS_export$u;
 
 type __VLS_WithSlots$4<T, S> = T & {
     new (): {
@@ -415,6 +423,7 @@ declare const __VLS_base$3: _vue_runtime_core.DefineComponent<__VLS_Props$s, {
         changeHandler: (v: FormValue, eventData: ContainerChangeEventData) => void;
         resetForm: () => void;
         submitForm: (native?: boolean) => Promise<any>;
+        getTextByName: (name: string, config?: FormConfig) => string | undefined;
     }, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
         change: (...args: any[]) => void;
         error: (...args: any[]) => void;
@@ -473,6 +482,7 @@ declare const __VLS_base$3: _vue_runtime_core.DefineComponent<__VLS_Props$s, {
         changeHandler: (v: FormValue, eventData: ContainerChangeEventData) => void;
         resetForm: () => void;
         submitForm: (native?: boolean) => Promise<any>;
+        getTextByName: (name: string, config?: FormConfig) => string | undefined;
     }, {}, {}, {}, {
         disabled: boolean;
         labelWidth: string;
@@ -518,6 +528,7 @@ declare const __VLS_base$3: _vue_runtime_core.DefineComponent<__VLS_Props$s, {
         changeHandler: (v: FormValue, eventData: ContainerChangeEventData) => void;
         resetForm: () => void;
         submitForm: (native?: boolean) => Promise<any>;
+        getTextByName: (name: string, config?: FormConfig) => string | undefined;
     }, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
         change: (...args: any[]) => void;
         error: (...args: any[]) => void;
@@ -576,6 +587,7 @@ declare const __VLS_base$3: _vue_runtime_core.DefineComponent<__VLS_Props$s, {
         changeHandler: (v: FormValue, eventData: ContainerChangeEventData) => void;
         resetForm: () => void;
         submitForm: (native?: boolean) => Promise<any>;
+        getTextByName: (name: string, config?: FormConfig) => string | undefined;
     }, {}, {}, {}, {
         disabled: boolean;
         labelWidth: string;
@@ -617,8 +629,8 @@ declare const __VLS_base$3: _vue_runtime_core.DefineComponent<__VLS_Props$s, {
     config: FormConfig;
     confirmText: string;
 }, {}, {}, {}, string, _vue_runtime_core.ComponentProvideOptions, false, {}, any>;
-declare const __VLS_export$s: __VLS_WithSlots$3<typeof __VLS_base$3, __VLS_Slots$3>;
-declare const _default$t: typeof __VLS_export$s;
+declare const __VLS_export$t: __VLS_WithSlots$3<typeof __VLS_base$3, __VLS_Slots$3>;
+declare const _default$u: typeof __VLS_export$t;
 
 type __VLS_WithSlots$3<T, S> = T & {
     new (): {
@@ -683,6 +695,7 @@ declare const __VLS_base$2: _vue_runtime_core.DefineComponent<__VLS_Props$r, {
         changeHandler: (v: FormValue, eventData: ContainerChangeEventData) => void;
         resetForm: () => void;
         submitForm: (native?: boolean) => Promise<any>;
+        getTextByName: (name: string, config?: FormConfig) => string | undefined;
     }, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
         change: (...args: any[]) => void;
         error: (...args: any[]) => void;
@@ -741,6 +754,7 @@ declare const __VLS_base$2: _vue_runtime_core.DefineComponent<__VLS_Props$r, {
         changeHandler: (v: FormValue, eventData: ContainerChangeEventData) => void;
         resetForm: () => void;
         submitForm: (native?: boolean) => Promise<any>;
+        getTextByName: (name: string, config?: FormConfig) => string | undefined;
     }, {}, {}, {}, {
         disabled: boolean;
         labelWidth: string;
@@ -786,6 +800,7 @@ declare const __VLS_base$2: _vue_runtime_core.DefineComponent<__VLS_Props$r, {
         changeHandler: (v: FormValue, eventData: ContainerChangeEventData) => void;
         resetForm: () => void;
         submitForm: (native?: boolean) => Promise<any>;
+        getTextByName: (name: string, config?: FormConfig) => string | undefined;
     }, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
         change: (...args: any[]) => void;
         error: (...args: any[]) => void;
@@ -844,6 +859,7 @@ declare const __VLS_base$2: _vue_runtime_core.DefineComponent<__VLS_Props$r, {
         changeHandler: (v: FormValue, eventData: ContainerChangeEventData) => void;
         resetForm: () => void;
         submitForm: (native?: boolean) => Promise<any>;
+        getTextByName: (name: string, config?: FormConfig) => string | undefined;
     }, {}, {}, {}, {
         disabled: boolean;
         labelWidth: string;
@@ -874,8 +890,8 @@ declare const __VLS_base$2: _vue_runtime_core.DefineComponent<__VLS_Props$r, {
     config: FormConfig;
     confirmText: string;
 }, {}, {}, {}, string, _vue_runtime_core.ComponentProvideOptions, false, {}, any>;
-declare const __VLS_export$r: __VLS_WithSlots$2<typeof __VLS_base$2, __VLS_Slots$2>;
-declare const _default$s: typeof __VLS_export$r;
+declare const __VLS_export$s: __VLS_WithSlots$2<typeof __VLS_base$2, __VLS_Slots$2>;
+declare const _default$t: typeof __VLS_export$s;
 
 type __VLS_WithSlots$2<T, S> = T & {
     new (): {
@@ -898,7 +914,7 @@ type __VLS_Props$q = {
     /** 是否开启对比模式 */
     isCompare?: boolean;
 };
-declare const __VLS_export$q: _vue_runtime_core.DefineComponent<__VLS_Props$q, {}, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
+declare const __VLS_export$r: _vue_runtime_core.DefineComponent<__VLS_Props$q, {}, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
     change: (v: any, eventData: ContainerChangeEventData) => any;
     addDiffCount: () => any;
 }, string, _vue_runtime_core.PublicProps, Readonly<__VLS_Props$q> & Readonly<{
@@ -911,7 +927,7 @@ declare const __VLS_export$q: _vue_runtime_core.DefineComponent<__VLS_Props$q, {
     isCompare: boolean;
     expandMore: boolean;
 }, {}, {}, {}, string, _vue_runtime_core.ComponentProvideOptions, false, {}, any>;
-declare const _default$r: typeof __VLS_export$q;
+declare const _default$s: typeof __VLS_export$r;
 
 type __VLS_Props$p = {
     labelWidth?: string;
@@ -924,7 +940,7 @@ type __VLS_Props$p = {
     rules?: any;
     disabled?: boolean;
 };
-declare const __VLS_export$p: _vue_runtime_core.DefineComponent<__VLS_Props$p, {}, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
+declare const __VLS_export$q: _vue_runtime_core.DefineComponent<__VLS_Props$p, {}, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
     change: (v: any, eventData: ContainerChangeEventData) => any;
     addDiffCount: () => any;
 }, string, _vue_runtime_core.PublicProps, Readonly<__VLS_Props$p> & Readonly<{
@@ -936,9 +952,29 @@ declare const __VLS_export$p: _vue_runtime_core.DefineComponent<__VLS_Props$p, {
     lastValues: Record<string, any>;
     isCompare: boolean;
 }, {}, {}, {}, string, _vue_runtime_core.ComponentProvideOptions, false, {}, any>;
-declare const _default$q: typeof __VLS_export$p;
+declare const _default$r: typeof __VLS_export$q;
 
 type __VLS_Props$o = {
+    model: any;
+    lastValues?: any;
+    isCompare?: boolean;
+    config: FlexLayoutConfig;
+    name?: string;
+    labelWidth?: string;
+    prop?: string;
+    size?: string;
+    disabled?: boolean;
+};
+declare const __VLS_export$p: _vue_runtime_core.DefineComponent<__VLS_Props$o, {}, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
+    change: (v: any, eventData: ContainerChangeEventData) => any;
+    addDiffCount: () => any;
+}, string, _vue_runtime_core.PublicProps, Readonly<__VLS_Props$o> & Readonly<{
+    onChange?: ((v: any, eventData: ContainerChangeEventData) => any) | undefined;
+    onAddDiffCount?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, _vue_runtime_core.ComponentProvideOptions, false, {}, any>;
+declare const _default$q: typeof __VLS_export$p;
+
+type __VLS_Props$n = {
     model: any;
     lastValues?: any;
     isCompare?: boolean;
@@ -956,10 +992,10 @@ type __VLS_Slots$1 = {} & {
 } & {
     default?: (props: typeof __VLS_18) => any;
 };
-declare const __VLS_base$1: _vue_runtime_core.DefineComponent<__VLS_Props$o, {}, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
+declare const __VLS_base$1: _vue_runtime_core.DefineComponent<__VLS_Props$n, {}, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
     change: (v: any, eventData: ContainerChangeEventData) => any;
     addDiffCount: () => any;
-}, string, _vue_runtime_core.PublicProps, Readonly<__VLS_Props$o> & Readonly<{
+}, string, _vue_runtime_core.PublicProps, Readonly<__VLS_Props$n> & Readonly<{
     onChange?: ((v: any, eventData: ContainerChangeEventData) => any) | undefined;
     onAddDiffCount?: (() => any) | undefined;
 }>, {}, {}, {}, {}, string, _vue_runtime_core.ComponentProvideOptions, false, {}, any>;
@@ -972,7 +1008,7 @@ type __VLS_WithSlots$1<T, S> = T & {
     };
 };
 
-type __VLS_Props$n = {
+type __VLS_Props$m = {
     model: any;
     lastValues?: any;
     isCompare?: boolean;
@@ -984,16 +1020,16 @@ type __VLS_Props$n = {
     expandMore?: boolean;
     disabled?: boolean;
 };
-declare const __VLS_export$n: _vue_runtime_core.DefineComponent<__VLS_Props$n, {}, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
+declare const __VLS_export$n: _vue_runtime_core.DefineComponent<__VLS_Props$m, {}, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
     change: (v: any, eventData: ContainerChangeEventData) => any;
     addDiffCount: () => any;
-}, string, _vue_runtime_core.PublicProps, Readonly<__VLS_Props$n> & Readonly<{
+}, string, _vue_runtime_core.PublicProps, Readonly<__VLS_Props$m> & Readonly<{
     onChange?: ((v: any, eventData: ContainerChangeEventData) => any) | undefined;
     onAddDiffCount?: (() => any) | undefined;
 }>, {}, {}, {}, {}, string, _vue_runtime_core.ComponentProvideOptions, false, {}, any>;
 declare const _default$o: typeof __VLS_export$n;
 
-type __VLS_Props$m = {
+type __VLS_Props$l = {
     model: any;
     lastValues?: any;
     isCompare?: boolean;
@@ -1005,10 +1041,10 @@ type __VLS_Props$m = {
     expandMore?: boolean;
     disabled?: boolean;
 };
-declare const __VLS_export$m: _vue_runtime_core.DefineComponent<__VLS_Props$m, {}, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
+declare const __VLS_export$m: _vue_runtime_core.DefineComponent<__VLS_Props$l, {}, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
     change: (v: any, eventData?: ContainerChangeEventData | undefined) => any;
     addDiffCount: () => any;
-}, string, _vue_runtime_core.PublicProps, Readonly<__VLS_Props$m> & Readonly<{
+}, string, _vue_runtime_core.PublicProps, Readonly<__VLS_Props$l> & Readonly<{
     onChange?: ((v: any, eventData?: ContainerChangeEventData | undefined) => any) | undefined;
     onAddDiffCount?: (() => any) | undefined;
 }>, {
@@ -1017,7 +1053,7 @@ declare const __VLS_export$m: _vue_runtime_core.DefineComponent<__VLS_Props$m, {
 }, {}, {}, {}, string, _vue_runtime_core.ComponentProvideOptions, false, {}, any>;
 declare const _default$n: typeof __VLS_export$m;
 
-type __VLS_Props$l = {
+interface TableProps {
     model: any;
     lastValues?: any;
     isCompare?: boolean;
@@ -1032,26 +1068,19 @@ type __VLS_Props$l = {
     size?: string;
     enableToggleMode?: boolean;
     showIndex?: boolean;
-};
-declare var __VLS_34: {
-    scope: {
-        $index: any;
-        row: any;
-    };
-};
-declare var __VLS_111: {};
+}
+
+declare var __VLS_22: {};
 type __VLS_Slots = {} & {
-    operateCol?: (props: typeof __VLS_34) => any;
-} & {
-    default?: (props: typeof __VLS_111) => any;
+    default?: (props: typeof __VLS_22) => any;
 };
-declare const __VLS_base: _vue_runtime_core.DefineComponent<__VLS_Props$l, {
+declare const __VLS_base: _vue_runtime_core.DefineComponent<TableProps, {
     toggleRowSelection: (row: any, selected: boolean) => void;
 }, {}, {}, {}, _vue_runtime_core.ComponentOptionsMixin, _vue_runtime_core.ComponentOptionsMixin, {
     change: (...args: any[]) => void;
     select: (...args: any[]) => void;
     addDiffCount: (...args: any[]) => void;
-}, string, _vue_runtime_core.PublicProps, Readonly<__VLS_Props$l> & Readonly<{
+}, string, _vue_runtime_core.PublicProps, Readonly<TableProps> & Readonly<{
     onChange?: ((...args: any[]) => any) | undefined;
     onSelect?: ((...args: any[]) => any) | undefined;
     onAddDiffCount?: ((...args: any[]) => any) | undefined;
@@ -1287,5 +1316,5 @@ declare const _default: {
     install(app: App, opt?: FormInstallOptions): void;
 };
 
-export { _default$2 as MCascader, _default$c as MCheckbox, _default$7 as MCheckboxGroup, _default$8 as MColorPicker, _default$r as MContainer, _default$f as MDate, _default$e as MDateTime, _default$a as MDaterange, _default$5 as MDisplay, _default$1 as MDynamicField, _default$q as MFieldset, _default$v as MForm, _default$s as MFormBox, _default$u as MFormDialog, _default$t as MFormDrawer, _default$l as MGroupList, _default$g as MHidden, _default$4 as MLink, _default$j as MNumber, _default$i as MNumberRange, _default$p as MPanel, _default$6 as MRadioGroup, _default$o as MRow, _default$3 as MSelect, _default$b as MSwitch, _default$m as MTable, _default$n as MTabs, _default$k as MText, _default$h as MTextarea, _default$d as MTime, _default$9 as MTimerange, createForm, createValues, datetimeFormatter, _default as default, display, filterFunction, getRules, initValue, useAddField };
+export { _default$2 as MCascader, _default$c as MCheckbox, _default$7 as MCheckboxGroup, _default$8 as MColorPicker, _default$s as MContainer, _default$f as MDate, _default$e as MDateTime, _default$a as MDaterange, _default$5 as MDisplay, _default$1 as MDynamicField, _default$r as MFieldset, _default$q as MFlexLayout, _default$w as MForm, _default$t as MFormBox, _default$v as MFormDialog, _default$u as MFormDrawer, _default$l as MGroupList, _default$g as MHidden, _default$4 as MLink, _default$j as MNumber, _default$i as MNumberRange, _default$p as MPanel, _default$6 as MRadioGroup, _default$o as MRow, _default$3 as MSelect, _default$b as MSwitch, _default$m as MTable, _default$n as MTabs, _default$k as MText, _default$h as MTextarea, _default$d as MTime, _default$9 as MTimerange, createForm, createValues, datetimeFormatter, _default as default, display, filterFunction, getDataByPage, getRules, initValue, sortArray, sortChange, useAddField };
 export type { ChangeRecord, ContainerChangeEventData, FormInstallOptions, ValidateError };