@kp-ui/lowcode 2.14.0-beta → 2.14.0-beta.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kp-ui/lowcode",
-  "version": "2.14.0-beta",
+  "version": "2.14.0-beta.1",
   "publishConfig": {
     "access": "public"
   },

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

@@ -1,27 +1,27 @@
-import { TpfCodeEditor as R } from "tmgc2-share";
-import D from "./property-editor/index.js";
+import { TpfCodeEditor as F } from "tmgc2-share";
+import V from "./property-editor/index.js";
 import K from "./form-setting.vue.js";
 import O from "./form-crud-setting.vue.js";
-import V, { propertyRegistered as j } from "./propertyRegister.js";
-import { addWindowResizeHandler as U } from "../../../utils/util.js";
-import I from "../../../utils/i18n.js";
-import { get as z } from "../../../utils/smart-vue-i18n/utils.js";
-import B from "../../../utils/emitter.js";
-import L from "../../code-editor/code-modal-editor.vue.js";
-import { resolveComponent as m, createElementBlock as c, openBlock as i, Fragment as u, createVNode as h, withCtx as s, createBlock as g, createCommentVNode as a, createElementVNode as P, normalizeStyle as w, withModifiers as W, renderList as p, resolveDynamicComponent as C } from "vue";
+import R, { propertyRegistered as D } from "./propertyRegister.js";
+import { addWindowResizeHandler as A } from "../../../utils/util.js";
+import j from "../../../utils/i18n.js";
+import { get as x } from "../../../utils/smart-vue-i18n/utils.js";
+import z from "../../../utils/emitter.js";
+import I from "../../code-editor/code-modal-editor.vue.js";
+import { resolveComponent as n, createElementBlock as p, openBlock as s, Fragment as h, createVNode as r, withCtx as l, createBlock as g, createCommentVNode as _, createElementVNode as u, normalizeStyle as v, withModifiers as U, renderList as E, normalizeClass as B, resolveDynamicComponent as L } from "vue";
 /* empty css           */
 /* empty css           */
 import q from "../../../../_virtual/_plugin-vue_export-helper.js";
-const { COMMON_PROPERTIES: x, ADVANCED_PROPERTIES: G, EVENT_PROPERTIES: J } = V, Q = {
+const { COMMON_PROPERTIES: G, ADVANCED_PROPERTIES: J, EVENT_PROPERTIES: Q } = R, X = {
   name: "SettingPanel",
   componentName: "SettingPanel",
-  mixins: [I, B],
+  mixins: [j, z],
   components: {
-    TpfCodeEditor: R,
+    TpfCodeEditor: F,
     FormSetting: K,
-    CodeModalEditor: L,
+    CodeModalEditor: I,
     FormCrudSetting: O,
-    ...D
+    ...V
   },
   props: {
     designer: Object,
@@ -47,9 +47,9 @@ const { COMMON_PROPERTIES: x, ADVANCED_PROPERTIES: G, EVENT_PROPERTIES: J } = V,
       activeTab: "2",
       widgetActiveCollapseNames: ["1", "2", "3"],
       formActiveCollapseNames: ["1", "2"],
-      commonProps: x,
-      advProps: G,
-      eventProps: J,
+      commonProps: G,
+      advProps: J,
+      eventProps: Q,
       showWidgetEventDialogFlag: !1,
       eventHandlerCode: "",
       curEventName: "",
@@ -65,6 +65,42 @@ const { COMMON_PROPERTIES: x, ADVANCED_PROPERTIES: G, EVENT_PROPERTIES: J } = V,
       set(e) {
         this.selectedWidget.options = e;
       }
+    },
+    /**
+     * 构建折叠面板配置列表，用于循环渲染面板
+     * 将常见/高级/事件属性的差异抽象为配置，减少模板重复
+     */
+    collapsePanels() {
+      const e = this.showCollapse(this.commonProps), t = this.showCollapse(this.advProps), i = this.showEventCollapse() && this.showCollapse(this.eventProps);
+      return [
+        {
+          key: "1",
+          headerKey: this.i18nt("designer.setting.常见属性"),
+          props: this.commonProps,
+          className: "",
+          visible: e,
+          useVModel: !0,
+          isEvent: !1
+        },
+        {
+          key: "2",
+          headerKey: this.i18nt("designer.setting.高级属性"),
+          props: this.advProps,
+          className: "",
+          visible: t,
+          useVModel: !1,
+          isEvent: !1
+        },
+        {
+          key: "3",
+          headerKey: this.i18nt("designer.setting.事件属性"),
+          props: this.eventProps,
+          className: "eventPanel",
+          visible: i,
+          useVModel: !1,
+          isEvent: !0
+        }
+      ].filter((d) => d.visible);
     }
   },
   watch: {
@@ -97,47 +133,54 @@ const { COMMON_PROPERTIES: x, ADVANCED_PROPERTIES: G, EVENT_PROPERTIES: J } = V,
     });
   },
   mounted() {
-    this.designer.selectedWidget ? this.activeTab = "1" : this.activeTab = "2", this.scrollerHeight = window.innerHeight - 56 - 48 + "px", U(() => {
+    this.designer.selectedWidget ? this.activeTab = "1" : this.activeTab = "2", this.scrollerHeight = window.innerHeight - 56 - 48 + "px", A(() => {
       this.$nextTick(() => {
         this.scrollerHeight = window.innerHeight - 56 - 48 + "px";
       });
     });
   },
   methods: {
+    /**
+     * 处理 option-model 的双向绑定更新
+     * 与 v-model:option-model 等效，实现通用事件绑定方式
+     */
+    onUpdateOptionModel(e) {
+      this.optionModel = e;
+    },
     getEventHandled(e) {
       return !!this.optionModel[e] && this.optionModel[e].length > 0;
     },
     showEventCollapse() {
       return this.designerConfig.eventCollapse === void 0 ? !0 : !!this.designerConfig.eventCollapse;
     },
-    hasPropEditor(e, o) {
-      if (!o)
+    hasPropEditor(e, t) {
+      if (!t)
         return !1;
       if (e.indexOf("-") <= -1) {
-        const d = this.selectedWidget.type + "-" + e;
-        if (j(d))
+        const o = this.selectedWidget.type + "-" + e;
+        if (D(o))
           return !1;
       }
-      const n = e.replace(this.selectedWidget.type + "-", "");
-      return this.designer.hasConfig(this.selectedWidget, n);
+      const i = e.replace(this.selectedWidget.type + "-", "");
+      return this.designer.hasConfig(this.selectedWidget, i);
     },
-    getPropEditor(e, o) {
-      const n = e.replace(this.selectedWidget.type + "-", ""), f = `${this.selectedWidget.type}-${n}-editor`;
-      return this.$options.components[f] || this.$root.$.appContext.components[f] ? f : o;
+    getPropEditor(e, t) {
+      const i = e.replace(this.selectedWidget.type + "-", ""), d = `${this.selectedWidget.type}-${i}-editor`;
+      return this.$options.components[d] || this.$root.$.appContext.components[d] ? d : t;
     },
     showCollapse(e) {
-      let o = !1;
-      for (const n in e)
-        if (e.hasOwnProperty(n) && this.hasPropEditor(n, e[n])) {
-          o = !0;
+      let t = !1;
+      for (const i in e)
+        if (e.hasOwnProperty(i) && this.hasPropEditor(i, e[i])) {
+          t = !0;
           break;
         }
-      return o;
+      return t;
     },
-    editEventHandler(e, o) {
-      this.curEventName = e, this.eventHeader = `${this.optionModel.name}.${e}(${o.join(
+    editEventHandler(e, t) {
+      this.curEventName = e, this.eventHeader = `${this.optionModel.name}.${e}(${t.join(
         ", "
-      )}) {`, this.eventHandlerCode = z(this.selectedWidget.options, e) || "", console.log({ eventName: e, eventHandlerCode: this.eventHandlerCode }), e === "onValidate" && !this.optionModel.onValidate && (this.eventHandlerCode = `  /* sample code */
+      )}) {`, this.eventHandlerCode = x(this.selectedWidget.options, e) || "", console.log({ eventName: e, eventHandlerCode: this.eventHandlerCode }), e === "onValidate" && !this.optionModel.onValidate && (this.eventHandlerCode = `  /* sample code */
   /*
   if ((value > 100) || (value < 0)) {
     return Promise.reject('error message')  //fail
@@ -148,218 +191,112 @@ const { COMMON_PROPERTIES: x, ADVANCED_PROPERTIES: G, EVENT_PROPERTIES: J } = V,
     },
     saveEventHandler(e) {
       if (this.curEventName.includes(".")) {
-        const [o, n] = this.curEventName.split(".");
-        this.selectedWidget.options[o][n] = e;
+        const [t, i] = this.curEventName.split(".");
+        this.selectedWidget.options[t][i] = e;
       } else
         this.selectedWidget.options[this.curEventName] = e;
     }
   }
 };
-function X(e, o, n, f, d, t) {
-  const v = m("a-collapse-panel"), _ = m("a-collapse"), b = m("a-form"), H = m("a-empty"), E = m("a-tab-pane"), k = m("form-setting"), M = m("FormCrudSetting"), S = m("a-tabs"), T = m("a-layout"), F = m("a-config-provider"), A = m("TpfCodeEditor");
-  return i(), c(u, null, [
-    h(F, { componentSize: "small" }, {
-      default: s(() => [
-        h(T, { class: "panel-container" }, {
-          default: s(() => [
-            h(S, {
-              activeKey: d.activeTab,
-              "onUpdate:activeKey": o[6] || (o[6] = (r) => d.activeTab = r),
+function Y(e, t, i, d, o, a) {
+  const b = n("a-collapse-panel"), y = n("a-collapse"), P = n("a-form"), H = n("a-empty"), f = n("a-tab-pane"), w = n("form-setting"), W = n("FormCrudSetting"), M = n("a-tabs"), S = n("a-layout"), k = n("a-config-provider"), N = n("TpfCodeEditor");
+  return s(), p(h, null, [
+    r(k, { componentSize: "small" }, {
+      default: l(() => [
+        r(S, { class: "panel-container" }, {
+          default: l(() => [
+            r(M, {
+              activeKey: o.activeTab,
+              "onUpdate:activeKey": t[3] || (t[3] = (c) => o.activeTab = c),
               style: { height: "100%", width: "100%", overflow: "hidden" }
             }, {
-              default: s(() => [
-                h(E, {
+              default: l(() => [
+                r(f, {
                   tab: e.i18nt("designer.hint.widgetSetting"),
                   key: "1"
                 }, {
-                  default: s(() => [
-                    P("div", {
+                  default: l(() => [
+                    u("div", {
                       class: "setting-scrollbar",
-                      style: w({ height: d.scrollerHeight })
+                      style: v({ height: o.scrollerHeight })
                     }, [
-                      n.designer.selectedWidget && !n.designer.selectedWidget.category ? (i(), g(b, {
+                      i.designer.selectedWidget ? (s(), g(P, {
                         key: 0,
-                        model: t.optionModel,
+                        model: a.optionModel,
                         labelAlign: "left",
                         "label-width": "120px",
                         class: "setting-form tpf-form",
-                        onSubmit: o[2] || (o[2] = W(() => {
+                        onSubmit: t[2] || (t[2] = U(() => {
                         }, ["prevent"]))
                       }, {
-                        default: s(() => [
-                          h(_, {
-                            activeKey: d.widgetActiveCollapseNames,
-                            "onUpdate:activeKey": o[1] || (o[1] = (r) => d.widgetActiveCollapseNames = r),
+                        default: l(() => [
+                          r(y, {
+                            activeKey: o.widgetActiveCollapseNames,
+                            "onUpdate:activeKey": t[1] || (t[1] = (c) => o.widgetActiveCollapseNames = c),
                             class: "setting-collapse"
                           }, {
-                            default: s(() => [
-                              t.showCollapse(d.commonProps) ? (i(), g(v, {
-                                key: "1",
-                                header: e.i18nt("designer.setting.常见属性")
-                              }, {
-                                default: s(() => [
-                                  (i(!0), c(u, null, p(d.commonProps, (r, l) => (i(), c(u, null, [
-                                    t.hasPropEditor(l, r) ? (i(), g(C(t.getPropEditor(l, r)), {
-                                      key: l,
-                                      designer: n.designer,
-                                      "selected-widget": n.selectedWidget,
-                                      "option-model": t.optionModel,
-                                      "onUpdate:optionModel": o[0] || (o[0] = (y) => t.optionModel = y)
-                                    }, null, 40, ["designer", "selected-widget", "option-model"])) : a("", !0)
-                                  ], 64))), 256))
-                                ]),
-                                _: 1
-                              }, 8, ["header"])) : a("", !0),
-                              t.showCollapse(d.advProps) ? (i(), g(v, {
-                                key: "2",
-                                header: e.i18nt("designer.setting.高级属性")
+                            default: l(() => [
+                              (s(!0), p(h, null, E(a.collapsePanels, (c) => (s(), g(b, {
+                                key: c.key,
+                                class: B(c.className),
+                                header: c.headerKey
                               }, {
-                                default: s(() => [
-                                  (i(!0), c(u, null, p(d.advProps, (r, l) => (i(), c(u, null, [
-                                    t.hasPropEditor(l, r) ? (i(), g(C(t.getPropEditor(l, r)), {
-                                      key: l,
-                                      designer: n.designer,
-                                      "selected-widget": n.selectedWidget,
-                                      "option-model": t.optionModel
-                                    }, null, 8, ["designer", "selected-widget", "option-model"])) : a("", !0)
+                                default: l(() => [
+                                  (s(!0), p(h, null, E(c.props, (C, m) => (s(), p(h, null, [
+                                    a.hasPropEditor(m, C) ? (s(), g(L(a.getPropEditor(m, C)), {
+                                      key: m,
+                                      designer: i.designer,
+                                      "selected-widget": i.selectedWidget,
+                                      "option-model": a.optionModel,
+                                      "onUpdate:optionModel": t[0] || (t[0] = (T) => a.optionModel = T),
+                                      "event-handled": a.getEventHandled(m)
+                                    }, null, 40, ["designer", "selected-widget", "option-model", "event-handled"])) : _("", !0)
                                   ], 64))), 256))
                                 ]),
-                                _: 1
-                              }, 8, ["header"])) : a("", !0),
-                              t.showEventCollapse() && t.showCollapse(d.eventProps) ? (i(), g(v, {
-                                key: "3",
-                                class: "eventPanel",
-                                header: e.i18nt("designer.setting.事件属性")
-                              }, {
-                                default: s(() => [
-                                  (i(!0), c(u, null, p(d.eventProps, (r, l) => (i(), c(u, null, [
-                                    t.hasPropEditor(l, r) ? (i(), g(C(t.getPropEditor(l, r)), {
-                                      key: l,
-                                      designer: n.designer,
-                                      "selected-widget": n.selectedWidget,
-                                      "option-model": t.optionModel,
-                                      "event-handled": t.getEventHandled(l)
-                                    }, null, 8, ["designer", "selected-widget", "option-model", "event-handled"])) : a("", !0)
-                                  ], 64))), 256))
-                                ]),
-                                _: 1
-                              }, 8, ["header"])) : a("", !0)
+                                _: 2
+                              }, 1032, ["class", "header"]))), 128))
                             ]),
                             _: 1
                           }, 8, ["activeKey"])
                         ]),
                         _: 1
-                      }, 8, ["model"])) : a("", !0),
-                      n.designer.selectedWidget && n.designer.selectedWidget.category ? (i(), g(b, {
+                      }, 8, ["model"])) : (s(), g(H, {
                         key: 1,
-                        model: t.optionModel,
-                        labelAlign: "left",
-                        "label-width": "120px",
-                        class: "setting-form tpf-form",
-                        onSubmit: o[5] || (o[5] = W(() => {
-                        }, ["prevent"]))
-                      }, {
-                        default: s(() => [
-                          h(_, {
-                            activeKey: d.widgetActiveCollapseNames,
-                            "onUpdate:activeKey": o[4] || (o[4] = (r) => d.widgetActiveCollapseNames = r),
-                            class: "setting-collapse"
-                          }, {
-                            default: s(() => [
-                              t.showCollapse(d.commonProps) ? (i(), g(v, {
-                                key: "1",
-                                header: e.i18nt("designer.setting.常见属性")
-                              }, {
-                                default: s(() => [
-                                  (i(!0), c(u, null, p(d.commonProps, (r, l) => (i(), c(u, null, [
-                                    t.hasPropEditor(l, r) ? (i(), g(C(t.getPropEditor(l, r)), {
-                                      key: l,
-                                      designer: n.designer,
-                                      "selected-widget": n.selectedWidget,
-                                      "option-model": t.optionModel,
-                                      "onUpdate:optionModel": o[3] || (o[3] = (y) => t.optionModel = y)
-                                    }, null, 40, ["designer", "selected-widget", "option-model"])) : a("", !0)
-                                  ], 64))), 256))
-                                ]),
-                                _: 1
-                              }, 8, ["header"])) : a("", !0),
-                              t.showCollapse(d.advProps) ? (i(), g(v, {
-                                key: "2",
-                                header: e.i18nt("designer.setting.高级属性")
-                              }, {
-                                default: s(() => [
-                                  (i(!0), c(u, null, p(d.advProps, (r, l) => (i(), c(u, null, [
-                                    t.hasPropEditor(l, r) ? (i(), g(C(t.getPropEditor(l, r)), {
-                                      key: l,
-                                      designer: n.designer,
-                                      "selected-widget": n.selectedWidget,
-                                      "option-model": t.optionModel
-                                    }, null, 8, ["designer", "selected-widget", "option-model"])) : a("", !0)
-                                  ], 64))), 256))
-                                ]),
-                                _: 1
-                              }, 8, ["header"])) : a("", !0),
-                              t.showEventCollapse() && t.showCollapse(d.eventProps) ? (i(), g(v, {
-                                key: "3",
-                                class: "eventPanel",
-                                header: e.i18nt("designer.setting.事件属性")
-                              }, {
-                                default: s(() => [
-                                  (i(!0), c(u, null, p(d.eventProps, (r, l) => (i(), c(u, null, [
-                                    t.hasPropEditor(l, r) ? (i(), g(C(t.getPropEditor(l, r)), {
-                                      key: l,
-                                      designer: n.designer,
-                                      "selected-widget": n.selectedWidget,
-                                      "option-model": t.optionModel,
-                                      "event-handled": t.getEventHandled(l)
-                                    }, null, 8, ["designer", "selected-widget", "option-model", "event-handled"])) : a("", !0)
-                                  ], 64))), 256))
-                                ]),
-                                _: 1
-                              }, 8, ["header"])) : a("", !0)
-                            ]),
-                            _: 1
-                          }, 8, ["activeKey"])
-                        ]),
-                        _: 1
-                      }, 8, ["model"])) : a("", !0),
-                      n.designer.selectedWidget ? a("", !0) : (i(), g(H, {
-                        key: 2,
                         description: e.i18nt("designer.hint.noSelectedWidgetHint")
                       }, null, 8, ["description"]))
                     ], 4)
                   ]),
                   _: 1
                 }, 8, ["tab"]),
-                n.designer ? (i(), g(E, {
+                i.designer ? (s(), g(f, {
                   tab: e.i18nt("designer.hint.表单设置"),
                   key: "2"
                 }, {
-                  default: s(() => [
-                    P("div", {
+                  default: l(() => [
+                    u("div", {
                       class: "setting-scrollbar",
-                      style: w({ height: d.scrollerHeight })
+                      style: v({ height: o.scrollerHeight })
                     }, [
-                      h(k, {
-                        designer: n.designer,
-                        "form-config": n.formConfig
+                      r(w, {
+                        designer: i.designer,
+                        "form-config": i.formConfig
                       }, null, 8, ["designer", "form-config"])
                     ], 4)
                   ]),
                   _: 1
-                }, 8, ["tab"])) : a("", !0),
-                h(E, {
+                }, 8, ["tab"])) : _("", !0),
+                r(f, {
                   tab: e.i18nt("designer.hint.表单api配置"),
                   key: "3"
                 }, {
-                  default: s(() => [
-                    P("div", {
+                  default: l(() => [
+                    u("div", {
                       class: "ds-setting-scrollbar",
-                      style: w({ height: d.scrollerHeight })
+                      style: v({ height: o.scrollerHeight })
                     }, [
-                      h(M, {
-                        designer: n.designer,
-                        "form-config": n.formConfig
+                      r(W, {
+                        designer: i.designer,
+                        "form-config": i.formConfig
                       }, null, 8, ["designer", "form-config"])
                     ], 4)
                   ]),
@@ -374,17 +311,17 @@ function X(e, o, n, f, d, t) {
       ]),
       _: 1
     }),
-    h(A, {
-      eventHeader: d.eventHeader,
+    r(N, {
+      eventHeader: o.eventHeader,
       ref: "CodeModalEditorRef",
       title: e.i18nt("designer.setting.editWidgetEventHandler"),
       mode: "javascript",
       readonly: !1,
-      onSetCode: t.saveEventHandler
+      onSetCode: a.saveEventHandler
     }, null, 8, ["eventHeader", "title", "onSetCode"])
   ], 64);
 }
-const ae = /* @__PURE__ */ q(Q, [["render", X], ["__scopeId", "data-v-d315cd31"]]);
+const me = /* @__PURE__ */ q(X, [["render", Y], ["__scopeId", "data-v-b6c5eb4a"]]);
 export {
-  ae as default
+  me as default
 };

package/src/components/form-designer/setting-panel/property-editor/container-data-table/data-table-selections-editor.vue2.js

@@ -1,14 +1,13 @@
-import { defineComponent as M, mergeModels as x, useModel as U, ref as V, resolveComponent as i, createElementBlock as E, openBlock as f, Fragment as K, createVNode as o, unref as d, withCtx as n, createBlock as O, createCommentVNode as T, createTextVNode as w, toDisplayString as v, normalizeClass as W } from "vue";
+import { defineComponent as x, mergeModels as M, useModel as U, ref as V, resolveComponent as i, createElementBlock as E, openBlock as f, Fragment as K, createVNode as o, unref as d, withCtx as n, createBlock as T, createCommentVNode as W, createTextVNode as w, toDisplayString as v, normalizeClass as O } from "vue";
 import { useI18n as j } from "../../../../../utils/i18n.js";
 import { useComRef as B } from "tmgc2-share";
 import g from "../../../../code-editor/code-modal-editor.vue.js";
-const F = /* @__PURE__ */ M({
+const F = /* @__PURE__ */ x({
   name: "rowSelection-editor",
   __name: "data-table-selections-editor",
-  props: /* @__PURE__ */ x({
+  props: /* @__PURE__ */ M({
     designer: Object,
-    selectedWidget: Object,
-    optionModel: Object
+    selectedWidget: Object
   }, {
     optionModel: {
       type: Object,
@@ -46,7 +45,7 @@ const F = /* @__PURE__ */ M({
                   checked: e.value.rowSelection.hasRowSelection,
                   "onUpdate:checked": t[0] || (t[0] = (l) => e.value.rowSelection.hasRowSelection = l)
                 }, null, 8, ["checked"]),
-                e.value.rowSelection.hasRowSelection ? (f(), O(p, {
+                e.value.rowSelection.hasRowSelection ? (f(), T(p, {
                   key: 0,
                   type: "primary",
                   plain: "",
@@ -57,7 +56,7 @@ const F = /* @__PURE__ */ M({
                     w(v(d(a)("designer.setting.edit")), 1)
                   ]),
                   _: 1
-                })) : T("", !0)
+                })) : W("", !0)
               ]),
               _: 1
             })
@@ -129,7 +128,7 @@ const F = /* @__PURE__ */ M({
                     o(p, {
                       plain: "",
                       shape: "round",
-                      class: W([e.value.rowSelection.onChange ? "button-text-highlight" : ""]),
+                      class: O([e.value.rowSelection.onChange ? "button-text-highlight" : ""]),
                       onClick: h
                     }, {
                       default: n(() => [