@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
156 lines (155 loc) • 6.45 kB
JavaScript
import { defineComponent as k, computed as p, openBlock as l, createElementBlock as G, normalizeStyle as c, createElementVNode as w, normalizeClass as b, unref as t, withModifiers as P, createBlock as s, withCtx as a, renderSlot as i, createCommentVNode as m, createVNode as z } from "vue";
import "./style/index.css";
import { injectWithSelf as u } from "@javaguns/utils";
import { NODE_SUB_TYPES_MAP as N, NODE_TYPES_MAP as T } from "../../utils/constant.mjs";
import { ReadonlyKey as A, NodeClickKey as K, BranchNodeClickKey as _ } from "../../utils/injection-key.mjs";
import { useNode as O } from "../../hooks/useNode.mjs";
import { useNodeDrag as U } from "../../hooks/useNodeDrag.mjs";
import W from "./circle-node.vue.mjs";
import Y from "./square-node.vue.mjs";
import j from "./fresh-node.vue.mjs";
import { GunsFlowNodeAddButton as q } from "../../flow-widget/flow-node-addbutton/index.mjs";
import { GunsFlowNodeDelButton as R } from "../../flow-widget/flow-node-delbutton/index.mjs";
import { GunsFlowNodeDelConfirm as H } from "../../flow-widget/flow-node-delconfirm/index.mjs";
import { GunsFlowNodeErrorWarnfrom as I } from "../../flow-widget/flow-node-errorwarn/index.mjs";
import { GunsFlowNodeDragTool as J } from "../../flow-widget/flow-node-dragtool/index.mjs";
import "../../flow-widget/flow-node-zoom/index.mjs";
import "../../flow-widget/flow-task-status/index.mjs";
import "../../flow-widget/flow-task-image/index.mjs";
import "../../flow-widget/flow-task-timeline/index.mjs";
import "../../flow-widget/flow-task-user/index.mjs";
const L = ["draggable"], Q = k({ name: "flow-simple-node" }), we = /* @__PURE__ */ k({
...Q,
props: {
type: {},
subType: {},
name: {},
complete: { type: Boolean },
width: {},
height: {},
top: {},
bottom: {},
branch: { type: Boolean, default: !1 },
suggest: { type: Boolean, default: !1 },
polymerize: { type: Boolean, default: !1 },
minMap: { type: Boolean, default: !1 },
node: { default: {
nodeType: 1,
nodeStatus: 1,
nodeSubType: 1,
color1: "#fff",
dragTool: !1,
error: !1
} },
routeNode: { default: () => ({}) }
},
setup(C) {
const e = C, d = u(A, !1), { isShow: f, itemClass: v } = O(), { ondragstart: B, ondragover: S, ondragenter: D, ondragleave: E, ondragend: $ } = U(), M = p(() => {
const n = {};
return e.subType == N.start && (n["padding-top"] = e.top), e.subType == N.end && (n["padding-bottom"] = e.bottom), n;
}), V = p(() => (n) => {
if (e.type != T.circle && n)
return { "guns-flow-complete": n.nodeStatus == 2, "guns-flow-drag": n.dragClass };
}), x = p(() => {
if (e.type != T.circle && e.node)
return {
"--hover-color": e.node.color1
};
}), y = u(K, () => {
}), g = u(_, () => {
}), F = (n) => {
e.branch && g && n.nodeName != "默认条件" ? g(e.routeNode, n) : !e.branch && y && y(n), !d && n.nodeName != "默认条件" && (n.active = !0);
};
return (n, r) => {
var h;
return l(), G("div", {
class: "guns-flow-node",
style: c(M.value)
}, [
w("div", {
class: b(["guns-flow-node-box", V.value(e.node)]),
style: c(x.value)
}, [
w("div", {
class: b(["guns-flow-node-item", t(v)(e.node, e.branch, e.type, t(d))]),
onClick: r[0] || (r[0] = P((o) => !t(d) && !e.suggest && F(e.node), ["stop"])),
draggable: ((h = e.node) == null ? void 0 : h.nodeType) == 1,
onDragstart: r[1] || (r[1] = (o) => !t(d) && t(B)(o, e.node)),
onDragover: r[2] || (r[2] = (o) => !t(d) && t(S)(o, e.node)),
onDragenter: r[3] || (r[3] = (o) => !t(d) && t(D)(o, e.node)),
onDragleave: r[4] || (r[4] = (o) => !t(d) && t(E)(o, e.node)),
onDragend: r[5] || (r[5] = (o) => !t(d) && t($)(o, e.node))
}, [
e.type == "circle" ? (l(), s(W, {
key: 0,
name: e.name,
type: e.subType,
complete: e.complete,
width: e.width,
height: e.height,
top: e.top,
bottom: e.bottom
}, {
default: a(() => [
i(n.$slots, "name")
]),
_: 3
}, 8, ["name", "type", "complete", "width", "height", "top", "bottom"])) : e.type == "fresh" ? (l(), s(j, {
key: 1,
name: e.name,
type: e.subType,
width: e.width,
height: e.height,
node: e.node
}, {
name: a(({ currNode: o }) => [
i(n.$slots, "name", { currNode: o })
]),
context: a(({ currNode: o }) => [
i(n.$slots, "context", { currNode: o })
]),
_: 3
}, 8, ["name", "type", "width", "height", "node"])) : (l(), s(Y, {
key: 2,
name: e.name,
type: e.subType,
width: e.width,
height: e.height,
node: e.node
}, {
name: a(({ currNode: o }) => [
i(n.$slots, "name", { currNode: o })
]),
context: a(({ currNode: o }) => [
i(n.$slots, "context", { currNode: o })
]),
_: 3
}, 8, ["name", "type", "width", "height", "node"])),
!t(d) && t(f)(e.minMap, e.node) ? (l(), s(t(R), {
key: 3,
node: e.node
}, null, 8, ["node"])) : m("", !0),
t(f)(e.minMap, e.node) ? (l(), s(t(H), {
key: 4,
node: e.node
}, null, 8, ["node"])) : m("", !0),
e.node.error && (e.type == "fresh" || e.type == "square") ? (l(), s(t(I), { key: 5 })) : m("", !0)
], 42, L),
e.subType != "end" ? (l(), s(t(q), {
key: 0,
node: e.node,
readonly: e.subType == "start" ? !0 : t(d)
}, null, 8, ["node", "readonly"])) : m("", !0),
z(t(J), {
modelValue: e.node.dragTool,
"onUpdate:modelValue": r[6] || (r[6] = (o) => e.node.dragTool = o),
onClose: r[7] || (r[7] = (o) => e.node.dragClass = o)
}, null, 8, ["modelValue"])
], 6)
], 4);
};
}
});
export {
we as default
};