@duxweb/dvha-pro 1.1.29 → 1.1.31

package/dist/esm/components/flowEditor/components/setting.js

@@ -1,320 +1,183 @@
-import { defineComponent as T, computed as g, ref as E, watch as m, createVNode as e } from "vue";
-import { useI18n as U } from "@duxweb/dvha-core";
-import { useVueFlow as z, MarkerType as G } from "@vue-flow/core";
-import k from "clsx";
-import x from "lodash-es/cloneDeep";
-import { useMessage as H, NScrollbar as L, NButton as c, NRadioGroup as W, NRadio as h } from "naive-ui";
-import "vue-router";
-import "@overlastic/vue";
-import "@vueuse/core";
-import "vue-echarts";
-import "vue3-ace-editor";
-import "ace-builds/src-noconflict/mode-vue";
-import "ace-builds/src-noconflict/mode-javascript";
-import "ace-builds/src-noconflict/mode-html";
-import "ace-builds/src-noconflict/mode-json";
-import "ace-builds/src-noconflict/mode-json5";
-import "ace-builds/src-noconflict/theme-tomorrow_night";
-import "ace-builds/src-noconflict/theme-tomorrow";
-import "ace-builds/src-noconflict/ext-searchbox";
-import "ace-builds/src-noconflict/ext-language_tools";
-import "ace-builds/src-noconflict/mode-snippets";
-import "vue-cropper";
-import "jinrishici";
-import "lodash-es";
-import "@vee-validate/i18n";
-import "colorizr";
-import "echarts";
-import "highlight.js/lib/core";
-import "highlight.js/lib/languages/bash";
-import "highlight.js/lib/languages/css";
-import "highlight.js/lib/languages/go";
-import "highlight.js/lib/languages/java";
-import "highlight.js/lib/languages/javascript";
-import "highlight.js/lib/languages/json";
-import "highlight.js/lib/languages/markdown";
-import "highlight.js/lib/languages/php";
-import "highlight.js/lib/languages/python";
-import "highlight.js/lib/languages/shell";
-import "highlight.js/lib/languages/sql";
-import "highlight.js/lib/languages/typescript";
-import "highlight.js/lib/languages/xml";
-import "@ant-design/colors";
-import "@unocss/preset-icons/browser";
-import "@unocss/preset-typography";
-import "unocss/preset-wind4";
-import "@vee-validate/i18n/dist/locale/en.json";
-import "@vee-validate/i18n/dist/locale/zh_CN.json";
-import "vee-validate";
-import "vue-command-palette";
-import "@duxweb/dvha-naiveui";
-import "../../../pages/page404.js";
-import "vue-draggable-plus";
-import "short-unique-id";
-import "aieditor";
-import { DuxFormLayout as q } from "../../form/formLayout.js";
-import { DuxFormItem as C } from "../../form/formItem.js";
-import "@vue-flow/background";
-/* empty css           */
-import { useModal as K } from "../../../hooks/modal.js";
-import "mime";
-import "@iconify-json/tabler/icons.json";
-import "../../posterEditor/elements/index.js";
-import "fabric";
-import "../../schemaEditor/schemaEditor.js";
-import "dayjs";
-import "@tanstack/vue-query";
-import "pinia";
-function w({
-  icon: i,
-  iconBgClass: p = "bg-primary",
-  title: u,
-  description: o
-}) {
-  return e("div", {
-    class: "p-4 border-b border-default"
-  }, [e("div", {
-    class: "flex gap-2 items-center"
-  }, [i && e("div", {
-    class: k(["rounded p-2 flex-shrink-0", p])
-  }, [e("div", {
-    class: k(["size-6 text-white", i])
-  }, null)]), e("div", {
-    class: "flex-1 min-w-0"
-  }, [e("h3", {
-    class: "text-base font-medium"
-  }, [u]), o && e("p", {
-    class: "text-sm text-muted mt-1"
-  }, [o])])])]);
+import { useModal as e } from "../../../hooks/modal.js";
+import "../../../hooks/index.js";
+import { DuxFormLayout as t } from "../../form/formLayout.js";
+import { DuxFormItem as n } from "../../form/formItem.js";
+import "../../form/index.js";
+import { computed as r, createVNode as i, defineComponent as a, ref as o, watch as s } from "vue";
+import { useI18n as c } from "@duxweb/dvha-core";
+import { NButton as l, NRadio as u, NRadioGroup as d, NScrollbar as f, useMessage as p } from "naive-ui";
+import m from "clsx";
+import { MarkerType as h, useVueFlow as g } from "@vue-flow/core";
+import _ from "lodash-es/cloneDeep";
+function v({ icon: e, iconBgClass: t = "bg-primary", title: n, description: r }) {
+	return i("div", { class: "p-4 border-b border-default" }, [i("div", { class: "flex gap-2 items-center" }, [e && i("div", { class: m(["rounded p-2 flex-shrink-0", t]) }, [i("div", { class: m(["size-6 text-white", e]) }, null)]), i("div", { class: "flex-1 min-w-0" }, [i("h3", { class: "text-base font-medium" }, [n]), r && i("p", { class: "text-sm text-muted mt-1" }, [r])])])]);
 }
-const at = /* @__PURE__ */ T({
-  name: "FlowSetting",
-  props: {
-    nodes: {
-      type: Object,
-      default: () => ({})
-    },
-    modelValue: {
-      type: Object,
-      default: () => ({
-        nodes: [],
-        edges: []
-      })
-    },
-    onSave: {
-      type: Function,
-      default: void 0
-    }
-  },
-  emits: ["update:modelValue"],
-  setup(i, {
-    emit: p,
-    slots: u
-  }) {
-    const {
-      t: o
-    } = U(), {
-      getSelectedNodes: S,
-      getSelectedEdges: N,
-      updateNodeData: F,
-      updateEdgeData: D,
-      getNodes: V,
-      getEdges: O,
-      removeEdges: j
-    } = z(), f = H(), B = K(), v = () => ({
-      nodes: x(V.value),
-      edges: x(O.value)
-    }), l = g(() => {
-      const t = S.value;
-      return t.length === 1 ? t[0] : null;
-    }), r = g(() => {
-      const t = N.value;
-      return t.length === 1 ? t[0] : null;
-    }), a = g(() => !l.value || !l.value.type ? null : i.nodes[l.value.type]), d = E({}), n = E({});
-    m(l, (t) => {
-      t ? d.value = {
-        ...t.data
-      } : d.value = {};
-    }, {
-      immediate: !0
-    }), m(r, (t) => {
-      t ? n.value = {
-        ...t.data
-      } : n.value = {};
-    }, {
-      immediate: !0
-    }), m(d, (t) => {
-      l.value && (F(l.value.id, t), p("update:modelValue", v(), {
-        skipApply: !0
-      }));
-    }, {
-      deep: !0,
-      flush: "post"
-    }), m(n, (t) => {
-      if (r.value) {
-        D(r.value.id, t);
-        const s = r.value;
-        if (s && t.type) {
-          const y = {
-            success: {
-              stroke: "#10b981",
-              markerColor: "#10b981"
-            },
-            // 通过 - 绿色
-            error: {
-              stroke: "#ef4444",
-              markerColor: "#ef4444"
-            }
-            // 退回 - 红色
-          }, b = y[t.type] || y.success, A = s.style || {};
-          s.style = Object.assign({}, A, {
-            stroke: b.stroke,
-            strokeWidth: 2
-          });
-          const P = s.markerEnd || {};
-          s.markerEnd = Object.assign({}, P, {
-            type: G.ArrowClosed,
-            width: 12,
-            height: 12,
-            color: b.markerColor
-          });
-        }
-      }
-    }, {
-      deep: !0
-    });
-    const M = () => {
-      p("update:modelValue", {
-        nodes: [],
-        edges: []
-      }), f.success(o("components.flowEditor.flowCleared") || "");
-    }, R = () => {
-      const t = v();
-      i.onSave ? i.onSave(t) : f.success(o("components.flowEditor.flowSaved") || "");
-    }, I = () => {
-      const t = v();
-      B.show({
-        title: o("components.flowEditor.editFlowJSON") || "",
-        width: "600px",
-        component: () => import("./jsonEditor.js"),
-        componentProps: {
-          data: t,
-          onConfirm: (s) => {
-            p("update:modelValue", s);
-          }
-        }
-      });
-    }, J = () => {
-      r.value && (j([r.value.id]), f.success(o("components.flowEditor.edgeDeleted") || ""));
-    };
-    return () => e("div", {
-      class: "w-360px h-full flex flex-col"
-    }, [!l.value && !r.value && e(w, {
-      icon: "i-tabler:settings",
-      iconBgClass: "bg-gray-500",
-      title: o("components.flowEditor.properties") || "",
-      description: o("components.flowEditor.selectNodeOrEdge") || ""
-    }, null), l.value && e(w, {
-      icon: a.value?.meta.icon,
-      iconBgClass: a.value?.meta.style?.iconBgClass || "bg-primary",
-      title: a.value?.meta.label || "Node",
-      description: a.value?.meta.description
-    }, null), r.value && e(w, {
-      icon: "i-tabler:arrow-right",
-      iconBgClass: "bg-blue-500",
-      title: o("components.flowEditor.edgeSettings") || "",
-      description: o("components.flowEditor.edgeDescription") || ""
-    }, null), e(L, {
-      class: "flex-1 min-h-0"
-    }, {
-      default: () => [e("div", {
-        class: "p-4 space-y-4"
-      }, [!l.value && !r.value && e("div", {
-        class: "space-y-4"
-      }, [u.globalSettings?.(), e("div", {
-        class: "flex flex-col gap-2"
-      }, [e(c, {
-        onClick: I,
-        type: "default",
-        block: !0,
-        secondary: !0
-      }, {
-        icon: () => e("div", {
-          class: "i-tabler:code"
-        }, null),
-        default: () => o("components.flowEditor.editJSON") || ""
-      }), e(c, {
-        onClick: R,
-        type: "primary",
-        block: !0,
-        secondary: !0
-      }, {
-        icon: () => e("div", {
-          class: "i-tabler:device-floppy"
-        }, null),
-        default: () => o("components.flowEditor.saveFlow") || ""
-      }), e(c, {
-        onClick: M,
-        type: "warning",
-        block: !0,
-        secondary: !0
-      }, {
-        icon: () => e("div", {
-          class: "i-tabler:trash"
-        }, null),
-        default: () => o("components.flowEditor.clearFlow") || ""
-      })])]), l.value && a.value?.settingComponent && e(a.value.settingComponent, {
-        modelValue: d.value,
-        "onUpdate:modelValue": (t) => d.value = t,
-        nodeId: l.value.id,
-        nodeRegistries: i.nodes
-      }, null), r.value && e(q, {
-        labelPlacement: "top"
-      }, {
-        default: () => [e(C, {
-          label: o("components.flowEditor.connectionType") || ""
-        }, {
-          default: () => [e(W, {
-            value: n.value.type || "success",
-            onUpdateValue: (t) => {
-              n.value = {
-                ...n.value,
-                type: t
-              };
-            }
-          }, {
-            default: () => [e("div", {
-              class: "space-y-2"
-            }, [e(h, {
-              value: "success"
-            }, {
-              default: () => [e("div", {
-                class: "flex items-center gap-2"
-              }, [e("span", null, [o("components.flowEditor.pass") || ""])])]
-            }), e(h, {
-              value: "error"
-            }, {
-              default: () => [e("div", {
-                class: "flex items-center gap-2"
-              }, [e("span", null, [o("components.flowEditor.reject") || ""])])]
-            })])]
-          })]
-        }), e(C, null, {
-          default: () => [e(c, {
-            onClick: J,
-            type: "error",
-            block: !0
-          }, {
-            icon: () => e("div", {
-              class: "i-tabler:trash"
-            }, null),
-            default: () => o("components.flowEditor.deleteEdge") || ""
-          })]
-        })]
-      })])]
-    })]);
-  }
+const y = /* @__PURE__ */ a({
+	name: "FlowSetting",
+	props: {
+		nodes: {
+			type: Object,
+			default: () => ({})
+		},
+		modelValue: {
+			type: Object,
+			default: () => ({
+				nodes: [],
+				edges: []
+			})
+		},
+		onSave: {
+			type: Function,
+			default: void 0
+		}
+	},
+	emits: ["update:modelValue"],
+	setup(a, { emit: m, slots: y }) {
+		let { t: b } = c(), { getSelectedNodes: x, getSelectedEdges: S, updateNodeData: C, updateEdgeData: w, getNodes: T, getEdges: E, removeEdges: D } = g(), O = p(), k = e(), A = () => ({
+			nodes: _(T.value),
+			edges: _(E.value)
+		}), j = r(() => {
+			let e = x.value;
+			return e.length === 1 ? e[0] : null;
+		}), M = r(() => {
+			let e = S.value;
+			return e.length === 1 ? e[0] : null;
+		}), N = r(() => !j.value || !j.value.type ? null : a.nodes[j.value.type]), P = o({}), F = o({});
+		s(j, (e) => {
+			e ? P.value = { ...e.data } : P.value = {};
+		}, { immediate: !0 }), s(M, (e) => {
+			e ? F.value = { ...e.data } : F.value = {};
+		}, { immediate: !0 }), s(P, (e) => {
+			j.value && (C(j.value.id, e), m("update:modelValue", A(), { skipApply: !0 }));
+		}, {
+			deep: !0,
+			flush: "post"
+		}), s(F, (e) => {
+			if (M.value) {
+				w(M.value.id, e);
+				let t = M.value;
+				if (t && e.type) {
+					let n = {
+						success: {
+							stroke: "#10b981",
+							markerColor: "#10b981"
+						},
+						error: {
+							stroke: "#ef4444",
+							markerColor: "#ef4444"
+						}
+					}, r = n[e.type] || n.success, i = t.style || {};
+					t.style = Object.assign({}, i, {
+						stroke: r.stroke,
+						strokeWidth: 2
+					});
+					let a = t.markerEnd || {};
+					t.markerEnd = Object.assign({}, a, {
+						type: h.ArrowClosed,
+						width: 12,
+						height: 12,
+						color: r.markerColor
+					});
+				}
+			}
+		}, { deep: !0 });
+		let I = () => {
+			m("update:modelValue", {
+				nodes: [],
+				edges: []
+			}), O.success(b("components.flowEditor.flowCleared") || "");
+		}, L = () => {
+			let e = A();
+			a.onSave ? a.onSave(e) : O.success(b("components.flowEditor.flowSaved") || "");
+		}, R = () => {
+			let e = A();
+			k.show({
+				title: b("components.flowEditor.editFlowJSON") || "",
+				width: "600px",
+				component: () => import("./jsonEditor.js"),
+				componentProps: {
+					data: e,
+					onConfirm: (e) => {
+						m("update:modelValue", e);
+					}
+				}
+			});
+		}, z = () => {
+			M.value && (D([M.value.id]), O.success(b("components.flowEditor.edgeDeleted") || ""));
+		};
+		return () => i("div", { class: "w-360px h-full flex flex-col" }, [
+			!j.value && !M.value && i(v, {
+				icon: "i-tabler:settings",
+				iconBgClass: "bg-gray-500",
+				title: b("components.flowEditor.properties") || "",
+				description: b("components.flowEditor.selectNodeOrEdge") || ""
+			}, null),
+			j.value && i(v, {
+				icon: N.value?.meta.icon,
+				iconBgClass: N.value?.meta.style?.iconBgClass || "bg-primary",
+				title: N.value?.meta.label || "Node",
+				description: N.value?.meta.description
+			}, null),
+			M.value && i(v, {
+				icon: "i-tabler:arrow-right",
+				iconBgClass: "bg-blue-500",
+				title: b("components.flowEditor.edgeSettings") || "",
+				description: b("components.flowEditor.edgeDescription") || ""
+			}, null),
+			i(f, { class: "flex-1 min-h-0" }, { default: () => [i("div", { class: "p-4 space-y-4" }, [
+				!j.value && !M.value && i("div", { class: "space-y-4" }, [y.globalSettings?.(), i("div", { class: "flex flex-col gap-2" }, [
+					i(l, {
+						onClick: R,
+						type: "default",
+						block: !0,
+						secondary: !0
+					}, {
+						icon: () => i("div", { class: "i-tabler:code" }, null),
+						default: () => b("components.flowEditor.editJSON") || ""
+					}),
+					i(l, {
+						onClick: L,
+						type: "primary",
+						block: !0,
+						secondary: !0
+					}, {
+						icon: () => i("div", { class: "i-tabler:device-floppy" }, null),
+						default: () => b("components.flowEditor.saveFlow") || ""
+					}),
+					i(l, {
+						onClick: I,
+						type: "warning",
+						block: !0,
+						secondary: !0
+					}, {
+						icon: () => i("div", { class: "i-tabler:trash" }, null),
+						default: () => b("components.flowEditor.clearFlow") || ""
+					})
+				])]),
+				j.value && N.value?.settingComponent && i(N.value.settingComponent, {
+					modelValue: P.value,
+					"onUpdate:modelValue": (e) => P.value = e,
+					nodeId: j.value.id,
+					nodeRegistries: a.nodes
+				}, null),
+				M.value && i(t, { labelPlacement: "top" }, { default: () => [i(n, { label: b("components.flowEditor.connectionType") || "" }, { default: () => [i(d, {
+					value: F.value.type || "success",
+					onUpdateValue: (e) => {
+						F.value = {
+							...F.value,
+							type: e
+						};
+					}
+				}, { default: () => [i("div", { class: "space-y-2" }, [i(u, { value: "success" }, { default: () => [i("div", { class: "flex items-center gap-2" }, [i("span", null, [b("components.flowEditor.pass") || ""])])] }), i(u, { value: "error" }, { default: () => [i("div", { class: "flex items-center gap-2" }, [i("span", null, [b("components.flowEditor.reject") || ""])])] })])] })] }), i(n, null, { default: () => [i(l, {
+					onClick: z,
+					type: "error",
+					block: !0
+				}, {
+					icon: () => i("div", { class: "i-tabler:trash" }, null),
+					default: () => b("components.flowEditor.deleteEdge") || ""
+				})] })] })
+			])] })
+		]);
+	}
 });
-export {
-  at as FlowSetting
-};
+export { y as FlowSetting };