@ibiz-template/vue3-components 0.7.41-alpha.2 → 0.7.41-alpha.21

package/es/control/tree-grid/tree-grid.mjs

@@ -1,5 +1,6 @@
-import { isVNode, resolveComponent, createVNode, createTextVNode, renderSlot, defineComponent } from 'vue';
-import { useControlController, useNamespace, hasEmptyPanelRenderer, IBizCustomRender } from '@ibiz-template/vue3-util';
+import { isVNode, resolveComponent, createVNode, nextTick, watch, createTextVNode, renderSlot, mergeProps, defineComponent } from 'vue';
+import { useControlController, useControlPopoverzIndex, useNamespace, hasEmptyPanelRenderer, IBizCustomRender } from '@ibiz-template/vue3-util';
+import { recursiveIterate } from '@ibiz-template/core';
 import { TreeGridController } from '@ibiz-template/runtime';
 import { useRowEditPopover } from '../grid/row-edit-popover/use-row-edit-popover.mjs';
 import '../grid/grid/index.mjs';
@@ -89,15 +90,17 @@ const TreeGridControl = /* @__PURE__ */ defineComponent({
     slots
   }) {
     const c = useControlController((...args) => new TreeGridController(...args));
+    useControlPopoverzIndex(c);
     const ns = useNamespace("control-grid");
     const ns2 = useNamespace("control-".concat(c.model.controlType.toLowerCase()));
     const {
       tableRef,
       onRowClick,
       onDbRowClick,
-      onSelectionChange,
       onSortChange,
-      handleRowClassName
+      onSelectionChange,
+      handleRowClassName,
+      handleHeaderCellClassName
     } = useITableEvent(c);
     const {
       onPageChange,
@@ -106,11 +109,11 @@ const TreeGridControl = /* @__PURE__ */ defineComponent({
     } = useAppGridPagination(c);
     const {
       tableData,
-      renderColumns,
       defaultSort,
+      renderColumns,
       summaryMethod,
       headerDragend
-    } = useAppGridBase(c, props);
+    } = useAppGridBase(c, props, tableRef);
     const {
       renderPopover
     } = useRowEditPopover(tableRef, c);
@@ -149,11 +152,56 @@ const TreeGridControl = /* @__PURE__ */ defineComponent({
       }
       return null;
     };
+    const handleDefaultSelect = () => {
+      const {
+        expandRowKeys,
+        selectedData,
+        singleSelect
+      } = c.state;
+      const table = tableRef.value;
+      if (!table || !selectedData.length)
+        return;
+      const treeData = table.store.states.treeData.value;
+      const expandKeys = Object.keys(treeData).filter((key) => treeData[key].loaded);
+      if (expandRowKeys.length === expandKeys.length && expandRowKeys.sort().every((item, index) => item === expandKeys.sort()[index])) {
+        const selection = [];
+        const selectKeys = selectedData.map((selected) => selected.srfkey);
+        recursiveIterate({
+          children: table.store.states.data.value
+        }, (item) => {
+          if (selectKeys.includes(item.srfkey))
+            selection.push(item);
+        });
+        nextTick(() => {
+          if (singleSelect) {
+            table.setCurrentRow(selection[0]);
+          } else {
+            table.store.states.selection.value = selection;
+          }
+        });
+      }
+    };
+    const handleDefaultExpand = (nodes) => {
+      if (!tableRef.value || !c.state.expandRowKeys.length)
+        return;
+      c.state.expandRowKeys.forEach((key) => {
+        const node = nodes.find((item) => item.srfkey === key);
+        if (node)
+          nextTick(() => {
+            tableRef.value.store.loadOrToggle(node);
+          });
+      });
+      handleDefaultSelect();
+    };
+    watch(() => tableRef.value, () => {
+      handleDefaultExpand(c.state.treeGirdData);
+    });
     const loadData = async (item, _row, callback) => {
       const treeGirdItems = c.state.items.map((data) => c.getTreeGridDataItem(data));
       const items = treeGirdItems.filter((data) => item[c.treeGridValueField] === data[c.treeGridParentField]);
       item.children = items;
       callback(items);
+      handleDefaultExpand(items);
     };
     const renderBatchToolBar = () => {
       var _a;
@@ -195,24 +243,25 @@ const TreeGridControl = /* @__PURE__ */ defineComponent({
       ns2,
       tableRef,
       tableData,
+      defaultSort,
       renderColumns,
+      headerCssVars,
+      loadData,
+      onRowClick,
       renderColumn,
-      defaultSort,
       onDbRowClick,
-      onRowClick,
-      onSelectionChange,
       onSortChange,
       onPageChange,
-      onPageSizeChange,
-      onPageRefresh,
-      handleRowClassName,
       renderNoData,
-      loadData,
+      onPageRefresh,
       summaryMethod,
       headerDragend,
       renderPopover,
+      onPageSizeChange,
+      onSelectionChange,
+      handleRowClassName,
       renderBatchToolBar,
-      headerCssVars
+      handleHeaderCellClassName
     };
   },
   render() {
@@ -221,63 +270,75 @@ const TreeGridControl = /* @__PURE__ */ defineComponent({
       hideHeader,
       enablePagingBar
     } = this.c.model;
-    return createVNode(resolveComponent("iBizControlBase"), {
-      "class": [this.ns.b(), this.ns2.b(), this.ns.is("show-header", !hideHeader), this.ns.is("enable-page", enablePagingBar), this.ns.is("enable-group", this.c.model.enableGroup), this.ns.is("enable-customized", this.c.model.enableCustomized)],
-      "controller": this.c,
-      "style": this.headerCssVars
+    return createVNode(resolveComponent("iBizControlNavigation"), {
+      "controller": this.c
     }, {
-      default: () => [this.c.state.isLoaded && createVNode(resolveComponent("el-table"), {
-        "ref": "tableRef",
-        "class": this.ns.e("table"),
-        "default-sort": this.defaultSort,
-        "border": true,
-        "show-header": !hideHeader,
-        "show-summary": this.c.enableAgg,
-        "summary-method": this.summaryMethod,
-        "highlight-current-row": state.singleSelect,
-        "row-class-name": this.handleRowClassName,
-        "row-key": "srfkey",
-        "data": this.c.state.showTreeGrid ? state.treeGirdData : this.tableData,
-        "onRowClick": this.onRowClick,
-        "onRowDblclick": this.onDbRowClick,
-        "onSelectionChange": this.onSelectionChange,
-        "onSortChange": this.onSortChange,
-        "onHeaderDragend": this.headerDragend,
-        "tooltip-effect": "light",
-        "tree-props": {
-          children: "children",
-          hasChildren: "hasChildren"
-        },
-        "load": this.loadData,
-        "lazy": true
+      default: () => [createVNode(resolveComponent("iBizControlBase"), {
+        "class": [this.ns.b(), this.ns2.b(), this.ns.is("show-header", !hideHeader), this.ns.is("enable-page", enablePagingBar), this.ns.is("enable-group", this.c.model.enableGroup), this.ns.is("enable-customized", this.c.model.enableCustomized)],
+        "controller": this.c,
+        "style": this.headerCssVars
       }, {
-        empty: this.renderNoData,
         default: () => {
-          return [!state.singleSelect && createVNode(resolveComponent("el-table-column"), {
-            "class-name": this.ns.e("selection"),
-            "type": "selection",
-            "width": "55"
-          }, null), state.isCreated && this.renderColumns.map((model, index) => {
-            return this.renderColumn(model, index);
-          })];
-        },
-        append: () => {
-          return this.renderPopover();
+          var _a;
+          return [this.c.state.isLoaded && createVNode(resolveComponent("el-table"), mergeProps({
+            "lazy": true,
+            "border": true,
+            "ref": "tableRef",
+            "row-key": "srfkey",
+            "load": this.loadData,
+            "tooltip-effect": "light",
+            "show-header": !hideHeader,
+            "class": this.ns.e("table"),
+            "key": this.c.state.tableKey,
+            "onRowClick": this.onRowClick,
+            "default-sort": this.defaultSort,
+            "show-summary": this.c.enableAgg,
+            "onSortChange": this.onSortChange,
+            "onRowDblclick": this.onDbRowClick,
+            "summary-method": this.summaryMethod,
+            "onHeaderDragend": this.headerDragend,
+            "row-class-name": this.handleRowClassName,
+            "onSelectionChange": this.onSelectionChange,
+            "highlight-current-row": state.singleSelect,
+            "onExpandChange": (row, expanded) => this.c.expandChange(row, expanded),
+            "header-cell-class-name": this.handleHeaderCellClassName,
+            "tree-props": {
+              children: "children",
+              hasChildren: "hasChildren"
+            },
+            "data": this.c.state.showTreeGrid ? state.treeGirdData : this.tableData
+          }, this.$attrs), {
+            empty: this.renderNoData,
+            default: () => {
+              return [!state.singleSelect && createVNode(resolveComponent("el-table-column"), {
+                "width": "55",
+                "type": "selection",
+                "reserve-selection": true,
+                "class-name": this.ns.e("selection")
+              }, null), state.isCreated && this.renderColumns.map((model, index) => {
+                return this.renderColumn(model, index);
+              })];
+            },
+            append: () => {
+              return this.renderPopover();
+            }
+          }), enablePagingBar && createVNode(resolveComponent("iBizPagination"), {
+            "total": state.total,
+            "curPage": state.curPage,
+            "size": state.size,
+            "totalPages": state.totalPages,
+            "onChange": this.onPageChange,
+            "onPageSizeChange": this.onPageSizeChange,
+            "onPageRefresh": this.onPageRefresh,
+            "popperClass": "".concat(((_a = this.c.model.sysCss) == null ? void 0 : _a.cssName) || "default", "--popper")
+          }, null), this.c.model.enableCustomized && !hideHeader && createVNode("div", {
+            "class": this.ns.b("setting-box")
+          }, [createVNode(resolveComponent("iBizGridSetting"), {
+            "columnStates": state.columnStates,
+            "controller": this.c
+          }, null)]), this.renderBatchToolBar()];
         }
-      }), enablePagingBar && createVNode(resolveComponent("iBizPagination"), {
-        "total": state.total,
-        "curPage": state.curPage,
-        "size": state.size,
-        "totalPages": state.totalPages,
-        "onChange": this.onPageChange,
-        "onPageSizeChange": this.onPageSizeChange,
-        "onPageRefresh": this.onPageRefresh
-      }, null), this.c.model.enableCustomized && !hideHeader && createVNode("div", {
-        "class": this.ns.b("setting-box")
-      }, [createVNode(resolveComponent("iBizGridSetting"), {
-        "columnStates": state.columnStates,
-        "controller": this.c
-      }, null)]), this.renderBatchToolBar()]
+      })]
     });
   }
 });

package/es/control/tree-grid-ex/tree-grid-ex-column/tree-grid-ex-edit-column/all-edit.mjs

@@ -20,7 +20,9 @@ function useAllEdit(props, _componentRef) {
     return editable.value;
   });
   const onBlur = () => {
-    c.treeGrid.save(props.row.data);
+    if (c.treeGrid.editSaveMode === "cell-blur") {
+      c.treeGrid.save(props.row.data);
+    }
   };
   const gridEditItemProps = reactive({
     stopPropagation

package/es/control/tree-grid-ex/tree-grid-ex-column/tree-grid-ex-field-column/index.d.ts

@@ -9,14 +9,15 @@ export declare const IBizTreeGridExFieldColumn: import("@ibiz-template/vue3-util
     };
 }, {
     ns: import("@ibiz-template/core").Namespace;
-    nodeColumn: import("vue").ComputedRef<import("@ibiz-template/runtime").TreeGridExNodeColumnController | undefined>;
-    fieldValue: import("vue").ComputedRef<any>;
+    zIndex: number | undefined;
+    tooltip: import("vue").ComputedRef<any>;
     showText: import("vue").ComputedRef<any>;
     clickable: import("vue").ComputedRef<any>;
-    tooltip: import("vue").ComputedRef<any>;
-    onInfoTextChange: (text: string) => void;
+    nodeColumn: import("vue").ComputedRef<import("@ibiz-template/runtime").TreeGridExNodeColumnController | undefined>;
+    fieldValue: import("vue").ComputedRef<any>;
     onTextClick: (event: MouseEvent) => void;
     onActionClick: (detail: import("@ibiz/model-core").IUIActionGroupDetail, event: MouseEvent) => Promise<void>;
+    onInfoTextChange: (text: string) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     controller: {
         type: typeof import("@ibiz-template/runtime").TreeGridExFieldColumnController;

package/es/control/tree-grid-ex/tree-grid-ex-column/tree-grid-ex-field-column/tree-grid-ex-field-column.d.ts

@@ -12,14 +12,15 @@ export declare const TreeGridExFieldColumn: import("vue").DefineComponent<{
     };
 }, {
     ns: import("@ibiz-template/core").Namespace;
-    nodeColumn: import("vue").ComputedRef<import("@ibiz-template/runtime").TreeGridExNodeColumnController | undefined>;
-    fieldValue: import("vue").ComputedRef<any>;
+    zIndex: number | undefined;
+    tooltip: import("vue").ComputedRef<any>;
     showText: import("vue").ComputedRef<any>;
     clickable: import("vue").ComputedRef<any>;
-    tooltip: import("vue").ComputedRef<any>;
-    onInfoTextChange: (text: string) => void;
+    nodeColumn: import("vue").ComputedRef<import("@ibiz-template/runtime").TreeGridExNodeColumnController | undefined>;
+    fieldValue: import("vue").ComputedRef<any>;
     onTextClick: (event: MouseEvent) => void;
     onActionClick: (detail: IUIActionGroupDetail, event: MouseEvent) => Promise<void>;
+    onInfoTextChange: (text: string) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     controller: {
         type: typeof TreeGridExFieldColumnController;

package/es/control/tree-grid-ex/tree-grid-ex-column/tree-grid-ex-field-column/tree-grid-ex-field-column.mjs

@@ -20,6 +20,7 @@ const TreeGridExFieldColumn = /* @__PURE__ */ defineComponent({
   },
   setup(props) {
     const ns = useNamespace("tree-grid-ex-field-column");
+    const zIndex = props.controller.treeGrid.state.zIndex;
     const fieldValue = computed(() => {
       if (props.row.data._nodeType !== "DE" && props.controller.isFirstShowColumn) {
         return props.row.data._text;
@@ -74,14 +75,15 @@ const TreeGridExFieldColumn = /* @__PURE__ */ defineComponent({
     };
     return {
       ns,
-      nodeColumn,
-      fieldValue,
+      zIndex,
+      tooltip,
       showText,
       clickable,
-      tooltip,
-      onInfoTextChange,
+      nodeColumn,
+      fieldValue,
       onTextClick,
-      onActionClick
+      onActionClick,
+      onInfoTextChange
     };
   },
   render() {
@@ -114,6 +116,7 @@ const TreeGridExFieldColumn = /* @__PURE__ */ defineComponent({
       actions = this.$slots.actions();
     } else if (this.row.columnActionsStates[this.controller.name]) {
       actions = createVNode(resolveComponent("iBizActionToolbar"), {
+        "zIndex": this.zIndex,
         "class": this.ns.e("toolbar"),
         "action-details": (_c = this.nodeColumn) == null ? void 0 : _c.nodeColumn.deuiactionGroup.uiactionGroupDetails,
         "actions-state": this.row.columnActionsStates[this.controller.name],

package/es/control/tree-grid-ex/tree-grid-ex-column/tree-grid-ex-ua-column/tree-grid-ex-ua-column.css

@@ -1 +1 @@
-.ibiz-tree-grid-ex-ua-column{--ibiz-tree-grid-ex-ua-column-cell-padding:var(--ibiz-spacing-tight);--ibiz-tree-grid-ex-ua-column-btn-bg-color:transparent;--ibiz-tree-grid-ex-ua-column-btn-hover-color:var(--ibiz-color-primary-hover);--ibiz-tree-grid-ex-ua-column-btn-color:var(--ibiz-color-primary);--ibiz-tree-grid-ex-ua-column-font-size:var(--ibiz-font-size-regular);--ibiz-tree-grid-ex-ua-column-font-weight:var(--ibiz-font-weight-regular);display:flex;align-items:center;justify-content:var(--ibiz-tree-grid-ex-column-text-align);width:100%;height:100%;padding:var(--ibiz-tree-grid-ex-ua-column-cell-padding)}.ibiz-tree-grid-ex-ua-column .el-button{font-size:var(--ibiz-tree-grid-ex-ua-column-font-size);font-weight:var(--ibiz-tree-grid-ex-ua-column-font-weight);color:var(--ibiz-tree-grid-ex-ua-column-btn-color);background-color:var(--ibiz-tree-grid-ex-ua-column-btn-bg-color);box-shadow:none}.ibiz-tree-grid-ex-ua-column .el-button:hover{color:var(--ibiz-tree-grid-ex-ua-column-btn-hover-color)}.ibiz-tree-grid-ex-ua-column .el-button.is-text:not(.is-disabled):hover{background-color:var(--ibiz-tree-grid-ex-ua-column-btn-bg-color)}
+.ibiz-tree-grid-ex-ua-column{--ibiz-tree-grid-ex-ua-column-cell-padding:var(--ibiz-spacing-tight);--ibiz-tree-grid-ex-ua-column-btn-bg-color:transparent;--ibiz-tree-grid-ex-ua-column-btn-hover-color:var(--ibiz-color-primary-hover);--ibiz-tree-grid-ex-ua-column-btn-color:var(--ibiz-color-primary);--ibiz-tree-grid-ex-ua-column-font-size:var(--ibiz-font-size-regular);--ibiz-tree-grid-ex-ua-column-font-weight:var(--ibiz-font-weight-regular);display:flex;align-items:center;justify-content:var(--ibiz-grid-column-text-align);width:100%;height:100%;padding:var(--ibiz-tree-grid-ex-ua-column-cell-padding)}.ibiz-tree-grid-ex-ua-column .el-button{font-size:var(--ibiz-tree-grid-ex-ua-column-font-size);font-weight:var(--ibiz-tree-grid-ex-ua-column-font-weight);color:var(--ibiz-tree-grid-ex-ua-column-btn-color);background-color:var(--ibiz-tree-grid-ex-ua-column-btn-bg-color);box-shadow:none}.ibiz-tree-grid-ex-ua-column .el-button:hover{color:var(--ibiz-tree-grid-ex-ua-column-btn-hover-color)}.ibiz-tree-grid-ex-ua-column .el-button.is-text:not(.is-disabled):hover{background-color:var(--ibiz-tree-grid-ex-ua-column-btn-bg-color)}

package/es/control/tree-grid-ex/tree-grid-ex.css

@@ -1 +1 @@
-.ibiz-control-treegridex{--ibiz-control-treegridex-text-color:var(--ibiz-color-text-0);--ibiz-control-treegridex-bg-color:transparent;--ibiz-control-treegridex-padding:var(--ibiz-spacing-none);--ibiz-control-treegridex-cell-padding:var(--ibiz-spacing-tight);--ibiz-control-treegridex-selection-padding:var(--ibiz-spacing-base-loose);--ibiz-control-treegridex-row-edit-bg-color:var(--ibiz-color-fill-2);--ibiz-control-treegridex-row-bg-color:var(--ibiz-color-bg-1);--ibiz-control-treegridex-row-bg-color-2:var(--ibiz-color-bg-0);--ibiz-control-treegridex-row-expand-icon-margin:var(--ibiz-spacing-none) var(--ibiz-spacing-none) var(--ibiz-spacing-none) var(--ibiz-spacing-tight);--ibiz-control-treegridex-header-text-color:var(--ibiz-color-text-2);--ibiz-control-treegridex-header-cell-padding:var(--ibiz-control-treegridex-cell-padding);--ibiz-control-treegridex-header-height:auto;--ibiz-control-treegridex-header-bg-color:rgba(var(--ibiz-grey-1), 1);--ibiz-control-treegridex-header-font-size:var(--ibiz-font-size-regular);--ibiz-control-treegridex-header-font-weight:var(--ibiz-font-weight-regular);--ibiz-control-treegridex-content-text-color:var(--ibiz-control-treegridex-text-color);--ibiz-control-treegridex-content-row-height:48px;--ibiz-control-treegridex-footer-text-color:var(--ibiz-color-text-2);--ibiz-control-treegridex-footer-bg-color:rgba(var(--ibiz-grey-1), 1);--ibiz-control-treegridex-footer-font-size:var(--ibiz-font-size-regular);--ibiz-control-treegridex-footer-font-weight:var(--ibiz-font-weight-bold);--ibiz-control-grid-row-edit-bg-color:var(--ibiz-control-treegridex-row-edit-bg-color);width:100%;height:100%;padding:var(--ibiz-control-treegridex-padding);background-color:var(--ibiz-control-treegridex-bg-color)}.ibiz-control-treegridex .el-table{--el-table-header-bg-color:var(--ibiz-control-treegridex-header-bg-color);--el-table-border-color:transparent}.ibiz-control-treegridex .el-table--border .el-table__cell{border-right:none}.ibiz-control-treegridex .el-table-fixed-column--left,.ibiz-control-treegridex .el-table-fixed-column--right{--el-bg-color:transparent}.ibiz-control-treegridex .el-table td.el-table__cell,.ibiz-control-treegridex .el-table th.el-table__cell.is-leaf{border-bottom:none}.ibiz-control-treegridex__table{width:100%;height:100%}.ibiz-control-treegridex__table .caret-wrapper{justify-content:center}.ibiz-control-treegridex__table .caret-wrapper>*+*{margin-top:var(--ibiz-spacing-super-tight)}.ibiz-control-treegridex__table .sort-caret{position:initial}.ibiz-control-treegridex__table.el-table .el-table__cell{padding:var(--ibiz-spacing-none)}.ibiz-control-treegridex__table.el-table .el-table__body-wrapper tr td{background:var(--ibiz-control-treegridex-row-bg-color)}.ibiz-control-treegridex__table.el-table .el-table__body-wrapper tr:nth-child(2n) td{background-color:var(--ibiz-control-treegridex-row-bg-color-2)}.ibiz-control-treegridex__table.el-table .el-table__body-wrapper tr:hover td{background-color:var(--el-table-row-hover-bg-color)}.ibiz-control-treegridex__table.el-table .el-table__body-wrapper tr.current-row td{background-color:var(--el-table-current-row-bg-color)}.ibiz-control-treegridex__table .el-table__header-wrapper .cell{height:var(--ibiz-control-treegridex-header-height);padding:var(--ibiz-control-treegridex-header-cell-padding);font-size:var(--ibiz-control-treegridex-header-font-size);font-weight:var(--ibiz-control-treegridex-header-font-weight);color:var(--ibiz-control-treegridex-header-text-color);word-break:break-word;white-space:pre-wrap}.ibiz-control-treegridex__table .el-table__header-wrapper .el-table-column--selection .cell{padding:var(--ibiz-control-treegridex-selection-padding)}.ibiz-control-treegridex__table .el-table__header-wrapper .is-sortable.el-table__cell .cell{display:flex;align-items:center;justify-content:var(--ibiz-grid-column-justify-content)}.ibiz-control-treegridex__table .el-table__body-wrapper{color:var(--ibiz-control-treegridex-content-text-color);border-bottom:.1px solid var(--ibiz-color-border)}.ibiz-control-treegridex__table .el-table__body-wrapper .el-table__row{height:var(--ibiz-control-treegridex-content-row-height);cursor:pointer}.ibiz-control-treegridex__table .el-table__body-wrapper .el-table__row>td{height:0;padding:var(--ibiz-spacing-none)}.ibiz-control-treegridex__table .el-table__body-wrapper .el-table__row .el-table__expand-icon{margin:var(--ibiz-control-treegridex-row-expand-icon-margin)}@-moz-document url-prefix(){.ibiz-control-treegridex__table .el-table__body-wrapper .el-table__row>td{height:100%}}.ibiz-control-treegridex__table .el-table__body-wrapper .cell{display:flex;align-items:center;height:100%;padding:var(--ibiz-spacing-none)}.ibiz-control-treegridex__table .el-table__body-wrapper .el-table-column--selection .cell{padding:var(--ibiz-control-treegridex-selection-padding)}.ibiz-control-treegridex__table .el-table__cell.is-center{--ibiz-grid-column-text-align:center;--ibiz-grid-column-justify-content:center}.ibiz-control-treegridex__table .el-table__cell.is-left{--ibiz-grid-column-text-align:left;--ibiz-grid-column-justify-content:flex-start}.ibiz-control-treegridex__table .el-table__cell.is-right{--ibiz-grid-column-text-align:right;--ibiz-grid-column-justify-content:flex-end}.ibiz-control-treegridex__table .el-scrollbar__wrap{position:relative}
+.ibiz-control-treegridex{--ibiz-control-treegridex-text-color:var(--ibiz-color-text-0);--ibiz-control-treegridex-bg-color:transparent;--ibiz-control-treegridex-padding:var(--ibiz-spacing-none);--ibiz-control-treegridex-cell-padding:var(--ibiz-spacing-tight);--ibiz-control-treegridex-selection-padding:var(--ibiz-spacing-base-loose);--ibiz-control-treegridex-row-edit-bg-color:var(--ibiz-color-fill-2);--ibiz-control-treegridex-row-bg-color:var(--ibiz-color-bg-1);--ibiz-control-treegridex-row-bg-color-2:var(--ibiz-color-bg-0);--ibiz-control-treegridex-row-expand-icon-margin:var(--ibiz-spacing-none) var(--ibiz-spacing-none) var(--ibiz-spacing-none) var(--ibiz-spacing-tight);--ibiz-control-treegridex-header-text-color:var(--ibiz-color-text-2);--ibiz-control-treegridex-header-cell-padding:var(--ibiz-control-treegridex-cell-padding);--ibiz-control-treegridex-header-height:auto;--ibiz-control-treegridex-header-bg-color:rgba(var(--ibiz-grey-1), 1);--ibiz-control-treegridex-header-font-size:var(--ibiz-font-size-regular);--ibiz-control-treegridex-header-font-weight:var(--ibiz-font-weight-regular);--ibiz-control-treegridex-content-text-color:var(--ibiz-control-treegridex-text-color);--ibiz-control-treegridex-content-row-height:48px;--ibiz-control-treegridex-footer-text-color:var(--ibiz-color-text-2);--ibiz-control-treegridex-footer-bg-color:rgba(var(--ibiz-grey-1), 1);--ibiz-control-treegridex-footer-font-size:var(--ibiz-font-size-regular);--ibiz-control-treegridex-footer-font-weight:var(--ibiz-font-weight-bold);--ibiz-control-grid-row-edit-bg-color:var(--ibiz-control-treegridex-row-edit-bg-color);width:100%;height:100%;padding:var(--ibiz-control-treegridex-padding);background-color:var(--ibiz-control-treegridex-bg-color)}.ibiz-control-treegridex .el-table{--el-table-header-bg-color:var(--ibiz-control-treegridex-header-bg-color);--el-table-border-color:transparent}.ibiz-control-treegridex .el-table--border .el-table__cell{border-right:none}.ibiz-control-treegridex .el-table-fixed-column--left,.ibiz-control-treegridex .el-table-fixed-column--right{--el-bg-color:transparent}.ibiz-control-treegridex .el-table td.el-table__cell,.ibiz-control-treegridex .el-table th.el-table__cell.is-leaf{border-bottom:none}.ibiz-control-treegridex__table{width:100%;height:100%}.ibiz-control-treegridex__table .caret-wrapper{justify-content:center}.ibiz-control-treegridex__table .caret-wrapper>*+*{margin-top:var(--ibiz-spacing-super-tight)}.ibiz-control-treegridex__table .sort-caret{position:initial}.ibiz-control-treegridex__table.el-table .el-table__cell{padding:var(--ibiz-spacing-none)}.ibiz-control-treegridex__table.el-table .el-table__body-wrapper tr td{background:var(--ibiz-control-treegridex-row-bg-color)}.ibiz-control-treegridex__table.el-table .el-table__body-wrapper tr:nth-child(2n) td{background-color:var(--ibiz-control-treegridex-row-bg-color-2)}.ibiz-control-treegridex__table.el-table .el-table__body-wrapper tr:hover td{background-color:var(--el-table-row-hover-bg-color)}.ibiz-control-treegridex__table.el-table .el-table__body-wrapper tr.current-row td{background-color:var(--el-table-current-row-bg-color)}.ibiz-control-treegridex__table .el-table__header-wrapper .cell{height:var(--ibiz-control-treegridex-header-height);padding:var(--ibiz-control-treegridex-header-cell-padding);font-size:var(--ibiz-control-treegridex-header-font-size);font-weight:var(--ibiz-control-treegridex-header-font-weight);color:var(--ibiz-control-treegridex-header-text-color);word-break:break-word;white-space:pre-wrap}.ibiz-control-treegridex__table .el-table__header-wrapper .el-table-column--selection .cell{padding:var(--ibiz-control-treegridex-selection-padding)}.ibiz-control-treegridex__table .el-table__header-wrapper .el-table__cell .cell{display:flex;align-items:center;justify-content:var(--ibiz-grid-column-justify-content)}.ibiz-control-treegridex__table .el-table__body-wrapper{color:var(--ibiz-control-treegridex-content-text-color);border-bottom:.1px solid var(--ibiz-color-border)}.ibiz-control-treegridex__table .el-table__body-wrapper .el-table__row{height:var(--ibiz-control-treegridex-content-row-height);cursor:pointer}.ibiz-control-treegridex__table .el-table__body-wrapper .el-table__row>td{height:0;padding:var(--ibiz-spacing-none)}.ibiz-control-treegridex__table .el-table__body-wrapper .el-table__row .el-table__expand-icon{margin:var(--ibiz-control-treegridex-row-expand-icon-margin)}@-moz-document url-prefix(){.ibiz-control-treegridex__table .el-table__body-wrapper .el-table__row>td{height:100%}}.ibiz-control-treegridex__table .el-table__body-wrapper .cell{display:flex;align-items:center;height:100%;padding:var(--ibiz-spacing-none)}.ibiz-control-treegridex__table .el-table__body-wrapper .el-table-column--selection .cell{padding:var(--ibiz-control-treegridex-selection-padding)}.ibiz-control-treegridex__table .el-table__cell.is-center{--ibiz-grid-column-text-align:center;--ibiz-grid-column-justify-content:center}.ibiz-control-treegridex__table .el-table__cell.is-left{--ibiz-grid-column-text-align:left;--ibiz-grid-column-justify-content:flex-start}.ibiz-control-treegridex__table .el-table__cell.is-right{--ibiz-grid-column-text-align:right;--ibiz-grid-column-justify-content:flex-end}.ibiz-control-treegridex__table .el-scrollbar__wrap{position:relative}

package/es/control/tree-grid-ex/tree-grid-ex.d.ts

@@ -1,4 +1,4 @@
-import { PropType, VNode } from 'vue';
+import { VNode, PropType } from 'vue';
 import { IDETreeColumn } from '@ibiz/model-core';
 import { IControlProvider, TreeGridExController } from '@ibiz-template/runtime';
 import './tree-grid-ex.scss';

package/es/control/tree-grid-ex/tree-grid-ex.mjs

@@ -1,10 +1,10 @@
 import { isVNode, createVNode, resolveComponent, computed, ref, watchEffect, renderSlot, mergeProps, h, defineComponent } from 'vue';
-import { useControlController, useNamespace, hasEmptyPanelRenderer, IBizCustomRender } from '@ibiz-template/vue3-util';
+import { useControlController, useControlPopoverzIndex, useNamespace, hasEmptyPanelRenderer, IBizCustomRender } from '@ibiz-template/vue3-util';
 import { TreeGridExController } from '@ibiz-template/runtime';
-import './tree-grid-ex.css';
 import { RuntimeError } from '@ibiz-template/core';
 import { createUUID } from 'qx-util';
 import { useRowEditPopover } from './use-row-edit-popover.mjs';
+import './tree-grid-ex.css';
 
 "use strict";
 function _isSlot(s) {
@@ -44,6 +44,7 @@ const TreeGridExControl = /* @__PURE__ */ defineComponent({
   },
   setup() {
     const c = useControlController((...args) => new TreeGridExController(...args));
+    useControlPopoverzIndex(c);
     const ns = useNamespace("control-".concat(c.model.controlType.toLowerCase()));
     const renderNoData = () => {
       const {
@@ -252,36 +253,40 @@ const TreeGridExControl = /* @__PURE__ */ defineComponent({
         }
       });
     };
-    return createVNode(resolveComponent("iBizControlBase"), {
-      "controller": this.c,
-      "class": [this.ns.b()]
+    return createVNode(resolveComponent("iBizControlNavigation"), {
+      "controller": this.c
     }, {
-      default: () => [this.c.state.isLoaded && createVNode(resolveComponent("el-table"), {
-        "ref": "tableRef",
-        "key": this.tableRefreshKey,
-        "class": this.ns.e("table"),
-        "border": true,
-        "row-key": "id",
-        "data": this.elTableData,
-        "tree-props": {
-          children: "children",
-          hasChildren: "hasChildren"
-        },
-        "lazy": true,
-        "onRowClick": this.onRowClick,
-        "onExpandChange": this.onExpandChange,
-        "row-class-name": this.handleRowClassName,
-        "load": this.loadData
+      default: () => [createVNode(resolveComponent("iBizControlBase"), {
+        "controller": this.c,
+        "class": [this.ns.b()]
       }, {
-        empty: this.renderNoData,
-        default: () => {
-          return [this.renderColumns.map((model, index) => {
-            return renderColumn(model, index);
-          })];
-        },
-        append: () => {
-          return this.renderPopover();
-        }
+        default: () => [this.c.state.isLoaded && createVNode(resolveComponent("el-table"), {
+          "ref": "tableRef",
+          "key": this.tableRefreshKey,
+          "class": this.ns.e("table"),
+          "border": true,
+          "row-key": "id",
+          "data": this.elTableData,
+          "tree-props": {
+            children: "children",
+            hasChildren: "hasChildren"
+          },
+          "lazy": true,
+          "onRowClick": this.onRowClick,
+          "onExpandChange": this.onExpandChange,
+          "row-class-name": this.handleRowClassName,
+          "load": this.loadData
+        }, {
+          empty: this.renderNoData,
+          default: () => {
+            return [this.renderColumns.map((model, index) => {
+              return renderColumn(model, index);
+            })];
+          },
+          append: () => {
+            return this.renderPopover();
+          }
+        })]
       })]
     });
   }

package/es/control/tree-grid-ex/use-row-edit-popover.mjs

@@ -16,7 +16,7 @@ function useRowEditPopover(tableRef, c) {
     const tableEl = tableRef.value.$el;
     let selector = ".el-table__row";
     if (row.data._uuid) {
-      selector += ".id-".concat(row.data._uuid);
+      selector += '[class*="id-'.concat(row.data._uuid, '"]');
     }
     const trEl = tableEl.querySelector(selector);
     if (!trEl) {

package/es/control/wizard-panel/wizard-panel.css

@@ -1 +1 @@
-@charset "UTF-8";.ibiz-control-wizardpanel{--ibiz-control-wizard-panel-header-height:60px;--ibiz-control-wizard-panel-footer-height:40px;height:100%}.ibiz-control-wizardpanel .ibiz-control-wizardpanel__form{height:calc(100% - var(--ibiz-control-wizard-panel-footer-height));overflow:auto}.ibiz-control-wizardpanel.is-header .ibiz-control-wizardpanel__form{height:calc(100% - var(--ibiz-control-wizard-panel-footer-height) - var(--ibiz-control-wizard-panel-header-height))}.ibiz-control-wizardpanel-header{height:var(--ibiz-control-wizard-panel-header-height)}.ibiz-control-wizardpanel-footer{display:flex;align-items:center;justify-content:flex-end;height:var(--ibiz-control-wizard-panel-footer-height);padding-right:var(--ibiz-padding)}
+@charset "UTF-8";.ibiz-control-wizardpanel{--ibiz-control-wizard-panel-header-height:60px;--ibiz-control-wizard-panel-footer-height:40px;--ibiz-control-wizard-panel-step-icon-width:22px;height:100%}.ibiz-control-wizardpanel .ibiz-control-wizardpanel__form{height:calc(100% - var(--ibiz-control-wizard-panel-footer-height));overflow:auto}.ibiz-control-wizardpanel.is-header .ibiz-control-wizardpanel__form{height:calc(100% - var(--ibiz-control-wizard-panel-footer-height) - var(--ibiz-control-wizard-panel-header-height))}.ibiz-control-wizardpanel-header{height:var(--ibiz-control-wizard-panel-header-height)}.ibiz-control-wizardpanel-header--step-icon{font-size:var(--ibiz-control-wizard-panel-step-icon-width)}.ibiz-control-wizardpanel-header .el-step__icon{--el-bg-color:var(--ibiz-color-bg-1)}.ibiz-control-wizardpanel-footer{display:flex;align-items:center;justify-content:flex-end;height:var(--ibiz-control-wizard-panel-footer-height);padding-right:var(--ibiz-padding)}

package/es/control/wizard-panel/wizard-panel.mjs

@@ -1,5 +1,5 @@
 import { isVNode, resolveComponent, h, createVNode, defineComponent } from 'vue';
-import { useControlController, useNamespace } from '@ibiz-template/vue3-util';
+import { useControlController, useNamespace, IBizIcon } from '@ibiz-template/vue3-util';
 import './wizard-panel.css';
 import { WizardPanelController } from '@ibiz-template/runtime';
 import { showTitle } from '@ibiz-template/core';
@@ -105,7 +105,7 @@ const WizardPanelControl = /* @__PURE__ */ defineComponent({
         dewizardSteps
       } = dewizard;
       if (this.c.model.showStepBar && dewizardSteps && dewizardSteps.length > 0) {
-        let _slot;
+        let _slot2;
         let active = this.c.steps.indexOf(this.c.stepTags["".concat(this.c.model.name, "_form_").concat((_e = this.c.state.activeFormTag) == null ? void 0 : _e.toLowerCase())]);
         if (active === -1)
           active = 0;
@@ -114,12 +114,28 @@ const WizardPanelControl = /* @__PURE__ */ defineComponent({
           "align-center": true,
           "finish-status": "success",
           "active": active
-        }, _isSlot(_slot = dewizardSteps.map((step) => {
-          return createVNode(resolveComponent("el-step"), {
-            "title": showTitle(step.title)
-          }, null);
-        })) ? _slot : {
-          default: () => [_slot]
+        }, _isSlot(_slot2 = dewizardSteps.map((step) => {
+          const _slot = {
+            title: () => {
+              var _a2;
+              return createVNode("span", {
+                "class": [this.ns.bm("header", "title"), (_a2 = step.titleSysCss) == null ? void 0 : _a2.cssName]
+              }, [showTitle(step.title)]);
+            }
+          };
+          if (step.sysImage) {
+            Object.assign(_slot, {
+              icon: () => createVNode(IBizIcon, {
+                "class": this.ns.bm("header", "step-icon"),
+                "icon": step.sysImage
+              }, null)
+            });
+          }
+          return createVNode(resolveComponent("el-step"), null, _isSlot(_slot) ? _slot : {
+            default: () => [_slot]
+          });
+        })) ? _slot2 : {
+          default: () => [_slot2]
         });
       }
     }

package/es/editor/array/ibiz-array/ibiz-array.css

@@ -1 +1 @@
-.ibiz-array{height:100%;line-height:var(--ibiz-editor-default-line-height)}.ibiz-array ion-icon{cursor:pointer}
+.ibiz-array{height:100%;line-height:var(--ibiz-editor-default-line-height)}.ibiz-array ion-icon{cursor:pointer}.ibiz-array-tooltip .el-link{--el-link-text-color:inherit}

package/es/editor/array/ibiz-array/ibiz-array.d.ts

@@ -6,15 +6,16 @@ import './ibiz-array.scss';
  *
  * @description 使用el-input组件封装，提供数组数据的输入能力，其呈现样式为多个携带自增自减按钮的输入框。支持编辑器类型包含：`数组编辑器`
  * @primary
- * @editorparams {"name":"editorStyle","parameterType":"'default' | 'url' | 'img'","defaultvalue":"'default'","description":"当设置为 'url' 时，输入框会显示内容的前缀和后缀；设置为 'img' 时，鼠标移入输入框的提示信息将以图片形式展示"}
- * @editorparams {"name":"size","parameterType":"'large' | 'default' | 'small'","defaultvalue":"'default'","description":"el-input组件属性"}
+ * @editorparams {"name":"editorstyle","parameterType":"'default' | 'url' | 'img'","defaultvalue":"'default'","description":"当设置为 'url' 时，输入框会显示内容的前缀和后缀，鼠标移入输入框的提示信息将以链接形式展示；设置为 'img' 时，鼠标移入输入框的提示信息将以图片形式展示"}
+ * @editorparams {"name":"size","parameterType":"'large' | 'default' | 'small'","defaultvalue":"'default'","description":"el-input组件的size属性"}
  * @editorparams {"name":"limit","parameterType":"number","defaultvalue":0,"description":"默认不限制输入项数量，若设置了非零的限制数，当输入项数量超出该限制时，自增按钮将隐藏"}
- * @editorparams {"name":"maxLength","parameterType":"number","description":"设置单个输入框可输入内容的最大长度"}
- * @editorparams {"name":"showWordLimit","parameterType":"boolean","defaultvalue":false,"description":"是否显示统计字数，仅在 editorStyle 参数设置为 'url' 并且数据类型为 'text' 时生效"}
- * @editorparams {"name":"prepend","parameterType":"string","description":"该配置内容会显示在每个输入框的头部，仅在 editorStyle 参数设置为 'url' 时生效"}
- * @editorparams {"name":"append","parameterType":"string","description":"该配置内容会显示在每个输入框的尾部，仅在 editorStyle 参数设置为 'url' 时生效"}
- * @editorparams {"name":"target","parameterType":"'_blank' | '_parent' | '_self' | '_top'","defaultvalue":"'_blank'","description":"该参数用于控制输入框移入时文字提示链接的打开方式，仅在 editorStyle 参数不为 'img' 时生效"}
- * @editorparams {"name":"triggerMode","parameterType":"'blur' |' input'","defaultvalue":"'blur'","description":"指定编辑器触发 `emit` 事件的模式，input: 输入框值变更时触发emit，blur：输入框blur时触发blur"}
+ * @editorparams {"name":"maxlength","parameterType":"number","description":"设置单个输入框可输入内容的最大长度，仅在 editorstyle 参数设置为 'url' 时生效"}
+ * @editorparams {"name":"showwordlimit","parameterType":"boolean","defaultvalue":false,"description":"是否显示字数限制，仅在 editorstyle 参数设置为 'url'，并且数据类型为 'text' 时生效"}
+ * @editorparams {"name":"prepend","parameterType":"string","description":"该配置内容会显示在每个输入框的头部，仅在 editorstyle 参数设置为 'url' 时生效"}
+ * @editorparams {"name":"append","parameterType":"string","description":"该配置内容会显示在每个输入框的尾部，仅在 editorstyle 参数设置为 'url' 时生效"}
+ * @editorparams {"name":"target","parameterType":"'_blank' | '_parent' | '_self' | '_top'","defaultvalue":"'_blank'","description":"该参数用于控制文字提示链接的打开方式，仅在 editorstyle 参数设置为 'url' 时生效"}
+ * @editorparams {"name":"triggermode","parameterType":"'blur' |' input'","defaultvalue":"'blur'","description":"指定编辑器触发 `change` 值变更事件的模式，input: 输入框输入时触发事件，blur：输入框blur时触发事件"}
+ * @editorparams {"name":"readonly","parameterType":"boolean","defaultvalue":false,"description":"设置编辑器是否为只读态"}
  * @ignoreprops  autoFocus | overflowMode
  * @ignoreemits  infoTextChange
  */

package/es/editor/array/ibiz-array/ibiz-array.mjs

@@ -31,6 +31,9 @@ const IBizArray = /* @__PURE__ */ defineComponent({
       if (editorModel.editorParams.editorStyle) {
         editorStyle = editorModel.editorParams.editorStyle;
       }
+      if (editorModel.editorParams.editorstyle) {
+        editorStyle = editorModel.editorParams.editorstyle;
+      }
       if (editorModel.editorParams.size) {
         size = editorModel.editorParams.size;
       }
@@ -40,9 +43,15 @@ const IBizArray = /* @__PURE__ */ defineComponent({
       if (editorModel.editorParams.maxLength) {
         maxLength = toNumber(editorModel.editorParams.maxLength);
       }
+      if (editorModel.editorParams.maxlength) {
+        maxLength = toNumber(editorModel.editorParams.maxlength);
+      }
       if (editorModel.editorParams.showWordLimit) {
         showWordLimit = c.toBoolean(editorModel.editorParams.showWordLimit);
       }
+      if (editorModel.editorParams.showwordlimit) {
+        showWordLimit = c.toBoolean(editorModel.editorParams.showwordlimit);
+      }
       if (editorModel.editorParams.prepend) {
         prepend = editorModel.editorParams.prepend;
       }
@@ -174,6 +183,7 @@ const IBizArray = /* @__PURE__ */ defineComponent({
         "onUpdate:modelValue": ($event) => item.value = $event,
         "placeholder": this.c.placeHolder,
         "disabled": this.disabled,
+        "readonly": this.readonly,
         "onBlur": this.onBlur,
         "onFocus": this.onFocus,
         "onKeyup": this.handleKeyUp,
@@ -181,7 +191,8 @@ const IBizArray = /* @__PURE__ */ defineComponent({
         "onInput": (val) => this.handleInput(val, index)
       }, this.$attrs), null) : createVNode(resolveComponent("el-tooltip"), {
         "placement": "bottom",
-        "trigger": "hover"
+        "trigger": "hover",
+        "popper-class": this.ns.b("tooltip")
       }, {
         default: () => {
           return createVNode(resolveComponent("el-input"), mergeProps({
@@ -191,6 +202,7 @@ const IBizArray = /* @__PURE__ */ defineComponent({
             "onUpdate:modelValue": ($event) => item.value = $event,
             "placeholder": this.c.placeHolder,
             "disabled": this.disabled,
+            "readonly": this.readonly,
             "maxlength": Object.is(this.editorStyle, "url") ? this.maxLength : null,
             "show-word-limit": Object.is(this.editorStyle, "url") ? this.showWordLimit : null,
             "onBlur": this.onBlur,