@web-utils/form-ui 1.0.0-beta0

package/base.css

@@ -0,0 +1 @@
+

package/chunks/B4M_TFeR.mjs

@@ -0,0 +1,152 @@
+import { ElCol as e, ElFormItem as t, ElTooltip as n } from "element-plus/es";
+import { computed as r, createVNode as i, h as a, inject as o, isVNode as s, nextTick as c, unref as l, useTemplateRef as u } from "vue";
+import { ElCol as d, rowContextKey as f } from "element-plus";
+//#region src/components/form/form-item.js
+var p = {
+	label: String,
+	prop: String,
+	required: Boolean,
+	rules: Array,
+	span: {
+		type: Number,
+		default: 12
+	},
+	block: Boolean,
+	formItemClass: String,
+	hideLabel: Boolean,
+	tips: { type: String },
+	tipsAfterLabel: {
+		type: Boolean,
+		default: !1
+	},
+	labelColspan: [Number, String],
+	inputColspan: [Number, String],
+	labelRowspan: [Number, String],
+	inputRowspan: [Number, String]
+}, m = (e) => {
+	let t = o("formHolder", null);
+	return r(() => e.required === !0 ? !0 : (t == null ? void 0 : t.requiredFieldsMap[e.prop]) === !0);
+}, h = (e, { rules: t } = {}) => {
+	let n = m(e);
+	return r(() => {
+		let r = {}, i = l(t);
+		return Object.keys(p).forEach((t) => {
+			t === "rules" ? e[t] && i ? r[t] = [...e[t], ...i] : e[t] ? r[t] = e[t] : i && (r[t] = i) : r[t] = e[t];
+		}), r.required = n.value, r;
+	});
+};
+//#endregion
+//#region src/components/form/FormItemX.vue?vue&type=script&lang.jsx
+function g(e) {
+	return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !s(e);
+}
+//#endregion
+//#region src/components/form/FormItemX.vue
+var _ = {
+	name: "FormItemX",
+	inheritAttrs: !1,
+	props: { ...p },
+	setup(a, { attrs: s, slots: l, expose: d }) {
+		let p = o(f, null), h = s.embed ? r(() => s.disabled) : b(a), _ = m(a), v = u("formItem"), y = r(() => !!p), x = r(() => {
+			if (h.value) return [];
+			if (_.value) {
+				let e = {
+					required: !0,
+					message: `请输入${a.label}`
+				};
+				return a.rules ? [...a.rules, e] : [e];
+			}
+			return a.rules;
+		});
+		return d({
+			clearValidate: async () => {
+				var e;
+				await c(), (e = v.value) == null || e.clearValidate();
+			},
+			validate: async () => {
+				var e;
+				await c(), (e = v.value) == null || e.validate();
+			}
+		}), () => {
+			let r = l.tips || a.tips, o = r ? i(n, {
+				effect: "light",
+				content: a.tips,
+				offset: 4
+			}, {
+				default: () => i("i", { class: "el-icon-info form-item-input-info" }, null),
+				content: l.tips ? l.tips : null
+			}) : null, s = i(t, {
+				ref: "formItem",
+				label: a.label,
+				class: [
+					"form-item",
+					a.formItemClass,
+					{
+						"form-item-hide-label": a.hideLabel,
+						"with-tips": !a.tipsAfterLabel && r,
+						required: h.value === !1 && _.value
+					}
+				],
+				prop: a.prop,
+				rules: x.value
+			}, {
+				...l,
+				default: () => {
+					var e;
+					return [(e = l.default) == null ? void 0 : e.call(l, {
+						disabled: h.value,
+						required: _.value
+					}), r && !a.tipsAfterLabel ? o : null];
+				},
+				label: () => [l.label ? l.label() : a.label, a.tipsAfterLabel ? o : null]
+			});
+			return y.value ? i(e, { span: a.block ? 24 : a.span }, g(s) ? s : { default: () => [s] }) : s;
+		};
+	}
+}, v = "update:modelValue", y = {
+	...p,
+	wrapFormItem: {
+		type: Boolean,
+		default: !0
+	},
+	disabled: {
+		type: Boolean,
+		default: void 0
+	},
+	col: Boolean
+}, b = (e) => {
+	let t = o("formHolder", null), n = o("formItemGroup", null);
+	return r(() => {
+		if (e.disabled !== void 0) return e.disabled;
+		if (t) {
+			if (t.requiredFieldsMap[e.prop] === !0 || t.enabledFieldsMap[e.prop] === !0) return !1;
+			if (t.disabledFieldsMap[e.prop] === !0) return !0;
+		}
+		return (n == null ? void 0 : n.enabled) === !0 ? !1 : (n == null ? void 0 : n.disabled) === !0 ? !0 : (t == null ? void 0 : t.disabled) === !0;
+	});
+}, x = [v], S = (e, t) => e(v, t), C = (e, { vNodes: t, formItemProps: n, slots: r, disabled: i }) => e.wrapFormItem ? a(_, {
+	...n.value,
+	embed: !0,
+	disabled: i == null ? void 0 : i.value
+}, {
+	default: () => t,
+	label: r.label,
+	error: r.error,
+	tips: r.tips
+}) : t, w = (e, { emit: t, slots: n, rules: i }) => {
+	let o = h(e, { rules: i }), s = b(e), c = (e) => S(t, e), l = (t) => e.col ? a(d, { span: e.block ? 24 : e.span }, { default: () => t }) : t;
+	return {
+		emitInput: c,
+		render: ({ vNodes: t }) => C(e, {
+			vNodes: l(t),
+			formItemProps: o,
+			slots: n,
+			disabled: s
+		}),
+		placeholder: r(() => s.value ? "" : `请输入${e.label}`),
+		disabled: s,
+		formItemProps: o
+	};
+};
+//#endregion
+export { w as a, S as i, y as n, _ as o, C as r, h as s, x as t };

package/chunks/B5BIQCcK.mjs

@@ -0,0 +1,149 @@
+import e from "../form-advice/index.mjs";
+import t from "../form-red-table/index.mjs";
+import { ElForm as n, ElRow as r } from "element-plus/es";
+import { computed as i, createVNode as a, inject as o, nextTick as s, provide as c, reactive as l, useTemplateRef as u, watch as d } from "vue";
+import { animate as f } from "@web-utils/core";
+//#endregion
+//#region src/components/form/FormHolder.vue
+var p = {
+	name: "FormHolder",
+	inheritAttrs: !1,
+	props: {
+		model: Object,
+		size: String,
+		disabled: {
+			type: Boolean,
+			default: void 0
+		},
+		labelPosition: {
+			type: String,
+			default: "right"
+		},
+		labelWidth: {
+			type: [String, Number],
+			default: "auto"
+		},
+		required: {
+			type: Boolean,
+			default: !0
+		},
+		requiredFields: Array,
+		disabledFields: Array,
+		enabledFields: Array,
+		showAdvice: {
+			type: Boolean,
+			default: !0
+		},
+		columns: [Array, Object],
+		colCount: Number,
+		notTableForm: {
+			type: Boolean,
+			default: void 0
+		},
+		commentValueColspan: Number,
+		commentLabelColspan: Number,
+		showMessage: {
+			type: Boolean,
+			default: !0
+		},
+		wrapRow: {
+			type: Boolean,
+			default: !0
+		}
+	},
+	setup(p, { slots: m, expose: h }) {
+		let g = o("formView", null), _ = u("form"), v = i(() => p.notTableForm === void 0 ? (g == null ? void 0 : g.tableForm) === void 0 ? !1 : g == null ? void 0 : g.tableForm : !p.notTableForm), y = i(() => v.value ? !1 : p.showMessage), b = i(() => {
+			let e = {};
+			return p.disabledFields && p.disabledFields.forEach((t) => {
+				e[t] = !0;
+			}), e;
+		}), x = i(() => {
+			let e = {};
+			return p.enabledFields && p.enabledFields.length && p.enabledFields.forEach((t) => {
+				e[t] = !0;
+			}), e;
+		}), S = i(() => {
+			let e = {};
+			return p.requiredFields && p.requiredFields.length && p.requiredFields.forEach((t) => {
+				e[t] = !0;
+			}), e;
+		}), C = i(() => p.disabled === !0 ? !0 : p.disabled), w = i(() => p.enabledFields), T = i(() => p.requiredFields), E = i(() => p.disabledFields), D = async () => {
+			await s();
+			let e = _.value.$el.querySelector(".el-form-item.is-error");
+			e && e.scrollIntoView({
+				block: "center",
+				inline: "center",
+				behavior: "smooth"
+			});
+		}, O = async () => {
+			try {
+				return await _.value.validate();
+			} catch {
+				throw await D(), _.value.$el.querySelectorAll(".el-form-item.is-error .el-form-item__content > :first-child").forEach((e) => {
+					f(e, "breathe-animation");
+				}), Error("表单验证不通过!");
+			}
+		}, k = (e) => _.value.validateField(e), A = (e) => _.value.resetFields(e), j = (e) => _.value.scrollToField(e), M = (e) => _.value.clearValidate(e), N = () => _.value.getField(), P = (e) => _.value.setInitialValues(e), F = () => _.value.fields;
+		d(() => p.required, () => {
+			M();
+		});
+		let I = l({
+			tableForm: v,
+			disabled: C,
+			enabledFields: w,
+			requiredFields: T,
+			enabledFieldsMap: x,
+			disabledFieldsMap: b,
+			requiredFieldsMap: S,
+			disabledFields: E,
+			scrollIntoRequiredField: D,
+			formRef: _,
+			validate: O,
+			validateField: k,
+			resetFields: A,
+			scrollToField: j,
+			clearValidate: M,
+			getField: N,
+			setInitialValues: P,
+			getFields: F
+		});
+		return c("formHolder", I), h(I), () => a(n, {
+			ref: "form",
+			class: "form-holder",
+			model: p.model,
+			size: p.size,
+			"show-message": y.value,
+			disabled: p.disabled,
+			"label-width": p.labelWidth,
+			"label-position": p.labelPosition
+		}, { default: () => {
+			if (v.value) {
+				var n, i, o;
+				return [
+					(n = m.top) == null ? void 0 : n.call(m),
+					a(t, {
+						class: { "hide-error-message": v },
+						columns: p.columns,
+						"col-count": p.colCount
+					}, { default: () => {
+						var t;
+						return [(t = m.default) == null ? void 0 : t.call(m), p.showAdvice ? a(e, {
+							"label-colspan": p.commentLabelColspan,
+							"value-colspan": p.commentValueColspan
+						}, null) : null];
+					} }),
+					(i = m.bottom) == null ? void 0 : i.call(m),
+					a("div", { class: "red-form-footer" }, [(o = m.footer) == null ? void 0 : o.call(m)])
+				];
+			} else {
+				var s;
+				return p.wrapRow ? a(r, null, { default: () => {
+					var e;
+					return [(e = m.default) == null ? void 0 : e.call(m)];
+				} }) : (s = m.default) == null ? void 0 : s.call(m);
+			}
+		} });
+	}
+};
+//#endregion
+export { p as t };

package/chunks/BHNKrW1j.mjs

@@ -0,0 +1,61 @@
+import { a as e, n as t, t as n } from "./B4M_TFeR.mjs";
+import { ElInput as r } from "element-plus/es";
+import { computed as i, createVNode as a } from "vue";
+import { validatePhoneNum as o } from "@web-utils/core";
+//#region src/util/form-validate.js
+var s = (e, t, n) => t && !/^[A-Za-z0-9\u4e00-\u9fa5_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(t) ? n(/* @__PURE__ */ Error("invalid")) : n();
+function c(e, t, n) {
+	t && !/^[1-9][0-9]{5}(18|19|(2[0-9]))[0-9]{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)[0-9]{3}[0-9Xx]$/.test(t) ? n(/* @__PURE__ */ Error("invalid")) : n();
+}
+//#endregion
+//#region src/components/form/FormInput.vue
+var l = {
+	name: "FormInput",
+	inheritAttrs: !1,
+	props: {
+		...t,
+		modelValue: String,
+		type: String,
+		rows: Number,
+		prepend: String,
+		append: String,
+		prefix: String,
+		suffix: String
+	},
+	emits: [...n],
+	setup(t, { emit: n, slots: l }) {
+		let u = `请输入正确的${t.label}！`, { emitInput: d, render: f, placeholder: p, disabled: m } = e(t, {
+			emit: n,
+			slots: l,
+			rules: i(() => {
+				if (!t.type || t.type === "textarea") return null;
+				let e = {
+					message: u,
+					trigger: "blur"
+				};
+				if (t.type === "email") e.validator = s;
+				else if (t.type === "idcard") e.validator = c;
+				else if (t.type === "phone") e.validator = o;
+				else return null;
+				return [e];
+			})
+		});
+		return () => f({ vNodes: a(r, {
+			modelValue: t.modelValue,
+			type: t.type,
+			clearable: !0,
+			rows: t.rows,
+			disabled: m.value,
+			"onUpdate:modelValue": d,
+			placeholder: p.value
+		}, {
+			prefix: l.prefix || t.prefix ? () => t.prefix : null,
+			suffix: l.suffix || t.suffix ? () => t.suffix : null,
+			"password-icon": l["password-icon"],
+			prepend: l.prepend || t.prepend ? () => t.prepend : null,
+			append: l.append || t.append ? () => t.append : null
+		}) });
+	}
+};
+//#endregion
+export { l as t };

package/chunks/BO9jWhBl.mjs

@@ -0,0 +1,46 @@
+import { a as e, n as t, t as n } from "./B4M_TFeR.mjs";
+import { ElRadio as r, ElRadioGroup as i } from "element-plus/es";
+import { createVNode as a, isVNode as o } from "vue";
+//#region src/components/form/FormRadioGroup.vue?vue&type=script&lang.jsx
+function s(e) {
+	return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !o(e);
+}
+//#endregion
+//#region src/components/form/FormRadioGroup.vue
+var c = {
+	name: "FormRadioGroup",
+	inheritAttrs: !1,
+	props: {
+		...t,
+		modelValue: [
+			String,
+			Number,
+			Boolean
+		],
+		options: Array
+	},
+	emits: [...n],
+	setup(t, { emit: n, slots: o }) {
+		let { emitInput: c, render: l, placeholder: u, disabled: d } = e(t, {
+			emit: n,
+			slots: o
+		});
+		return () => l({ vNodes: a(i, {
+			modelValue: t.modelValue,
+			disabled: d.value,
+			"onUpdate:modelValue": c,
+			placeholder: u.value
+		}, {
+			...o,
+			default: o.default || (() => {
+				var e;
+				return (e = t.options) == null ? void 0 : e.map(({ value: e, label: t }) => a(r, {
+					key: e,
+					value: e
+				}, s(t) ? t : { default: () => [t] }));
+			})
+		}) });
+	}
+};
+//#endregion
+export { c as t };

package/chunks/BZ8aOa78.mjs

@@ -0,0 +1,35 @@
+import { n as e, r as t, s as n } from "./B4M_TFeR.mjs";
+import { ElImage as r } from "element-plus/es";
+import { createVNode as i, isVNode as a } from "vue";
+//#region src/components/form/FormImage.vue?vue&type=script&lang.jsx
+function o(e) {
+	return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !a(e);
+}
+//#endregion
+//#region src/components/form/FormImage.vue
+var s = {
+	name: "FormImage",
+	inheritAttrs: !1,
+	props: {
+		...e,
+		src: String,
+		fit: String,
+		hideOnClickModal: Boolean
+	},
+	setup(e, { slots: a, attrs: s }) {
+		let c = n(e);
+		return () => t(e, {
+			vNodes: i(r, {
+				src: e.src,
+				fit: e.fit,
+				"preview-src-list": [e.src],
+				"hide-on-click-modal": e.hideOnClickModal,
+				style: s.style
+			}, o(a) ? a : { default: () => [a] }),
+			formItemProps: c,
+			slots: a
+		});
+	}
+};
+//#endregion
+export { s as t };

package/chunks/Bsz7y4Xp.mjs

@@ -0,0 +1,73 @@
+import { a as e, n as t, t as n } from "./B4M_TFeR.mjs";
+import { ElDatePicker as r } from "element-plus/es";
+import { computed as i, createVNode as a } from "vue";
+//#endregion
+//#region src/components/form/FormDatePicker.vue
+var o = {
+	name: "FormDatePicker",
+	inheritAttrs: !1,
+	props: {
+		...t,
+		modelValue: [
+			String,
+			Number,
+			Date,
+			Array
+		],
+		type: {
+			type: String,
+			default: "date"
+		},
+		unlinkPanels: {
+			type: Boolean,
+			default: !0
+		},
+		split: Boolean,
+		startDate: String,
+		endDate: String
+	},
+	emits: [
+		...n,
+		"update:startDate",
+		"update:endDate"
+	],
+	setup(t, { emit: n, slots: o }) {
+		let { emitInput: s, render: c, placeholder: l, disabled: u } = e(t, {
+			emit: n,
+			slots: o
+		}), d = i(() => {
+			switch (t.type) {
+				case "date":
+				case "daterange": return "YYYY-MM-DD";
+				case "datetime":
+				case "datetimerange": return "YYYY-MM-DD HH:mm:ss";
+				default: return "";
+			}
+		}), f = i(() => t.split && t.type.indexOf("range") > -1), p = (e, t) => {
+			n("update:startDate", e), n("update:endDate", t);
+		}, m = (e) => {
+			f.value ? e ? p(e[0], e[1]) : p(null, null) : s(e);
+		}, h = i(() => f.value ? [t.startDate, t.endDate] : t.modelValue);
+		return () => c({ vNodes: a(r, {
+			style: "width: 100%",
+			clearable: !0,
+			modelValue: h.value,
+			type: t.type,
+			unlinkPanels: t.unlinkPanels,
+			disabled: u.value,
+			"onUpdate:modelValue": m,
+			format: d.value,
+			"value-format": d.value,
+			placeholder: l.value
+		}, {
+			default: o.default,
+			"range-separator": o["range-separator"],
+			"pre-month": o["pre-month"],
+			"next-month": o["next-month"],
+			"pre-year": o["pre-year"],
+			"next-year": o["next-year"]
+		}) });
+	}
+};
+//#endregion
+export { o as t };

package/chunks/Bxj372sF.mjs

@@ -0,0 +1,53 @@
+import { a as e, n as t, t as n } from "./B4M_TFeR.mjs";
+import { ElCheckbox as r, ElCheckboxGroup as i } from "element-plus/es";
+import { computed as a, createVNode as o, isVNode as s } from "vue";
+//#region src/components/form/FormCheckBoxGroup.vue?vue&type=script&lang.jsx
+function c(e) {
+	return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !s(e);
+}
+//#endregion
+//#region src/components/form/FormCheckBoxGroup.vue
+var l = {
+	name: "FormCheckBoxGroup",
+	inheritAttrs: !1,
+	props: {
+		...t,
+		modelValue: [Array, String],
+		options: Array,
+		stringMode: Boolean,
+		delimiter: {
+			type: String,
+			default: ","
+		}
+	},
+	emits: [...n],
+	setup(t, { emit: n, slots: s }) {
+		let { emitInput: l, render: u, placeholder: d, disabled: f } = e(t, {
+			emit: n,
+			slots: s
+		}), p = (e) => l(t.stringMode ? e.join(t.delimiter) : e), m = a(() => {
+			if (t.stringMode) {
+				var e;
+				return Array.isArray(t.modelValue) ? t.modelValue.filter((e) => e) : ((e = t.modelValue) == null ? void 0 : e.split(t.delimiter).filter((e) => e)) ?? [];
+			}
+			return t.modelValue || [];
+		});
+		return () => u({ vNodes: o(i, {
+			modelValue: m.value,
+			disabled: f.value,
+			"onUpdate:modelValue": p,
+			placeholder: d.value
+		}, {
+			...s,
+			default: s.default || (() => {
+				var e;
+				return (e = t.options) == null ? void 0 : e.map(({ value: e, label: t }) => o(r, {
+					key: e,
+					value: e
+				}, c(t) ? t : { default: () => [t] }));
+			})
+		}) });
+	}
+};
+//#endregion
+export { l as t };

package/chunks/C33EmJN8.mjs

@@ -0,0 +1,32 @@
+import { a as e, n as t, t as n } from "./B4M_TFeR.mjs";
+import { ElSlider as r } from "element-plus/es";
+import { createVNode as i, isVNode as a } from "vue";
+//#region src/components/form/FormSlider.vue?vue&type=script&lang.jsx
+function o(e) {
+	return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !a(e);
+}
+//#endregion
+//#region src/components/form/FormSlider.vue
+var s = {
+	name: "FormSlider",
+	inheritAttrs: !1,
+	props: {
+		...t,
+		modelValue: [Number, Array]
+	},
+	emits: [...n],
+	setup(t, { emit: n, slots: a }) {
+		let { emitInput: s, render: c, disabled: l } = e(t, {
+			emit: n,
+			slots: a
+		});
+		return () => c({ vNodes: i(r, {
+			modelValue: t.modelValue,
+			clearable: !0,
+			disabled: l.value,
+			"onUpdate:modelValue": s
+		}, o(a) ? a : { default: () => [a] }) });
+	}
+};
+//#endregion
+export { s as t };

package/chunks/C6Li3-l7.mjs

@@ -0,0 +1,28 @@
+import { i as e, n as t, t as n } from "./B4M_TFeR.mjs";
+import { t as r } from "./BHNKrW1j.mjs";
+import { createVNode as i, isVNode as a, mergeProps as o } from "vue";
+//#region src/components/form/FormInputEmail.vue?vue&type=script&lang.jsx
+function s(e) {
+	return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !a(e);
+}
+//#endregion
+//#region src/components/form/FormInputEmail.vue
+var c = {
+	name: "FormInputEmail",
+	inheritAttrs: !1,
+	props: {
+		...t,
+		modelValue: String
+	},
+	emits: [...n],
+	setup(t, { emit: n, slots: a }) {
+		let c = (t) => e(n, t);
+		return () => i(r, o(t, {
+			modelValue: t.modelValue,
+			type: "email",
+			"onUpdate:modelValue": c
+		}), s(a) ? a : { default: () => [a] });
+	}
+};
+//#endregion
+export { c as t };

package/chunks/CBcdalMX.mjs

@@ -0,0 +1,35 @@
+import { a as e, n as t, t as n } from "./B4M_TFeR.mjs";
+import { ElCheckbox as r } from "element-plus/es";
+import { createVNode as i } from "vue";
+//#endregion
+//#region src/components/form/FormCheckbox.vue
+var a = {
+	name: "FormCheckbox",
+	inheritAttrs: !1,
+	props: {
+		...t,
+		modelValue: [
+			String,
+			Number,
+			Boolean
+		],
+		value: String,
+		label: String
+	},
+	emits: [...n],
+	setup(t, { emit: n, slots: a }) {
+		let { emitInput: o, render: s, disabled: c } = e(t, {
+			emit: n,
+			slots: a
+		});
+		return () => s({ vNodes: i(r, {
+			modelValue: t.modelValue,
+			value: t.value,
+			label: t.label,
+			disabled: c.value,
+			"onUpdate:modelValue": o
+		}, { default: a.default }) });
+	}
+};
+//#endregion
+export { a as t };