@farris/ui-vue/components/event-parameter/index.esm.js

Farris Vue, a Farris Design based Vue3 component library.

import { reactive as x, ref as d, computed as I, watch as y, defineComponent as z, inject as K, createVNode as b, Fragment as q, isVNode as J } from "vue";
import { FDynamicFormGroup as Q } from "../dynamic-form/index.esm.js";
import { F_MODAL_SERVICE_TOKEN as W } from "../modal/index.esm.js";
import X, { FTabPage as Y } from "../tabs/index.esm.js";
import P from "../tree-view/index.esm.js";
import Z from "../textarea/index.esm.js";
import ee, { FLayoutPane as R } from "../layout/index.esm.js";
var p = /* @__PURE__ */ ((e) => (e.Default = "Default", e.Textbox = "Textbox", e.Numberbox = "Numberbox", e.Combolist = "Combolist", e.Select = "Select", e.Checkbox = "Checkbox", e.Switch = "Switch", e.Tags = "Tags", e.SortEditor = "SortEditor", e.FilterEditor = "FilterEditor", e.DataEditor = "DataEditor", e.MenuIdSelector = "MenuIdSelector", e.AppIdSelector = "AppIdSelector", e.ComboLookup = "ComboLookup", e.ConfigurationParameterEditor = "ConfigurationParameterEditor", e.FieldMappingEditor = "FieldMappingEditor", e))(p || {});
const h = x({}), te = {
  /** 编辑器类型 */
  data: { type: Object, default: [] },
  /** 复选框组件id  */
  id: { type: String, default: "" },
  /** 视图模型 id */
  editable: { type: Boolean, default: !0 },
  /** 参数编辑器类型 */
  editorType: { type: String, default: "" },
  /** 筛选组件配置器，具体配置项可查看各组件文档 */
  // editor: { type: Object as PropType<EditorConfig>, default: {} },
  // 组件标题
  label: { type: String, default: "" },
  /** 组件值 */
  modelValue: { type: [String, Boolean, Array, Number], default: "" },
  paramData: { type: Object, default: [] },
  // 是否展示标题
  showLabel: { type: Boolean, default: !0 },
  idField: { type: String, default: "" },
  textField: { type: String, default: "" },
  // 只读
  readonly: { type: Boolean, default: !1 },
  // 必填
  disabled: { type: Boolean, default: !1 },
  // 通用参数编辑器字段数据
  fieldData: { type: Object, default: [] },
  // 通用参数编辑器变量数据
  varData: { type: Object, default: [] },
  // 通用参数编辑器表单数据
  formData: { type: Object, default: [] }
};
function oe(e) {
  const o = d(e.editorType);
  function u() {
    h[o.value] = {
      type: "combo-list",
      componentProps: {
        data: e.data,
        editable: e.editable === "true",
        idField: e.idField || "id",
        textField: e.textField || "label",
        enableClear: !0
      }
    };
  }
  function r(n) {
  }
  return { createEditorProps: u, onValueChange: r };
}
function ae(e) {
  const o = d(e.editorType);
  function u() {
    h[o.value] = {
      type: "switch",
      componentProps: {}
    };
  }
  function r() {
  }
  return { createEditorProps: u, onValueChange: r };
}
function N(e) {
  const o = d(e.editorType), u = I(() => o.value === p.Default);
  function r() {
    h[o.value] = {
      type: "input-group",
      componentProps: {}
    };
  }
  function n() {
  }
  return { createEditorProps: r, shouldRenderAppendButton: u, onValueChange: n };
}
function ne(e) {
  const o = d(e.editorType), u = I(() => o.value === p.Default);
  function r() {
    h[o.value] = {
      type: "combo-tree",
      componentProps: {
        data: e.data,
        placeholder: "请选择",
        enableSearch: !1,
        enableClear: !0,
        editable: !1,
        readonly: !1,
        disabled: !1,
        idField: e.idField || "id",
        textField: e.textField || "name",
        mapFields: { id: "selectId" },
        multiSelect: !1,
        customRowStatus: (l) => (l.raw.children && l.raw.children.length && (l.disabled = !0), l)
      }
    };
  }
  y(() => e.data, (l, m) => {
    var g;
    l !== m && ((g = h[o.value]) == null ? void 0 : g.type) === "combo-tree" && (h[o.value].componentProps.data = l);
  });
  function n() {
  }
  return { createEditorProps: r, shouldRenderAppendButton: u, onValueChange: n };
}
function re(e) {
  const o = d(e.editorType);
  function u(l) {
    return `/api/runtime/sys/v1.0/functions/layerFuncs/${(l == null ? void 0 : l.id) || "0"}`;
  }
  function r() {
    h[o.value] = {
      type: "menu-lookup",
      componentProps: {
        fetchNodeApi: u
      }
    };
  }
  function n() {
  }
  return { createEditorProps: r, onValueChange: n };
}
function le(e, o) {
  const u = d(e.editorType), r = oe(e), n = ae(e), l = N(e), m = ne(e), g = re(e);
  function F() {
    const f = u.value;
    return f === p.Combolist || f === p.Select ? r.createEditorProps() : f === p.Checkbox || (f === p.MenuIdSelector ? g.createEditorProps() : f === p.FilterEditor || f === p.DataEditor || f === p.SortEditor || f === p.MenuIdSelector || f === p.AppIdSelector || (f === p.ComboLookup ? m.createEditorProps() : f === p.Numberbox || (f === p.Switch ? (n.createEditorProps(), o.value = o.value === "true") : l.createEditorProps()))), h[u.value];
  }
  function E() {
    return "input-group";
  }
  function S() {
    return {};
  }
  return { getEditorConfig: F, getEditorType: E, getEditorMap: S };
}
function ie(e) {
  const o = x([
    {
      id: "tabField",
      title: "字段",
      treeConfigs: {
        id: "tabFieldTree",
        columns: [{ field: "name" }],
        data: e.fieldData,
        onSelectNode: () => {
        },
        componentRef: d()
      }
    },
    {
      id: "tabVar",
      title: "变量",
      treeConfigs: {
        id: "tabVarTree",
        data: e.varData
      }
    },
    {
      id: "tabForm",
      title: "表单组件",
      treeConfigs: {
        id: "tabFormTree",
        data: e.formData
      }
    }
  ]);
  y(() => e.fieldData, (n, l) => {
    n !== l && (o[0].treeConfigs.data = n);
  }), y(() => e.varData, (n, l) => {
    n !== l && (o[0].treeConfigs.data = n);
  }), y(() => e.formData, (n, l) => {
    n !== l && (o[2].treeConfigs.data = n);
  });
  function u(n) {
    n.forEach((l) => {
      Object.keys(l).forEach((m) => {
        m.indexOf("__fv") > -1 && delete l[m];
      });
    });
  }
  function r() {
    u(o[0].treeConfigs.data), u(o[1].treeConfigs.data), u(o[2].treeConfigs.data);
  }
  return { tabs: o, cleanTreeData: r };
}
function ue(e) {
  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !J(e);
}
const C = /* @__PURE__ */ z({
  name: "FEventParameter",
  props: te,
  emits: ["valueChange", "onBlur", "applicationSelectionChange", "componentSelectionChange", "parameterChanged", "update:modelValue", "update:parameterValue", "confirm"],
  setup(e, o) {
    const u = d(e.id);
    d(e.label), d(e.showLabel);
    const r = d(e.modelValue), n = d(e.modelValue), {
      getEditorConfig: l
    } = le(e, r);
    N(e);
    const m = l();
    d();
    const g = d(), F = d("tabField"), E = K(W), S = d([{
      field: "name",
      title: "",
      dataType: "string",
      width: 350
    }]), f = d({
      enable: !1
    }), M = d({
      customRowStatus: (t) => {
        var a;
        return t.collapse === void 0 && ((!t.raw.parent || !t.raw.parentId) && (t.collapse = !1), ((a = t.raw.data) == null ? void 0 : a.$type) === "ComplexField" && (t.collapse = !0)), t.raw.hasChildren && (t.disabled = !0), t;
      }
    }), D = d({
      customRowStatus: (t) => (t.layer === 0 && (t.disabled = !0), t)
    }), O = I(() => ({
      // 编辑器类型
      type: m == null ? void 0 : m.type,
      /** 根据不同编辑器  设置不同编辑器的属性 */
      ...m == null ? void 0 : m.componentProps
    })), {
      tabs: A,
      cleanTreeData: w
    } = ie(e);
    function L(t) {
      o.emit("update:modelValue", t), o.emit("valueChange", t);
    }
    function k(t, a) {
      const c = a.selectionStart || 0, {
        selectionEnd: i
      } = a, s = i - c, T = s > 0, v = n.value && n.value.split("") || [];
      return T ? v.splice(c, s, t) : v.splice(c, 0, t), v.join("");
    }
    function j(t, a) {
      if (!t.data)
        return;
      const {
        data: c
      } = t;
      let i = t.parentNode, {
        label: s
      } = c;
      for (; i && i.parentNode; )
        i.data && (s = i.data.label + "/" + s), i = i.parentNode;
      return k(`{DATA~/${s}}`, a);
    }
    function _(t, a) {
      const {
        statePath: c
      } = t;
      let i = a.value;
      if (c) {
        const s = c.split("/");
        if (i = c, s.length === 3) {
          const v = `#{${s[1]}}`;
          s.splice(1, 1, v), i = s.join("/");
        }
        i = `{UISTATE~${i}}`;
      }
      return k(i, a);
    }
    function V(t, a, c) {
      const i = g.value.getTextareaElement();
      switch (t) {
        case "tabForm":
          n.value = k(`#{${c.data.id}}`, i);
          break;
        case "tabField":
          n.value = j(c, i);
          break;
        case "tabVar":
          n.value = _(c.data, i);
          break;
      }
      o.emit("paramChanged", {
        tabId: t,
        index: a,
        raw: c,
        value: r.value
      });
    }
    function B() {
      return () => {
        let t;
        return b(ee, {
          class: "nav-tree-panel"
        }, {
          default: () => [b(R, {
            position: "left",
            width: 300,
            resizable: !1
          }, {
            default: () => [b(X, {
              activeId: F.value,
              "onUpdate:activeId": (a) => F.value = a
            }, ue(t = A.map((a) => b(Y, {
              key: a.id,
              id: a.id,
              title: a.title
            }, {
              default: () => [a.id === "tabField" && b(P, {
                rowNumber: f,
                rowOption: M.value,
                key: a.treeConfigs.id,
                data: a.treeConfigs.data,
                columns: S.value,
                fit: !0,
                height: 340,
                onDoubleClickRow: function(i, s) {
                  V(a.id, i, s);
                }
              }, null), a.id === "tabVar" && b(P, {
                rowNumber: f,
                rowOption: D.value,
                key: a.treeConfigs.id,
                data: a.treeConfigs.data,
                fit: !0,
                height: 340,
                onDoubleClickRow: function(i, s) {
                  V(a.id, i, s);
                }
              }, null), a.id === "tabForm" && b(P, {
                rowNumber: f,
                key: a.treeConfigs.id,
                data: a.treeConfigs.data,
                columns: S.value,
                fit: !0,
                height: 340,
                onDoubleClickRow: function(i, s) {
                  V(a.id, i, s);
                }
              }, null)]
            }))) ? t : {
              default: () => [t]
            })]
          }), b(R, {
            position: "center"
          }, {
            default: () => [b(Z, {
              ref: g,
              modelValue: n.value,
              "onUpdate:modelValue": (a) => n.value = a,
              rows: 10,
              autoHeight: !0
            }, null)]
          })]
        });
      };
    }
    function $() {
      n.value = r.value;
      const t = E.open({
        title: "参数编辑器",
        width: 900,
        height: 500,
        fitContent: !1,
        showHeader: !0,
        showCloseButton: !0,
        draggable: !0,
        render: B(),
        onClosed: () => {
          w();
        },
        buttons: [{
          class: "btn btn-secondary",
          text: "取消",
          handle: () => {
            t.destroy(), w();
          }
        }, {
          class: "btn btn-primary",
          text: "确定",
          handle: () => {
            r.value = n.value, o.emit("update:modelValue", r.value), o.emit("confirm", r.value), t.destroy(), w();
          }
        }]
      });
    }
    function U() {
      return O.value.type === "input-group" ? b("span", {
        class: "f-icon f-icon-lookup",
        onClick: $,
        style: "margin-top: 2px;margin-right: 5px;color: rgba(0, 0, 0, .25)"
      }, null) : b(q, null, null);
    }
    y(() => e.modelValue, (t, a) => {
      t !== a && (r.value = t);
    });
    const H = () => {
      o.emit("update:modelValue", "");
    }, G = () => g.value.elementRef;
    return o.expose({
      getInputRef: G
    }), () => b(Q, {
      id: u.value,
      editor: O.value,
      modelValue: r.value,
      "onUpdate:modelValue": (t) => r.value = t,
      showLabel: !1,
      onChange: L,
      onClear: H
    }, {
      groupTextTemplate: () => U()
    });
  }
});
C.install = (e) => {
  e.component(C.name, C);
};
C.register = (e, o, u, r) => {
  e["event-parameter"] = C, o["event-parameter"] = C;
};
C.registerDesigner = (e, o, u) => {
  e["event-parameter"] = C, o["event-parameter"] = C;
};
export {
  p as EditorType,
  C as FEventParameter,
  C as default,
  h as editorMap,
  te as eventParameterProps
};