UNPKG

@farris/ui-vue

Version:

Farris Vue, a Farris Design based Vue3 component library.

1,520 lines (1,519 loc) 411 kB
var Wr = Object.defineProperty; var zr = (e, t, n) => t in e ? Wr(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n; var L = (e, t, n) => zr(e, typeof t != "symbol" ? t + "" : t, n); import { ref as x, computed as Z, watch as ue, defineComponent as Se, createVNode as w, createTextVNode as Xe, onBeforeUnmount as To, withDirectives as Et, resolveDirective as jt, Fragment as Ke, mergeProps as pt, onMounted as nt, reactive as Hn, inject as Ge, Teleport as Eo, createApp as So, onUnmounted as Sn, nextTick as mt, onBeforeMount as Yr, watchEffect as Gr, Transition as Qr, shallowRef as Xr, render as un, h as Jr, cloneVNode as Zr, vShow as Kr, onUpdated as ea } from "vue"; import { resolveAppearance as _t, createPropsResolver as vt, schemaResolverMap as ta, propertyEffectMap as na, propertyConfigSchemaMap as oa, schemaMap as ra, getSchemaByType as Un, getPropsResolverGenerator as On } from "../dynamic-resolver/index.esm.js"; import { LocaleService as Le } from "../locale/index.esm.js"; import { FDynamicFormGroup as _n } from "../dynamic-form/index.esm.js"; import { cloneDeep as se, isUndefined as aa, mergeWith as ia, merge as sa, isPlainObject as Wn, debounce as Oo } from "lodash-es"; import { useDateFormat as Po, resolveField as la, useNumberFormat as ua, isMobilePhone as et, getCustomClass as Pn, FormSchemaEntityField$Type as yn, FormSchemaEntityFieldTypeName as zn, useThirdComponent as Mo, useGuid as at, useFarrisConfig as ca, EVENT_PROPERTY_TAB_IDS as Ro, getMaxZIndex as Yn } from "../common/index.esm.js"; import Io, { getLookupEditorCommonProperties as da, getLookupDialogCommonProperties as fa, getLookupPaginationProperties as ma } from "../lookup/index.esm.js"; import { loadRegister as pa, useComponentManager as ha, useEntityState as ga, useDynamicViewUtils as va, componentMap as cn, resolverMap as ya, componentPropsConverter as ba } from "../dynamic-view/index.esm.js"; import wa from "../section/index.esm.js"; import Ca from "../accordion/index.esm.js"; import Fa from "../../designer/avatar/index.esm.js"; import ka from "../../designer/approval-logs/index.esm.js"; import xa from "../../designer/button-edit/index.esm.js"; import Ta from "../button-group/index.esm.js"; import Ea from "../button/index.esm.js"; import Sa from "../calendar/index.esm.js"; import Oa from "../../designer/capsule/index.esm.js"; import Gn from "../../designer/checkbox/index.esm.js"; import Qn from "../../designer/checkbox-group/index.esm.js"; import bn from "../combo-list/index.esm.js"; import Pa from "../combo-tree/index.esm.js"; import Ma from "../component/index.esm.js"; import Ra from "../color-picker/index.esm.js"; import Ia from "../content-container/index.esm.js"; import La from "../../designer/date-picker/index.esm.js"; import Ba from "../../designer/data-grid/index.esm.js"; import Va from "../dropdown/index.esm.js"; import Na from "../../designer/dynamic-form/index.esm.js"; import Aa from "../events-editor/index.esm.js"; import qa from "../filter-bar/index.esm.js"; import ja from "../field-selector/index.esm.js"; import Da from "../binding-selector/index.esm.js"; import $a from "../image-cropper/index.esm.js"; import Ha from "../../designer/input-group/index.esm.js"; import Ua from "../layout/index.esm.js"; import _a from "../list-nav/index.esm.js"; import Wa from "../../designer/list-view/index.esm.js"; import za from "../mapping-editor/index.esm.js"; import Ya from "../../designer/nav/index.esm.js"; import Ga from "../number-range/index.esm.js"; import Qa from "../../designer/number-spinner/index.esm.js"; import Xa from "../order/index.esm.js"; import Ja from "../page-header/index.esm.js"; import Za from "../page-footer/index.esm.js"; import Ka from "../pagination/index.esm.js"; import ei from "../progress/index.esm.js"; import ti from "../query-solution/index.esm.js"; import ni from "../../designer/radio-group/index.esm.js"; import oi from "../../designer/rate/index.esm.js"; import ri from "../../designer/response-toolbar/index.esm.js"; import ai from "../response-layout/index.esm.js"; import ii from "../../designer/response-layout-editor/index.esm.js"; import si from "../search-box/index.esm.js"; import li from "../../designer/section/index.esm.js"; import ui from "../smoke-detector/index.esm.js"; import ci from "../splitter/index.esm.js"; import di from "../step/index.esm.js"; import fi from "../../designer/switch/index.esm.js"; import mi from "../../designer/tabs/index.esm.js"; import pi from "../../designer/tags/index.esm.js"; import hi from "../text/index.esm.js"; import gi from "../../designer/time-picker/index.esm.js"; import Lo, { FTransfer as Bo } from "../transfer/index.esm.js"; import vi from "../tree-view/index.esm.js"; import yi from "../uploader/index.esm.js"; import bi from "../verify-detail/index.esm.js"; import wi from "../video/index.esm.js"; import Ci from "../../designer/textarea/index.esm.js"; import Fi from "../schema-selector/index.esm.js"; import ki from "../../designer/tree-grid/index.esm.js"; import xi from "../event-parameter/index.esm.js"; import Ti from "../filter-condition-editor/index.esm.js"; import Ei from "../fieldset/index.esm.js"; import Si from "../sort-condition-editor/index.esm.js"; import Oi from "../menu-lookup/index.esm.js"; import Pi from "../../designer/drawer/index.esm.js"; import Mi from "../json-editor/index.esm.js"; import Ri from "../property-editor/index.esm.js"; import Ii from "../expression-editor/index.esm.js"; import Li from "../code-editor/index.esm.js"; import Bi from "../html-template/index.esm.js"; import Vi from "../collection-property-editor/index.esm.js"; import Ni from "../../designer/modal/index.esm.js"; import Ai from "../external-container/index.esm.js"; import qi from "../language-textbox/index.esm.js"; import ji from "../image/index.esm.js"; import Di from "../comment/index.esm.js"; import $i from "../../designer/wizard/index.esm.js"; import Hi, { FTooltip as Ui } from "../tooltip/index.esm.js"; import { DgControl as W, useDesignerComponent as _i } from "../designer-canvas/index.esm.js"; import { InputBaseProperty as Wi, FPropertyPanel as zi } from "../property-panel/index.esm.js"; import { useConditionValue as Yi, FConditionList as Gi, FConditionFields as Xn, FConditionFieldsDesign as Qi } from "../condition/index.esm.js"; import { FNotifyService as Vo } from "../notify/index.esm.js"; import { F_MODAL_SERVICE_TOKEN as No } from "../modal/index.esm.js"; import { FInputGroup as Xi } from "../input-group/index.esm.js"; import Ji, { FRadioGroup as Zi } from "../radio-group/index.esm.js"; import { FDataGrid as Ki } from "../data-grid/index.esm.js"; import { FCheckboxGroup as es } from "../checkbox-group/index.esm.js"; import { FButtonEdit as Mn } from "../button-edit/index.esm.js"; import ts, { FDrawer as ns } from "../drawer/index.esm.js"; import { DgControl as os } from "../designer-canvas/index.esm.js/"; import { DATE_FORMATS as rs } from "../date-picker/index.esm.js"; import { FMessageBoxService as as } from "../message-box/index.esm.js"; import "../collection-property-editor/index.esm.js/src/use-button-items.designer"; import is from "../tags/index.esm.js"; import { useInputExpand as ss } from "../common/index.esm.js/text-box/use-input-expand"; import ls from "../popover/index.esm.js"; function us() { const { getLocaleValue: e } = Le; return { conditionListLocale: { // 添加条件 add: e("condition.add"), // 生成条件组 create: e("condition.create"), // 重置 reset: e("condition.reset"), and: e("condition.and"), or: e("condition.or") } }; } function cs() { const { getLocaleValue: e } = Le; return { operatorsLocale: { equal: e("operators.equal"), notEqual: e("operators.notEqual"), greater: e("operators.greater"), greaterOrEqual: e("operators.greaterOrEqual"), lessOrEqual: e("operators.lessOrEqual"), less: e("operators.less"), contains: e("operators.contains"), startWith: e("operators.startWith"), endWith: e("operators.endWith"), is: e("operators.empty"), isNot: e("operators.notEmpty") } }; } var Rn = /* @__PURE__ */ ((e) => (e.Equal = "0", e.NotEqual = "1", e.Greater = "2", e.GreaterOrEqual = "3", e.Less = "4", e.LessOrEqual = "5", e.Like = "6", e.LikeStartWith = "7", e.LikeEndWith = "8", e.NotLike = "9", e.NotLikeStartWith = "10", e.NotLikeEndWith = "11", e.Is = "12", e.IsNot = "13", e.In = "14", e.NotIn = "15", e))(Rn || {}); function ds() { const { operatorsLocale: e } = cs(); return [ { value: "0", name: e.equal // 等于 }, { value: "1", name: e.notEqual // 不等于 }, { value: "2", name: e.greater // 大于 }, { value: "3", name: e.greaterOrEqual // 大于等于 }, { value: "4", name: e.less // 小于 }, { value: "5", name: e.lessOrEqual // 小于等于 }, { value: "6", name: e.contains // 包含 }, { value: "7", name: e.startWith // 开始是 }, { value: "8", name: e.endWith // 结束是 }, { value: "12", name: e.is // 为空 }, { value: "13", name: e.isNot // 非空 } ]; } const fs = { "button-edit": ["0", "1", " 6", "7", "8"], "check-box": ["0"], "combo-list": ["0", "1"], "combo-lookup": ["0", "1", " 6", "7", "8"], "date-picker": ["0", "1", "2", "3", "4", "5"], "date-range": [], "datetime-picker": ["0", "1", "2", "3", "4", "5"], "datetime-range": [], "month-picker": ["0", "1", "2", "3", "4", "5"], "month-range": [], "year-picker": ["0", "1", "2", "3", "4", "5"], "year-range": [], "input-group": ["0", "1", "6", "7", "8"], lookup: ["0", "1"], "number-range": [], "number-spinner": ["0", " 1", "2", "3", "4", "5"], "radio-group": ["0"], text: ["0", "1", "6", "7", "8", "12", "13"] }; function ms(e, t, n) { const { fieldMap: o } = n; function r(i) { const a = o.get(i.fieldCode); if (!a) return []; const s = a.editor.type, l = new Set(fs[s]); return ds().filter((c) => l.has(c.value)); } return { getCompareOperators: r }; } const Ao = { conditions: { type: Array, default: [] }, fields: { type: Array, default: [] }, key: { type: String, default: "" }, /** * 控件标签同行展示 */ isControlInline: { type: [Boolean, String], default: "auto", validator: (e) => [!0, !1, "auto"].includes(e) }, /** * 条件项统一的样式 */ itemClass: { type: String, default: "col-12 col-md-6 col-xl-3 col-el-2" }, /** * 启用自动响应监听 */ autoResponse: { type: Boolean, default: !0 }, customClass: { type: String, default: "" } }; class ps { constructor(t = { value: [] }, n) { L(this, "editorType", "check-box"); L(this, "value"); L(this, "valueType", "boolean"); // 编辑器配置 L(this, "editorConfig"); let o = []; Array.isArray(t.value) ? o = t.value.map( (r) => typeof r == "boolean" ? r : JSON.parse(String(r)) ) : typeof t.value == "string" ? o = t.value.split(",").filter((r) => r !== "").map((r) => r.toLowerCase() === "true") : typeof t.value == "boolean" && (o = [t.value]), this.value = o, this.editorConfig = Object.assign({}, n); } clear() { this.value = []; } setValue(t) { this.value = t; } getValue() { return this.value; } getDisplayText() { return this.value.map((t) => t ? "是" : "否").join(","); } isEmpty() { return this.value.length === 0; } } class hs { constructor(t = { textValue: "", value: "", valueField: "" }, n) { L(this, "editorType", "combo-lookup"); L(this, "textValue"); L(this, "value"); L(this, "valueField"); L(this, "valueType", "text"); // 编辑器配置 L(this, "editorConfig"); this.textValue = t == null ? void 0 : t.textValue, this.value = t == null ? void 0 : t.value, this.editorConfig = Object.assign({}, n), this.valueField = t == null ? void 0 : t.valueField; } clear() { this.value = "", this.valueField = "", this.textValue = ""; } getPropValue(t, n) { if (n.length > 1) { const o = n.shift(); return t[o] ? this.getPropValue(t[o], n) : null; } return t[n[0]]; } getTextValue(t) { const n = t.split("."), o = this.value.split(",").map((r) => this.getPropValue(r, se(n))); return o && o.length ? o.join(",") : ""; } getValue() { const t = this.valueField.split("."), n = this.value.split(",").map((o) => this.getPropValue(o, se(t))); return n && n.length ? n.join(",") : ""; } getDisplayText() { return this.getValue(); } setValue(t) { throw new Error("Method not implemented."); } isEmpty() { return !this.valueField; } } class Wt { constructor(t = { value: "", displayFormat: "", valueFormat: "" }, n) { L(this, "editorType", "date-picker"); L(this, "value"); L(this, "valueType", "datetime"); L(this, "displayFormat", ""); L(this, "valueFormat", ""); // 编辑器配置 L(this, "editorConfig"); this.value = t == null ? void 0 : t.value, this.editorConfig = Object.assign({}, n), this.displayFormat = (t == null ? void 0 : t.displayFormat) || (n == null ? void 0 : n.displayFormat) || "", this.valueFormat = (t == null ? void 0 : t.valueFormat) || (n == null ? void 0 : n.valueFormat) || ""; } formatValue() { const { formatTo: t, parseToDate: n } = Po(); if (!this.value) return ""; const o = n(this.value, this.valueFormat); return t(o, this.displayFormat); } setValue(t) { this.value = t; } getValue() { return this.value; } getDisplayText() { return this.formatValue(); } isEmpty() { return !this.value; } clear() { this.value = void 0; } } class zt { constructor(t = { begin: "", end: "", displayFormat: "", valueFormat: "" }, n = {}) { L(this, "editorType", "date-range"); L(this, "begin", ""); L(this, "end", ""); L(this, "valueType", "datetime"); L(this, "value", ""); // 编辑器配置 L(this, "editorConfig"); L(this, "displayFormat", ""); L(this, "valueFormat", ""); this.begin = (t == null ? void 0 : t.begin) || "", this.end = (t == null ? void 0 : t.end) || "", this.editorConfig = Object.assign({}, n, { delimiter: "~" }), this.displayFormat = (t == null ? void 0 : t.displayFormat) || (n == null ? void 0 : n.displayFormat) || "", this.valueFormat = (t == null ? void 0 : t.valueFormat) || (n == null ? void 0 : n.valueFormat) || "", this.value = (this.begin === null ? "" : this.begin) + "~" + (this.end === null ? "" : this.end); } clear() { this.begin = "", this.end = "", this.value = ""; } formatValue(t) { const { formatTo: n, parseToDate: o } = Po(); if (!t) return ""; const r = o(t, this.valueFormat); return n(r, this.displayFormat); } getValue() { return { begin: this.begin, end: this.end }; } // TODO getDisplayText() { return !this.begin && !this.end ? "" : (this.begin === null ? "" : this.formatValue(this.begin)) + "~" + (this.end === null ? "" : this.formatValue(this.end)); } setValue(t) { if (t) { const n = t.split(this.editorConfig.delimiter); this.begin = n[0] || "", this.end = n[1] || "", this.value = t; } else this.clear(); } isEmpty() { return !this.begin && !this.end; } } class qo { constructor(t = { value: "", valueList: [] }, n) { L(this, "editorType", "combo-list"); L(this, "value"); L(this, "valueType", "enum"); L(this, "valueList", []); // 编辑器配置 L(this, "editorConfig"); this.value = t == null ? void 0 : t.value, this.editorConfig = Object.assign({}, n), this.editorConfig.data && this.editorConfig.data.length ? this.valueList = this.editorConfig.data : this.valueList = (t == null ? void 0 : t.valueList) || []; } clear() { const t = typeof this.value; this.value = t === "string" ? "" : void 0; } /** * 更新数据源 */ updateData(t) { this.valueList = [...t]; } getValue() { return this.value; } getDisplayText() { var r, i; const t = typeof this.value; let n = "", o = []; switch (t) { case "string": o = this.value.split(",") || [], n = this.valueList.filter((a) => o.indexOf(a.value + "") > -1).map((a) => a.name).join(","); break; case "boolean": n = ((r = this.valueList.find((a) => a.value === this.value)) == null ? void 0 : r.name) || ""; break; case "number": n = ((i = this.valueList.find((a) => a.value === this.value)) == null ? void 0 : i.name) || ""; break; } return n; } // setValue(data: { value: string; displayText: string }) { // // this.displayText = data.dispalyText; // const enumValues = getEnumValues(data); // this.value = enumValues; // return this.displayText; // } setValue(t) { this.value = t.value; } isEmpty() { return !this.value && this.value !== !1 && this.value !== 0; } } class gs { constructor(t = { value: "", displayText: "", displayField: "", isInputText: !1 }, n) { L(this, "editorType", "input-group"); // 通过弹窗返回的若干个值对象构成的数组 L(this, "value"); L(this, "valueType", "text"); // 控件内显示的值 L(this, "displayText"); // 弹窗模式下,取列表中哪个字段的值映射到当前字段 L(this, "valueField"); // 是否是手动输入的值 L(this, "isInputText"); // 编辑器配置 L(this, "editorConfig"); this.value = t == null ? void 0 : t.value, this.displayText = t == null ? void 0 : t.displayText, this.valueField = t == null ? void 0 : t.displayField, this.isInputText = t == null ? void 0 : t.isInputText, this.editorConfig = Object.assign({}, n); } clear() { this.value = "", this.displayText = "", this.valueField = ""; } getPropValue(t, n) { if (n.length > 1) { const o = n.shift(); return t[o] ? this.getPropValue(t[o], n) : ""; } return t[n[0]]; } getTextValue(t) { const n = t.split("."), o = this.value.map((r) => this.getPropValue(r, se(n))); return o && o.length ? o.join(",") : ""; } getValue() { return this.value && typeof this.value == "object" && "value" in this.value ? this.value.value : this.value; } getDisplayText() { return this.getValue(); } setValue(t) { throw new Error("Method not implemented."); } isEmpty() { const t = this.value && typeof this.value == "object" && "value" in this.value ? this.value.value : this.value; return !this.displayText && (t == null || t === "" || !(t != null && t.length)); } } class vs { // 原valueField在帮助中没有实际使用的是idField constructor(t = { mapFields: [], value: "", idField: "", isInputText: !1, helpId: "", valueField: "" }, n) { L(this, "editorType", "lookup"); L(this, "helpId"); L(this, "mapFields"); L(this, "value"); L(this, "valueField"); L(this, "valueType", "text"); // 帮助的值是否为手动输入的任意值,对应帮助的任意输入属性nosearch L(this, "isInputText"); // 编辑器配置 L(this, "editorConfig"); this.editorConfig = Object.assign({}, n), this.value = (t == null ? void 0 : t.value) || "", this.valueField = (t == null ? void 0 : t.valueField) || (n == null ? void 0 : n.valueField) || (t == null ? void 0 : t.idField) || (n == null ? void 0 : n.idField), this.mapFields = t.mapFields, this.isInputText = (t == null ? void 0 : t.isInputText) || (n == null ? void 0 : n.isInputText), this.helpId = (t == null ? void 0 : t.helpId) || (n == null ? void 0 : n.helpId); } clear() { this.value = "", this.mapFields = []; } getValue() { return this.mapFields.map((t) => la(t, this.valueField || "id")).join(","); } getDisplayText() { return this.value; } setValue(t) { throw new Error("Method not implemented."); } isEmpty() { return !this.mapFields.length; } } class ys extends Wt { constructor(n = { value: "", displayFormat: "", valueFormat: "" }, o) { super(n, o); L(this, "editorType", "month-picker"); } } class bs extends zt { constructor(n = { begin: "", end: "", displayFormat: "", valueFormat: "" }, o) { super(n, o); L(this, "editorType", "month-range"); } } class ws { constructor(t = { begin: null, end: null }, n) { L(this, "editorType", "number-range"); L(this, "begin"); L(this, "end"); L(this, "valueType", "number"); // 编辑器配置 L(this, "editorConfig"); this.editorConfig = Object.assign({}, n), this.begin = (t == null ? void 0 : t.begin) == null ? null : parseFloat(t.begin), this.end = (t == null ? void 0 : t.end) == null ? null : parseFloat(t.end); } clear() { this.begin = null, this.end = null; } getValue() { return { begin: this.begin, end: this.end }; } getDisplayText() { return this.begin === null && this.end === null ? "" : (this.begin === null ? "" : this.begin) + "~" + (this.end === null ? "" : this.end); } setValue(t) { this.begin = t.begin == null ? null : parseFloat(t.begin), this.end = t.end == null ? null : parseFloat(t.end); } isEmpty() { return this.begin == null && this.end == null; } } class Cs { constructor(t = { value: "" }, n) { L(this, "editorType", "number-spinner"); L(this, "value"); L(this, "valueType", "number"); // 编辑器配置 L(this, "editorConfig"); this.editorConfig = Object.assign({}, n); const o = parseFloat(t.value); this.value = isNaN(o) ? null : o; } clear() { this.value = null; } getValue() { return this.value; } getDisplayText() { if (this.isEmpty()) return ""; const { formatTo: t } = ua(); return t(this.value, this.editorConfig); } setValue(t) { this.value = isNaN(parseFloat(t)) ? null : t; } isEmpty() { return this.value == null || isNaN(this.value); } } class Fs { constructor(t = { value: null, valueList: [] }, n) { L(this, "editorType", "radio-group"); L(this, "value"); L(this, "valueType", "enum"); L(this, "valueList", []); // 编辑器配置 L(this, "editorConfig"); this.editorConfig = Object.assign({}, n), this.value = t == null ? void 0 : t.value, this.editorConfig.data && this.editorConfig.data.length ? this.valueList = this.editorConfig.data : this.valueList = (t == null ? void 0 : t.valueList) || []; } clear() { this.value = void 0, this.valueList = []; } getValue() { return this.value; } getDisplayText() { var t; return ((t = this.valueList.find((n) => n.value === this.value)) == null ? void 0 : t.name) || ""; } setValue(t) { this.value = t; } isEmpty() { return !this.value && this.value !== 0 && this.value !== !1; } } class ks extends Wt { constructor(n = { value: "", displayFormat: "", valueFormat: "" }, o) { super(n, o); L(this, "editorType", "year-picker"); } } class jo { constructor(t = { value: "" }, n) { L(this, "editorType", "text"); L(this, "value"); L(this, "valueType", "text"); // 编辑器配置 L(this, "editorConfig"); this.value = t.value; } clear() { this.value = void 0; } getValue() { return this.value; } getDisplayText() { return this.getValue(); } setValue(t) { this.value = t; } isEmpty() { return !this.value; } } class xs extends Wt { constructor(n = { value: "", displayFormat: "", valueFormat: "" }, o) { super(n, o); L(this, "editorType", "datetime-picker"); } } class Ts extends zt { constructor(n = { begin: "", end: "", displayFormat: "", valueFormat: "" }, o) { super(n, o); L(this, "editorType", "year-range"); } } class Es extends zt { constructor(n = { begin: "", end: "", displayFormat: "", valueFormat: "" }, o = {}) { super(n, o); // 这个属性会在后面进行比对 L(this, "editorType", "datetime-range"); L(this, "valueType", "datetime"); } } class Ss extends qo { constructor(n = { value: "", valueList: [] }, o) { super(n, o); L(this, "editorType", "check-group"); } } function Do() { function e(t, n, o) { switch (t) { case "check-box": return new ps(n, o); case "combo-list": return new qo(n, o); case "combo-lookup": return new hs(n, o); case "input-group": return new gs(n, o); case "year-picker": return new ks(n, o); case "date-picker": return new Wt(n, o); case "datetime-range": return new Es(n, o); case "date-range": return new zt(n, o); case "datetime-picker": return new xs(n, o); case "lookup": return new vs(n, o); case "month-picker": return new ys(n, o); case "month-range": return new bs(n, o); case "year-range": return new Ts(n, o); case "number-range": return new ws(n, o); case "number-spinner": return new Cs(n, o); case "radio-group": return new Fs(n, o); case "check-group": return new Ss(n, o); default: return new jo(n, o); } } return { createConditionValue: e }; } function $o(e = "query-solution") { function t(s) { let l = "input-group"; switch (s) { case "year-picker": case "month-picker": case "year-range": case "month-range": case "date-range": case "datetime-range": case "datetime-picker": l = "date-picker"; break; default: l = s; } return l; } function n(s) { const l = s.editor ? s.editor.type : "input-group"; return s.editor.type = t(l), s.editor.type === "date-picker" ? (l.indexOf("range") > -1 && (s.editor.enablePeriod = !0), l.indexOf("datetime") > -1 && (s.editor.showTime = !0), l.indexOf("year") > -1 && (s.editor.selectMode = "year"), l.indexOf("month") > -1 && (s.editor.selectMode = "month"), s.editor.weekSelect && (s.editor.selectMode = "week")) : s.editor.type === "number-spinner" || s.editor.type === "number-range" ? (s.editor.showZero = !0, s.editor.nullable = !0, s.editor.needValid = !0) : s.editor.type === "check-group" && e === "filter-bar" ? s.editor.direction = "vertical" : (s.editor.type === "lookup" || s.editor.type === "combo-list") && (s.editor.enableClear = Object.prototype.hasOwnProperty.call(s.editor, "enableClear") ? s.editor.enableClear : !0), l === "input-group" && !s.editor.placeholder && (s.editor.placeholder = Le.getLocaleValue("input-group.placeholder")), s.editor; } function o(s) { return s.map((u) => Object.assign({}, u)).map((u) => (u.visible = Object.prototype.hasOwnProperty.call(u, "visible") ? u.visible : !0, u.editor = n(u), u)); } function r(s, l, u, c) { switch (s.value.editorType) { case "combo-list": c.newValue && (s.value.valueList = c.newValue.map((f) => ({ name: f.name, value: f.value }))); break; case "radio-group": s.value.valueList = [u.data.find((f) => f.value === l)]; break; case "year-range": case "month-range": case "date-range": case "datetime-range": s.value.setValue(l); break; } } function i(s, l) { s && (s || "").split(",").map((c) => { const f = l.find((p) => p.fieldCode === c); f && f.value.clear(); }); } function a(s, l, u, c = []) { var d, h, b, y, F, E, j; const f = se((d = s.get(l.fieldCode)) == null ? void 0 : d.editor), p = (h = s.get(l.fieldCode)) == null ? void 0 : h.id, g = Object.prototype.hasOwnProperty.call(l, "visible") ? l.visible : (b = s.get(l.fieldCode)) == null ? void 0 : b.visible; let m = !0; if (((y = l.value) == null ? void 0 : y.editorType) === "lookup" && f) { f.idValue = (F = l.value.mapFields) == null ? void 0 : F.map((P) => P.id).join(","); const { onClear: I } = f; f.onClear = (P) => { l.value.mapFields = [], i(l.clearFields, c), u(l, ""), I && I(P); }, f["onUpdate:dataMapping"] = (P) => { l.value.mapFields = P.items || [], i(l.clearFields, c), u(l, l.value.getValue()); }, m = !1; } else ((E = l.value) == null ? void 0 : E.editorType) === "number-range" && f ? (f.beginValue = l.value.begin, f.onBeginValueChange = (I) => { l.value.begin = I, u(l, I); }, f.endValue = l.value.end, f.onEndValueChange = (I) => { l.value.end = I, u(l, I); }, m = !1) : f && ["year-range", "month-range", "date-range", "datetime-range"].find((I) => { var P; return I === ((P = l.value) == null ? void 0 : P.editorType); }) ? (f.beginValue = l.value.begin, f.endValue = l.value.end) : ((j = l.value) == null ? void 0 : j.editorType) === "combo-list" && f && (f.onDataChanged = (I) => { var M; const P = (M = s.get(l.fieldCode)) == null ? void 0 : M.editor; P && (P.data = I), l.value.updateData(I); }); return Object.prototype.hasOwnProperty.call(l, "disabled") && (f.disabled = l.disabled), { id: p, editor: f, visible: g, needEmitChange: m }; } return { getSingleControlType: n, convertToControls: o, conditionChangeHandler: r, renderFieldConditionEditor: a }; } function Ho(e, t, n = "query-solution") { const { convertToControls: o } = $o(n), r = x(e.fields), i = x([]), a = /* @__PURE__ */ new Map(), { createConditionValue: s } = Do(); function l(c = !0, f) { c && (r.value = o(f || r.value)), a.clear(), r.value && r.value.length > 0 && r.value.forEach((p) => { p && p.labelCode && a.set(p.labelCode, p); }); } function u(c) { return c.forEach((f) => { if (f) { const p = a.get(f.fieldCode); p.controlType && (f.value = s(p.controlType, f.value, p.editor)); } }), c; } return { convertToControls: o, fields: r, fieldMap: a, fieldConditions: i, loadFieldConfigs: l, initialConditionValue: u }; } function Os(e, t, n) { const o = x(null), r = x(n), i = x(0); function a(c, f) { let p = null; return function() { const g = arguments; p ? (clearTimeout(p), p = setTimeout(() => { p = null, c(...g); }, 200)) : (c(...g), p = setTimeout(() => { p = null; }, 200)); }; } function s() { r.value && (o.value = new ResizeObserver(a((c) => { const f = c[0]; i.value = f.contentRect.width; })), o.value.observe(r.value)); } function l(c) { let p = "col-12"; return c > 250 * 6 ? p = "col-2" : c > 250 * 4 ? p = "col-3" : c > 250 * 3 ? p = "col-4" : c > 250 * 2 && (p = "col-6"), p; } const u = Z(() => l(i.value)); return ue([n], ([c]) => { r.value = c, s(); }), { conditionClass: u, resizeObserver: o }; } const Ps = { id: { type: String }, required: { type: Boolean, default: !1 }, title: { type: String, default: "" }, valid: { type: Boolean, default: !0 }, inValidTip: { type: String, default: "" }, showSubTitle: { type: Boolean, default: !1 }, showCollapse: { type: Boolean, default: !1 }, subTitle: { type: String, default: "" } }, Ms = { /** * 组件标识 */ id: { type: String }, /** * 下拉数据源 */ data: { type: Array, default: [] }, /** * 可选,是否禁用 * 默认为`false` */ disabled: { default: !1, type: Boolean }, /** * 可选,数据源id字段 * 默认为`id` */ idField: { default: "id", type: String }, /** * 可选,是否支持多选 * 默认`false` */ multiSelect: { type: Boolean, default: !1 }, /** * 绑定值 */ modelValue: {}, /** * 可选,是否只读 * 默认为`false` */ readonly: { default: !1, type: Boolean }, /** * 可选,分隔符 * 默认`,` */ separator: { default: ",", type: String }, /** * 可选,数据源显示字段 * 默认为`name` */ textField: { default: "name", type: String }, /** * 可选,数据源值字段 * 默认为`id` */ valueField: { default: "id", type: String } }, Rs = /* @__PURE__ */ Se({ name: "FConditionTitle", props: Ps, emits: [], setup(e, t) { const n = x(e.required), o = x(e.title), r = x(e.valid), i = x(e.inValidTip), a = x(!1), s = x(); ue(() => e.title, () => { o.value = e.title; }), ue(() => e.required, (p, g) => { p !== g && (n.value = p); }), ue([() => e.valid, () => e.inValidTip], ([p, g]) => { r.value = p, i.value = g; }); const l = Z(() => r.value ? o.value : i.value), u = Z(() => r.value ? "" : "color:red"), c = Z(() => ({ "col-form-label": !0, "condition-title": !0, "d-flex": !0 // 指定必填,当显示模式是隐藏或者没有指定标签名时,宽度不限定 // 'f-width-auto': required.value && (props.showType === 'none' || !text.value) })); function f() { var g; const p = (g = s.value) == null ? void 0 : g.nextElementSibling; p && (a.value ? p.style.display = "block" : p.style.display = "none"), a.value = !a.value; } return () => w("div", { class: c.value, title: l.value, style: u.value, ref: s }, [!r.value && w("span", { class: "f-icon f-icon-warning mr-1", style: "color: red; min-width: 16px;", title: i.value }, null), w("span", { class: "farris-label-text text-truncate", style: "flex-shrink: 0;" }, [n.value && w("span", { class: "farris-label-info text-danger" }, [Xe("*")]), o.value]), w("div", { class: "condition-title--right ml-auto d-flex align-items-center" }, [e.showSubTitle && w("span", { class: "text-info text-truncate mx-2" }, [e.subTitle]), e.showCollapse && w("span", { class: "f-icon f-icon-dropdown", style: { transform: a.value ? "none" : "rotate(180deg)" }, onClick: f }, null), t.slots.right && t.slots.right()])]); } }), Is = /* @__PURE__ */ Se({ name: "FConditionPanelList", props: Ms, emits: ["change", "update:modelValue"], setup(e, t) { const n = Z(() => aa(e.modelValue) ? [] : e.multiSelect && e.modelValue.indexOf(",") > -1 ? e.modelValue.split(",") : e.data.find((s) => s[e.valueField] === e.modelValue) ? [e.modelValue] : []), o = (s) => n.value.includes(s[e.valueField]), r = (s) => { let l = ""; o(s) ? e.multiSelect && (l = n.value.filter((f) => f !== s).join(",")) : e.multiSelect ? l = [...n.value, s].join(",") : l = s; const u = e.multiSelect ? l.split(",") : [l], c = e.data.filter((f) => u.includes(f[e.valueField])); t.emit("update:modelValue", l), t.emit("change", l, { newValue: c, newModelValue: l }); }, i = (s) => { r(s[e.valueField]); }; function a(s) { return { "farris-tag-item": !0, "farris-tag-item-info": !0, "border-0": !0, "farris-tag-item-checked": o(s) }; } return () => w("div", { class: "farris-tags condition-panel-list" }, [w("ul", { class: "farris-tags-item-container " }, [e.data.map((s) => w("li", { class: a(s), onClick: () => i(s) }, [w("span", { class: "tag-box text-truncate" }, [s[e.textField]])]))])]); } }), Jn = /* @__PURE__ */ Se({ name: "FConditionFields", props: Ao, emits: ["valueChange", "blur", "focus", "click", "input"], setup(e, t) { const n = x(), o = et(), r = Le.getLocale(), i = x(e.key), a = x(e.conditions), { renderFieldConditionEditor: s, conditionChangeHandler: l } = $o(), u = Ho(e), { initialConditionValue: c, fieldMap: f, loadFieldConfigs: p } = u, g = Os(e, t, n), { resizeObserver: m } = g, d = x({ enable: o ? !1 : e.autoResponse }); p(!0), c(a.value), To(() => { var E; (E = m.value) == null || E.unobserve(n.value); }), ue(() => e.fields, () => { p(!0, e.fields); }), ue(() => e.conditions, () => { a.value = e.conditions, c(a.value); }); const h = Z(() => { const E = { // row: true, "f-utils-flex-row-wrap": !0, "farris-form": !0, "condition-div": !0, "farris-form-controls-inline": !r || e.isControlInline === !0 || e.isControlInline === "auto" && r !== "en" }; return Pn(E, e.customClass); }); function b(E, j, I, P) { l(E, j, I, P), t.emit("valueChange", j, E); } function y() { return a.value.map((E) => { var D; const { id: j, editor: I, needEmitChange: P, visible: M } = s(f, E, b); let C = ((D = I == null ? void 0 : I.appearance) == null ? void 0 : D.class) || e.itemClass; I != null && I.multiLineLabel && (C = C + " farris-group-multi-label"); const T = ["radio-group", "check-group", "combo-list", "lookup"].indexOf(I == null ? void 0 : I.type) > -1, O = ["radio-group", "check-group", "combo-list"].indexOf(I == null ? void 0 : I.type) > -1; return w(_n, { id: j, key: j, visible: M, customClass: C, label: (I == null ? void 0 : I.showLabel) === !1 ? " " : E.fieldName, editor: I, required: I == null ? void 0 : I.required, modelValue: E.value.value, "onUpdate:modelValue": (v) => E.value.value = v, onChange: (v, k) => { P && b(E, v, I, k); } }, { label: () => w(Rs, { id: `${j.value}-title`, showSubTitle: T, showCollapse: O, required: I == null ? void 0 : I.required, title: E.fieldName, editorType: I == null ? void 0 : I.type, subTitle: E.value.getDisplayText() }, { ...(I == null ? void 0 : I.type) === "lookup" ? { right: () => w(Io, pt({ id: j, customClass: "mobile-lookup-icon" }, I, { modelValue: E.value.value, "onUpdate:modelValue": (v) => E.value.value = v, onChange: (v, k) => { P && b(E, v, I, k); } }), { content: ({ openDialog: v }) => w(Ke, null, [w("div", { class: "d-flex align-items-center lookup-icon-wrapper", onClick: v }, [w("span", { class: " text-muted" }, [Xe("更多")]), w("span", { class: "f-icon f-icon-dropdown" }, null)])]) }) } : {} }), ...["radio-group", "check-group", "combo-list"].indexOf(I == null ? void 0 : I.type) > -1 ? { content: () => w(Is, pt({ id: j }, I, { modelValue: E.value.value, "onUpdate:modelValue": (v) => E.value.value = v, onChange: (v, k) => { P && b(E, v, I, k); } }), null) } : {}, ...(I == null ? void 0 : I.type) === "lookup" ? { content: () => w(Ke, null, null) } : {} }); }); } function F() { return a.value.map((E) => { var T; const { id: j, editor: I, needEmitChange: P, visible: M } = s(f, E, b, a.value); let C = ((T = I == null ? void 0 : I.appearance) == null ? void 0 : T.class) || e.itemClass; return I != null && I.multiLineLabel && (C = C + " farris-group-multi-label"), w(_n, { id: j, key: j, visible: M, customClass: C, label: (I == null ? void 0 : I.showLabel) === !1 ? " " : E.fieldName, editor: I, required: I == null ? void 0 : I.required, modelValue: E.value.value, "onUpdate:modelValue": (O) => E.value.value = O, onChange: (O, D) => { P && b(E, O, I, D); } }, null); }); } return () => Et(w("div", { class: h.value, key: i.value, ref: n }, [o ? y() : F()]), [[jt("area-response"), d]]); } }), Ls = "root-viewmodel"; class Bs { constructor(t, n) { L(this, "formSchemaUtils"); L(this, "controlCreatorUtils"); L(this, "designViewModelUtils"); this.resolver = t, this.designerHostService = n, this.formSchemaUtils = this.designerHostService.formSchemaUtils, this.controlCreatorUtils = this.designerHostService.controlCreatorUtils, this.designViewModelUtils = this.designerHostService.designViewModelUtils; } createComponent(t) { const n = this.createComponentRefNode(t), o = this.createComponentNode(t), r = this.createViewModeNode(t), i = this.formSchemaUtils.getFormSchema(); return i.module.viewmodels.push(r), i.module.components.push(o), this.designViewModelUtils.assembleDesignViewModel(), n; } createComponentRefNode(t) { const n = this.resolver.getSchemaByType("component-ref"); return Object.assign(n, { id: `${t.componentId}-component-ref`, component: `${t.componentId}-component` }), n; } createComponentNode(t) { const n = this.resolver.getSchemaByType("component"), o = this.createFormComponentContents(t); return Object.assign(n, { id: `${t.componentId}-component`, viewModel: `${t.componentId}-component-viewmodel`, componentType: t.componentType, appearance: { class: this.getFormComponentClass(t) }, formColumns: t.formColumns, contents: o }), n; } /** * 获取卡片组件层级的class样式 */ getFormComponentClass(t) { var o, r; const { templateId: n } = this.formSchemaUtils.getFormSchema().module; if (n === "double-list-in-tab-template" && ((r = (o = t.parentComponentInstance) == null ? void 0 : o.schema) == null ? void 0 : r.type) === "tab-page") { const i = t.parentComponentInstance.parent && t.parentComponentInstance.parent.schema; if ((i == null ? void 0 : i.type) === "tabs" && (i == null ? void 0 : i.fill) === !0) return "f-struct-wrapper f-utils-fill-flex-column"; } return "f-struct-wrapper"; } createFormComponentContents(t) { var s, l; const n = this.resolver.getSchemaByType("section"); Object.assign(n, { id: t.componentId + "-form-section", appearance: { class: "f-section-form f-section-in-mainsubcard" }, mainTitle: t.componentName }); const o = this.resolver.getSchemaByType("response-form"), r = []; Object.assign(o, { id: t.componentId + "-form", appearance: { class: "f-form-layout farris-form farris-form-controls-inline" }, contents: r, controlsInline: !0 }), n.contents = [o]; const { selectedFields: i } = t; i == null || i.forEach((u) => { if (u.$type === yn.SimpleField) { const c = se(u), f = this.resolveControlClassByFormColumns(t), p = this.controlCreatorUtils.setFormFieldProperty(c, "", f); p && r.push(p); } }); const { templateId: a } = this.formSchemaUtils.getFormSchema().module; if (a === "double-list-in-tab-template" && ((l = (s = t.parentComponentInstance) == null ? void 0 : s.schema) == null ? void 0 : l.type) === "tab-page") { const u = t.parentComponentInstance.parent && t.parentComponentInstance.parent.schema; (u == null ? void 0 : u.type) === "tabs" && (u == null ? void 0 : u.fill) === !0 && (n.appearance.class = "f-section-grid f-section-in-main px-0 pt-0", n.fill = !0); } return [n]; } resolveControlClassByFormColumns(t) { let n = ""; switch (t.formColumns) { case 1: { n = "col-12 col-md-12 col-xl-12 col-el-12"; break; } case 2: { n = "col-12 col-md-6 col-xl-6 col-el-6"; break; } case 3: { n = "col-12 col-md-6 col-xl-4 col-el-4"; break; } case 4: { n = "col-12 col-md-6 col-xl-3 col-el-2"; break; } } return n; } /** * 添加viewModel节点 */ createViewModeNode(t) { return { id: `${t.componentId}-component-viewmodel`, code: `${t.componentId}-component-viewmodel`, name: t.componentName, bindTo: t.bindTo, parent: Ls, fields: this.assembleViewModelFields(t), commands: [], states: [], enableValidation: !0 }; } /** * 组装viewModel fields 节点 */ assembleViewModelFields(t) { const n = [], { selectedFields: o } = t; return o == null || o.forEach((r) => { if (r.$type === yn.SimpleField) { let i = "blur"; const a = r.type.name; (a === zn.Enum || a === zn.Boolean) && (i = "change"), n.push({ type: "Form", id: r.id, fieldName: r.bindingField, groupId: null, groupName: null, updateOn: i, fieldSchema: {} }); } }), n; } } function Uo(e, t, n, o) { var i, a, s, l, u, c; const r = n.parentComponentInstance; if (r && o) { const f = (i = r.schema) == null ? void 0 : i.type, g = { componentId: `form-${Math.random().toString(36).slice(2, 6)}`, componentName: ((a = n.bindingSourceContext) == null ? void 0 : a.entityTitle) || ((l = (s = n.bindingSourceContext) == null ? void 0 : s.bindingEntity) == null ? void 0 : l.name) || "标题", componentType: "form", formColumns: f === "splitter-pane" ? 1 : 4, parentContainerId: r.schema.id, parentComponentInstance: r, bindTo: ((u = n.bindingSourceContext) == null ? void 0 : u.bindTo) || "/", selectedFields: (c = n.bindingSourceContext) == null ? void 0 : c.bindingEntityFields }; return new Bs(e, o).createComponent(g); } else return t; } const Vs = "https://json-schema.org/draft/2020-12/schema", Ns = "https://farris-design.gitee.io/response-form.schema.json", As = "response-form", qs = "A Farris Data Collection Component", js = "object", Ds = { id: { description: "The unique identifier for a form group", type: "string" }, type: { description: "The type string of form group component", type: "string", default: "response-form" }, appearance: { description: "", type: "object", properties: { class: { type: "string" }, style: { type: "string" } }, default: {} }, contents: { description: "", type: "array", default: [] }, visible: { description: "", type: "boolean", default: !0 }, labelAutoOverflow: { description: "", type: "boolean", default: !1 }, adaptForLanguage: { description: "", type: "boolean", default: !0 }, layout: { description: "", type: "string", default: "col-12 col-md-6 col-xl-3 col-el-2" }, fields: { description: "", type: "array" }, formData: { description: "", type: "object" } }, $s = [ "id", "type", "contents" ], Hs = { $schema: Vs, $id: Ns, title: As, description: qs, type: js, properties: Ds, required: $s }, _o = /* @__PURE__ */ new Map([ ["appearance", _t] ]), Us = "https://json-schema.org/draft/2020-12/schema", _s = "https://farris-design.gitee.io/dynamic-form.schema.json", Ws = "dynamic-form", zs = "A Farris Data Collection Component", Ys = "object", Gs = { id: { description: "The unique identifier for a form group", type: "string" }, type: { description: "The type string of form group component", type: "string", default: "dynamic-form" }, appearance: { description: "", type: "object", properties: { class: { type: "string" }, style: { type: "string" } }, default: {} }, contents: { description: "", type: "array", default: [] }, visible: { description: "", type: "boolean", default: !0 }, labelAutoOverflow: { description: "", type: "boolean", default: !1 }, adaptForLanguage: { description: "", type: "boolean", default: !0 }, layout: { description: "", type: "string", default: "col-12 col-md-6 col-xl-3 col-el-2" }, fields: { description: "", type: "array" }, formData: { description: "", type: "object" }, headerTitleRenderFunction: { description: "", type: "function", default: null }, headerContentRenderFunction: { description: "", type: "function", default: null }, footerRenderFunction: { description: "", type: "function", default: null }, mode: { description: "", type: "string", default: "quick" }, footerStyle: { description: "", type: "string", default: "" }, headerStyle: { description: "", type: "string", default: "" }, toolbar: { description: "", type: "array", default: [] }, moreButtonClass: { description: "", type: "string", default: "btn-link" }, onClick: { description: "", type: "string", default: "" }, onChange: { description: "", type: "string" }, callback: { description: "", type: "string" } }, Qs = [ "id", "type", "contents" ], Xs = { onClick: "点击事件", onChange: "ֵ值变化事件", event: "内部控件事件", callback: "内部控件属性回调事件" }, Js = { $schema: Us, $id: _s, title: Ws, description: zs, type: Ys, properties: Gs, required: Qs, events: Xs }; var xt = /* @__PURE__ */ ((e) => (e.Header = "header", e.Footer = "footer", e))(xt || {}), Dt = /* @__PURE__ */ ((e) => (e.QUICK = "quick", e.FULL = "full", e))(Dt || {}); const Yt = { customClass: { type: String, default: "" }, customStyle: { type: String, defaut: "" }, /** 控制是否可见 */ visible: { type: Boolean, default: !0 }, /** 内部控件布局是否响应国际化 */ adaptForLanguage: { type: Boolean, default: !0 }, /** 绑定动态字段 */ fields: { type: Array, default: [] }, /** 绑定动态字段的值*/ formData: { type: Object, default: null }, /** 为动态字段指定样式*/ layout: { type: String, default: "col-12 col-md-6 col-xl-3 col-el-2" } }, Zs = Object.assign({}, Yt, { // 是否渲染form层级 canRenderForm: { type: Boolean, default: !0 }, /** * 回调方法 * @param methodName 是回调方法名称 * @param viewSchema 是当前组件的视图配置 * @param eventParams 是回调方法接收的参数 * @param editorSchema 是当前组件的编辑器配置 */ callback: { type: Function }, /** 设置Section的主标题 */ mainTitle: { type: String, default: "" }, /** 设置是否显示头部区域 */ showHeader: { type: Boolean, default: !1 },