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

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/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/util/app-drawer/app-drawer-component.mjs

@@ -3,6 +3,7 @@ import { useNamespace, useUIStore, OverlayContainer } from '@ibiz-template/vue3-
 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;
       }

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

@@ -3,6 +3,7 @@ import { useNamespace, useUIStore, OverlayContainer } from '@ibiz-template/vue3-
 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,

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

@@ -1,8 +1,10 @@
-import { ref, onUnmounted, createVNode, defineComponent } from 'vue';
+import { ref, reactive, onUnmounted, createVNode, defineComponent } from 'vue';
 import { offset, flip, shift, arrow, computePosition, autoUpdate } from '@floating-ui/dom';
 import { ViewMode, Modal } from '@ibiz-template/runtime';
 import { useNamespace, useUIStore, OverlayPopoverContainer } from '@ibiz-template/vue3-util';
 import './app-popover-component.css';
+import { isNumber } from 'lodash-es';
+import { calcOpenModeStyle } from '@ibiz-template/core';
 
 "use strict";
 async function computePos(element, el, arrEl, opts) {
@@ -70,6 +72,25 @@ const AppPopoverComponent = /* @__PURE__ */ defineComponent({
       zIndex
     } = useUIStore();
     const popoverZIndex = zIndex.increment();
+    const customStyle = reactive({});
+    const {
+      width,
+      height
+    } = props.opts;
+    if (width) {
+      if (isNumber(width)) {
+        customStyle.width = calcOpenModeStyle(width, "popover");
+      } else {
+        customStyle.width = width;
+      }
+    }
+    if (height) {
+      if (isNumber(height)) {
+        customStyle.height = calcOpenModeStyle(height, "popover");
+      } else {
+        customStyle.height = height;
+      }
+    }
     const modal = new Modal({
       mode: ViewMode.POPOVER,
       viewUsage: 2,
@@ -107,7 +128,8 @@ const AppPopoverComponent = /* @__PURE__ */ defineComponent({
       popoverZIndex,
       onMaskClick,
       present,
-      dismiss
+      dismiss,
+      customStyle
     };
   },
   render() {
@@ -115,6 +137,7 @@ const AppPopoverComponent = /* @__PURE__ */ defineComponent({
     const content = createVNode("div", {
       "class": [this.ns.b(), this.ns.is("show", this.isShow)],
       "ref": "el",
+      "style": this.customStyle,
       "onClick": (e) => {
         e.stopPropagation();
       }

package/es/util/notification-util/notification-util.mjs

@@ -53,6 +53,7 @@ class NotificationUtil {
       title: params.title,
       message: params.desc,
       type: noticeType,
+      position: params.position || "top-right",
       duration
     });
   }

package/es/util/open-view-util/open-view-util.mjs

@@ -57,6 +57,13 @@ class OpenViewUtil {
   }
   async popover(appViewId, event, context, params, options = {}) {
     const appView = await ibiz.hub.config.view.get(appViewId);
+    const opts = {
+      width: appView.width,
+      height: appView.height,
+      autoClose: true,
+      placement: "bottom",
+      ...options
+    };
     return openViewPopover(
       event,
       {
@@ -64,7 +71,7 @@ class OpenViewUtil {
         params,
         viewId: appView.id
       },
-      { autoClose: true, placement: "bottom", ...options }
+      opts
     );
   }
   /**

package/es/view-engine/report-view.engine.d.ts

@@ -87,6 +87,25 @@ export declare class ReportViewEngine extends ViewEngineBase {
      * @memberof ReportViewEngine
      */
     protected calcViewHeaderVisible(): boolean;
+    /**
+     * 计算搜索栏显示
+     *
+     * @author zk
+     * @date 2024-01-29 05:01:36
+     * @protected
+     * @return {*}  {boolean}
+     * @memberof MDViewEngine
+     */
+    protected calcViewSearchBarVisible(): boolean;
+    /**
+     * 计算移除的模型名称
+     *
+     * @author zk
+     * @date 2024-01-29 03:01:42
+     * @return {*}  {string[]}
+     * @memberof MDViewEngine
+     */
+    calcRemoveLayoutModel(): string[];
     /**
      * 切换搜索表单的显示与否
      *

package/es/view-engine/report-view.engine.mjs

@@ -1,4 +1,4 @@
-import { ViewEngineBase, SysUIActionTag } from '@ibiz-template/runtime';
+import { ViewEngineBase, SysUIActionTag, getControl } from '@ibiz-template/runtime';
 
 "use strict";
 class ReportViewEngine extends ViewEngineBase {
@@ -149,16 +149,43 @@ class ReportViewEngine extends ViewEngineBase {
    * @memberof ReportViewEngine
    */
   calcViewHeaderVisible() {
-    let showHeader = super.calcViewHeaderVisible();
-    if (!this.searchBar || !this.searchBar.state.visible) {
-      const controller = this.viewLayoutPanel.panelItems.view_searchbar;
-      if (controller) {
-        controller.state.visible = false;
-      }
-    } else {
-      showHeader = true;
+    const showHeader = super.calcViewHeaderVisible();
+    const visible = this.calcViewSearchBarVisible();
+    return visible || showHeader;
+  }
+  /**
+   * 计算搜索栏显示
+   *
+   * @author zk
+   * @date 2024-01-29 05:01:36
+   * @protected
+   * @return {*}  {boolean}
+   * @memberof MDViewEngine
+   */
+  calcViewSearchBarVisible() {
+    const { model } = this.view;
+    const has = this.isExistAndInLayout("searchbar");
+    if (!has) {
+      return has;
+    }
+    const searchBar = getControl(model, "searchbar");
+    const visible = !!(searchBar.enableQuickSearch || searchBar.enableGroup || searchBar.enableFilter === true);
+    return visible;
+  }
+  /**
+   * 计算移除的模型名称
+   *
+   * @author zk
+   * @date 2024-01-29 03:01:42
+   * @return {*}  {string[]}
+   * @memberof MDViewEngine
+   */
+  calcRemoveLayoutModel() {
+    const names = super.calcRemoveLayoutModel();
+    if (!this.calcViewSearchBarVisible()) {
+      names.push("view_searchbar");
     }
-    return showHeader;
+    return names;
   }
   /**
    * 切换搜索表单的显示与否

package/es/view-engine/tab-exp-view.engine.mjs

@@ -1,5 +1,5 @@
 import { ModelError } from '@ibiz-template/core';
-import { ViewEngineBase, calcDeCodeNameById } from '@ibiz-template/runtime';
+import { ViewEngineBase, calcDeCodeNameById, getControl } from '@ibiz-template/runtime';
 
 "use strict";
 class TabExpViewEngine extends ViewEngineBase {
@@ -20,6 +20,7 @@ class TabExpViewEngine extends ViewEngineBase {
    */
   async onCreated() {
     var _a;
+    this.preprocessTabExpModelLayout();
     await super.onCreated();
     const { childNames, model } = this.view;
     childNames.push("tabexppanel");
@@ -31,7 +32,6 @@ class TabExpViewEngine extends ViewEngineBase {
       (item) => item.id === "srfdefaultnav"
     )) == null ? void 0 : _a.value;
     this.view.slotProps.tabexppanel.defaultTabName = this.view.state.srfnav || srfdefaultnav;
-    this.preprocessTabExpModelLayout();
   }
   async onMounted() {
     await super.onMounted();
@@ -142,7 +142,7 @@ class TabExpViewEngine extends ViewEngineBase {
   calcViewHeaderVisible() {
     let showHeader = super.calcViewHeaderVisible();
     const { tabLayout } = this.view.model;
-    if ((tabLayout === void 0 || tabLayout === "TOP") && this.tabExpPanel) {
+    if (tabLayout === void 0 || tabLayout === "TOP" && getControl(this.view.model, "tabexppanel")) {
       showHeader = true;
     }
     return showHeader;

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

@@ -62,7 +62,8 @@ const IBizGridSetting = /* @__PURE__ */ vue.defineComponent({
   render() {
     return vue.createVNode(vue.resolveComponent("el-popover"), {
       "placement": "right-start",
-      "trigger": "click"
+      "trigger": "click",
+      "width": "auto"
     }, {
       reference: () => {
         return vue.createVNode("ion-icon", {
@@ -91,9 +92,27 @@ const IBizGridSetting = /* @__PURE__ */ vue.defineComponent({
             return vue.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 && vue.createVNode("img", {
-              "src": "./assets/iconfont/svg/drag.svg"
-            }, null), state.caption]);
+            }, [this.isDraggable && !state.fixed && vue.createVNode(vue.resolveComponent("iBizIcon"), {
+              "class": this.ns.b("drag-icon"),
+              "icon": {
+                imagePath: "svg/drag.svg"
+              },
+              "baseDir": "iconfont"
+            }, null), vue.createVNode(vue.resolveComponent("iBizIcon"), {
+              "class": this.ns.b("disable-icon"),
+              "icon": {
+                imagePath: "svg/disable.svg"
+              },
+              "baseDir": "iconfont"
+            }, null), vue.createVNode(vue.resolveComponent("iBizIcon"), {
+              "class": this.ns.b("enable-icon"),
+              "icon": {
+                imagePath: "svg/enable.svg"
+              },
+              "baseDir": "iconfont"
+            }, null), vue.createVNode("div", {
+              "class": this.ns.b("state-caption")
+            }, [state.caption])]);
           }
         });
       }

package/lib/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/lib/control/calendar/calendar.cjs

@@ -109,7 +109,7 @@ const CalendarControl = /* @__PURE__ */ vue.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/lib/control/data-view/data-view.cjs

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

package/lib/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/lib/control/search-bar/search-groups/search-groups.cjs

@@ -3,7 +3,7 @@
 var vue = require('vue');
 var vue3Util = require('@ibiz-template/vue3-util');
 require('./search-groups.css');
-var ElementPlus = require('element-plus');
+var elementPlus = require('element-plus');
 var draggable = require('vuedraggable');
 var core = require('@ibiz-template/core');
 var newGroupUtil = require('./new-group-util.cjs');
@@ -80,7 +80,7 @@ const SearchGroups = /* @__PURE__ */ vue.defineComponent({
       editForm.caption = groupItem.caption || groupItem.name;
     };
     const removeGroup = (groupItem) => {
-      ElementPlus.ElMessageBox({
+      elementPlus.ElMessageBox({
         title: "\u786E\u8BA4\u5220\u9664",
         message: () => {
           return vue.createVNode("div", {

package/lib/control/tab-exp-panel/tab-exp-panel.cjs

@@ -4,6 +4,7 @@ var vue = require('vue');
 var vue3Util = require('@ibiz-template/vue3-util');
 require('./tab-exp-panel.css');
 var runtime = require('@ibiz-template/runtime');
+var vueRouter = require('vue-router');
 
 "use strict";
 function _isSlot(s) {
@@ -40,6 +41,36 @@ const TabExpPanelControl = /* @__PURE__ */ vue.defineComponent({
       c.handleTabChange();
     };
     const tabPosition = ((_a = c.view.model.tabLayout) == null ? void 0 : _a.toLowerCase()) || "top";
+    const route = vueRouter.useRoute();
+    vue.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/lib/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/lib/editor/html/wang-editor/wang-editor.cjs

@@ -8,7 +8,7 @@ var qxUtil = require('qx-util');
 var ramda = require('ramda');
 var vue3Util = require('@ibiz-template/vue3-util');
 var core = require('@ibiz-template/core');
-var ElementPlus = require('element-plus');
+var elementPlus = require('element-plus');
 require('./wang-editor.css');
 
 "use strict";
@@ -267,7 +267,7 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
     };
     const cancelEdit = () => {
       if (props.value !== valueHtml.value) {
-        ElementPlus.ElMessageBox({
+        elementPlus.ElMessageBox({
           title: "\u786E\u8BA4\u53D6\u6D88",
           type: "warning",
           customClass: ns.b("message"),