@kp-ui/lowcode 2.13.2 → 2.14.0-alpha

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

@@ -0,0 +1,334 @@
+import { defineComponent as j, ref as b, resolveComponent as g, createElementBlock as I, openBlock as o, Fragment as q, createVNode as s, unref as p, withCtx as d, createTextVNode as h, toDisplayString as k, createElementVNode as T, createBlock as c, createCommentVNode as u, normalizeClass as G } from "vue";
+import { useI18n as J } from "../../../../../utils/i18n.js";
+import K from "../../../../code-editor/code-modal-editor.vue.js";
+import { cloneDeep as D } from "lodash-es";
+import { TpfModal as P } from "tmgc2-share";
+const Q = { class: "table-wrap" }, X = {
+  key: 2,
+  style: { "text-align": "center" }
+}, Y = { class: "add-btn" }, ne = /* @__PURE__ */ j({
+  name: "tableColumns-editor",
+  __name: "data-table-tableColumns-editor",
+  props: {
+    designer: {},
+    selectedWidget: {},
+    optionModel: {}
+  },
+  setup(S, { expose: W }) {
+    const { i18nt: a } = J(), _ = S, x = b(null), m = b(!1), e = b([]), w = b(null), E = [
+      { value: "left", label: "left" },
+      { value: "center", label: "center" },
+      { value: "right", label: "right" }
+    ], M = [
+      {
+        title: "序号",
+        dataIndex: "index",
+        width: 100,
+        fixed: "left",
+        rowDrag: !0,
+        resizable: !0,
+        customRender: ({ index: r }) => r + 1
+      },
+      {
+        title: a("designer.setting.columnName"),
+        dataIndex: "dataIndex",
+        resizable: !0,
+        width: 150
+      },
+      {
+        title: a("designer.setting.columnLabel"),
+        dataIndex: "title",
+        align: "center",
+        resizable: !0,
+        width: 100
+      },
+      {
+        title: a("designer.setting.columnWidth"),
+        dataIndex: "width",
+        resizable: !0,
+        width: 120
+      },
+      {
+        title: a("designer.setting.visibleColumn"),
+        dataIndex: "show",
+        resizable: !0,
+        width: 90
+      },
+      {
+        title: a("designer.setting.sortableColumn"),
+        dataIndex: "sorter",
+        resizable: !0,
+        width: 90
+      },
+      {
+        title: "可拖动调整宽度",
+        dataIndex: "resizable",
+        width: 120
+      },
+      {
+        title: "超过宽度将自动省略",
+        dataIndex: "ellipsis",
+        resizable: !0,
+        width: 150
+      },
+      {
+        title: a("designer.setting.fixedColumn"),
+        dataIndex: "fixed",
+        resizable: !0,
+        width: 100
+      },
+      {
+        title: a("designer.setting.alignTypeOfColumn"),
+        dataIndex: "align",
+        resizable: !0,
+        width: 100
+      },
+      {
+        title: "自定义渲染函数",
+        dataIndex: "customRender",
+        width: 120,
+        resizable: !0,
+        fixed: "right"
+      },
+      {
+        title: a("designer.setting.actionColumn"),
+        dataIndex: "action",
+        width: 80,
+        fixed: "right"
+      }
+    ], $ = (r, i) => {
+      var v;
+      w.value = r, (v = x.value) == null || v.open(i.customRender || "");
+    }, A = (r) => {
+      w.value !== null && (e.value[w.value].customRender = r);
+    }, N = () => {
+      const r = {
+        isAutoWidth: !1,
+        columnId: (/* @__PURE__ */ new Date()).getTime(),
+        show: !0,
+        width: 150,
+        sorter: !1,
+        customRender: "",
+        fixed: "",
+        align: "left",
+        title: "标题名",
+        dataIndex: "",
+        resizable: !0,
+        showSorterTooltip: !1
+      };
+      e.value.push(r), _.designer.emitHistoryChange();
+    }, V = (r) => {
+      if (e.value.length === 1)
+        return window.$message.warning(a("designer.setting.onlyOneColumnCannotBeDeleted")), !1;
+      e.value.splice(r, 1);
+    }, B = () => {
+      _.optionModel.tableColumns = D(e.value), m.value = !1;
+    }, z = () => {
+      m.value = !0, e.value = D(_.optionModel.tableColumns);
+    };
+    return W({
+      openSetting: z
+    }), (r, i) => {
+      const v = g("a-button"), O = g("a-form-item"), C = g("a-input"), f = g("a-switch"), U = g("a-select-option"), R = g("a-select"), F = g("a-space"), H = g("s-table");
+      return o(), I(q, null, [
+        s(O, {
+          label: p(a)("designer.setting.tableColEdit")
+        }, {
+          default: d(() => [
+            s(v, {
+              type: "primary",
+              shape: "round",
+              onClick: z
+            }, {
+              default: d(() => [
+                h(k(p(a)("designer.setting.editAction")), 1)
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }, 8, ["label"]),
+        s(p(P), {
+          title: p(a)("designer.setting.tableColEdit"),
+          visible: m.value,
+          "onUpdate:visible": i[2] || (i[2] = (n) => m.value = n),
+          width: "1200px"
+        }, {
+          footerRight: d(() => [
+            s(v, {
+              size: "default",
+              onClick: i[1] || (i[1] = (n) => m.value = !1)
+            }, {
+              default: d(() => [
+                h(k(p(a)("designer.hint.cancel")), 1)
+              ]),
+              _: 1
+            }),
+            s(v, {
+              size: "default",
+              type: "primary",
+              onClick: B
+            }, {
+              default: d(() => [
+                h(k(p(a)("designer.hint.confirm")), 1)
+              ]),
+              _: 1
+            })
+          ]),
+          default: d(() => [
+            T("div", Q, [
+              s(H, {
+                class: "tpf-surely-table",
+                "aria-hidden": "false",
+                dataSource: e.value,
+                style: { width: "100%" },
+                deepWatchDataSource: "",
+                "cell-style": { padding: "0" },
+                height: "600",
+                id: "singleTable",
+                size: "default",
+                scroll: { y: 300, x: 300 },
+                pagination: !1,
+                resizable: "",
+                "row-key": (n) => n.columnId,
+                columns: M
+              }, {
+                bodyCell: d(({ column: n, record: y, index: L, recordIndexs: t }) => [
+                  n.dataIndex === "dataIndex" ? (o(), c(C, {
+                    key: 0,
+                    value: e.value[t[0]].dataIndex,
+                    "onUpdate:value": (l) => e.value[t[0]].dataIndex = l
+                  }, null, 8, ["value", "onUpdate:value"])) : u("", !0),
+                  n.dataIndex === "title" ? (o(), c(C, {
+                    key: 1,
+                    value: e.value[t[0]].title,
+                    "onUpdate:value": (l) => e.value[t[0]].title = l
+                  }, null, 8, ["value", "onUpdate:value"])) : u("", !0),
+                  n.dataIndex === "width" ? (o(), I("div", X, [
+                    s(f, {
+                      "checked-children": "自动宽度",
+                      checked: e.value[t[0]].isAutoWidth,
+                      "onUpdate:checked": (l) => e.value[t[0]].isAutoWidth = l
+                    }, null, 8, ["checked", "onUpdate:checked"]),
+                    y.isAutoWidth ? u("", !0) : (o(), c(C, {
+                      key: 0,
+                      value: e.value[t[0]].width,
+                      "onUpdate:value": (l) => e.value[t[0]].width = l
+                    }, null, 8, ["value", "onUpdate:value"]))
+                  ])) : u("", !0),
+                  n.dataIndex === "show" ? (o(), c(f, {
+                    key: 3,
+                    checked: e.value[t[0]].show,
+                    "onUpdate:checked": (l) => e.value[t[0]].show = l
+                  }, null, 8, ["checked", "onUpdate:checked"])) : u("", !0),
+                  n.dataIndex === "sorter" ? (o(), c(f, {
+                    key: 4,
+                    checked: e.value[t[0]].sorter,
+                    "onUpdate:checked": (l) => e.value[t[0]].sorter = l
+                  }, null, 8, ["checked", "onUpdate:checked"])) : u("", !0),
+                  n.dataIndex === "resizable" ? (o(), c(f, {
+                    key: 5,
+                    checked: e.value[t[0]].resizable,
+                    "onUpdate:checked": (l) => e.value[t[0]].resizable = l
+                  }, null, 8, ["checked", "onUpdate:checked"])) : u("", !0),
+                  n.dataIndex === "ellipsis" ? (o(), c(f, {
+                    key: 6,
+                    checked: e.value[t[0]].ellipsis,
+                    "onUpdate:checked": (l) => e.value[t[0]].ellipsis = l
+                  }, null, 8, ["checked", "onUpdate:checked"])) : u("", !0),
+                  n.dataIndex === "fixed" ? (o(), c(R, {
+                    key: 7,
+                    value: e.value[t[0]].fixed,
+                    "onUpdate:value": (l) => e.value[t[0]].fixed = l,
+                    allowClear: "",
+                    style: {}
+                  }, {
+                    default: d(() => [
+                      s(U, { value: "left" }, {
+                        default: d(() => i[3] || (i[3] = [
+                          h("左固定")
+                        ])),
+                        _: 1,
+                        __: [3]
+                      }),
+                      s(U, { value: "right" }, {
+                        default: d(() => i[4] || (i[4] = [
+                          h("右固定")
+                        ])),
+                        _: 1,
+                        __: [4]
+                      })
+                    ]),
+                    _: 2
+                  }, 1032, ["value", "onUpdate:value"])) : u("", !0),
+                  n.dataIndex === "align" ? (o(), c(R, {
+                    key: 8,
+                    style: {},
+                    value: e.value[t[0]].align,
+                    "onUpdate:value": (l) => e.value[t[0]].align = l,
+                    options: E
+                  }, null, 8, ["value", "onUpdate:value"])) : u("", !0),
+                  n.dataIndex === "customRender" ? (o(), c(v, {
+                    key: 9,
+                    onClick: (l) => $(t[0], y, r.dataIndex),
+                    class: G([{ "button-text-highlight": !!y.customRender }]),
+                    size: "small",
+                    shape: "round"
+                  }, {
+                    default: d(() => i[5] || (i[5] = [
+                      h(" edit ")
+                    ])),
+                    _: 2,
+                    __: [5]
+                  }, 1032, ["onClick", "class"])) : u("", !0),
+                  n.dataIndex === "action" ? (o(), c(F, { key: 10 }, {
+                    default: d(() => [
+                      s(v, {
+                        title: p(a)("designer.setting.deleteTableColumn"),
+                        size: "small",
+                        onClick: (l) => V(L),
+                        type: "text"
+                      }, {
+                        default: d(() => i[6] || (i[6] = [
+                          h(" 删除 ")
+                        ])),
+                        _: 2,
+                        __: [6]
+                      }, 1032, ["title", "onClick"])
+                    ]),
+                    _: 2
+                  }, 1024)) : u("", !0)
+                ]),
+                _: 1
+              }, 8, ["dataSource", "row-key"]),
+              T("div", Y, [
+                s(v, {
+                  title: p(a)("designer.setting.addTableColumn"),
+                  type: "primary",
+                  size: "medium",
+                  onClick: i[0] || (i[0] = (n) => N())
+                }, {
+                  default: d(() => [
+                    h(k(p(a)("designer.setting.addTableColumn")), 1)
+                  ]),
+                  _: 1
+                }, 8, ["title"])
+              ])
+            ])
+          ]),
+          _: 1
+        }, 8, ["title", "visible"]),
+        s(K, {
+          onSave: A,
+          ref_key: "CodeModalEditorRef",
+          ref: x,
+          title: p(a)("designer.setting.renderFunction"),
+          "fn-params": "scope"
+        }, null, 8, ["title"])
+      ], 64);
+    };
+  }
+});
+export {
+  ne as default
+};

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

@@ -0,0 +1,34 @@
+import l from "../../../../../utils/i18n.js";
+import { resolveComponent as o, createBlock as d, openBlock as m, withCtx as p, createVNode as s } from "vue";
+import c from "../../../../../../_virtual/_plugin-vue_export-helper.js";
+const _ = {
+  name: "tableHeight-editor",
+  mixins: [l],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object
+  },
+  data() {
+    return {};
+  },
+  methods: {}
+};
+function u(n, e, t, b, f, g) {
+  const i = o("a-input"), a = o("a-form-item");
+  return m(), d(a, {
+    label: n.i18nt("designer.setting.tableHeight")
+  }, {
+    default: p(() => [
+      s(i, {
+        value: t.optionModel.tableHeight,
+        "onUpdate:value": e[0] || (e[0] = (r) => t.optionModel.tableHeight = r)
+      }, null, 8, ["value"])
+    ]),
+    _: 1
+  }, 8, ["label"]);
+}
+const x = /* @__PURE__ */ c(_, [["render", u]]);
+export {
+  x as default
+};

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

@@ -0,0 +1,41 @@
+import r from "../../../../../utils/i18n.js";
+import { resolveComponent as o, createBlock as s, openBlock as m, withCtx as c, createVNode as p } from "vue";
+import u from "../../../../../../_virtual/_plugin-vue_export-helper.js";
+const b = {
+  name: "tableSize-editor",
+  mixins: [r],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object
+  },
+  data() {
+    return {
+      widgetSizes: [
+        { label: "default", value: "default" },
+        { label: "middle", value: "middle" },
+        { label: "small", value: "small" }
+      ]
+    };
+  },
+  methods: {}
+};
+function f(l, e, t, _, i, g) {
+  const a = o("a-select"), n = o("a-form-item");
+  return m(), s(n, {
+    label: l.i18nt("designer.setting.widgetSize")
+  }, {
+    default: c(() => [
+      p(a, {
+        value: t.optionModel.tableSize,
+        "onUpdate:value": e[0] || (e[0] = (d) => t.optionModel.tableSize = d),
+        options: i.widgetSizes
+      }, null, 8, ["value", "options"])
+    ]),
+    _: 1
+  }, 8, ["label"]);
+}
+const w = /* @__PURE__ */ u(b, [["render", f]]);
+export {
+  w as default
+};

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

@@ -0,0 +1,34 @@
+import d from "../../../../../utils/i18n.js";
+import { resolveComponent as o, createBlock as l, openBlock as m, withCtx as p, createVNode as s } from "vue";
+import c from "../../../../../../_virtual/_plugin-vue_export-helper.js";
+const _ = {
+  name: "tableWidth-editor",
+  mixins: [d],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object
+  },
+  data() {
+    return {};
+  },
+  methods: {}
+};
+function u(n, t, e, b, f, h) {
+  const i = o("a-input"), a = o("a-form-item");
+  return m(), l(a, {
+    label: n.i18nt("designer.setting.tableWidth")
+  }, {
+    default: p(() => [
+      s(i, {
+        value: e.optionModel.tableWidth,
+        "onUpdate:value": t[0] || (t[0] = (r) => e.optionModel.tableWidth = r)
+      }, null, 8, ["value"])
+    ]),
+    _: 1
+  }, 8, ["label"]);
+}
+const x = /* @__PURE__ */ c(_, [["render", u]]);
+export {
+  x as default
+};

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

@@ -0,0 +1,65 @@
+import b from "../../../../../utils/i18n.js";
+import { resolveComponent as d, createElementBlock as p, openBlock as i, Fragment as f, createVNode as a, createBlock as m, createCommentVNode as s, withCtx as r } from "vue";
+import g from "../../../../../../_virtual/_plugin-vue_export-helper.js";
+const M = {
+  name: "treeDataEnabled-editor",
+  mixins: [b],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object
+  },
+  data() {
+    return {};
+  },
+  methods: {
+    handleTDEChange(n) {
+      n ? (this.optionModel.rowKey = "id", this.optionModel.childrenKey = "children") : (this.optionModel.rowKey = "", this.optionModel.childrenKey = "");
+    }
+  }
+};
+function y(n, t, e, _, D, u) {
+  const h = d("a-switch"), l = d("a-form-item"), c = d("a-input");
+  return i(), p(f, null, [
+    a(l, {
+      label: n.i18nt("designer.setting.treeDataEnabled")
+    }, {
+      default: r(() => [
+        a(h, {
+          checked: e.optionModel.treeDataEnabled,
+          "onUpdate:checked": t[0] || (t[0] = (o) => e.optionModel.treeDataEnabled = o),
+          onChange: u.handleTDEChange
+        }, null, 8, ["checked", "onChange"])
+      ]),
+      _: 1
+    }, 8, ["label"]),
+    e.optionModel.treeDataEnabled ? (i(), m(l, {
+      key: 0,
+      label: n.i18nt("designer.setting.rowKeyOfTreeData")
+    }, {
+      default: r(() => [
+        a(c, {
+          value: e.optionModel.rowKey,
+          "onUpdate:value": t[1] || (t[1] = (o) => e.optionModel.rowKey = o)
+        }, null, 8, ["value"])
+      ]),
+      _: 1
+    }, 8, ["label"])) : s("", !0),
+    e.optionModel.treeDataEnabled ? (i(), m(l, {
+      key: 1,
+      label: n.i18nt("designer.setting.childrenKeyOfTreeData")
+    }, {
+      default: r(() => [
+        a(c, {
+          value: e.optionModel.childrenKey,
+          "onUpdate:value": t[2] || (t[2] = (o) => e.optionModel.childrenKey = o)
+        }, null, 8, ["value"])
+      ]),
+      _: 1
+    }, 8, ["label"])) : s("", !0)
+  ], 64);
+}
+const w = /* @__PURE__ */ g(M, [["render", y]]);
+export {
+  w as default
+};

package/src/components/form-designer/setting-panel/property-editor/container-grid/colHeight-editor.vue.js

@@ -0,0 +1,36 @@
+import m from "../../../../../utils/i18n.js";
+import a from "../propertyMixin.js";
+import { resolveComponent as n, createElementBlock as c, openBlock as d, createVNode as i, withCtx as s } from "vue";
+import u from "../../../../../../_virtual/_plugin-vue_export-helper.js";
+const _ = {
+  name: "colHeight-editor",
+  mixins: [m, a],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object
+  }
+};
+function f(e, t, o, g, b, h) {
+  const r = n("a-input-number"), l = n("a-form-item");
+  return d(), c("div", null, [
+    i(l, {
+      label: e.i18nt("designer.setting.gridColHeight")
+    }, {
+      default: s(() => [
+        i(r, {
+          value: o.optionModel.colHeight,
+          "onUpdate:value": t[0] || (t[0] = (p) => o.optionModel.colHeight = p),
+          onInput: e.inputNumberHandler,
+          min: 0,
+          class: "hide-spin-button"
+        }, null, 8, ["value", "onInput"])
+      ]),
+      _: 1
+    }, 8, ["label"])
+  ]);
+}
+const j = /* @__PURE__ */ u(_, [["render", f]]);
+export {
+  j as default
+};

package/src/components/form-designer/setting-panel/property-editor/container-grid/gutter-editor.vue.js

@@ -0,0 +1,129 @@
+import b from "../../../../../utils/i18n.js";
+import y from "../../../../svg-icon/index.vue.js";
+import w from "../../../../../lib/vuedraggable/src/vuedraggable.js";
+import { resolveComponent as a, createElementBlock as k, openBlock as N, createVNode as e, withCtx as i, createTextVNode as p, toDisplayString as r, createElementVNode as u, mergeProps as O } from "vue";
+/* empty css                   */
+import S from "../../../../../../_virtual/_plugin-vue_export-helper.js";
+const W = {
+  name: "gutter-editor",
+  components: { SvgIcon: y, Draggable: w },
+  mixins: [b],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object
+  },
+  methods: {
+    spanChanged(t) {
+      let n = 0;
+      t.cols.forEach((o) => {
+        n += o.options.span;
+      }), n > 24 && console.log("列栅格之和超出24", this.$message1), this.designer.saveCurrentHistoryStep();
+    },
+    deleteCol(t, n) {
+      this.designer.deleteColOfGrid(t, n), this.designer.emitHistoryChange();
+    },
+    addNewCol(t) {
+      this.designer.addNewColOfGrid(t), this.designer.emitHistoryChange();
+    }
+  }
+}, E = { class: "col-item" }, G = { class: "col-span-title" };
+function j(t, n, o, H, M, g) {
+  const f = a("a-divider"), s = a("a-form-item"), _ = a("a-input-number"), m = a("a-button"), h = a("svg-icon"), v = a("draggable");
+  return N(), k("div", null, [
+    e(s, { "label-width": "0" }, {
+      default: i(() => [
+        e(f, { class: "custom-divider" }, {
+          default: i(() => [
+            p(r(t.i18nt("designer.setting.columnSetting")), 1)
+          ]),
+          _: 1
+        })
+      ]),
+      _: 1
+    }),
+    e(s, {
+      label: t.i18nt("designer.setting.gutter")
+    }, {
+      default: i(() => [
+        e(_, {
+          value: o.optionModel.gutter,
+          "onUpdate:value": n[0] || (n[0] = (l) => o.optionModel.gutter = l),
+          style: { width: "100%" }
+        }, null, 8, ["value"])
+      ]),
+      _: 1
+    }, 8, ["label"]),
+    e(s, {
+      label: t.i18nt("designer.setting.colsOfGrid")
+    }, null, 8, ["label"]),
+    e(s, { "label-width": "0" }, {
+      default: i(() => [
+        e(v, O({
+          list: o.selectedWidget.cols,
+          "item-key": "id"
+        }, { group: "dragGroup", ghostClass: "ghost", animation: 300 }, {
+          tag: "transition-group",
+          "component-data": { name: "fade" },
+          handle: ".drag-handler"
+        }), {
+          item: i(({ element: l, index: c }) => [
+            u("li", E, [
+              u("span", G, r(t.i18nt("designer.setting.colSpanTitle")) + r(c + 1), 1),
+              e(_, {
+                value: l.options.span,
+                "onUpdate:value": (d) => l.options.span = d,
+                min: 1,
+                max: 24,
+                onChange: (d, C) => g.spanChanged(o.selectedWidget, l, c, d, C),
+                class: "cell-span-input"
+              }, null, 8, ["value", "onUpdate:value", "onChange"]),
+              e(m, {
+                circle: "",
+                shape: "plain",
+                size: "small",
+                type: "danger",
+                onClick: (d) => g.deleteCol(o.selectedWidget, c),
+                class: "col-delete-button"
+              }, {
+                default: i(() => n[2] || (n[2] = [
+                  p(" 删除 ")
+                ])),
+                _: 2,
+                __: [2]
+              }, 1032, ["onClick"]),
+              e(m, {
+                circle: "",
+                shape: "plain",
+                size: "small",
+                class: "col-delete-button drag-handler"
+              }, {
+                default: i(() => [
+                  e(h, { "icon-class": "move1" })
+                ]),
+                _: 1
+              })
+            ])
+          ]),
+          _: 1
+        }, 16, ["list"]),
+        u("div", null, [
+          e(m, {
+            type: "primary",
+            onClick: n[1] || (n[1] = (l) => g.addNewCol(o.selectedWidget))
+          }, {
+            default: i(() => [
+              p(r(t.i18nt("designer.setting.addColumn")), 1)
+            ]),
+            _: 1
+          })
+        ])
+      ]),
+      _: 1
+    })
+  ]);
+}
+const x = /* @__PURE__ */ S(W, [["render", j], ["__scopeId", "data-v-9200a044"]]);
+export {
+  x as default
+};