@web-utils/component 4.0.16 → 5.0.0-beta01

package/chunks/EditableTree.C_IJBL5b.mjs

@@ -0,0 +1,648 @@
+import { t as e } from "./_plugin-vue_export-helper.7vrlOII_.mjs";
+import { o as t, s as n } from "./util.B3sjVZoZ.mjs";
+import r, { Fragment as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createTextVNode as l, createVNode as u, mergeProps as d, normalizeClass as f, normalizeStyle as p, openBlock as m, renderSlot as h, resolveComponent as g, toDisplayString as _, toHandlers as v, vShow as y, withCtx as b, withDirectives as x, withModifiers as S } from "vue";
+import { computePosition as C, delay as w, fastClone as T, findTreeChildren as E, hasOwn as D, isFunction as O, isNotEmpty as k, isPlainObject as A, isUndefined as j, isVerticalScrollbarVisible as M, scrollbarWidth as N } from "@web-utils/core";
+import { cloneDeep as P } from "@web-utils/integrations/lodash";
+import { addResizeListener as F, removeResizeListener as I } from "@web-utils/integrations/resize";
+//#region src/util/reactive.js
+function L(e, t) {
+	for (let n in t) r.set(e, n, t[n]);
+	return e;
+}
+//#endregion
+//#region src/components/EditableTree.vue
+var R = {
+	name: "EditableTree",
+	props: {
+		label: {
+			type: String,
+			default: "书签"
+		},
+		addRootNodeLabel: { type: String },
+		defaultExpandedKeys: {
+			type: Array,
+			default: () => []
+		},
+		newNodeBuilder: {
+			type: Function,
+			default: (e, t) => ({
+				name: e,
+				parentId: t.id
+			})
+		},
+		contextMenu: Boolean,
+		lazy: {
+			type: Boolean,
+			default: !0
+		},
+		expandFirstNode: {
+			type: Boolean,
+			default: !0
+		},
+		readonly: Boolean,
+		saveApi: { type: Function },
+		updateApi: { type: Function },
+		deleteApi: { type: Function },
+		fetchApi: { type: Function },
+		customRootNode: { type: {
+			type: Object,
+			default: void 0
+		} },
+		rootNode: { type: Object },
+		contextMenuIcon: Boolean,
+		contextMenuInline: Boolean,
+		treeProps: {
+			type: Object,
+			default: () => ({
+				children: "children",
+				label: "name",
+				isLeaf: (e) => D(e, "hasChildren") ? !e.hasChildren : D(e, "hasChild") ? !e.hasChild : D(e, "children") && e.children ? e.children.length === 0 : !0
+			})
+		},
+		menuLabel: {
+			type: Object,
+			default: () => ({
+				appendPeer: "添加同级节点",
+				appendChild: "添加",
+				removeNode: "删除",
+				editNode: "修改"
+			})
+		},
+		icon: {
+			type: [Function, Boolean],
+			default: () => "el-icon-collection-tag"
+		},
+		confirmButton: {
+			type: Boolean,
+			default: !0
+		},
+		addRootNodeButtonStyle: {
+			type: String,
+			default: "top"
+		},
+		reserveExpandKey: Boolean,
+		nodeKey: {
+			type: String,
+			default: "id"
+		}
+	},
+	emits: [
+		"add-root-node",
+		"root-node-loaded",
+		"node-loaded",
+		"remove-new-node",
+		"create-new-node",
+		"node-added",
+		"node-updated",
+		"on-node-click"
+	],
+	data() {
+		return {
+			loading: !1,
+			showMenu: !1,
+			empty: !0,
+			expandedKeys: this.lazy ? [] : this.defaultExpandedKeys,
+			treeData: [],
+			curNode: {},
+			curData: {},
+			position: {},
+			text: "",
+			right: 4,
+			treeKey: Date.now()
+		};
+	},
+	computed: {
+		defaultOptions() {
+			return {
+				confirmButtonText: "确定",
+				cancelButtonText: "取消",
+				closeOnClickModal: !1,
+				modal: !0,
+				inputErrorMessage: `${this.label}名不能为空！`,
+				inputPlaceholder: `请输入${this.label}名...`,
+				inputValidator: (e) => e != null && e.trim().length > 0
+			};
+		},
+		innerTreeData() {
+			var e;
+			return (e = this.$attrs.data) != null && e.length ? this.$attrs.data : this.treeData;
+		}
+	},
+	watch: { defaultExpandedKeys: {
+		immediate: !0,
+		handler(e) {
+			this.expandedKeys = [...e];
+		}
+	} },
+	created() {
+		this.tryFetch();
+	},
+	mounted() {
+		F(this.$refs.tree.$el, this.resize), F(this.$refs.treeWrapper, this.resize);
+	},
+	beforeUnmount() {
+		I(this.$refs.tree.$el, this.resize), I(this.$refs.treeWrapper, this.resize);
+	},
+	methods: {
+		filterTreeProperties: n,
+		filterTreeEvents: t,
+		addExpandKey(e) {
+			this.reserveExpandKey && this.expandedKeys.push(e[this.nodeKey]);
+		},
+		removeExpandKey(e) {
+			this.reserveExpandKey && (this.expandedKeys = this.expandedKeys.filter((t) => t !== e[this.nodeKey]));
+		},
+		resize() {
+			M(this.$refs.treeWrapper) ? this.right = 4 + N : this.right = 4;
+		},
+		async showContextMenu(e, t, n) {
+			t.contextmenu === !1 || t.id === -1 || t.id === 0 || t.edit === !0 || this.contextMenu && (this.curNode = n, this.curData = t, this.showMenu = !0, this.$refs.tree.setCurrentKey(t.id), await this.$nextTick(), this.position = C(e, this.$refs.contextMenu), window.addEventListener("click", this.hideContextMenu));
+		},
+		hideContextMenu() {
+			this.showMenu = !1, window.removeEventListener("click", this.hideContextMenu);
+		},
+		async tryFetch() {
+			if (this.lazy === !1 && this.fetchApi) {
+				var e;
+				let t = await this.fetchApi(((e = this.rootNode) == null ? void 0 : e.id) ?? -1, {});
+				if (A(t.data) && (t.data = [t.data]), t.data = t.data || [], this.empty = t.data.length === 0, A(this.customRootNode)) {
+					let e = P(this.customRootNode);
+					e[this.treeProps.children || "children"] = t.data, this.treeData = [e];
+				} else if (O(this.customRootNode)) {
+					let e = this.customRootNode(t.data);
+					e[this.treeProps.children || "children"] = t.data, this.treeData = A(e) ? [e] : e;
+				} else this.treeData = t.data;
+			}
+		},
+		async loadNode(e, t) {
+			if (e.level === 0) {
+				var n;
+				let a = await this.fetchApi(((n = this.rootNode) == null ? void 0 : n.id) ?? -1, e);
+				if (this.empty = a.data.length === 0, A(this.customRootNode)) {
+					let e = P(this.customRootNode);
+					e[this.treeProps.children || "children"] = a.data, t([e]);
+				} else if (O(this.customRootNode)) {
+					let e = this.customRootNode(a.data);
+					e[this.treeProps.children || "children"] = a.data, this.treeData = A(e) ? [e] : e;
+				} else t(a.data);
+				if (await this.$nextTick(), this.$emit("root-node-loaded", a.data), this.defaultExpandedKeys) {
+					var r;
+					this.expandedKeys = [a == null || (r = a.data[0]) == null ? void 0 : r.id, ...this.defaultExpandedKeys];
+				} else if (this.expandFirstNode) {
+					var i;
+					this.expandedKeys = [a == null || (i = a.data[0]) == null ? void 0 : i.id];
+				}
+			} else {
+				if (e.leaf || e.data.isTempNode) return t([]);
+				let n = await this.fetchApi(e.data.id, e);
+				t(n.data), await this.$nextTick(), this.$emit("node-loaded", n.data);
+			}
+		},
+		clear() {
+			this.cancelEdit(), this.removeNewNode();
+		},
+		clearChecked() {
+			this.$refs.tree.setCheckedKeys([]);
+		},
+		removeNewNode() {
+			this.newChild && this.newChild.id === -1 && (console.log(this.newChild), this.$refs.tree.remove(this.newChild), this.$emit("remove-new-node"));
+		},
+		cancelEdit() {
+			this.editData && (j(this.editData.edit) ? this.$set(this.editData, "edit", !0) : this.editData.edit = !1);
+		},
+		async editNode(e, t) {
+			!this.contextMenu || this.contextMenuIcon || this.contextMenuInline ? (this.clear(), this.editData = t, this.text = t[this.treeProps.label], j(t.edit) ? this.$set(t, "edit", !0) : t.edit = !0, await this.$nextTick(), this.$refs.labelTxt.focus()) : await this.$prompt(`请输入新的${this.label}名：`, {
+				...this.defaultOptions,
+				inputValue: t[this.treeProps.label],
+				beforeClose: async (e, t, n) => {
+					if (e === "confirm") {
+						try {
+							t.confirmButtonLoading = !0, t.confirmButtonText = "处理中...", this.text = t.inputValue, await this.onConfirm(this.curNode, this.curData), n();
+						} catch {
+							t.confirmButtonText = "确定";
+						}
+						t.confirmButtonLoading = !1;
+					} else n();
+				}
+			}).catch((e) => e);
+		},
+		async appendRootNode() {
+			this.text = "", !this.contextMenu || this.contextMenuIcon || this.contextMenuInline ? (this.clear(), this.createNewChild(void 0), this.$refs.tree.root.insertChild({ data: this.newChild }, void 0, !0), await this.scrollIntoView(!0)) : await this.$prompt(`请输入${this.label}名：`, {
+				...this.defaultOptions,
+				beforeClose: async (e, t, n) => {
+					if (e === "confirm") {
+						try {
+							this.createNewChild(-1), t.confirmButtonLoading = !0, t.confirmButtonText = "处理中...";
+							let e = await this.saveApi(this.newNodeBuilder(t.inputValue, { id: -1 }));
+							this.newChild[this.treeProps.label] = t.inputValue, this.newChild.edit = !1, L(this.newChild, e.data), this.$refs.tree.root.insertChild({ data: this.newChild }, void 0, !0), await this.locateView(), n();
+						} catch {
+							t.confirmButtonText = "确定";
+						}
+						t.confirmButtonLoading = !1;
+					} else n();
+				}
+			}).catch((e) => e);
+		},
+		appendChildNode(e) {
+			this.text = "";
+			let t = e.expanded;
+			e.expand(async () => {
+				!this.contextMenu || this.contextMenuIcon || this.contextMenuInline ? (this.clear(), this.createNewChild(e.data.id), this.$refs.tree.append(this.newChild, e), await this.scrollIntoView(t)) : await this.$prompt(`请输入${this.label}名：`, {
+					...this.defaultOptions,
+					beforeClose: async (t, n, r) => {
+						if (t === "confirm") {
+							try {
+								this.createNewChild(e.data.id), n.confirmButtonLoading = !0, n.confirmButtonText = "处理中...";
+								let t = await this.saveApi(this.newNodeBuilder(n.inputValue, e.data));
+								this.newChild[this.treeProps.label] = n.inputValue, this.newChild.edit = !1, L(this.newChild, t.data), this.$refs.tree.append(this.newChild, e), await this.locateView(), r();
+							} catch {
+								n.confirmButtonText = "确定";
+							}
+							n.confirmButtonLoading = !1;
+						} else r();
+					}
+				}).catch((e) => e);
+			});
+		},
+		appendChildNodeWithData(e, t, n) {
+			this.text = "";
+			let r = e.expanded;
+			e.expand(async () => {
+				this.clear(), this.newChild = {
+					id: -1,
+					parentId: t,
+					[this.treeProps.label]: n,
+					edit: !1,
+					isTempNode: !0,
+					hasChildren: !1
+				}, this.$refs.tree.append(this.newChild, e), await this.scrollIntoView(r);
+			});
+		},
+		appendPeerNode(e) {
+			e.parent && e.parent.level !== 0 ? this.appendChildNode(e.parent) : this.appendRootNode();
+		},
+		async addRootNode(e) {
+			this.$refs.tree.remove(e), await this.$nextTick(), this.$refs.tree.root.insertChild({ data: e }, void 0, !0);
+		},
+		async addChildNode(e) {
+			this.curNode && this.curNode.level !== 0 ? this.curNode.expand(async () => {
+				this.$refs.tree.remove(e), await this.$nextTick(), this.$refs.tree.append(e, this.curNode);
+			}) : await this.addRootNode(e);
+		},
+		async addPeerNode(e) {
+			this.curNode && this.curNode.parent && this.curNode.parent.level !== 0 ? this.curNode.parent.expand(async () => {
+				this.$refs.tree.remove(e), await this.$nextTick(), this.$refs.tree.append(e, this.curNode.parent);
+			}) : await this.addRootNode(e);
+		},
+		updateNode(e) {
+			let t = this.$refs.tree.getNode(e);
+			t && (t.data = e);
+		},
+		setCurrentKey(e) {
+			var t;
+			(t = this.$refs.tree) == null || t.setCurrentKey(e);
+		},
+		createNewChild(e) {
+			this.newChild = {
+				id: -1,
+				parentId: e,
+				[this.treeProps.label]: "",
+				edit: !0,
+				isTempNode: !0,
+				hasChildren: !1
+			}, this.$emit("create-new-node", this.newChild);
+		},
+		async removeNodeModal(e) {
+			await this.$confirm(`你确定要删除${this.label}[<span class="break-word" style="color: orange">${e.data[this.treeProps.label]}</span>]吗？`, "系统提示", {
+				type: "warning",
+				modal: !0,
+				dangerouslyUseHTMLString: !0,
+				iconClass: "el-icon-question",
+				closeOnClickModal: !1,
+				confirmButtonClass: "el-button--danger",
+				cancelButtonClass: "el-button--primary is-plain",
+				beforeClose: async (t, n, r) => {
+					if (t === "confirm") {
+						try {
+							n.confirmButtonLoading = !0, n.confirmButtonText = "删除...";
+							let t = e.parent, i = await this.deleteApi(e.data.id);
+							i.code === 0 ? (this.$message.success("删除成功!"), this.$refs.tree.remove(e), this.$emit("node-deleted", t, e.data), r()) : this.$message.error(i.message);
+						} catch {}
+						n.confirmButtonText = "确定", n.confirmButtonLoading = !1;
+					} else r();
+				}
+			}).catch((e) => e);
+		},
+		async removeNode(e) {
+			try {
+				let t = e.parent;
+				if (this.deleteApi) {
+					let n = await this.deleteApi(e.data.id);
+					n.code === 0 ? (this.$message.success("删除成功!"), this.$refs.tree.remove(e), this.$emit("node-deleted", t, e.data)) : this.$message.error(n.message);
+				} else this.$refs.tree.remove(e);
+			} catch {}
+		},
+		async onConfirm(e, t) {
+			if (t[this.treeProps.label] === this.text || !k(this.text)) {
+				this.clear();
+				return;
+			}
+			j(t.loading) ? this.$set(t, "loading", !0) : t.loading = !0;
+			try {
+				if (this.loading = !0, t.id === -1) {
+					let n = await this.saveApi(this.newNodeBuilder(this.text, e.parent.data || { id: -1 })), r = T(t);
+					L(t, {
+						...n.data,
+						isTempNode: !1
+					}), this.$emit("node-added", t, r, e), this.registerNode(e);
+				} else await this.updateApi({
+					...t,
+					[this.treeProps.label]: this.text
+				});
+				t[this.treeProps.label] = this.text, t.edit = !1, this.$emit("node-updated", t, e), this.text = "";
+			} catch {}
+			t.loading = !1, this.loading = !1;
+		},
+		onCancel(e, t) {
+			t.id === -1 ? this.$refs.tree.remove(e) : t.edit = !1, this.text = "";
+		},
+		nodeClick(e, t, n) {
+			this.hideContextMenu(), (j(e.loading) || !e.loading) && (this.curNode = t, this.curData = e, this.$emit("on-node-click", e, t, n));
+		},
+		getCurrentNode() {
+			return this.$refs.tree.getCurrentNode();
+		},
+		async locateView() {
+			await this.$nextTick();
+			let e = this.$el.querySelector(`[data-id="${this.newChild.id}"]`);
+			e && e.scrollIntoView();
+		},
+		async scrollIntoView(e) {
+			var t;
+			await this.$nextTick(), e || await w(300), (t = this.$refs) == null || (t = t.labelTxt) == null || t.focus();
+		},
+		inputKeyup(e, t, n) {
+			e.keyCode === 13 && this.onConfirm(t, n), e.keyCode === 27 && this.clear();
+		},
+		inputBlur(e, t, n) {
+			this.confirmButton || this.onConfirm(t, n);
+		},
+		getCheckedKeys() {
+			return this.$refs.tree.getCheckedKeys();
+		},
+		setCheckedKeys(e) {
+			this.$refs.tree.setCheckedKeys(e);
+		},
+		getCheckedNodes() {
+			return this.$refs.tree.getCheckedNodes();
+		},
+		setCheckedNodes(e) {
+			this.$refs.tree.setCheckedNodes(e);
+		},
+		getNode(e) {
+			return this.$refs.tree.getNode(e);
+		},
+		getRootNode() {
+			return this.$refs.tree.root;
+		},
+		findTreeNode(e) {
+			return E(this.$refs.tree.root.childNodes, (t) => t.data === e || t.data.id === e, "childNodes");
+		},
+		registerNode(e) {
+			e.store.registerNode(e), delete e.store.nodesMap[-1];
+		},
+		async reloadTree() {
+			this.lazy ? this.treeKey = Date.now() : await this.tryFetch();
+		}
+	}
+}, z = { class: "editable-tree" }, B = {
+	ref: "treeWrapper",
+	class: "et-tree-wrapper"
+}, V = {
+	key: 0,
+	style: { "padding-left": "24px" }
+}, H = ["data-id"], U = { class: "node-label flex-row flex-item oh ellipsis-1" }, W = {
+	class: "flex-item-relative",
+	style: { height: "21px" }
+}, G = ["title"], K = {
+	key: 0,
+	class: "handle-actions"
+}, q = {
+	key: 1,
+	class: "handle-actions",
+	style: { display: "inline-block" }
+}, J = ["data-id"], Y = { class: "menu-list" };
+function X(e, t, n, r, C, w) {
+	let T = g("ElButton"), E = g("ElPopconfirm"), D = g("ElInput"), O = g("ElTree");
+	return m(), s("div", z, [
+		o(" 添加根节点事件\r\n    @event add-root-node "),
+		!n.readonly && n.addRootNodeButtonStyle === "top-right" ? (m(), a(T, {
+			key: 0,
+			type: "primary",
+			size: "mini",
+			style: p([{
+				position: "absolute",
+				top: "4px",
+				"z-index": "1"
+			}, { right: `${C.right}px` }]),
+			icon: "el-icon-plus",
+			circle: "",
+			plain: "",
+			onClick: t[0] || (t[0] = S((t) => e.$emit("add-root-node"), ["stop"]))
+		}, null, 8, ["style"])) : o("v-if", !0),
+		c("div", B, [
+			!n.readonly && n.addRootNodeButtonStyle === "top" ? (m(), s("div", V, [u(T, {
+				disabled: C.loading,
+				size: "mini",
+				type: "text",
+				onClick: w.appendRootNode
+			}, {
+				default: b(() => [t[8] || (t[8] = c("i", { class: "el-icon-lx-add" }, null, -1)), l(" " + _(n.addRootNodeLabel ? n.addRootNodeLabel : `添加${n.label}`), 1)]),
+				_: 1
+			}, 8, ["disabled", "onClick"])])) : o("v-if", !0),
+			(m(), a(O, d(w.filterTreeProperties(e.$attrs), {
+				key: C.treeKey,
+				ref: "tree",
+				class: "flex-item",
+				"default-expanded-keys": C.expandedKeys,
+				"expand-on-click-node": !1,
+				"highlight-current": "",
+				load: w.loadNode,
+				data: w.innerTreeData,
+				props: n.treeProps,
+				lazy: n.lazy,
+				"node-key": n.nodeKey
+			}, v(w.filterTreeEvents(e.$listeners)), {
+				onNodeClick: w.nodeClick,
+				onNodeContextmenu: w.showContextMenu,
+				onNodeExpand: w.addExpandKey,
+				onNodeCollapse: w.removeExpandKey
+			}), {
+				default: b(({ node: r, data: a }) => [h(e.$slots, "default", {
+					node: r,
+					data: a
+				}, () => [o("非编辑模式"), a.edit ? (m(), s(i, { key: 1 }, [o("编辑模式"), c("span", {
+					"data-id": a.id,
+					class: "custom-tree-node flex-row flex-item oh"
+				}, [
+					n.icon ? (m(), s("i", {
+						key: 0,
+						class: f([a.loading ? "el-icon-loading" : "el-icon-edit-outline", "node-icon shrink-0"])
+					}, null, 2)) : o("v-if", !0),
+					u(D, {
+						ref: "labelTxt",
+						modelValue: C.text,
+						"onUpdate:modelValue": t[2] || (t[2] = (e) => C.text = e),
+						class: "node-input flex-item",
+						size: "mini",
+						placeholder: w.defaultOptions.inputPlaceholder,
+						onKeyup: (e) => w.inputKeyup(e, r, a),
+						onBlur: (e) => w.inputBlur(e, r, a),
+						onClick: t[3] || (t[3] = S(() => {}, ["stop"]))
+					}, null, 8, [
+						"modelValue",
+						"placeholder",
+						"onKeyup",
+						"onBlur"
+					]),
+					n.confirmButton ? (m(), s(i, { key: 1 }, [x(u(T, {
+						class: "shrink-0",
+						size: "mini",
+						type: "text",
+						onClick: S((e) => w.onConfirm(r, a), ["stop"])
+					}, {
+						default: b(() => [...t[13] || (t[13] = [l("确定", -1)])]),
+						_: 1
+					}, 8, ["onClick"]), [[y, !a.loading]]), x(u(T, {
+						class: "shrink-0",
+						size: "mini",
+						type: "text",
+						onClick: S((e) => w.onCancel(r, a), ["stop"])
+					}, {
+						default: b(() => [...t[14] || (t[14] = [l("取消", -1)])]),
+						_: 1
+					}, 8, ["onClick"]), [[y, !a.loading]])], 64)) : o("v-if", !0)
+				], 8, J)], 64)) : (m(), s("span", {
+					key: 0,
+					"data-id": a.id,
+					class: "custom-tree-node"
+				}, [
+					c("span", U, [
+						n.icon ? (m(), s("i", {
+							key: 0,
+							class: f([a.loading ? "el-icon-loading" : n.icon(a, r), "node-icon"])
+						}, null, 2)) : o("v-if", !0),
+						c("span", W, [c("span", {
+							class: "ellipsis-1 absolute-box et-tree-label",
+							title: r.label
+						}, [h(e.$slots, "label", {
+							data: a,
+							node: r
+						}, () => [l(_(r.label), 1)])], 8, G)]),
+						h(e.$slots, "label-suffix", {
+							node: r,
+							data: a
+						})
+					]),
+					!n.contextMenu && !n.readonly ? x((m(), s("span", K, [
+						u(T, {
+							size: "mini",
+							type: "text",
+							onClick: S((e) => w.appendChildNode(r, a), ["stop"])
+						}, {
+							default: b(() => [...t[9] || (t[9] = [l("添加", -1)])]),
+							_: 1
+						}, 8, ["onClick"]),
+						u(T, {
+							size: "mini",
+							type: "text",
+							onClick: S((e) => w.editNode(r, a), ["stop"])
+						}, {
+							default: b(() => [...t[10] || (t[10] = [l("修改", -1)])]),
+							_: 1
+						}, 8, ["onClick"]),
+						u(E, {
+							class: "pop-confirm",
+							"icon-color": "red",
+							title: "你确定要删除吗？",
+							onConfirm: (e) => w.removeNode(r, a)
+						}, {
+							reference: b(() => [x(u(T, {
+								size: "mini",
+								style: { "margin-left": "4px" },
+								type: "text",
+								onClick: t[1] || (t[1] = S(() => {}, ["stop"]))
+							}, {
+								default: b(() => [...t[11] || (t[11] = [l("删除", -1)])]),
+								_: 1
+							}, 512), [[y, r.isLeaf]])]),
+							_: 2
+						}, 1032, ["onConfirm"])
+					], 512)), [[y, !a.loading && !C.loading]]) : o("v-if", !0),
+					n.contextMenuIcon && n.contextMenu && !n.readonly ? x((m(), s("span", q, [u(T, {
+						size: "mini",
+						style: { padding: "6px 10px 0" },
+						type: "text",
+						onClick: S((e) => w.showContextMenu(e, a, r), ["stop"])
+					}, {
+						default: b(() => [...t[12] || (t[12] = [l(". . .", -1)])]),
+						_: 1
+					}, 8, ["onClick"])], 512)), [[y, !a.loading && !C.loading]]) : o("v-if", !0)
+				], 8, H))])]),
+				_: 3
+			}, 16, [
+				"default-expanded-keys",
+				"load",
+				"data",
+				"props",
+				"lazy",
+				"node-key",
+				"onNodeClick",
+				"onNodeContextmenu",
+				"onNodeExpand",
+				"onNodeCollapse"
+			])),
+			n.contextMenu && !n.readonly ? x((m(), s("div", {
+				key: 1,
+				ref: "contextMenu",
+				style: p(C.position),
+				class: "menu"
+			}, [c("ul", Y, [h(e.$slots, "context-menu", {
+				curNode: C.curNode,
+				curData: C.curData
+			}, () => [
+				x(c("li", {
+					class: "menu-item",
+					onClick: t[4] || (t[4] = (e) => w.appendPeerNode(C.curNode, C.curData))
+				}, [t[15] || (t[15] = c("i", {
+					class: "menu-item-icon el-icon-lx-add",
+					style: { color: "#228b22" }
+				}, null, -1)), l(_(n.menuLabel.appendPeer), 1)], 512), [[y, C.curData.id > -1]]),
+				c("li", {
+					class: "menu-item",
+					onClick: t[5] || (t[5] = (e) => w.appendChildNode(C.curNode, C.curData))
+				}, [t[16] || (t[16] = c("i", {
+					class: "menu-item-icon el-icon-lx-add",
+					style: { color: "#228b22" }
+				}, null, -1)), l(_(n.menuLabel.appendChild), 1)]),
+				x(c("li", {
+					class: "menu-item",
+					onClick: t[6] || (t[6] = (e) => w.editNode(C.curNode, C.curData))
+				}, [t[17] || (t[17] = c("i", {
+					class: "menu-item-icon el-icon-edit-outline",
+					style: { color: "#ffa500" }
+				}, null, -1)), l(_(n.menuLabel.editNode), 1)], 512), [[y, C.curData.id > -1]]),
+				x(c("li", {
+					class: "menu-item",
+					onClick: t[7] || (t[7] = (e) => w.removeNodeModal(C.curNode, C.curData))
+				}, [t[18] || (t[18] = c("i", {
+					class: "menu-item-icon el-icon-delete",
+					style: { color: "#f00" }
+				}, null, -1)), l(_(n.menuLabel.removeNode), 1)], 512), [[y, C.curNode.isLeaf]])
+			])])], 4)), [[y, C.showMenu]]) : o("v-if", !0)
+		], 512)
+	]);
+}
+var Z = /* @__PURE__ */ e(R, [["render", X]]);
+//#endregion
+export { Z as t };