UNPKG

@farris/ui-vue

Version:

Farris Vue, a Farris Design based Vue3 component library.

1,503 lines 58.6 kB
var ve = Object.defineProperty; var be = (t, e, n) => e in t ? ve(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n; var F = (t, e, n) => be(t, typeof e != "symbol" ? e + "" : e, n); import { ref as O, computed as U, defineComponent as Q, provide as q, onMounted as he, nextTick as Ce, createVNode as M, createTextVNode as $, inject as H, watch as ye } from "vue"; import { FButtonEdit as xe } from "../button-edit/index.esm.js"; import { isPlainObject as G, cloneDeep as j } from "lodash-es"; import { FPropertyPanel as we } from "../property-panel/index.esm.js"; import { FTreeView as Se } from "../tree-view/index.esm.js"; import { FMessageBoxService as X } from "../message-box/index.esm.js"; import { DgControl as J, canvasChanged as Ee, refreshCanvas as Pe } from "../designer-canvas/index.esm.js"; function Y(t, e) { let n; function r(l) { const { properties: p, title: h, ignore: c } = l, f = c && Array.isArray(c), u = Object.keys(p).reduce((b, x) => ((!f || !c.find((T) => T === x)) && (b[x] = p[x].type === "object" && p[x].properties ? r(p[x]) : j(p[x].default)), b), {}); if (h && (!f || !c.find((b) => b === "id"))) { const b = h.toLowerCase().replace(/-/g, "_"); u.id = `${b}_${Math.random().toString().slice(2, 6)}`; } return u; } function o(l) { const { properties: p, title: h, required: c } = l; if (c && Array.isArray(c)) { const f = c.reduce((u, b) => (u[b] = p[b].type === "object" && p[b].properties ? r(p[b]) : j(p[b].default), u), {}); if (h && c.find((u) => u === "id")) { const u = h.toLowerCase().replace(/-/g, "_"); f.id = `${u}_${Math.random().toString().slice(2, 6)}`; } return f; } return { type: h }; } function a(l, p = {}, h) { const c = t[l]; if (c) { let f = o(c); const u = e[l]; return f = u ? u({ getSchemaByType: a }, f, p, h) : f, n != null && n.appendIdentifyForNewControl && n.appendIdentifyForNewControl(f), f; } return null; } function i(l, p) { const h = r(p); return Object.keys(h).reduce((c, f) => (Object.prototype.hasOwnProperty.call(l, f) && (c[f] && G(c[f]) && G(l[f] || !l[f]) ? Object.assign(c[f], l[f] || {}) : c[f] = l[f]), c), h), h; } function g(l, p) { return Object.keys(l).filter((c) => l[c] != null).reduce((c, f) => { if (p.has(f)) { const u = p.get(f); if (typeof u == "string") c[u] = l[f]; else { const b = u(f, l[f], l); Object.assign(c, b); } } else c[f] = l[f]; return c; }, {}); } function s(l, p, h = /* @__PURE__ */ new Map()) { const c = i(l, p); return g(c, h); } function d(l) { var h; const p = l.type; if (p) { const c = t[p]; if (!c) return l; const f = i(l, c), u = ((h = l.editor) == null ? void 0 : h.type) || ""; if (u) { const b = t[u], x = i(l.editor, b); f.editor = x; } return f; } return l; } function m(l) { n = l; } return { getSchemaByType: a, resolveSchemaWithDefaultValue: d, resolveSchemaToProps: s, mappingSchemaToProps: g, setDesignerContext: m }; } const Z = {}, K = {}, { resolveSchemaWithDefaultValue: Fe, resolveSchemaToProps: Te, mappingSchemaToProps: Me } = Y(Z, K); function Ie(t = {}) { function e(d, m, l, p) { if (typeof l == "number") return p[d].length === l; if (typeof l == "object") { const h = Object.keys(l)[0], c = l[h]; if (h === "not") return Number(p[d].length) !== Number(c); if (h === "moreThan") return Number(p[d].length) >= Number(c); if (h === "lessThan") return Number(p[d].length) <= Number(c); } return !1; } function n(d, m, l, p) { return p[d] && p[d].propertyValue && String(p[d].propertyValue.value) === String(l); } const r = /* @__PURE__ */ new Map([ ["length", e], ["getProperty", n] ]); Object.keys(t).reduce((d, m) => (d.set(m, t[m]), d), r); function o(d, m) { const l = d; return typeof m == "number" ? [{ target: l, operator: "length", param: null, value: Number(m) }] : typeof m == "boolean" ? [{ target: l, operator: "getProperty", param: d, value: !!m }] : typeof m == "object" ? Object.keys(m).map((p) => { if (p === "length") return { target: l, operator: "length", param: null, value: m[p] }; const h = p, c = m[p]; return { target: l, operator: "getProperty", param: h, value: c }; }) : []; } function a(d) { return Object.keys(d).reduce((l, p) => { const h = o(p, d[p]); return l.push(...h), l; }, []); } function i(d, m) { if (r.has(d.operator)) { const l = r.get(d.operator); return l && l(d.target, d.param, d.value, m) || !1; } return !1; } function g(d, m) { return a(d).reduce((h, c) => h && i(c, m), !0); } function s(d, m) { const l = Object.keys(d), p = l.includes("allOf"), h = l.includes("anyOf"), c = p || h, b = (c ? d[c ? p ? "allOf" : "anyOf" : "allOf"] : [d]).map((T) => g(T, m)); return p ? !b.includes(!1) : b.includes(!0); } return { parseValueSchema: s }; } const Ve = { convertTo: (t, e, n, r) => { t.appearance || (t.appearance = {}), t.appearance[e] = n; }, convertFrom: (t, e, n) => t.appearance ? t.appearance[e] : t[e] }, ke = { convertFrom: (t, e, n) => t.buttons && t.buttons.length ? `共 ${t.buttons.length} 项` : "无" }, Oe = { convertTo: (t, e, n, r) => { t.editor && (t.editor[e] = n); }, convertFrom: (t, e, n) => t.editor && Object.prototype.hasOwnProperty.call(t.editor, e) ? t.editor[e] : t[e] }, Ne = { button: { type: "button", name: "按钮" }, "response-toolbar": { type: "response-toolbar", name: "工具栏" }, "response-toolbar-item": { type: "response-toolbar-item", name: "按钮" }, "content-container": { type: "content-container", name: "容器" }, "input-group": { type: "input-group", name: "文本" }, textarea: { type: "textarea", name: "多行文本" }, lookup: { type: "lookup", name: "帮助" }, "number-spinner": { type: "number-spinner", name: "数值" }, "date-picker": { type: "date-picker", name: "日期" }, switch: { type: "switch", name: "开关" }, "radio-group": { type: "radio-group", name: "单选组" }, "check-box": { type: "check-box", name: "复选框" }, "check-group": { type: "check-group", name: "复选框组" }, "combo-list": { type: "combo-list", name: "下拉列表" }, "response-form": { type: "response-form", name: "卡片面板" }, "response-layout": { type: "response-layout", name: "布局容器", icon: "response-layout-3" }, "response-layout-item": { type: "response-layout-item", name: "布局", icon: "response-layout-1" }, "tree-grid": { type: "tree-grid", name: "树表格" }, "tree-grid-column": { type: "tree-grid-column", name: "树表格列" }, "data-grid": { type: "data-grid", name: "表格" }, "data-grid-column": { type: "data-grid-column", name: "表格列" }, module: { type: "Module", name: "模块" }, component: { type: "component", name: "组件" }, tabs: { type: "tabs", name: "标签页" }, "tab-page": { type: "tab-page", name: "标签页项", dependentParentControl: "Tab" }, "tab-toolbar-item": { type: "tab-toolbar-item", name: "标签页工具栏按钮" }, "drawer-toolbar-item": { type: "drawer-toolbar-item", name: "抽屉工具栏按钮" }, "html-template": { type: "html-template", name: "模板容器" }, "time-picker": { type: "time-picker", name: "时间选择" }, section: { type: "section", name: "分组面板" }, "section-toolbar": { type: "section-toolbar", name: "分组面板工具栏" }, "section-toolbar-item": { type: "section-toolbar-item", name: "分组面板按钮" }, splitter: { type: "splitter", name: "分栏面板" }, "splitter-pane": { type: "splitter-pane", name: "分栏面板项", dependentParentControl: "Splitter" }, "component-ref": { type: "component-ref", name: "组件引用节点" }, uploader: { type: "uploader", name: "附件上传" }, "page-header": { type: "page-header", name: "页头" }, "page-footer": { type: "page-footer", name: "页脚" }, "tab-toolbar": { type: "tab-toolbar", name: "标签页工具栏" }, "drawer-toolbar": { type: "drawer-toolbar", name: "抽屉工具栏" }, fieldset: { type: "fieldset", name: "分组" }, "query-solution": { type: "query-solution", name: "筛选方案" }, drawer: { type: "drawer", name: "抽屉" }, "external-container": { type: "external-container", name: "外部容器", icon: "content-container" }, "list-nav": { type: "list-nav", name: "列表导航" }, "list-view": { type: "list-view", name: "列表" }, "filter-bar": { type: "filter-bar", name: "筛选条" }, "language-textbox": { type: "language-textbox", name: "多语输入框" }, image: { type: "image", name: "图像" }, "discussion-editor": { type: "discussion-editor", name: "评论编辑区" }, "discussion-list": { type: "discussion-list", name: "评论列表" }, comment: { type: "comment", name: "评论区" }, "rich-text-editor": { type: "rich-text-editor", name: "富文本", icon: "rich-text-box" }, calendar: { type: "calendar", name: "日历", icon: "date-picker" }, wizard: { type: "wizard", name: "向导", icon: "wizard" }, "wizard-page": { type: "wizard-page", name: "向导页", icon: "wizard" }, "wizard-page-detail": { type: "wizard-page-detail", name: "向导详情", icon: "wizard" }, step: { type: "step", name: "步骤条", icon: "step" }, "dynamic-form": { type: "dynamic-form", name: "动态表单" } }, Re = { convertFrom: (t, e, n) => { var o; const r = t.editor && t.editor[e] ? t.editor[e] : t[e]; return ((o = Ne[r]) == null ? void 0 : o.name) || r; } }, Be = { convertTo: (t, e, n, r) => { t[e] = t[e]; }, convertFrom: (t, e, n) => t.editor ? n.getRealEditorType(t.editor.type) : "" }, Ue = { convertTo: (t, e, n, r) => { (t.type === "data-grid-column" || t.type === "tree-grid-column") && (t.formatter ? t.formatter[e] = n : t.formatter = { [e]: n }); }, convertFrom: (t, e, n) => { if (t.formatter) { if (e === "trueText") return t.formatter.trueText; if (e === "falseText") return t.formatter.falseText; if (e === "prefix") return t.formatter.prefix; if (e === "suffix") return t.formatter.suffix; if (e === "precision") return t.formatter.precision; if (e === "decimal") return t.formatter.decimal; if (e === "thousand") return t.formatter.thousand; if (e === "dateFormat") return t.formatter.dateFormat || "yyyy-MM-dd"; if (e === "customFormat") return t.formatter.customFormat; if (e === "type") return t.formatter.type || "none"; if (e === "customFormat") return t.formmater.customFormat; } return "none"; } }, je = { convertTo: (t, e, n, r) => { t.command ? t.command[e] = n : t.command = { [e]: n }, e === "enableType" && n === "default" && (t.command.enable = !0, t.command.commands = [ { text: "编辑", type: "primary", command: "edit" }, { text: "删除", type: "danger", command: "remove" } ]), e === "enableType" && n === "custom" && (t.command.enable = !0, t.command.commands = [ { value: "add", text: "增加", type: "link" }, { value: "edit", text: "编辑", type: "danger" }, { value: "remove", text: "删除", type: "remove" } ]), e === "enableType" && n === "unable" && (t.command.enable = !1); }, convertFrom: (t, e, n) => { var r, o; if (t.command) { if (e === "enableType") { const a = (o = (r = t.command) == null ? void 0 : r.commands) == null ? void 0 : o.find((i) => i.command === "edit" && i.type === "primary"); return t.command.enable ? a ? "default" : "custom" : "unable"; } if (e === "commands") return t.command.enableType === "custom" ? t.command.commands : []; if (e === "formatter") return t.command.formatter; if (e === "count") return t.command.count; if (e === "columnWidth") return t.command.columnWidth || 200; } return ""; } }, $e = { convertTo: (t, e, n, r) => { t.column ? t.column[e] = n : t.column = { [e]: n }, e === "fitColumns" && n && (t.column.fitMode || (t.column.fitMode = "average")); }, convertFrom: (t, e, n) => { if (t.column) { if (e === "fitColumns") return t.column.fitColumns; if (e === "fitMode") return t.column.fitMode; } return ""; } }, De = { convertTo: (t, e, n, r) => { t.summary ? t.summary[e] = n : t.summary = { [e]: n }, e === "enable" && n && (t.summary ? t.summary.groupFields || (t.summary.groupFields = []) : t.summary = { enable: n, groupFields: [] }); }, convertFrom: (t, e, n) => { var r, o; return e === "customSummaryStyle" ? t.summary.customSummaryStyle : e === "position" ? ((r = t.summary) == null ? void 0 : r[e]) || "bottom" : e === "customRender" ? ((o = t.summary) == null ? void 0 : o[e]) || "" : t.summary && e === "enable" ? t.summary.enable : t.type === "data-grid-column" ? t.enableSummary === void 0 ? !1 : t.enableSummary : ""; } }, ze = { convertTo: (t, e, n, r) => { t.group ? t.group[e] = n : t.group = { [e]: n }, e === "enable" && n && (t.group ? t.group.groupFields || (t.group.groupFields = []) : t.group = { enable: n, groupFields: [], showSummary: !1, customRender: "" }); }, convertFrom: (t, e, n) => { if (t.group) { if (e === "enable") return t.group.enable; if (e === "showSummary") return t.group.showSummary; if (e === "customRender") return t.group.customRender; if (e === "groupFields") return t.group.groupFields; } } }, Ae = { convertFrom: (t, e) => t.binding ? t.binding.path : "", convertTo: (t, e, n) => { if (n && n.length > 0) { const r = n[0]; t.binding || (t.binding = {}), t.binding.type = "Form", t.binding.path = r.bindingField, t.binding.field = r.id, t.binding.fullPath = r.path, t.path = r.bindingPath; } } }, Le = { convertTo: (t, e, n, r) => { t.pagination || (t.pagination = {}), e === "sizeLimits" ? t.pagination.sizeLimits = n.split(",") : t.pagination[e] = n; }, convertFrom: (t, e, n) => t.pagination ? e === "sizeLimits" ? t.pagination.sizeLimits.join(",") : t.pagination[e] : t[e] }, qe = { convertTo: (t, e, n, r) => { t.rowNumber || (t.rowNumber = {}), t.rowNumber[e] = n; }, convertFrom: (t, e, n) => t.rowNumber ? t.rowNumber[e] : t[e] }, _e = { convertTo: (t, e, n, r) => { t.selection || (t.selection = {}), t.selection[e] = n; }, convertFrom: (t, e, n) => { var r, o; return e === "showCheckbox" ? (r = t.selection) != null && r.multiSelect ? !0 : (o = t.selection) == null ? void 0 : o.showCheckbox : t.selection ? t.selection[e] : t[e]; } }, We = { convertFrom: (t, e, n) => t[e] && t[e].length ? `共 ${t[e].length} 项` : "" }, He = { convertFrom: (t, e) => t[e] || "", convertTo: (t, e, n) => { t[e] = n; } }, Ge = { convertTo: (t, e, n, r) => { t.size || (t.size = {}), t.size[e] = n; }, convertFrom: (t, e, n) => t.size ? t.size[e] : t[e] }, Je = { convertFrom: (t, e, n) => { var r, o; return (r = t.formatter) != null && r.data && e === "formatterEnumData" && !t.formatterEnumData ? (o = t.formatter) == null ? void 0 : o.data : t.formatterEnumData; } }, Qe = { convertTo: (t, e, n, r) => { t.sort || (t.sort = {}), t.sort[e] = n; }, convertFrom: (t, e, n) => { var r, o; if (e === "mode") return ((r = t.sort) == null ? void 0 : r.mode) || "client"; if (e === "multiSort") return !!((o = t.sort) != null && o.multiSort); } }, Xe = { convertTo: (t, e, n, r) => { t.filter || (t.filter = {}), t.filter[e] = n; }, convertFrom: (t, e, n) => { var r; if (e === "mode") return ((r = t.filter) == null ? void 0 : r.mode) || "client"; } }, Ye = { convertTo: (t, e, n, r) => { t.rowOption ? t.rowOption[e] = n : t.rowOption = { [e]: n }; }, convertFrom: (t, e, n) => { if (t.rowOption) { if (e === "customRowStyle") return t.rowOption.customRowStyle; if (e === "customCellStyle") return t.rowOption.customCellStyle; if (e === "height") return t.rowOption.height; } return ""; } }, Ze = { convertTo: (t, e, n, r) => { (t.type === "data-grid-column" || t.type === "tree-grid-column") && (t[e] = n, e === "columnTemplateType" && n === "hyperlink" && (t.onClickLinkCommand ? t.columnTemplate = ` <span class="f-pretend-link f-cursor-pointer" @click="(ctx)=>viewModel.current.${t.onClickLinkCommand || ""}({id: rowData.id,context: ctx})"> {{rowData.${t.field}}} </span>` : t.columnTemplate = ` <span class="f-pretend-link f-cursor-pointer"> {{rowData.${t.field}}} </span>`), e === "columnTemplateType" && n === "default" && (t.columnTemplate = ""), e === "columnTemplateType" && n === "custom" && (t.columnTemplate = "")); }, convertFrom: (t, e, n) => e === "columnTemplate" ? t.columnTemplate : e === "columnTemplateType" ? t.columnTemplateType ? t.columnTemplateType || "default" : t.columnTemplate && !t.onClickLinkCommand ? "custom" : t.columnTemplate && t.onClickLinkCommand ? "hyperlink" : "default" : "" }; function ee(t, e, n) { const r = /* @__PURE__ */ new Map([ ["/converter/appearance.converter", Ve], ["/converter/buttons.converter", ke], ["/converter/property-editor.converter", Oe], ["/converter/items-count.converter", We], ["/converter/type.converter", Re], ["/converter/change-editor.converter", Be], ["/converter/change-formatter.converter", Ue], ["/converter/column-command.converter", je], ["/converter/column-option.converter", $e], ["/converter/summary.converter", De], ["/converter/group.converter", ze], ["/converter/form-group-label.converter", He], ["/converter/field-selector.converter", Ae], ["/converter/pagination.converter", Le], ["/converter/row-number.converter", qe], ["/converter/grid-selection.converter", _e], ["/converter/size.converter", Ge], ["/converter/change-formatter-enum.converter", Je], ["/converter/grid-sort.converter", Qe], ["/converter/grid-filter.converter", Xe], ["/converter/row-option.converter", Ye], ["/converter/change-formatter-type.converter", Ze] ]), o = /* @__PURE__ */ new Map([ ["string", { type: "input-group", enableClear: !1 }], ["boolean", { type: "combo-list", textField: "name", valueField: "value", idField: "value", enableClear: !1, editable: !1, data: [ { value: !0, name: "是" }, { value: !1, name: "否" } ] }], ["enum", { type: "combo-list", maxHeight: 128, enableClear: !1, editable: !1 }], ["array", { type: "button-edit" }], ["number", { type: "number-spinner", placeholder: "" }], ["events-editor", { type: "events-editor", hide: !0 }], ["multiLanguage", { type: "language-textbox" }] ]), a = Ie(); function i(c, f) { return () => a.parseValueSchema(c, f); } function g(c, f, u) { return c.includes("visible") && f.visible !== void 0 ? typeof f.visible == "boolean" ? () => !!f.visible : f.visible === void 0 ? !0 : i(f.visible, u) : () => !0; } function s(c, f, u) { return c.includes("readonly") && f.readonly !== void 0 ? typeof f.readonly == "boolean" ? () => !!f.readonly : i(f.readonly, u) : () => !1; } function d(c, f) { const u = c.$converter || f; return typeof u == "string" && u && r.has(u) ? r.get(u) || null : u || null; } function m(c, f, u, b, x, T = "", V = "") { return Object.keys(c).map((w) => { const S = O(1), P = w, y = c[w], C = Object.keys(y), B = y.title, k = y.type, v = o.get(k) || { type: "input-group", enableClear: !1 }, E = y.editor ? Object.assign({}, v, y.editor) : Object.assign({}, v), D = g(C, y, f), z = s(C, y, f); E.readonly = E.readonly === void 0 ? z() : E.readonly; const A = y.type === "cascade" ? m(y.properties, f, u, b, x, T, V) : [], L = !0; let N = d(y, V); const ue = U({ get() { if (S.value) { if (["class", "style"].find((ge) => ge === P) && !N && (N = r.get("/converter/appearance.converter") || null), N && N.convertFrom) return N.convertFrom(u, w, x, T); const R = u[w]; return Object.prototype.hasOwnProperty.call(y, "defaultValue") && (R === void 0 || typeof R == "string" && R === "") ? y.type === "boolean" ? y.defaultValue : y.defaultValue || "" : R; } return null; }, set(R) { S.value += 1, N && N.convertTo ? (N.convertTo(b, w, R, x, T), N.convertTo(u, w, R, x, T)) : (b[w] = R, u[w] = R); } }), { refreshPanelAfterChanged: de, description: fe, isExpand: me, parentPropertyID: pe } = y, W = { propertyID: P, propertyName: B, propertyType: k, propertyValue: ue, editor: E, visible: D, readonly: z, cascadeConfig: A, hideCascadeTitle: L, refreshPanelAfterChanged: de, description: fe, isExpand: me, parentPropertyID: pe }; return f[P] = W, W; }); } function l(c, f, u = {}) { const b = {}, x = t[c]; return x && x.categories ? Object.keys(x.categories).map((V) => { const I = x.categories[V], w = I == null ? void 0 : I.title, S = m(I.properties || {}, b, {}, u, f); return { categoryId: V, categoryName: w, properties: S }; }) : []; } function p(c, f, u, b, x = "") { const T = f.$ref.schema, V = f.$ref.converter, I = u[T], w = I.type, S = n(I), P = {}, y = t[w]; if (y && y.categories) { const C = y.categories[c], B = C == null ? void 0 : C.title; V && Object.keys(C.properties).forEach((E) => { C.properties[E].$converter = V; }); const k = (C == null ? void 0 : C.properties) || {}, v = m(k, P, S, I, b, x); return { categoryId: c, categoryName: B, properties: v }; } return { categoryId: c, categoryName: "", properties: [] }; } function h(c, f, u, b, x) { const T = c.type, V = n(c), I = {}; let w = x || t[T]; if (!(w && Object.keys(w).length > 0) && u && u.getPropConfig && (w = u.getPropConfig(b)), w && w.categories) { const P = []; return Object.keys(w.categories).map((y) => { const C = w.categories[y]; if (C.$ref) { P.push(p(y, C, c, f, b)); return; } const B = C == null ? void 0 : C.title, k = C == null ? void 0 : C.tabId, v = C == null ? void 0 : C.tabName, E = C == null ? void 0 : C.hide, D = C == null ? void 0 : C.hideTitle, z = m(C.properties || {}, I, V, c, f, b, C.$converter), { setPropertyRelates: A } = C, L = C == null ? void 0 : C.parentPropertyID; P.push({ categoryId: y, categoryName: B, tabId: k, tabName: v, hide: E, properties: z, hideTitle: D, setPropertyRelates: A, parentPropertyID: L }); }), P; } return []; } return { getPropertyConfigBySchema: h, getPropertyConfigByType: l, propertyConverterMap: r }; } const te = {}, ne = {}; ee(te, ne, Fe); const re = {}, oe = {}, { resolveSchemaWithDefaultValue: Ke } = Y(re, oe), ie = {}, se = {}; ee(ie, se, Ke); function et(t, e, n = /* @__PURE__ */ new Map(), r = (i, g, s, d) => g, o = {}, a = (i) => i) { return Z[e.title] = e, K[e.title] = r, te[e.title] = o, ne[e.title] = a, re[e.title] = e, oe[e.title] = r, ie[e.title] = o, se[e.title] = a, (i = {}, g = !0) => { if (!g) return Me(i, n); const s = Te(i, e, n), d = Object.keys(t).reduce((m, l) => (m[l] = t[l].default, m), {}); return Object.assign(d, s); }; } const tt = "https://json-schema.org/draft/2020-12/schema", nt = "https://farris-design.gitee.io/collection-property-editor.schema.json", rt = "collection-property-editor", ot = "A Farris Component", it = "object", st = { id: { description: "The unique identifier for collection-property-editor", type: "string" }, type: { description: "The type string of collection-property-editor", type: "string", default: "collection-property-editor" }, appearance: { description: "", type: "object", properties: { class: { type: "string" }, style: { type: "string" } }, default: {} }, modelValue: { type: "array", default: [] }, idField: { type: "string", default: "id" }, textField: { type: "string", default: "" }, defaultComponentSchema: { type: "object", default: {} }, modalTitle: { type: "string", default: "编辑器" }, visibleCondition: { type: "object", default: null }, allowCollapse: { type: "boolean", default: !0 }, enableClear: { type: "boolean", default: !1 } }, at = [ "type" ], lt = [ "id" ], ct = { $schema: tt, $id: nt, title: rt, description: ot, type: it, properties: st, required: at, ignore: lt }, ae = { modelValue: { type: Array, default: [] }, idField: { type: String, default: "id" }, textField: { type: String, default: "" }, defaultComponentSchema: { type: Object, default: {} }, isToolbarHidden: { type: Boolean, default: !1 }, useFormCommand: { type: Object, default: {} }, useFormSchema: { type: Object, default: {} }, visibleCondition: { type: Function, default: null }, allowCollapse: { type: Boolean, default: !0 }, enableClear: { type: Boolean, default: !1 }, designerHostService: { type: Object, default: null } }, le = { ...ae, modalTitle: { type: String, default: "编辑器" } }, ut = et(le, ct), ce = /* @__PURE__ */ Q({ name: "CollectionPropertyContainer", props: ae, emits: ["valueChange", "selectionChange"], setup(t, e) { const n = O(), r = O(), { idField: o, textField: a, defaultComponentSchema: i, isToolbarHidden: g } = t, s = O(t.modelValue || []), d = O(), m = O("collection-property-editor"); q("useFormCommand", t.useFormCommand), q("useFormSchema", t.useFormSchema), q("designerHostService", t.designerHostService); const l = O(), p = U(() => !s.value || s.value.length === 0), h = [{ field: a, title: "名称", width: 340, resizable: !0, dataType: "string" }], c = U(() => s.value.filter((v) => t.visibleCondition ? t.visibleCondition(v) : !0)); function f() { const v = j(i), E = Math.random().toString().slice(2, 6); return v[o] = v[o] + "_" + E, v[a] = v[a] + "_" + E, v; } function u(v) { l.value = v, e.emit("selectionChange", { selectedData: l, propertyConfig: d, propertyPanelRef: r.value }), r.value.updatePropertyConfig(d.value, l.value, !0); } function b(v) { if (v >= s.value.length && (v = s.value.length - 1), s.value.length > 0) { const E = s.value[v]; n.value.selectItemById(E[o]), u(E); } } function x() { const v = f(); s.value.push(v), n.value.updateDataSource(c.value), n.value.selectItemById(v[o]), u(v); } function T() { const v = s.value && s.value.length > 0 ? s.value[0] : null; v && (n.value.selectItemById(v[o]), u(v)); } function V() { const v = s.value.indexOf(l.value); s.value.splice(v, 1), n.value.updateDataSource(c.value), b(v); } function I() { if (!l.value) return; const v = s.value.indexOf(l.value); v !== s.value.length - 1 && (s.value[v] = s.value[v + 1], s.value[v + 1] = l.value, n.value.updateDataSource(c.value)); } function w() { X.question("您确定要清空所有按钮吗?", "", () => { s.value = [], n.value.updateDataSource([]), e.emit("clear"); }, () => { }); } function S() { if (!l.value) return; const v = s.value.indexOf(l.value); v !== 0 && (s.value[v] = s.value[v - 1], s.value[v - 1] = l.value, n.value.updateDataSource(c.value)); } function P(v) { u(v[0]); } function y(v) { const { changeObject: E, designerItem: D } = v; n.value.updateDataSource(c.value); } he(() => { Ce(() => { T(); }); }); const C = U(() => !l.value || p.value), B = U(() => C.value || s.value.length <= 1 ? !1 : s.value.findIndex((E) => E.id === l.value.id) > 0), k = U(() => C.value || s.value.length <= 1 ? !1 : s.value.findIndex((E) => E.id === l.value.id) < s.value.length - 1); return e.expose({ propertyPanelRef: r }), () => M("div", { class: "f-utils-fill-flex-column h-100 pt-2 pl-2 border-bottom" }, [M("div", { hidden: g, class: "border-bottom pb-2" }, [M("button", { class: "btn btn-primary mr-2", onClick: x }, [$("新增")]), M("button", { class: "btn btn-secondary mr-2", onClick: V, disabled: C.value }, [$("删除")]), M("button", { class: "btn btn-secondary mr-2", onClick: S, disabled: !B.value }, [$("上移")]), M("button", { class: "btn btn-secondary mr-2", onClick: I, disabled: !k.value }, [$("下移")]), t.enableClear && M("button", { class: "btn btn-secondary mr-2 d-flex align-items-center", style: "float:right", onClick: w, disabled: p.value }, [M("i", { class: "f-icon f-icon-close mr-1" }, null), $("清空")])]), M("div", { class: "f-utils-fill-flex-row" }, [M("div", { class: "f-utils-fill f-utils-overflow-auto" }, [M(Se, { ref: n, columns: h, data: c.value, rowOption: { disabledField: "undefined" }, fit: "true", idField: o, columnOption: { fitColumns: !0 }, onSelectionChange: P }, null)]), M("div", { hidden: p.value, style: "display: flex;" }, [M(we, { propertyConfig: d.value, ref: r, propertyName: m.value, enableSearch: !1, allowCollapse: t.allowCollapse, onPropertyChanged: y }, null)])])]); } }), _ = /* @__PURE__ */ Q({ name: "FCollectionPropertyEditor", props: le, emits: ["valueChange", "selectionChange"], setup(t, e) { const n = O(), r = H("useFormCommand"), o = H("useFormSchema"), a = O(j(t.modelValue) || []), i = O(); ye(() => t.modelValue, (u) => { a.value = j(u) || []; }); const g = U(() => { var u; return (u = i.value) == null ? void 0 : u.getModal(); }), s = U(() => { let u = 0; return a.value && (t.visibleCondition ? u = a.value.filter(t.visibleCondition).length : u = a.value.length), `共 ${u || 0} 项`; }); function d(u) { Object.keys(u).forEach((b) => { b.indexOf("__fv") > -1 && delete u[b]; }); } function m(u) { u && u.forEach((b) => { d(b); }); } function l() { return m(a.value), e.emit("valueChange", a.value), !0; } function p() { return !0; } function h({ selectedData: u, propertyConfig: b }) { d(u.value), e.emit("selectionChange", { selectedData: u, propertyConfig: b, modalRef: g.value, buttonPropertyPanelInstance: n.value.propertyPanelRef }); } function c() { a.value = []; } const f = { title: t.modalTitle || "编辑器", width: 650, height: 700, minWidth: 380, minHeight: 400, fitContent: !1, showMaxButton: !0, resizeable: !0, draggable: !0, enableEsc: !0, buttons: [{ name: "cancel", text: "取消", class: "btn btn-secondary", handle: p }, { name: "accept", text: "确定", class: "btn btn-primary", handle: l }], closedCallback: (u, b) => { if ((u == null ? void 0 : u.target.name) === "cancel" || b === "icon" || b === "esc") return a.value = j(t.modelValue), e.emit("valueChange", a.value), !0; !u && b === "button" && l(); } }; return () => M(xe, { modelValue: s.value, "onUpdate:modelValue": (u) => s.value = u, editable: !1, enableTitle: !0, inputType: "text", buttonBehavior: "Modal", modalOptions: f, ref: i }, { default: () => [M("div", { class: "h-100 d-flex flex-column" }, [M(ce, { ref: n, modelValue: a.value, "onUpdate:modelValue": (u) => a.value = u, idField: t.idField, textField: t.textField, defaultComponentSchema: t.defaultComponentSchema, onSelectionChange: h, useFormCommand: r, useFormSchema: o, allowCollapse: t.allowCollapse, visibleCondition: t.visibleCondition, enableClear: t.enableClear, onClear: c }, null)])] }); } }); function dt(t) { const { formSchemaUtils: e, formStateMachineUtils: n } = t; function r(s, d = "") { return { path: d + s.code, field: s.id, fullPath: s.code }; } function o(s, d = "") { const m = e.getViewModelById(s); return m ? m.states.map((l) => r(l, d)) : []; } function a(s) { const d = e.getRootViewModelId(), m = o(s); if (s === d) return m; const l = o(d, "root-component."); return [...m, ...l]; } function i(s) { return s.binding && s.binding.path || s.id || ""; } function g() { return n && n.getRenderStates() || []; } return { getVariables: a, getControlName: i, getStateMachines: g }; } class ft { constructor(e) { F(this, "sessionVariables", [ { key: "CurrentSysOrgName", name: "当前组织Name", description: "当前组织Name" }, // { // key: "CurrentSysOrgCode", // name: "当前组织Code", // description: "当前组织Code" // }, { key: "CurrentSysOrgId", name: "当前组织Id", description: "当前组织Id" }, { key: "CurrentUserName", name: "当前用户Name", description: "当前用户Name" }, { key: "CurrentUserCode", name: "当前用户Code", description: "当前用户Code" }, { key: "CurrentUserId", name: "当前用户Id", description: "当前用户Id" }, { key: "CurrentLanguage", name: "当前语言编号", description: "当前登录的语言编号,例如简体中文返回'zh-CHS',英文返回'en',繁体中文'zh-CHT'" } ]); F(this, "expressionNames", { compute: "计算表达式", dependency: "依赖表达式", validate: "验证表达式", dataPicking: "帮助前表达式", visible: "可见表达式", readonly: "只读表达式", required: "必填表达式" }); F(this, "getExpressionConverter", (e, n) => ({ convertFrom: (r, o, a, i) => { const g = a.getExpressionRuleValue(e, n || o); return g && g.value || ""; }, convertTo: (r, o, a, i, g) => { var s; if (o === "dataPicking" && (a != null && a.target)) { const d = `${a.target}_dataPicking`; ((s = a.rules) == null ? void 0 : s.some( (l) => l.id === d && l.value )) ? r.dictPickingExpressionId = d : delete r.dictPickingExpressionId; } i.updateExpression(a); } })); this.formSchemaService = e; } getExpressionRule(e, n) { const r = this.getExpressionData(); if (!r) return ""; const o = r.find((i) => i.target === e); if (!o) return ""; const a = o.rules.find((i) => i.type === n); return a || ""; } // 获取上下文表单变量 getContextFormVariables() { const { module: e } = this.formSchemaService.getFormSchema(); if (!e.viewmodels || e.viewmodels.length === 0) return []; const n = this.formSchemaService.getRootViewModelId(), r = this.formSchemaService.getViewModelById(n); if (!r || !r.states || r.states.length === 0) return []; const o = []; return r.states.filter((a) => a.category === "remote").forEach((a) => { o.push({ key: a.code, name: a.name, description: a.name, category: a.category }); }), o; } createTreeNode(e, n, r = "label") { return { id: e.id, name: e.name, bindingPath: e[r], parents: n, type: "field" }; } buildEntityFieldsTreeData(e = null, n) { const r = []; return e == null || e.forEach((o) => { var g; const a = this.createTreeNode(o, n); let i = []; (g = o.type) != null && g.fields && (i = this.buildEntityFieldsTreeData(o.type.fields, [...n, o.label])), r.push({ data: a, children: i, expanded: !0 }); }), r; } buildChildEntityTreeData(e = null, n) { const r = []; return e == null || e.forEach((o) => { var s, d; const a = this.createTreeNode(o, n); a.type = "entity"; const i = this.buildEntityFieldsTreeData((s = o.type) == null ? void 0 : s.fields, [...n, o.label]), g = this.buildChildEntityTreeData((d = o.type) == null ? void 0 : d.entities, [...n, o.label]); g != null && g.length && (i == null || i.push(...g)), r.push({ data: a, children: i || [], // 空值回退 expanded: !0 }); }), r; } getEntitiesTreeData() { const e = this.formSchemaService.getSchemaEntities(); if (!(e != null && e.length)) return []; const n = e[0]; if (!(n != null && n.type)) return []; const r = this.buildEntityFieldsTreeData(n.type.fields, [n.code]), o = this.buildChildEntityTreeData(n.type.entities, [n.code]); return o != null && o.length && (r == null || r.push(...o)), { entityCode: n.code, fields: [{ data: this.createTreeNode(n, [], "code"), children: r || [] }] }; } getEntitiesAndVariables() { return { entities: this.getEntitiesTreeData(), variables: { session: { name: "系统变量", items: this.sessionVariables, visible: !1 }, forms: { name: "表单变量", items: this.getContextFormVariables(), visible: !0 } } }; } onBeforeOpenExpression(e, n, r) { const o = r === "Field" ? e.binding.field : e.id, a = this.getExpressionRule(o, n), i = this.getEntitiesAndVariables(), g = { message: ["validate", "required", "dataPicking"].includes(n) && a ? a.message : "", ...i }; return a.messageType != null && (g.messageType = a.messageType), g; } buildRule(e, n, r, o) { const { expression: a, message: i, messageType: g } = n, s = { id: `${e}_${r}`, type: r, value: a }; return (r === "validate" || r === "dataPicking" || r === "required") && (s.message = i), r === "dataPicking" && (s.messageType = g), r === "validate" && o && (s.elementId = o), s; } getExpressionData() { const { expressions: e } = this.formSchemaService.getFormSchema().module; return e || []; } updateExpression(e, n, r, o) { const a = n === "Field" ? e.binding.field : e.id, i = this.buildRule(a, r, o, e.type === "form-group" ? e.id : ""); let s = this.getExpressionData().find((m) => m.targetType === n && m.target === a); const d = (m) => m.value.trim() === ""; if (s) { const m = s.rules.find((l) => l.id === i.id); if (m) d(i) ? s.rules = s.rules.filter((l) => l.id !== i.id) : (Object.assign(m, i), o === "validate" && e.type === "form-group" && (m.elementId = e.id)); else { if (d(i)) return null; s.rules = s.rules || [], s.rules.push(i); } } else { if (d(i)) return null; s = { target: `${a}`, rules: [i], targetType: n }; } return s; } getExpressionEditorOptions(e, n, r, o) { return r.reduce((a, i) => { var s, d; const g = n === "Field" ? (s = e == null ? void 0 : e.binding) == null ? void 0 : s.field : e.id; return a[i] = { hide: n === "Field" ? !!((d = e == null ? void 0 : e.binding) != null && d.field) : !1, description: "", title: this.expressionNames[i], type: "string", $converter: this.getExpressionConverter(g), refreshPanelAfterChanged: !0, editor: { type: "expression-editor", singleExpand: !1, dialogTitle: `${this.expressionNames[i]}编辑器`, showMessage: i === "validate" || i === "dataPicking" || i === "required", showMessageType: i === "dataPicking", beforeOpen: () => this.onBeforeOpenExpression(e, i, n), onSubmitModal: (m) => { const l = this.updateExpression(e, n, m, i); if (o) { const p = this.buildRule(g, m, i); o(p); } return l; } } }, a; }, {}); } getExpressionInfo(e, n, r) { const o = n === "Field" ? e.binding.field : e.id, a = this.getExpressionRule(o, r), i = { value: a && a.value, targetId: o, targetType: n, expressionType: r }; return a && a.message && (i.message = a.message), i; } getExpressionConfig(e, n, r = ["compute", "dependency", "validate"], o) { return { description: "表达式", title: "表达式", hide: !e.binding, properties: { ...this.getExpressionEditorOptions(e, n, r, o) } }; } getExpressionOptions(e, n, r) { const o = this.getExpressionInfo(e, n, r); return { dialogTitle: `${this.expressionNames[r] || "表达式"}编辑器`, singleExpand: !1, showMessage: r === "required", beforeOpen: () => this.onBeforeOpenExpression(e, r, n), expressionInfo: o }; } } class mt { constructor(e, n) { F(this, "componentId"); F(this, "viewModelId"); F(this, "eventsEditorUtils"); F(this, "formSchemaUtils"); F(this, "formMetadataConverter"); F(this, "designViewModelUtils"); F(this, "designViewModelField"); F(this, "controlCreatorUtils"); F(this, "designerHostService"); F(this, "designerContext"); F(this, "modalService", null); /** 表单规则 */ F(this, "formRule", null); F(this, "schemaService", null); F(this, "metadataService", null); F(this, "propertyConfig", { type: "object", categories: {} }); F(this, "expressionProperty"); var r; this.componentId = e, this.designerHostService = n, this.eventsEditorUtils = n.eventsEditorUtils, this.formSchemaUtils = n.formSchemaUtils, this.formMetadataConverter = n.formMetadataConverter, this.viewModelId = ((r = this.formSchemaUtils) == null ? void 0 : r.getViewModelIdByComponentId(e)) || "", this.designViewModelUtils = n.designViewModelUtils, this.controlCreatorUtils = n.controlCreatorUtils, this.metadataService = n.metadataService, this.schemaService = n.schemaService, this.designerContext = n.designerContext, this.modalService = n.modalService, this.expressionProperty = new ft(this.formSchemaUtils); } getFormDesignerInstance() { var e, n; return (n = (e = this.designerContext) == null ? void 0 : e.instances) == null ? void 0 : n.formDesigner.value; } getTableInfo() { var e; return (e = this.schemaService) == null ? void 0 : e.getTableInfoByViewModelId(this.viewModelId); } setDesignViewModelField(e) { var r; const n = e.binding && e.binding.type === "Form" && e.binding.field; if (n) { if (!this.designViewModelField) { const o = this.designViewModelUtils.getDgViewModel(this.viewModelId); this.designViewModelField = o.fields.find((a) => a.id === n); } e.updateOn = (r = this.designViewModelField) == null ? void 0 : r.updateOn; } } getBasicPropConfig(e) { return { description: "Basic Information", title: "基本信息", properties: { id: { description: "组件标识", title: "标识", type: "string", readonly: !0 }, type: { description: "组件类型", title: "控件类型", type: "select", editor: { type: "combo-list", textField: "name", valueField: "value", idField: "value", editable: !1, data: [{ value: e.type, name: J[e.type] && J[e.type].name }] } } } }; } getAppearanceConfig(e = null, n = {}, r) { const o = { title: "外观", description: "Appearance" }, a = { class: { title: "class样式", type: "string", description: "组件的CSS样式", $converter: "/converter/appearance.converter", parentPropertyID: "appearance" }, style: { title: "style样式", type: "string", description: "组件的样式", $converter: "/converter/appearance.converter", parentPropertyID: "appearance" } }; for (const i in n) a[i] = Object.assign(a[i] || {}, n[i]); return { ...o, properties: { ...a }, setPropertyRelates(i, g) { if (i) { switch (i && i.propertyID) { case "class": case "style": { Ee.value++; break; } } r && r(i, e, g); } } }; } /** * * @param propertyData * @param propertyTypes * @param propertyName * @param constInfos * @param variableInfos * @param expressionType 指定表达式类型,存在属性和表达式类型不一致的情况 * @returns */ getPropertyEditorParams(e, n = [], r = "visible", o = {}, a = {}, i = "") { const { getVariables: g, getControlName: s, getStateMachines: d } = dt(this.designerHostService), m = this.getRealTargetType(e), l = n && n.length > 0 ? n : ["Const", "Variable", "StateMachine", "Expression"], p = { type: "property-editor", propertyTypes: l }; return l.map((h) => { switch (h) { case "Const": Object.assign(p, { constType: "enum", constEnums: [{ id: !0, name: "是" }, { id: !1, name: "否" }] }, o); break; case "Expression": p.expressionConfig = this.getExpressionOptions(e, m, i || r); break; case "StateMachine": p.stateMachines = d(); break; case "Variable": Object.assign(p, { controlName: s(e), newVariablePrefix: "is", newVariableType: "Boolean", variables: g(this.viewModelId), parentComponentId: this.componentId === "root-component" ? "" : "root-component", onBeforeOpenVariables: (c) => { c.value = g(this.viewModelId); } }, a), this.designerContext.designerMode === "PC_RTC" && (p.newVariablePrefix = "ext_" + p.newVariablePrefix); break; } }), p; } getVisibleProperty(e, n = "") { var a; let r = ["Const", "Variable", "StateMachine", "Expression"]; return n === "gridFieldEditor" ? r = ["Const", "Expression"] : n === "form-group" && !((a = e.binding) != null && a.field) && (r = ["Const", "Variable", "StateMachine"]), { visible: { title: "是否可见", type: "boolean", description: "运行时组件是否可见", editor: this.getPropertyEditorParams(e, r, "visible") } }; } /** * 获取行为 * @param propertyData * @param viewModelId * @returns */ getBehaviorConfig(e, n = "", r = {}, o) { const a = { title: "行为", description: "" }, i = this.getVisibleProperty(e, n); for (const s in r) i[s] = Object.assign(i[s] || {}, r[s]); const g = this; return { ...a, properties: { ...i }, setPropertyRelates(s, d) { if (s) { switch (s.propertyID) { case "disabled": case "readonly": case "visible": g.afterMutilEditorChanged(e, s); break; } o && o(s, d); } } }; } /** * 当多值编辑器变更时 * @param propertyData * @param changeObject */ afterMutilEditorChanged(e, n) { this.addNewVariableToViewModel(n, this.viewModelId), this.updateExpressionValue(n, e), this.clearExpression(n, e); } /** * * @param propertyId * @param componentInstance * @returns */ updateElementByParentContainer(e, n) { const r = n && n.parent && n.parent.schema; if (!r) return; const o = r.contents.findIndex((i) => i.id === e), a = j(r.contents[o]); r.contents.splice(o, 1), r.contents.splice(o, 0, a), Pe(); } /** * 属性编辑器,在编辑过程中会新增变量,此处需要将新增的变量追加到ViewModel中 * @param changeObject * @param viewModelId * @returns */ addNewVariableToViewModel(e, n) { const r = e.propertyValue; if (!(r && typeof r == "object") || !(r.type === "Variable" && r.isNewVariable)) return; const i = { id: r.field, category: "locale", code: r.fullPath, name: r.fullPath, type: r.newVariableType || "String", isRtcVariable: this.designerContext.designerMode === "PC_RTC" ? !0 : void 0 }; delete r.newVariableType, delete r.isNewVariable, this.formSchemaUtils.getVariableByCode(i.code) || this.formSchemaUtils.getViewModelById("root-viewmodel").states.push(i); } getExpressions() { let e = []; return this.formRule ? (this.formRule.expressions = this.formRule.expressions || [], e = this.formRule.expressions || []) : e = this.formSchemaUtils.getExpressions(), e; } /** * 更新表达式到expressions节点 * @param changeObject */ updateExpressionValue(e, n) { const r = e.propertyValue; if (!((r && r.type) === "Expression" && r.expressionInfo)) return; const { expressionId: i, expressionInfo: g } = r, { targetId: s, targetType: d, expressionType: m, value: l, message: p } = g, h = this.getExpressions(); let c = h.find((u) => u.target