@ibiz-template/vue3-components 0.5.7-alpha.5 → 0.5.7-alpha.9

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

@@ -1 +1 @@
-.ibiz-grid-setting-column-states{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;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.is-disabled{opacity:.5}.ibiz-grid-setting-column-states .ibiz-grid-setting-column-state img{display:inline-block;width:var(--ibiz-font-size-small);margin-right:var(--ibiz-spacing-extra-tight);font-size:var(--ibiz-font-size-regular);color:var(--ibiz-color-text-3)}.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}

package/es/common/grid-setting/grid-setting.mjs

@@ -60,7 +60,8 @@ const IBizGridSetting = /* @__PURE__ */ defineComponent({
   render() {
     return createVNode(resolveComponent("el-popover"), {
       "placement": "right-start",
-      "trigger": "click"
+      "trigger": "click",
+      "width": "auto"
     }, {
       reference: () => {
         return createVNode("ion-icon", {
@@ -89,9 +90,27 @@ const IBizGridSetting = /* @__PURE__ */ defineComponent({
             return createVNode("div", {
               "class": [this.ns.b("column-state"), this.ns.is("disabled", state.hidden), this.ns.is("fixed", !!state.fixed), !!state.fixed && "unmover"],
               "onClick": () => this.handleClick(state)
-            }, [this.isDraggable && !state.fixed && createVNode("img", {
-              "src": "./assets/iconfont/svg/drag.svg"
-            }, null), state.caption]);
+            }, [this.isDraggable && !state.fixed && createVNode(resolveComponent("iBizIcon"), {
+              "class": this.ns.b("drag-icon"),
+              "icon": {
+                imagePath: "svg/drag.svg"
+              },
+              "baseDir": "iconfont"
+            }, null), createVNode(resolveComponent("iBizIcon"), {
+              "class": this.ns.b("disable-icon"),
+              "icon": {
+                imagePath: "svg/disable.svg"
+              },
+              "baseDir": "iconfont"
+            }, null), createVNode(resolveComponent("iBizIcon"), {
+              "class": this.ns.b("enable-icon"),
+              "icon": {
+                imagePath: "svg/enable.svg"
+              },
+              "baseDir": "iconfont"
+            }, null), createVNode("div", {
+              "class": this.ns.b("state-caption")
+            }, [state.caption])]);
           }
         });
       }

package/es/control/calendar/calendar.mjs

@@ -107,7 +107,7 @@ const CalendarControl = /* @__PURE__ */ defineComponent({
         "style": style,
         "onClick": () => this.c.onRowClick(item),
         "onDblclick": () => this.c.onDbRowClick(item)
-      }, ["".concat(item.text)]);
+      }, [item.text]);
     };
     const renderCalendarList = (items) => {
       return items.map((item) => {

package/es/control/data-view/data-view.mjs

@@ -141,10 +141,11 @@ const DataViewControl = /* @__PURE__ */ defineComponent({
         cardColXS,
         cardColSM,
         cardColMD,
-        cardColLG
+        cardColLG,
+        groupSysCss
       } = c.model;
       return createVNode("div", {
-        "class": ns.be("group-content", "item")
+        "class": [ns.be("group-content", "item"), groupSysCss == null ? void 0 : groupSysCss.cssName]
       }, [createVNode("div", {
         "class": ns.be("group-content", "item-header")
       }, [createVNode("span", {

package/es/control/drtab/drtab.css

@@ -1 +1 @@
-.ibiz-control-drtab__counter{margin-left:8px}
+.ibiz-control-drtab__counter{margin-left:8px}.ibiz-control-drtab .el-tabs .el-tabs__header{margin:0}.ibiz-control-drtab .el-tabs .el-tabs__header .el-tabs__nav-wrap{margin:0}.ibiz-control-drtab .el-tabs .el-tabs__header .el-tabs__nav-wrap .el-tabs__nav .el-tabs__active-bar{background-color:var(--ibiz-color-primary)}.ibiz-control-drtab .el-tabs .el-tabs__header .el-tabs__nav-wrap .el-tabs__nav .el-tabs__item{font-size:var(--ibiz-font-size-regular);color:var(--ibiz-color-text-2)}.ibiz-control-drtab .el-tabs .el-tabs__header .el-tabs__nav-wrap .el-tabs__nav .el-tabs__item:hover{color:var(--ibiz-color-text-0)}.ibiz-control-drtab .el-tabs .el-tabs__header .el-tabs__nav-wrap .el-tabs__nav .el-tabs__item.is-active{color:var(--ibiz-color-primary)}.ibiz-control-drtab .el-tabs .el-tabs__header .el-tabs__nav-wrap .el-tabs__nav .el-tabs__item.is-top:last-child{padding-right:0}.ibiz-control-drtab .el-tabs.el-tabs--bottom,.ibiz-control-drtab .el-tabs.el-tabs--top{padding-left:var(--ibiz-spacing-base)}

package/es/control/form/form-detail/form-mdctrl/form-mdctrl-md/form-mdctrl-md.css

@@ -1 +1 @@
-.ibiz-form-mdctrl-md{display:flex}.ibiz-form-mdctrl-md-content{flex-grow:1}.ibiz-form-mdctrl-md-actions{flex-shrink:0;width:80px;text-align:center}.ibiz-form-mdctrl-md-actions .el-button+.el-button{margin-left:0}.ibiz-form-mdctrl-md-actions__btn{margin-bottom:var(--ibiz-spacing-tight)}
+.ibiz-form-mdctrl-md{--ibiz-form-mdctrl-md-empty-image-width:64px;--ibiz-form-mdctrl-md-empty-padding:0;--ibiz-form-mdctrl-md-empty-margin-top:var(--ibiz-spacing-tight);display:flex}.ibiz-form-mdctrl-md-content{flex-grow:1}.ibiz-form-mdctrl-md-content>.ibiz-no-data{--el-empty-image-width:var(--ibiz-form-mdctrl-md-empty-image-width);--el-empty-description-margin-top:var(--ibiz-form-mdctrl-md-empty-margin-top);--el-empty-padding:var(--ibiz-form-mdctrl-md-empty-padding)}.ibiz-form-mdctrl-md-actions{flex-shrink:0;width:80px;text-align:center}.ibiz-form-mdctrl-md-actions .el-button+.el-button{margin-left:0}.ibiz-form-mdctrl-md-actions__btn{margin-bottom:var(--ibiz-spacing-tight)}

package/es/control/grid/grid/grid.css

@@ -1 +1 @@
-.ibiz-control-grid{--ibiz-control-grid-text-color:var(--ibiz-color-text-0);--ibiz-control-grid-bg-color:transparent;--ibiz-control-grid-padding:0;--ibiz-control-grid-cell-padding:var(--ibiz-spacing-tight);--ibiz-control-grid-selection-padding:var(--ibiz-spacing-base-loose);--ibiz-control-grid-row-edit-bg-color:var(--ibiz-color-fill-2);--ibiz-control-grid-row-bg-color:var(--ibiz-color-bg-1);--ibiz-control-grid-row-bg-color-2:var(--ibiz-color-bg-0);--ibiz-control-grid-now-header-height:auto;--ibiz-control-grid-header-text-color:var(--ibiz-color-text-2);--ibiz-control-grid-header-cell-padding:var(--ibiz-control-grid-cell-padding);--ibiz-control-grid-header-height:auto;--ibiz-control-grid-header-bg-color:var(--ibiz-color-tertiary-light-hover);--ibiz-control-grid-header-font-size:var(--ibiz-font-size-regular);--ibiz-control-grid-header-font-weight:var(--ibiz-font-weight-regular);--ibiz-control-grid-content-text-color:var(--ibiz-control-grid-text-color);--ibiz-control-grid-content-row-height:48px;--ibiz-control-grid-page-text-color:var(--ibiz-color-text-2);--ibiz-control-grid-page-height:50px;--ibiz-control-grid-page-padding:0 var(--ibiz-spacing-base-tight);--ibiz-control-grid-footer-text-color:var(--ibiz-color-text-2);--ibiz-control-grid-footer-bg-color:var(--ibiz-color-tertiary-light-hover);--ibiz-control-grid-footer-font-size:var(--ibiz-font-size-regular);--ibiz-control-grid-footer-font-weight:var(--ibiz-font-weight-bold);position:relative;width:100%;height:100%;padding:var(--ibiz-control-grid-padding);background-color:var(--ibiz-control-grid-bg-color)}.ibiz-control-grid .el-table{--el-table-header-bg-color:var(--ibiz-control-grid-header-bg-color);--el-table-border-color:transparent}.ibiz-control-grid .el-table--border .el-table__cell{border-right:none}.ibiz-control-grid .el-table-fixed-column--left,.ibiz-control-grid .el-table-fixed-column--right{--el-bg-color:transparent}.ibiz-control-grid .el-table thead.is-group th.el-table__cell{background:var(--ibiz-control-grid-header-bg-color)}.ibiz-control-grid.is-enable-page .ibiz-control-grid__table{height:calc(100% - var(--ibiz-control-grid-page-height))}.ibiz-control-grid.is-enable-group .el-table__indent{display:none}.ibiz-control-grid__table{width:100%;height:100%}.ibiz-control-grid__table .caret-wrapper{justify-content:center}.ibiz-control-grid__table .caret-wrapper>*+*{margin-top:3px}.ibiz-control-grid__table .sort-caret{position:initial}.ibiz-control-grid__table.el-table .el-table__cell{padding:0}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr td{background:var(--ibiz-control-grid-row-bg-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr:nth-child(2n) td{background-color:var(--ibiz-control-grid-row-bg-color-2)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr:hover td{background-color:var(--el-table-row-hover-bg-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.current-row td{background-color:var(--el-table-current-row-bg-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.editing-row td{background-color:var(--ibiz-control-grid-row-edit-bg-color)}.ibiz-control-grid__table .el-table__header-wrapper .cell{height:var(--ibiz-control-grid-header-height);padding:var(--ibiz-control-grid-header-cell-padding);font-size:var(--ibiz-control-grid-header-font-size);font-weight:var(--ibiz-control-grid-header-font-weight);color:var(--ibiz-control-grid-header-text-color);word-break:break-word;white-space:pre-wrap}.ibiz-control-grid__table .el-table__header-wrapper .el-table-column--selection .cell{padding:var(--ibiz-control-grid-selection-padding)}.ibiz-control-grid__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-grid__table .el-table__body-wrapper{color:var(--ibiz-control-grid-content-text-color);border-bottom:.1px solid var(--ibiz-color-border)}.ibiz-control-grid__table .el-table__body-wrapper .el-table__row{height:var(--ibiz-control-grid-content-row-height);cursor:pointer}.ibiz-control-grid__table .el-table__body-wrapper .el-table__row>td{height:0;padding:0}@-moz-document url-prefix(){.ibiz-control-grid__table .el-table__body-wrapper .el-table__row>td{height:100%}}.ibiz-control-grid__table .el-table__body-wrapper .cell{display:flex;align-items:center;height:100%;padding:0}.ibiz-control-grid__table .el-table__body-wrapper .el-table-column--selection .cell{padding:var(--ibiz-control-grid-selection-padding)}.ibiz-control-grid__table .el-table__cell.is-center{--ibiz-grid-column-text-align:center;--ibiz-grid-column-justify-content:center}.ibiz-control-grid__table .el-table__cell.is-left{--ibiz-grid-column-text-align:left;--ibiz-grid-column-justify-content:flex-start}.ibiz-control-grid__table .el-table__cell.is-right{--ibiz-grid-column-text-align:right;--ibiz-grid-column-justify-content:flex-end}.ibiz-control-grid__table .el-scrollbar__wrap{position:relative}.ibiz-control-grid__table .el-table__footer-wrapper tfoot td.el-table__cell{font-size:var(--ibiz-control-grid-footer-font-size);font-weight:var(--ibiz-control-grid-footer-font-weight);color:var(--ibiz-control-grid-footer-text-color);background-color:var(--ibiz-control-grid-footer-bg-color)}.ibiz-control-grid__table .el-table__footer-wrapper tfoot td.el-table__cell:first-child>div{display:inline;vertical-align:4px}.ibiz-control-grid .el-table td.el-table__cell,.ibiz-control-grid .el-table th.el-table__cell.is-leaf{border-bottom:none}.ibiz-control-grid .ibiz-pagination{--ibiz-pagination-height:var(--ibiz-control-grid-page-height);--ibiz-pagination-text-color:var(--ibiz-control-grid-text-color);--ibiz-pagination-padding:var(--ibiz-control-grid-page-padding)}.ibiz-control-grid.is-single-select .el-table__header-wrapper .el-table__header thead>tr th:nth-child(1){padding-left:var(--ibiz-spacing-tight)}.ibiz-control-grid.is-single-select .el-table__body-wrapper .el-table__body tbody>tr td:nth-child(1){padding-left:var(--ibiz-spacing-tight)}.ibiz-control-grid.is-enable-customized .el-table__header-wrapper .el-table__header thead>tr th:last-child{padding-right:var(--ibiz-spacing-base-loose)}.ibiz-control-grid.is-enable-customized .ibiz-control-grid-setting-box{display:flex;align-items:center;justify-content:flex-start;position:absolute;top:0;right:0;z-index:99;height:var(--ibiz-control-grid-now-header-height);padding-right:var(--ibiz-spacing-extra-tight);background-color:var(--ibiz-control-grid-header-bg-color)}.ibiz-control-grid.is-enable-customized .ibiz-grid-setting{cursor:pointer}.ibiz-control-grid-quick-toolbar{justify-content:center}.ibiz-control-grid-batch-toolbar{position:absolute;top:0;left:54px;z-index:99;display:none;width:calc(100% - 54px);height:var(--ibiz-control-grid-now-header-height);font-size:var(--ibiz-font-size-regular);font-weight:var(--ibiz-font-weight-regular);background-color:var(--ibiz-control-grid-header-bg-color)}.ibiz-control-grid-batch-toolbar.is-show{display:flex;align-items:center;justify-content:flex-start}.ibiz-control-grid-batch-toolbar .ibiz-control-grid-batch-toolbar-separator{padding:0 var(--ibiz-spacing-base-tight)}.ibiz-control-grid-batch-toolbar .ibiz-control-grid-batch-toolbar-content{height:100%;display:flex;align-items:center;justify-content:flex-start}
+.ibiz-control-grid{--ibiz-control-grid-text-color:var(--ibiz-color-text-0);--ibiz-control-grid-bg-color:transparent;--ibiz-control-grid-padding:0;--ibiz-control-grid-cell-padding:var(--ibiz-spacing-tight);--ibiz-control-grid-selection-padding:var(--ibiz-spacing-base-loose);--ibiz-control-grid-row-edit-bg-color:var(--ibiz-color-fill-2);--ibiz-control-grid-row-bg-color:var(--ibiz-color-bg-1);--ibiz-control-grid-row-bg-color-2:var(--ibiz-color-bg-0);--ibiz-control-grid-now-header-height:auto;--ibiz-control-grid-header-text-color:var(--ibiz-color-text-2);--ibiz-control-grid-header-cell-padding:var(--ibiz-control-grid-cell-padding);--ibiz-control-grid-header-height:auto;--ibiz-control-grid-header-bg-color:var(--ibiz-color-tertiary-light-hover);--ibiz-control-grid-header-font-size:var(--ibiz-font-size-regular);--ibiz-control-grid-header-font-weight:var(--ibiz-font-weight-regular);--ibiz-control-grid-content-text-color:var(--ibiz-control-grid-text-color);--ibiz-control-grid-content-row-height:48px;--ibiz-control-grid-page-text-color:var(--ibiz-color-text-2);--ibiz-control-grid-page-height:50px;--ibiz-control-grid-page-padding:0 var(--ibiz-spacing-base-tight);--ibiz-control-grid-footer-text-color:var(--ibiz-color-text-2);--ibiz-control-grid-footer-bg-color:var(--ibiz-color-tertiary-light-hover);--ibiz-control-grid-footer-font-size:var(--ibiz-font-size-regular);--ibiz-control-grid-footer-font-weight:var(--ibiz-font-weight-bold);position:relative;width:100%;height:100%;padding:var(--ibiz-control-grid-padding);background-color:var(--ibiz-control-grid-bg-color)}.ibiz-control-grid .el-table{--el-table-header-bg-color:var(--ibiz-control-grid-header-bg-color);--el-table-border-color:transparent}.ibiz-control-grid .el-table--border .el-table__cell{border-right:none}.ibiz-control-grid .el-table-fixed-column--left,.ibiz-control-grid .el-table-fixed-column--right{--el-bg-color:transparent}.ibiz-control-grid .el-table thead.is-group th.el-table__cell{background:var(--ibiz-control-grid-header-bg-color)}.ibiz-control-grid.is-enable-page .ibiz-control-grid__table{height:calc(100% - var(--ibiz-control-grid-page-height))}.ibiz-control-grid.is-enable-group .el-table__indent{display:none}.ibiz-control-grid__table{width:100%;height:100%}.ibiz-control-grid__table .caret-wrapper{justify-content:center}.ibiz-control-grid__table .caret-wrapper>*+*{margin-top:3px}.ibiz-control-grid__table .sort-caret{position:initial}.ibiz-control-grid__table.el-table .el-table__cell{padding:0}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr td{background:var(--ibiz-control-grid-row-bg-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr:nth-child(2n) td{background-color:var(--ibiz-control-grid-row-bg-color-2)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr:hover td{background-color:var(--el-table-row-hover-bg-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.current-row td{background-color:var(--el-table-current-row-bg-color)}.ibiz-control-grid__table.el-table .el-table__body-wrapper tr.editing-row td{background-color:var(--ibiz-control-grid-row-edit-bg-color)}.ibiz-control-grid__table .el-table__header-wrapper .cell{height:var(--ibiz-control-grid-header-height);padding:var(--ibiz-control-grid-header-cell-padding);font-size:var(--ibiz-control-grid-header-font-size);font-weight:var(--ibiz-control-grid-header-font-weight);color:var(--ibiz-control-grid-header-text-color);word-break:break-word;white-space:pre-wrap}.ibiz-control-grid__table .el-table__header-wrapper .el-table-column--selection .cell{padding:var(--ibiz-control-grid-selection-padding)}.ibiz-control-grid__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-grid__table .el-table__body-wrapper{color:var(--ibiz-control-grid-content-text-color);border-bottom:.1px solid var(--ibiz-color-border)}.ibiz-control-grid__table .el-table__body-wrapper .el-table__row{height:var(--ibiz-control-grid-content-row-height);cursor:pointer}.ibiz-control-grid__table .el-table__body-wrapper .el-table__row>td{height:0;padding:0}@-moz-document url-prefix(){.ibiz-control-grid__table .el-table__body-wrapper .el-table__row>td{height:100%}}.ibiz-control-grid__table .el-table__body-wrapper .cell{display:flex;align-items:center;height:100%;padding:0}.ibiz-control-grid__table .el-table__body-wrapper .el-table-column--selection .cell{padding:var(--ibiz-control-grid-selection-padding)}.ibiz-control-grid__table .el-table__cell.is-center{--ibiz-grid-column-text-align:center;--ibiz-grid-column-justify-content:center}.ibiz-control-grid__table .el-table__cell.is-left{--ibiz-grid-column-text-align:left;--ibiz-grid-column-justify-content:flex-start}.ibiz-control-grid__table .el-table__cell.is-right{--ibiz-grid-column-text-align:right;--ibiz-grid-column-justify-content:flex-end}.ibiz-control-grid__table .el-scrollbar__wrap{position:relative}.ibiz-control-grid__table .el-table__footer-wrapper tfoot td.el-table__cell{font-size:var(--ibiz-control-grid-footer-font-size);font-weight:var(--ibiz-control-grid-footer-font-weight);color:var(--ibiz-control-grid-footer-text-color);background-color:var(--ibiz-control-grid-footer-bg-color)}.ibiz-control-grid__table .el-table__footer-wrapper tfoot td.el-table__cell:first-child>div{display:inline;vertical-align:4px}.ibiz-control-grid .el-table td.el-table__cell,.ibiz-control-grid .el-table th.el-table__cell.is-leaf{border-bottom:none}.ibiz-control-grid .ibiz-pagination{--ibiz-pagination-height:var(--ibiz-control-grid-page-height);--ibiz-pagination-text-color:var(--ibiz-control-grid-text-color);--ibiz-pagination-padding:var(--ibiz-control-grid-page-padding)}.ibiz-control-grid.is-single-select .el-table__header-wrapper .el-table__header thead>tr th:nth-child(1){padding-left:var(--ibiz-spacing-tight)}.ibiz-control-grid.is-single-select .el-table__body-wrapper .el-table__body tbody>tr td:nth-child(1){padding-left:var(--ibiz-spacing-tight)}.ibiz-control-grid.is-enable-customized .el-table__header-wrapper .el-table__header thead>tr th:last-child{padding-right:var(--ibiz-spacing-base-loose)}.ibiz-control-grid.is-enable-customized .ibiz-control-grid-setting-box{display:flex;align-items:center;justify-content:flex-start;position:absolute;top:0;right:0;z-index:1;height:var(--ibiz-control-grid-now-header-height);padding-right:var(--ibiz-spacing-extra-tight);background-color:var(--ibiz-control-grid-header-bg-color)}.ibiz-control-grid.is-enable-customized .ibiz-grid-setting{cursor:pointer}.ibiz-control-grid-quick-toolbar{justify-content:center}.ibiz-control-grid-batch-toolbar{position:absolute;top:0;left:54px;z-index:99;display:none;width:calc(100% - 54px);height:var(--ibiz-control-grid-now-header-height);font-size:var(--ibiz-font-size-regular);font-weight:var(--ibiz-font-weight-regular);background-color:var(--ibiz-control-grid-header-bg-color)}.ibiz-control-grid-batch-toolbar.is-show{display:flex;align-items:center;justify-content:flex-start}.ibiz-control-grid-batch-toolbar .ibiz-control-grid-batch-toolbar-separator{padding:0 var(--ibiz-spacing-base-tight)}.ibiz-control-grid-batch-toolbar .ibiz-control-grid-batch-toolbar-content{height:100%;display:flex;align-items:center;justify-content:flex-start}

package/es/control/grid/grid/grid.mjs

@@ -10,9 +10,6 @@ import { usePagination } from '../../../util/pagination/use-pagination.mjs';
 "use strict";
 function renderColumn(c, model, renderColumns, index) {
   var _a;
-  if (model.hideDefault) {
-    return null;
-  }
   const {
     codeName: columnName,
     width
@@ -54,7 +51,7 @@ function renderColumn(c, model, renderColumns, index) {
 function renderChildColumn(c, model, renderColumns, index) {
   var _a, _b;
   if (model.columnType === "GROUPGRIDCOLUMN") {
-    const childColumns = ((_a = model.degridColumns) == null ? void 0 : _a.filter((item) => !item.hideDefault)) || [];
+    const childColumns = ((_a = model.degridColumns) == null ? void 0 : _a.filter((item) => !item.hideDefault && !item.hiddenDataItem)) || [];
     const {
       width
     } = model;

package/es/control/search-bar/filter-mode-select/filter-mode-select.d.ts

@@ -15,6 +15,7 @@ export declare const FilterModeSelect: import("vue").DefineComponent<{
         of<T_4>(...items: T_4[]): T_4[];
         readonly [Symbol.species]: ArrayConstructor;
     };
+    disabled: BooleanConstructor;
 }, {
     availableModes: import("vue").ComputedRef<readonly [{
         readonly valueOP: ValueOP.EQ;
@@ -114,6 +115,9 @@ export declare const FilterModeSelect: import("vue").DefineComponent<{
         of<T_4>(...items: T_4[]): T_4[];
         readonly [Symbol.species]: ArrayConstructor;
     };
+    disabled: BooleanConstructor;
 }>> & {
     onChange?: ((_mode: string) => any) | undefined;
-}, {}, {}>;
+}, {
+    disabled: boolean;
+}, {}>;

package/es/control/search-bar/filter-mode-select/filter-mode-select.mjs

@@ -49,7 +49,8 @@ const FilterModeSelect = /* @__PURE__ */ defineComponent({
   name: "IBizFilterModeSelect",
   props: {
     value: String,
-    modes: Array
+    modes: Array,
+    disabled: Boolean
   },
   emits: {
     change: (_mode) => true
@@ -76,6 +77,7 @@ const FilterModeSelect = /* @__PURE__ */ defineComponent({
     let _slot;
     return createVNode(resolveComponent("el-select"), {
       "model-value": this.value,
+      "disabled": this.disabled,
       "teleported": false,
       "onChange": (value) => {
         this.onChange(value);

package/es/control/search-bar/filter-tree/filter-tree.mjs

@@ -7,6 +7,7 @@ import './filter-tree.css';
 function _isSlot(s) {
   return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
 }
+const ScriptValueRegex = /\$\{[^}]*\}/;
 const FilterModes = [{
   valueOP: ValueOP.EQ,
   label: "\u7B49\u4E8E(=)"
@@ -119,10 +120,12 @@ const FilterTreeControl = /* @__PURE__ */ defineComponent({
       }
     });
     const onFieldSelect = (node, field) => {
+      node.value = null;
       node.field = field;
     };
     const onValueOPSelect = (node, valueOP) => {
       node.valueOP = valueOP;
+      node.value = null;
     };
     const onGroupLogicTypeChange = (node, logicType) => {
       node.logicType = logicType;
@@ -152,11 +155,18 @@ const FilterTreeControl = /* @__PURE__ */ defineComponent({
         return null;
       }
       let editor = null;
+      let editorValue = node.value;
+      if (node.disabled && ScriptValueRegex.test(editorValue)) {
+        editorValue = editorValue.replace("${context.srfpersonid}", "\u5F53\u524D\u7528\u6237");
+        editorValue = editorValue.replace("${context.srforgid}", "\u5F53\u524D\u7EC4\u7EC7");
+      }
       if (filterC.editorProvider) {
         const component = resolveComponent(filterC.editorProvider.formEditor);
         editor = h(component, {
-          value: node.value,
+          key: filterC.editor.model.id,
+          value: editorValue,
           controller: filterC.editor,
+          disabled: node.disabled,
           data: {},
           onChange: (val) => {
             node.value = val;
@@ -178,6 +188,7 @@ const FilterTreeControl = /* @__PURE__ */ defineComponent({
       return createVNode("div", {
         "class": ns.b("item")
       }, [createVNode(resolveComponent("el-select"), {
+        "disabled": node.disabled,
         "model-value": node.field,
         "teleported": false,
         "class": ns.e("field-select"),
@@ -193,6 +204,7 @@ const FilterTreeControl = /* @__PURE__ */ defineComponent({
       })) ? _slot : {
         default: () => [_slot]
       }), availableModes && availableModes.length > 0 && createVNode(resolveComponent("iBizFilterModeSelect"), {
+        "disabled": node.disabled,
         "class": ns.e("mode-select"),
         "value": node.valueOP,
         "modes": availableModes,

package/es/control/search-bar/search-bar.mjs

@@ -118,7 +118,7 @@ const SearchBarControl = /* @__PURE__ */ defineComponent({
           }, [groupItem.caption]);
         })])), this.c.model.enableGroup && this.c.isBackendSearchGroup && createVNode(resolveComponent("el-button"), {
           "class": this.ns.b("save"),
-          "title": "\u4FDD\u5B58",
+          "title": "\u4FDD\u5B58\u5206\u7EC4",
           "onClick": this.handleSave
         }, {
           default: () => [createVNode("ion-icon", {

package/es/control/tab-exp-panel/tab-exp-panel.mjs

@@ -1,7 +1,8 @@
-import { isVNode, resolveComponent, createVNode, defineComponent } from 'vue';
+import { isVNode, watch, resolveComponent, createVNode, defineComponent } from 'vue';
 import { useControlController, useNamespace } from '@ibiz-template/vue3-util';
 import './tab-exp-panel.css';
 import { TabExpPanelController } from '@ibiz-template/runtime';
+import { useRoute } from 'vue-router';
 
 "use strict";
 function _isSlot(s) {
@@ -38,6 +39,36 @@ const TabExpPanelControl = /* @__PURE__ */ defineComponent({
       c.handleTabChange();
     };
     const tabPosition = ((_a = c.view.model.tabLayout) == null ? void 0 : _a.toLowerCase()) || "top";
+    const route = useRoute();
+    watch(() => route.fullPath, (newVal, oldVal) => {
+      if (newVal !== oldVal) {
+        const viewCodeName = c.view.model.codeName.toLowerCase();
+        const viewRouteKey = Object.keys(route.params).find((key) => {
+          return route.params[key] === viewCodeName;
+        });
+        if (!viewRouteKey) {
+          return;
+        }
+        const nextKeyNumber = (parseInt(viewRouteKey[viewRouteKey.length - 1], 10) + 2) * 2;
+        const tempFullPath = route.fullPath.split("/").slice(0, nextKeyNumber).join("/");
+        c.state.tabPages.forEach((page) => {
+          if (page.fullPath === tempFullPath) {
+            c.state.activeName = page.tabTag;
+            c.handleTabChange();
+          }
+        });
+        if (c.state.activeName) {
+          const currentPage = c.state.tabPages.find((page) => {
+            return page.tabTag === c.state.activeName;
+          });
+          if (currentPage) {
+            currentPage.fullPath = tempFullPath;
+          }
+        }
+      }
+    }, {
+      immediate: true
+    });
     return {
       c,
       ns,

package/es/editor/date-range/ibiz-date-range-picker/ibiz-date-range-picker.css

@@ -1 +1 @@
-.ibiz-date-range-picker .el-date-editor{width:100%;line-height:var(--ibiz-editor-default-line-height);display:flex;align-items:center;justify-content:flex-start}.ibiz-date-range-picker .el-date-editor .el-range-input{color:var(--ibiz-form-item-text-color)}.ibiz-date-range-picker-form-default-content{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default:hover .ibiz-date-range-picker-form-default-content{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default:hover .ibiz-date-range-picker-input{display:flex}.ibiz-form-item .ibiz-date-range-picker.is-show-default .ibiz-date-range-picker-form-default-content{display:flex;align-items:center;width:100%;font-family:Arial,sans-serif;font-size:var(--ibiz-form-item-font-size);line-height:var(--ibiz-editor-default-line-height);color:var(--ibiz-form-item-text-color)}.ibiz-form-item .ibiz-date-range-picker.is-show-default .ibiz-date-range-picker-form-default-content .ibiz-date-range-picker-default-input{box-shadow:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default .ibiz-date-range-picker-form-default-content .ibiz-date-range-picker-default-input .el-icon{opacity:0}.ibiz-form-item .ibiz-date-range-picker.is-show-default .ibiz-date-range-picker-input{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default.is-editable .ibiz-date-range-picker-form-default-content{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default.is-editable .ibiz-date-range-picker-input{display:flex}
+.ibiz-date-range-picker .el-date-editor{width:100%;line-height:var(--ibiz-editor-default-line-height);display:flex;align-items:center;justify-content:flex-start}.ibiz-date-range-picker .el-date-editor .el-range-input{color:var(--ibiz-form-item-text-color)}.ibiz-date-range-picker-form-default-content{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default:hover .ibiz-date-range-picker-form-default-content{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default:hover .ibiz-date-range-picker-input{display:flex}.ibiz-form-item .ibiz-date-range-picker.is-show-default .ibiz-date-range-picker-form-default-content{display:flex;align-items:center;width:100%;font-family:Arial,sans-serif;font-size:var(--ibiz-form-item-font-size);line-height:var(--ibiz-editor-default-line-height);color:var(--ibiz-form-item-text-color)}.ibiz-form-item .ibiz-date-range-picker.is-show-default .ibiz-date-range-picker-form-default-content .ibiz-date-range-picker-default-input{box-shadow:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default .ibiz-date-range-picker-input{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default.is-editable .ibiz-date-range-picker-form-default-content{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default.is-editable .ibiz-date-range-picker-input{display:flex}

package/es/index.d.ts

@@ -6,7 +6,6 @@ export * from './editor';
 export * from './view';
 export * from './view-engine';
 export * from './util';
-export { devtool } from './devtool';
 export { i18n } from './locale';
 declare const _default: {
     install: (v: App) => void;

package/es/index.mjs

@@ -8,7 +8,6 @@ import { iBizI18n } from './locale/index.mjs';
 export { i18n } from './locale/index.mjs';
 import { IBizViewEngine } from './view-engine/index.mjs';
 import './util/index.mjs';
-export { devtool } from './devtool/index.mjs';
 import { IBizWFStepTraceView } from './view/wf-step-trace-view/index.mjs';
 import { IBizSubAppRefView } from './view/sub-app-ref-view/index.mjs';
 import { IBizDataViewControl } from './control/data-view/index.mjs';

package/es/panel-component/auth-userinfo/auth-userinfo.css

@@ -1 +1 @@
-.ibiz-user-info{--ibiz-user-info-padding:0 var(--ibiz-spacing-loose);--ibiz-user-info-color:var(--ibiz-color-text-0);display:flex;align-items:center;justify-content:flex-start;width:100%;height:100%}.ibiz-user-info .el-dropdown{width:100%;padding:var(--ibiz-user-info-padding);cursor:pointer}.ibiz-user-info.is-left .ibiz-user-info__down{position:relative;top:12px}.ibiz-user-info.is-top .ibiz-user-info__down{margin-left:35px}.ibiz-user-info.is-top .ibiz-user-info-avatar{max-width:24px;max-height:24px}.ibiz-user-info.is-collapse .el-dropdown{padding:0 var(--ibiz-spacing-base-tight)}.ibiz-user-info.is-collapse .ibiz-user-info-avatar{max-width:32px;max-height:32px;margin:0}.ibiz-user-info-avatar{max-width:44px;max-height:44px;margin-right:10px}.ibiz-user-info-info{width:100%;display:flex;align-items:center;justify-content:space-between;color:var(--ibiz-user-info-color)}.ibiz-user-info-name__user-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:130px;font-size:var(--ibiz-font-size-header-6)}.ibiz-user-info-name__person-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:130px;margin-top:10px;font-size:var(--ibiz-font-size-small)}.ibiz-user-info-label{display:flex;align-items:center;justify-content:flex-start;font-size:var(--ibiz-user-info-font-size);color:var(--ibiz-user-info-color);outline:0}
+.ibiz-user-info{--ibiz-user-info-padding:0 var(--ibiz-spacing-loose);--ibiz-user-info-color:var(--ibiz-color-text-0);display:flex;align-items:center;justify-content:flex-start;width:100%;height:100%}.ibiz-user-info .el-dropdown{width:100%;padding:var(--ibiz-user-info-padding);cursor:pointer}.ibiz-user-info.is-left .ibiz-user-info__down{position:relative;top:12px}.ibiz-user-info.is-top .ibiz-user-info__down{margin-left:35px}.ibiz-user-info.is-top .ibiz-user-info-avatar{max-width:24px;max-height:24px}.ibiz-user-info.is-collapse .el-dropdown{padding:0 var(--ibiz-spacing-base-tight)}.ibiz-user-info.is-collapse .ibiz-user-info-avatar{max-width:32px;max-height:32px;margin:0}.ibiz-user-info-avatar{max-width:44px;max-height:44px;margin-right:10px}.ibiz-user-info-info{width:100%;display:flex;align-items:center;justify-content:space-between;color:var(--ibiz-user-info-color)}.ibiz-user-info-name__user-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:130px;font-size:var(--ibiz-font-size-header-6);line-height:1.3}.ibiz-user-info-name__person-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:130px;margin-top:10px;font-size:var(--ibiz-font-size-small);line-height:1.2}.ibiz-user-info-label{display:flex;align-items:center;justify-content:flex-start;font-size:var(--ibiz-user-info-font-size);color:var(--ibiz-user-info-color);outline:0}

package/es/panel-component/panel-app-login-view/index.d.ts

@@ -13,6 +13,7 @@ export declare const IBizPanelAppLoginView: import("@ibiz-template/vue3-util").T
 }, {
     ns: import("@ibiz-template/core").Namespace;
     classArr: import("vue").ComputedRef<(string | false)[]>;
+    cssVars: import("vue").ComputedRef<Record<string, string>>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelData: {
         type: import("vue").PropType<import("@ibiz/model-core").IPanelContainer>;

package/es/panel-component/panel-app-login-view/panel-app-login-view.css

@@ -1 +1 @@
-.ibiz-panel-app-login-view{display:flex;align-items:center;justify-content:center;width:100vw;height:100vh;background:linear-gradient(120deg,#a1c4fd 0,#c2e9fb 100%);--el-color-primary:#409eff}.ibiz-panel-app-login-view .el-input{--el-input-text-color:#606266;--el-input-border-color:#dcdfe6;--el-input-hover-border-color:#c0c4cc;--el-input-icon-color:#a8abb2}.ibiz-panel-app-login-view .el-button{--el-button-text-color:var(--el-color-white);--el-button-bg-color:var(--el-color-primary);--el-button-border-color:var(--el-color-primary);--el-button-outline-color:var(--el-color-primary-light-5);--el-button-active-color:var(--el-color-primary-dark-2);--el-button-hover-text-color:var(--el-color-white);--el-button-hover-link-text-color:var(--el-color-primary-light-5);--el-button-hover-bg-color:var(--el-color-primary-light-3);--el-button-hover-border-color:var(--el-color-primary-light-3);--el-button-active-bg-color:var(--el-color-primary-dark-2);--el-button-active-border-color:var(--el-color-primary-dark-2);--el-button-disabled-text-color:var(--el-color-white);--el-button-disabled-bg-color:var(--el-color-primary-light-5);--el-button-disabled-border-color:var(--el-color-primary-light-5)}.ibiz-panel-app-login-view .ibiz-panel-container--container1{width:430px;margin-bottom:80px}.ibiz-panel-app-login-view .ibiz-panel-container--container4{position:relative;height:150px;background:url(assets/images/login-header.png);background-size:100% 100%}.ibiz-panel-app-login-view .ibiz-panel-container--container4 .ibiz-rawitem{position:absolute;top:28%;left:50%;height:auto;font-size:var(--ibiz-font-size-header-2);font-weight:var(--ibiz-font-weight-bold);color:rgb(var(--ibiz-white));text-align:center;text-shadow:0 2px 6px rgba(0,0,0,.54);transform:translateX(-50%)}.ibiz-panel-app-login-view .ibiz-panel-container--container5{position:relative;height:380px;padding:100px 40px 40px;background:#fff}.ibiz-panel-app-login-view .ibiz-panel-container--container5 .el-input__inner:-webkit-autofill{box-shadow:0 0 0 1000px #fff inset;-webkit-text-fill-color:#606266}.ibiz-panel-app-login-view .ibiz-panel-container--container5 .el-input__prefix{width:20px;margin-left:-1px}.ibiz-panel-app-login-view .ibiz-panel-container--container5 ion-icon{font-size:16px}.ibiz-panel-app-login-view .ibiz-panel-container--container6{position:absolute;top:-50px;right:calc(50% - 50px);z-index:2;display:block;width:100px;height:100px;-webkit-user-select:none;-moz-user-select:none;user-select:none;background:url(assets/images/login-avatar.png);background-size:100% 100%;border:4px solid #fff;border-radius:50%}.ibiz-panel-app-login-view .ibiz-panel-container--container3>.ibiz-row>*+*{margin-left:10px}.ibiz-panel-app-login-view .ibiz-panel-container--container3>.ibiz-row>.ibiz-col{flex:1}.ibiz-panel-app-login-view .ibiz-panel-container--container3 .ibiz-panel-button{width:100%;padding:0}.ibiz-panel-app-login-view .ibiz-panel-container--container3 .ibiz-panel-button .el-button{font-weight:300;letter-spacing:2px}
+.ibiz-panel-app-login-view{--ibiz-panel-app-login-view-header-url:url("/assets/images/login-header.png");--ibiz-panel-app-login-view-avatar-url:url("/assets/images/login-avatar.png");display:flex;align-items:center;justify-content:center;width:100vw;height:100vh;background:linear-gradient(120deg,#a1c4fd 0,#c2e9fb 100%);--el-color-primary:#409eff}.ibiz-panel-app-login-view .el-input{--el-input-text-color:#606266;--el-input-border-color:#dcdfe6;--el-input-hover-border-color:#c0c4cc;--el-input-icon-color:#a8abb2}.ibiz-panel-app-login-view .el-button{--el-button-text-color:var(--el-color-white);--el-button-bg-color:var(--el-color-primary);--el-button-border-color:var(--el-color-primary);--el-button-outline-color:var(--el-color-primary-light-5);--el-button-active-color:var(--el-color-primary-dark-2);--el-button-hover-text-color:var(--el-color-white);--el-button-hover-link-text-color:var(--el-color-primary-light-5);--el-button-hover-bg-color:var(--el-color-primary-light-3);--el-button-hover-border-color:var(--el-color-primary-light-3);--el-button-active-bg-color:var(--el-color-primary-dark-2);--el-button-active-border-color:var(--el-color-primary-dark-2);--el-button-disabled-text-color:var(--el-color-white);--el-button-disabled-bg-color:var(--el-color-primary-light-5);--el-button-disabled-border-color:var(--el-color-primary-light-5)}.ibiz-panel-app-login-view .ibiz-panel-container--container1{width:430px;margin-bottom:80px}.ibiz-panel-app-login-view .ibiz-panel-container--container4{position:relative;height:150px;background:var(--ibiz-panel-app-login-view-header-url);background-size:100% 100%}.ibiz-panel-app-login-view .ibiz-panel-container--container4 .ibiz-rawitem{position:absolute;top:28%;left:50%;height:auto;font-size:var(--ibiz-font-size-header-2);font-weight:var(--ibiz-font-weight-bold);color:rgb(var(--ibiz-white));text-align:center;text-shadow:0 2px 6px rgba(0,0,0,.54);transform:translateX(-50%)}.ibiz-panel-app-login-view .ibiz-panel-container--container5{position:relative;height:380px;padding:100px 40px 40px;background:#fff}.ibiz-panel-app-login-view .ibiz-panel-container--container5 .el-input__inner:-webkit-autofill{box-shadow:0 0 0 1000px #fff inset;-webkit-text-fill-color:#606266}.ibiz-panel-app-login-view .ibiz-panel-container--container5 .el-input__prefix{width:20px;margin-left:-1px}.ibiz-panel-app-login-view .ibiz-panel-container--container5 ion-icon{font-size:16px}.ibiz-panel-app-login-view .ibiz-panel-container--container6{position:absolute;top:-50px;right:calc(50% - 50px);z-index:2;display:block;width:100px;height:100px;-webkit-user-select:none;-moz-user-select:none;user-select:none;background:var(--ibiz-panel-app-login-view-avatar-url);background-size:100% 100%;border:4px solid #fff;border-radius:50%}.ibiz-panel-app-login-view .ibiz-panel-container--container3>.ibiz-row>*+*{margin-left:10px}.ibiz-panel-app-login-view .ibiz-panel-container--container3>.ibiz-row>.ibiz-col{flex:1}.ibiz-panel-app-login-view .ibiz-panel-container--container3 .ibiz-panel-button{width:100%;padding:0}.ibiz-panel-app-login-view .ibiz-panel-container--container3 .ibiz-panel-button .el-button{font-weight:300;letter-spacing:2px}

package/es/panel-component/panel-app-login-view/panel-app-login-view.d.ts

@@ -14,6 +14,7 @@ export declare const PanelAppLoginView: import("vue").DefineComponent<{
 }, {
     ns: import("@ibiz-template/core").Namespace;
     classArr: import("vue").ComputedRef<(string | false)[]>;
+    cssVars: import("vue").ComputedRef<Record<string, string>>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelData: {
         type: PropType<IPanelContainer>;

package/es/panel-component/panel-app-login-view/panel-app-login-view.mjs

@@ -29,9 +29,25 @@ const PanelAppLoginView = /* @__PURE__ */ defineComponent({
       result = [...result, ...props.controller.containerClass, ns.is("hidden", !props.controller.state.visible)];
       return result;
     });
+    const cssVars = computed(() => {
+      let styles = {};
+      const pathName = window.location.pathname;
+      if (pathName) {
+        const lastIndex = pathName.lastIndexOf("/");
+        if (lastIndex !== -1) {
+          const path = pathName.substring(0, lastIndex + 1);
+          styles = {
+            "header-url": "url('".concat(path, "assets/images/login-header.png')"),
+            "avatar-url": "url('".concat(path, "assets/images/login-avatar.png')")
+          };
+        }
+      }
+      return ns.cssVarBlock(styles);
+    });
     return {
       ns,
-      classArr
+      classArr,
+      cssVars
     };
   },
   render() {
@@ -57,6 +73,7 @@ const PanelAppLoginView = /* @__PURE__ */ defineComponent({
     });
     return createVNode("div", {
       "class": this.classArr,
+      "style": this.cssVars,
       "onClick": () => {
         this.controller.onClick();
       }

package/es/panel-component/panel-button/index.d.ts

@@ -19,6 +19,8 @@ export declare const IBizPanelButton: import("@ibiz-template/vue3-util").TypeWit
     state: import("./panel-button.state").PanelButtonState;
     tooltip: string | undefined;
     handleButtonClick: (event: MouseEvent) => Promise<void>;
+    buttonCssStyle: string | undefined;
+    tempStyle: import("vue").Ref<string>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelData: {
         type: import("vue").PropType<import("@ibiz/model-core").IPanelButton>;

package/es/panel-component/panel-button/panel-button.d.ts

@@ -22,6 +22,8 @@ export declare const PanelButton: import("vue").DefineComponent<{
     state: import("./panel-button.state").PanelButtonState;
     tooltip: string | undefined;
     handleButtonClick: (event: MouseEvent) => Promise<void>;
+    buttonCssStyle: string | undefined;
+    tempStyle: import("vue").Ref<string>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelData: {
         type: PropType<IPanelButton>;

package/es/panel-component/panel-button/panel-button.mjs

@@ -1,4 +1,4 @@
-import { computed, resolveComponent, createVNode, defineComponent } from 'vue';
+import { ref, computed, resolveComponent, createVNode, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { PanelButtonController } from './panel-button.controller.mjs';
 import './panel-button.css';
@@ -26,12 +26,17 @@ const PanelButton = /* @__PURE__ */ defineComponent({
       sysImage,
       codeName,
       itemStyle,
-      tooltip
+      tooltip,
+      buttonCssStyle
     } = props.modelData;
     const {
       panel,
       state
     } = props.controller;
+    const tempStyle = ref("");
+    if (buttonCssStyle) {
+      tempStyle.value = buttonCssStyle;
+    }
     const captionText = computed(() => {
       if (captionItemName && panel.data) {
         return panel.data[captionItemName.toLowerCase()];
@@ -82,13 +87,16 @@ const PanelButton = /* @__PURE__ */ defineComponent({
       codeName,
       state,
       tooltip,
-      handleButtonClick
+      handleButtonClick,
+      buttonCssStyle,
+      tempStyle
     };
   },
   render() {
     if (this.state.visible) {
       return createVNode("div", {
-        "class": [this.ns.b(), this.ns.m(this.codeName), this.ns.is("loading", this.state.loading), ...this.controller.containerClass]
+        "class": [this.ns.b(), this.ns.m(this.codeName), this.ns.is("loading", this.state.loading), ...this.controller.containerClass],
+        "style": this.tempStyle
       }, [createVNode(resolveComponent("el-button"), {
         "type": this.buttonType,
         "text": this.isText,

package/es/panel-component/user-message/user-message.mjs

@@ -47,6 +47,7 @@ const UserMessage = /* @__PURE__ */ defineComponent({
   },
   render() {
     return createVNode("div", {
+      "title": "\u901A\u77E5",
       "class": [this.ns.b(), this.ns.m(this.modelData.id), ...this.controller.containerClass]
     }, [createVNode(resolveComponent("el-popover"), {
       "ref": "popoverRef",

package/es/util/app-drawer/app-drawer-component.mjs

@@ -1,8 +1,9 @@
-import { ref, resolveComponent, createVNode, defineComponent } from 'vue';
+import { ref, resolveComponent, h, defineComponent } from 'vue';
 import { useNamespace, useUIStore, OverlayContainer } from '@ibiz-template/vue3-util';
 import { ViewMode, Modal } from '@ibiz-template/runtime';
 import { isNumber } from 'lodash-es';
 import './app-drawer-component.css';
+import { calcOpenModeStyle } from '@ibiz-template/core';
 
 "use strict";
 const AppDrawerComponent = /* @__PURE__ */ defineComponent({
@@ -28,14 +29,14 @@ const AppDrawerComponent = /* @__PURE__ */ defineComponent({
     } = props.opts;
     if (placement === "top" || placement === "bottom") {
       if (isNumber(height)) {
-        size.value = height;
+        size.value = calcOpenModeStyle(height, "drawer");
       } else {
         size.value = "100%";
       }
     }
     if (placement === "left" || placement === "right") {
       if (isNumber(width)) {
-        size.value = width;
+        size.value = calcOpenModeStyle(width, "drawer");
       } else {
         size.value = 800;
       }
@@ -92,21 +93,19 @@ const AppDrawerComponent = /* @__PURE__ */ defineComponent({
     };
   },
   render() {
-    return createVNode(resolveComponent("el-drawer"), {
-      "model-value": this.isShow,
-      "lock-scroll": true,
-      "size": this.size,
-      "class": this.ns.b(),
-      "z-index": this.drawerZIndex,
-      "direction": this.direction,
-      "before-close": this.onBeforeClose,
-      "onClosed": this.onClosed
-    }, {
-      default: () => {
-        var _a, _b;
-        return [(_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a, this.modal)];
-      }
-    });
+    var _a, _b;
+    const option = this.opts || {};
+    return h(resolveComponent("el-drawer"), {
+      modelValue: this.isShow,
+      lockScroll: true,
+      size: this.size,
+      class: this.ns.b(),
+      zIndex: this.drawerZIndex,
+      direction: this.direction,
+      beforeClose: this.onBeforeClose,
+      onClosed: this.onClosed,
+      ...option
+    }, (_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a, this.modal));
   }
 });
 function createDrawer(render, opts) {

package/es/util/app-modal/app-modal-component.mjs

@@ -1,8 +1,9 @@
-import { ref, reactive, resolveComponent, createVNode, defineComponent } from 'vue';
+import { ref, reactive, resolveComponent, h, defineComponent } from 'vue';
 import { useNamespace, useUIStore, OverlayContainer } from '@ibiz-template/vue3-util';
 import { isNumber } from 'lodash-es';
 import { ViewMode, Modal } from '@ibiz-template/runtime';
 import './app-modal-component.css';
+import { calcOpenModeStyle } from '@ibiz-template/core';
 
 "use strict";
 const AppModalComponent = /* @__PURE__ */ defineComponent({
@@ -26,10 +27,18 @@ const AppModalComponent = /* @__PURE__ */ defineComponent({
       height
     } = props.opts;
     if (width) {
-      customStyle.width = isNumber(width) ? "".concat(width, "px") : width;
+      if (isNumber(width)) {
+        customStyle.width = calcOpenModeStyle(width, "modal");
+      } else {
+        customStyle.width = width;
+      }
     }
     if (height) {
-      customStyle.height = isNumber(height) ? "".concat(height, "px") : height;
+      if (isNumber(height)) {
+        customStyle.height = calcOpenModeStyle(height, "modal");
+      } else {
+        customStyle.height = height;
+      }
     }
     const options = ref({
       footerHide: true,
@@ -76,20 +85,17 @@ const AppModalComponent = /* @__PURE__ */ defineComponent({
     };
   },
   render() {
-    return createVNode(resolveComponent("el-dialog"), {
-      "model-value": this.isShow,
-      "align-center": true,
-      "class": [this.ns.b(), this.options.placement && this.ns.m(this.options.placement), this.options.modalClass],
-      "style": this.customStyle,
-      "z-index": this.modalZIndex,
-      "onClosed": this.onClosed,
-      "before-close": this.onBeforeClose
-    }, {
-      default: () => {
-        var _a, _b;
-        return [(_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a, this.modal)];
-      }
-    });
+    var _a, _b;
+    return h(resolveComponent("el-dialog"), {
+      modelValue: this.isShow,
+      alignCenter: true,
+      class: [this.ns.b(), this.options.placement && this.ns.m(this.options.placement), this.options.modalClass],
+      style: this.customStyle,
+      zIndex: this.modalZIndex,
+      onClosed: this.onClosed,
+      onBeforeClose: this.onBeforeClose,
+      ...this.options
+    }, (_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a, this.modal));
   }
 });
 function createModal(render, opts) {