@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
150 lines (149 loc) • 5.39 kB
JavaScript
import { defineComponent as C, ref as y, watch as S, onMounted as x, openBlock as u, createBlock as n, unref as d, withCtx as M, createElementBlock as T, Fragment as H, renderList as P } from "vue";
import { pluginManager as r } from "@javaguns/utils";
import { FlowSelection as s } from "../../flow-selection/index.mjs";
const E = /* @__PURE__ */ C({
__name: "flowComponent",
props: {
modelValue: {},
comp: { default: "input" },
options: { default: () => [] },
placeholder: { default: "数值" }
},
emits: ["update:modelValue", "update:label", "update:code", "change"],
setup(c, { emit: b }) {
const k = r.getComponent("Input"), U = r.getComponent("Select"), w = r.getComponent("SelectOption"), f = r.getComponent("DatePicker"), g = r.getComponent("TimePicker"), o = c, a = y(null), p = y(null);
S(
() => o.modelValue,
(t) => {
V(t);
}
), x(() => {
V(o.modelValue);
});
const V = (t) => {
t && t.length > 0 ? ["user", "dept", "role", "pos"].includes(o.comp) ? a.value = t : a.value = t[0] : a.value = null;
}, v = b, m = () => {
if (a.value) {
let t = [a.value], l = [a.value];
if (["user", "dept", "role", "pos"].includes(o.comp) && (t = a.value, l = p.value), ["select", "radio"].includes(o.comp)) {
const e = o.options.filter((i) => i.value == a.value);
e && (l = [], e.forEach((i) => l.push(i.label)));
}
v("update:modelValue", t), v("update:code", l), v("change", t);
}
};
return (t, l) => o.comp == "select" || o.comp == "radio" ? (u(), n(d(U), {
key: 0,
modelValue: a.value,
"onUpdate:modelValue": l[0] || (l[0] = (e) => a.value = e),
placeholder: o.placeholder,
class: "w-fill",
onChange: m
}, {
default: M(() => [
(u(!0), T(H, null, P(o.options, (e) => (u(), n(d(w), {
key: e.value,
label: e.label,
value: e.value
}, null, 8, ["label", "value"]))), 128))
]),
_: 1
}, 8, ["modelValue", "placeholder"])) : o.comp == "datetime" ? (u(), n(d(f), {
key: 1,
value: a.value,
"onUpdate:value": l[1] || (l[1] = (e) => a.value = e),
modelValue: a.value,
"onUpdate:modelValue": l[2] || (l[2] = (e) => a.value = e),
type: "datetime",
"value-format": "yyyy-MM-dd HH:mm:ss",
placeholder: o.placeholder,
class: "w-fill",
onChange: m
}, null, 8, ["value", "modelValue", "placeholder"])) : o.comp == "user" ? (u(), n(d(s), {
key: 2,
ref: "flowSelection",
type: "user",
title: "请选择人员",
styleType: "select",
min: 1,
max: 1,
modelValue: a.value,
"onUpdate:modelValue": l[3] || (l[3] = (e) => a.value = e),
label: p.value,
"onUpdate:label": l[4] || (l[4] = (e) => p.value = e),
onChange: m
}, null, 8, ["modelValue", "label"])) : o.comp == "dept" ? (u(), n(d(s), {
key: 3,
ref: "flowSelection",
type: "dept",
title: "请选择部门",
styleType: "select",
min: 1,
max: 1,
modelValue: a.value,
"onUpdate:modelValue": l[5] || (l[5] = (e) => a.value = e),
label: p.value,
"onUpdate:label": l[6] || (l[6] = (e) => p.value = e),
onChange: m
}, null, 8, ["modelValue", "label"])) : o.comp == "role" ? (u(), n(d(s), {
key: 4,
ref: "flowSelection",
type: "role",
title: "请选择角色",
styleType: "select",
min: 1,
max: 1,
modelValue: a.value,
"onUpdate:modelValue": l[7] || (l[7] = (e) => a.value = e),
label: p.value,
"onUpdate:label": l[8] || (l[8] = (e) => p.value = e),
onChange: m
}, null, 8, ["modelValue", "label"])) : o.comp == "pos" ? (u(), n(d(s), {
key: 5,
ref: "flowSelection",
type: "post",
title: "请选择职位",
styleType: "select",
min: 1,
max: 1,
modelValue: a.value,
"onUpdate:modelValue": l[9] || (l[9] = (e) => a.value = e),
label: p.value,
"onUpdate:label": l[10] || (l[10] = (e) => p.value = e),
onChange: m
}, null, 8, ["modelValue", "label"])) : o.comp == "date" ? (u(), n(d(f), {
key: 6,
value: a.value,
"onUpdate:value": l[11] || (l[11] = (e) => a.value = e),
modelValue: a.value,
"onUpdate:modelValue": l[12] || (l[12] = (e) => a.value = e),
type: "date",
"value-format": "yyyy-MM-dd",
placeholder: o.placeholder,
class: "w-fill",
onChange: m
}, null, 8, ["value", "modelValue", "placeholder"])) : o.comp == "time" ? (u(), n(d(g), {
key: 7,
value: a.value,
"onUpdate:value": l[13] || (l[13] = (e) => a.value = e),
modelValue: a.value,
"onUpdate:modelValue": l[14] || (l[14] = (e) => a.value = e),
valueFormat: "HH:mm:ss",
placeholder: o.placeholder,
class: "w-fill",
onChange: m
}, null, 8, ["value", "modelValue", "placeholder"])) : (u(), n(d(k), {
key: 8,
value: a.value,
"onUpdate:value": l[15] || (l[15] = (e) => a.value = e),
modelValue: a.value,
"onUpdate:modelValue": l[16] || (l[16] = (e) => a.value = e),
placeholder: o.placeholder,
class: "w-fill",
onChange: m
}, null, 8, ["value", "modelValue", "placeholder"]));
}
});
export {
E as default
};