@kp-ui/lowcode 2.13.2 → 2.14.0-alpha

package/src/components/form-render/container-item/containerItemMixin.js

@@ -0,0 +1,185 @@
+import { traverseFieldWidgetsOfContainer as a, traverseWidgetsOfContainer as h, deepClone as r } from "../../../utils/util.js";
+const l = {
+  computed: {
+    customClass() {
+      return this.widget.options.customClass || "";
+    },
+    formModel: {
+      cache: !1,
+      get() {
+        return this.globalModel.formModel;
+      }
+    }
+  },
+  mounted() {
+    this.callSetHidden();
+  },
+  methods: {
+    cloneWidgetSchema(t) {
+      return r(t);
+    },
+    unregisterFromRefList() {
+      if (this.refList !== null && this.widget.options.name) {
+        const t = this.widget.options.name;
+        delete this.refList[t];
+      }
+    },
+    /* 主动触发setHidden()方法，以清空被隐藏容器内字段组件的校验规则！！ */
+    callSetHidden() {
+      this.widget.options.hidden === !0 && this.setHidden(!0);
+    },
+    //--------------------- 以下为组件支持外部调用的API方法 begin ------------------//
+    /* 提示：用户可自行扩充这些方法！！！ */
+    setHidden(t) {
+      this.widget.options.hidden = t;
+      const i = (e) => {
+        const s = e.options.name, o = this.getWidgetRef(s);
+        t && o && o.clearFieldRules && o.clearFieldRules(), !t && o && o.buildFieldRules && o.buildFieldRules();
+      };
+      a(this.widget, i);
+    },
+    /**
+     * 禁用或启用容器组件（包含容器内部的所有组件）
+     * @param flag
+     */
+    setDisabled(t) {
+      const i = (e) => {
+        const s = e.options.name, o = this.getWidgetRef(s);
+        o && o.setDisabled && o.setDisabled(t);
+      };
+      h(this.widget, i);
+    },
+    activeTab(t) {
+      t >= 0 && t < this.widget.tabs.length && this.widget.tabs.forEach((i, e) => {
+        i.options.active = e === t, e === t && (this.activeTabName = i.options.name);
+      });
+    },
+    disableTab(t) {
+      t >= 0 && t < this.widget.tabs.length && (this.widget.tabs[t].options.disabled = !0);
+    },
+    enableTab(t) {
+      t >= 0 && t < this.widget.tabs.length && (this.widget.tabs[t].options.disabled = !1);
+    },
+    hideTab(t) {
+      t >= 0 && t < this.widget.tabs.length && (this.widget.tabs[t].options.hidden = !0);
+    },
+    showTab(t) {
+      t >= 0 && t < this.widget.tabs.length && (this.widget.tabs[t].options.hidden = !1);
+    },
+    setWidgetOption(t, i) {
+      this.widget.options.hasOwnProperty(t) && (this.widget.options[t] = i);
+    },
+    /**
+     * 获取子表单的行数
+     */
+    getSubFormRowCount() {
+      return this.rowIdData ? this.rowIdData.length : 0;
+    },
+    setGridSubFormRowDisabled(t, i) {
+      const e = (s) => {
+        const o = s.options.name + "@row" + t, d = this.getWidgetRef(o);
+        d && d.setDisabled && d.setDisabled(i);
+      };
+      h(this.widget, e);
+    },
+    disableSubFormRow(t) {
+      this.widget.type === "sub-form" ? this.widget.widgetList.forEach((i) => {
+        const e = i.options.name + "@row" + this.rowIdData[t], s = this.getWidgetRef(e);
+        s && s.setDisabled && s.setDisabled(!0);
+      }) : this.widget.type === "grid-sub-form" && this.setGridSubFormRowDisabled(this.rowIdData[t], !0);
+    },
+    enableSubFormRow(t) {
+      this.widget.type === "sub-form" ? this.widget.widgetList.forEach((i) => {
+        const e = i.options.name + "@row" + this.rowIdData[t], s = this.getWidgetRef(e);
+        s && s.setDisabled && s.setDisabled(!1);
+      }) : this.widget.type === "grid-sub-form" && this.setGridSubFormRowDisabled(this.rowIdData[t], !1);
+    },
+    disableSubForm() {
+      this.widget.widgetList.forEach((t) => {
+        t.options.disabled = !0;
+      }), this.rowIdData.length > 0 && this.rowIdData.forEach((t, i) => {
+        this.disableSubFormRow(i);
+      }), this.actionDisabled = !0;
+    },
+    enableSubForm() {
+      this.widget.widgetList.forEach((t) => {
+        t.options.disabled = !1;
+      }), this.rowIdData.length > 0 && this.rowIdData.forEach((t, i) => {
+        this.enableSubFormRow(i);
+      }), this.actionDisabled = !1;
+    },
+    disableGridSubFormRow(t) {
+      const i = [], e = (s) => {
+        i.push(s);
+      };
+      a(this.widget, e), i.forEach((s) => {
+        const o = s.options.name + "@row" + this.rowIdData[t], d = this.getWidgetRef(o);
+        d && d.setDisabled && d.setDisabled(!0);
+      });
+    },
+    enableGridSubFormRow(t) {
+      const i = [], e = (s) => {
+        i.push(s);
+      };
+      a(this.widget, e), i.forEach((s) => {
+        const o = s.options.name + "@row" + this.rowIdData[t], d = this.getWidgetRef(o);
+        d && d.setDisabled && d.setDisabled(!1);
+      });
+    },
+    disableGridSubForm() {
+      a(this.widget, (t) => {
+        t.options.disabled = !0;
+      }), this.rowIdData.length > 0 && this.rowIdData.forEach((t, i) => {
+        this.disableGridSubFormRow(i);
+      }), this.actionDisabled = !0;
+    },
+    enableGridSubForm() {
+      a(this.widget, (t) => {
+        t.options.disabled = !1;
+      }), this.rowIdData.length > 0 && this.rowIdData.forEach((t, i) => {
+        this.enableGridSubFormRow(i);
+      }), this.actionDisabled = !1;
+    },
+    resetSubForm() {
+      if (this.widget.type === "sub-form") {
+        const t = this.formModel[this.widget.options.name];
+        t && (t.splice(0, t.length), this.rowIdData.splice(0, this.rowIdData.length)), this.widget.options.showBlankRow && this.addSubFormRow();
+      }
+    },
+    getSubFormValues(t = !0) {
+      if (this.widget.type === "sub-form")
+        return this.formModel[this.widget.options.name];
+      this.$message.error(this.i18nt("render.hint.nonSubFormType"));
+    },
+    // validateField(fieldName) { //逐行校验子表单字段
+    //   //TODO:
+    // },
+    //
+    // validateSubForm() { //逐行校验子表单全部字段
+    //   //TODO:
+    // },
+    /**
+     * 动态增加自定义css样式
+     * @param className
+     */
+    addCssClass(t) {
+      this.widget.options.customClass ? this.widget.options.customClass.push(t) : this.widget.options.customClass = [t];
+    },
+    /**
+     * 动态移除自定义css样式
+     * @param className
+     */
+    removeCssClass(t) {
+      if (!this.widget.options.customClass)
+        return;
+      let i = -1;
+      this.widget.options.customClass.map((e, s) => {
+        e === t && (i = s);
+      }), i > -1 && this.widget.options.customClass.splice(i, 1);
+    }
+    //--------------------- 以上为组件支持外部调用的API方法 end ------------------//
+  }
+};
+export {
+  l as default
+};

package/src/components/form-render/container-item/data-table-item.vue.js

@@ -0,0 +1,149 @@
+import p from "./container-item-wrapper.vue.js";
+import h from "../../../utils/emitter.js";
+import g from "../../../utils/i18n.js";
+import w from "../../form-designer/form-widget/field-widget/index.js";
+import f from "../refMixin.js";
+import b from "./containerItemMixin.js";
+import C from "../../../mixins/useDataTableMixin.js";
+import { resolveComponent as n, withDirectives as y, createBlock as a, openBlock as r, normalizeStyle as s, withCtx as i, createVNode as l, normalizeClass as R, createCommentVNode as F, vShow as S } from "vue";
+/* empty css                     */
+/* empty css                     */
+import I from "../../../../_virtual/_plugin-vue_export-helper.js";
+const T = {
+  name: "DataTableItem",
+  componentName: "ContainerItem",
+  // 必须固定为ContainerItem，用于接收父级组件的broadcast事件
+  mixins: [h, g, f, b, C],
+  components: {
+    ContainerItemWrapper: p,
+    ...w
+  },
+  props: {
+    widget: Object,
+    parentWidget: Object,
+    parentList: Array,
+    indexOfParentList: Number,
+    data: {
+      type: Array,
+      default: () => []
+    },
+    subFormRowIndex: {
+      /* 子表单组件行索引，从0开始计数 */
+      type: Number,
+      default: -1
+    },
+    subFormColIndex: {
+      /* 子表单组件列索引，从0开始计数 */
+      type: Number,
+      default: -1
+    },
+    subFormRowId: {
+      /* 子表单组件行Id，唯一id且不可变 */
+      type: String,
+      default: ""
+    }
+  },
+  inject: ["refList", "sfRefList", "globalModel", "getFormConfig", "getGlobalDsv"],
+  data() {
+    return {};
+  },
+  computed: {
+    formConfig() {
+      return this.getFormConfig();
+    }
+  },
+  created() {
+    this.initRefList(), this.handleOnCreated();
+  },
+  mounted() {
+    this.loadDataTableDataSource(), this.$nextTick(() => {
+      this.handleOnMounted();
+    });
+  },
+  beforeUnmount() {
+    this.unregisterFromRefList();
+  },
+  methods: {
+    getDataTableRef() {
+      return this;
+    },
+    selectWidget(e) {
+      this.designer.setSelected(e);
+    },
+    handleOnCreated() {
+      this.widget.options.onCreated && new Function(this.widget.options.onCreated).call(this);
+    },
+    handleOnMounted() {
+      this.widget.options.onMounted && new Function(this.widget.options.onMounted).call(this);
+    },
+    // --------------------- 以下为组件支持外部调用的API方法 begin ------------------//
+    /* 提示：用户可自行扩充这些方法！！！ */
+    getTableColumns() {
+      return this.widget.options.tableColumns;
+    },
+    /**
+     * 获取选中行数据，格式为对象数组
+     * @returns {[]}
+     */
+    getSelectedRow() {
+      return this.selectedRows;
+    },
+    /**
+     * 获取选中行索引，格式为数组
+     * @returns {[]}
+     */
+    getSelectedIndex() {
+      return this.selectedIndices;
+    }
+    // --------------------- 以上为组件支持外部调用的API方法 end ------------------//
+  }
+};
+function z(e, M, t, _, D, N) {
+  const d = n("a-empty"), m = n("RenderBodyCell"), c = n("s-table"), u = n("container-item-wrapper");
+  return y((r(), a(u, {
+    style: s({ display: "flex", minWidth: 0, height: parseFloat(e.tableHeight || 0) + "px" }),
+    widget: t.widget
+  }, {
+    default: i(() => [
+      l(c, {
+        class: R(["tpf-surely-table", [e.customClass]]),
+        ref: "dataTable2",
+        columns: e.columns.columns,
+        size: e.widgetSize,
+        dataSource: t.data,
+        "deep-watch-data-source": !0,
+        rowKey: (o) => o[t.widget.options.rowKey],
+        scroll: { y: parseFloat(e.tableHeight || 0), x: 300 },
+        bordered: t.widget.options.border,
+        style: s({ width: t.widget.options.tableWidth }),
+        "row-class-name": e.rowClassName,
+        rowSelection: e.handleRowSelection(),
+        pagination: e.fmtPagination,
+        customRow: e.handleCustomRow,
+        onChange: e.handleTablePageChange,
+        onResizeColumn: e.handleResizeColumn,
+        loading: e.loading,
+        "row-height": e.lineHeight
+      }, {
+        emptyText: i(() => [
+          l(d)
+        ]),
+        bodyCell: i((o) => [
+          e.isShowBodyCell(o.column.dataIndex) ? (r(), a(m, {
+            key: 0,
+            bodyCell: e.columns.bodyCell,
+            scope: o
+          }, null, 8, ["bodyCell", "scope"])) : F("", !0)
+        ]),
+        _: 1
+      }, 8, ["columns", "class", "size", "dataSource", "rowKey", "scroll", "bordered", "style", "row-class-name", "rowSelection", "pagination", "customRow", "onChange", "onResizeColumn", "loading", "row-height"])
+    ]),
+    _: 1
+  }, 8, ["style", "widget"])), [
+    [S, !e.handleHidden()]
+  ]);
+}
+const A = /* @__PURE__ */ I(T, [["render", z], ["__scopeId", "data-v-8e1059ce"]]);
+export {
+  A as default
+};

package/src/components/form-render/container-item/grid-col-item.vue.js

@@ -0,0 +1,149 @@
+import x from "../../../utils/emitter.js";
+import C from "../../../utils/i18n.js";
+import P from "../refMixin.js";
+import _ from "../../form-designer/form-widget/field-widget/index.js";
+import { resolveComponent as L, withDirectives as k, createBlock as d, openBlock as i, mergeProps as m, withCtx as l, createElementBlock as g, Fragment as p, renderList as u, resolveDynamicComponent as c, createSlots as w, renderSlot as h, createElementVNode as y, toDisplayString as F, vShow as v } from "vue";
+/* empty css                   */
+import I from "../../../../_virtual/_plugin-vue_export-helper.js";
+const S = {
+  name: "GridColItem",
+  componentName: "ContainerItem",
+  mixins: [x, C, P],
+  components: {
+    ..._
+  },
+  props: {
+    widget: Object,
+    parentWidget: Object,
+    parentList: Array,
+    indexOfParentList: Number,
+    data: Object,
+    colHeight: {
+      type: String,
+      default: null
+    },
+    subFormRowIndex: {
+      /* 子表单组件行索引，从0开始计数 */
+      type: Number,
+      default: -1
+    },
+    subFormColIndex: {
+      /* 子表单组件列索引，从0开始计数 */
+      type: Number,
+      default: -1
+    },
+    subFormRowId: {
+      /* 子表单组件行Id，唯一id且不可变 */
+      type: String,
+      default: ""
+    }
+  },
+  inject: ["refList", "globalModel", "getFormConfig", "previewState"],
+  data() {
+    return {
+      layoutProps: {
+        span: this.widget.options.span,
+        md: this.widget.options.md || 12,
+        sm: this.widget.options.sm || 12,
+        xs: this.widget.options.xs || 12,
+        offset: this.widget.options.offset || 0,
+        push: this.widget.options.push || 0,
+        pull: this.widget.options.pull || 0
+      }
+    };
+  },
+  computed: {
+    isHidden() {
+      return this.widget.widgetList.some((t) => t.options.holdHidden ? !1 : t.options.hidden);
+    },
+    formConfig() {
+      return this.getFormConfig();
+    },
+    customClass() {
+      return this.widget.options.customClass || "";
+    },
+    colHeightStyle() {
+      return this.colHeight ? { height: this.colHeight + "px" } : {};
+    }
+  },
+  created() {
+    this.initLayoutProps(), this.initRefList();
+  },
+  methods: {
+    initLayoutProps() {
+      if (this.widget.options.responsive)
+        if (this.previewState) {
+          this.layoutProps.md = void 0, this.layoutProps.sm = void 0, this.layoutProps.xs = void 0;
+          const t = this.formConfig.layoutType;
+          t === "H5" ? this.layoutProps.span = this.widget.options.xs || 12 : t === "Pad" ? this.layoutProps.span = this.widget.options.sm || 12 : this.layoutProps.span = this.widget.options.md || 12;
+        } else
+          this.layoutProps.span = void 0;
+      else
+        this.layoutProps.md = void 0, this.layoutProps.sm = void 0, this.layoutProps.xs = void 0;
+    }
+  }
+}, H = { class: "blank-cell" }, R = { class: "invisible-content" };
+function j(t, O, e, N, b, n) {
+  const f = L("a-col");
+  return k((i(), d(f, m({
+    class: ["grid-cell", [n.customClass]]
+  }, b.layoutProps, {
+    style: n.colHeightStyle,
+    key: e.widget.id
+  }), {
+    default: l(() => [
+      e.widget.widgetList && e.widget.widgetList.length > 0 ? (i(!0), g(p, { key: 0 }, u(e.widget.widgetList, (o, r) => (i(), g(p, null, [
+        o.category === "container" ? (i(), d(c(t.getComponentByContainer(o)), {
+          widget: o,
+          key: r,
+          "parent-list": e.widget.widgetList,
+          "index-of-parent-list": r,
+          "parent-widget": e.widget,
+          "sub-form-row-id": e.subFormRowId,
+          "sub-form-row-index": e.subFormRowIndex,
+          "sub-form-col-index": e.subFormColIndex,
+          data: e.data,
+          model: n.globalModel
+        }, w({ _: 2 }, [
+          u(Object.keys(t.$slots), (s) => ({
+            name: s,
+            fn: l((a) => [
+              h(t.$slots, s, m({ ref_for: !0 }, a), void 0, !0)
+            ])
+          }))
+        ]), 1032, ["widget", "parent-list", "index-of-parent-list", "parent-widget", "sub-form-row-id", "sub-form-row-index", "sub-form-col-index", "data", "model"])) : (i(), d(c(o.type + "-widget"), {
+          field: o,
+          designer: null,
+          key: r,
+          "parent-list": e.widget.widgetList,
+          "index-of-parent-list": r,
+          "parent-widget": e.widget,
+          "sub-form-row-id": e.subFormRowId,
+          "sub-form-row-index": e.subFormRowIndex,
+          "sub-form-col-index": e.subFormColIndex
+        }, w({ _: 2 }, [
+          u(Object.keys(t.$slots), (s) => ({
+            name: s,
+            fn: l((a) => [
+              h(t.$slots, s, m({ ref_for: !0 }, a), void 0, !0)
+            ])
+          }))
+        ]), 1032, ["field", "parent-list", "index-of-parent-list", "parent-widget", "sub-form-row-id", "sub-form-row-index", "sub-form-col-index"]))
+      ], 64))), 256)) : (i(), d(f, { key: 1 }, {
+        default: l(() => [
+          y("div", H, [
+            y("span", R, F(t.i18nt("render.hint.blankCellContent")), 1)
+          ])
+        ]),
+        _: 1
+      }))
+    ]),
+    _: 3
+  }, 16, ["class", "style"])), [
+    [v, !n.isHidden && !e.widget.options.hidden]
+  ]);
+}
+const V = /* @__PURE__ */ I(S, [["render", j], ["__scopeId", "data-v-8b0497df"]]);
+export {
+  V as default
+};

package/src/components/form-render/container-item/grid-item.vue.js

@@ -0,0 +1,92 @@
+import g from "../../../utils/emitter.js";
+import w from "../../../utils/i18n.js";
+import b from "../refMixin.js";
+import _ from "./container-item-wrapper.vue.js";
+import p from "./grid-col-item.vue.js";
+import h from "./containerItemMixin.js";
+import { resolveComponent as i, createBlock as r, openBlock as t, withCtx as n, withDirectives as x, normalizeClass as I, createElementBlock as C, Fragment as F, renderList as a, createSlots as R, renderSlot as k, mergeProps as y, vShow as j } from "vue";
+import L from "../../../../_virtual/_plugin-vue_export-helper.js";
+const v = {
+  name: "vf-grid-item",
+  //grid-item跟VueGridLayout全局注册组件重名，故特殊处理！！
+  componentName: "ContainerItem",
+  mixins: [g, w, b, h],
+  components: {
+    ContainerItemWrapper: _,
+    GridColItem: p
+  },
+  props: {
+    widget: Object,
+    model: Object,
+    data: Object,
+    subFormRowIndex: {
+      /* 子表单组件行索引，从0开始计数 */
+      type: Number,
+      default: -1
+    },
+    subFormColIndex: {
+      /* 子表单组件列索引，从0开始计数 */
+      type: Number,
+      default: -1
+    },
+    subFormRowId: {
+      /* 子表单组件行Id，唯一id且不可变 */
+      type: String,
+      default: ""
+    }
+  },
+  inject: ["refList", "sfRefList", "globalModel"],
+  created() {
+    this.initRefList();
+  },
+  mounted() {
+  },
+  beforeUnmount() {
+    this.unregisterFromRefList();
+  },
+  methods: {}
+};
+function O(o, S, e, B, M, N) {
+  const s = i("grid-col-item"), l = i("a-row"), c = i("container-item-wrapper");
+  return t(), r(c, { widget: e.widget }, {
+    default: n(() => [
+      x((t(), r(l, {
+        key: e.widget.id,
+        gutter: e.widget.options.gutter,
+        class: I(["grid-container", [o.customClass]]),
+        ref: e.widget.id
+      }, {
+        default: n(() => [
+          (t(!0), C(F, null, a(e.widget.cols, (f, m) => (t(), r(s, {
+            key: m,
+            model: e.model,
+            data: e.data,
+            widget: f,
+            "parent-list": e.widget.cols,
+            "index-of-parent-list": m,
+            "parent-widget": e.widget,
+            "col-height": e.widget.options.colHeight,
+            "sub-form-row-id": e.subFormRowId,
+            "sub-form-row-index": e.subFormRowIndex,
+            "sub-form-col-index": e.subFormColIndex
+          }, R({ _: 2 }, [
+            a(Object.keys(o.$slots), (d) => ({
+              name: d,
+              fn: n((u) => [
+                k(o.$slots, d, y({ ref_for: !0 }, u))
+              ])
+            }))
+          ]), 1032, ["model", "data", "widget", "parent-list", "index-of-parent-list", "parent-widget", "col-height", "sub-form-row-id", "sub-form-row-index", "sub-form-col-index"]))), 128))
+        ]),
+        _: 3
+      }, 8, ["gutter", "class"])), [
+        [j, !e.widget.options.hidden]
+      ])
+    ]),
+    _: 3
+  }, 8, ["widget"]);
+}
+const q = /* @__PURE__ */ L(v, [["render", O]]);
+export {
+  q as default
+};