@farris/ui-vue/components/html-template/index.esm.js

Farris Vue, a Farris Design based Vue3 component library.

var Q = Object.defineProperty;
var X = (c, e, t) => e in c ? Q(c, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : c[e] = t;
var v = (c, e, t) => X(c, typeof e != "symbol" ? e + "" : e, t);
import { defineComponent as U, ref as V, inject as F, onMounted as Y, computed as Z, createVNode as R } from "vue";
import { isPlainObject as O, cloneDeep as C } from "lodash-es";
import { withInstall as K } from "../common/index.esm.js";
const D = {}, $ = {};
function k(c) {
  const { properties: e, title: t, ignore: n } = c, r = n && Array.isArray(n), o = Object.keys(e).reduce((i, l) => ((!r || !n.find((s) => s === l)) && (i[l] = e[l].type === "object" && e[l].properties ? k(e[l]) : C(e[l].default)), i), {});
  if (t && (!r || !n.find((i) => i === "id"))) {
    const i = t.toLowerCase().replace(/-/g, "_");
    o.id = `${i}_${Math.random().toString().slice(2, 6)}`;
  }
  return o;
}
function ee(c) {
  const { properties: e, title: t, required: n } = c;
  if (n && Array.isArray(n)) {
    const r = n.reduce((o, i) => (o[i] = e[i].type === "object" && e[i].properties ? k(e[i]) : C(e[i].default), o), {});
    if (t && n.find((o) => o === "id")) {
      const o = t.toLowerCase().replace(/-/g, "_");
      r.id = `${o}_${Math.random().toString().slice(2, 6)}`;
    }
    return r;
  }
  return {
    type: t
  };
}
function A(c, e = {}, t) {
  const n = D[c];
  if (n) {
    let r = ee(n);
    const o = $[c];
    return r = o ? o({ getSchemaByType: A }, r, e, t) : r, r;
  }
  return null;
}
function te(c, e) {
  const t = k(e);
  return Object.keys(t).reduce((n, r) => (Object.prototype.hasOwnProperty.call(c, r) && (n[r] && O(n[r]) && O(c[r] || !c[r]) ? Object.assign(n[r], c[r] || {}) : n[r] = c[r]), n), t), t;
}
function j(c, e) {
  return Object.keys(c).filter((n) => c[n] != null).reduce((n, r) => {
    if (e.has(r)) {
      const o = e.get(r);
      if (typeof o == "string")
        n[o] = c[r];
      else {
        const i = o(r, c[r], c);
        Object.assign(n, i);
      }
    } else
      n[r] = c[r];
    return n;
  }, {});
}
function ne(c, e, t = /* @__PURE__ */ new Map()) {
  const n = te(c, e);
  return j(n, t);
}
function re(c = {}) {
  function e(a, u, p, m) {
    if (typeof p == "number")
      return m[a].length === p;
    if (typeof p == "object") {
      const f = Object.keys(p)[0], h = p[f];
      if (f === "not")
        return Number(m[a].length) !== Number(h);
      if (f === "moreThan")
        return Number(m[a].length) >= Number(h);
      if (f === "lessThan")
        return Number(m[a].length) <= Number(h);
    }
    return !1;
  }
  function t(a, u, p, m) {
    return m[a] && m[a].propertyValue && String(m[a].propertyValue.value) === String(p);
  }
  const n = /* @__PURE__ */ new Map([
    ["length", e],
    ["getProperty", t]
  ]);
  Object.keys(c).reduce((a, u) => (a.set(u, c[u]), a), n);
  function r(a, u) {
    const p = a;
    return typeof u == "number" ? [{ target: p, operator: "length", param: null, value: Number(u) }] : typeof u == "boolean" ? [{ target: p, operator: "getProperty", param: a, value: !!u }] : typeof u == "object" ? Object.keys(u).map((m) => {
      if (m === "length")
        return { target: p, operator: "length", param: null, value: u[m] };
      const f = m, h = u[m];
      return { target: p, operator: "getProperty", param: f, value: h };
    }) : [];
  }
  function o(a) {
    return Object.keys(a).reduce((p, m) => {
      const f = r(m, a[m]);
      return p.push(...f), p;
    }, []);
  }
  function i(a, u) {
    if (n.has(a.operator)) {
      const p = n.get(a.operator);
      return p && p(a.target, a.param, a.value, u) || !1;
    }
    return !1;
  }
  function l(a, u) {
    return o(a).reduce((f, h) => f && i(h, u), !0);
  }
  function s(a, u) {
    const p = Object.keys(a), m = p.includes("allOf"), f = p.includes("anyOf"), h = m || f, P = (h ? a[h ? m ? "allOf" : "anyOf" : "allOf"] : [a]).map((T) => l(T, u));
    return m ? !P.includes(!1) : P.includes(!0);
  }
  return { parseValueSchema: s };
}
const ie = {
  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: "标签页工具栏按钮" },
  "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: "标签页工具栏" },
  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: "列表导航" },
  "filter-bar": { type: "filter-bar", name: "筛选条" }
}, oe = {}, se = {};
re();
function q(c, e, t = /* @__PURE__ */ new Map(), n = (i, l, s, a) => l, r = {}, o = (i) => i) {
  return D[e.title] = e, $[e.title] = n, oe[e.title] = r, se[e.title] = o, (i = {}, l = !0) => {
    if (!l)
      return j(i, t);
    const s = ne(i, e, t), a = Object.keys(c).reduce((u, p) => (u[p] = c[p].default, u), {});
    return Object.assign(a, s);
  };
}
const ae = "https://json-schema.org/draft/2020-12/schema", ce = "https://farris-design.gitee.io/html-template.schema.json", le = "html-template", pe = "A Farris Component", ue = "object", de = {
  id: {
    description: "The unique identifier for a html-template",
    type: "string"
  },
  type: {
    description: "The type string of html-template",
    type: "string",
    default: "html-template"
  },
  html: {
    description: "",
    type: "string",
    default: ""
  },
  renderFunction: {
    description: "",
    type: "function",
    default: null
  }
}, me = [
  "id",
  "type"
], fe = [], I = {
  $schema: ae,
  $id: ce,
  title: le,
  description: pe,
  type: ue,
  properties: de,
  required: me,
  ignore: fe
}, L = /* @__PURE__ */ new Map([]);
function _(c, e, t) {
  return e;
}
const H = {
  /** 渲染函数 */
  renderFunction: { type: Function }
}, he = q(H, I, L, _), W = {
  /** html模板 */
  html: { type: String, default: "" }
}, ge = q(W, I, L, _), S = /* @__PURE__ */ U({
  name: "FHtmlTemplate",
  props: H,
  emits: [],
  setup(c) {
    return () => {
      var e;
      return (e = c.renderFunction) == null ? void 0 : e.call(c);
    };
  }
});
function ye(c, e, t) {
  var N;
  const n = t && t.getStyles && t.getStyles() || "", r = t && t.getDesignerClass && t.getDesignerClass() || "", o = V();
  function i() {
    return (e == null ? void 0 : e.schema.componentType) === "frame" ? !1 : t && t.checkCanMoveComponent ? t.checkCanMoveComponent() : !0;
  }
  function l() {
    return !1;
  }
  function s() {
    return (e == null ? void 0 : e.schema.componentType) === "frame" ? !1 : t && t.checkCanDeleteComponent ? t.checkCanDeleteComponent() : !0;
  }
  function a() {
    return (e == null ? void 0 : e.schema.componentType) === "frame" ? !0 : t && t.hideNestedPaddingInDesginerView ? t.hideNestedPaddingInDesginerView() : !1;
  }
  function u(d) {
    if (!d || !d.value)
      return null;
    if (d.value.schema && d.value.schema.type === "component")
      return d.value;
    const g = V(d == null ? void 0 : d.value.parent), y = u(g);
    return y || null;
  }
  function p(d = e) {
    var E;
    if (t != null && t.getDraggableDesignItemElement)
      return t.getDraggableDesignItemElement(d);
    const { componentInstance: g, designerItemElementRef: y } = d;
    if (!g || !g.value)
      return null;
    const { getCustomButtons: b } = g.value;
    return g.value.canMove || b && ((E = b()) != null && E.length) ? y : p(d.parent);
  }
  function m(d) {
    return !!t && t.canAccepts(d);
  }
  function f() {
    return (e == null ? void 0 : e.schema.label) || (e == null ? void 0 : e.schema.title) || (e == null ? void 0 : e.schema.name);
  }
  function h() {
  }
  function w(d, g) {
    var y;
    !d || !g || (t != null && t.onAcceptMovedChildElement && t.onAcceptMovedChildElement(d, g), (y = e == null ? void 0 : e.setupContext) == null || y.emit("dragEnd"));
  }
  function M(d, g) {
    const { componentType: y } = d;
    let b = A(y, d, g);
    t && t.onResolveNewComponentSchema && (b = t.onResolveNewComponentSchema(d, b));
    const E = y.toLowerCase().replace(/-/g, "_");
    return b && !b.id && b.type === y && (b.id = `${E}_${Math.random().toString().slice(2, 6)}`), b;
  }
  function P(d) {
    d && t != null && t.onChildElementMovedOut && t.onChildElementMovedOut(d);
  }
  function x(...d) {
    if (t && t.getPropsConfig)
      return t.getPropsConfig(...d);
  }
  function T(d) {
    if (!d)
      return;
    const g = e == null ? void 0 : e.schema, { formSchemaUtils: y } = d;
    if (g && y.getExpressions().length) {
      const b = y.getExpressions().findIndex((E) => E.target === g.id);
      b > -1 && y.getExpressions().splice(b, 1);
    }
  }
  function z(d) {
    t && t.onRemoveComponent && t.onRemoveComponent(), T(d), e != null && e.schema.contents && e.schema.contents.map((g) => {
      let y = g.id;
      g.type === "component-ref" && (y = g.component);
      const b = c.value.querySelectorAll(`#${y}-design-item`);
      b != null && b.length && Array.from(b).map((E) => {
        var B;
        (B = E == null ? void 0 : E.componentInstance) != null && B.value.onRemoveComponent && E.componentInstance.value.onRemoveComponent(d);
      });
    });
  }
  function G() {
    if (t && t.getCustomButtons)
      return t.getCustomButtons();
  }
  function J(d) {
    if (t && t.onPropertyChanged)
      return t.onPropertyChanged(d);
  }
  return o.value = {
    canMove: i(),
    canSelectParent: l(),
    canDelete: s(),
    canNested: !a(),
    contents: e == null ? void 0 : e.schema.contents,
    elementRef: c,
    parent: (N = e == null ? void 0 : e.parent) == null ? void 0 : N.componentInstance,
    schema: e == null ? void 0 : e.schema,
    styles: n,
    designerClass: r,
    canAccepts: m,
    getBelongedComponentInstance: u,
    getDraggableDesignItemElement: p,
    getDraggingDisplayText: f,
    getPropConfig: x,
    getDragScopeElement: h,
    onAcceptMovedChildElement: w,
    onChildElementMovedOut: P,
    addNewChildComponentSchema: M,
    triggerBelongedComponentToMoveWhenMoved: !!t && t.triggerBelongedComponentToMoveWhenMoved || V(!1),
    triggerBelongedComponentToDeleteWhenDeleted: !!t && t.triggerBelongedComponentToDeleteWhenDeleted || V(!1),
    onRemoveComponent: z,
    getCustomButtons: G,
    onPropertyChanged: J
  }, o;
}
const be = V(0);
function ve() {
  be.value++;
}
const Ee = V(0);
function Me(c) {
  const { formSchemaUtils: e, formStateMachineUtils: t } = c;
  function n(s, a = "") {
    return {
      path: a + s.code,
      field: s.id,
      fullPath: s.code
    };
  }
  function r(s, a = "") {
    return e.getViewModelById(s).states.map((p) => n(p, a));
  }
  function o(s) {
    const a = e.getRootViewModelId(), u = r(s);
    if (s === a)
      return u;
    const p = r(a, "root-component.");
    return [...u, ...p];
  }
  function i(s) {
    return s.binding && s.binding.path || s.id || "";
  }
  function l() {
    return t && t.getRenderStates() || [];
  }
  return { getVariables: o, getControlName: i, getStateMachines: l };
}
class we {
  constructor(e) {
    v(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'"
      }
    ]);
    v(this, "expressionNames", {
      compute: "计算表达式",
      dependency: "依赖表达式",
      validate: "验证表达式",
      dataPicking: "帮助前表达式",
      visible: "可见表达式",
      readonly: "只读表达式",
      required: "必填表达式"
    });
    v(this, "getExpressionConverter", (e, t) => ({
      convertFrom: (n, r, o, i) => {
        const l = o.getExpressionRuleValue(e, t || r);
        return l && l.value || "";
      },
      convertTo: (n, r, o, i, l) => {
        var s;
        if (r === "dataPicking" && (o != null && o.target)) {
          const a = `${o.target}_dataPicking`;
          ((s = o.rules) == null ? void 0 : s.some(
            (p) => p.id === a && p.value
          )) ? n.dictPickingExpressionId = a : delete n.dictPickingExpressionId;
        }
        i.updateExpression(o);
      }
    }));
    this.formSchemaService = e;
  }
  getExpressionRule(e, t) {
    const n = this.formSchemaService.getExpressions();
    if (!n)
      return "";
    const r = n.find((i) => i.target === e);
    if (!r)
      return "";
    const o = r.rules.find((i) => i.type === t);
    return o || "";
  }
  // 获取上下文表单变量
  getContextFormVariables() {
    const { module: e } = this.formSchemaService.getFormSchema();
    if (!e.viewmodels || e.viewmodels.length === 0)
      return [];
    const t = this.formSchemaService.getRootViewModelId(), n = this.formSchemaService.getViewModelById(t);
    if (!n || !n.states || n.states.length === 0)
      return [];
    const r = [];
    return n.states.forEach((o) => {
      r.push({
        key: o.code,
        name: o.name,
        description: o.name,
        category: o.category
      });
    }), r;
  }
  createTreeNode(e, t, n = "label") {
    return {
      id: e.id,
      name: e.name,
      bindingPath: e[n],
      parents: t
    };
  }
  buildEntityFieldsTreeData(e = null, t) {
    const n = [];
    return e == null || e.forEach((r) => {
      var l;
      const o = this.createTreeNode(r, t);
      let i = [];
      (l = r.type) != null && l.fields && (i = this.buildEntityFieldsTreeData(r.type.fields, [...t, r.label])), n.push({
        data: o,
        children: i,
        expanded: !0
      });
    }), n;
  }
  buildChildEntityTreeData(e = null, t) {
    const n = [];
    return e == null || e.forEach((r) => {
      var s, a;
      const o = this.createTreeNode(r, t), i = this.buildEntityFieldsTreeData((s = r.type) == null ? void 0 : s.fields, [...t, r.label]), l = this.buildChildEntityTreeData((a = r.type) == null ? void 0 : a.entities, [...t, r.label]);
      l != null && l.length && (i == null || i.push(...l)), n.push({
        data: o,
        children: i || [],
        // 空值回退
        expanded: !0
      });
    }), n;
  }
  getEntitiesTreeData() {
    const e = this.formSchemaService.getSchemaEntities();
    if (!(e != null && e.length))
      return [];
    const t = e[0];
    if (!(t != null && t.type))
      return [];
    const n = this.buildEntityFieldsTreeData(t.type.fields, [t.code]), r = this.buildChildEntityTreeData(t.type.entities, [t.code]);
    return r != null && r.length && (n == null || n.push(...r)), {
      entityCode: t.code,
      fields: [{
        data: this.createTreeNode(t, [], "code"),
        children: n || []
      }]
    };
  }
  getEntitiesAndVariables() {
    return {
      entities: this.getEntitiesTreeData(),
      variables: {
        session: {
          name: "系统变量",
          items: this.sessionVariables,
          visible: !1
        },
        forms: {
          name: "表单变量",
          items: this.getContextFormVariables(),
          visible: !0
        }
      }
    };
  }
  onBeforeOpenExpression(e, t, n) {
    const r = n === "Field" ? e.binding.field : e.id, o = this.getExpressionRule(r, t), i = this.getEntitiesAndVariables(), l = {
      message: ["validate", "required", "dataPicking"].includes(t) && o ? o.message : "",
      ...i
    };
    return o.messageType != null && (l.messageType = o.messageType), l;
  }
  buildRule(e, t, n, r) {
    const { expression: o, message: i, messageType: l } = t, s = {
      id: `${e}_${n}`,
      type: n,
      value: o
    };
    return (n === "validate" || n === "dataPicking" || n === "required") && (s.message = i), n === "dataPicking" && (s.messageType = l), n === "validate" && r && (s.elementId = r), s;
  }
  getExpressionData() {
    const { expressions: e } = this.formSchemaService.getFormSchema().module;
    return e || [];
  }
  updateExpression(e, t, n, r) {
    const o = t === "Field" ? e.binding.field : e.id, i = this.buildRule(o, n, r, e.type === "form-group" ? e.id : "");
    let s = this.getExpressionData().find((u) => u.targetType === t && u.target === o);
    const a = (u) => u.value.trim() === "";
    if (s) {
      const u = s.rules.find((p) => p.id === i.id);
      if (u)
        a(i) ? s.rules = s.rules.filter((p) => p.id !== i.id) : (Object.assign(u, i), r === "validate" && e.type === "form-group" && (u.elementId = e.id));
      else {
        if (a(i))
          return null;
        s.rules = s.rules || [], s.rules.push(i);
      }
    } else {
      if (a(i))
        return null;
      s = {
        target: `${o}`,
        rules: [i],
        targetType: t
      };
    }
    return s;
  }
  getExpressionEditorOptions(e, t, n, r) {
    return n.reduce((o, i) => {
      var s, a;
      const l = t === "Field" ? (s = e == null ? void 0 : e.binding) == null ? void 0 : s.field : e.id;
      return o[i] = {
        hide: t === "Field" ? !!((a = e == null ? void 0 : e.binding) != null && a.field) : !1,
        description: "",
        title: this.expressionNames[i],
        type: "string",
        $converter: this.getExpressionConverter(l),
        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, t),
          onSubmitModal: (u) => {
            const p = this.updateExpression(e, t, u, i);
            if (r) {
              const m = this.buildRule(l, u, i);
              r(m);
            }
            return p;
          }
        }
      }, o;
    }, {});
  }
  getExpressionInfo(e, t, n) {
    const r = t === "Field" ? e.binding.field : e.id, o = this.getExpressionRule(r, n), i = {
      value: o && o.value,
      targetId: r,
      targetType: t,
      expressionType: n
    };
    return o && o.message && (i.message = o.message), i;
  }
  getExpressionConfig(e, t, n = ["compute", "dependency", "validate"], r) {
    return {
      description: "表达式",
      title: "表达式",
      properties: {
        ...this.getExpressionEditorOptions(e, t, n, r)
      }
    };
  }
  getExpressionOptions(e, t, n) {
    const r = this.getExpressionInfo(e, t, n);
    return {
      dialogTitle: `${this.expressionNames[n]}编辑器`,
      singleExpand: !1,
      showMessage: n === "required",
      beforeOpen: () => this.onBeforeOpenExpression(e, n, t),
      expressionInfo: r
    };
  }
}
class Ve {
  constructor(e, t) {
    v(this, "componentId");
    v(this, "viewModelId");
    v(this, "eventsEditorUtils");
    v(this, "formSchemaUtils");
    v(this, "formMetadataConverter");
    v(this, "designViewModelUtils");
    v(this, "designViewModelField");
    v(this, "controlCreatorUtils");
    v(this, "designerHostService");
    v(this, "schemaService", null);
    v(this, "metadataService", null);
    v(this, "propertyConfig", {
      type: "object",
      categories: {}
    });
    var n;
    this.componentId = e, this.designerHostService = t, this.eventsEditorUtils = t.eventsEditorUtils, this.formSchemaUtils = t.formSchemaUtils, this.formMetadataConverter = t.formMetadataConverter, this.viewModelId = ((n = this.formSchemaUtils) == null ? void 0 : n.getViewModelIdByComponentId(e)) || "", this.designViewModelUtils = t.designViewModelUtils, this.controlCreatorUtils = t.controlCreatorUtils, this.metadataService = t.metadataService, this.schemaService = t.schemaService;
  }
  getTableInfo() {
    var e;
    return (e = this.schemaService) == null ? void 0 : e.getTableInfoByViewModelId(this.viewModelId);
  }
  setDesignViewModelField(e) {
    var n;
    const t = e.binding && e.binding.type === "Form" && e.binding.field;
    if (t) {
      if (!this.designViewModelField) {
        const r = this.designViewModelUtils.getDgViewModel(this.viewModelId);
        this.designViewModelField = r.fields.find((o) => o.id === t);
      }
      e.updateOn = (n = this.designViewModelField) == null ? void 0 : n.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: ie[e.type].name }]
          }
        }
      }
    };
  }
  getAppearanceConfig(e = null, t = {}, n) {
    const r = {
      title: "外观",
      description: "Appearance"
    }, o = {
      class: {
        title: "class样式",
        type: "string",
        description: "组件的CSS样式",
        $converter: "/converter/appearance.converter"
      },
      style: {
        title: "style样式",
        type: "string",
        description: "组件的样式",
        $converter: "/converter/appearance.converter"
      }
    };
    for (const i in t)
      o[i] = Object.assign(o[i] || {}, t[i]);
    return {
      ...r,
      properties: { ...o },
      setPropertyRelates(i, l) {
        if (i) {
          switch (i && i.propertyID) {
            case "class":
            case "style": {
              Ee.value++;
              break;
            }
          }
          n && n(i, e, l);
        }
      }
    };
  }
  getPropertyEditorParams(e, t = [], n = "visible", r = {}, o = {}) {
    const { getVariables: i, getControlName: l, getStateMachines: s } = Me(this.designerHostService), a = this.getRealTargetType(e), u = t && t.length > 0 ? t : ["Const", "Variable", "StateMachine", "Expression"], p = {
      type: "property-editor",
      propertyTypes: u
    };
    return u.map((m) => {
      switch (m) {
        case "Const":
          Object.assign(p, {
            constType: "enum",
            constEnums: [{ id: !0, name: "是" }, { id: !1, name: "否" }]
          }, r);
          break;
        case "Expression":
          p.expressionConfig = this.getExpressionOptions(e, a, n);
          break;
        case "StateMachine":
          p.stateMachines = s();
          break;
        case "Variable":
          Object.assign(p, {
            controlName: l(e),
            newVariablePrefix: "is",
            newVariableType: "Boolean",
            variables: i(this.viewModelId),
            onBeforeOpenVariables: (f) => {
              f.value = i(this.viewModelId);
            }
          }, o);
          break;
      }
    }), p;
  }
  getVisibleProperty(e, t = "") {
    return {
      visible: {
        title: "是否可见",
        type: "boolean",
        description: "运行时组件是否可见",
        editor: this.getPropertyEditorParams(e, t === "gridFieldEditor" ? ["Const", "Expression"] : ["Const", "Variable", "StateMachine", "Expression"], "visible")
      }
    };
  }
  /**
   * 获取行为
   * @param propertyData 
   * @param viewModelId 
   * @returns 
   */
  getBehaviorConfig(e, t = "", n = {}, r) {
    const o = {
      title: "行为",
      description: ""
    }, i = this.getVisibleProperty(e, t);
    for (const s in n)
      i[s] = Object.assign(i[s] || {}, n[s]);
    const l = this;
    return {
      ...o,
      properties: { ...i },
      setPropertyRelates(s, a) {
        if (s) {
          switch (s.propertyID) {
            case "disabled":
            case "readonly":
            case "visible":
              l.afterMutilEditorChanged(e, s);
              break;
          }
          r && r(s, a);
        }
      }
    };
  }
  /**
   * 当多值编辑器变更时
   * @param propertyData 
   * @param changeObject 
   */
  afterMutilEditorChanged(e, t) {
    this.addNewVariableToViewModel(t, this.viewModelId), this.updateExpressionValue(t), this.clearExpression(t, e);
  }
  /**
   * 
   * @param propertyId 
   * @param componentInstance 
   * @returns 
   */
  updateElementByParentContainer(e, t) {
    const n = t && t.parent && t.parent.schema;
    if (!n)
      return;
    const r = n.contents.findIndex((i) => i.id === e), o = C(n.contents[r]);
    n.contents.splice(r, 1), n.contents.splice(r, 0, o), ve();
  }
  /**
   * 属性编辑器，在编辑过程中会新增变量，此处需要将新增的变量追加到ViewModel中
   * @param changeObject 
   * @param viewModelId 
   * @returns 
   */
  addNewVariableToViewModel(e, t) {
    const n = e.propertyValue;
    if (!(n && typeof n == "object") || !(n.type === "Variable" && n.isNewVariable))
      return;
    const i = {
      id: n.field,
      category: "locale",
      code: n.fullPath,
      name: n.fullPath,
      type: n.newVariableType || "String"
    };
    delete n.newVariableType, delete n.isNewVariable, this.formSchemaUtils.getVariableByCode(i.code) || this.formSchemaUtils.getViewModelById(t).states.push(i);
  }
  /**
   * 更新表达式到expressions节点
   * @param changeObject 
   */
  updateExpressionValue(e) {
    const t = e.propertyValue;
    if (!((t && t.type) === "Expression" && t.expressionInfo))
      return;
    const { expressionId: o, expressionInfo: i } = t, { targetId: l, targetType: s, expressionType: a, value: u, message: p } = i, m = this.formSchemaUtils.getModule();
    m.expressions ?? (m.expressions = []);
    const { expressions: f } = m;
    let h = f.find((M) => M.target === l);
    h || (h = { target: l, rules: [], targetType: s }, f.push(h));
    const w = h.rules.find((M) => M.type === a);
    if (w)
      w.value = u, w.message = p;
    else {
      const M = { id: o, type: a, value: u, message: p };
      h.rules.push(M);
    }
    delete t.expressionInfo;
  }
  /**
   * 属性类型切换为非表达式后，清除原表达式
   * @param changeObject 
   * @param propertyData 
   * @returns 
   */
  clearExpression(e, t) {
    const n = e.propertyValue;
    if (n && n.type === "Expression")
      return;
    const o = e.propertyID, i = this.formSchemaUtils.getExpressions(), l = t.binding ? t.binding.field : t.id, s = i.find((a) => a.target === l);
    !s || !s.rules || (s.rules = s.rules.filter((a) => a.type !== o));
  }
  getExpressionOptions(e, t, n) {
    return new we(this.formSchemaUtils).getExpressionOptions(e, t, n);
  }
  getRealTargetType(e) {
    return ["response-toolbar-item", "tab-toolbar-item", "section-toolbar-item"].indexOf(e.type) > -1 ? "Button" : e.binding && e.binding.field ? "Field" : "Container";
  }
}
class Pe extends Ve {
  constructor(e, t) {
    super(e, t);
  }
  getPropertyConfig(e) {
    return this.propertyConfig.categories.basic = this.getBasicPropConfig(e), this.propertyConfig.categories.template = this.getTemplateProperties(e), this.propertyConfig;
  }
  getTemplateProperties(e) {
    return {
      title: "模板",
      description: "",
      properties: {
        html: {
          title: "html",
          type: "string",
          description: "HTML模板",
          refreshPanelAfterChanged: !0,
          editor: {
            type: "code-editor",
            language: "html"
          }
        }
      }
    };
  }
}
function Se(c, e) {
  function t() {
    return !1;
  }
  function n() {
    return !0;
  }
  function r() {
    return !0;
  }
  function o() {
    return !0;
  }
  function i(l) {
    return new Pe(l, e).getPropertyConfig(c);
  }
  return {
    canAccepts: t,
    hideNestedPaddingInDesginerView: o,
    getPropsConfig: i,
    checkCanDeleteComponent: n,
    checkCanMoveComponent: r
  };
}
const Te = /* @__PURE__ */ U({
  name: "FHtmlTemplateDesign",
  props: W,
  emits: [],
  setup(c, e) {
    const t = V(), n = F("designer-host-service"), r = F("design-item-context"), o = Se(r.schema, n), i = ye(t, r, o);
    Y(() => {
      t.value.componentInstance = i;
    }), e.expose(i.value);
    const s = '<div class="fv-html-template-design-placeholder">请在属性面板中配置模板</div>', a = Z(() => c.html ? c.html : s);
    return () => R("div", {
      ref: t,
      class: "fv-html-template-design",
      innerHTML: a.value
    }, null);
  }
});
S.register = (c, e, t, n) => {
  c["html-template"] = S, e["html-template"] = he;
};
S.registerDesigner = (c, e, t) => {
  c["html-template"] = Te, e["html-template"] = ge;
};
const Be = K(S);
export {
  S as FHtmlTemplate,
  Be as default,
  ge as designPropsResolver,
  W as htmlTemplateDesignProps,
  H as htmlTemplateProps,
  he as propsResolver
};