@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
137 lines (136 loc) • 5.46 kB
JavaScript
import { defineComponent as b, inject as k, onMounted as x, computed as i, openBlock as t, createElementBlock as p, unref as n, createBlock as d, withCtx as a, createElementVNode as s, normalizeClass as l, normalizeStyle as w, renderSlot as u, createTextVNode as f, toDisplayString as r, resolveDynamicComponent as h, createVNode as c, Fragment as z, renderList as B } from "vue";
import "./style/square.css";
import { pluginManager as C } from "@javaguns/utils";
import { GunsPopover as E, GunsSpace as T } from "@javaguns/ui";
import { NODE_SUB_TYPES_MAP as g } from "../../utils/constant.mjs";
import D from "../../hooks/useIcon.mjs";
import { TasksKey as M, ReadonlyKey as P } from "../../utils/injection-key.mjs";
import "../../flow-widget/flow-node-addbutton/index.mjs";
import "../../flow-widget/flow-node-delbutton/index.mjs";
import "../../flow-widget/flow-node-delconfirm/index.mjs";
import "../../flow-widget/flow-node-errorwarn/index.mjs";
import "../../flow-widget/flow-node-dragtool/index.mjs";
import "../../flow-widget/flow-node-zoom/index.mjs";
import { GunsFlowTaskStatus as R } from "../../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 V = { class: "guns-flow-node-square" }, j = { class: "guns-flow-node-square-card" }, F = { class: "guns-flow-node-main" }, K = {
key: 1,
class: "guns-flow-node-square-card"
}, A = { class: "guns-flow-node-main" }, L = b({ name: "guns-square-node" }), ue = /* @__PURE__ */ b({
...L,
props: {
type: {},
name: { default: "" },
node: { default: {
nodeName: "",
nodeStatus: -1,
color1: "rgb(0, 184, 120)",
color2: "rgb(0, 184, 120)",
color3: "rgb(0, 215, 138)"
} }
},
setup($) {
const G = C.getComponent("Row"), _ = C.getComponent("Col"), e = $, I = k(M, []), q = k(P, !1);
x(() => {
e.node || (e.node.nodeName = "", e.type == "begin" && !e.name ? e.node.nodeName = "发起节点" : e.type == g.approver && !e.name ? e.node.nodeName = "审批节点" : e.type == g.branch && !e.name ? e.node.nodeName = "条件" : e.type == g.cc && !e.name && (e.node.nodeName = "抄送节点"));
});
const { loadIcon: v } = D(), N = i(() => I.value.filter((o) => o.ruNodeId == e.node.ruNodeId)), y = i(() => (o) => o.nodeStatus == -1 ? null : {
"node-status-not": o.nodeStatus == 0,
"node-status-current": o.nodeStatus == 1,
"node-status-complete": o.nodeStatus == 2,
"node-status-skip": o.nodeStatus == 3,
"node-status-reject": o.nodeStatus == 4,
"node-status-back": o.nodeStatus == 5,
"node-status-revoke": o.nodeStatus == 6
}), S = i(() => (o) => o.nodeStatus == -1 ? {
background: `linear-gradient(271deg, ${o.color1} 9%, ${o.color2} 35%, ${o.color3} 90%)`
} : null);
return (o, O) => (t(), p("div", V, [
n(q) && N.value.length > 0 ? (t(), d(n(E), {
key: 0,
placement: "top",
width: 200,
trigger: "hover"
}, {
default: a(() => [
s("div", j, [
s("div", {
class: l(["guns-flow-node-name", y.value(e.node)]),
style: w(S.value(e.node))
}, [
u(o.$slots, "name", {
currNode: e.node
}, () => [
f(r(e.node.nodeName), 1)
]),
(t(), d(h(n(v)(e.node)), { size: "20" }))
], 6),
s("div", F, [
u(o.$slots, "context", {
currNode: e.node
}, () => [
s("pre", {
class: l({ "guns-flow-node-main-context": !e.node.content })
}, r(e.node.content ? e.node.content : "设置此节点"), 3)
])
])
])
]),
content: a(() => [
c(n(T), { dir: "vertical" }, {
default: a(() => [
(t(!0), p(z, null, B(N.value, (m) => (t(), d(n(G), {
key: m.taskId,
"column-num": 2
}, {
default: a(() => [
c(n(_), { span: 10 }, {
default: a(() => [
f(r(m.approverWrapper), 1)
]),
_: 2
}, 1024),
c(n(_), { span: 14 }, {
default: a(() => [
c(n(R), { task: m }, null, 8, ["task"])
]),
_: 2
}, 1024)
]),
_: 2
}, 1024))), 128))
]),
_: 1
})
]),
_: 3
})) : (t(), p("div", K, [
s("div", {
class: l(["guns-flow-node-name", y.value(e.node)]),
style: w(S.value(e.node))
}, [
u(o.$slots, "name", {
currNode: e.node
}, () => [
f(r(e.node.nodeName), 1)
]),
(t(), d(h(n(v)(e.node)), { size: "20" }))
], 6),
s("div", A, [
u(o.$slots, "context", {
currNode: e.node
}, () => [
s("pre", {
class: l({ "guns-flow-node-main-context": !e.node.content })
}, r(e.node.content ? e.node.content : "设置此节点"), 3)
])
])
]))
]));
}
});
export {
ue as default
};