@kp-ui/lowcode 1.0.20 → 1.0.23

package/src/components/form-designer/form-widget/field-widget/treeSelect-widget.vue.js

@@ -0,0 +1,151 @@
+import p from "./form-item-wrapper.vue.js";
+import b from "../../../../utils/emitter.js";
+import g from "../../../../utils/i18n.js";
+import y from "./fieldMixin.js";
+import { formateTreeToName as v } from "../../../../utils/format.js";
+import { isArray as w } from "lodash-es";
+import { resolveComponent as o, createBlock as n, createCommentVNode as r, openBlock as a, withCtx as s, createElementVNode as f, normalizeClass as C, withDirectives as F, createVNode as M, vShow as _, toDisplayString as x } from "vue";
+/* empty css                       */
+import R from "../../../../../_virtual/_plugin-vue_export-helper.js";
+const I = {
+  name: "treeSelect-widget",
+  componentName: "FieldWidget",
+  //必须固定为FieldWidget，用于接收父级组件的broadcast事件
+  mixins: [b, y, g],
+  props: {
+    field: Object,
+    parentWidget: Object,
+    parentList: Array,
+    indexOfParentList: Number,
+    designer: Object,
+    designState: {
+      type: Boolean,
+      default: !1
+    },
+    subFormRowIndex: {
+      /* 子表单组件行索引，从0开始计数 */
+      type: Number,
+      default: -1
+    },
+    subFormColIndex: {
+      /* 子表单组件列索引，从0开始计数 */
+      type: Number,
+      default: -1
+    },
+    subFormRowId: {
+      /* 子表单组件行Id，唯一id且不可变 */
+      type: String,
+      default: ""
+    }
+  },
+  components: {
+    FormItemWrapper: p
+  },
+  data() {
+    return {
+      oldFieldValue: null,
+      //field组件change之前的值
+      fieldModel: null,
+      rules: []
+    };
+  },
+  computed: {
+    size() {
+      return this.field.options && this.field.options.size ? this.field.options.size : this.designer ? this.designer.formConfig.size || "middle" : this.formConfig.size || "middle";
+    },
+    labelKey() {
+      return this.field.options.labelKey || "label";
+    },
+    valueKey() {
+      return this.field.options.valueKey || "value";
+    },
+    childrenKey() {
+      return this.field.options.childrenKey || "children";
+    },
+    // showFullPath() {
+    //   return this.field.options.showAllLevels === undefined || !!this.field.options.showAllLevels;
+    // },
+    contentForReadMode() {
+      if (!this.fieldModel) return "";
+      const t = w(this.fieldModel) ? this.fieldModel : [this.fieldModel];
+      return v(t, this.field.options.optionItems, {
+        label: this.labelKey,
+        value: this.valueKey,
+        children: this.childrenKey
+      });
+    }
+  },
+  beforeCreate() {
+  },
+  created() {
+    this.registerToRefList(), this.initOptionItems(), this.initFieldModel(), this.initEventHandler(), this.buildFieldRules(), this.handleOnCreated();
+  },
+  mounted() {
+    this.handleOnMounted();
+  },
+  beforeUnmount() {
+    this.unregisterFromRefList();
+  },
+  methods: {
+    /* 开启任意级节点可选后，点击radio隐藏下拉框 */
+    hideDropDownOnClick() {
+    }
+  }
+}, K = { class: "readonly-mode-field" };
+function z(t, d, e, N, l, i) {
+  const m = o("a-tree-select"), u = o("a-tooltip"), h = o("form-item-wrapper");
+  return t.handleHidden() ? r("", !0) : (a(), n(h, {
+    key: 0,
+    designer: e.designer,
+    field: e.field,
+    rules: l.rules,
+    "design-state": e.designState,
+    "parent-widget": e.parentWidget,
+    "parent-list": e.parentList,
+    "index-of-parent-list": e.indexOfParentList,
+    "sub-form-row-index": e.subFormRowIndex,
+    "sub-form-col-index": e.subFormColIndex,
+    "sub-form-row-id": e.subFormRowId
+  }, {
+    default: s(() => [
+      f("div", {
+        class: C(["full-width-input", { "readonly-mode-cascader": t.isReadMode }])
+      }, [
+        F(M(m, {
+          "tree-default-expand-all": e.field.options.treeDefaultExpandAll,
+          ref: "fieldEditor",
+          size: i.size,
+          treeData: e.field.options.optionItems,
+          value: l.fieldModel,
+          "onUpdate:value": d[0] || (d[0] = (c) => l.fieldModel = c),
+          disabled: t.handleDisabled(),
+          allowClear: e.field.options.allowClear,
+          placeholder: e.field.options.placeholder || t.i18nt("render.hint.selectPlaceholder"),
+          fieldNames: { value: i.valueKey, label: i.labelKey, children: i.childrenKey },
+          multiple: e.field.options.multiple,
+          onFocus: t.handleFocusCustomEvent,
+          onBlur: t.handleBlurCustomEvent,
+          onChange: t.handleChangeEvent
+        }, null, 8, ["tree-default-expand-all", "size", "treeData", "value", "disabled", "allowClear", "placeholder", "fieldNames", "multiple", "onFocus", "onBlur", "onChange"]), [
+          [_, !t.isReadMode]
+        ]),
+        t.isReadMode ? (a(), n(u, {
+          key: 0,
+          placement: "topLeft",
+          title: i.contentForReadMode,
+          overlayStyle: { zIndex: 1e3 }
+        }, {
+          default: s(() => [
+            f("span", K, x(i.contentForReadMode), 1)
+          ]),
+          _: 1
+        }, 8, ["title"])) : r("", !0)
+      ], 2)
+    ]),
+    _: 1
+  }, 8, ["designer", "field", "rules", "design-state", "parent-widget", "parent-list", "index-of-parent-list", "sub-form-row-index", "sub-form-col-index", "sub-form-row-id"]));
+}
+const j = /* @__PURE__ */ R(I, [["render", z], ["__scopeId", "data-v-801e372a"]]);
+export {
+  j as default
+};

package/src/components/form-designer/form-widget/index.vue.js

@@ -0,0 +1,213 @@
+import u from "../../../utils/i18n.js";
+import { resolveComponent as s, createBlock as a, openBlock as n, withCtx as d, createElementVNode as g, createVNode as m, normalizeClass as C, createElementBlock as v, createCommentVNode as D, toDisplayString as _, normalizeStyle as y, mergeProps as b, resolveDynamicComponent as f } from "vue";
+/* empty css                        */
+import w from "../../../../_virtual/_plugin-vue_export-helper.js";
+/* empty css                                        */
+/* empty css                                        */
+/* empty css                                        */
+import "./container-widget/grid-col-widget.vue.js";
+import "./container-widget/grid-sub-form-widget.vue.js";
+/* empty css                                  */
+import "./container-widget/sub-form-widget.vue.js";
+import "./container-widget/tab-widget.vue.js";
+import "./container-widget/table-cell-widget.vue.js";
+/* empty css                                   */
+import "./container-widget/vf-box-item.vue.js";
+import "./container-widget/vf-box-widget.vue.js";
+import "./container-widget/vf-collapse-widget.vue2.js";
+/* empty css                                         */
+/* empty css                                         */
+import "./container-widget/vf-dialog-widget.vue.js";
+import "./container-widget/vf-drawer-widget.vue.js";
+import x from "./field-widget/index.js";
+/* empty css           */
+const F = {
+  name: "VFormWidget",
+  componentName: "VFormWidget",
+  mixins: [u],
+  components: {
+    ...x
+  },
+  props: {
+    designer: Object,
+    formConfig: Object,
+    optionData: {
+      //prop传入的选项数据
+      type: Object,
+      default: () => ({})
+    },
+    globalDsv: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  provide() {
+    return {
+      refList: this.widgetRefList,
+      getFormConfig: () => this.formConfig,
+      getGlobalDsv: () => this.globalDsv,
+      // 全局数据源变量
+      globalOptionData: this.optionData,
+      getOptionData: () => this.optionData,
+      getReadMode: () => !1,
+      globalModel: {
+        formModel: this.formModel
+      },
+      getSubFormFieldFlag: () => !1,
+      getSubFormName: () => "",
+      getDSResultCache: () => this.dsResultCache
+    };
+  },
+  inject: ["getDesignerConfig"],
+  data() {
+    return {
+      formModel: {},
+      widgetRefList: {},
+      dsResultCache: {}
+    };
+  },
+  computed: {
+    labelPosition() {
+      return this.designer.formConfig && this.designer.formConfig.labelPosition ? this.designer.formConfig.labelPosition : "horizontal";
+    },
+    size() {
+      return this.designer.formConfig && this.designer.formConfig.size ? this.designer.formConfig.size : "default";
+    },
+    customClass() {
+      return this.designer.formConfig.customClass || "";
+    },
+    layoutType() {
+      return this.designer.getLayoutType();
+    },
+    canvasMinHeight() {
+      return this.getDesignerConfig().logoHeader !== !1 ? "calc(100vh - 56px - 68px)" : "calc(100vh - 56px - 68px + 48px)";
+    }
+  },
+  watch: {
+    "designer.widgetList": {
+      deep: !0,
+      handler(e) {
+      }
+    },
+    "designer.formConfig": {
+      deep: !0,
+      handler(e) {
+      }
+    }
+  },
+  created() {
+    this.designer.initDesigner(!!this.getDesignerConfig().resetFormJson), this.designer.loadPresetCssCode(this.getDesignerConfig().presetCssCode);
+  },
+  mounted() {
+    this.disableFirefoxDefaultDrop(), this.designer.registerFormWidget(this);
+  },
+  methods: {
+    getWidgetName(e) {
+      return e.type + "-widget";
+    },
+    disableFirefoxDefaultDrop() {
+      navigator.userAgent.toLowerCase().indexOf("firefox") !== -1 && (document.body.ondrop = function(o) {
+        o.stopPropagation(), o.preventDefault();
+      });
+    },
+    onDragEnd(e) {
+    },
+    onDragAdd(e) {
+      const o = e.newIndex;
+      this.designer.widgetList[o] && this.designer.setSelected(this.designer.widgetList[o]), this.designer.emitHistoryChange(), this.designer.emitEvent("field-selected", null);
+    },
+    onDragUpdate() {
+      this.designer.emitHistoryChange();
+    },
+    checkMove(e) {
+      return this.designer.checkWidgetMove(e);
+    },
+    getFormData() {
+      return this.formModel;
+    },
+    getWidgetRef(e, o = !1) {
+      const i = this.widgetRefList[e];
+      return !i && o && this.$message.error(this.i18nt("designer.hint.refNotFound") + e), i;
+    },
+    getSelectedWidgetRef() {
+      const e = this.designer.selectedWidgetName;
+      return this.getWidgetRef(e);
+    },
+    clearWidgetRefList() {
+      Object.keys(this.widgetRefList).forEach((e) => {
+        delete this.widgetRefList[e];
+      });
+    }
+  }
+}, L = { class: "form-widget-container" }, z = {
+  key: 0,
+  class: "no-widget-hint"
+}, R = { class: "transition-group-el" };
+function W(e, o, i, k, M, t) {
+  const c = s("draggable"), h = s("a-form"), p = s("a-config-provider");
+  return n(), a(p, {
+    "component-size": t.size,
+    input: { autocomplete: "off" }
+  }, {
+    default: d(() => [
+      g("div", L, [
+        m(h, {
+          class: C(["full-height-width widget-form tpf-form", [t.customClass, t.layoutType + "-layout"]]),
+          layout: ["horizontal", "vertical", "inline"].includes(t.labelPosition) ? t.labelPosition : "horizontal",
+          size: t.size,
+          "validate-on-rule-change": !1
+        }, {
+          default: d(() => [
+            i.designer.widgetList.length === 0 ? (n(), v("div", z, _(e.i18nt("designer.noWidgetHint")), 1)) : D("", !0),
+            g("div", {
+              class: "form-widget-canvas",
+              style: y({ minHeight: t.canvasMinHeight })
+            }, [
+              m(c, b({
+                list: i.designer.widgetList,
+                "item-key": "id"
+              }, { group: "dragGroup", ghostClass: "ghost", animation: 300 }, {
+                tag: "transition-group",
+                "component-data": { name: "fade" },
+                handle: ".drag-handler",
+                onEnd: t.onDragEnd,
+                onAdd: t.onDragAdd,
+                onUpdate: t.onDragUpdate,
+                move: t.checkMove
+              }), {
+                item: d(({ element: r, index: l }) => [
+                  g("div", R, [
+                    r.category === "container" ? (n(), a(f(t.getWidgetName(r)), {
+                      widget: r,
+                      designer: i.designer,
+                      key: r.id,
+                      "parent-list": i.designer.widgetList,
+                      "index-of-parent-list": l,
+                      "parent-widget": null,
+                      "design-state": !0
+                    }, null, 8, ["widget", "designer", "parent-list", "index-of-parent-list"])) : (n(), a(f(t.getWidgetName(r)), {
+                      field: r,
+                      designer: i.designer,
+                      key: r.id,
+                      "parent-list": i.designer.widgetList,
+                      "index-of-parent-list": l,
+                      "parent-widget": null,
+                      "design-state": !0
+                    }, null, 8, ["field", "designer", "parent-list", "index-of-parent-list"]))
+                  ])
+                ]),
+                _: 1
+              }, 16, ["list", "onEnd", "onAdd", "onUpdate", "move"])
+            ], 4)
+          ]),
+          _: 1
+        }, 8, ["layout", "class", "size"])
+      ])
+    ]),
+    _: 1
+  }, 8, ["component-size"]);
+}
+const te = /* @__PURE__ */ w(F, [["render", W], ["__scopeId", "data-v-e8409324"]]);
+export {
+  te as default
+};

package/src/components/form-designer/refMixinDesign.js

@@ -0,0 +1,18 @@
+const e = {
+  methods: {
+    initRefList() {
+      this.refList !== null && this.widget.options.name && (this.refList[this.widget.options.name] = this);
+    },
+    getWidgetRef(t, s) {
+      const i = this.refList[t];
+      return !i && s && this.$message.error(this.i18nt("render.hint.refNotFound") + t), i;
+    },
+    /* 该方法用于组件重名检查！！ */
+    registerToRefList(t) {
+      this.refList !== null && this.widget.options.name && (t && delete this.refList[t], this.refList[this.widget.options.name] = this);
+    }
+  }
+};
+export {
+  e as default
+};

package/src/components/form-designer/setting-panel/form-crud-setting.vue.js

@@ -0,0 +1,121 @@
+import E from "../../../utils/i18n.js";
+import h from "../../http-editor/index.vue.js";
+import _ from "../../code-editor/index.vue.js";
+import { resolveComponent as r, createElementBlock as C, openBlock as F, createVNode as t, createCommentVNode as b, withCtx as i, createElementVNode as H, createTextVNode as f, toDisplayString as c } from "vue";
+import y from "../../../../_virtual/_plugin-vue_export-helper.js";
+const w = {
+  name: "form-crud-setting",
+  mixins: [E],
+  inject: ["getGlobalDsv"],
+  components: { HttpEditor: h, CodeEditor: _ },
+  props: {
+    designer: Object,
+    formConfig: Object
+  },
+  data() {
+    return {
+      curEventName: "",
+      formEventHandlerCode: "",
+      showFormEventDialogFlag: !1,
+      eventParamsMap: {}
+    };
+  },
+  methods: {
+    saveFormEventHandler() {
+      const e = this.$refs.ecEditor.getEditorAnnotations();
+      let o = !1;
+      if (e && e.length > 0 && (e.forEach((l) => {
+        l.type === "error" && (o = !0);
+      }), o)) {
+        this.$message.error(this.i18nt("designer.setting.syntaxCheckWarning"));
+        return;
+      }
+      this.formConfig[this.curEventName] = this.formEventHandlerCode, this.showFormEventDialogFlag = !1;
+    },
+    editFormEventHandler(e) {
+      this.curEventName = e, this.formEventHandlerCode = this.formConfig[e], this.showFormEventDialogFlag = !0;
+    },
+    getFormEventHandled(e) {
+      return !!this.formConfig[e] && this.formConfig[e].length > 0;
+    }
+  }
+}, D = { class: "t-p-[10px]" }, N = { class: "dialog-footer" };
+function k(e, o, l, V, n, p) {
+  const a = r("HttpEditor"), g = r("a-form-item"), m = r("a-button"), d = r("a-alert"), v = r("code-editor"), u = r("a-modal");
+  return F(), C("div", D, [
+    t(g, null, {
+      default: i(() => [
+        t(a, {
+          label: "设置表单编辑api",
+          buttonName: "编辑",
+          drawerTitle: "表单配置",
+          optionModel: l.formConfig.serveList.vformUpdate
+        }, null, 8, ["optionModel"]),
+        t(a, {
+          label: "设置表单获取详情api",
+          buttonName: "编辑",
+          drawerTitle: "表单配置",
+          optionModel: l.formConfig.serveList.vformDetail
+        }, null, 8, ["optionModel"])
+      ]),
+      _: 1
+    }),
+    b("", !0),
+    t(u, {
+      title: e.i18nt("designer.setting.editFormEventHandler"),
+      visible: n.showFormEventDialogFlag,
+      "onUpdate:visible": o[2] || (o[2] = (s) => n.showFormEventDialogFlag = s),
+      "show-close": !0,
+      "append-to-body": "",
+      "close-on-click-modal": !1,
+      "close-on-press-escape": !1,
+      "destroy-on-close": !0
+    }, {
+      footer: i(() => [
+        H("div", N, [
+          t(m, {
+            onClick: o[1] || (o[1] = (s) => n.showFormEventDialogFlag = !1)
+          }, {
+            default: i(() => [
+              f(c(e.i18nt("designer.hint.cancel")), 1)
+            ]),
+            _: 1
+          }),
+          t(m, {
+            type: "primary",
+            onClick: p.saveFormEventHandler
+          }, {
+            default: i(() => [
+              f(c(e.i18nt("designer.hint.confirm")), 1)
+            ]),
+            _: 1
+          }, 8, ["onClick"])
+        ])
+      ]),
+      default: i(() => [
+        t(d, {
+          type: "info",
+          closable: !1,
+          message: "form." + n.eventParamsMap[n.curEventName]
+        }, null, 8, ["message"]),
+        t(v, {
+          mode: "javascript",
+          readonly: !1,
+          modelValue: n.formEventHandlerCode,
+          "onUpdate:modelValue": o[0] || (o[0] = (s) => n.formEventHandlerCode = s),
+          ref: "ecEditor"
+        }, null, 8, ["modelValue"]),
+        t(d, {
+          type: "info",
+          closable: !1,
+          message: "}"
+        })
+      ]),
+      _: 1
+    }, 8, ["title", "visible"])
+  ]);
+}
+const B = /* @__PURE__ */ y(w, [["render", k]]);
+export {
+  B as default
+};