roymondchen 9f21f8f1d5 refactor(form): 抽出 TableGroupList 父组件统一管理 Table/GroupList 切换
- 新增 TableGroupList 父组件集中持有 displayMode 状态并派生两种形态的
  config,避免原实现通过直接改写 props.config 来触发视图切换
- 将公共的 toggle/add 按钮上移到 TableGroupList,Table/GroupList 通过
  具名 slot + scoped slot 暴露位置与业务钩子(newHandler/addHandler)
- m-form-table、m-form-group-list 统一注册为 TableGroupList,对外导出
  的 MTable/MGroupList 也指向它,新增 MTableGroupList 显式导出
- useAdd 移除重复的 addable 计算,由父组件统一管理

Made-with: Cursor
2026-04-23 17:03:04 +08:00

97 lines
2.6 KiB
TypeScript

import { inject } from 'vue';
import { tMagicMessage } from '@tmagic/design';
import type { FormConfig, FormState } from '@tmagic/form-schema';
import { initValue } from '../utils/form';
import type { TableProps } from './type';
export const useAdd = (
props: TableProps,
emit: (event: 'select' | 'change' | 'addDiffCount', ...args: any[]) => void,
) => {
const mForm = inject<FormState | undefined>('mForm');
const newHandler = async (row?: any) => {
const modelName = props.name || props.config.name || '';
if (props.config.max && props.model[modelName].length >= props.config.max) {
tMagicMessage.error(`最多新增配置不能超过${props.config.max}`);
return;
}
if (typeof props.config.beforeAddRow === 'function') {
const beforeCheckRes = await props.config.beforeAddRow(mForm, {
model: props.model[modelName],
formValue: mForm?.values,
prop: props.prop,
});
if (!beforeCheckRes) return;
}
const columns = props.config.items;
const enumValues = props.config.enum || [];
let enumV = [];
const { length } = props.model[modelName];
const key = props.config.key || 'id';
let inputs: any = {};
if (enumValues.length) {
if (length >= enumValues.length) {
return;
}
enumV = enumValues.filter((item) => {
let i = 0;
for (; i < length; i++) {
if (item[key] === props.model[modelName][i][key]) {
break;
}
}
return i === length;
});
if (enumV.length > 0) {
// eslint-disable-next-line prefer-destructuring
inputs = enumV[0];
}
} else if (Array.isArray(row)) {
columns.forEach((column, index) => {
column.name && (inputs[column.name] = row[index]);
});
} else {
if (typeof props.config.defaultAdd === 'function') {
inputs = await props.config.defaultAdd(mForm, {
model: props.model[modelName],
prop: props.prop,
formValue: mForm?.values,
});
} else if (props.config.defaultAdd) {
inputs = props.config.defaultAdd;
}
inputs = await initValue(mForm, {
config: columns as FormConfig,
initValues: inputs,
});
}
if (props.sortKey && length) {
inputs[props.sortKey] = props.model[modelName][length - 1][props.sortKey] - 1;
}
emit('change', [...props.model[modelName], inputs], {
changeRecords: [
{
propPath: `${props.prop}.${props.model[modelName].length}`,
value: inputs,
},
],
});
};
return {
newHandler,
};
};