UNPKG

@farris/ui-vue

Version:

Farris Vue, a Farris Design based Vue3 component library.

753 lines (752 loc) 23.9 kB
import { defineComponent as _r, ref as L, inject as Hr, watch as z, reactive as J, createVNode as S } from "vue"; import { mergeWith as Q, cloneDeep as Wr, merge as rr } from "lodash-es"; import Yr from "../accordion/index.esm.js"; import zr from "../../designer/avatar/index.esm.js"; import Jr from "../../designer/approval-logs/index.esm.js"; import Qr from "../../designer/button-edit/index.esm.js"; import qr from "../button-group/index.esm.js"; import Xr from "../button/index.esm.js"; import nr from "../calendar/index.esm.js"; import Zr from "../../designer/capsule/index.esm.js"; import H from "../../designer/checkbox/index.esm.js"; import er from "../../designer/checkbox-group/index.esm.js"; import sr from "../combo-list/index.esm.js"; import hr from "../combo-tree/index.esm.js"; import wr from "../component/index.esm.js"; import Sr from "../color-picker/index.esm.js"; import ir from "../content-container/index.esm.js"; import cr from "../table/index.esm.js"; import lr from "../../designer/date-picker/index.esm.js"; import pr from "../../designer/data-grid/index.esm.js"; import re from "../dropdown/index.esm.js"; import fr from "../../designer/dynamic-form/index.esm.js"; import ee from "../events-editor/index.esm.js"; import te from "../filter-bar/index.esm.js"; import oe from "../field-selector/index.esm.js"; import ne from "../binding-selector/index.esm.js"; import se from "../image-cropper/index.esm.js"; import ur from "../../designer/input-group/index.esm.js"; import ie from "../layout/index.esm.js"; import ce from "../list-nav/index.esm.js"; import ar from "../../designer/list-view/index.esm.js"; import mr from "../lookup/index.esm.js"; import le from "../mapping-editor/index.esm.js"; import pe from "../../designer/nav/index.esm.js"; import fe from "../number-range/index.esm.js"; import dr from "../../designer/number-spinner/index.esm.js"; import ue from "../order/index.esm.js"; import gr from "../page-header/index.esm.js"; import ae from "../page-footer/index.esm.js"; import me from "../pagination/index.esm.js"; import de from "../progress/index.esm.js"; import yr from "../query-solution/index.esm.js"; import br from "../../designer/radio-group/index.esm.js"; import ge from "../../designer/rate/index.esm.js"; import ye from "../../designer/response-toolbar/index.esm.js"; import Fr from "../response-layout/index.esm.js"; import be from "../../designer/response-layout-editor/index.esm.js"; import Fe from "../search-box/index.esm.js"; import vr from "../../designer/section/index.esm.js"; import ve from "../smoke-detector/index.esm.js"; import Ee from "../splitter/index.esm.js"; import Ce from "../step/index.esm.js"; import Er from "../../designer/switch/index.esm.js"; import Cr from "../../designer/tabs/index.esm.js"; import Pe from "../../designer/tags/index.esm.js"; import ke from "../text/index.esm.js"; import Pr from "../../designer/time-picker/index.esm.js"; import Re from "../transfer/index.esm.js"; import Te from "../tree-view/index.esm.js"; import Oe from "../uploader/index.esm.js"; import Me from "../verify-detail/index.esm.js"; import je from "../video/index.esm.js"; import kr from "../../designer/textarea/index.esm.js"; import Ae from "../schema-selector/index.esm.js"; import De from "../../designer/tree-grid/index.esm.js"; import Ve from "../event-parameter/index.esm.js"; import Ne from "../filter-condition-editor/index.esm.js"; import Rr from "../fieldset/index.esm.js"; import Ke from "../sort-condition-editor/index.esm.js"; import Ie from "../menu-lookup/index.esm.js"; import xe from "../../designer/drawer/index.esm.js"; import Be from "../json-editor/index.esm.js"; import Le from "../property-editor/index.esm.js"; import Ue from "../expression-editor/index.esm.js"; import Ge from "../code-editor/index.esm.js"; import Tr from "../html-template/index.esm.js"; import $e from "../collection-property-editor/index.esm.js"; import _e from "../../designer/modal/index.esm.js"; import He from "../external-container/index.esm.js"; import Or from "../language-textbox/index.esm.js"; import Mr from "../image/index.esm.js"; import We from "../comment/index.esm.js"; import Ye from "../../designer/wizard/index.esm.js"; import { schemaResolverMap as ze, propertyEffectMap as Je, propertyConfigSchemaMap as Qe, schemaMap as qe, createPropsResolver as Xe, createEventsResolver as jr, createFormBindingResolver as Ze } from "../dynamic-resolver/index.esm.js"; import { useThirdComponent as he, withInstall as we } from "../common/index.esm.js"; const Se = { /** * schema */ schema: { type: Object, default: null }, /** * 组件值 */ modelValue: { type: Object, default: null }, /** * 回调 */ callback: { type: Function, default: () => { } }, /** * 自定义组件渲染器 */ customComponentRenders: { type: Object, default: null } }, { globalStorageKey: rt } = he(), o = {}, n = {}, s = {}, t = {}, $o = [ pr, yr, Rr, ur, dr, lr, Or, mr, fr, Mr, H, H, sr, br, Er, kr, Pr, Fr, vr, gr, Cr, ar, ir, cr, Tr, nr ]; async function et() { { const e = { schemaMap: qe, propertyConfigSchemaMap: Qe, propertyEffectMap: Je, schemaResolverMap: ze }; zr.register(o, n, s, t), Yr.register(o, n, s, t), Jr.register(o, n, s, t, e), Qr.register(o, n, s, t), qr.register(o, n, s, t), Xr.register(o, n, s, t), nr.register(o, n, s, t, e), Zr.register(o, n, s, t), H.register(o, n, s, t, e), er.register(o, n, s, t, e), H.register(o, n, s, t, e), er.register(o, n, s, t, e), sr.register(o, n, s, t, e), hr.register(o, n, s, t, e), wr.register(o, n, s, t), ir.register(o, n, s, t, e), cr.register(o, n, s, t, e), Sr.register(o, n, s, t, e), lr.register(o, n, s, t, e), pr.register(o, n, s, t, e), re.register(o, n, s, t), fr.register(o, n, s, t, e), ee.register(o, n, s, t), Ue.register(o, n, s, t), te.register(o, n, s, t, e), oe.register(o, n, s, t), Ne.register(o, n, s, t), se.register(o, n, s, t, e), ur.register(o, n, s, t, e), ie.register(o, n, s, t, e), ar.register(o, n, s, t, e), ce.register(o, n, s, t), mr.register(o, n, s, t, e), le.register(o, n, s, t), pe.register(o, n, s, t, e), fe.register(o, n, s, t, e), dr.register(o, n, s, t, e), ue.register(o, n, s, t), gr.register(o, n, s, t, e), ae.register(o, n, s, t), me.register(o, n, s, t, e), de.register(o, n, s, t, e), yr.register(o, n, s, t, e), br.register(o, n, s, t, e), ge.register(o, n, s, t, e), Fr.register(o, n, s, t, e), be.register(o, n, s, t), ye.register(o, n, s, t, e), Ae.register(o, n, s), Fe.register(o, n, s, t, e), vr.register(o, n, s, t, e), ve.register(o, n, s, t), Ee.register(o, n, s, t, e), Ce.register(o, n, s, t, e), Er.register(o, n, s, t, e), Ke.register(o, n, s, t), Cr.register(o, n, s, t, e), Pe.register(o, n, s, t, e), ke.register(o, n, s, t), Pr.register(o, n, s, t, e), Re.register(o, n, s, t, e), Te.register(o, n, s, t, e), Me.register(o, n, s, t), Oe.register(o, n, s, t, e), je.register(o, n, s, t), kr.register(o, n, s, t, e), De.register(o, n, s, t, e), ne.register(o, n, s, t, e), Ve.register(o, n, s, t, e), Rr.register(o, n, s, t, e), Ie.register(o, n, s, t, e), xe.register(o, n, s, t, e), Be.register(o, n, s, t, e), Le.register(o, n, s, t, e), Ge.register(o, n, s, t), Tr.register(o, n, s, t, e), $e.register(o, n, s, t), _e.register(o, n, s, t), He.register(o, n, s, t), Or.register(o, n, s, t, e), Mr.register(o, n, s, t, e), We.register(o, n, s, t, e), Ye.register(o, n, s, t, e); const F = window[rt]; if (F) for (const y in F) F[y].createPropsResolver = Xe, F[y].register(o, n, s); } } function _o(e) { e && typeof e.register == "function" && e.register(o, n, s, t); } function Ar(e, F) { function y(R, d, p, f) { e.emit("event", { token: R, name: d, type: p, payloads: f, schema: F }); } return { dispatch: y }; } function tt() { const e = /* @__PURE__ */ new Map(); function F(m, a) { e.set(m, a); } function y(m) { const a = e.get(m); return a || (console.warn(`Instance with id ${m} not found`), null); } function R(m) { e.delete(m); } function d(m, a) { if (!e.has(m)) { console.warn(`Instance with id ${m} not found`); return; } e.set(m, a); } function p(m) { return e.has(m); } function f() { return new Map(e); } function v() { e.clear(); } return { register: F, get: y, remove: R, update: d, has: p, getAll: f, clear: v }; } function tr(e, F) { function y(f) { return e.value && e.value[f]; } const R = []; function d(f) { R.push(f); } function p(f, v, m) { const a = e.value ? e.value[f] : void 0; e.value && (e.value[f] = m), v && (F && F.emit("update:modelValue", { elementId: f, field: v, value: m, modelValue: e.value }), R.forEach((P) => { P({ elementId: f, field: v, value: m, oldValue: a, modelValue: e.value }); })); } return { getValue: y, setValue: p, onValueChange: d }; } function Dr(e) { function F() { var y, R; return ((R = (y = e == null ? void 0 : e.module) == null ? void 0 : y.entity[0]) == null ? void 0 : R.entities[0]) || {}; } return { getSchemaEntity: F }; } function ot(e) { const { getSchemaEntity: F } = Dr(e); function y(p) { const f = F(); return d(f, p); } function R(p) { var P, b; const f = []; function v(M, N) { var V; const A = [...N, M.label]; (((V = p == null ? void 0 : p.type) == null ? void 0 : V.primary) || null) && f.push({ bindingPaths: A, primaryKey: M.type.primary, label: M.label }), M.type.entities.forEach((K) => { v(K, A); }); } return (((P = p == null ? void 0 : p.type) == null ? void 0 : P.primary) || null) && (f.push({ bindingPaths: [], primaryKey: p.type.primary, label: p.label }), (((b = p == null ? void 0 : p.type) == null ? void 0 : b.entities) || []).forEach((M) => { v(M, []); })), f; } function d(p, f, v = !0) { const m = v ? [] : [p.label]; if (p.label === f) return { bindingPaths: m, primaryKey: p.type.primary, label: p.label }; for (const a of p.type.entities) { const P = d(a, f, !1); if (P) return { bindingPaths: [...m, ...P.bindingPaths], primaryKey: P.primaryKey, label: P.label }; } return null; } return { resolveEntityByDataSource: y, resolveEntity: d, resolveEntities: R }; } function nt(e) { const F = {}, { getSchemaEntity: y } = Dr(e), { resolveEntities: R } = ot(e); function d() { const f = y(); R(f).forEach((m) => { const a = "/" + m.bindingPaths.join("/"), { primaryKey: P } = m, b = { primaryKey: P, bindingPath: a, label: m.label, currentId: null }; F[a] = b; }); } function p(f) { return Array.isArray(f) ? f = "/" + f.join("/") : f = "/" + f.split("/").filter((v) => v).join("/"), F[f]; } return { setup: d, get: p }; } function st(e) { function F(y, R, d, p) { return e(y, R, d, p); } return { call: F }; } const or = { COMPONENT_READY: "component:ready", COMPONENT_UNMOUNTED: "component:unmounted" }; function it() { function e(d, p) { if (Array.isArray(d) && Array.isArray(p)) { const f = /* @__PURE__ */ new Map(), v = p.find((b) => b && typeof b == "object"); if (!v) return p; const a = ["id"].find((b) => v[b] != null); return a ? (d.forEach((b) => { b[a] != null && f.set(b[a], b); }), p.forEach((b) => { if (b[a] != null) { const M = f.get(b[a]); M ? f.set(b[a], Q(M, b, e)) : f.set(b[a], Wr(b)); } }), Array.from(f.values())) : p; } } function F(d) { function p(f, v, m, a) { return d ? d(f, v, m, a) : !0; } return { call: p }; } function y(d, p, f = "") { const v = d.type || f, m = t[v]; if (!m || Object.keys(m).length < 1) return { componentCallbackProps: {} }; const { callbackResolver: a, editorResolver: P } = m, b = F(p.value); let M = {}; a && (M = a.resolve(d, b)); let N = {}; if (P) { const A = P.resolve(d), x = A.type, V = t[x], { callbackResolver: K } = V || {}; K && (N = K.resolve(d, b, A)); } return { componentCallbackProps: M, editorCallbackProps: N }; } function R(d, p, f = "") { const v = d.type || f, m = Ar(p, d), a = o[v], P = jr(), b = t[v], M = b ? b.editorResolver : null; if (M) { const A = P ? P(a, d, m) : {}, V = M.resolve(d).type, K = o[V], W = P ? P(K, d, m) : {}; return { componentEventProps: A, editorEventProps: W }; } return { componentEventProps: P ? P(a, d, m) : {} }; } return { mergeArray: e, resolveCallbacks: y, resolveEvents: R }; } const ct = /* @__PURE__ */ _r({ name: "FDynamicView", props: Se, emits: ["update:modelValue", "event"], setup(e, F) { const y = L(e.schema), R = L(e.modelValue), d = L(e.callback), { customComponentRenders: p } = e, f = Hr("parent"), v = /* @__PURE__ */ new Map(), m = /* @__PURE__ */ new Map(); et(); const a = tt(), P = tr(R, F), b = L({}), M = tr(b), N = nt(y.value); N.setup(); const A = /* @__PURE__ */ new Map(), { mergeArray: x } = it(); P.onValueChange((r) => { const { elementId: i, field: l, value: c } = r, u = A.get(i); u ? Object.assign(u == null ? void 0 : u.props, { modelValue: c }) : A.set(i, J({ props: { modelValue: c } })); }); function V(r) { const i = r.type, { dataSource: l = void 0, binding: c = void 0 } = r; if (l === void 0 && c === void 0) return {}; let u = P; (c === null || l === null) && (u = M), l && m.set(l, r); const E = t[i]; return (E && E.bindingResolver ? E.bindingResolver : Ze()).resolve(r, u); } function K(r) { const i = {}; return r && Object.entries(r).forEach(([l, c]) => { i[l] = () => Array.isArray(c) ? c.map((u) => I(u)) : I(c); }), i; } function W(r) { const i = r.type, l = t[i]; if (!l || Object.keys(l).length < 1) return { componentCallbackProps: {} }; const { callbackResolver: c, editorResolver: u } = l, E = st(d.value); let g = {}; c && (g = c.resolve(r, E)); let D = {}; if (u) { const C = u.resolve(r); if (C && C.type) { const k = C.type, T = t[k], { callbackResolver: j } = T || {}; j && (D = j.resolve(r, E, C)); } } return { componentCallbackProps: g, editorCallbackProps: D }; } function Vr(r) { const i = r.type, l = Ar(F, r), c = o[i], u = jr(), E = t[i], g = E ? E.editorResolver : null; if (g) { const C = u ? u(c, r, l) : {}, k = g.resolve(r); if (!k || !k.type) return { componentEventProps: C, editorEventProps: {} }; const T = k.type, j = o[T], O = u && j ? u(j, r, l) : {}; return { componentEventProps: C, editorEventProps: O }; } return { componentEventProps: u ? u(c, r, l) : {} }; } function Nr(r) { return {}; } function Kr(r) { var C, k; const i = r.type, l = n[i], c = l ? l(r) : {}, u = { ...Vr(r) }, E = { ...W(r) }, g = { ...c, ...V(r), ...Nr() }; return i === "component" && (g.code = (k = (C = y.value) == null ? void 0 : C.module) == null ? void 0 : k.code, g.parent = f), { props: { ...g, key: r.id, ref: (T) => { if (T && r.id && !a.has(r.id)) { a.register(r.id, T); const j = { token: r.id, name: or.COMPONENT_READY, type: r.type, payloads: [L(T)], schema: r }; F.emit("event", j); } }, onVnodeUnmounted: (T) => { if (r.id && a.has(r.id)) { a.remove(r.id); const j = { token: r.id, name: or.COMPONENT_UNMOUNTED, type: r.type, payloads: [T], schema: r }; F.emit("event", j); } } }, eventProps: u, callbackProps: E }; } function I(r, i) { var D; const l = r.type, c = o[l]; if (p && p[l]) return p[l](r, c, i); if (l === "component-ref") { const C = $().find((k) => k.id === r.component); if (C) return I(C); } if (r.id && v.set(r.id, r), !c) return null; const u = () => r.contents ? typeof r.contents == "string" ? r.contents : r.contents.map((C) => I(C, r)) : null, E = (C, k, T) => { let j; return T ? j = S(C, { ...k }, T) : j = S(C, { ...k }, null), j; }, g = ((D = A.get(r.id)) == null ? void 0 : D.props) || {}; if (l === "table") { const C = {}; return r.rows && r.rows.forEach((k) => { k.columns && k.columns.forEach((T) => { T.tdType === "editor" && (C[T.id] = () => I({ ...T, type: "table-td" }, r)); }); }), E(c, g, C); } return r.contents && r.contents.length > 0 ? E(c, g, [u()]) : r.slots ? E(c, g, [...Object.values(K(r.slots))]) : E(c, g); } function q(r) { r.$forceUpdate && r.$forceUpdate(); } function Ir(r) { const i = r.type, l = n[i]; return l ? l(r) : {}; } function xr(r) { return M.getValue(r); } function Br(r, i) { M.setValue(r, void 0, i); const l = Y(r); l && h(l); } function Y(r) { return v.get(r); } function Lr(r, i) { const l = v.get(r); if (!l) return; const c = a.get(r); if (!c) return; rr(l, i); const u = l.type, E = t[u], g = E ? E.updateColumnsResolver : null; g && g.updateColumns(c, l), q(c); } function Ur(r) { var i; return (i = A.get(r)) == null ? void 0 : i.props; } function X(r, i, l) { const c = A.get(r); if (!c) return; (l == null ? void 0 : l.mergeStrategy) === "replace" ? Q(c.props, i, (E, g) => { if (Array.isArray(g)) return g; }) : Q(c == null ? void 0 : c.props, i, x); const u = Y(r); u && u.type === "table" && i.rows && Array.isArray(i.rows) && i.rows.forEach((E) => { E.columns && Array.isArray(E.columns) && E.columns.forEach((g) => { if (g.id) { const D = Z("table-td", g); X(g.id, D, l); } }); }); } function Gr(r, i, ...l) { const c = a.get(r); if (c) { if (!c || typeof c[i] != "function") throw new Error(`Method ${i} not found on instance ${r}`); return c[i](...l); } } function $r(r, i) { const l = N.get(r); if (!l) return; const c = l.label, u = m.get(c); if (!u) return; const E = u.type, g = t[E], D = g ? g.selectionItemResolver : null; if (D) { const C = a.get(u.id); D.selectItemById(C, i); } } function U(r) { const i = r.type; if (i === "component-ref") { const O = $().find((_) => _.id === r.component); if (O) return U(O); } if (!o[i]) return; const { props: c, eventProps: u, callbackProps: E } = Kr(r), g = t[i], D = g ? g.editorResolver : null, { componentEventProps: C, editorEventProps: k } = u, { componentCallbackProps: T, editorCallbackProps: j } = E; if (C && Object.keys(C).length > 0 && Object.assign(c, C), T && Object.keys(T).length > 0 && Object.assign(c, T), D && k && Object.keys(k).length > 0) { const O = D.resolve(r); O && Object.assign(O, k), c && c.editor && Object.assign(c.editor, k); } if (D && j && Object.keys(j).length > 0) { const O = D.resolve(r); O && Object.assign(O, j), c && c.editor && Object.assign(c.editor, j); } if (c && Object.keys(c).length > 0) { const O = A.get(r.id); O ? rr(O == null ? void 0 : O.props, c) : A.set(r.id, J({ props: c })); } r.type === "table" && r.rows && r.rows.forEach((O) => { O.columns && O.columns.forEach((_) => { _.tdType === "editor" && U({ ..._, type: "table-td" }); }); }), !(!r.contents || !Array.isArray(r.contents)) && r.contents.forEach((O) => U(O)); } function Z(r, i) { const l = n[r]; return l ? l(i, !1) : {}; } function B(r) { const i = r.type; if (i === "component-ref") { const c = $().find((u) => u.id === r.component); if (c) return B(c); } o[i] && (h(r), i === "table" && r.rows && r.rows.forEach((c) => { c.columns && c.columns.forEach((u) => { u.tdType === "editor" && B({ ...u, type: "table-td" }); }); }), !(!r.contents || !Array.isArray(r.contents)) && r.contents.forEach((c) => B(c))); } function G() { var l, c; if (!y.value) return null; const r = $(); if (!r || !Array.isArray(r) || r.length < 1) return typeof y.value == "object" ? y.value : null; const i = r.find((u) => u.componentType && u.componentType.toLowerCase() === "frame"); return i ? (i.formCode = (c = (l = y.value) == null ? void 0 : l.module) == null ? void 0 : c.code, i) : typeof y.value == "object" ? y.value : null; } function h(r) { const i = V(r); if (i && Object.keys(i).length > 0) { const l = A.get(r.id); if (!l) A.set(r.id, J({ props: i })); else { const c = { ...l == null ? void 0 : l.props }; Object.keys(i).forEach((u) => { c[u] = i[u]; }), Object.assign(l == null ? void 0 : l.props, c); } } } function $() { var r, i; return (i = (r = y.value) == null ? void 0 : r.module) == null ? void 0 : i.components; } z(() => e.modelValue, (r) => { R.value = r; const i = G(); i && B(i); }), z(() => b.value, (r) => { const i = G(); i && B(i); }, { deep: !0 }); function w(r) { if (r) { y.value = r; const i = G(); if (!i) return; U(i); } } return z(() => e.schema, (r) => { w(r); }), w(e.schema), F.expose({ componentManager: a, rerender: q, getProps: Ur, invoke: Gr, setProps: X, selectItemById: $r, getSchema: Y, setSchema: Lr, convertPartialSchemaToProps: Z, getControlValue: xr, setControlValue: Br, resolveViewProps: Ir }), () => { const r = G(); return r ? I(r) : null; }; } }), Ho = we(ct); export { ct as FDynamicView, o as componentMap, n as componentPropsConverter, $o as componentsForRegister, Ho as default, Se as dynamicViewProps, et as loadRegister, _o as registerComponent, t as resolverMap, tr as useBindingData, tt as useComponentManager, it as useDynamicViewUtils, nt as useEntityState, Dr as useFormSchema };