gepic
Version:
基于vue3的设计器,可视化开发页面表单
50 lines (49 loc) • 1.86 kB
JavaScript
import { defineComponent as m, computed as h, createElementBlock as l, openBlock as a, Fragment as v, renderList as _, withDirectives as V, createElementVNode as s, normalizeClass as w, toDisplayString as g, createVNode as S, unref as y, vShow as b } from "vue";
import N from "../../../components/node/src/node.vue.js";
const C = { class: "epic-attribute-view" }, E = ["title"], k = { class: "epic-attr-input" }, O = /* @__PURE__ */ m({
__name: "EArgsEditor",
props: {
modelValue: {},
actionArgsConfigs: {}
},
emits: ["update:modelValue"],
setup(u, { emit: c }) {
const n = u, i = c, r = h(() => n.modelValue ? JSON.parse(n.modelValue) : []);
function d(o) {
var t;
return typeof o.show == "boolean" ? o.show : typeof o.show == "function" ? (t = o.show) == null ? void 0 : t.call(o, { values: r.value }) : !0;
}
function p(o, t) {
const e = [
...JSON.parse(n.modelValue ?? "[]")
];
e[t] = o, i("update:modelValue", JSON.stringify(e));
}
return (o, t) => (a(), l("div", C, [
(a(!0), l(v, null, _(n.actionArgsConfigs, (e) => (a(), l("div", {
key: e.id
}, [
V(s("div", {
class: w(["epic-attr-item", e.layout])
}, [
s("div", {
class: "epic-attr-label",
title: e.label
}, g(e.label), 9, E),
s("div", k, [
S(y(N), {
"component-schema": { ...e, componentProps: { ...e.componentProps, input: !1, field: void 0, hidden: !1 }, show: !0, noFormItem: !0 },
"model-value": r.value[e.field],
"onUpdate:modelValue": (f) => p(f, e.field)
}, null, 8, ["component-schema", "model-value", "onUpdate:modelValue"])
])
], 2), [
[b, d(e)]
])
]))), 128))
]));
}
});
export {
O as default
};