@kp-ui/lowcode 2.14.0-beta.8 → 2.15.0-alpha.1

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

@@ -1,277 +1,157 @@
-import { SvgIcon as C } from "tmgc2-share";
-import F from "../../../../utils/i18n.js";
-import { resolveComponent as b, createElementBlock as n, openBlock as l, normalizeClass as y, createBlock as v, createCommentVNode as c, withModifiers as u, withCtx as r, renderSlot as I, createElementVNode as a, Fragment as g, createVNode as s, toDisplayString as m } from "vue";
+import _ from "./form-item-wrapper.vue2.js";
+import { createElementBlock as t, openBlock as l, withModifiers as c, normalizeClass as v, createVNode as n, createCommentVNode as s, withCtx as f, renderSlot as k, createElementVNode as a, Fragment as g, toDisplayString as r } from "vue";
 /* empty css                       */
-import W from "../../../../../_virtual/_plugin-vue_export-helper.js";
-const k = {
-  name: "form-item-wrapper",
-  mixins: [F],
-  components: {
-    SvgIcon: C
-  },
-  props: {
-    field: Object,
-    designer: Object,
-    parentWidget: Object,
-    parentList: Array,
-    indexOfParentList: Number,
-    designState: {
-      type: Boolean,
-      default: !1
-    },
-    subFormRowIndex: {
-      /* 子表单组件行索引，从0开始计数 */
-      type: Number,
-      default: -1
-    },
-    subFormColIndex: {
-      /* 子表单组件列索引，从0开始计数 */
-      type: Number,
-      default: -1
-    },
-    subFormRowId: {
-      /* 子表单组件行Id，唯一id且不可变 */
-      type: String,
-      default: ""
-    },
-    rules: Array
-  },
-  inject: ["getFormConfig", "getSubFormFieldFlag", "getSubFormName"],
-  computed: {
-    formConfig() {
-      return this.getFormConfig();
-    },
-    selected() {
-      return !!this.designer && this.field.id === this.designer.selectedId;
-    },
-    label() {
-      return this.field.options.labelHidden ? "" : this.field.options.label;
-    },
-    labelWidth() {
-      return this.field.options.labelHidden ? 0 : this.field.options.labelWidth ? this.field.options.labelWidth : this.designer ? this.designer.formConfig.labelWidth : this.formConfig.labelWidth;
-    },
-    labelAlign() {
-      return this.field.options.labelAlign ? this.field.options.labelAlign : this.designer ? this.designer.formConfig.labelAlign || "right" : this.formConfig.labelAlign || "right";
-    },
-    size() {
-      return this.field.options.size ? this.field.options.size : this.designer ? this.designer.formConfig.size || "middle" : this.formConfig.size || "middle";
-    },
-    customClass() {
-      var i;
-      return ((i = this.field.options.customClass) == null ? void 0 : i.join(" ")) || "";
-    },
-    subFormName() {
-      return this.getSubFormName ? this.getSubFormName() : "";
-    },
-    subFormItemFlag() {
-      return this.getSubFormFieldFlag ? this.getSubFormFieldFlag() : !1;
-    }
-  },
-  created() {
-  },
-  methods: {
-    // handleHidden() {
-    //   if (this.designState) {
-    //     return false;
-    //   }
-    //   const { onHidden, hidden } = this.field.options;
-    //   if (hidden) return true;
-    //   if (onHidden) {
-    //     const onHiddenFn = new Function(onHidden);
-    //     return onHiddenFn.call(this);
-    //   }
-    //   return false;
-    // },
-    selectField(i) {
-      this.designer && (this.designer.setSelected(i), this.designer.emitEvent("field-selected", this.parentWidget));
-    },
-    selectParentWidget() {
-      this.parentWidget ? this.designer.setSelected(this.parentWidget) : this.designer.clearSelected();
-    },
-    moveUpWidget() {
-      this.designer.moveUpWidget(this.parentList, this.indexOfParentList), this.designer.emitHistoryChange();
-    },
-    moveDownWidget() {
-      this.designer.moveDownWidget(this.parentList, this.indexOfParentList), this.designer.emitHistoryChange();
-    },
-    removeFieldWidget() {
-      if (this.parentList) {
-        let i = null;
-        this.parentList.length === 1 ? this.parentWidget && (i = this.parentWidget) : this.parentList.length === 1 + this.indexOfParentList ? i = this.parentList[this.indexOfParentList - 1] : i = this.parentList[this.indexOfParentList + 1], this.$nextTick(() => {
-          this.parentList.splice(this.indexOfParentList, 1), this.designer.setSelected(i), this.designer.emitHistoryChange();
-        });
-      }
-    },
-    getPropName() {
-      return this.subFormItemFlag && !this.designState ? this.subFormName + "." + this.subFormRowIndex + "." + this.field.options.name : this.field.options.name;
-    }
-  }
-}, x = { class: "label-box" }, S = {
+import h from "../../../../../_virtual/_plugin-vue_export-helper.js";
+const I = { class: "label-box" }, w = {
   key: 0,
   class: "custom-label"
-}, L = { class: "label-text" }, p = { class: "label-text" }, z = { class: "label-text" }, w = { class: "label-text" }, P = { class: "label-text" }, N = {
+}, y = { class: "label-text" }, C = { class: "label-text" }, W = {
+  key: 1,
+  class: "label-text"
+}, S = {
   key: 0,
   class: "field-action"
-}, A = ["title"], O = ["title"], H = ["title"], T = ["title"], j = {
+}, x = ["title"], L = ["title"], P = ["title"], z = ["title"], D = {
   key: 1,
   class: "drag-handler background-opacity"
-}, D = ["title"], B = { key: 0 };
-function U(i, d, e, E, R, t) {
-  const o = b("svg-icon"), f = b("a-tooltip"), _ = b("a-form-item");
-  return l(), n("div", {
-    class: y(["field-wrapper", { "design-time-bottom-margin": !!this.designer }])
-  }, [
-    e.field.formItemFlag ? (l(), v(_, {
-      key: 0,
-      labelCol: { style: { width: t.labelWidth + "px" } },
-      title: e.field.options.labelTooltip,
-      size: t.size,
-      rules: e.rules,
-      name: t.getPropName(),
-      labelAlign: t.labelAlign,
-      class: y([t.selected ? "selected" : "", t.customClass]),
-      onClick: d[0] || (d[0] = u((h) => t.selectField(e.field), ["stop"]))
-    }, {
-      label: r(() => [
-        a("div", x, [
-          e.field.options.labelIconClass ? (l(), n("span", S, [
-            e.field.options.labelIconPosition === "front" ? (l(), n(g, { key: 0 }, [
-              e.field.options.labelTooltip ? (l(), n(g, { key: 0 }, [
-                s(f, {
-                  title: e.field.options.labelTooltip,
-                  overlayStyle: { zIndex: 1e3 }
-                }, {
-                  default: r(() => [
-                    s(o, {
-                      "icon-class": e.field.options.labelIconClass
-                    }, null, 8, ["icon-class"])
-                  ]),
-                  _: 1
-                }, 8, ["title"]),
-                s(f, {
-                  title: t.label,
-                  overlayStyle: { zIndex: 1e3 }
-                }, {
-                  default: r(() => [
-                    a("div", L, m(t.label), 1)
-                  ]),
-                  _: 1
-                }, 8, ["title"])
-              ], 64)) : (l(), n(g, { key: 1 }, [
-                s(o, {
-                  "icon-class": e.field.options.labelIconClass
-                }, null, 8, ["icon-class"]),
-                s(f, {
-                  title: t.label,
-                  overlayStyle: { zIndex: 1e3 }
-                }, {
-                  default: r(() => [
-                    a("div", p, m(t.label), 1)
-                  ]),
-                  _: 1
-                }, 8, ["title"])
-              ], 64))
-            ], 64)) : e.field.options.labelIconPosition === "rear" ? (l(), n(g, { key: 1 }, [
-              e.field.options.labelTooltip ? (l(), n(g, { key: 0 }, [
-                s(f, {
-                  title: t.label,
-                  overlayStyle: { zIndex: 1e3 }
-                }, {
-                  default: r(() => [
-                    a("div", z, m(t.label), 1)
-                  ]),
-                  _: 1
-                }, 8, ["title"]),
-                s(f, {
-                  title: e.field.options.labelTooltip,
-                  overlayStyle: { zIndex: 1e3 }
-                }, {
-                  default: r(() => [
-                    s(o, {
-                      "icon-class": e.field.options.labelIconClass
-                    }, null, 8, ["icon-class"])
-                  ]),
-                  _: 1
-                }, 8, ["title"])
-              ], 64)) : (l(), n(g, { key: 1 }, [
-                s(f, {
-                  title: t.label,
-                  overlayStyle: { zIndex: 1e3 }
-                }, {
-                  default: r(() => [
-                    a("div", w, m(t.label), 1)
-                  ]),
-                  _: 1
-                }, 8, ["title"]),
-                s(o, {
-                  "icon-class": e.field.options.labelIconClass
-                }, null, 8, ["icon-class"])
-              ], 64))
-            ], 64)) : c("", !0)
-          ])) : (l(), v(f, {
-            key: 1,
-            title: t.label,
-            overlayStyle: { zIndex: 1e3 }
-          }, {
-            default: r(() => [
-              a("div", P, m(t.label), 1)
-            ]),
-            _: 1
-          }, 8, ["title"]))
-        ])
-      ]),
-      default: r(() => [
-        I(i.$slots, "default", {}, void 0, !0)
-      ]),
-      _: 3
-    }, 8, ["labelCol", "title", "size", "rules", "name", "labelAlign", "class"])) : c("", !0),
-    this.designer ? (l(), n(g, { key: 1 }, [
-      e.designer.selectedId === e.field.id ? (l(), n("div", N, [
-        a("i", {
-          title: i.i18nt("designer.hint.selectParentWidget"),
-          onClick: d[1] || (d[1] = u((h) => t.selectParentWidget(e.field), ["stop"]))
-        }, [
-          s(o, { "icon-class": "icon-el-back" })
-        ], 8, A),
-        e.parentList && e.parentList.length > 1 ? (l(), n("i", {
-          key: 0,
-          title: i.i18nt("designer.hint.moveUpWidget"),
-          onClick: d[2] || (d[2] = u((h) => t.moveUpWidget(e.field), ["stop"]))
-        }, [
-          s(o, { "icon-class": "icon-el-move-up" })
-        ], 8, O)) : c("", !0),
-        e.parentList && e.parentList.length > 1 ? (l(), n("i", {
-          key: 1,
-          title: i.i18nt("designer.hint.moveDownWidget"),
-          onClick: d[3] || (d[3] = u((h) => t.moveDownWidget(e.field), ["stop"]))
-        }, [
-          s(o, { "icon-class": "icon-el-move-down" })
-        ], 8, H)) : c("", !0),
-        a("i", {
-          title: i.i18nt("designer.hint.remove"),
-          onClick: d[4] || (d[4] = u((...h) => t.removeFieldWidget && t.removeFieldWidget(...h), ["stop"]))
-        }, [
-          s(o, { "icon-class": "icon-el-delete" })
-        ], 8, T)
-      ])) : c("", !0),
-      e.designer.selectedId === e.field.id ? (l(), n("div", j, [
-        a("i", {
-          title: i.i18nt("designer.hint.dragHandler")
-        }, [
-          s(o, { "icon-class": "icon-el-drag-move" })
-        ], 8, D),
-        a("i", null, m(i.i18n2t(
-          `designer.widgetLabel.${e.field.type}`,
-          `extension.widgetLabel.${e.field.type}`
-        )), 1),
-        e.field.options.hidden === !0 ? (l(), n("i", B, [
-          s(o, { "icon-class": "icon-el-hide" })
-        ])) : c("", !0)
-      ])) : c("", !0)
-    ], 64)) : c("", !0)
-  ], 2);
+}, N = ["title"], U = { key: 0 };
+function A(b, o, i, e, F, V) {
+  var m;
+  return l(), t(
+    "div",
+    {
+      class: v(["field-wrapper", {
+        "design-time-bottom-margin": e.designState,
+        "field-wrapper-widget": e.designState,
+        selected: e.selected
+      }]),
+      onClick: o[4] || (o[4] = c((d) => e.selectWidget(i.field), ["stop"]))
+    },
+    [
+      n(e.FormItem, {
+        labelCol: { style: { width: e.labelWidth + "px" } },
+        title: e.label,
+        size: e.size,
+        rules: i.rules,
+        name: e.getPropName,
+        labelAlign: e.labelAlign,
+        class: v([e.customClass])
+      }, {
+        label: f(() => [
+          a("div", I, [
+            i.field.options.labelIconClass ? (l(), t("span", w, [
+              i.field.options.labelIconPosition === "front" ? (l(), t(
+                g,
+                { key: 0 },
+                [
+                  n(e.SvgIcon, {
+                    "icon-class": i.field.options.labelIconClass
+                  }, null, 8, ["icon-class"]),
+                  a(
+                    "div",
+                    y,
+                    r(e.label),
+                    1
+                    /* TEXT */
+                  )
+                ],
+                64
+                /* STABLE_FRAGMENT */
+              )) : i.field.options.labelIconPosition === "rear" ? (l(), t(
+                g,
+                { key: 1 },
+                [
+                  a(
+                    "div",
+                    C,
+                    r(e.label),
+                    1
+                    /* TEXT */
+                  ),
+                  n(e.SvgIcon, {
+                    "icon-class": i.field.options.labelIconClass
+                  }, null, 8, ["icon-class"])
+                ],
+                64
+                /* STABLE_FRAGMENT */
+              )) : s("v-if", !0)
+            ])) : (l(), t(
+              "div",
+              W,
+              r(e.label),
+              1
+              /* TEXT */
+            ))
+          ])
+        ]),
+        default: f(() => [
+          k(b.$slots, "default", {}, void 0, !0)
+        ]),
+        _: 3
+        /* FORWARDED */
+      }, 8, ["labelCol", "title", "size", "rules", "name", "labelAlign", "class"]),
+      e.designState ? (l(), t(
+        g,
+        { key: 0 },
+        [
+          ((m = e.designer) == null ? void 0 : m.selectedId) === i.field.id ? (l(), t("div", S, [
+            a("i", {
+              title: e.i18nt("designer.hint.selectParentWidget"),
+              onClick: o[0] || (o[0] = c((...d) => e.selectParentWidget && e.selectParentWidget(...d), ["stop"]))
+            }, [
+              n(e.SvgIcon, { "icon-class": "icon-el-back" })
+            ], 8, x),
+            i.parentList && i.parentList.length > 1 ? (l(), t("i", {
+              key: 0,
+              title: e.i18nt("designer.hint.moveUpWidget"),
+              onClick: o[1] || (o[1] = c((...d) => e.moveUpWidget && e.moveUpWidget(...d), ["stop"]))
+            }, [
+              n(e.SvgIcon, { "icon-class": "icon-el-move-up" })
+            ], 8, L)) : s("v-if", !0),
+            i.parentList && i.parentList.length > 1 ? (l(), t("i", {
+              key: 1,
+              title: e.i18nt("designer.hint.moveDownWidget"),
+              onClick: o[2] || (o[2] = c((...d) => e.moveDownWidget && e.moveDownWidget(...d), ["stop"]))
+            }, [
+              n(e.SvgIcon, { "icon-class": "icon-el-move-down" })
+            ], 8, P)) : s("v-if", !0),
+            a("i", {
+              title: e.i18nt("designer.hint.remove"),
+              onClick: o[3] || (o[3] = c((...d) => e.removeWidget && e.removeWidget(...d), ["stop"]))
+            }, [
+              n(e.SvgIcon, { "icon-class": "icon-el-delete" })
+            ], 8, z)
+          ])) : s("v-if", !0),
+          e.selected ? (l(), t("div", D, [
+            a("i", {
+              title: e.i18nt("designer.hint.dragHandler")
+            }, [
+              n(e.SvgIcon, { "icon-class": "icon-el-drag-move" })
+            ], 8, N),
+            a(
+              "i",
+              null,
+              r(e.i18n2t(
+                `designer.widgetLabel.${i.field.type}`,
+                `extension.widgetLabel.${i.field.type}`
+              )),
+              1
+              /* TEXT */
+            ),
+            i.field.options.hidden === !0 ? (l(), t("i", U, [
+              n(e.SvgIcon, { "icon-class": "icon-el-hide" })
+            ])) : s("v-if", !0)
+          ])) : s("v-if", !0)
+        ],
+        64
+        /* STABLE_FRAGMENT */
+      )) : s("v-if", !0)
+    ],
+    2
+    /* CLASS */
+  );
 }
-const K = /* @__PURE__ */ W(k, [["render", U], ["__scopeId", "data-v-c2f3bcb4"]]);
+const j = /* @__PURE__ */ h(_, [["render", A], ["__scopeId", "data-v-e14e1a58"], ["__file", "/Users/zhaopeng/dev/kunpeng/tmgc2-web-vfrom/src/components/form-designer/form-widget/field-widget/form-item-wrapper.vue"]]);
 export {
-  K as default
+  j as default
 };

package/src/components/form-designer/form-widget/field-widget/form-item-wrapper.vue2.js

@@ -0,0 +1,127 @@
+import { defineComponent as O, inject as g, computed as n } from "vue";
+import { SvgIcon as z } from "tmgc2-share";
+import { useI18n as L } from "../../../../utils/i18n.js";
+import { useContainerWidget as j } from "../container-widget/useContainerWidget.js";
+import { FormItem as R } from "ant-design-vue";
+import { useDesigner as D } from "../useFormDesigner.js";
+const J = /* @__PURE__ */ O({
+  name: "form-item-wrapper",
+  __name: "form-item-wrapper",
+  props: {
+    rules: {
+      type: Array,
+      required: !1
+    },
+    widget: {
+      type: null,
+      required: !0
+    },
+    field: {
+      type: null,
+      required: !0
+    },
+    designer: {
+      type: null,
+      required: !1
+    },
+    parentWidget: {
+      type: [Object, null],
+      required: !1,
+      default: null
+    },
+    parentList: {
+      type: [Array, null],
+      required: !1
+    },
+    indexOfParentList: {
+      type: Number,
+      required: !1,
+      default: 0
+    },
+    subFormRowIndex: {
+      type: Number,
+      required: !1
+    },
+    subFormRowId: {
+      type: String,
+      required: !1
+    },
+    subFormColIndex: {
+      type: Number,
+      required: !1
+    }
+  },
+  setup(b, {
+    expose: c
+  }) {
+    c();
+    const {
+      i18nt: F,
+      i18n2t: y
+    } = L(), e = b, s = g("getSubFormName", () => ""), u = g("getSubFormFieldFlag", () => !1), {
+      formConfig: o,
+      designer: W,
+      designState: d
+    } = D(), v = n(() => {
+      var t, r, i, l, p;
+      return (r = (t = e.field) == null ? void 0 : t.options) != null && r.labelHidden ? 0 : (l = (i = e.field) == null ? void 0 : i.options) != null && l.labelWidth ? e.field.options.labelWidth : (p = o.value) == null ? void 0 : p.labelWidth;
+    }), q = n(() => {
+      var t, r, i, l;
+      return (r = (t = e.field) == null ? void 0 : t.options) != null && r.labelHidden ? "" : (l = (i = e.field) == null ? void 0 : i.options) == null ? void 0 : l.label;
+    }), I = n(() => {
+      var t, r, i;
+      return (r = (t = e.field) == null ? void 0 : t.options) != null && r.labelAlign ? e.field.options.labelAlign : ((i = o.value) == null ? void 0 : i.labelAlign) || "right";
+    }), a = n(() => () => s ? s() : ""), S = n(() => {
+      var t, r, i;
+      return (r = (t = e.field) == null ? void 0 : t.options) != null && r.size ? e.field.options.size : ((i = o.value) == null ? void 0 : i.size) || "middle";
+    }), m = n(() => u ? u() : !1), _ = n(() => m.value && !d ? a.value + "." + e.subFormRowIndex + "." + e.field.options.name : e.field.options.name), {
+      customClass: w,
+      selected: x,
+      moveUpWidget: N,
+      selectWidget: A,
+      selectParentWidget: P,
+      removeWidget: h,
+      moveDownWidget: C
+    } = j({
+      widget: e.field,
+      parentWidget: e.parentWidget,
+      indexOfParentList: e.indexOfParentList
+    }), f = {
+      i18nt: F,
+      i18n2t: y,
+      props: e,
+      getSubFormName: s,
+      getSubFormFieldFlag: u,
+      formConfig: o,
+      designer: W,
+      designState: d,
+      labelWidth: v,
+      label: q,
+      labelAlign: I,
+      subFormName: a,
+      size: S,
+      subFormItemFlag: m,
+      getPropName: _,
+      customClass: w,
+      selected: x,
+      moveUpWidget: N,
+      selectWidget: A,
+      selectParentWidget: P,
+      removeWidget: h,
+      moveDownWidget: C,
+      get SvgIcon() {
+        return z;
+      },
+      get FormItem() {
+        return R;
+      }
+    };
+    return Object.defineProperty(f, "__isScriptSetup", {
+      enumerable: !1,
+      value: !0
+    }), f;
+  }
+});
+export {
+  J as default
+};