@javaguns/flow-ui
Version:
``` <template> <a-spin :spinning="loading"> <FlowDesigner ref="flowDesigner" top="50px"> </FlowDesigner> </a-spin> </template> <script lang="ts" setup> import { ref, provide, onMounted } from 'vue'; import { FlowDesigner, LoadingKey } from '@j
84 lines (83 loc) • 3.19 kB
JavaScript
import { defineComponent as _, ref as A, inject as u, computed as a, openBlock as l, createElementBlock as m, normalizeClass as p, unref as t, withModifiers as f, createVNode as v, withCtx as s, createElementVNode as c, Fragment as D, renderList as G, createBlock as y, resolveDynamicComponent as H, toDisplayString as K, createCommentVNode as P } from "vue";
import { AddNodeKey as R, VerticalKey as S, ReadonlyKey as F } from "../../utils/injection-key.mjs";
import { pluginManager as h, loadAsyncComponent as j } from "@javaguns/utils";
import L from "../../hooks/useData.mjs";
import { NodeType as w } from "../../types/node.mjs";
import { GunsPopover as O } from "@javaguns/ui";
const U = /* @__PURE__ */ c("svg", {
viewBox: "0 0 1024 1024",
version: "1.1",
xmlns: "http://www.w3.org/2000/svg",
"xmlns:xlink": "http://www.w3.org/1999/xlink"
}, [
/* @__PURE__ */ c("path", { d: "M896 480H544.8V128h-65.6v352H128v66.4h351.2V896h65.6V546.4H896z" })
], -1), $ = [
U
], q = { style: { "margin-left": "10px" } }, J = _({ name: "flow-chart-add-node" }), te = /* @__PURE__ */ _({
...J,
props: {
btnType: { default: "" },
node: {}
},
setup(g) {
const C = h.getComponent("Menu"), M = h.getComponent("MenuItem"), e = g, o = A(""), k = u(R, () => {
}), x = u(S, !1), N = u(F, !1), { nodeItems: V } = L(), T = a(() => o.value === "normal" ? o.value : e.btnType || o.value), b = a(() => V.filter((n) => {
var d;
return n.nodeType == w.SUGGEST ? ((d = e.node) == null ? void 0 : d.nodeType) == w.APPROVER : !0;
})), B = a(() => e.node && !e.node.addable ? !1 : !N), E = a(() => (n) => j(async () => (await import("@javaguns/icon"))["Icon" + n.icon + "Flow"])), I = () => {
o.value = "normal";
}, z = () => {
o.value = "";
};
return (n, d) => B.value ? (l(), m("div", {
key: 0,
class: p(["flow-chart-add-node", { vertical: t(x) }]),
onMouseenter: f(I, ["stop"]),
onMouseleave: f(z, ["stop"])
}, [
v(t(O), {
placement: "right",
width: "200",
trigger: "click"
}, {
default: s(() => [
c("div", {
class: p(["flow-chart-add-node-btn", [T.value]])
}, $, 2)
]),
content: s(() => [
v(t(C), {
class: "guns-node-addbutton-menu",
mode: "vertical",
style: { "border-right": "solid 0px #e6e6e6" }
}, {
default: s(() => [
(l(!0), m(D, null, G(b.value, (r, i) => (l(), y(t(M), {
key: i,
name: i,
onClick: (Q) => t(k)({
currNode: e.node,
item: r
})
}, {
default: s(() => [
(l(), y(H(E.value(r)), {
size: "15",
color: r.color
}, null, 8, ["color"])),
c("span", q, K(r.nodeName), 1)
]),
_: 2
}, 1032, ["name", "onClick"]))), 128))
]),
_: 1
})
]),
_: 1
})
], 34)) : P("", !0);
}
});
export {
te as default
};