@web-utils/form-ui 1.0.0-beta9 → 1.0.0-beta90

package/page-index/index.d.ts

@@ -0,0 +1,82 @@
+declare const _default: import('vue').DefineComponent<globalThis.ExtractPropTypes<{
+    menus: {
+        type: ArrayConstructor;
+        default: () => never[];
+    };
+    asideWidth: {
+        type: StringConstructor;
+        default: string;
+    };
+    aside: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    tips: {
+        type: StringConstructor;
+        default: string;
+    };
+    sectionTitle: {
+        type: StringConstructor;
+        default: string;
+    };
+    schema: {
+        type: StringConstructor;
+        default: string;
+    };
+    currentTreeKey: {
+        type: ArrayConstructor;
+        default: () => never[];
+    };
+    defaultProps: {
+        type: ObjectConstructor;
+        default: () => {};
+    };
+}>, {}, {}, {}, {
+    activeFirstMenu(): Promise<void>;
+    onNodeClick(node: any): Promise<void>;
+    setCurrentKey(path: any): Promise<void>;
+    beforeRouteUpdate(to: any, from: any, next: any): Promise<void>;
+}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<globalThis.ExtractPropTypes<{
+    menus: {
+        type: ArrayConstructor;
+        default: () => never[];
+    };
+    asideWidth: {
+        type: StringConstructor;
+        default: string;
+    };
+    aside: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    tips: {
+        type: StringConstructor;
+        default: string;
+    };
+    sectionTitle: {
+        type: StringConstructor;
+        default: string;
+    };
+    schema: {
+        type: StringConstructor;
+        default: string;
+    };
+    currentTreeKey: {
+        type: ArrayConstructor;
+        default: () => never[];
+    };
+    defaultProps: {
+        type: ObjectConstructor;
+        default: () => {};
+    };
+}>> & Readonly<{}>, {
+    aside: boolean;
+    tips: string;
+    menus: unknown[];
+    asideWidth: string;
+    sectionTitle: string;
+    schema: string;
+    currentTreeKey: unknown[];
+    defaultProps: Record<string, any>;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/page-index/index.mjs

@@ -0,0 +1,124 @@
+import { t as e } from "../chunks/B1MSrc6f.mjs";
+import { ElTree as t } from "element-plus/es";
+import "element-plus/es/components/base/style/css";
+import { createCommentVNode as n, createElementBlock as r, createElementVNode as i, createTextVNode as a, createVNode as o, normalizeClass as s, normalizeStyle as c, openBlock as l, renderSlot as u, toDisplayString as d, withCtx as f } from "vue";
+import { findFirstMatchNode as p, treeToArray as m } from "@web-utils/core";
+import "element-plus/es/components/tree/style/css";
+//#region src/components/page/PageIndex.vue
+var h = {
+	name: "PageIndex",
+	props: {
+		menus: {
+			type: Array,
+			default: () => []
+		},
+		asideWidth: {
+			type: String,
+			default: "220px"
+		},
+		aside: {
+			type: Boolean,
+			default: !0
+		},
+		tips: {
+			type: String,
+			default: "请添加页面内容！"
+		},
+		sectionTitle: {
+			type: String,
+			default: "功能导航"
+		},
+		schema: {
+			type: String,
+			default: ""
+		},
+		currentTreeKey: {
+			type: Array,
+			default: () => []
+		},
+		defaultProps: {
+			type: Object,
+			default: () => ({})
+		}
+	},
+	watch: { menus() {
+		this.setCurrentKey(this.$route.path);
+	} },
+	mounted() {
+		this.activeFirstMenu();
+	},
+	activated() {
+		this.setCurrentKey(this.$route.path);
+	},
+	methods: {
+		async activeFirstMenu() {
+			if (m(this.menus).map((e) => e.path).filter((e) => e).includes(this.$route.path)) await this.setCurrentKey(this.$route.path);
+			else {
+				let e = p(this.menus, (e) => e.path);
+				e && (await this.$router.push({
+					path: e.path,
+					query: e.query
+				}), await this.setCurrentKey(e.path));
+			}
+		},
+		async onNodeClick(e) {
+			e.path && e.path.indexOf("/") > -1 && await this.$router.push({
+				path: e.path,
+				query: e.query
+			}), await this.setCurrentKey(e.key);
+		},
+		async setCurrentKey(e) {
+			var t;
+			await this.$nextTick(), (t = this.$refs.menuTree) == null || t.setCurrentKey(e);
+		},
+		async beforeRouteUpdate(e, t, n) {
+			if (e.path === this.schema) {
+				let e = p(this.menus, (e) => e.path);
+				e ? (await n({
+					path: e.path,
+					query: e.query
+				}), await this.setCurrentKey(e.path)) : await n(!1);
+			} else await n(), await this.setCurrentKey(this.$route.path);
+		}
+	}
+}, g = { class: "egd-container" }, _ = { class: "egd-main" }, v = { class: "egd-header" }, y = { class: "section-title flex-not-shrink" }, b = { class: "page-index-content-empty" };
+function x(e, p, m, h, x, S) {
+	let C = t;
+	return l(), r("div", g, [m.aside ? (l(), r("div", {
+		key: 0,
+		class: "egd-aside",
+		style: c({ width: m.asideWidth })
+	}, [n("侧栏"), u(e.$slots, "aside", {}, () => [i("div", _, [
+		u(e.$slots, "nav-top"),
+		i("div", v, [i("span", y, d(m.sectionTitle), 1)]),
+		n("菜单"),
+		u(e.$slots, "menu", {}, () => [o(C, {
+			ref: "menuTree",
+			data: m.menus,
+			"default-expand-all": "",
+			props: m.defaultProps,
+			"highlight-current": "",
+			"empty-text": "请配置菜单！",
+			"default-expanded-keys": m.currentTreeKey,
+			"node-key": "key",
+			onNodeClick: S.onNodeClick
+		}, {
+			default: f(({ data: t, node: n }) => [u(e.$slots, "tree-node", {
+				data: t,
+				node: n
+			}, () => [i("span", null, [i("i", { class: s(t.icon) }, null, 2), a(" " + d(t.label), 1)])])]),
+			_: 3
+		}, 8, [
+			"data",
+			"props",
+			"default-expanded-keys",
+			"onNodeClick"
+		])])
+	])])], 4)) : n("v-if", !0), i("div", {
+		class: "page-index-content",
+		style: c({ width: m.aside ? `calc(100% - ${m.asideWidth})` : "100%" })
+	}, [n("内容"), u(e.$slots, "default", {}, () => [i("div", b, d(m.tips), 1)])], 4)]);
+}
+var S = /* @__PURE__ */ e(h, [["render", x]]);
+//#endregion
+export { S as default };

package/page-index/style.css

@@ -0,0 +1 @@
+.page-index-content{flex-direction:column;flex:auto;height:100%;padding:0;display:flex;overflow:hidden}.page-index-content-empty{color:gray;justify-content:center;align-items:center;width:100%;height:100%;font-size:20px;display:flex}

package/page-index-top/index.d.ts

@@ -0,0 +1,38 @@
+declare const _default: import('vue').DefineComponent<globalThis.ExtractPropTypes<{
+    menus: {
+        type: ArrayConstructor;
+        default: () => never[];
+    };
+    tips: {
+        type: StringConstructor;
+        default: string;
+    };
+    schema: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, {}, {
+    activeTab: string;
+}, {}, {
+    activeFirstMenu(): Promise<void>;
+    tabClick(tab: any): Promise<void>;
+    beforeRouteUpdate(to: any, from: any, next: any): Promise<void>;
+}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<globalThis.ExtractPropTypes<{
+    menus: {
+        type: ArrayConstructor;
+        default: () => never[];
+    };
+    tips: {
+        type: StringConstructor;
+        default: string;
+    };
+    schema: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    tips: string;
+    menus: unknown[];
+    schema: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/page-index-top/index.mjs

@@ -0,0 +1,87 @@
+import { t as e } from "../chunks/B1MSrc6f.mjs";
+import t from "../empty-view/index.mjs";
+import n from "../page-header/index.mjs";
+import r from "../page-skeleton/index.mjs";
+import { ElTabPane as i, ElTabs as a } from "element-plus/es";
+import "element-plus/es/components/base/style/css";
+import { Fragment as o, createBlock as s, createElementBlock as c, createVNode as l, openBlock as u, renderList as d, renderSlot as f, withCtx as p } from "vue";
+import { findFirstMatchNode as m, treeToArray as h } from "@web-utils/core";
+import "element-plus/es/components/tabs/style/css";
+import "element-plus/es/components/tab-pane/style/css";
+//#region src/components/page/PageIndexTop.vue
+var g = {
+	name: "PageIndexTop",
+	props: {
+		menus: {
+			type: Array,
+			default: () => []
+		},
+		tips: {
+			type: String,
+			default: "请添加页面内容！"
+		},
+		schema: {
+			type: String,
+			default: ""
+		}
+	},
+	data() {
+		return { activeTab: "" };
+	},
+	watch: { menus: "activeFirstMenu" },
+	mounted() {
+		this.activeFirstMenu();
+	},
+	methods: {
+		async activeFirstMenu() {
+			if (h(this.menus).map((e) => e.path).filter((e) => e).includes(this.$route.path)) this.activeTab = this.$route.path;
+			else {
+				let e = m(this.menus, (e) => e.path);
+				e && (this.activeTab = e.path, await this.$router.push({
+					path: e.path,
+					query: e.query
+				}));
+			}
+		},
+		async tabClick(e) {
+			await this.$router.push(e.name);
+		},
+		async beforeRouteUpdate(e, t, n) {
+			if (e.path === this.schema) {
+				let e = m(this.menus, (e) => e.path);
+				e ? (await n({
+					path: e.path,
+					query: e.query
+				}), this.activeTab = e.path) : await n(!1);
+			} else await n();
+		}
+	}
+};
+function _(e, m, h, g, _, v) {
+	let y = i, b = a, x = n, S = t, C = r;
+	return h.menus && h.menus.length ? (u(), s(C, { key: 0 }, {
+		header: p(() => [l(x, null, {
+			"section-title": p(() => [l(b, {
+				modelValue: _.activeTab,
+				"onUpdate:modelValue": m[0] || (m[0] = (e) => _.activeTab = e),
+				onTabClick: v.tabClick
+			}, {
+				default: p(() => [(u(!0), c(o, null, d(h.menus, (e) => (u(), s(y, {
+					key: e.path,
+					label: e.label,
+					name: `${e.path}`
+				}, null, 8, ["label", "name"]))), 128))]),
+				_: 1
+			}, 8, ["modelValue", "onTabClick"])]),
+			_: 1
+		})]),
+		default: p(() => [f(e.$slots, "default", {}, () => [l(S, { "empty-tips": h.tips }, null, 8, ["empty-tips"])])]),
+		_: 3
+	})) : (u(), s(S, {
+		key: 1,
+		"empty-tips": "暂无权限！"
+	}));
+}
+var v = /* @__PURE__ */ e(g, [["render", _]]);
+//#endregion
+export { v as default };

package/page-skeleton/index.d.ts

@@ -0,0 +1,30 @@
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & (new () => {
+    $slots: S;
+});
+declare const __VLS_component: import('vue').DefineComponent<{}, {
+    header: boolean;
+    flexRow: boolean;
+    flexColumn: boolean;
+    contentScroll: boolean;
+    title?: string | undefined;
+    contentClass?: string | undefined;
+    $props: {
+        readonly header?: boolean | undefined;
+        readonly flexRow?: boolean | undefined;
+        readonly flexColumn?: boolean | undefined;
+        readonly contentScroll?: boolean | undefined;
+        readonly title?: string | undefined;
+        readonly contentClass?: string | undefined;
+    };
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+type __VLS_TemplateResult = {
+    attrs: Partial<{}>;
+    slots: {
+        header?(_: {}): any;
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};

package/page-skeleton/index.mjs

@@ -0,0 +1,44 @@
+import e from "../nav-bar/index.mjs";
+import t from "../page/index.mjs";
+import n from "../page-header/index.mjs";
+import { createBlock as r, createCommentVNode as i, createElementVNode as a, normalizeClass as o, openBlock as s, renderSlot as c, withCtx as l } from "vue";
+//#region src/components/page/PageSkeleton.vue
+var u = /* @__PURE__ */ Object.assign({ name: "PageSkeleton" }, {
+	__name: "PageSkeleton",
+	props: {
+		title: String,
+		flexColumn: Boolean,
+		flexRow: Boolean,
+		header: {
+			type: Boolean,
+			default: !0
+		},
+		contentClass: String,
+		contentScroll: {
+			type: Boolean,
+			default: !0
+		}
+	},
+	setup(u) {
+		return (d, f) => {
+			let p = n, m = e, h = t;
+			return s(), r(h, { class: "page-skeleton" }, {
+				default: l(() => [u.header ? c(d.$slots, "header", { key: 0 }, () => [u.title ? (s(), r(p, {
+					key: 0,
+					title: u.title
+				}, null, 8, ["title"])) : (s(), r(m, { key: 1 }))]) : i("v-if", !0), a("div", { class: o([
+					"page-content",
+					{
+						"flex-column": u.flexColumn,
+						"flex-row": u.flexRow,
+						"content-scroll": u.contentScroll
+					},
+					u.contentClass
+				]) }, [c(d.$slots, "default")], 2)]),
+				_: 3
+			});
+		};
+	}
+});
+//#endregion
+export { u as default };

package/page-skeleton/style.css

@@ -0,0 +1 @@
+.page-skeleton .page-content{flex:auto;width:100%;height:100%;position:relative}.page-skeleton .page-content.content-scroll{overflow:auto}.page-skeleton .page-content.flex-column{flex-direction:column;height:0;display:flex}.page-skeleton .page-content.flex-row{display:flex}

package/page-skeleton-new/index.d.ts

@@ -0,0 +1,34 @@
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & (new () => {
+    $slots: S;
+});
+declare const __VLS_component: import('vue').DefineComponent<{}, {
+    header: boolean;
+    title: string;
+    flexRow: boolean;
+    flexColumn: boolean;
+    contentScroll: boolean;
+    sidebarWidth: string;
+    contentClass?: string | undefined;
+    $props: {
+        readonly header?: boolean | undefined;
+        readonly title?: string | undefined;
+        readonly flexRow?: boolean | undefined;
+        readonly flexColumn?: boolean | undefined;
+        readonly contentScroll?: boolean | undefined;
+        readonly sidebarWidth?: string | undefined;
+        readonly contentClass?: string | undefined;
+    };
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+type __VLS_TemplateResult = {
+    attrs: Partial<{}>;
+    slots: {
+        'sidebar-content'?(_: {}): any;
+        'header-left'?(_: {}): any;
+        'header-right'?(_: {}): any;
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};

package/page-skeleton-new/index.mjs

@@ -0,0 +1,80 @@
+import e from "../page/index.mjs";
+import { createBlock as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, createTextVNode as a, normalizeClass as o, normalizeStyle as s, openBlock as c, renderSlot as l, toDisplayString as u, withCtx as d } from "vue";
+//#region src/components/page/PageSkeletonNew.vue
+var f = {
+	key: 0,
+	class: "page-skeleton-new-header",
+	style: { "margin-right": "0" }
+}, p = { class: "section-title" }, m = {
+	class: "flex-item",
+	style: { "border-right": "1px solid #eee" }
+}, h = {
+	key: 0,
+	class: "page-skeleton-new-header",
+	style: {
+		"margin-left": "0",
+		"padding-left": "10px"
+	}
+}, g = { class: "flex-item flex-row vertical-center" }, _ = { class: "flex-item flex-row vertical-center" }, v = { class: /* @__PURE__ */ o([
+	"flex-row",
+	"flex-item",
+	"vertical-center",
+	"align-end"
+]) }, y = /* @__PURE__ */ Object.assign({ name: "PageSkeletonNew" }, {
+	__name: "PageSkeletonNew",
+	props: {
+		title: {
+			type: String,
+			default: "页面标题"
+		},
+		flexColumn: Boolean,
+		flexRow: Boolean,
+		header: {
+			type: Boolean,
+			default: !0
+		},
+		contentClass: String,
+		contentScroll: {
+			type: Boolean,
+			default: !0
+		},
+		sidebarWidth: {
+			type: String,
+			default: "240px"
+		}
+	},
+	setup(y) {
+		return (b, x) => {
+			let S = e;
+			return c(), t(S, {
+				class: "page-skeleton-new",
+				horizontal: ""
+			}, {
+				default: d(() => [
+					n(" 侧栏 "),
+					i("div", {
+						class: "page-skeleton-new-left",
+						style: s({ width: y.sidebarWidth })
+					}, [y.header ? (c(), r("div", f, [i("span", p, u(y.title), 1)])) : n("v-if", !0), i("div", m, [l(b.$slots, "sidebar-content", {}, () => [x[0] || (x[0] = a("侧栏内容", -1))])])], 4),
+					n(" 内容 "),
+					i("div", {
+						class: "page-skeleton-new-right",
+						style: s({ width: `calc(100% - ${y.sidebarWidth})` })
+					}, [y.header ? (c(), r("div", h, [i("div", g, [l(b.$slots, "header-left")]), i("div", _, [i("div", v, [l(b.$slots, "header-right")])])])) : n("v-if", !0), i("div", { class: o([
+						"page-skeleton-new-page-content",
+						"flex-item",
+						{
+							"flex-column": y.flexColumn,
+							"flex-row": y.flexRow,
+							"content-scroll": y.contentScroll
+						},
+						y.contentClass
+					]) }, [l(b.$slots, "default", {}, () => [x[1] || (x[1] = a("内容", -1))])], 2)], 4)
+				]),
+				_: 3
+			});
+		};
+	}
+});
+//#endregion
+export { y as default };

package/page-skeleton-new/style.css

@@ -0,0 +1 @@
+.page-skeleton-new .page-skeleton-new-header{border-bottom:2px solid #eee;flex-direction:row;height:40px;margin:0 10px;line-height:40px;display:flex}.page-skeleton-new .page-skeleton-new-header .align-end{justify-content:flex-end}.page-skeleton-new .page-skeleton-new-left{flex-direction:column;display:flex}.page-skeleton-new .page-skeleton-new-right{flex-direction:column;flex:auto;display:flex}.page-skeleton-new .page-skeleton-new-page-content{flex:auto;width:100%;height:100%;position:relative}.page-skeleton-new .page-skeleton-new-page-content.content-scroll{overflow:auto}.page-skeleton-new .page-skeleton-new-page-content.flex-column{flex-direction:column;display:flex}.page-skeleton-new .page-skeleton-new-page-content.flex-row{display:flex}