UNPKG

epic-designer-dev

Version:

基于vue3的设计器,可视化开发页面表单。在epic-designer的基础上新增了字典选择器

67 lines (66 loc) 2.24 kB
import { defineComponent as C, inject as i, ref as d, reactive as F, provide as M, onMounted as N, computed as f, createElementBlock as h, createCommentVNode as x, openBlock as v, createVNode as B, unref as O, mergeProps as $, withCtx as q, renderSlot as g, Fragment as w, renderList as E } from "vue"; import { NForm as L } from "naive-ui/lib/form"; const z = { key: 0, class: "form-main", style: { height: "100%" } }, H = /* @__PURE__ */ C({ __name: "form", props: { componentSchema: { default: () => ({}), require: !0, type: Object } }, setup(S, { expose: _ }) { var l, u; const t = S, y = i("pageManager", {}), o = d(null), c = i("forms", {}), D = d(!0), n = F({}); M("formData", n), y.addFormData(n, (u = (l = t.componentSchema) == null ? void 0 : l.componentProps) == null ? void 0 : u.name); function m() { return n; } function s(e) { Object.assign(n, e); } function P() { var e; return (e = o.value) == null ? void 0 : e.validate(); } function k() { var e; return (e = o.value) == null ? void 0 : e.restoreValidation(); } N(async () => { var e, a, r, p; if (((e = t.componentSchema) == null ? void 0 : e.type) === "form" && c.value && o.value) { const j = ((r = (a = t.componentSchema) == null ? void 0 : a.componentProps) == null ? void 0 : r.name) ?? ((p = t.componentSchema) == null ? void 0 : p.name) ?? "default"; c.value[j] = o.value, o.value.getData = m, o.value.setData = s; } }); const V = f(() => t.componentSchema.componentProps), b = f(() => t.componentSchema.children ?? []); return _({ clearValidate: k, form: o, getData: m, setData: s, validate: P }), (e, a) => D.value ? (v(), h("div", z, [ B(O(L), $({ ref_key: "form", ref: o, model: n }, V.value, { style: { height: "100%" } }), { default: q(() => [ g(e.$slots, "edit-node", {}, () => [ (v(!0), h(w, null, E(b.value, (r) => g(e.$slots, "node", { componentSchema: r })), 256)) ]) ]), _: 3 }, 16, ["model"]) ])) : x("", !0); } }); export { H as default };