@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
77 lines (76 loc) • 2.68 kB
JavaScript
import { defineComponent as m, inject as w, toRef as B, ref as r, onMounted as g, provide as d, openBlock as D, createElementBlock as K, createElementVNode as T, normalizeClass as k, createVNode as i } from "vue";
import "./style/index.css";
import { STATUS_MODES_MAP as M } from "./render.mjs";
import { getDesign as S, getInstanceDetail as E, getRuTaskList as N } from "../utils/api.mjs";
import { NodeKey as f, TasksKey as x, ReadonlyKey as z, VerticalKey as A } from "../utils/injection-key.mjs";
import { NODE_TYPES_MAP as P } from "../utils/constant.mjs";
import R from "../hooks/useData.mjs";
import V from "./node/startNode.vue.mjs";
import $ from "./node/endNode.vue.mjs";
import C from "./node/assembleNode.vue.mjs";
const O = { class: "flow-chart-container" }, j = m({ name: "flow-chart" }), Q = /* @__PURE__ */ m({
...j,
props: {
vertical: { type: Boolean, default: !1 },
top: {},
zoomTop: {},
pTop: { default: "20px" },
pBottom: {},
scroll: { type: Boolean, default: !0 },
complete: { type: Boolean },
width: {},
height: { default: "100%" },
readonly: { type: Boolean, default: !1 },
showStatus: { type: Boolean, default: !0 },
statusMode: { default: M.horizontal },
nodeMode: { default: P.square },
showZoom: { type: Boolean },
drag: { type: Boolean, default: !1 },
node: {}
},
emits: ["load"],
setup(u, { expose: p, emit: _ }) {
const o = u, t = w(f, B(o.node || {})), l = r([]), y = r(!1), { initNode: c } = R();
g(() => {
o.node || (t.value = c());
});
const v = _, I = async (e) => {
const a = await S({
instanceId: e.instanceId,
modelId: e.modelId,
definitionId: e.modelId,
formKey: e.formKey,
modelKey: e.modelKey,
edit: !1
});
if (a && a.data && a.data.data ? t.value = a.data.data : t.value = c(), console.log("node", t.value), e.instanceId) {
const n = await E({
instanceId: e.instanceId
});
n && n.data && n.data.data && (y.value = n.data.data.flowStatus == 2);
const s = await N({
instanceId: e.instanceId
});
s && s.data && (l.value = s.data.data);
}
v("load", { node: t.value, tasks: l.value });
}, h = () => t.value;
return d(f, t), d(x, l), d(z, o.readonly), d(A, o.vertical), p({
setData: I,
getData: h
}), (e, a) => (D(), K("div", O, [
T("div", {
class: k(["flow-chart-content", { vertical: o.vertical }])
}, [
i(V),
i(C, {
node: o.node
}, null, 8, ["node"]),
i($)
], 2)
]));
}
});
export {
Q as default
};