@ibiz-template/vue3-components 0.7.34 → 0.7.38-alpha.12

package/lib/control/form/form-detail/form-button-list/form-button-list.provider.cjs

@@ -0,0 +1,23 @@
+'use strict';
+
+var runtime = require('@ibiz-template/runtime');
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class FormButtonListProvider {
+  constructor() {
+    __publicField(this, "component", "IBizFormButtonList");
+  }
+  async createController(detailModel, form, parent) {
+    const c = new runtime.FormButtonListController(detailModel, form, parent);
+    await c.init();
+    return c;
+  }
+}
+
+exports.FormButtonListProvider = FormButtonListProvider;

package/lib/control/form/form-detail/form-button-list/index.cjs

@@ -0,0 +1,23 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue3Util = require('@ibiz-template/vue3-util');
+var runtime = require('@ibiz-template/runtime');
+var formButtonList_provider = require('./form-button-list.provider.cjs');
+var formButtonList = require('./form-button-list.cjs');
+
+"use strict";
+const IBizFormButtonList = vue3Util.withInstall(
+  formButtonList.FormButtonList,
+  function(v) {
+    v.component(formButtonList.FormButtonList.name, formButtonList.FormButtonList);
+    runtime.registerFormDetailProvider(
+      "BUTTONLIST",
+      () => new formButtonList_provider.FormButtonListProvider()
+    );
+  }
+);
+
+exports.IBizFormButtonList = IBizFormButtonList;
+exports.default = IBizFormButtonList;

package/lib/control/form/form-detail/form-druipart/form-druipart.css

@@ -1 +1 @@
-.ibiz-form-druipart{position:relative;width:100%;height:100%}.ibiz-form-druipart__mask{position:absolute;top:0;left:0;z-index:10;width:100%;height:100%;color:var(--ibiz-color-primary-text);background-color:rgb(var(--ibiz-blac) .5);display:flex;align-items:center;justify-content:center}
+.ibiz-form-druipart{position:relative;width:100%;height:100%}.ibiz-form-druipart__mask{position:absolute;top:0;left:0;z-index:10;width:100%;height:100%;color:var(--ibiz-color-primary-text);background-color:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center}.ibiz-form-druipart>.el-loading-parent--relative{min-height:100px}

package/lib/control/form/form-detail/form-group-panel/form-group-panel.cjs

@@ -25,14 +25,17 @@ const FormGroupPanel = /* @__PURE__ */ vue.defineComponent({
   },
   setup(props) {
     const ns = vue3Util.useNamespace("form-group");
-    const isCollapse = vue.ref(!props.controller.defaultExpansion);
+    const c = props.controller;
     const changeCollapse = () => {
-      if (!props.controller.disableClose) {
-        isCollapse.value = !isCollapse.value;
+      if (!c.disableClose) {
+        c.state.collapse = !c.state.collapse;
       }
     };
     const onActionClick = async (detail, event) => {
-      await props.controller.onActionClick(detail, event);
+      const tempParams = {
+        srfgroupid: props.modelData.codeName
+      };
+      await props.controller.onActionClick(detail, event, tempParams);
     };
     const captionText = vue.computed(() => {
       const {
@@ -46,7 +49,6 @@ const FormGroupPanel = /* @__PURE__ */ vue.defineComponent({
     });
     return {
       ns,
-      isCollapse,
       captionText,
       changeCollapse,
       onActionClick
@@ -80,7 +82,7 @@ const FormGroupPanel = /* @__PURE__ */ vue.defineComponent({
     if (this.modelData.showCaption === true) {
       classArr.push(this.ns.m("show-header"));
       classArr.push(this.ns.b("collapse"));
-      classArr.push(this.ns.is("collapse", this.isCollapse));
+      classArr.push(this.ns.is("collapse", this.controller.state.collapse));
       if (this.controller.disableClose) {
         classArr.push(this.ns.bm("collapse", "disable-close"));
       }
@@ -106,10 +108,14 @@ const FormGroupPanel = /* @__PURE__ */ vue.defineComponent({
         "onActionClick": this.onActionClick,
         "caption": this.modelData.uiactionGroup.name,
         "mode": this.modelData.actionGroupExtractMode === "ITEMS" ? "dropdown" : "buttons"
-      }, null), this.modelData.titleBarCloseMode !== void 0 && this.modelData.titleBarCloseMode !== 0 && (this.isCollapse ? vue.createVNode("ion-icon", {
-        "name": "caret-forward-sharp"
+      }, null), this.modelData.titleBarCloseMode !== void 0 && this.modelData.titleBarCloseMode !== 0 && (this.controller.state.collapse ? vue.createVNode("ion-icon", {
+        "name": "caret-forward-sharp",
+        "class": this.ns.be("header", "icon"),
+        "title": ibiz.i18n.t("control.form.formGroup.unfold")
       }, null) : vue.createVNode("ion-icon", {
-        "name": "caret-down-sharp"
+        "name": "caret-down-sharp",
+        "class": this.ns.be("header", "icon"),
+        "title": ibiz.i18n.t("control.form.formGroup.fold")
       }, null))])]);
     }
     let footer = null;
@@ -124,6 +130,7 @@ const FormGroupPanel = /* @__PURE__ */ vue.defineComponent({
       }, [!state.isShowMore ? ibiz.i18n.t("control.form.formGroupPanel.showMore") : ibiz.i18n.t("app.retract")])]);
     }
     return vue.createVNode("div", {
+      "id": this.modelData.id,
       "class": classArr,
       "onClick": (event) => this.controller.onClick(event)
     }, [header, vue.createVNode("div", {

package/lib/control/form/form-detail/form-group-panel/form-group-panel.css

@@ -1 +1 @@
-.ibiz-form-group{--ibiz-form-group-bg-color:transparent;--ibiz-form-group-footer-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-form-group-show-more-color:var(--ibiz-color-primary);--ibiz-form-group-footer-height:35px;--ibiz-form-group-header-bg-color:transparent;--ibiz-form-group-header-padding:var(--ibiz-spacing-base-tight) 0;--ibiz-form-group-header-margin:0 var(--ibiz-spacing-base-tight);--ibiz-form-group-header-border-color:var(--ibiz-color-border);--ibiz-form-group-header-height:49px;--ibiz-form-group-caption-text-color:var(--ibiz-color-text-0);--ibiz-form-group-caption-font-size:var(--ibiz-font-size-header-5);--ibiz-form-group-caption-font-weight:var(--ibiz-font-weight-bold);--ibiz-form-group-content-bg-color:transparent;--ibiz-form-group-content-padding:var(--ibiz-spacing-tight)}.ibiz-form-group{height:100%;background-color:var(--ibiz-form-group-bg-color);border-radius:var(--ibiz-border-radius-base)}.ibiz-form-group__caption{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--ibiz-form-group-caption-font-size);font-weight:var(--ibiz-form-group-caption-font-weight);color:var(--ibiz-form-group-caption-text-color)}.ibiz-form-group__toolbar{text-align:right}.ibiz-form-group-collapse>.ibiz-form-group-content{display:block}.ibiz-form-group-collapse.is-collapse>.ibiz-form-group-content{display:none}.ibiz-form-group-header{display:flex;height:var(--ibiz-form-group-header-height);padding:var(--ibiz-form-group-header-padding);margin:var(--ibiz-form-group-header-margin);border-bottom:1px solid var(--ibiz-form-group-header-border-color)}.ibiz-form-group-header__left,.ibiz-form-group-header__right{display:inline-block;width:50%}.ibiz-form-group-header__right{text-align:right;display:flex;align-items:center;justify-content:flex-end}.ibiz-form-group-content{width:100%;height:100%}.ibiz-form-group-content__row{width:100%;height:100%}.ibiz-form-group--show-header>.ibiz-form-group-content{height:calc(100% - var(--ibiz-form-group-header-height));padding:var(--ibiz-form-group-content-padding);background-color:var(--ibiz-form-group-content-bg-color)}.ibiz-form-group--show-more>.ibiz-form-group-content{height:calc(100% - var(--ibiz-form-group-footer-height))}.ibiz-form-group--show-header.ibiz-form-group--show-more>.ibiz-form-group-content{height:calc(100% - var(--ibiz-form-group-header-height) - var(--ibiz-form-group-footer-height))}.ibiz-form-group-footer{height:var(--ibiz-form-group-footer-height);padding:var(--ibiz-form-group-footer-padding)}.ibiz-form-group-footer__show-more-button{display:inline-block;color:var(--ibiz-form-group-show-more-color);cursor:pointer}
+.ibiz-form-group{--ibiz-form-group-bg-color:transparent;--ibiz-form-group-footer-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-form-group-show-more-color:var(--ibiz-color-primary);--ibiz-form-group-footer-height:35px;--ibiz-form-group-header-bg-color:transparent;--ibiz-form-group-header-padding:var(--ibiz-spacing-base-tight) 0;--ibiz-form-group-header-margin:0 var(--ibiz-spacing-base-tight);--ibiz-form-group-header-border-color:var(--ibiz-color-border);--ibiz-form-group-header-height:49px;--ibiz-form-group-caption-text-color:var(--ibiz-color-text-0);--ibiz-form-group-caption-font-size:var(--ibiz-font-size-header-5);--ibiz-form-group-caption-font-weight:var(--ibiz-font-weight-bold);--ibiz-form-group-content-bg-color:transparent;--ibiz-form-group-content-padding:var(--ibiz-spacing-tight)}.ibiz-form-group{height:100%;background-color:var(--ibiz-form-group-bg-color);border-radius:var(--ibiz-border-radius-base)}.ibiz-form-group__caption{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--ibiz-form-group-caption-font-size);font-weight:var(--ibiz-form-group-caption-font-weight);color:var(--ibiz-form-group-caption-text-color)}.ibiz-form-group__toolbar{text-align:right}.ibiz-form-group-collapse>.ibiz-form-group-content{display:block}.ibiz-form-group-collapse.is-collapse>.ibiz-form-group-content{display:none}.ibiz-form-group-header{display:flex;height:var(--ibiz-form-group-header-height);padding:var(--ibiz-form-group-header-padding);margin:var(--ibiz-form-group-header-margin);border-bottom:1px solid var(--ibiz-form-group-header-border-color)}.ibiz-form-group-header__left,.ibiz-form-group-header__right{display:inline-block;width:50%}.ibiz-form-group-header__right{text-align:right;display:flex;align-items:center;justify-content:flex-end}.ibiz-form-group-header__icon{cursor:pointer}.ibiz-form-group-content{width:100%;height:100%}.ibiz-form-group-content__row{width:100%;height:100%}.ibiz-form-group--show-header>.ibiz-form-group-content{height:calc(100% - var(--ibiz-form-group-header-height));padding:var(--ibiz-form-group-content-padding);background-color:var(--ibiz-form-group-content-bg-color)}.ibiz-form-group--show-more>.ibiz-form-group-content{height:calc(100% - var(--ibiz-form-group-footer-height))}.ibiz-form-group--show-header.ibiz-form-group--show-more>.ibiz-form-group-content{height:calc(100% - var(--ibiz-form-group-header-height) - var(--ibiz-form-group-footer-height))}.ibiz-form-group-footer{height:var(--ibiz-form-group-footer-height);padding:var(--ibiz-form-group-footer-padding)}.ibiz-form-group-footer__show-more-button{display:inline-block;color:var(--ibiz-form-group-show-more-color);cursor:pointer}

package/lib/control/form/form-detail/form-item/form-item-container/form-item-container.css

@@ -1 +1 @@
-.ibiz-form-item-container{--ibiz-form-item-container-label-width:130px;--ibiz-form-item-container-line-height:var(--ibiz-height-control-default);--ibiz-form-item-container-require-mark-color:var(--ibiz-color-danger);--ibiz-form-item-container-label-left-padding:calc(var(--ibiz-spacing-base-tight) / 2) var(--ibiz-spacing-base-tight) calc(var(--ibiz-spacing-base-tight) / 2) 0;--ibiz-form-item-container-label-right-padding:calc(var(--ibiz-spacing-base-tight) / 2) 0 calc(var(--ibiz-spacing-base-tight) / 2) var(--ibiz-spacing-base-tight);--ibiz-form-item-container-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-tight) var(--ibiz-spacing-extra-tight);--ibiz-form-item-container-font-size:var(--ibiz-font-size-regular);--ibiz-form-item-container-label-color:var(--ibiz-color-text-1);--ibiz-form-item-container-error-font-size:var(--ibiz-font-size-small);--ibiz-form-item-container-error-color:var(--ibiz-color-danger);width:100%;height:100%;padding:var(--ibiz-form-item-container-padding)}.ibiz-form-item-container__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0;font-size:var(--ibiz-form-item-container-font-size);color:var(--ibiz-form-item-container-label-color)}.ibiz-form-item-container__label--tooltip{max-width:150px}.ibiz-form-item-container__label--tooltip:has(ion-icon){padding-right:var(--ibiz-width-icon-large)}.ibiz-form-item-container__label--tooltip a{padding:0 var(--ibiz-spacing-extra-tight);color:var(--ibiz-color-link)}.ibiz-form-item-container__label--tooltip ion-icon{position:absolute;font-size:var(--ibiz-width-icon-large);color:var(--ibiz-color-fill-2)}.ibiz-form-item-container__popper.el-popper.is-light{padding:0 var(--ibiz-spacing-extra-tight);border:1px solid var(--ibiz-color-text-0);border-radius:0}.ibiz-form-item-container--left,.ibiz-form-item-container--right{display:flex;min-height:var(--ibiz-form-item-container-line-height)}.ibiz-form-item-container--left .ibiz-form-item-container__label,.ibiz-form-item-container--right .ibiz-form-item-container__label{width:var(--ibiz-form-item-container-label-width)}.ibiz-form-item-container--bottom,.ibiz-form-item-container--top{display:flex;flex-flow:column nowrap}.ibiz-form-item-container--top .ibiz-form-item-container__label{margin-bottom:var(--ibiz-spacing-extra-tight)}.ibiz-form-item-container--bottom .ibiz-form-item-container__label{margin-top:var(--ibiz-spacing-extra-tight)}.ibiz-form-item-container--left .ibiz-form-item-container__label{padding:var(--ibiz-form-item-container-label-left-padding);text-align:right}.ibiz-form-item-container--right .ibiz-form-item-container__label{padding:var(--ibiz-form-item-container-label-right-padding);text-align:left}.ibiz-form-item-container.is-required .ibiz-form-item-container__label::before{display:inline-block;margin-right:4px;font-family:SimSun;line-height:1;color:var(--ibiz-form-item-container-require-mark-color);content:"*"}.ibiz-form-item-container__content{display:flex;flex-flow:column nowrap;position:relative;flex-grow:1}.ibiz-form-item-container__content--label-left,.ibiz-form-item-container__content--label-none,.ibiz-form-item-container__content--label-right{height:100%}.ibiz-form-item-container__editor{position:relative;flex-grow:1;height:100%}.ibiz-form-item-container__error{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;position:absolute;top:100%;width:100%;font-size:var(--ibiz-form-item-container-error-font-size);line-height:calc(var(--ibiz-form-item-container-error-font-size) + 2px);color:var(--ibiz-form-item-container-error-color);word-wrap:break-word}.ibiz-form-item-container.is-error .el-input__wrapper{box-shadow:0 0 0 1px var(--ibiz-form-item-container-error-color) inset}
+.ibiz-form-item-container{--ibiz-form-item-container-label-width:130px;--ibiz-form-item-container-line-height:var(--ibiz-height-control-default);--ibiz-form-item-container-require-mark-color:var(--ibiz-color-danger);--ibiz-form-item-container-label-left-padding:0 var(--ibiz-spacing-base-tight) 0 0;--ibiz-form-item-container-label-right-padding:0 0 0 var(--ibiz-spacing-base-tight);--ibiz-form-item-container-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-tight) var(--ibiz-spacing-extra-tight);--ibiz-form-item-container-font-size:var(--ibiz-font-size-regular);--ibiz-form-item-container-label-color:var(--ibiz-color-text-1);--ibiz-form-item-container-error-font-size:var(--ibiz-font-size-small);--ibiz-form-item-container-error-color:var(--ibiz-color-danger);width:100%;height:100%;padding:var(--ibiz-form-item-container-padding)}.ibiz-form-item-container__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0;font-size:var(--ibiz-form-item-container-font-size);color:var(--ibiz-form-item-container-label-color)}.ibiz-form-item-container__label--tooltip{max-width:150px}.ibiz-form-item-container__label--tooltip:has(ion-icon){padding-right:var(--ibiz-width-icon-large)}.ibiz-form-item-container__label--tooltip a{padding:0 var(--ibiz-spacing-extra-tight);color:var(--ibiz-color-link)}.ibiz-form-item-container__label--tooltip ion-icon{position:absolute;font-size:var(--ibiz-width-icon-large);color:var(--ibiz-color-fill-2)}.ibiz-form-item-container__popper.el-popper.is-light{padding:0 var(--ibiz-spacing-extra-tight);border:1px solid var(--ibiz-color-text-0);border-radius:0}.ibiz-form-item-container--left,.ibiz-form-item-container--right{display:flex;min-height:var(--ibiz-form-item-container-line-height)}.ibiz-form-item-container--left .ibiz-form-item-container__label,.ibiz-form-item-container--right .ibiz-form-item-container__label{width:var(--ibiz-form-item-container-label-width)}.ibiz-form-item-container--left .ibiz-form-item-container__content,.ibiz-form-item-container--right .ibiz-form-item-container__content{width:calc(100% - var(--ibiz-form-item-container-label-width))}.ibiz-form-item-container--bottom,.ibiz-form-item-container--top{display:flex;flex-flow:column nowrap}.ibiz-form-item-container--top .ibiz-form-item-container__label{margin-bottom:var(--ibiz-spacing-extra-tight)}.ibiz-form-item-container--bottom .ibiz-form-item-container__label{margin-top:var(--ibiz-spacing-extra-tight)}.ibiz-form-item-container--left .ibiz-form-item-container__label{padding:var(--ibiz-form-item-container-label-left-padding);line-height:var(--ibiz-form-item-container-line-height);text-align:right}.ibiz-form-item-container--right .ibiz-form-item-container__label{padding:var(--ibiz-form-item-container-label-right-padding);line-height:var(--ibiz-form-item-container-line-height);text-align:left}.ibiz-form-item-container.is-required .ibiz-form-item-container__label::before{display:inline-block;margin-right:4px;font-family:SimSun;line-height:1;color:var(--ibiz-form-item-container-require-mark-color);content:"*"}.ibiz-form-item-container__content{display:flex;flex-flow:column nowrap;position:relative;flex-grow:1}.ibiz-form-item-container__content--label-left,.ibiz-form-item-container__content--label-none,.ibiz-form-item-container__content--label-right{height:100%}.ibiz-form-item-container__editor{position:relative;flex-grow:1;height:100%}.ibiz-form-item-container__error{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;position:absolute;top:100%;width:100%;font-size:var(--ibiz-form-item-container-error-font-size);line-height:calc(var(--ibiz-form-item-container-error-font-size) + 2px);color:var(--ibiz-form-item-container-error-color);word-wrap:break-word}.ibiz-form-item-container.is-error .el-input__wrapper{box-shadow:0 0 0 1px var(--ibiz-form-item-container-error-color) inset}

package/lib/control/form/form-detail/form-item/form-item.cjs

@@ -40,23 +40,28 @@ const FormItem = /* @__PURE__ */ vue.defineComponent({
     };
   },
   render() {
-    var _a, _b;
+    var _a, _b, _c, _d, _e;
     if (!this.c.state.visible || ((_a = this.controller.model.editor) == null ? void 0 : _a.editorType) === "HIDDEN") {
       return null;
     }
     let editor = null;
+    const editMode = (_d = (_c = (_b = this.controller.editor) == null ? void 0 : _b.model) == null ? void 0 : _c.editorParams) == null ? void 0 : _d.editMode;
     const editorProps = {
-      style: (_b = this.controller.editor) == null ? void 0 : _b.style,
+      style: (_e = this.controller.editor) == null ? void 0 : _e.style,
       value: this.controller.value,
       data: this.controller.data,
       controller: this.controller.editor,
       disabled: this.controller.state.disabled,
       readonly: this.controller.state.readonly,
       onChange: this.onValueChange,
-      controlParams: this.controller.form.controlParams,
+      controlParams: editMode ? {
+        ...this.controller.form.controlParams,
+        editmode: editMode
+      } : this.controller.form.controlParams,
       onFocus: (event) => this.c.onFocus(event),
       onBlur: (event) => this.c.onBlur(event),
       onEnter: (event) => this.controller.onEnter(event),
+      onClick: (event, params) => this.controller.onClick(event, params),
       ...this.attrs
     };
     if (this.c.form.state.isLoaded) {
@@ -74,6 +79,7 @@ const FormItem = /* @__PURE__ */ vue.defineComponent({
       }
     }
     return vue.createVNode(vue.resolveComponent("iBizFormItemContainer"), {
+      "id": this.c.model.id,
       "class": [this.ns.b(), this.ns.m(this.modelData.id), ...this.controller.containerClass],
       "style": this.modelData.cssStyle,
       "required": this.c.state.required,

package/lib/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/repeater-grid/repeater-grid.cjs

@@ -48,8 +48,9 @@ const RepeaterGrid = /* @__PURE__ */ vue.defineComponent({
       formControllers.push(formC);
       props.controller.setRepeaterController("".concat(formControllers.length - 1), formC);
       formC.evt.on("onFormDataChange", (event) => {
-        const formData = {
-          ...event.data[0]
+        const item = event.data[0];
+        const formData = item instanceof runtime.ControlVO ? item.clone() : {
+          ...item
         };
         const index = formControllers.indexOf(formC);
         onSingleValueChange(formData, index);

package/lib/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/repeater-multi-form/repeater-multi-form.cjs

@@ -37,8 +37,13 @@ const RepeaterMultiForm = /* @__PURE__ */ vue.defineComponent({
   },
   render() {
     const items = this.controller.value;
+    let userStyle = "";
+    if (this.controller.model.userParam && this.controller.model.userParam.STYLE) {
+      userStyle = this.controller.model.userParam.STYLE;
+    }
     return vue.createVNode(vue.resolveComponent("iBizMDCtrlContainer"), {
       "class": this.ns.b(),
+      "userStyle": userStyle,
       "items": items,
       "enableCreate": this.controller.enableCreate,
       "enableDelete": this.controller.enableDelete,

package/lib/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/repeater-single-form/repeater-single-form.cjs

@@ -27,18 +27,12 @@ const RepeaterSingleForm = /* @__PURE__ */ vue.defineComponent({
     emit
   }) {
     const ns = vue3Util.useNamespace("repeater-single-form");
-    const getFilteredData = (data) => {
-      const tempData = {};
-      data.$dataUIMap.forEach((dataUI) => {
-        if (data[dataUI.dataKey] !== void 0) {
-          tempData[dataUI.dataKey] = data[dataUI.dataKey];
-        }
-      });
-      return tempData;
-    };
     const onFormDataChange = (event) => {
-      const data = getFilteredData(event.data[0]);
-      emit("change", data);
+      const item = event.data[0];
+      const formData = item instanceof runtime.ControlVO ? item.clone() : {
+        ...item
+      };
+      emit("change", formData);
     };
     const onCreated = (event) => {
       emit("created", event);

package/lib/control/form/form-detail/form-mdctrl/mdctrl-container/mdctrl-container.cjs

@@ -23,6 +23,9 @@ const MDCtrlContainer = /* @__PURE__ */ vue.defineComponent({
     items: {
       type: Object,
       required: true
+    },
+    userStyle: {
+      type: String
     }
   },
   emits: {
@@ -76,18 +79,85 @@ const MDCtrlContainer = /* @__PURE__ */ vue.defineComponent({
         default: () => [_slot3]
       });
     };
+    const renderStyle2AddBtn = () => {
+      return vue.createVNode(vue.resolveComponent("el-button"), {
+        "class": [ns.be("style2-item-actions", "create"), ns.be("style2-item-actions", "btn")],
+        "title": ibiz.i18n.t("app.add"),
+        "onClick": () => emit("addClick")
+      }, {
+        default: () => [vue.createVNode("ion-icon", {
+          "name": "add-outline"
+        }, null), ibiz.i18n.t("app.add")]
+      });
+    };
+    const renderStyle2RemoveBtn = (item, index) => {
+      let _slot4;
+      if (!props.enableDelete) {
+        return null;
+      }
+      if (ibiz.config.form.mdCtrlConfirmBeforeRemove) {
+        return vue.createVNode(vue.resolveComponent("el-popconfirm"), {
+          "title": core.showTitle(ibiz.i18n.t("control.form.mdCtrlContainer.promptInformation")),
+          "confirm-button-text": ibiz.i18n.t("app.confirm"),
+          "cancel-button-text": ibiz.i18n.t("app.cancel"),
+          "onConfirm": () => emit("removeClick", item, index)
+        }, {
+          reference: () => {
+            return vue.createVNode(vue.resolveComponent("el-button"), {
+              "type": "danger",
+              "class": [ns.be("style2-item-actions", "remove"), ns.be("style2-item-actions", "btn")],
+              "title": ibiz.i18n.t("app.delete")
+            }, {
+              default: () => [vue.createVNode("ion-icon", {
+                "name": "trash-outline"
+              }, null)]
+            });
+          }
+        });
+      }
+      return vue.createVNode(vue.resolveComponent("el-button"), {
+        "type": "danger",
+        "class": [ns.be("item-actions", "remove"), ns.be("item-actions", "btn")],
+        "onClick": () => emit("removeClick", item, index)
+      }, _isSlot(_slot4 = ibiz.i18n.t("app.delete")) ? _slot4 : {
+        default: () => [_slot4]
+      });
+    };
     return {
       ns,
       showActions,
       renderAddBtn,
-      renderRemoveBtn
+      renderRemoveBtn,
+      renderStyle2AddBtn,
+      renderStyle2RemoveBtn
     };
   },
   render() {
-    var _a;
+    var _a, _b;
+    if (this.userStyle === "STYLE2") {
+      return vue.createVNode("div", {
+        "class": [this.ns.b(), this.ns.b("style2")]
+      }, [((_a = this.items) == null ? void 0 : _a.length) ? vue.createVNode("div", {
+        "class": this.ns.e("item-container")
+      }, [this.showActions && this.enableCreate && this.renderStyle2AddBtn(), this.items.map((item, index) => {
+        const formComponent = this.$slots.item ? this.$slots.item({
+          data: item,
+          index
+        }) : vue.createVNode("div", null, [ibiz.i18n.t("control.form.mdCtrlContainer.noSlot")]);
+        return vue.createVNode("div", {
+          "class": this.ns.b("item")
+        }, [formComponent, this.showActions && vue.createVNode("div", {
+          "class": this.ns.b("style2-item-actions")
+        }, [this.renderStyle2RemoveBtn(item, index)])]);
+      })]) : vue.createVNode("div", {
+        "class": this.ns.b("no-data")
+      }, [this.enableCreate && vue.createVNode("div", {
+        "class": this.ns.b("style2-item-actions")
+      }, [this.renderStyle2AddBtn()])])]);
+    }
     return vue.createVNode("div", {
       "class": this.ns.b()
-    }, [((_a = this.items) == null ? void 0 : _a.length) ? this.items.map((item, index) => {
+    }, [((_b = this.items) == null ? void 0 : _b.length) ? this.items.map((item, index) => {
       const formComponent = this.$slots.item ? this.$slots.item({
         data: item,
         index

package/lib/control/form/form-detail/form-mdctrl/mdctrl-container/mdctrl-container.css

@@ -1 +1 @@
-.ibiz-mdctrl-container-item{display:flex}.ibiz-mdctrl-container-item__form{flex-grow:1}.ibiz-mdctrl-container-item-actions{flex-shrink:0;width:80px;text-align:center}.ibiz-mdctrl-container-item-actions .el-button+.el-button{margin-left:var(--ibiz-spacing-none)}.ibiz-mdctrl-container-item-actions__btn{margin-top:var(--ibiz-spacing-tight)}.ibiz-mdctrl-container-no-data{width:100%;display:flex;justify-content:flex-end}
+.ibiz-mdctrl-container-item{display:flex}.ibiz-mdctrl-container-item__form{flex-grow:1}.ibiz-mdctrl-container-item-actions{flex-shrink:0;width:80px;text-align:center}.ibiz-mdctrl-container-item-actions .el-button+.el-button{margin-left:var(--ibiz-spacing-none)}.ibiz-mdctrl-container-item-actions__btn{margin-top:var(--ibiz-spacing-tight)}.ibiz-mdctrl-container-no-data{width:100%;display:flex;justify-content:flex-end}.ibiz-mdctrl-container-style2-item-actions{flex:1;width:100%}.ibiz-mdctrl-container-style2-item-actions .el-button+.el-button{margin-left:var(--ibiz-spacing-none)}.ibiz-mdctrl-container-style2-item-actions__btn{margin-top:var(--ibiz-spacing-tight)}.ibiz-mdctrl-container-style2-item-actions__create{width:100%;color:var(--ibiz-color-primary);background-color:transparent;border:1px dashed var(--ibiz-color-border);border-width:1px!important}.ibiz-mdctrl-container-style2-item-actions__create ion-icon{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-mdctrl-container-style2-item-actions__create:focus{color:var(--ibiz-color-primary-hover);background-color:transparent;border:1px dashed var(--ibiz-color-primary-hover)}.ibiz-mdctrl-container-style2-item-actions__create:hover{color:var(--ibiz-color-primary-hover);background-color:transparent;border:1px dashed var(--ibiz-color-primary-hover)}.ibiz-mdctrl-container-style2-item-actions__remove{font-size:var(--ibiz-font-size-heder-6)}

package/lib/control/form/form-detail/form-page/form-page.cjs

@@ -16,6 +16,10 @@ const FormPage = /* @__PURE__ */ vue.defineComponent({
     modelData: {
       type: Object,
       required: true
+    },
+    controller: {
+      type: Object,
+      required: true
     }
   },
   setup(props) {
@@ -24,9 +28,13 @@ const FormPage = /* @__PURE__ */ vue.defineComponent({
     if (props.modelData.tabHeaderPos) {
       position = props.modelData.tabHeaderPos.toLowerCase();
     }
+    const onTabChange = (name) => {
+      props.controller.setActiveTab(name);
+    };
     return {
       ns,
-      position
+      position,
+      onTabChange
     };
   },
   render() {
@@ -44,7 +52,8 @@ const FormPage = /* @__PURE__ */ vue.defineComponent({
     return vue.createVNode(vue.resolveComponent("el-tabs"), {
       "class": [this.ns.b(), this.ns.b("tab"), this.ns.e(this.position)],
       "model-value": (_d = defaultSlots[0]) == null ? void 0 : _d.key,
-      "tab-position": this.position
+      "tab-position": this.position,
+      "onTabChange": this.onTabChange
     }, _isSlot(_slot = defaultSlots.map((slot) => {
       const props = slot.props;
       if (!props || !props.controller) {

package/lib/control/form/form-detail/form-page/form-page.css

@@ -1 +1 @@
-.ibiz-form-page{--ibiz-form-page-font-size:var(--ibiz-font-size-header-4);--ibiz-form-page-header-border-color:var(--ibiz-color-border);--ibiz-form-page-text-color:var(--ibiz-color-text-2);--ibiz-form-page-bg-color:transparent;--ibiz-form-page-hover-text-color:var(--ibiz-color-primary);--ibiz-form-page-hover-bg-color:transparent;--ibiz-form-page-active-text-color:var(--ibiz-color-primary);--ibiz-form-page-active-bg-color:transparent;--ibiz-form-page-active-border-color:var(--ibiz-color-primary)}.ibiz-form-page__left{height:100%}.ibiz-form-page__left>.el-tabs__header{height:100%}.ibiz-form-page__left>.el-tabs__content{height:100%;overflow:auto}.ibiz-form-page__right{height:100%}.ibiz-form-page__right>.el-tabs__header{height:100%}.ibiz-form-page__right>.el-tabs__content{height:100%;overflow:auto}.ibiz-form-page--no-tab-header .ibiz-form-page-item{padding-top:var(--ibiz-spacing-none)}.ibiz-form-page-tab>.el-tabs__header.is-top{margin-bottom:var(--ibiz-spacing-tight)}.ibiz-form-page-tab>.el-tabs__header.is-top .el-tabs__item.is-top{font-size:var(--ibiz-form-page-font-size);color:var(--ibiz-form-page-text-color);background-color:var(--ibiz-form-page-bg-color)}.ibiz-form-page-tab>.el-tabs__header.is-top .el-tabs__item.is-top:hover{color:var(--ibiz-form-page-hover-text-color);background-color:var(--ibiz-form-page-hover-bg-color)}.ibiz-form-page-tab>.el-tabs__header.is-top .el-tabs__item.is-top.is-active{color:var(--ibiz-form-page-active-text-color);background-color:var(--ibiz-form-page-active-bg-color)}.ibiz-form-page-tab .el-tabs__nav-wrap::after{background-color:var(--ibiz-form-page-header-border-color)}.ibiz-form-page-tab .el-tabs__active-bar{background-color:var(--ibiz-form-page-active-border-color)}.ibiz-form-page-item{padding-top:var(--ibiz-padding-top)}.ibiz-form-page-item-child{margin-bottom:var(--ibiz-margin-bottom)}
+.ibiz-form-page{--ibiz-form-page-font-size:var(--ibiz-font-size-header-4);--ibiz-form-page-header-border-color:var(--ibiz-color-border);--ibiz-form-page-text-color:var(--ibiz-color-text-2);--ibiz-form-page-bg-color:transparent;--ibiz-form-page-hover-text-color:var(--ibiz-color-primary);--ibiz-form-page-hover-bg-color:transparent;--ibiz-form-page-active-text-color:var(--ibiz-color-primary);--ibiz-form-page-active-bg-color:transparent;--ibiz-form-page-active-border-color:var(--ibiz-color-primary)}.ibiz-form-page__left{height:100%}.ibiz-form-page__left>.el-tabs__header{height:100%}.ibiz-form-page__left>.el-tabs__content{height:100%;overflow:auto}.ibiz-form-page__right{height:100%}.ibiz-form-page__right>.el-tabs__header{height:100%}.ibiz-form-page__right>.el-tabs__content{height:100%;overflow:auto}.ibiz-form-page--no-tab-header .ibiz-form-page-item{padding-top:var(--ibiz-spacing-none)}.ibiz-form-page-tab>.el-tabs__header.is-top{margin-bottom:var(--ibiz-spacing-tight)}.ibiz-form-page-tab>.el-tabs__header.is-top .el-tabs__item.is-top{font-size:var(--ibiz-form-page-font-size);color:var(--ibiz-form-page-text-color);background-color:var(--ibiz-form-page-bg-color)}.ibiz-form-page-tab>.el-tabs__header.is-top .el-tabs__item.is-top:hover{color:var(--ibiz-form-page-hover-text-color);background-color:var(--ibiz-form-page-hover-bg-color)}.ibiz-form-page-tab>.el-tabs__header.is-top .el-tabs__item.is-top.is-active{color:var(--ibiz-form-page-active-text-color);background-color:var(--ibiz-form-page-active-bg-color)}.ibiz-form-page-tab .el-tabs__nav-wrap::after{height:1px;background-color:var(--ibiz-form-page-header-border-color)}.ibiz-form-page-tab .el-tabs__active-bar{background-color:var(--ibiz-form-page-active-border-color)}.ibiz-form-page-item{padding-top:var(--ibiz-padding-top)}.ibiz-form-page-item-child{margin-bottom:var(--ibiz-margin-bottom)}

package/lib/control/form/form-detail/form-tab-panel/form-tab-panel.css

@@ -1 +1 @@
-.ibiz-form-tab-panel{width:100%;height:100%;--ibiz-form-tab-panel-font-size:var(--ibiz-font-size-header-4);--ibiz-form-tab-panel-header-border-color:var(--ibiz-color-border);--ibiz-form-tab-panel-text-color:var(--ibiz-color-text-2);--ibiz-form-tab-panel-bg-color:transparent;--ibiz-form-tab-panel-hover-text-color:var(--ibiz-color-primary);--ibiz-form-tab-panel-hover-bg-color:transparent;--ibiz-form-tab-panel-active-text-color:var(--ibiz-color-primary);--ibiz-form-tab-panel-active-bg-color:transparent;--ibiz-form-tab-panel-active-border-color:var(--ibiz-color-primary)}.ibiz-form-tab-panel>.el-tabs__header.is-top{margin-bottom:var(--ibiz-spacing-tight)}.ibiz-form-tab-panel>.el-tabs__header.is-top .el-tabs__item.is-top{font-size:var(--ibiz-form-tab-panel-font-size);color:var(--ibiz-form-tab-panel-text-color);background-color:var(--ibiz-form-tab-panel-bg-color)}.ibiz-form-tab-panel>.el-tabs__header.is-top .el-tabs__item.is-top:hover{color:var(--ibiz-form-tab-panel-hover-text-color);background-color:var(--ibiz-form-tab-panel-hover-bg-color)}.ibiz-form-tab-panel>.el-tabs__header.is-top .el-tabs__item.is-top.is-active{color:var(--ibiz-form-tab-panel-active-text-color);background-color:var(--ibiz-form-tab-panel-active-bg-color)}.ibiz-form-tab-panel .el-tabs__nav-wrap::after{background-color:var(--ibiz-form-tab-panel-header-border-color)}.ibiz-form-tab-panel .el-tabs__active-bar{background-color:var(--ibiz-form-tab-panel-active-border-color)}.ibiz-form-tab-panel__badge .el-badge__content{padding:var(--ibiz-spacing-extra-tight);font-size:var(--ibiz-font-size-small);background-color:var(--ibiz-color-danger)}
+.ibiz-form-tab-panel{width:100%;height:100%;--ibiz-form-tab-panel-font-size:var(--ibiz-font-size-header-4);--ibiz-form-tab-panel-header-border-color:var(--ibiz-color-border);--ibiz-form-tab-panel-text-color:var(--ibiz-color-text-2);--ibiz-form-tab-panel-bg-color:transparent;--ibiz-form-tab-panel-hover-text-color:var(--ibiz-color-primary);--ibiz-form-tab-panel-hover-bg-color:transparent;--ibiz-form-tab-panel-active-text-color:var(--ibiz-color-primary);--ibiz-form-tab-panel-active-bg-color:transparent;--ibiz-form-tab-panel-active-border-color:var(--ibiz-color-primary)}.ibiz-form-tab-panel>.el-tabs__header.is-top{margin-bottom:var(--ibiz-spacing-tight)}.ibiz-form-tab-panel>.el-tabs__header.is-top .el-tabs__item.is-top{font-size:var(--ibiz-form-tab-panel-font-size);color:var(--ibiz-form-tab-panel-text-color);background-color:var(--ibiz-form-tab-panel-bg-color)}.ibiz-form-tab-panel>.el-tabs__header.is-top .el-tabs__item.is-top:hover{color:var(--ibiz-form-tab-panel-hover-text-color);background-color:var(--ibiz-form-tab-panel-hover-bg-color)}.ibiz-form-tab-panel>.el-tabs__header.is-top .el-tabs__item.is-top.is-active{color:var(--ibiz-form-tab-panel-active-text-color);background-color:var(--ibiz-form-tab-panel-active-bg-color)}.ibiz-form-tab-panel .el-tabs__nav-wrap::after{height:1px;background-color:var(--ibiz-form-tab-panel-header-border-color)}.ibiz-form-tab-panel .el-tabs__active-bar{background-color:var(--ibiz-form-tab-panel-active-border-color)}.ibiz-form-tab-panel__badge .el-badge__content{padding:var(--ibiz-spacing-extra-tight);font-size:var(--ibiz-font-size-small);background-color:var(--ibiz-color-danger)}

package/lib/control/form/form-detail/index.cjs

@@ -9,6 +9,7 @@ var index$5 = require('./form-mdctrl/index.cjs');
 var index$6 = require('./form-rawitem/index.cjs');
 var index$7 = require('./form-tab-panel/index.cjs');
 var index$8 = require('./form-tab-page/index.cjs');
+var index$9 = require('./form-button-list/index.cjs');
 var formItemContainer = require('./form-item/form-item-container/form-item-container.cjs');
 var formPage_item = require('./form-page/form-page-item/form-page.item.cjs');
 
@@ -23,5 +24,6 @@ exports.IBizFormMDCtrl = index$5.IBizFormMDCtrl;
 exports.IBizFormRawItem = index$6.IBizFormRawItem;
 exports.IBizFormTabPanel = index$7.IBizFormTabPanel;
 exports.IBizFormTabPage = index$8.IBizFormTabPage;
+exports.IBizFormButtonList = index$9.IBizFormButtonList;
 exports.IBizFormItemContainer = formItemContainer.IBizFormItemContainer;
 exports.IBizFormPageItem = formPage_item.IBizFormPageItem;

package/lib/control/form/index.cjs

@@ -2,8 +2,8 @@
 
 var index = require('./search-form/index.cjs');
 require('./form-detail/index.cjs');
-var index$a = require('./edit-form/index.cjs');
-var index$b = require('./form/index.cjs');
+var index$b = require('./edit-form/index.cjs');
+var index$c = require('./form/index.cjs');
 var index$1 = require('./form-detail/form-group-panel/index.cjs');
 var formItemContainer = require('./form-detail/form-item/form-item-container/form-item-container.cjs');
 var index$2 = require('./form-detail/form-item/index.cjs');
@@ -15,12 +15,13 @@ var index$6 = require('./form-detail/form-mdctrl/index.cjs');
 var index$7 = require('./form-detail/form-rawitem/index.cjs');
 var index$8 = require('./form-detail/form-tab-panel/index.cjs');
 var index$9 = require('./form-detail/form-tab-page/index.cjs');
+var index$a = require('./form-detail/form-button-list/index.cjs');
 
 "use strict";
 
 exports.IBizSearchFormControl = index.IBizSearchFormControl;
-exports.IBizEditFormControl = index$a.IBizEditFormControl;
-exports.IBizFormControl = index$b.IBizFormControl;
+exports.IBizEditFormControl = index$b.IBizEditFormControl;
+exports.IBizFormControl = index$c.IBizFormControl;
 exports.IBizFormGroupPanel = index$1.IBizFormGroupPanel;
 exports.IBizFormItemContainer = formItemContainer.IBizFormItemContainer;
 exports.IBizFormItem = index$2.IBizFormItem;
@@ -32,3 +33,4 @@ exports.IBizFormMDCtrl = index$6.IBizFormMDCtrl;
 exports.IBizFormRawItem = index$7.IBizFormRawItem;
 exports.IBizFormTabPanel = index$8.IBizFormTabPanel;
 exports.IBizFormTabPage = index$9.IBizFormTabPage;
+exports.IBizFormButtonList = index$a.IBizFormButtonList;

package/lib/control/gantt/gantt.cjs

@@ -59,6 +59,19 @@ const GanttControl = /* @__PURE__ */ vue.defineComponent({
         app == null ? void 0 : app.use(defaltModule);
         isInited.value = true;
       });
+      c.evt.on("onToggleRowExpansion", (event) => {
+        const {
+          row,
+          expand
+        } = event;
+        if (ganttRef.value) {
+          if (expand) {
+            ganttRef.value.setExpand(row);
+          } else {
+            ganttRef.value.setCollapse(row);
+          }
+        }
+      });
     });
     const getVarValue = (varName) => {
       const root = document.documentElement;

package/lib/control/grid/grid/grid-control.util.cjs

@@ -2,6 +2,7 @@
 
 var core = require('@ibiz-template/core');
 var runtime = require('@ibiz-template/runtime');
+var lodashEs = require('lodash-es');
 var vue = require('vue');
 
 "use strict";
@@ -29,11 +30,32 @@ function useITableEvent(c) {
   const tableRef = vue.ref();
   let forbidChange = false;
   let isGridUISort = false;
+  c.evt.on("onToggleRowExpansion", (event) => {
+    const { row, expand } = event;
+    if (tableRef.value) {
+      if (tableRef.value.lazy) {
+        const { store } = tableRef.value;
+        const { treeData } = tableRef.value.store.states;
+        const data = treeData.value[row.srfkey];
+        if (data && data.expanded !== expand) {
+          store.loadOrToggle(row);
+        }
+      } else {
+        tableRef.value.toggleRowExpansion(row, expand);
+      }
+    }
+  });
   async function onRowClick(data, _column, _event) {
     if (data.srfuf === runtime.Srfuf.CREATE) {
       return;
     }
-    if (ibiz.config.grid.editShowMode === "row" && c.model.enableRowEdit) {
+    const target = _event.target;
+    const { classList } = target.parentElement || {};
+    if (classList && classList.contains("el-table-column--selection")) {
+      tableRef.value.toggleRowSelection(data);
+      return;
+    }
+    if (c.editShowMode === "row" && c.model.enableRowEdit) {
       const row = c.findRowState(data);
       if (row && row.showRowEdit !== true) {
         await c.switchRowEdit(row, true);
@@ -94,6 +116,21 @@ function useITableEvent(c) {
     if (sortQuery === c.state.sortQuery) {
       return;
     }
+    if (c.context && c.context.srfrunmode === "DESIGN") {
+      c.state.items = lodashEs.orderBy(
+        c.state.items,
+        [(item) => {
+          var _a;
+          return ((_a = item == null ? void 0 : item[fieldName || ""]) == null ? void 0 : _a.length) || 0;
+        }],
+        [order1 || "asc"]
+      );
+      c.state.rows = c.state.items.map((item) => {
+        const row = new runtime.GridRowState(new runtime.ControlVO(item), c);
+        return row;
+      });
+      return;
+    }
     c.setSort(fieldName, order1);
     c.load({
       isInitialLoad: c.model.pagingMode === 2 || c.model.pagingMode === 3
@@ -196,7 +233,13 @@ function useAppGridBase(c, props) {
       return;
     }
     c.state.items = props.data;
-    c.state.rows = props.data.map((item) => {
+    if (c.context && c.context.srfrunmode === "DESIGN") {
+      c.state.simpleData = props.data;
+      c.state.total = props.data.length;
+      c.state.curPage = 1;
+      c.state.items = lodashEs.chunk(c.state.simpleData, c.state.size)[c.state.curPage - 1] || [];
+    }
+    c.state.rows = c.state.items.map((item) => {
       const row = new runtime.GridRowState(new runtime.ControlVO(item), c);
       return row;
     });

package/lib/control/grid/grid/grid.cjs

@@ -154,6 +154,10 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
       zIndex
     } = vue3Util.useUIStore();
     c.state.zIndex = zIndex.increment();
+    const {
+      sysCss
+    } = c.model;
+    const sysCssName = sysCss == null ? void 0 : sysCss.cssName;
     const {
       tableRef,
       onRowClick,
@@ -299,6 +303,7 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
     return {
       c,
       ns,
+      sysCssName,
       tableRef,
       tableData,
       renderColumns,
@@ -359,7 +364,9 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
         "onHeaderDragend": this.headerDragend,
         "tooltip-effect": "light",
         "scrollbar-always-on": true
-      }, this.$attrs), {
+      }, this.$attrs, renderAttrs(this.c.model, {
+        ...this.c.getEventArgs()
+      })), {
         empty: this.renderNoData,
         default: () => {
           return [this.c.enableRowEditOrder && this.renderDragIconColumn(), !state.singleSelect && vue.createVNode(vue.resolveComponent("el-table-column"), {
@@ -386,12 +393,13 @@ const GridControl = /* @__PURE__ */ vue.defineComponent({
             default: () => [_slot]
           })]), this.renderPopover()];
         }
-      }), this.c.state.enablePagingBar && this.c.model.pagingMode === 1 && vue.createVNode(vue.resolveComponent("iBizPagination"), {
+      }), this.c.state.enablePagingBar && vue.createVNode(vue.resolveComponent("iBizPagination"), {
         "total": state.total,
         "curPage": state.curPage,
         "size": state.size,
         "totalPages": state.totalPages,
         "onChange": this.onPageChange,
+        "popperClass": "".concat(this.sysCssName, "--popper"),
         "onPageSizeChange": this.onPageSizeChange,
         "onPageRefresh": this.onPageRefresh
       }, null), this.c.model.enableCustomized && !this.c.state.hideHeader && vue.createVNode("div", {