@ibiz-template/vue3-components 0.7.37-alpha.5 → 0.7.38-alpha.21

package/lib/common/gantt-setting/gantt-setting.cjs

@@ -0,0 +1,219 @@
+'use strict';
+
+var vue = require('vue');
+var vue3Util = require('@ibiz-template/vue3-util');
+var ramda = require('ramda');
+require('./gantt-setting.css');
+
+"use strict";
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !vue.isVNode(s);
+}
+const selectedIcon = () => vue.createVNode("svg", {
+  "viewBox": "0 0 16 16",
+  "xmlns": "http://www.w3.org/2000/svg",
+  "height": "1em",
+  "width": "1em",
+  "focusable": "false"
+}, [vue.createVNode("g", {
+  "stroke-width": "1",
+  "fill-rule": "evenodd"
+}, [vue.createVNode("path", {
+  "d": "M6.012 11.201L1.313 6.832l-.817.879 5.54 5.15 9.304-9.163-.842-.855z"
+}, null)])]);
+const closeIcon = () => vue.createVNode("svg", {
+  "viewBox": "0 0 16 16",
+  "xmlns": "http://www.w3.org/2000/svg",
+  "height": "1em",
+  "width": "1em",
+  "focusable": "false"
+}, [vue.createVNode("g", {
+  "stroke-width": "1",
+  "fill-rule": "evenodd"
+}, [vue.createVNode("path", {
+  "d": "M7.456 7.456V-.115h1.2v7.571h7.572v1.2H8.656v7.572h-1.2V8.656H-.115v-1.2h7.571z",
+  "transform": "rotate(45 8.056 8.056)"
+}, null)])]);
+const searchIcon = () => vue.createVNode("svg", {
+  "viewBox": "0 0 16 16",
+  "xmlns": "http://www.w3.org/2000/svg",
+  "height": "1em",
+  "width": "1em",
+  "focusable": "false"
+}, [vue.createVNode("g", {
+  "stroke-width": "1",
+  "fill-rule": "evenodd"
+}, [vue.createVNode("path", {
+  "d": "M6.751 12.303A5.557 5.557 0 0 1 1.2 6.751C1.2 3.691 3.69 1.2 6.751 1.2a5.558 5.558 0 0 1 5.551 5.551 5.557 5.557 0 0 1-5.551 5.552M6.751 0a6.751 6.751 0 1 0 4.309 11.949l3.855 3.855a.6.6 0 1 0 .849-.849l-3.854-3.853A6.751 6.751 0 0 0 6.751 0"
+}, null)])]);
+const IBizGanttSetting = /* @__PURE__ */ vue.defineComponent({
+  name: "IBizGanttSetting",
+  props: {
+    modal: {
+      type: Object,
+      required: true
+    },
+    // 表格列状态数组
+    columnStates: {
+      type: Object,
+      required: true
+    },
+    // 必须显示的列
+    mustShowColumns: {
+      type: Array,
+      required: true,
+      default: () => ["sn", "name"]
+    }
+  },
+  emits: [],
+  setup(props) {
+    const ns = vue3Util.useNamespace("gantt-setting");
+    const optionalInput = vue.ref("");
+    const selectedInput = vue.ref("");
+    const states = vue.ref([]);
+    const calcMustShowColumn = (item) => {
+      return props.mustShowColumns.some((item2) => item.key === item2);
+    };
+    const initData = () => {
+      states.value = ramda.clone(props.columnStates);
+    };
+    vue.watch(() => props.columnStates, () => {
+      initData();
+    }, {
+      immediate: true,
+      deep: true
+    });
+    const onListItemClose = (e, item) => {
+      e.stopPropagation();
+      Object.assign(item, {
+        hidden: !item.hidden
+      });
+    };
+    const onListItemClick = (item) => {
+      Object.assign(item, {
+        hidden: !item.hidden
+      });
+    };
+    const onClose = () => {
+      props.modal.dismiss();
+    };
+    const onConfirm = () => {
+      const modalData = {
+        ok: true,
+        data: states.value
+      };
+      props.modal.dismiss(modalData);
+    };
+    const onResultDefault = () => {
+      initData();
+    };
+    const renderLeftSearch = () => {
+      return vue.createVNode(vue.resolveComponent("el-input"), {
+        "placeholder": ibiz.i18n.t("app.search"),
+        "modelValue": optionalInput.value,
+        "onUpdate:modelValue": ($event) => optionalInput.value = $event,
+        "clearable": true
+      }, {
+        prefix: () => searchIcon()
+      });
+    };
+    const renderRightSearch = () => {
+      return vue.createVNode(vue.resolveComponent("el-input"), {
+        "placeholder": ibiz.i18n.t("app.search"),
+        "modelValue": selectedInput.value,
+        "onUpdate:modelValue": ($event) => selectedInput.value = $event,
+        "clearable": true
+      }, {
+        prefix: () => searchIcon()
+      });
+    };
+    const renderListItem = (item, type = "optional") => {
+      const caption = item.caption || "";
+      const isOptional = type === "optional";
+      const isMust = calcMustShowColumn(item);
+      if (!isOptional && item.hidden && !isMust) {
+        return null;
+      }
+      const isSelectedShow = isOptional && states.value.some((item2) => item.key === item2.key && !item.hidden);
+      return vue.createVNode("div", {
+        "class": [ns.b("list-item"), ns.is("disabled", isMust && isOptional)],
+        "onClick": () => isOptional && !isMust && onListItemClick(item)
+      }, [vue.createVNode("div", {
+        "class": ns.be("list-item", "caption")
+      }, [caption]), vue.createVNode("div", {
+        "class": [ns.be("list-item", "end-icon")]
+      }, [(isSelectedShow || isOptional && isMust) && selectedIcon(), !isOptional && !isMust && vue.createVNode("div", {
+        "class": ns.bem("list-item", "end-icon", "close"),
+        "onClick": (e) => onListItemClose(e, item)
+      }, [closeIcon()])])]);
+    };
+    const renderSearchList = (listData = [], type = "optional") => {
+      const isOptional = type === "optional";
+      const searchVal = isOptional ? optionalInput.value : selectedInput.value;
+      const values = [];
+      listData.forEach((item) => {
+        var _a;
+        return ((_a = item.caption) == null ? void 0 : _a.includes(searchVal)) && values.push(item);
+      });
+      const lengthNum = isOptional ? values.length : listData.filter((item) => !item.hidden).length;
+      const caption = isOptional ? ibiz.i18n.t("component.ganttSetting.optionalAttribute") : ibiz.i18n.t("component.ganttSetting.selectedAttribute");
+      return vue.createVNode("div", {
+        "class": ns.b("search-list")
+      }, [vue.createVNode("div", {
+        "class": ns.be("search-list", "caption")
+      }, ["".concat(caption, " \xB7 ").concat(lengthNum)]), vue.createVNode("div", {
+        "class": ns.be("search-list", "content")
+      }, [vue.createVNode("div", {
+        "class": ns.be("search-list", "search")
+      }, [isOptional ? renderLeftSearch() : renderRightSearch()]), vue.createVNode("div", {
+        "class": ns.be("search-list", "list")
+      }, [values.map((item) => {
+        return renderListItem(item, type);
+      })])])]);
+    };
+    return {
+      ns,
+      optionalInput,
+      selectedInput,
+      states,
+      renderSearchList,
+      onClose,
+      onConfirm,
+      onResultDefault
+    };
+  },
+  render() {
+    let _slot, _slot2, _slot3;
+    return vue.createVNode("div", {
+      "class": [this.ns.b()]
+    }, [vue.createVNode("div", {
+      "class": [this.ns.e("header")]
+    }, [ibiz.i18n.t("component.ganttSetting.headerCaption")]), vue.createVNode("div", {
+      "class": [this.ns.e("content")]
+    }, [vue.createVNode("div", {
+      "class": [this.ns.em("content", "optional")]
+    }, [this.renderSearchList(this.states, "optional")]), vue.createVNode("div", {
+      "class": [this.ns.em("content", "selected")]
+    }, [this.renderSearchList(this.states, "selected")])]), vue.createVNode("div", {
+      "class": [this.ns.e("bottom")]
+    }, [vue.createVNode(vue.resolveComponent("el-button"), {
+      "type": "text",
+      "onClick": this.onResultDefault
+    }, _isSlot(_slot = ibiz.i18n.t("component.ganttSetting.resultDefault")) ? _slot : {
+      default: () => [_slot]
+    }), vue.createVNode("div", {
+      "class": [this.ns.em("bottom", "btn-right")]
+    }, [vue.createVNode(vue.resolveComponent("el-button"), {
+      "type": "text",
+      "onClick": this.onClose
+    }, _isSlot(_slot2 = ibiz.i18n.t("app.cancel")) ? _slot2 : {
+      default: () => [_slot2]
+    }), vue.createVNode(vue.resolveComponent("el-button"), {
+      "onClick": this.onConfirm
+    }, _isSlot(_slot3 = ibiz.i18n.t("app.confirm")) ? _slot3 : {
+      default: () => [_slot3]
+    })])])]);
+  }
+});
+
+exports.IBizGanttSetting = IBizGanttSetting;

package/lib/common/gantt-setting/gantt-setting.css

@@ -0,0 +1 @@
+.ibiz-gantt-setting{--ibiz-gantt-setting-width:85vw;--ibiz-gantt-setting-max-width:980px;--ibiz-gantt-setting-max-height:85vh;--ibiz-gantt-setting-header-height:56px;--ibiz-gantt-setting-list-height:360px;--ibiz-gantt-setting-disabled-opacity:0.5;display:flex;flex-direction:column;width:var(--ibiz-gantt-setting-width);max-width:var(--ibiz-gantt-setting-width);max-height:var(--ibiz-gantt-setting-max-height)}.ibiz-gantt-setting__header{width:100%;height:var(--ibiz-gantt-setting-header-height);padding:0 var(--ibiz-spacing-extra-loose);font-size:var(--ibiz-font-size-header-5);line-height:var(--ibiz-gantt-setting-header-height)}.ibiz-gantt-setting__content{display:flex;flex:1;justify-content:space-between;width:100%;padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-extra-loose) var(--ibiz-spacing-base)}.ibiz-gantt-setting__content--optional{flex:0 0 calc(50% - var(--ibiz-spacing-base));width:0}.ibiz-gantt-setting__content--selected{flex:0 0 calc(50% - var(--ibiz-spacing-base));width:0}.ibiz-gantt-setting__bottom{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--ibiz-spacing-base) var(--ibiz-spacing-extra-loose)}.ibiz-gantt-setting__bottom--btn-right{display:flex;align-items:center}.ibiz-gantt-setting-search-list{width:100%}.ibiz-gantt-setting-search-list__caption{margin-bottom:var(--ibiz-spacing-tight)}.ibiz-gantt-setting-search-list__content{border:1px solid var(--ibiz-color-border);border-radius:var(--ibiz-border-radius-small)}.ibiz-gantt-setting-search-list__search{padding:0 var(--ibiz-spacing-base-loose);margin:var(--ibiz-spacing-tight) 0}.ibiz-gantt-setting-search-list__search svg{fill:var(--ibiz-color-disabled-text)}.ibiz-gantt-setting-search-list__list{--ibiz-gantt-setting-width:85vw;--ibiz-gantt-setting-max-width:980px;--ibiz-gantt-setting-max-height:85vh;--ibiz-gantt-setting-header-height:56px;--ibiz-gantt-setting-list-height:360px;--ibiz-gantt-setting-disabled-opacity:0.5;height:var(--ibiz-gantt-setting-list-height);padding-bottom:var(--ibiz-spacing-tight);overflow-y:auto}.ibiz-gantt-setting-list-item{--ibiz-gantt-setting-width:85vw;--ibiz-gantt-setting-max-width:980px;--ibiz-gantt-setting-max-height:85vh;--ibiz-gantt-setting-header-height:56px;--ibiz-gantt-setting-list-height:360px;--ibiz-gantt-setting-disabled-opacity:0.5;display:flex;align-items:center;width:100%;height:var(--ibiz-spacing-extra-loose);padding:0 var(--ibiz-spacing-base-loose);overflow:hidden;cursor:pointer}.ibiz-gantt-setting-list-item:hover{background-color:var(--ibiz-color-fill-2)}.ibiz-gantt-setting-list-item__caption{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-gantt-setting-list-item__end-icon{display:flex;align-items:center;justify-content:center;cursor:pointers}.ibiz-gantt-setting-list-item__end-icon svg{fill:var(--ibiz-color-primary)}.ibiz-gantt-setting-list-item__end-icon--close{width:100%;height:100%}.ibiz-gantt-setting-list-item__end-icon--close svg{fill:var(--ibiz-color-text-3)}.ibiz-gantt-setting-list-item__end-icon--close svg:hover{fill:var(--ibiz-color-primary)}.ibiz-gantt-setting-list-item.is-optional .ibiz-gantt-setting-list-item__end-icon{cursor:pointers}.ibiz-gantt-setting-list-item.is-optional .ibiz-gantt-setting-list-item__end-icon svg{fill:var(--ibiz-color-primary)}.ibiz-gantt-setting-list-item.is-disabled{cursor:not-allowed;background:0 0;opacity:var(--ibiz-gantt-setting-disabled-opacity)}@media (width >= 992px){.ibiz-gantt-setting{--ibiz-gantt-setting-width:85vw;--ibiz-gantt-setting-max-width:980px;--ibiz-gantt-setting-max-height:85vh;--ibiz-gantt-setting-header-height:56px;--ibiz-gantt-setting-list-height:360px;--ibiz-gantt-setting-disabled-opacity:0.5;max-width:var(--ibiz-gantt-setting-max-width)}}@media (height <= 768px){.ibiz-gantt-setting-search-list{display:flex;flex-direction:column;height:100%}.ibiz-gantt-setting-search-list__content{display:flex;flex:1;flex-direction:column;height:100%}.ibiz-gantt-setting-search-list__list{display:flex;flex:1;flex-direction:column;height:100%}}

package/lib/common/grid-setting/grid-setting.cjs

@@ -2,9 +2,9 @@
 
 var vue = require('vue');
 var vue3Util = require('@ibiz-template/vue3-util');
-require('./grid-setting.css');
 var draggable = require('vuedraggable');
 var core = require('@ibiz-template/core');
+require('./grid-setting.css');
 
 "use strict";
 const IBizGridSetting = /* @__PURE__ */ vue.defineComponent({
@@ -51,17 +51,23 @@ const IBizGridSetting = /* @__PURE__ */ vue.defineComponent({
         c.changeColumnStateSort(movedDragColumnState.key, newIndex, oldIndex);
       }
     };
+    const onShowNavView = () => {
+      c.state.showNavView = !c.state.showNavView;
+    };
     return {
       ns,
       c,
       dragColumnStates,
       isDraggable,
       handleClick,
-      onDragChange
+      onDragChange,
+      onShowNavView
     };
   },
   render() {
-    return vue.createVNode(vue.resolveComponent("el-popover"), {
+    return vue.createVNode("div", {
+      "class": this.ns.b()
+    }, [vue.createVNode(vue.resolveComponent("el-popover"), {
       "placement": "right-start",
       "trigger": "click",
       "width": "auto"
@@ -117,7 +123,17 @@ const IBizGridSetting = /* @__PURE__ */ vue.defineComponent({
           }
         });
       }
-    });
+    }), this.c.state.enableNavView ? !this.c.state.showNavView ? vue.createVNode("ion-icon", {
+      "class": this.ns.e("nav-icon"),
+      "title": ibiz.i18n.t("component.controlNavigation.showNav"),
+      "name": "eye-outline",
+      "onClick": this.onShowNavView
+    }, null) : vue.createVNode("ion-icon", {
+      "class": this.ns.e("nav-icon"),
+      "title": ibiz.i18n.t("component.controlNavigation.hiddenNav"),
+      "name": "eye-off-outline",
+      "onClick": this.onShowNavView
+    }, null) : null]);
   }
 });
 

package/lib/common/grid-setting/grid-setting.css

@@ -1 +1 @@
-.ibiz-grid-setting-column-states{width:100%;max-height:500px;overflow-y:auto}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state{display:flex;align-items:center;justify-content:flex-start;width:100%;padding:var(--ibiz-spacing-extra-tight) 0;font-size:var(--ibiz-font-size-regular);cursor:pointer}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state ion-icon{display:inline-block;width:var(--ibiz-font-size-small);margin-right:var(--ibiz-spacing-extra-tight);font-size:var(--ibiz-font-size-regular)}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state .ibiz-grid-setting-drag-icon{color:var(--ibiz-color-text)}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state .ibiz-grid-setting-enable-icon{color:var(--ibiz-color-success)}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state .ibiz-grid-setting-disable-icon{display:none;color:var(--ibiz-color-danger)}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state .ibiz-grid-setting-state-caption{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state.is-disabled .ibiz-grid-setting-enable-icon{display:none}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state.is-disabled .ibiz-grid-setting-disable-icon{display:block}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state.is-disabled .ibiz-grid-setting-state-caption{color:var(--ibiz-color-disabled-text)}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state-ghost{background-color:var(--ibiz-color-primary-light-default);opacity:.5}.ibiz-grid-setting-set-icon{color:var(--ibiz-color-primary);cursor:pointer}
+.ibiz-grid-setting-column-states{width:100%;max-height:500px;overflow-y:auto}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state{display:flex;align-items:center;justify-content:flex-start;width:100%;padding:var(--ibiz-spacing-extra-tight) 0;font-size:var(--ibiz-font-size-regular);cursor:pointer}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state ion-icon{display:inline-block;width:var(--ibiz-font-size-small);margin-right:var(--ibiz-spacing-extra-tight);font-size:var(--ibiz-font-size-regular)}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state .ibiz-grid-setting-drag-icon{color:var(--ibiz-color-text)}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state .ibiz-grid-setting-enable-icon{color:var(--ibiz-color-success)}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state .ibiz-grid-setting-disable-icon{display:none;color:var(--ibiz-color-danger)}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state .ibiz-grid-setting-state-caption{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state.is-disabled .ibiz-grid-setting-enable-icon{display:none}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state.is-disabled .ibiz-grid-setting-disable-icon{display:block}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state.is-disabled .ibiz-grid-setting-state-caption{color:var(--ibiz-color-disabled-text)}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state-ghost{background-color:var(--ibiz-color-primary-light-default);opacity:.5}.ibiz-grid-setting-set-icon{color:var(--ibiz-color-primary);cursor:pointer}.ibiz-grid-setting__nav-icon{cursor:pointer;color:var(--ibiz-color-primary);padding-left:var(--ibiz-spacing-tight)}

package/lib/common/index.cjs

@@ -30,6 +30,11 @@ var quickEdit = require('./quick-edit/quick-edit.cjs');
 var fullscreenToolbar = require('./fullscreen-toolbar/fullscreen-toolbar.cjs');
 var pqlEditor = require('./pql-editor/pql-editor.cjs');
 var customFilterCondition = require('./custom-filter-condition/custom-filter-condition.cjs');
+var anchorContainer = require('./anchor-container/anchor-container.cjs');
+var buttonList = require('./button-list/button-list.cjs');
+var controlNavigation = require('./control-navigation/control-navigation.cjs');
+var ganttSetting = require('./gantt-setting/gantt-setting.cjs');
+var navSplit = require('./nav-split/nav-split.cjs');
 
 "use strict";
 const IBizCommonComponents = {
@@ -73,6 +78,11 @@ const IBizCommonComponents = {
     v.component(fullscreenToolbar.IBizFullscreenToolbar.name, fullscreenToolbar.IBizFullscreenToolbar);
     v.component(pqlEditor.IBizPqlEditor.name, pqlEditor.IBizPqlEditor);
     v.component(customFilterCondition.IBizCustomFilterCondition.name, customFilterCondition.IBizCustomFilterCondition);
+    v.component(anchorContainer.IBizAnchorContainer.name, anchorContainer.IBizAnchorContainer);
+    v.component(buttonList.IBizButtonList.name, buttonList.IBizButtonList);
+    v.component(controlNavigation.IBizControlNavigation.name, controlNavigation.IBizControlNavigation);
+    v.component(ganttSetting.IBizGanttSetting.name, ganttSetting.IBizGanttSetting);
+    v.component(navSplit.IBizNavSplit.name, navSplit.IBizNavSplit);
   }
 };
 

package/lib/common/nav-split/nav-split.cjs

@@ -0,0 +1,211 @@
+'use strict';
+
+var vue = require('vue');
+var vue3Util = require('@ibiz-template/vue3-util');
+require('./nav-split.css');
+
+"use strict";
+const IBizNavSplit = /* @__PURE__ */ vue.defineComponent({
+  name: "IBizNavSplit",
+  props: {
+    modelValue: {
+      type: [Number, String],
+      default: 0.5
+    },
+    mode: {
+      validator: (value) => {
+        return ["horizontal", "vertical"].includes(value);
+      },
+      default: "horizontal"
+    },
+    min: {
+      type: [Number, String],
+      default: 0.2
+    },
+    max: {
+      type: [Number, String],
+      default: 0.8
+    }
+  },
+  emits: ["update:modelValue", "on-move-start", "on-moving", "on-move-end"],
+  setup(props, {
+    emit
+  }) {
+    const ns = vue3Util.useNamespace("nav-split");
+    const outerWrapper = vue.ref(null);
+    const offset = vue.ref(0);
+    const oldOffset = vue.ref(0);
+    const isMoving = vue.ref(false);
+    const computedMin = vue.ref(0);
+    const computedMax = vue.ref(0);
+    const currentValue = vue.ref(0.5);
+    const initOffset = vue.ref(0);
+    const wrapperClasses = vue.computed(() => [ns.b("wrapper"), ns.is("no-select", isMoving.value)]);
+    const paneClasses = vue.computed(() => [ns.b("pane"), isMoving.value ? ns.bm("pane", "moving") : ""]);
+    const isHorizontal = vue.computed(() => props.mode === "horizontal");
+    const anotherOffset = vue.computed(() => 100 - offset.value);
+    const valueIsPx = vue.computed(() => typeof props.modelValue === "string");
+    const offsetSize = vue.computed(() => isHorizontal.value ? "offsetWidth" : "offsetHeight");
+    const px2percent = (numerator, denominator) => {
+      return parseFloat(numerator) / parseFloat(denominator);
+    };
+    const getComputedThresholdValue = (type) => {
+      const size = outerWrapper.value[offsetSize.value];
+      if (valueIsPx.value) {
+        return typeof props[type] === "string" ? props[type] : size * props[type];
+      }
+      return typeof props[type] === "string" ? px2percent(props[type], size) : props[type];
+    };
+    const getMax = (value1, value2) => {
+      if (valueIsPx.value)
+        return "".concat(Math.max(parseFloat(value1), parseFloat(value2)), "px");
+      return Math.max(value1, value2);
+    };
+    const getMin = (value1, value2) => {
+      if (valueIsPx.value)
+        return "".concat(Math.min(parseFloat(value1), parseFloat(value2)), "px");
+      return Math.min(value1, value2);
+    };
+    const getAnotherOffset = (value) => {
+      let res = 0;
+      if (valueIsPx.value)
+        res = "".concat(outerWrapper.value[offsetSize.value] - parseFloat(value), "px");
+      else
+        res = 1 - value;
+      return res;
+    };
+    const handleMove = (e) => {
+      const pageOffset = isHorizontal.value ? e.pageX : e.pageY;
+      const moveOffset = pageOffset - initOffset.value;
+      const outerWidth = outerWrapper.value[offsetSize.value];
+      let value = valueIsPx.value ? "".concat(parseFloat(oldOffset.value) + moveOffset, "px") : px2percent(outerWidth * oldOffset.value + moveOffset, outerWidth);
+      const anotherValue = getAnotherOffset(value);
+      if (parseFloat(anotherValue) > parseFloat(computedMax.value)) {
+        value = getAnotherOffset(getMin(anotherValue, computedMax.value));
+      }
+      if (parseFloat(anotherValue) <= parseFloat(computedMin.value)) {
+        value = getAnotherOffset(getMax(anotherValue, computedMin.value));
+      }
+      Object.assign(e, {
+        atMin: props.modelValue === computedMin.value,
+        atMax: valueIsPx.value ? getAnotherOffset(props.modelValue) === computedMax.value : getAnotherOffset(props.modelValue).toFixed(5) === computedMax.value.toFixed(5)
+      });
+      emit("update:modelValue", value);
+      emit("on-moving", e);
+    };
+    const handleUp = () => {
+      isMoving.value = false;
+      document.removeEventListener("mousemove", handleMove);
+      document.removeEventListener("mouseup", handleUp);
+      emit("on-move-end");
+    };
+    const handleMousedown = (e) => {
+      initOffset.value = isHorizontal.value ? e.pageX : e.pageY;
+      oldOffset.value = props.modelValue;
+      isMoving.value = true;
+      document.addEventListener("mousemove", handleMove);
+      document.addEventListener("mouseup", handleUp);
+      emit("on-move-start");
+    };
+    const computeOffset = () => {
+      vue.nextTick(() => {
+        computedMin.value = getComputedThresholdValue("min");
+        computedMax.value = getComputedThresholdValue("max");
+        const denominator = outerWrapper.value[offsetSize.value];
+        const outerWrapperValue = parseFloat(denominator);
+        const defaultValue = (valueIsPx.value ? px2percent(props.modelValue, outerWrapperValue) : props.modelValue) * 1e4 / 100;
+        const reverseValue = defaultValue * 100 / 1e4 * outerWrapperValue;
+        const diffValue = outerWrapperValue - reverseValue;
+        const maxValue = parseFloat(computedMax.value);
+        const minValue = parseFloat(computedMin.value);
+        if (Math.round(diffValue) >= minValue && Math.round(diffValue) <= maxValue) {
+          offset.value = defaultValue;
+        } else if (Math.round(diffValue) < minValue) {
+          const leftWidth = outerWrapperValue - minValue;
+          offset.value = leftWidth / outerWrapperValue * 1e4 / 100;
+          emit("update:modelValue", "".concat(leftWidth, "px"));
+        } else {
+          const leftWidth = outerWrapperValue - maxValue;
+          offset.value = leftWidth / outerWrapperValue * 1e4 / 100;
+          emit("update:modelValue", "".concat(leftWidth, "px"));
+        }
+      });
+    };
+    vue.watch(() => props.modelValue, (val) => {
+      console.log("props.modelValue", val);
+      if (val !== currentValue.value) {
+        currentValue.value = val;
+        computeOffset();
+      }
+    });
+    vue.onMounted(() => {
+      vue.nextTick(() => {
+        computeOffset();
+      });
+      window.addEventListener("resize", computeOffset);
+    });
+    vue.onBeforeUnmount(() => {
+      window.removeEventListener("resize", computeOffset);
+    });
+    return {
+      ns,
+      outerWrapper,
+      offset,
+      wrapperClasses,
+      paneClasses,
+      isHorizontal,
+      anotherOffset,
+      handleMousedown,
+      handleMove
+    };
+  },
+  render() {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
+    return vue.createVNode("div", {
+      "class": this.wrapperClasses,
+      "ref": "outerWrapper"
+    }, [this.isHorizontal ? vue.createVNode("div", {
+      "class": this.ns.m("horizontal")
+    }, [vue.createVNode("div", {
+      "style": {
+        width: "".concat(this.offset, "%")
+      },
+      "class": [this.paneClasses, this.ns.bm("pane", "left")]
+    }, [(_b = (_a = this.$slots).left) == null ? void 0 : _b.call(_a)]), vue.createVNode("div", {
+      "style": {
+        left: "".concat(this.offset, "%")
+      },
+      "class": this.ns.b("trigger-con"),
+      "onMousedown": (e) => this.handleMousedown(e)
+    }, [((_d = (_c = this.$slots).trigger) == null ? void 0 : _d.call(_c)) || vue.createVNode(vue.resolveComponent("iBizSplitTrigger"), {
+      "mode": "vertical"
+    }, null)]), vue.createVNode("div", {
+      "style": {
+        width: "".concat(this.anotherOffset, "%")
+      },
+      "class": [this.paneClasses, this.ns.bm("pane", "right")]
+    }, [(_f = (_e = this.$slots).right) == null ? void 0 : _f.call(_e)])]) : vue.createVNode("div", {
+      "class": this.ns.m("vertical")
+    }, [vue.createVNode("div", {
+      "style": {
+        bottom: "".concat(this.anotherOffset, "%")
+      },
+      "class": [this.paneClasses, this.ns.bm("pane", "top")]
+    }, [(_h = (_g = this.$slots).top) == null ? void 0 : _h.call(_g)]), vue.createVNode("div", {
+      "style": {
+        top: "".concat(this.offset, "%")
+      },
+      "class": this.ns.b("trigger-con"),
+      "onMousedown": (e) => this.handleMousedown(e)
+    }, [((_j = (_i = this.$slots).trigger) == null ? void 0 : _j.call(_i)) || vue.createVNode(vue.resolveComponent("iBizSplitTrigger"), {
+      "mode": "horizontal"
+    }, null)]), vue.createVNode("div", {
+      "style": {
+        top: "".concat(this.offset, "%")
+      },
+      "class": [this.paneClasses, this.ns.bm("pane", "bottom")]
+    }, [(_l = (_k = this.$slots).bottom) == null ? void 0 : _l.call(_k)])])]);
+  }
+});
+
+exports.IBizNavSplit = IBizNavSplit;

package/lib/common/nav-split/nav-split.css

@@ -0,0 +1 @@
+.ibiz-nav-split-wrapper{position:relative;width:100%;height:100%}.ibiz-nav-split-wrapper.is-no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.ibiz-nav-split--horizontal{display:flex;height:100%}.ibiz-nav-split--horizontal .ibiz-nav-split-trigger-con{top:50%;width:0;height:100%}.ibiz-nav-split--horizontal .ibiz-nav-split-pane{position:unset}.ibiz-nav-split--horizontal .ibiz-nav-split-pane--right{padding-left:6px}.ibiz-nav-split--vertical .ibiz-nav-split-trigger-con{left:50%;width:100%;height:0}.ibiz-nav-split--vertical .ibiz-nav-split-pane{position:absolute}.ibiz-nav-split--vertical .ibiz-nav-split-pane--bottom{padding-top:6px}.ibiz-nav-split-pane{position:absolute}.ibiz-nav-split-pane--left{top:0;bottom:0;left:0;overflow:hidden}.ibiz-nav-split-pane--right{top:0;right:0;bottom:0;overflow:hidden}.ibiz-nav-split-pane--top{top:0;right:0;left:0;overflow:hidden}.ibiz-nav-split-pane--bottom{right:0;bottom:0;left:0;overflow:hidden}.ibiz-nav-split-pane--moving{-webkit-user-select:none;-moz-user-select:none;user-select:none}.ibiz-nav-split-trigger-con{position:absolute;z-index:10;transform:translate(-50%,-50%)}

package/lib/common/pagination/pagination.cjs

@@ -25,6 +25,10 @@ const IBizPagination = /* @__PURE__ */ vue.defineComponent({
     totalPages: {
       type: Number || void 0,
       required: false
+    },
+    popperClass: {
+      type: String,
+      required: false
     }
   },
   emits: ["change", "pageSizeChange", "pageRefresh"],
@@ -48,7 +52,8 @@ const IBizPagination = /* @__PURE__ */ vue.defineComponent({
       emit("pageRefresh");
     };
     const inputChange = (event) => {
-      event.stopPropagation();
+      var _a;
+      (_a = event.stopPropagation) == null ? void 0 : _a.call(event);
     };
     const calcTotalPages = vue.computed(() => {
       return Math.ceil(props.total / props.size);
@@ -74,6 +79,7 @@ const IBizPagination = /* @__PURE__ */ vue.defineComponent({
       "page-count": !ramda.isNil(this.totalPages) && this.calcTotalPages === this.totalPages ? this.calcTotalPages : this.totalPages,
       "current-page": this.curPage,
       "page-size": this.size,
+      "popper-class": this.popperClass,
       "page-sizes": [10, 20, 30, 40, 50, 60, 70, 80, 90, 100]
     }, {
       "onUpdate:currentPage": this.onPageChange,

package/lib/common/pql-editor/pql-editor.module.cjs

@@ -1,9 +1,9 @@
 'use strict';
 
 var editor = require('@wangeditor/editor');
-require('../../node_modules/.pnpm/snabbdom@3.5.1/node_modules/snabbdom/build/index.cjs');
+require('../../node_modules/.pnpm/snabbdom@3.6.2/node_modules/snabbdom/build/index.cjs');
 var index = require('./utils/index.cjs');
-var h = require('../../node_modules/.pnpm/snabbdom@3.5.1/node_modules/snabbdom/build/h.cjs');
+var h = require('../../node_modules/.pnpm/snabbdom@3.6.2/node_modules/snabbdom/build/h.cjs');
 
 "use strict";
 const pqlType = [

package/lib/common/pql-editor/utils/index.cjs

@@ -304,7 +304,7 @@ const pqlItemsToPqlNodes = async (items) => {
       if (!(value == null ? void 0 : value.type)) {
         if ((operator == null ? void 0 : operator.value) && InOPs.includes(operator.value)) {
           if ((value == null ? void 0 : value.value) && /^\(.*?\)$/.test(value.value)) {
-            const valueText = value.value.slice(1, value.value.length - 1).trim();
+            const valueText = value.value.slice(1, -1).trim();
             let splitArr = valueText.split(/\},\s*/g);
             splitArr = splitArr.map(
               (text, i) => i === splitArr.length - 1 ? text : "".concat(text, "}")
@@ -341,7 +341,7 @@ const pqlItemsToPqlNodes = async (items) => {
         if ((operator == null ? void 0 : operator.value) === runtime.ValueOP.LIKE) {
           if ((value == null ? void 0 : value.value) && value.value.startsWith("'%") && value.value.endsWith("%'")) {
             nodes.push({
-              text: value.value.slice(2, value.value.length - 2)
+              text: value.value.slice(2, -2)
             });
             return;
           }

package/lib/common/split/split.cjs

@@ -144,7 +144,7 @@ const IBizSplit = /* @__PURE__ */ vue.defineComponent({
       "class": this.ns.m("horizontal")
     }, [vue.createVNode("div", {
       "style": {
-        right: "".concat(this.anotherOffset, "%")
+        width: "".concat(this.offset, "%")
       },
       "class": [this.paneClasses, this.ns.bm("pane", "left")]
     }, [(_b = (_a = this.$slots).left) == null ? void 0 : _b.call(_a)]), vue.createVNode("div", {
@@ -157,7 +157,7 @@ const IBizSplit = /* @__PURE__ */ vue.defineComponent({
       "mode": "vertical"
     }, null)]), vue.createVNode("div", {
       "style": {
-        left: "".concat(this.offset, "%")
+        width: "".concat(this.anotherOffset, "%")
       },
       "class": [this.paneClasses, this.ns.bm("pane", "right")]
     }, [(_f = (_e = this.$slots).right) == null ? void 0 : _f.call(_e)])]) : vue.createVNode("div", {

package/lib/common/split/split.css

@@ -1 +1 @@
-.ibiz-split-wrapper{position:relative;width:100%;height:100%}.ibiz-split-wrapper.is-no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.ibiz-split--horizontal .ibiz-split-trigger-con{top:50%;width:0;height:100%}.ibiz-split--horizontal .ibiz-split-pane--right{padding-left:6px}.ibiz-split--vertical .ibiz-split-trigger-con{left:50%;width:100%;height:0}.ibiz-split--vertical .ibiz-split-pane--bottom{padding-top:6px}.ibiz-split-pane{position:absolute}.ibiz-split-pane--left{top:0;bottom:0;left:0;overflow:hidden}.ibiz-split-pane--right{top:0;right:0;bottom:0;overflow:hidden}.ibiz-split-pane--top{top:0;right:0;left:0;overflow:hidden}.ibiz-split-pane--bottom{right:0;bottom:0;left:0;overflow:hidden}.ibiz-split-pane--moving{-webkit-user-select:none;-moz-user-select:none;user-select:none}.ibiz-split-trigger-con{position:absolute;z-index:10;transform:translate(-50%,-50%)}
+.ibiz-split-wrapper{position:relative;width:100%;height:100%}.ibiz-split-wrapper.is-no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.ibiz-split--horizontal{display:flex;height:100%}.ibiz-split--horizontal .ibiz-split-trigger-con{top:50%;width:0;height:100%}.ibiz-split--horizontal .ibiz-split-pane{position:unset}.ibiz-split--horizontal .ibiz-split-pane--right{padding-left:6px}.ibiz-split--vertical .ibiz-split-trigger-con{left:50%;width:100%;height:0}.ibiz-split--vertical .ibiz-split-pane{position:absolute}.ibiz-split--vertical .ibiz-split-pane--bottom{padding-top:6px}.ibiz-split-pane{position:absolute}.ibiz-split-pane--left{top:0;bottom:0;left:0;overflow:hidden}.ibiz-split-pane--right{top:0;right:0;bottom:0;overflow:hidden}.ibiz-split-pane--top{top:0;right:0;left:0;overflow:hidden}.ibiz-split-pane--bottom{right:0;bottom:0;left:0;overflow:hidden}.ibiz-split-pane--moving{-webkit-user-select:none;-moz-user-select:none;user-select:none}.ibiz-split-trigger-con{position:absolute;z-index:10;transform:translate(-50%,-50%)}