@tmagic/form 1.7.10 → 1.7.12

package/dist/tmagic-form.umd.cjs

@@ -36,8 +36,8 @@
 		enumerable: true
 	}) : target, mod));
 	//#endregion
-	dayjs = __toESM(dayjs);
-	dayjs_plugin_utc = __toESM(dayjs_plugin_utc);
+	dayjs = __toESM(dayjs, 1);
+	dayjs_plugin_utc = __toESM(dayjs_plugin_utc, 1);
 	//#region node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/_freeGlobal.js
 	/** Detect free variable `global` from Node.js. */
 	var freeGlobal = typeof global == "object" && global && global.Object === Object && global;
@@ -1497,7 +1497,8 @@
 	* @param {Array} [entries] The key-value pairs to cache.
 	*/
 	function Stack(entries) {
-		this.size = (this.__data__ = new ListCache(entries)).size;
+		var data = this.__data__ = new ListCache(entries);
+		this.size = data.size;
 	}
 	Stack.prototype.clear = stackClear;
 	Stack.prototype["delete"] = stackDelete;
@@ -4688,235 +4689,487 @@
 		}
 	});
 	//#endregion
-	//#region packages/form/src/table/useAdd.ts
-	var useAdd = (props, emit) => {
-		const mForm = (0, vue.inject)("mForm");
-		const addable = (0, vue.computed)(() => {
-			const modelName = props.name || props.config.name || "";
-			if (!props.model[modelName].length) return true;
-			if (typeof props.config.addable === "function") return props.config.addable(mForm, {
-				model: props.model[modelName],
-				formValue: mForm?.values,
-				prop: props.prop
-			});
-			return typeof props.config.addable === "undefined" ? true : props.config.addable;
-		});
-		const newHandler = async (row) => {
-			const modelName = props.name || props.config.name || "";
-			if (props.config.max && props.model[modelName].length >= props.config.max) {
-				_tmagic_design.tMagicMessage.error(`最多新增配置不能超过${props.config.max}条`);
-				return;
-			}
-			if (typeof props.config.beforeAddRow === "function") {
-				if (!props.config.beforeAddRow(mForm, {
-					model: props.model[modelName],
-					formValue: mForm?.values,
-					prop: props.prop
-				})) 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 = {};
-			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) 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,
-					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 {
-			addable,
-			newHandler
-		};
-	};
-	//#endregion
-	//#region packages/form/src/table/useFullscreen.ts
-	var useFullscreen = () => {
-		const isFullscreen = (0, vue.ref)(false);
-		const toggleFullscreen = () => {
-			if (isFullscreen.value) isFullscreen.value = false;
-			else isFullscreen.value = true;
-		};
-		return {
-			isFullscreen,
-			toggleFullscreen
-		};
-	};
-	//#endregion
-	//#region packages/form/src/table/useImport.ts
-	var useImport = (props, emit, newHandler) => {
-		const mForm = (0, vue.inject)("mForm");
-		const modelName = (0, vue.computed)(() => props.name || props.config.name || "");
-		const importable = (0, vue.computed)(() => {
-			if (typeof props.config.importable === "function") return props.config.importable(mForm, {
-				formValue: mForm?.values,
-				model: props.model[modelName.value]
-			});
-			return typeof props.config.importable === "undefined" ? false : props.config.importable;
-		});
-		const excelBtn = (0, vue.useTemplateRef)("excelBtn");
-		const excelHandler = async (file) => {
-			if (!file?.raw) return false;
-			if (!globalThis.XLSX) await (0, _tmagic_utils.asyncLoadJs)("https://cdn.bootcdn.net/ajax/libs/xlsx/0.17.0/xlsx.full.min.js");
-			const reader = new FileReader();
-			reader.onload = () => {
-				const data = reader.result;
-				const pdata = globalThis.XLSX.read(data, { type: "array" });
-				pdata.SheetNames.forEach((sheetName) => {
-					const arr = globalThis.XLSX.utils.sheet_to_json(pdata.Sheets[sheetName], { header: 1 });
-					if (arr?.[0]) arr.forEach((row) => {
-						newHandler(row);
-					});
-					setTimeout(() => {
-						excelBtn.value?.clearFiles();
-					}, 300);
-				});
-			};
-			reader.readAsArrayBuffer(file.raw);
-			return false;
-		};
-		const clearHandler = () => {
-			emit("change", []);
-			mForm?.$emit("field-change", props.prop, props.model[modelName.value]);
-		};
-		return {
-			importable,
-			excelHandler,
-			clearHandler
-		};
-	};
-	//#endregion
-	//#region packages/form/src/table/usePagination.ts
-	var usePagination = (props, modelName) => {
-		const pageSize = (0, vue.ref)(10);
-		/**
-		* 当前页码
-		*/
-		const currentPage = (0, vue.ref)(0);
-		const paginationData = (0, vue.computed)(() => getDataByPage(props.model[modelName.value], currentPage.value, pageSize.value));
-		const handleSizeChange = (val) => {
-			pageSize.value = val;
-		};
-		const handleCurrentChange = (val) => {
-			currentPage.value = val - 1;
-		};
-		return {
-			pageSize,
-			currentPage,
-			paginationData,
-			handleSizeChange,
-			handleCurrentChange
-		};
-	};
-	//#endregion
-	//#region packages/form/src/table/useSelection.ts
-	var useSelection = (props, emit, tMagicTableRef) => {
-		const mForm = (0, vue.inject)("mForm");
-		const selectHandle = (selection, row) => {
-			if (typeof props.config.selection === "string" && props.config.selection === "single") {
-				tMagicTableRef.value?.clearSelection();
-				tMagicTableRef.value?.toggleRowSelection(row, true);
-			}
-			emit("select", selection, row);
-			if (typeof props.config.onSelect === "function") props.config.onSelect(mForm, {
-				selection,
-				row,
-				config: props.config
-			});
-		};
-		const toggleRowSelection = (row, selected) => {
-			tMagicTableRef.value?.toggleRowSelection.call(tMagicTableRef.value?.getTableRef(), row, selected);
-		};
-		return {
-			selectHandle,
-			toggleRowSelection
-		};
-	};
-	//#endregion
-	//#region packages/form/src/table/useSortable.ts
-	var SortablePromise;
-	var loadSortable = () => SortablePromise ??= import("sortablejs").then((m) => m.default);
-	var useSortable = (props, emit, tMagicTableRef, modelName, updateKey) => {
-		const mForm = (0, vue.inject)("mForm");
-		let sortable;
-		const rowDrop = async () => {
-			sortable?.destroy();
-			const tableEl = tMagicTableRef.value?.getEl();
-			const tBodyEl = tableEl?.querySelector(".el-table__body > tbody") || tableEl?.querySelector(".t-table__body");
-			if (!tBodyEl) return;
-			sortable = (await loadSortable()).create(tBodyEl, {
-				draggable: ".tmagic-design-table-row",
-				filter: "input",
-				preventOnFilter: false,
-				direction: "vertical",
-				handle: props.config.dropSortHandle ? ".tmagic-form-table-drag-target" : void 0,
-				onEnd: ({ newIndex, oldIndex }) => {
-					if (typeof newIndex === "undefined") return;
-					if (typeof oldIndex === "undefined") return;
-					const newData = sortArray(props.model[modelName.value], newIndex, oldIndex, props.sortKey);
-					emit("change", newData);
-					mForm?.$emit("field-change", newData);
-					(0, vue.nextTick)(() => {
-						sortable?.destroy();
-						sortable = void 0;
-						updateKey.value += 1;
-					});
-				}
-			});
-		};
-		(0, vue.watchEffect)(() => {
-			if (props.config.dropSort) rowDrop();
-		});
-	};
+	//#region packages/form/src/containers/GroupListItem.vue?vue&type=script&setup=true&lang.ts
+	var _hoisted_1$9 = ["innerHTML"];
+	var _hoisted_2$4 = { style: {
+		"text-align": "right",
+		"margin-top": "20px"
+	} };
+	var _hoisted_3$3 = ["innerHTML"];
 	//#endregion
-	//#region packages/form/src/table/ActionsColumn.vue
-	var ActionsColumn_default = /* @__PURE__ */ (0, vue.defineComponent)({
-		__name: "ActionsColumn",
+	//#region packages/form/src/containers/GroupListItem.vue
+	var GroupListItem_default = /* @__PURE__ */ (0, vue.defineComponent)({
+		name: "MFormGroupListItem",
+		__name: "GroupListItem",
 		props: {
-			config: {},
 			model: {},
-			name: {},
-			disabled: { type: Boolean },
-			currentPage: {},
-			pageSize: {},
-			index: {},
-			row: {},
+			lastValues: {},
+			isCompare: { type: Boolean },
+			groupModel: {},
+			config: {},
+			labelWidth: {},
 			prop: {},
-			sortKey: {}
+			size: {},
+			index: {},
+			disabled: { type: Boolean }
 		},
-		emits: ["change"],
+		emits: [
+			"swap-item",
+			"remove-item",
+			"change",
+			"addDiffCount",
+			"copy-item"
+		],
 		setup(__props, { emit: __emit }) {
-			const emit = __emit;
 			const props = __props;
+			const emit = __emit;
 			const mForm = (0, vue.inject)("mForm");
-			const removeHandler = (index) => {
-				if (props.disabled) return;
-				emit("change", props.model[props.name].toSpliced(index, 1));
+			const defaultExpandQuantity = props.config.defaultExpandQuantity ?? 7;
+			const expand = (0, vue.ref)(props.config.expandAll || defaultExpandQuantity > props.index);
+			const rowConfig = (0, vue.computed)(() => ({
+				type: "row",
+				span: props.config.span || 24,
+				items: props.config.items,
+				labelWidth: props.config.labelWidth,
+				[mForm?.keyProp || "__key"]: `${props.config[mForm?.keyProp || "__key"]}${String(props.index)}`
+			}));
+			const title = (0, vue.computed)(() => {
+				if (props.config.titleKey && props.model[props.config.titleKey]) return props.model[props.config.titleKey];
+				if (props.config.title) return filterFunction(mForm, props.config.title, props);
+				return `${props.config.titlePrefix || "组"} ${String(props.index + 1)}`;
+			});
+			const length = (0, vue.computed)(() => props.groupModel?.length || 0);
+			const itemExtra = (0, vue.computed)(() => filterFunction(mForm, props.config.itemExtra, props));
+			const removeHandler = () => emit("remove-item", props.index);
+			const changeHandler = (v, eventData) => {
+				emit("change", props.model, eventData);
+			};
+			const expandHandler = () => {
+				expand.value = !expand.value;
+			};
+			const showDelete = (0, vue.computed)(() => {
+				const deleteFunc = props.config.delete;
+				if (deleteFunc && typeof deleteFunc === "function") return deleteFunc(props.model, props.index, mForm?.values);
+				return true;
+			});
+			const changeOrder = (offset = 0) => emit("swap-item", props.index, props.index + offset);
+			const movable = (0, vue.computed)(() => {
+				const { movable } = props.config;
+				if (movable === void 0) return true;
+				if (typeof movable === "function") return movable(mForm, props.index || 0, props.model, props.groupModel);
+				return movable;
+			});
+			const copyable = (0, vue.computed)(() => filterFunction(mForm, props.config.copyable, props));
+			const onAddDiffCount = () => emit("addDiffCount");
+			const copyHandler = () => {
+				emit("copy-item", props.index);
+			};
+			const moveSpecifyLocationVisible = (0, vue.ref)(false);
+			const moveSpecifyLocationIndex = (0, vue.ref)(1);
+			const moveSpecifyLocationHandler = () => {
+				moveSpecifyLocationVisible.value = false;
+				emit("swap-item", props.index, moveSpecifyLocationIndex.value - 1);
+			};
+			return (_ctx, _cache) => {
+				return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicCard), {
+					class: "m-fields-group-list-item",
+					"body-style": { display: expand.value ? "block" : "none" }
+				}, {
+					header: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", null, [
+						(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
+							link: "",
+							disabled: __props.disabled,
+							onClick: expandHandler
+						}, {
+							default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicIcon), null, {
+								default: (0, vue.withCtx)(() => [expand.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_element_plus_icons_vue.CaretBottom), { key: 0 })) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_element_plus_icons_vue.CaretRight), { key: 1 }))]),
+								_: 1
+							}), (0, vue.createElementVNode)("span", { innerHTML: title.value }, null, 8, _hoisted_1$9)]),
+							_: 1
+						}, 8, ["disabled"]),
+						(0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
+							type: "danger",
+							size: "small",
+							link: "",
+							icon: (0, vue.unref)(_element_plus_icons_vue.Delete),
+							disabled: __props.disabled,
+							onClick: removeHandler
+						}, null, 8, ["icon", "disabled"]), [[vue.vShow, showDelete.value]]),
+						copyable.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
+							key: 0,
+							link: "",
+							size: "small",
+							type: "primary",
+							icon: (0, vue.unref)(_element_plus_icons_vue.DocumentCopy),
+							disabled: __props.disabled,
+							onClick: copyHandler
+						}, {
+							default: (0, vue.withCtx)(() => [..._cache[6] || (_cache[6] = [(0, vue.createTextVNode)("复制", -1)])]),
+							_: 1
+						}, 8, ["icon", "disabled"])) : (0, vue.createCommentVNode)("v-if", true),
+						movable.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [(0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
+							link: "",
+							size: "small",
+							disabled: __props.disabled,
+							icon: (0, vue.unref)(_element_plus_icons_vue.CaretTop),
+							onClick: _cache[0] || (_cache[0] = ($event) => changeOrder(-1))
+						}, {
+							default: (0, vue.withCtx)(() => [..._cache[7] || (_cache[7] = [(0, vue.createTextVNode)("上移", -1)])]),
+							_: 1
+						}, 8, ["disabled", "icon"]), [[vue.vShow, __props.index !== 0]]), (0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
+							link: "",
+							size: "small",
+							disabled: __props.disabled,
+							icon: (0, vue.unref)(_element_plus_icons_vue.CaretBottom),
+							onClick: _cache[1] || (_cache[1] = ($event) => changeOrder(1))
+						}, {
+							default: (0, vue.withCtx)(() => [..._cache[8] || (_cache[8] = [(0, vue.createTextVNode)("下移", -1)])]),
+							_: 1
+						}, 8, ["disabled", "icon"]), [[vue.vShow, __props.index !== length.value - 1]])], 64)) : (0, vue.createCommentVNode)("v-if", true),
+						__props.config.moveSpecifyLocation ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicPopover), {
+							key: 2,
+							trigger: "click",
+							placement: "top",
+							width: "200",
+							visible: moveSpecifyLocationVisible.value
+						}, {
+							reference: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
+								link: "",
+								size: "small",
+								type: "primary",
+								icon: (0, vue.unref)(_element_plus_icons_vue.Position),
+								disabled: __props.disabled,
+								onClick: _cache[2] || (_cache[2] = ($event) => moveSpecifyLocationVisible.value = true)
+							}, {
+								default: (0, vue.withCtx)(() => [..._cache[9] || (_cache[9] = [(0, vue.createTextVNode)("移动至", -1)])]),
+								_: 1
+							}, 8, ["icon", "disabled"])]),
+							default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", null, [(0, vue.createElementVNode)("div", null, [
+								_cache[10] || (_cache[10] = (0, vue.createTextVNode)(" 第", -1)),
+								(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicInputNumber), {
+									style: { "margin": "0 5px" },
+									modelValue: moveSpecifyLocationIndex.value,
+									"onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => moveSpecifyLocationIndex.value = $event),
+									size: "small",
+									min: 1,
+									disabled: __props.disabled
+								}, null, 8, ["modelValue", "disabled"]),
+								_cache[11] || (_cache[11] = (0, vue.createTextVNode)("行 ", -1))
+							]), (0, vue.createElementVNode)("div", _hoisted_2$4, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
+								size: "small",
+								text: "",
+								onClick: _cache[4] || (_cache[4] = ($event) => moveSpecifyLocationVisible.value = false)
+							}, {
+								default: (0, vue.withCtx)(() => [..._cache[12] || (_cache[12] = [(0, vue.createTextVNode)("取消", -1)])]),
+								_: 1
+							}), (0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
+								size: "small",
+								type: "primary",
+								onClick: moveSpecifyLocationHandler
+							}, {
+								default: (0, vue.withCtx)(() => [..._cache[13] || (_cache[13] = [(0, vue.createTextVNode)("确认", -1)])]),
+								_: 1
+							})])])]),
+							_: 1
+						}, 8, ["visible"])) : (0, vue.createCommentVNode)("v-if", true),
+						itemExtra.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
+							key: 3,
+							innerHTML: itemExtra.value,
+							class: "m-form-tip"
+						}, null, 8, _hoisted_3$3)) : (0, vue.createCommentVNode)("v-if", true)
+					])]),
+					default: (0, vue.withCtx)(() => [expand.value ? ((0, vue.openBlock)(), (0, vue.createBlock)(Container_default, {
+						key: 0,
+						config: rowConfig.value,
+						model: __props.model,
+						lastValues: __props.lastValues,
+						"is-compare": __props.isCompare,
+						labelWidth: __props.labelWidth,
+						prop: `${__props.prop}${__props.prop ? "." : ""}${String(__props.index)}`,
+						size: __props.size,
+						disabled: __props.disabled,
+						onChange: changeHandler,
+						onAddDiffCount: _cache[5] || (_cache[5] = ($event) => onAddDiffCount())
+					}, null, 8, [
+						"config",
+						"model",
+						"lastValues",
+						"is-compare",
+						"labelWidth",
+						"prop",
+						"size",
+						"disabled"
+					])) : (0, vue.createCommentVNode)("v-if", true)]),
+					_: 1
+				}, 8, ["body-style"]);
+			};
+		}
+	});
+	//#endregion
+	//#region packages/form/src/containers/GroupList.vue?vue&type=script&setup=true&lang.ts
+	var _hoisted_1$8 = { class: "m-fields-group-list" };
+	var _hoisted_2$3 = ["innerHTML"];
+	var _hoisted_3$2 = {
+		key: 1,
+		class: "el-table__empty-block"
+	};
+	var _hoisted_4$1 = { class: "m-fields-group-list-footer" };
+	var _hoisted_5 = { style: {
+		"display": "flex",
+		"justify-content": "flex-end",
+		"flex": "1"
+	} };
+	//#endregion
+	//#region packages/form/src/containers/GroupList.vue
+	var GroupList_default = /* @__PURE__ */ (0, vue.defineComponent)({
+		name: "MFormGroupList",
+		__name: "GroupList",
+		props: {
+			model: {},
+			lastValues: {},
+			isCompare: { type: Boolean },
+			config: {},
+			name: {},
+			labelWidth: {},
+			prop: {},
+			size: {},
+			disabled: { type: Boolean },
+			showIndex: { type: Boolean }
+		},
+		emits: ["change", "addDiffCount"],
+		setup(__props, { emit: __emit }) {
+			const props = __props;
+			const emit = __emit;
+			const changeHandler = (v, eventData) => {
+				emit("change", props.model, eventData);
+			};
+			const removeHandler = (index) => {
+				if (!props.name) return false;
+				props.model[props.name].splice(index, 1);
+				emit("change", props.model[props.name]);
+			};
+			const copyHandler = (index) => {
+				props.model[props.name].push(cloneDeep(props.model[props.name][index]));
+			};
+			const swapHandler = (idx1, idx2) => {
+				if (!props.name) return false;
+				const { length } = props.model[props.name];
+				const [currRow] = props.model[props.name].splice(idx1, 1);
+				props.model[props.name].splice(Math.min(Math.max(idx2, 0), length - 1), 0, currRow);
+				emit("change", props.model[props.name]);
+			};
+			const onAddDiffCount = () => emit("addDiffCount");
+			const getLastValues = (item, index) => item?.[index] || {};
+			return (_ctx, _cache) => {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$8, [
+					__props.config.extra ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
+						key: 0,
+						innerHTML: __props.config.extra,
+						style: { "color": "rgba(0, 0, 0, 0.45)" }
+					}, null, 8, _hoisted_2$3)) : (0, vue.createCommentVNode)("v-if", true),
+					!__props.model[__props.name] || !__props.model[__props.name].length ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_3$2, [..._cache[1] || (_cache[1] = [(0, vue.createElementVNode)("span", { class: "el-table__empty-text t-table__empty" }, "暂无数据", -1)])])) : ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, { key: 2 }, (0, vue.renderList)(__props.model[__props.name], (item, index) => {
+						return (0, vue.openBlock)(), (0, vue.createBlock)(GroupListItem_default, {
+							key: index,
+							model: item,
+							lastValues: getLastValues(__props.lastValues?.[__props.name], Number(index)),
+							"is-compare": __props.isCompare,
+							config: __props.config,
+							prop: __props.prop,
+							index: Number(index),
+							"label-width": __props.labelWidth,
+							size: __props.size,
+							disabled: __props.disabled,
+							"group-model": __props.model[__props.name],
+							onRemoveItem: removeHandler,
+							onCopyItem: copyHandler,
+							onSwapItem: swapHandler,
+							onChange: changeHandler,
+							onAddDiffCount: _cache[0] || (_cache[0] = ($event) => onAddDiffCount())
+						}, null, 8, [
+							"model",
+							"lastValues",
+							"is-compare",
+							"config",
+							"prop",
+							"index",
+							"label-width",
+							"size",
+							"disabled",
+							"group-model"
+						]);
+					}), 128)),
+					(0, vue.createElementVNode)("div", _hoisted_4$1, [(0, vue.renderSlot)(_ctx.$slots, "toggle-button"), (0, vue.createElementVNode)("div", _hoisted_5, [(0, vue.renderSlot)(_ctx.$slots, "add-button")])])
+				]);
+			};
+		}
+	});
+	//#endregion
+	//#region packages/form/src/containers/table/useFullscreen.ts
+	var useFullscreen = () => {
+		const { nextZIndex } = (0, _tmagic_design.useZIndex)();
+		const fullscreenZIndex = (0, vue.ref)(nextZIndex());
+		const isFullscreen = (0, vue.ref)(false);
+		const toggleFullscreen = () => {
+			if (isFullscreen.value) isFullscreen.value = false;
+			else isFullscreen.value = true;
+		};
+		(0, vue.watch)(isFullscreen, (value) => {
+			if (value) fullscreenZIndex.value = nextZIndex();
+		});
+		return {
+			isFullscreen,
+			fullscreenZIndex,
+			toggleFullscreen
+		};
+	};
+	//#endregion
+	//#region packages/form/src/containers/table/useImport.ts
+	var useImport = (props, emit) => {
+		const mForm = (0, vue.inject)("mForm");
+		const modelName = (0, vue.computed)(() => props.name || props.config.name || "");
+		const importable = (0, vue.computed)(() => {
+			if (typeof props.config.importable === "function") return props.config.importable(mForm, {
+				formValue: mForm?.values,
+				model: props.model[modelName.value]
+			});
+			return typeof props.config.importable === "undefined" ? false : props.config.importable;
+		});
+		const excelBtn = (0, vue.useTemplateRef)("excelBtn");
+		const excelHandler = async (file) => {
+			if (!file?.raw) return false;
+			if (!globalThis.XLSX) await (0, _tmagic_utils.asyncLoadJs)("https://cdn.bootcdn.net/ajax/libs/xlsx/0.17.0/xlsx.full.min.js");
+			const reader = new FileReader();
+			reader.onload = () => {
+				const data = reader.result;
+				const pdata = globalThis.XLSX.read(data, { type: "array" });
+				pdata.SheetNames.forEach((sheetName) => {
+					const arr = globalThis.XLSX.utils.sheet_to_json(pdata.Sheets[sheetName], { header: 1 });
+					if (arr?.[0]) emit("add", arr);
+					setTimeout(() => {
+						excelBtn.value?.clearFiles();
+					}, 300);
+				});
+			};
+			reader.readAsArrayBuffer(file.raw);
+			return false;
+		};
+		const clearHandler = () => {
+			emit("change", []);
+			mForm?.$emit("field-change", props.prop, props.model[modelName.value]);
+		};
+		return {
+			importable,
+			excelHandler,
+			clearHandler
+		};
+	};
+	//#endregion
+	//#region packages/form/src/containers/table/usePagination.ts
+	var usePagination = (props, modelName) => {
+		const pageSize = (0, vue.ref)(10);
+		/**
+		* 当前页码
+		*/
+		const currentPage = (0, vue.ref)(0);
+		const paginationData = (0, vue.computed)(() => getDataByPage(props.model[modelName.value], currentPage.value, pageSize.value));
+		const handleSizeChange = (val) => {
+			pageSize.value = val;
+		};
+		const handleCurrentChange = (val) => {
+			currentPage.value = val - 1;
+		};
+		return {
+			pageSize,
+			currentPage,
+			paginationData,
+			handleSizeChange,
+			handleCurrentChange
+		};
+	};
+	//#endregion
+	//#region packages/form/src/containers/table/useSelection.ts
+	var useSelection = (props, emit, tMagicTableRef) => {
+		const mForm = (0, vue.inject)("mForm");
+		const selectHandle = (selection, row) => {
+			if (typeof props.config.selection === "string" && props.config.selection === "single") {
+				tMagicTableRef.value?.clearSelection();
+				tMagicTableRef.value?.toggleRowSelection(row, true);
+			}
+			emit("select", selection, row);
+			if (typeof props.config.onSelect === "function") props.config.onSelect(mForm, {
+				selection,
+				row,
+				config: props.config
+			});
+		};
+		const toggleRowSelection = (row, selected) => {
+			tMagicTableRef.value?.toggleRowSelection.call(tMagicTableRef.value?.getTableRef(), row, selected);
+		};
+		return {
+			selectHandle,
+			toggleRowSelection
+		};
+	};
+	//#endregion
+	//#region packages/form/src/containers/table/useSortable.ts
+	var SortablePromise;
+	var loadSortable = () => SortablePromise ??= import("sortablejs").then((m) => m.default);
+	var useSortable = (props, emit, tMagicTableRef, modelName, updateKey) => {
+		const mForm = (0, vue.inject)("mForm");
+		let sortable;
+		const rowDrop = async () => {
+			sortable?.destroy();
+			const tableEl = tMagicTableRef.value?.getEl();
+			const tBodyEl = tableEl?.querySelector(".el-table__body > tbody") || tableEl?.querySelector(".t-table__body");
+			if (!tBodyEl) return;
+			sortable = (await loadSortable()).create(tBodyEl, {
+				draggable: ".tmagic-design-table-row",
+				filter: "input",
+				preventOnFilter: false,
+				direction: "vertical",
+				handle: props.config.dropSortHandle ? ".tmagic-form-table-drag-target" : void 0,
+				onEnd: ({ newIndex, oldIndex }) => {
+					if (typeof newIndex === "undefined") return;
+					if (typeof oldIndex === "undefined") return;
+					const newData = sortArray(props.model[modelName.value], newIndex, oldIndex, props.sortKey);
+					emit("change", newData);
+					mForm?.$emit("field-change", newData);
+					(0, vue.nextTick)(() => {
+						sortable?.destroy();
+						sortable = void 0;
+						updateKey.value += 1;
+					});
+				}
+			});
+		};
+		(0, vue.watchEffect)(() => {
+			if (props.config.dropSort) rowDrop();
+		});
+	};
+	//#endregion
+	//#region packages/form/src/containers/table/ActionsColumn.vue
+	var ActionsColumn_default = /* @__PURE__ */ (0, vue.defineComponent)({
+		__name: "ActionsColumn",
+		props: {
+			config: {},
+			model: {},
+			name: {},
+			disabled: { type: Boolean },
+			currentPage: {},
+			pageSize: {},
+			index: {},
+			row: {},
+			prop: {},
+			sortKey: {}
+		},
+		emits: ["change"],
+		setup(__props, { emit: __emit }) {
+			const emit = __emit;
+			const props = __props;
+			const mForm = (0, vue.inject)("mForm");
+			const removeHandler = (index) => {
+				if (props.disabled) return;
+				emit("change", props.model[props.name].toSpliced(index, 1));
 			};
 			const copyHandler = (index) => {
 				let inputs = cloneDeep(props.model[props.name][index]);
@@ -4996,7 +5249,7 @@
 		}
 	});
 	//#endregion
-	//#region packages/form/src/table/SortColumn.vue
+	//#region packages/form/src/containers/table/SortColumn.vue
 	var SortColumn_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		__name: "SortColumn",
 		props: {
@@ -5080,7 +5333,7 @@
 		}
 	});
 	//#endregion
-	//#region packages/form/src/table/useTableColumns.ts
+	//#region packages/form/src/containers/table/useTableColumns.ts
 	var useTableColumns = (props, emit, currentPage, pageSize, modelName) => {
 		const mForm = (0, vue.inject)("mForm");
 		const display$1 = (fuc) => display(mForm, fuc, props);
@@ -5197,7 +5450,7 @@
 				columns.push({
 					props: {
 						prop: column.name,
-						label: column.label,
+						label: column.label || column.text,
 						width: column.width,
 						sortable: column.sortable,
 						sortOrders: ["ascending", "descending"],
@@ -5221,7 +5474,7 @@
 							display: "inline-flex",
 							alignItems: "center",
 							gap: "5px"
-						} }, [(0, vue.h)("span", column.label), (0, vue.h)(_tmagic_design.TMagicIcon, {}, { default: () => (0, vue.h)(_element_plus_icons_vue.WarningFilled) })]),
+						} }, [(0, vue.h)("span", column.label || column.text), (0, vue.h)(_tmagic_design.TMagicIcon, {}, { default: () => (0, vue.h)(_element_plus_icons_vue.WarningFilled) })]),
 						content: () => (0, vue.h)("div", { innerHTML: titleTipValue })
 					}) : void 0
 				});
@@ -5231,21 +5484,21 @@
 		}) };
 	};
 	//#endregion
-	//#region packages/form/src/table/Table.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$9 = ["innerHTML"];
-	var _hoisted_2$4 = { style: {
+	//#region packages/form/src/containers/table/Table.vue?vue&type=script&setup=true&lang.ts
+	var _hoisted_1$7 = ["innerHTML"];
+	var _hoisted_2$2 = { style: {
 		"display": "flex",
 		"justify-content": "space-between",
 		"margin": "10px 0"
 	} };
-	var _hoisted_3$3 = { style: { "display": "flex" } };
-	var _hoisted_4$1 = {
+	var _hoisted_3$1 = { style: { "display": "flex" } };
+	var _hoisted_4 = {
 		key: 1,
 		class: "bottom",
 		style: { "text-align": "right" }
 	};
 	//#endregion
-	//#region packages/form/src/table/Table.vue
+	//#region packages/form/src/containers/table/Table.vue
 	var Table_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MFormTable",
 		__name: "Table",
@@ -5265,10 +5518,6 @@
 			sortKey: { default: "" },
 			text: {},
 			size: {},
-			enableToggleMode: {
-				type: Boolean,
-				default: true
-			},
 			showIndex: {
 				type: Boolean,
 				default: true
@@ -5277,7 +5526,8 @@
 		emits: [
 			"change",
 			"select",
-			"addDiffCount"
+			"addDiffCount",
+			"add"
 		],
 		setup(__props, { expose: __expose, emit: __emit }) {
 			const props = __props;
@@ -5285,36 +5535,13 @@
 			const modelName = (0, vue.computed)(() => props.name || props.config.name || "");
 			const tMagicTableRef = (0, vue.useTemplateRef)("tMagicTable");
 			const { pageSize, currentPage, paginationData, handleSizeChange, handleCurrentChange } = usePagination(props, modelName);
-			const { nextZIndex } = (0, _tmagic_design.useZIndex)();
 			const updateKey = (0, vue.ref)(1);
-			const { addable, newHandler } = useAdd(props, emit);
 			const { columns } = useTableColumns(props, emit, currentPage, pageSize, modelName);
 			useSortable(props, emit, tMagicTableRef, modelName, updateKey);
-			const { isFullscreen, toggleFullscreen } = useFullscreen();
-			const { importable, excelHandler, clearHandler } = useImport(props, emit, newHandler);
+			const { isFullscreen, fullscreenZIndex, toggleFullscreen } = useFullscreen();
+			const { importable, excelHandler, clearHandler } = useImport(props, emit);
 			const { selectHandle, toggleRowSelection } = useSelection(props, emit, tMagicTableRef);
 			const data = (0, vue.computed)(() => props.config.pagination ? paginationData.value : props.model[modelName.value]);
-			const toggleMode = () => {
-				const calcLabelWidth = (label) => {
-					if (!label) return "0px";
-					const zhLength = label.match(/[^\x00-\xff]/g)?.length || 0;
-					const chLength = label.length - zhLength;
-					return `${Math.max(chLength * 8 + zhLength * 20, 80)}px`;
-				};
-				props.config.type = "groupList";
-				props.config.enableToggleMode = true;
-				props.config.tableItems = props.config.items;
-				props.config.items = props.config.groupItems || props.config.items.map((item) => {
-					const text = item.text || item.label;
-					const labelWidth = calcLabelWidth(text);
-					return {
-						...item,
-						text,
-						labelWidth,
-						span: item.span || 12
-					};
-				});
-			};
 			const sortChangeHandler = (sortOptions) => {
 				const modelName = props.name || props.config.name || "";
 				sortChange(props.model[modelName], sortOptions);
@@ -5326,13 +5553,13 @@
 					disabled: !(0, vue.unref)(isFullscreen)
 				}, [(0, vue.createElementVNode)("div", (0, vue.mergeProps)(_ctx.$attrs, {
 					class: ["m-fields-table-wrap", { fixed: (0, vue.unref)(isFullscreen) }],
-					style: (0, vue.unref)(isFullscreen) ? `z-index: ${(0, vue.unref)(nextZIndex)()}` : ""
+					style: (0, vue.unref)(isFullscreen) ? `z-index: ${(0, vue.unref)(fullscreenZIndex)}` : ""
 				}), [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)(["m-fields-table", { "m-fields-table-item-extra": __props.config.itemExtra }]) }, [
 					__props.config.extra ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
 						key: 0,
 						style: { "color": "rgba(0, 0, 0, 0.45)" },
 						innerHTML: __props.config.extra
-					}, null, 8, _hoisted_1$9)) : (0, vue.createCommentVNode)("v-if", true),
+					}, null, 8, _hoisted_1$7)) : (0, vue.createCommentVNode)("v-if", true),
 					(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicTooltip), {
 						content: "拖拽可排序",
 						placement: "left-start",
@@ -5362,16 +5589,8 @@
 						_: 1
 					}, 8, ["disabled"]),
 					(0, vue.renderSlot)(_ctx.$slots, "default"),
-					(0, vue.createElementVNode)("div", _hoisted_2$4, [(0, vue.createElementVNode)("div", _hoisted_3$3, [
-						__props.enableToggleMode && __props.config.enableToggleMode !== false && !(0, vue.unref)(isFullscreen) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
-							key: 0,
-							icon: (0, vue.unref)(_element_plus_icons_vue.Grid),
-							size: "small",
-							onClick: toggleMode
-						}, {
-							default: (0, vue.withCtx)(() => [..._cache[1] || (_cache[1] = [(0, vue.createTextVNode)("展开配置", -1)])]),
-							_: 1
-						}, 8, ["icon"])) : (0, vue.createCommentVNode)("v-if", true),
+					(0, vue.createElementVNode)("div", _hoisted_2$2, [(0, vue.createElementVNode)("div", _hoisted_3$1, [
+						!(0, vue.unref)(isFullscreen) ? (0, vue.renderSlot)(_ctx.$slots, "toggle-button", { key: 0 }) : (0, vue.createCommentVNode)("v-if", true),
 						__props.config.enableFullscreen !== false ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
 							key: 1,
 							icon: (0, vue.unref)(_element_plus_icons_vue.FullScreen),
@@ -5390,440 +5609,275 @@
 							"on-change": (0, vue.unref)(excelHandler),
 							"auto-upload": false
 						}, {
-							default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
-								size: "small",
-								type: "success",
-								disabled: __props.disabled,
-								plain: ""
-							}, {
-								default: (0, vue.withCtx)(() => [..._cache[2] || (_cache[2] = [(0, vue.createTextVNode)("导入EXCEL", -1)])]),
-								_: 1
-							}, 8, ["disabled"])]),
-							_: 1
-						}, 8, ["disabled", "on-change"])) : (0, vue.createCommentVNode)("v-if", true),
-						(0, vue.unref)(importable) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
-							key: 3,
-							size: "small",
-							type: "warning",
-							disabled: __props.disabled,
-							plain: "",
-							onClick: (0, vue.unref)(clearHandler)
-						}, {
-							default: (0, vue.withCtx)(() => [..._cache[3] || (_cache[3] = [(0, vue.createTextVNode)("清空", -1)])]),
-							_: 1
-						}, 8, ["disabled", "onClick"])) : (0, vue.createCommentVNode)("v-if", true)
-					]), (0, vue.unref)(addable) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), (0, vue.mergeProps)({
-						key: 0,
-						class: "m-form-table-add-button",
-						size: "small",
-						plain: "",
-						icon: (0, vue.unref)(_element_plus_icons_vue.Plus)
-					}, __props.config.addButtonConfig?.props || { type: "primary" }, {
-						disabled: __props.disabled,
-						onClick: _cache[0] || (_cache[0] = ($event) => (0, vue.unref)(newHandler)())
-					}), {
-						default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.config.addButtonConfig?.text || "新增一行"), 1)]),
-						_: 1
-					}, 16, ["icon", "disabled"])) : (0, vue.createCommentVNode)("v-if", true)]),
-					__props.config.pagination ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_4$1, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicPagination), {
-						layout: "total, sizes, prev, pager, next, jumper",
-						"hide-on-single-page": __props.model[modelName.value].length < (0, vue.unref)(pageSize),
-						"current-page": (0, vue.unref)(currentPage) + 1,
-						"page-sizes": [
-							(0, vue.unref)(pageSize),
-							60,
-							120,
-							300
-						],
-						"page-size": (0, vue.unref)(pageSize),
-						total: __props.model[modelName.value].length,
-						onSizeChange: (0, vue.unref)(handleSizeChange),
-						onCurrentChange: (0, vue.unref)(handleCurrentChange)
-					}, null, 8, [
-						"hide-on-single-page",
-						"current-page",
-						"page-sizes",
-						"page-size",
-						"total",
-						"onSizeChange",
-						"onCurrentChange"
-					])])) : (0, vue.createCommentVNode)("v-if", true)
-				], 2)], 16)], 8, ["disabled"]);
-			};
-		}
-	});
-	//#endregion
-	//#region packages/form/src/containers/GroupListItem.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$8 = ["innerHTML"];
-	var _hoisted_2$3 = { style: {
-		"text-align": "right",
-		"margin-top": "20px"
-	} };
-	var _hoisted_3$2 = ["innerHTML"];
-	//#endregion
-	//#region packages/form/src/containers/GroupListItem.vue
-	var GroupListItem_default = /* @__PURE__ */ (0, vue.defineComponent)({
-		name: "MFormGroupListItem",
-		__name: "GroupListItem",
-		props: {
-			model: {},
-			lastValues: {},
-			isCompare: { type: Boolean },
-			groupModel: {},
-			config: {},
-			labelWidth: {},
-			prop: {},
-			size: {},
-			index: {},
-			disabled: { type: Boolean }
-		},
-		emits: [
-			"swap-item",
-			"remove-item",
-			"change",
-			"addDiffCount",
-			"copy-item"
-		],
-		setup(__props, { emit: __emit }) {
-			const props = __props;
-			const emit = __emit;
-			const mForm = (0, vue.inject)("mForm");
-			const defaultExpandQuantity = props.config.defaultExpandQuantity ?? 7;
-			const expand = (0, vue.ref)(props.config.expandAll || defaultExpandQuantity > props.index);
-			const rowConfig = (0, vue.computed)(() => ({
-				type: "row",
-				span: props.config.span || 24,
-				items: props.config.items,
-				labelWidth: props.config.labelWidth,
-				[mForm?.keyProp || "__key"]: `${props.config[mForm?.keyProp || "__key"]}${String(props.index)}`
-			}));
-			const title = (0, vue.computed)(() => {
-				if (props.config.titleKey && props.model[props.config.titleKey]) return props.model[props.config.titleKey];
-				if (props.config.title) return filterFunction(mForm, props.config.title, props);
-				return `${props.config.titlePrefix || "组"} ${String(props.index + 1)}`;
-			});
-			const length = (0, vue.computed)(() => props.groupModel?.length || 0);
-			const itemExtra = (0, vue.computed)(() => filterFunction(mForm, props.config.itemExtra, props));
-			const removeHandler = () => emit("remove-item", props.index);
-			const changeHandler = (v, eventData) => {
-				emit("change", props.model, eventData);
-			};
-			const expandHandler = () => {
-				expand.value = !expand.value;
-			};
-			const showDelete = (0, vue.computed)(() => {
-				const deleteFunc = props.config.delete;
-				if (deleteFunc && typeof deleteFunc === "function") return deleteFunc(props.model, props.index, mForm?.values);
-				return true;
-			});
-			const changeOrder = (offset = 0) => emit("swap-item", props.index, props.index + offset);
-			const movable = (0, vue.computed)(() => {
-				const { movable } = props.config;
-				if (movable === void 0) return true;
-				if (typeof movable === "function") return movable(mForm, props.index || 0, props.model, props.groupModel);
-				return movable;
-			});
-			const copyable = (0, vue.computed)(() => filterFunction(mForm, props.config.copyable, props));
-			const onAddDiffCount = () => emit("addDiffCount");
-			const copyHandler = () => {
-				emit("copy-item", props.index);
-			};
-			const moveSpecifyLocationVisible = (0, vue.ref)(false);
-			const moveSpecifyLocationIndex = (0, vue.ref)(1);
-			const moveSpecifyLocationHandler = () => {
-				moveSpecifyLocationVisible.value = false;
-				emit("swap-item", props.index, moveSpecifyLocationIndex.value - 1);
-			};
-			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicCard), {
-					class: "m-fields-group-list-item",
-					"body-style": { display: expand.value ? "block" : "none" }
-				}, {
-					header: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", null, [
-						(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
-							link: "",
-							disabled: __props.disabled,
-							onClick: expandHandler
-						}, {
-							default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicIcon), null, {
-								default: (0, vue.withCtx)(() => [expand.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_element_plus_icons_vue.CaretBottom), { key: 0 })) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_element_plus_icons_vue.CaretRight), { key: 1 }))]),
-								_: 1
-							}), (0, vue.createElementVNode)("span", { innerHTML: title.value }, null, 8, _hoisted_1$8)]),
-							_: 1
-						}, 8, ["disabled"]),
-						(0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
-							type: "danger",
-							size: "small",
-							link: "",
-							icon: (0, vue.unref)(_element_plus_icons_vue.Delete),
-							disabled: __props.disabled,
-							onClick: removeHandler
-						}, null, 8, ["icon", "disabled"]), [[vue.vShow, showDelete.value]]),
-						copyable.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
-							key: 0,
-							link: "",
-							size: "small",
-							type: "primary",
-							icon: (0, vue.unref)(_element_plus_icons_vue.DocumentCopy),
-							disabled: __props.disabled,
-							onClick: copyHandler
-						}, {
-							default: (0, vue.withCtx)(() => [..._cache[6] || (_cache[6] = [(0, vue.createTextVNode)("复制", -1)])]),
-							_: 1
-						}, 8, ["icon", "disabled"])) : (0, vue.createCommentVNode)("v-if", true),
-						movable.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [(0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
-							link: "",
-							size: "small",
-							disabled: __props.disabled,
-							icon: (0, vue.unref)(_element_plus_icons_vue.CaretTop),
-							onClick: _cache[0] || (_cache[0] = ($event) => changeOrder(-1))
-						}, {
-							default: (0, vue.withCtx)(() => [..._cache[7] || (_cache[7] = [(0, vue.createTextVNode)("上移", -1)])]),
-							_: 1
-						}, 8, ["disabled", "icon"]), [[vue.vShow, __props.index !== 0]]), (0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
-							link: "",
-							size: "small",
-							disabled: __props.disabled,
-							icon: (0, vue.unref)(_element_plus_icons_vue.CaretBottom),
-							onClick: _cache[1] || (_cache[1] = ($event) => changeOrder(1))
-						}, {
-							default: (0, vue.withCtx)(() => [..._cache[8] || (_cache[8] = [(0, vue.createTextVNode)("下移", -1)])]),
-							_: 1
-						}, 8, ["disabled", "icon"]), [[vue.vShow, __props.index !== length.value - 1]])], 64)) : (0, vue.createCommentVNode)("v-if", true),
-						__props.config.moveSpecifyLocation ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicPopover), {
-							key: 2,
-							trigger: "click",
-							placement: "top",
-							width: "200",
-							visible: moveSpecifyLocationVisible.value
-						}, {
-							reference: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
-								link: "",
-								size: "small",
-								type: "primary",
-								icon: (0, vue.unref)(_element_plus_icons_vue.Position),
-								disabled: __props.disabled,
-								onClick: _cache[2] || (_cache[2] = ($event) => moveSpecifyLocationVisible.value = true)
-							}, {
-								default: (0, vue.withCtx)(() => [..._cache[9] || (_cache[9] = [(0, vue.createTextVNode)("移动至", -1)])]),
-								_: 1
-							}, 8, ["icon", "disabled"])]),
-							default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", null, [(0, vue.createElementVNode)("div", null, [
-								_cache[10] || (_cache[10] = (0, vue.createTextVNode)(" 第", -1)),
-								(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicInputNumber), {
-									style: { "margin": "0 5px" },
-									modelValue: moveSpecifyLocationIndex.value,
-									"onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => moveSpecifyLocationIndex.value = $event),
-									size: "small",
-									min: 1,
-									disabled: __props.disabled
-								}, null, 8, ["modelValue", "disabled"]),
-								_cache[11] || (_cache[11] = (0, vue.createTextVNode)("行 ", -1))
-							]), (0, vue.createElementVNode)("div", _hoisted_2$3, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
-								size: "small",
-								text: "",
-								onClick: _cache[4] || (_cache[4] = ($event) => moveSpecifyLocationVisible.value = false)
-							}, {
-								default: (0, vue.withCtx)(() => [..._cache[12] || (_cache[12] = [(0, vue.createTextVNode)("取消", -1)])]),
-								_: 1
-							}), (0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
+							default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
 								size: "small",
-								type: "primary",
-								onClick: moveSpecifyLocationHandler
+								type: "success",
+								disabled: __props.disabled,
+								plain: ""
 							}, {
-								default: (0, vue.withCtx)(() => [..._cache[13] || (_cache[13] = [(0, vue.createTextVNode)("确认", -1)])]),
+								default: (0, vue.withCtx)(() => [..._cache[0] || (_cache[0] = [(0, vue.createTextVNode)("导入EXCEL", -1)])]),
 								_: 1
-							})])])]),
+							}, 8, ["disabled"])]),
 							_: 1
-						}, 8, ["visible"])) : (0, vue.createCommentVNode)("v-if", true),
-						itemExtra.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
+						}, 8, ["disabled", "on-change"])) : (0, vue.createCommentVNode)("v-if", true),
+						(0, vue.unref)(importable) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
 							key: 3,
-							innerHTML: itemExtra.value,
-							class: "m-form-tip"
-						}, null, 8, _hoisted_3$2)) : (0, vue.createCommentVNode)("v-if", true)
-					])]),
-					default: (0, vue.withCtx)(() => [expand.value ? ((0, vue.openBlock)(), (0, vue.createBlock)(Container_default, {
-						key: 0,
-						config: rowConfig.value,
-						model: __props.model,
-						lastValues: __props.lastValues,
-						"is-compare": __props.isCompare,
-						labelWidth: __props.labelWidth,
-						prop: `${__props.prop}${__props.prop ? "." : ""}${String(__props.index)}`,
-						size: __props.size,
-						disabled: __props.disabled,
-						onChange: changeHandler,
-						onAddDiffCount: _cache[5] || (_cache[5] = ($event) => onAddDiffCount())
+							size: "small",
+							type: "warning",
+							disabled: __props.disabled,
+							plain: "",
+							onClick: (0, vue.unref)(clearHandler)
+						}, {
+							default: (0, vue.withCtx)(() => [..._cache[1] || (_cache[1] = [(0, vue.createTextVNode)("清空", -1)])]),
+							_: 1
+						}, 8, ["disabled", "onClick"])) : (0, vue.createCommentVNode)("v-if", true)
+					]), (0, vue.renderSlot)(_ctx.$slots, "add-button")]),
+					__props.config.pagination ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_4, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicPagination), {
+						layout: "total, sizes, prev, pager, next, jumper",
+						"hide-on-single-page": __props.model[modelName.value].length < (0, vue.unref)(pageSize),
+						"current-page": (0, vue.unref)(currentPage) + 1,
+						"page-sizes": [
+							(0, vue.unref)(pageSize),
+							60,
+							120,
+							300
+						],
+						"page-size": (0, vue.unref)(pageSize),
+						total: __props.model[modelName.value].length,
+						onSizeChange: (0, vue.unref)(handleSizeChange),
+						onCurrentChange: (0, vue.unref)(handleCurrentChange)
 					}, null, 8, [
-						"config",
-						"model",
-						"lastValues",
-						"is-compare",
-						"labelWidth",
-						"prop",
-						"size",
-						"disabled"
-					])) : (0, vue.createCommentVNode)("v-if", true)]),
-					_: 1
-				}, 8, ["body-style"]);
+						"hide-on-single-page",
+						"current-page",
+						"page-sizes",
+						"page-size",
+						"total",
+						"onSizeChange",
+						"onCurrentChange"
+					])])) : (0, vue.createCommentVNode)("v-if", true)
+				], 2)], 16)], 8, ["disabled"]);
 			};
 		}
 	});
 	//#endregion
-	//#region packages/form/src/containers/GroupList.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$7 = { class: "m-fields-group-list" };
-	var _hoisted_2$2 = ["innerHTML"];
-	var _hoisted_3$1 = {
-		key: 1,
-		class: "el-table__empty-block"
+	//#region packages/form/src/containers/table-group-list/useAdd.ts
+	var useAdd = (props, emit) => {
+		const mForm = (0, vue.inject)("mForm");
+		const addable = (0, vue.computed)(() => {
+			const modelName = props.name || props.config.name || "";
+			if (!modelName) return false;
+			if (!props.model[modelName].length) return true;
+			if (typeof props.config.addable === "function") return props.config.addable(mForm, {
+				model: props.model[modelName],
+				formValue: mForm?.values,
+				prop: props.prop,
+				config: props.config
+			});
+			return typeof props.config.addable === "undefined" ? true : props.config.addable;
+		});
+		const newHandler = async (row) => {
+			const modelName = props.name || props.config.name || "";
+			if (props.config.max && props.model[modelName].length >= props.config.max) {
+				_tmagic_design.tMagicMessage.error(`最多新增配置不能超过${props.config.max}条`);
+				return;
+			}
+			if (typeof props.config.beforeAddRow === "function") {
+				if (!await props.config.beforeAddRow(mForm, {
+					model: props.model[modelName],
+					formValue: mForm?.values,
+					prop: props.prop
+				})) 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 = {};
+			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) 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,
+					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 {
+			addable,
+			newHandler
+		};
 	};
-	var _hoisted_4 = { class: "m-fields-group-list-footer" };
-	var _hoisted_5 = { style: {
-		"display": "flex",
-		"justify-content": "flex-end",
-		"flex": "1"
-	} };
 	//#endregion
-	//#region packages/form/src/containers/GroupList.vue
-	var GroupList_default = /* @__PURE__ */ (0, vue.defineComponent)({
-		name: "MFormGroupList",
-		__name: "GroupList",
+	//#region packages/form/src/containers/table-group-list/TableGroupList.vue
+	var TableGroupList_default = /* @__PURE__ */ (0, vue.defineComponent)({
+		name: "MFormTableGroupList",
+		inheritAttrs: false,
+		__name: "TableGroupList",
 		props: {
 			model: {},
 			lastValues: {},
 			isCompare: { type: Boolean },
 			config: {},
 			name: {},
-			labelWidth: {},
 			prop: {},
+			labelWidth: {},
+			disabled: { type: Boolean },
 			size: {},
-			disabled: { type: Boolean }
+			enableToggleMode: { type: Boolean },
+			showIndex: { type: Boolean },
+			sortKey: {},
+			sort: { type: Boolean }
 		},
-		emits: ["change", "addDiffCount"],
-		setup(__props, { emit: __emit }) {
+		emits: [
+			"change",
+			"select",
+			"addDiffCount"
+		],
+		setup(__props, { expose: __expose, emit: __emit }) {
 			const props = __props;
 			const emit = __emit;
-			const mForm = (0, vue.inject)("mForm");
-			const addable = (0, vue.computed)(() => {
-				if (!props.name) return false;
-				if (typeof props.config.addable === "function") return props.config.addable(mForm, {
-					model: props.model[props.name],
-					formValue: mForm?.values,
-					prop: props.prop,
-					config: props.config
-				});
-				return typeof props.config.addable === "undefined" ? true : props.config.addable;
+			const { addable, newHandler } = useAdd(props, emit);
+			const isGroupListType = (type) => type === "groupList" || type === "group-list";
+			const displayMode = (0, vue.ref)(isGroupListType(props.config.type) ? "groupList" : "table");
+			const calcLabelWidth = (label) => {
+				if (!label) return "0px";
+				const zhLength = label.match(/[^\x00-\xff]/g)?.length || 0;
+				const chLength = label.length - zhLength;
+				return `${Math.max(chLength * 8 + zhLength * 20, 80)}px`;
+			};
+			const tableConfig = (0, vue.computed)(() => {
+				if (!isGroupListType(props.config.type)) return props.config;
+				const source = props.config;
+				return {
+					...props.config,
+					type: "table",
+					groupItems: source.items,
+					items: source.tableItems || source.items.map((item) => ({
+						...item,
+						label: item.label || item.text,
+						text: null
+					}))
+				};
 			});
-			const changeHandler = (v, eventData) => {
-				emit("change", props.model, eventData);
+			const groupListConfig = (0, vue.computed)(() => {
+				if (isGroupListType(props.config.type)) return props.config;
+				const source = props.config;
+				return {
+					...props.config,
+					type: "groupList",
+					tableItems: source.items,
+					items: source.groupItems || source.items.map((item) => {
+						const text = item.text || item.label;
+						return {
+							...item,
+							text,
+							labelWidth: calcLabelWidth(text),
+							span: item.span || 12
+						};
+					})
+				};
+			});
+			const currentConfig = (0, vue.computed)(() => displayMode.value === "table" ? tableConfig.value : groupListConfig.value);
+			const addButtonSize = (0, vue.computed)(() => {
+				if (displayMode.value === "table") return "small";
+				return props.config.enableToggleMode !== false ? "small" : "default";
+			});
+			const toggleDisplayMode = () => {
+				displayMode.value = displayMode.value === "table" ? "groupList" : "table";
 			};
-			const addHandler = async () => {
-				if (!props.name) return false;
-				let initValues = {};
-				if (typeof props.config.defaultAdd === "function") initValues = await props.config.defaultAdd(mForm, {
-					model: props.model[props.name],
-					formValue: mForm?.values,
-					prop: props.prop,
-					config: props.config
-				});
-				else if (props.config.defaultAdd) initValues = props.config.defaultAdd;
-				const groupValue = await initValue(mForm, {
-					config: props.config.items,
-					initValues
+			const onChange = (v, eventData) => emit("change", v, eventData);
+			const onSelect = (...args) => emit("select", ...args);
+			const onAddDiffCount = () => emit("addDiffCount");
+			const onAdd = (rows) => {
+				rows.forEach((row) => {
+					newHandler(row);
 				});
-				props.model[props.name].push(groupValue);
-				emit("change", props.model[props.name], { changeRecords: [{
-					propPath: `${props.prop}.${props.model[props.name].length - 1}`,
-					value: groupValue
-				}] });
-			};
-			const removeHandler = (index) => {
-				if (!props.name) return false;
-				props.model[props.name].splice(index, 1);
-				emit("change", props.model[props.name]);
-			};
-			const copyHandler = (index) => {
-				props.model[props.name].push(cloneDeep(props.model[props.name][index]));
-			};
-			const swapHandler = (idx1, idx2) => {
-				if (!props.name) return false;
-				const { length } = props.model[props.name];
-				const [currRow] = props.model[props.name].splice(idx1, 1);
-				props.model[props.name].splice(Math.min(Math.max(idx2, 0), length - 1), 0, currRow);
-				emit("change", props.model[props.name]);
-			};
-			const toggleMode = () => {
-				props.config.type = "table";
-				props.config.groupItems = props.config.items;
-				props.config.items = props.config.tableItems || props.config.items.map((item) => ({
-					...item,
-					label: item.label || item.text,
-					text: null
-				}));
 			};
-			const onAddDiffCount = () => emit("addDiffCount");
-			const getLastValues = (item, index) => item?.[index] || {};
+			const tableGroupListRef = (0, vue.useTemplateRef)("tableGroupList");
+			__expose({ toggleRowSelection: (row, selected) => tableGroupListRef.value?.toggleRowSelection?.(row, selected) });
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$7, [
-					__props.config.extra ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
-						key: 0,
-						innerHTML: __props.config.extra,
-						style: { "color": "rgba(0, 0, 0, 0.45)" }
-					}, null, 8, _hoisted_2$2)) : (0, vue.createCommentVNode)("v-if", true),
-					!__props.model[__props.name] || !__props.model[__props.name].length ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_3$1, [..._cache[1] || (_cache[1] = [(0, vue.createElementVNode)("span", { class: "el-table__empty-text t-table__empty" }, "暂无数据", -1)])])) : ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, { key: 2 }, (0, vue.renderList)(__props.model[__props.name], (item, index) => {
-						return (0, vue.openBlock)(), (0, vue.createBlock)(GroupListItem_default, {
-							key: index,
-							model: item,
-							lastValues: getLastValues(__props.lastValues[__props.name], Number(index)),
-							"is-compare": __props.isCompare,
-							config: __props.config,
-							prop: __props.prop,
-							index: Number(index),
-							"label-width": __props.labelWidth,
-							size: __props.size,
-							disabled: __props.disabled,
-							"group-model": __props.model[__props.name],
-							onRemoveItem: removeHandler,
-							onCopyItem: copyHandler,
-							onSwapItem: swapHandler,
-							onChange: changeHandler,
-							onAddDiffCount: _cache[0] || (_cache[0] = ($event) => onAddDiffCount())
-						}, null, 8, [
-							"model",
-							"lastValues",
-							"is-compare",
-							"config",
-							"prop",
-							"index",
-							"label-width",
-							"size",
-							"disabled",
-							"group-model"
-						]);
-					}), 128)),
-					(0, vue.createElementVNode)("div", _hoisted_4, [__props.config.enableToggleMode ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
+				return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(displayMode.value === "table" ? Table_default : GroupList_default), (0, vue.mergeProps)({ ref: "tableGroupList" }, _ctx.$attrs, {
+					model: __props.model,
+					name: `${__props.name}`,
+					config: currentConfig.value,
+					disabled: __props.disabled,
+					size: __props.size,
+					"is-compare": __props.isCompare,
+					"last-values": __props.lastValues,
+					prop: __props.prop,
+					"label-width": __props.labelWidth,
+					"show-index": __props.showIndex,
+					"sort-key": __props.sortKey,
+					sort: __props.sort,
+					onChange,
+					onSelect,
+					onAddDiffCount,
+					onAdd
+				}), (0, vue.createSlots)({
+					"toggle-button": (0, vue.withCtx)(() => [__props.config.enableToggleMode || __props.enableToggleMode ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
 						key: 0,
 						icon: (0, vue.unref)(_element_plus_icons_vue.Grid),
 						size: "small",
-						onClick: toggleMode
+						onClick: toggleDisplayMode
 					}, {
-						default: (0, vue.withCtx)(() => [..._cache[2] || (_cache[2] = [(0, vue.createTextVNode)("切换为表格", -1)])]),
+						default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)(displayMode.value === "table" ? "展开配置" : "切换为表格"), 1)]),
 						_: 1
-					}, 8, ["icon"])) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createElementVNode)("div", _hoisted_5, [addable.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), (0, vue.mergeProps)({
-						key: 0,
-						size: __props.config.enableToggleMode ? "small" : "default",
-						icon: (0, vue.unref)(_element_plus_icons_vue.Plus)
-					}, __props.config.addButtonConfig?.props || { type: "primary" }, {
-						disabled: __props.disabled,
-						onClick: addHandler
-					}), {
-						default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.config.addButtonConfig?.text || "新增"), 1)]),
+					}, 8, ["icon"])) : (0, vue.createCommentVNode)("v-if", true)]),
+					_: 2
+				}, [(0, vue.unref)(addable) ? {
+					name: "add-button",
+					fn: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), (0, vue.mergeProps)({
+						class: displayMode.value === "table" ? "m-form-table-add-button" : "",
+						size: addButtonSize.value,
+						plain: displayMode.value === "table",
+						icon: (0, vue.unref)(_element_plus_icons_vue.Plus),
+						disabled: __props.disabled
+					}, currentConfig.value.addButtonConfig?.props || { type: "primary" }, { onClick: (0, vue.unref)(newHandler) }), {
+						default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)(currentConfig.value.addButtonConfig?.text || (displayMode.value === "table" ? "新增一行" : "新增")), 1)]),
 						_: 1
 					}, 16, [
+						"class",
 						"size",
+						"plain",
 						"icon",
-						"disabled"
-					])) : (0, vue.createCommentVNode)("v-if", true)])])
+						"disabled",
+						"onClick"
+					])]),
+					key: "0"
+				} : void 0]), 1040, [
+					"model",
+					"name",
+					"config",
+					"disabled",
+					"size",
+					"is-compare",
+					"last-values",
+					"prop",
+					"label-width",
+					"show-index",
+					"sort-key",
+					"sort"
 				]);
 			};
 		}
@@ -7607,11 +7661,11 @@
 		app.component("m-form-dialog", FormDialog_default);
 		app.component("m-form-container", Container_default);
 		app.component("m-form-fieldset", Fieldset_default);
-		app.component("m-form-group-list", GroupList_default);
+		app.component("m-form-group-list", TableGroupList_default);
 		app.component("m-form-panel", Panel_default);
 		app.component("m-form-row", Row_default);
 		app.component("m-form-step", Step_default);
-		app.component("m-form-table", Table_default);
+		app.component("m-form-table", TableGroupList_default);
 		app.component("m-form-tab", Tabs_default);
 		app.component("m-form-flex-layout", FlexLayout_default);
 		app.component("m-fields-text", Text_default);
@@ -7654,7 +7708,7 @@
 	exports.MFormBox = FormBox_default;
 	exports.MFormDialog = FormDialog_default;
 	exports.MFormDrawer = FormDrawer_default;
-	exports.MGroupList = GroupList_default;
+	exports.MGroupList = TableGroupList_default;
 	exports.MHidden = Hidden_default;
 	exports.MLink = Link_default;
 	exports.MNumber = Number_default;
@@ -7664,7 +7718,8 @@
 	exports.MRow = Row_default;
 	exports.MSelect = Select_default;
 	exports.MSwitch = Switch_default;
-	exports.MTable = Table_default;
+	exports.MTable = TableGroupList_default;
+	exports.MTableGroupList = TableGroupList_default;
 	exports.MTabs = Tabs_default;
 	exports.MText = Text_default;
 	exports.MTextarea = Textarea_default;