@web-utils/component 5.0.0-beta02 → 5.0.0-beta04

package/sub-table-plus/index.mjs

@@ -1,593 +0,0 @@
-import { t as e } from "../chunks/_plugin-vue_export-helper.7vrlOII_.mjs";
-import { t } from "../chunks/sub-table-plus-props.CRX7ERxJ.mjs";
-import { Fragment as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createSlots as s, createTextVNode as c, createVNode as l, mergeProps as u, normalizeClass as d, openBlock as f, renderList as p, renderSlot as m, resolveComponent as h, toDisplayString as g, toHandlers as _, withCtx as v, withModifiers as y } from "vue";
-import { findTreeChildren as b, isFunction as x } from "@web-utils/core";
-import { cloneDeep as S } from "@web-utils/integrations/lodash";
-//#region src/components/table/SubTablePlus.vue
-var C = {
-	name: "SubTablePlus",
-	mixins: [t],
-	inject: {
-		elForm: { default: "" },
-		elFormItem: { default: "" }
-	},
-	props: {
-		onRowDbClick: Function,
-		showMessage: Boolean,
-		pageSize: Number
-	},
-	emits: ["add-row"],
-	data() {
-		return {
-			rows: [],
-			selectedRows: []
-		};
-	},
-	computed: {
-		enabled() {
-			return !this.inputDisabled;
-		},
-		hasToolBarMenu() {
-			var e;
-			return (e = this.toolbarMenus) == null ? void 0 : e.length;
-		},
-		hasHandleMenus() {
-			var e;
-			return (e = this.handleMenus) == null ? void 0 : e.length;
-		},
-		rowProps() {
-			let e = {};
-			return this.columns && this.columns.map((e) => e.prop).forEach((t) => {
-				e[t] = null;
-			}), e;
-		},
-		inputDisabled() {
-			return this.disabled || (this.elForm || {}).disabled;
-		}
-	},
-	watch: {
-		modelValue: {
-			deep: !0,
-			immediate: !0,
-			handler(e) {
-				this.rows = e || [];
-			}
-		},
-		rows: {
-			deep: !0,
-			immediate: !0,
-			handler(e) {
-				this.$emit("update:modelValue", e);
-			}
-		}
-	},
-	methods: {
-		getCellType(e, t) {
-			return x(t.getType) ? t.getType(e, t) : t.type;
-		},
-		getInputAttr(e, t) {
-			return t.attrs && t.getAttrs ? {
-				...t.attrs,
-				...t.getAttrs(e)
-			} : t.attrs ? t.attrs : t.getAttrs ? t.getAttrs(e) : {};
-		},
-		isInputDisabled(e, t) {
-			var n;
-			return (n = t.isDisabled) == null ? void 0 : n.call(t, e);
-		},
-		onInput(e, t, n) {
-			n.setValue ? n.setValue(e, t, n, this.rows) : n.setVal !== !1 && (e[n.prop] = t);
-		},
-		onBlur(e, t) {
-			t.onBlur && t.onBlur(e, t, this.rows);
-		},
-		onSelectionChange(e) {
-			this.selectedRows = e;
-		},
-		async remove(e, t) {
-			try {
-				if (this.delApi) try {
-					await this.delApi([e.id]), this.$message.success("删除成功！"), this.refresh();
-				} catch {
-					this.$message.error("删除失败！");
-				}
-				else this.rows.splice(t, 1);
-			} catch {}
-		},
-		async add(e, t) {
-			if (this.fetchApi) this.addRow();
-			else {
-				var n;
-				let e = S(this.rowProps), r = await ((n = this.initRow) == null ? void 0 : n.call(this, e, t));
-				t === -1 ? this.rows.push(r || e) : this.rows.splice(t + 1, 0, r || e);
-			}
-		},
-		addRow() {
-			this.$emit("add-row");
-		},
-		async delRow() {
-			if (!this.selectedRows.length) {
-				this.$message.warning("请选择要删除的记录！");
-				return;
-			}
-			try {
-				if (this.delApi) try {
-					await this.delApi(this.selectedRows.map((e) => e.id)), this.$message.success("删除成功！"), this.refresh();
-				} catch {
-					this.$message.error("删除失败！");
-				}
-				else this.$emit("update:modelValue", this.rows.filter((e) => !this.selectedRows.includes(e)));
-			} catch {}
-		},
-		refresh() {
-			this.$refs.table.getPage();
-		},
-		getVal(e, t, n) {
-			var r, i;
-			if (n.type === "select" && (r = n.attrs) != null && r.options) {
-				let r = n.attrs.options.find((n) => n.value === e[t.property] || n.code === e[t.property]);
-				if (r) return r.label || r.name;
-			}
-			if (n.type === "checkbox1") return e[t.property] === !0 || e[t.property] === "1" || e[t.property] === "Y" ? "是" : "否";
-			if (n.type === "cascader" && (i = n.attrs) != null && i.options) {
-				let [r] = b(n.attrs.options, (r) => r[n.attrs.valueKey || "value"] === e[t.property]);
-				if (r) return r[n.attrs.valueKey || "label"];
-			}
-			return e[t.property];
-		},
-		reloadTable() {
-			var e;
-			(e = this.$refs.table) == null || e.reload();
-		},
-		async refreshTable() {
-			var e;
-			await ((e = this.$refs.table) == null ? void 0 : e.getPage());
-		},
-		removeSelectedRows() {
-			this.$emit("update:modelValue", this.value.filter((e) => !this.selectedRows.includes(e)));
-		},
-		rowDbClick(...e) {
-			var t;
-			(t = this.onRowDbClick) == null || t.call(this, ...e);
-		}
-	}
-}, w = { class: "table-header flex-row" }, T = { class: "flex-item" }, E = { class: "flex-not-shrink" }, D = {
-	key: 0,
-	style: { color: "#f56c6c" }
-}, O = ["title"], k = ["onClick"], A = {
-	key: 0,
-	class: "flex-row vertical-center horizon-center",
-	style: {
-		padding: "10px",
-		border: "1px solid #ebeef5",
-		"border-top": "none"
-	}
-};
-function j(e, t, b, x, S, C) {
-	var j, M;
-	let N = h("ElButton"), P = h("ConfirmButton"), F = h("FormInput"), I = h("FormCheckbox"), L = h("FormInputPhoneNumber"), R = h("FormInputUser"), z = h("FormInputDepartment"), B = h("FormSelect"), V = h("FormDatePicker"), H = h("FormCascader"), U = h("FormCheckboxGroup"), W = h("FormInputNumber"), G = h("DictRender"), K = h("TableColumn"), q = h("Confirmable"), J = h("PageableTable");
-	return f(), a("div", { class: d(["sub-table-plus", { "hide-message": !b.showMessage }]) }, [
-		l(J, u({
-			ref: "table",
-			"auto-height": "",
-			data: e.fetchApi ? !1 : S.rows,
-			api: e.fetchApi,
-			"payload-style": "body",
-			"show-summary": e.showSummary,
-			descs: e.descs,
-			ascs: e.ascs,
-			"page-size": b.pageSize,
-			"selection-width": e.selectionWidth
-		}, e.$attrs, {
-			"hide-on-single-page": "",
-			selection: e.selection,
-			index: e.index
-		}, _(e.$listeners), { onSelectionChange: C.onSelectionChange }), s({
-			default: v(() => [
-				m(e.$slots, "columns", { columns: e.columns }, () => [(f(!0), a(n, null, p(e.columns, (t) => (f(), a(n, null, [t.label && !t.hide && !t.slot ? (f(), r(K, {
-					key: `${t.prop}-${C.enabled}${t.type ? `-${t.type}` : ""}${t.required ? `-${t.required}` : ""}`,
-					label: t.label,
-					width: t.width,
-					"dict-type": t.dictType,
-					clickable: t.clickable,
-					align: t.align,
-					prop: t.prop,
-					options: t.options,
-					"show-overflow-tooltip": !t.editable && t.showOverflowTooltip
-				}, {
-					header: v(() => [!C.inputDisabled && t.required ? (f(), a("span", D, "*")) : i("v-if", !0), o("span", { title: t.label }, g(t.label), 9, O)]),
-					default: v(({ row: o, column: s, $index: l }) => [
-						i("tag 插槽"),
-						m(e.$slots, "tag", {
-							row: o,
-							column: s,
-							index: l
-						}),
-						i("列默认插槽,名字和 prop 保持一致"),
-						m(e.$slots, t.prop, {
-							row: o,
-							column: s,
-							wrapCol: !1,
-							index: l,
-							prop: e.prop ? `${e.prop}[${l}].${t.prop}` : null,
-							required: t.required,
-							editable: t.editable
-						}, () => {
-							var d;
-							return [C.enabled && t.editable === !0 ? (f(), a(n, { key: 0 }, [C.getCellType(o, t) === "input" ? (f(), r(F, u({
-								key: 0,
-								"wrap-col": !1,
-								"model-value": o[s.property]
-							}, { ref_for: !0 }, C.getInputAttr(o, t), {
-								disabled: C.isInputDisabled(o, t),
-								prop: e.prop ? `${e.prop}[${l}].${t.prop}` : null,
-								required: t.required,
-								onBlur: () => C.onBlur(o, t),
-								onInput: (e) => C.onInput(o, e, t)
-							}), null, 16, [
-								"model-value",
-								"disabled",
-								"prop",
-								"required",
-								"onBlur",
-								"onInput"
-							])) : C.getCellType(o, t) === "checkbox1" ? (f(), r(I, u({
-								key: 1,
-								"wrap-col": !1,
-								"model-value": o[s.property]
-							}, { ref_for: !0 }, C.getInputAttr(o, t), {
-								disabled: C.isInputDisabled(o, t),
-								prop: e.prop ? `${e.prop}[${l}].${t.prop}` : null,
-								required: t.required,
-								onInput: (e) => C.onInput(o, e, t)
-							}), null, 16, [
-								"model-value",
-								"disabled",
-								"prop",
-								"required",
-								"onInput"
-							])) : C.getCellType(o, t) === "inputPhoneNumber" ? (f(), r(L, u({
-								key: 2,
-								"wrap-col": !1,
-								"model-value": o[s.property]
-							}, { ref_for: !0 }, C.getInputAttr(o, t), {
-								disabled: C.isInputDisabled(o, t),
-								prop: e.prop ? `${e.prop}[${l}].${t.prop}` : null,
-								required: t.required,
-								onInput: (e) => C.onInput(o, e, t)
-							}), null, 16, [
-								"model-value",
-								"disabled",
-								"prop",
-								"required",
-								"onInput"
-							])) : C.getCellType(o, t) === "user" ? (f(), a(n, { key: 3 }, [t.single ? (f(), r(R, u({
-								key: 0,
-								id: o[s.idProp || `${s.property}Id`],
-								"onUpdate:id": (e) => o[s.idProp || `${s.property}Id`] = e,
-								name: o[s.property],
-								"onUpdate:name": (e) => o[s.property] = e,
-								"wrap-col": !1
-							}, { ref_for: !0 }, C.getInputAttr(o, t), {
-								disabled: C.isInputDisabled(o, t),
-								prop: e.prop ? `${e.prop}[${l}].${t.prop}` : null,
-								required: t.required,
-								onInput: (e) => C.onInput(o, e, t)
-							}), null, 16, [
-								"id",
-								"onUpdate:id",
-								"name",
-								"onUpdate:name",
-								"disabled",
-								"prop",
-								"required",
-								"onInput"
-							])) : (f(), r(R, u({
-								key: 1,
-								"wrap-col": !1,
-								"model-value": o[s.property]
-							}, { ref_for: !0 }, C.getInputAttr(o, t), {
-								disabled: C.isInputDisabled(o, t),
-								prop: e.prop ? `${e.prop}[${l}].${t.prop}` : null,
-								required: t.required,
-								onInput: (e) => C.onInput(o, e, t)
-							}), null, 16, [
-								"model-value",
-								"disabled",
-								"prop",
-								"required",
-								"onInput"
-							]))], 64)) : C.getCellType(o, t) === "department" ? (f(), a(n, { key: 4 }, [t.single ? (f(), r(z, u({
-								key: 0,
-								name: o[s.property],
-								"onUpdate:name": (e) => o[s.property] = e,
-								"wrap-col": !1,
-								"ou-type": t.ouType
-							}, { ref_for: !0 }, C.getInputAttr(o, t), {
-								disabled: C.isInputDisabled(o, t),
-								prop: e.prop ? `${e.prop}[${l}].${t.prop}` : null,
-								required: t.required,
-								onInput: (e) => C.onInput(o, e, t)
-							}), null, 16, [
-								"name",
-								"onUpdate:name",
-								"ou-type",
-								"disabled",
-								"prop",
-								"required",
-								"onInput"
-							])) : (f(), r(z, u({
-								key: 1,
-								"wrap-col": !1,
-								"model-value": o[s.property]
-							}, { ref_for: !0 }, C.getInputAttr(o, t), {
-								disabled: C.isInputDisabled(o, t),
-								prop: e.prop ? `${e.prop}[${l}].${t.prop}` : null,
-								required: t.required,
-								onInput: (e) => C.onInput(o, e, t)
-							}), null, 16, [
-								"model-value",
-								"disabled",
-								"prop",
-								"required",
-								"onInput"
-							]))], 64)) : C.getCellType(o, t) === "select" ? (f(), r(B, u({
-								key: 5,
-								"wrap-col": !1,
-								"model-value": o[s.property]
-							}, { ref_for: !0 }, C.getInputAttr(o, t), {
-								disabled: C.isInputDisabled(o, t),
-								prop: e.prop ? `${e.prop}[${l}].${t.prop}` : null,
-								required: t.required,
-								onInput: (e) => C.onInput(o, e, t)
-							}), null, 16, [
-								"model-value",
-								"disabled",
-								"prop",
-								"required",
-								"onInput"
-							])) : C.getCellType(o, t) === "datePicker" ? (f(), r(V, u({
-								key: 6,
-								ref_for: !0
-							}, C.getInputAttr(o, t), {
-								start: o[t.start],
-								"onUpdate:start": (e) => o[t.start] = e,
-								end: o[t.end],
-								"onUpdate:end": (e) => o[t.end] = e,
-								"wrap-col": !1,
-								"model-value": o[s.property],
-								disabled: C.isInputDisabled(o, t),
-								prop: e.prop ? `${e.prop}[${l}].${t.prop}` : null,
-								required: t.required,
-								onInput: (e) => C.onInput(o, e, t)
-							}), null, 16, [
-								"start",
-								"onUpdate:start",
-								"end",
-								"onUpdate:end",
-								"model-value",
-								"disabled",
-								"prop",
-								"required",
-								"onInput"
-							])) : C.getCellType(o, t) === "cascader" ? (f(), r(H, u({
-								key: 7,
-								"wrap-col": !1,
-								value: o[s.property]
-							}, { ref_for: !0 }, C.getInputAttr(o, t), {
-								disabled: C.isInputDisabled(o, t),
-								prop: e.prop ? `${e.prop}[${l}].${t.prop}` : null,
-								required: t.required,
-								"label-key": t.labelKey,
-								"value-key": t.valueKey,
-								onInput: (e) => C.onInput(o, e, t)
-							}), null, 16, [
-								"value",
-								"disabled",
-								"prop",
-								"required",
-								"label-key",
-								"value-key",
-								"onInput"
-							])) : C.getCellType(o, t) === "checkbox" ? (f(), r(U, u({
-								key: 8,
-								"wrap-col": !1,
-								"model-value": o[s.property]
-							}, { ref_for: !0 }, C.getInputAttr(o, t), {
-								disabled: C.isInputDisabled(o, t),
-								prop: e.prop ? `${e.prop}[${l}].${t.prop}` : null,
-								required: t.required,
-								onInput: (e) => C.onInput(o, e, t)
-							}), null, 16, [
-								"model-value",
-								"disabled",
-								"prop",
-								"required",
-								"onInput"
-							])) : C.getCellType(o, t) === "number" ? (f(), r(W, u({
-								key: 9,
-								"wrap-col": !1,
-								"model-value": o[s.property]
-							}, { ref_for: !0 }, C.getInputAttr(o, t), {
-								disabled: C.isInputDisabled(o, t),
-								prop: e.prop ? `${e.prop}[${l}].${t.prop}` : null,
-								required: t.required,
-								onInput: (e) => C.onInput(o, e, t)
-							}), null, 16, [
-								"model-value",
-								"disabled",
-								"prop",
-								"required",
-								"onInput"
-							])) : i("v-if", !0)], 64)) : t.dictType || (d = t.options) != null && d.length ? (f(), r(G, {
-								key: 1,
-								"dict-type": t.dictType,
-								"id-as-value": t.idAsValue,
-								"label-as-value": t.labelAsValue,
-								column: s,
-								row: o,
-								options: t.options
-							}, null, 8, [
-								"dict-type",
-								"id-as-value",
-								"label-as-value",
-								"column",
-								"row",
-								"options"
-							])) : (f(), a(n, { key: 2 }, [c(g(C.getVal(o, s, t)), 1)], 64))];
-						})
-					]),
-					_: 2
-				}, 1032, [
-					"label",
-					"width",
-					"dict-type",
-					"clickable",
-					"align",
-					"prop",
-					"options",
-					"show-overflow-tooltip"
-				])) : t.slot ? (f(), a(n, { key: 1 }, [i("列自定义插槽,名字和 prop 不一致"), m(e.$slots, t.slot)], 2112)) : i("v-if", !0)], 64))), 256))]),
-				m(e.$slots, "handle", {
-					add: C.add,
-					remove: C.remove
-				}),
-				!C.inputDisabled && C.hasHandleMenus ? (f(), r(K, {
-					key: 0,
-					label: "操作",
-					width: "80",
-					align: "center",
-					prop: "menu"
-				}, {
-					header: v(({ column: t, $index: n }) => [m(e.$slots, "handle-column-header", {
-						column: t,
-						index: n
-					}, () => [c(g(t.label), 1)])]),
-					default: v(({ row: t, $index: n }) => {
-						var o, s, c;
-						return [(o = e.handleMenus) != null && o.includes("add") && ((s = e.modelValue) == null ? void 0 : s.length) < e.limit ? (f(), a("i", {
-							key: 0,
-							class: "el-icon-circle-plus sub-table-handle-button table-button-add",
-							style: {
-								"margin-right": "5px",
-								"font-size": "20px",
-								cursor: "pointer"
-							},
-							title: "添加",
-							onClick: y((e) => C.add(t, n), ["stop"])
-						}, null, 8, k)) : i("v-if", !0), (c = e.handleMenus) != null && c.includes("delete") ? (f(), r(q, {
-							key: 1,
-							class: "el-icon-error sub-table-handle-button table-button-remove",
-							title: "删除",
-							message: "您确定要删除该行吗？",
-							onClick: y((e) => C.remove(t, n), ["stop"])
-						}, null, 8, ["onClick"])) : i("v-if", !0)];
-					}),
-					_: 3
-				})) : i("v-if", !0)
-			]),
-			_: 2
-		}, [!C.inputDisabled || C.hasToolBarMenu ? {
-			name: "toolbar",
-			fn: v(() => [o("div", w, [m(e.$slots, "toolbar", {
-				addRow: C.addRow,
-				delRow: C.delRow,
-				refresh: C.refresh
-			}, () => [o("div", T, [m(e.$slots, "toolbar-left", {
-				addRow: C.addRow,
-				delRow: C.delRow,
-				refresh: C.refresh
-			}, () => {
-				var n, a, o;
-				return [
-					(n = e.toolbarMenus) != null && n.includes("add") ? (f(), r(N, {
-						key: 0,
-						size: "default",
-						class: "table-header-button add",
-						icon: "el-icon-circle-plus",
-						type: "text",
-						onClick: C.addRow
-					}, {
-						default: v(() => [...t[2] || (t[2] = [c(" 添加 ", -1)])]),
-						_: 1
-					}, 8, ["onClick"])) : i("v-if", !0),
-					(a = e.toolbarMenus) != null && a.includes("delete") ? (f(), r(P, {
-						key: 1,
-						size: "default",
-						disabled: S.selectedRows.length <= 0,
-						class: "table-header-button remove",
-						message: "您确定要删除选中的记录吗？",
-						icon: "el-icon-error",
-						type: "text",
-						onClick: C.delRow
-					}, {
-						default: v(() => [...t[3] || (t[3] = [c(" 删除 ", -1)])]),
-						_: 1
-					}, 8, ["disabled", "onClick"])) : i("v-if", !0),
-					(o = e.toolbarMenus) != null && o.includes("refresh") ? (f(), r(N, {
-						key: 2,
-						size: "default",
-						class: "table-header-button refresh",
-						icon: "el-icon-refresh-left",
-						type: "text",
-						disabled: !1,
-						onClick: C.refresh
-					}, {
-						default: v(() => [...t[4] || (t[4] = [c(" 刷新 ", -1)])]),
-						_: 1
-					}, 8, ["onClick"])) : i("v-if", !0)
-				];
-			}), m(e.$slots, "toolbar-left-append", {
-				addRow: C.addRow,
-				delRow: C.delRow,
-				refresh: C.refresh
-			})]), o("div", E, [m(e.$slots, "toolbar-right", {
-				removeSelectedRows: C.removeSelectedRows,
-				selectedRows: S.selectedRows
-			})])])])]),
-			key: "0"
-		} : void 0, e.bottomAddButton ? {
-			name: "empty",
-			fn: v(() => [o("i", {
-				class: "el-icon-circle-plus sub-table-handle-button table-button-add",
-				style: {
-					"font-size": "20px",
-					cursor: "pointer"
-				},
-				title: "添加",
-				onClick: t[0] || (t[0] = y((t) => {
-					var n;
-					return C.add(null, ((n = e.modelValue) == null ? void 0 : n.length) ?? 0);
-				}, ["stop"]))
-			})]),
-			key: "1"
-		} : void 0]), 1040, [
-			"data",
-			"api",
-			"show-summary",
-			"descs",
-			"ascs",
-			"page-size",
-			"selection-width",
-			"selection",
-			"index",
-			"onSelectionChange"
-		]),
-		i("底部添加按钮"),
-		!C.inputDisabled && e.bottomAddButton && ((j = e.modelValue) == null ? void 0 : j.length) < e.limit && ((M = e.modelValue) == null ? void 0 : M.length) > 0 ? (f(), a("div", A, [o("i", {
-			class: "el-icon-circle-plus sub-table-handle-button table-button-add",
-			style: {
-				"font-size": "20px",
-				cursor: "pointer"
-			},
-			title: "添加",
-			onClick: t[1] || (t[1] = y((t) => {
-				var n;
-				return C.add(null, ((n = e.modelValue) == null ? void 0 : n.length) ?? 0);
-			}, ["stop"]))
-		})])) : i("v-if", !0)
-	], 2);
-}
-var M = /* @__PURE__ */ e(C, [["render", j]]);
-//#endregion
-export { M as default };

package/sub-table-plus/style.css

@@ -1 +0,0 @@
-.sub-table-plus.hide-message .el-form-item__error{display:none}.sub-table-plus .pageable-table.auto-height .el-table{min-height:0}.sub-table-plus .el-form-item{width:100%;margin-bottom:0}.sub-table-plus .el-col{width:100%}.sub-table-plus .table-header{background-color:#f3f5fb;border:1px solid #dfe6ec;border-bottom:none;padding:2px 10px}.sub-table-plus .table-header-button:hover,.sub-table-plus .table-header-button:focus{color:#595959}.sub-table-plus .table-header-button i+span{margin-left:0}.sub-table-plus .table-header-button i{font-size:15px}.sub-table-plus .table-header-button.add i{color:#4886ec}.sub-table-plus .table-header-button.remove i{color:#e34e55}.sub-table-plus .table-header-button.refresh i{color:#1eb91e}.sub-table-plus .table-button-add{color:#5add7a;opacity:.8}.sub-table-plus .table-button-add:hover{opacity:1}.sub-table-plus .table-button-remove{color:#ddd}.sub-table-plus .table-button-remove:hover{color:#ef6666}.sub-table-plus .el-table__header-wrapper .el-table__header th{background-color:#f3f5fb;padding:5px 0}.sub-table-plus .el-table{border-top-color:#dde1e5}.sub-table-plus .el-table td{border-color:#dfe6ec}.sub-table-plus .el-col{padding:0!important}.sub-table-plus .row-indicator{border:6px solid #0000;border-bottom-color:#f5690c;width:0;height:0;display:inline-block;position:absolute;top:-6px;right:-6px;transform:rotate(45deg)}.sub-table-plus .sub-table-handle-button{cursor:pointer;font-size:20px}.sub-table-plus .sub-table-handle-button+.sub-table-handle-button{margin-left:5px}.sub-table-plus .el-table .el-table__header th{line-height:inherit;padding:5px 0;background:#f3f5fb!important}.sub-table-plus .form-item{padding-top:4px;padding-bottom:4px}