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

package/es/control/data-view/index.d.ts

@@ -56,6 +56,7 @@ export declare const IBizDataViewControl: import("@ibiz-template/vue3-util").Typ
     renderHasData: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>;
+    onShowNavView: () => void;
     renderNoData: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }> | undefined;

package/es/control/drbar/drbar.controller.mjs

@@ -265,7 +265,7 @@ class DRBarController extends ControlController {
     } else {
       await this.calcDrBarItemsState();
     }
-    if (this.form.state.isLoaded) {
+    if (this.form && this.form.state.isLoaded) {
       this.doDefaultSelect();
     }
   }
@@ -388,7 +388,7 @@ class DRBarController extends ControlController {
    * @param {string} key
    * @memberof DRBarController
    */
-  handleSelectChange(key = this.state.defaultItem, isRoutePushed = false) {
+  handleSelectChange(key = this.state.selectedItem || this.state.defaultItem, isRoutePushed = false) {
     var _a;
     if (this.state.selectedItem === key) {
       return;

package/es/control/drtab/drtab-control.util.mjs

@@ -1,5 +1,5 @@
 import { ref, watch, watchEffect, onUnmounted } from 'vue';
-import { defaultNamespace } from '../../node_modules/.pnpm/@ibiz-template_core@0.7.35-alpha.1_axios@1.7.7_lodash-es@4.17.21_qs@6.13.0_qx-util@0.4.8_ramda@0.29.1/node_modules/@ibiz-template/core/out/utils/namespace/namespace.mjs';
+import { defaultNamespace } from '../../node_modules/.pnpm/@ibiz-template_core@0.7.38-alpha.32_axios@1.7.7_lodash-es@4.17.21_qs@6.13.0_qx-util@0.4.8_ramda@0.29.1/node_modules/@ibiz-template/core/out/utils/namespace/namespace.mjs';
 
 "use strict";
 function useAppDRTab(c, controlRef, counterData) {

package/es/control/drtab/drtab.controller.d.ts

@@ -17,6 +17,18 @@ export declare class DRTabController extends ControlController<IDEDRTab, IDRTabS
      * @type {AppCounter}
      */
     counter?: AppCounter;
+    /**
+     * @description 启用缓存
+     * @type {boolean}
+     * @memberof DRTabController
+     */
+    srfCachePos: boolean;
+    /**
+     * @description 缓存标记
+     * @type {string}
+     * @memberof DRTabController
+     */
+    srfCacheKeyTempl: string;
     /**
      * 导航占位控制器
      *
@@ -39,6 +51,13 @@ export declare class DRTabController extends ControlController<IDEDRTab, IDRTabS
      * @memberof DRTabController
      */
     get routeDepth(): number | undefined;
+    /**
+     * @description 选中缓存标识
+     * @readonly
+     * @type {string}
+     * @memberof DRTabController
+     */
+    get storageTag(): string;
     /**
      * Router 对象
      *
@@ -74,13 +93,6 @@ export declare class DRTabController extends ControlController<IDEDRTab, IDRTabS
      * @memberof DRTabController
      */
     onCreated(): Promise<void>;
-    /**
-     * 部件参数解析
-     *
-     * @protected
-     * @memberof ControlController
-     */
-    protected handleControlParams(): void;
     /**
      * 通过计数器数据，计算项状态
      *
@@ -182,7 +194,7 @@ export declare class DRTabController extends ControlController<IDEDRTab, IDRTabS
      * @param {boolean} [isRoutePushed=false]
      * @return {*}  {Promise<void>}
      */
-    openNavPosView(drTabPages: IDEDRCtrlItem, isRoutePushed?: boolean): Promise<void>;
+    openNavPosView(drTabPages: IDEDRCtrlItem, isRoutePushed?: boolean, navViewKey?: string): Promise<void>;
     /**
      * 初始化计数器
      * @author lxm
@@ -191,6 +203,14 @@ export declare class DRTabController extends ControlController<IDEDRTab, IDRTabS
      * @return {*}  {Promise<void>}
      */
     protected initCounter(): Promise<void>;
+    /**
+     * 刷新
+     *
+     * @author tony001
+     * @date 2024-10-21 11:10:10
+     * @return {*}  {Promise<void>}
+     */
+    refresh(): Promise<void>;
     /**
      * 监听组件销毁
      *

package/es/control/drtab/drtab.controller.mjs

@@ -1,3 +1,4 @@
+import { createUUID } from 'qx-util';
 import { ControlController, calcItemVisibleByCounter, calcItemVisible, Srfuf, hasSubRoute, calcNavParams, CounterService } from '@ibiz-template/runtime';
 import { getNestedRoutePath } from '@ibiz-template/vue3-util';
 
@@ -18,6 +19,18 @@ class DRTabController extends ControlController {
      * @type {AppCounter}
      */
     __publicField(this, "counter");
+    /**
+     * @description 启用缓存
+     * @type {boolean}
+     * @memberof DRTabController
+     */
+    __publicField(this, "srfCachePos", false);
+    /**
+     * @description 缓存标记
+     * @type {string}
+     * @memberof DRTabController
+     */
+    __publicField(this, "srfCacheKeyTempl", "");
     /**
      * Router 对象
      *
@@ -56,6 +69,19 @@ class DRTabController extends ControlController {
   get routeDepth() {
     return this.view.modal.routeDepth;
   }
+  /**
+   * @description 选中缓存标识
+   * @readonly
+   * @type {string}
+   * @memberof DRTabController
+   */
+  get storageTag() {
+    if (this.srfCacheKeyTempl) {
+      return this.srfCacheKeyTempl;
+    }
+    const userId = this.context.srfuserid;
+    return "".concat(userId, "_").concat(this.view.model.codeName, "_").concat(this.model.codeName);
+  }
   /**
    * 设置 Router 对象
    *
@@ -96,18 +122,13 @@ class DRTabController extends ControlController {
   async onCreated() {
     await super.onCreated();
     await this.initCounter();
-  }
-  /**
-   * 部件参数解析
-   *
-   * @protected
-   * @memberof ControlController
-   */
-  handleControlParams() {
-    super.handleControlParams();
+    this.srfCacheKeyTempl = this.controlParams.srfcachekeytempl || "";
     if (this.controlParams.showmore) {
       this.state.showMore = this.controlParams.showmore === "true";
     }
+    if (this.controlParams.srfcachepos) {
+      this.srfCachePos = this.controlParams.srfcachepos.toLowerCase() === "true";
+    }
   }
   /**
    * 通过计数器数据，计算项状态
@@ -315,6 +336,10 @@ class DRTabController extends ControlController {
       this.state.activeName = this.view.state.srfnav;
     } else {
       this.state.activeName = drTabPages[0].tag;
+      if (this.srfCachePos && localStorage.getItem(this.storageTag)) {
+        const activeName = localStorage.getItem(this.storageTag);
+        this.state.activeName = activeName;
+      }
     }
     const isRoutePushed = !!this.routeDepth && hasSubRoute(this.routeDepth);
     this.handleTabChange(isRoutePushed);
@@ -332,6 +357,9 @@ class DRTabController extends ControlController {
     const drBarItem = (_a = this.model.dedrtabPages) == null ? void 0 : _a.find(
       (item) => item.id === activeName
     );
+    if (this.srfCachePos && activeName) {
+      localStorage.setItem("".concat(this.storageTag), activeName);
+    }
     if (drBarItem) {
       this.setVisible("navPos");
       this.openNavPosView(drBarItem, isRoutePushed);
@@ -408,11 +436,11 @@ class DRTabController extends ControlController {
    * @param {boolean} [isRoutePushed=false]
    * @return {*}  {Promise<void>}
    */
-  async openNavPosView(drTabPages, isRoutePushed = false) {
+  async openNavPosView(drTabPages, isRoutePushed = false, navViewKey) {
     var _a;
     const { context, params } = this.prepareParams(drTabPages);
     (_a = this.navPos) == null ? void 0 : _a.openView({
-      key: drTabPages.id,
+      key: navViewKey || drTabPages.id,
       context,
       params,
       viewId: drTabPages.appViewId,
@@ -439,6 +467,29 @@ class DRTabController extends ControlController {
       this.counter.onChange(this.calcItemStateByCounter);
     }
   }
+  /**
+   * 刷新
+   *
+   * @author tony001
+   * @date 2024-10-21 11:10:10
+   * @return {*}  {Promise<void>}
+   */
+  async refresh() {
+    var _a;
+    const { activeName } = this.state;
+    const drBarItem = (_a = this.model.dedrtabPages) == null ? void 0 : _a.find(
+      (item) => item.id === activeName
+    );
+    if (drBarItem) {
+      this.setVisible("navPos");
+      this.openNavPosView(drBarItem, false, createUUID());
+    } else {
+      this.setVisible("form");
+      if (this.routeDepth && this.state.drTabPages[0]) {
+        this.router.push(this.state.drTabPages[0].fullPath);
+      }
+    }
+  }
   /**
    * 监听组件销毁
    *

package/es/control/drtab/drtab.css

@@ -1 +1 @@
-.ibiz-control-drtab{--ibiz-control-drtab-active-color:var(--ibiz-color-primary);--ibiz-control-drtab-hover-color:var(--ibiz-color-text-0);--ibiz-control-drtab-hover-bg-color:transparent}.ibiz-control-drtab__counter{margin-left:var(--ibiz-spacing-tight)}.ibiz-control-drtab .el-tabs .el-tabs__header{margin:var(--ibiz-spacing-none)}.ibiz-control-drtab .el-tabs .el-tabs__header .el-tabs__nav-wrap{margin:var(--ibiz-spacing-none)}.ibiz-control-drtab .el-tabs .el-tabs__header .el-tabs__nav-wrap .el-tabs__nav .el-tabs__active-bar{background-color:var(--ibiz-control-drtab-active-color)}.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-control-drtab-hover-color);background-color:var(--ibiz-control-drtab-hover-bg-color)}.ibiz-control-drtab .el-tabs .el-tabs__header .el-tabs__nav-wrap .el-tabs__nav .el-tabs__item.is-active{color:var(--ibiz-control-drtab-active-color)}.ibiz-control-drtab .el-tabs .el-tabs__header .el-tabs__nav-wrap .el-tabs__nav .el-tabs__item.is-top:last-child{padding-right:var(--ibiz-spacing-none)}.ibiz-control-drtab .el-tabs.el-tabs--bottom .el-tabs__nav-scroll,.ibiz-control-drtab .el-tabs.el-tabs--top .el-tabs__nav-scroll{padding:0 var(--ibiz-spacing-base)}.ibiz-control-drtab .el-tabs__item{padding:0 var(--ibiz-spacing-base)}.ibiz-control-drtab .el-tabs__nav-next,.ibiz-control-drtab .el-tabs__nav-prev{line-height:var(--el-tabs-header-height)}.ibiz-control-drtab-pane-label__text+.ibiz-control-drtab-pane-label__counter{margin-left:var(--ibiz-spacing-tight)}.ibiz-control-drtab-more .el-tabs.el-tabs.el-tabs--top .el-tabs__header .el-tabs__nav-next,.ibiz-control-drtab-more .el-tabs.el-tabs.el-tabs--top .el-tabs__header .el-tabs__nav-prev{display:none}.ibiz-control-drtab-more .el-tabs.el-tabs.el-tabs--top .el-tabs__nav-wrap.is-scrollable{padding:var(--ibiz-spacing-none)}.ibiz-control-drtab-more-dropdown{height:100%}.ibiz-control-drtab-more-dropdown__link{position:relative;display:flex;align-items:center;font-size:var(--ibiz-font-size-regular);color:var(--ibiz-color-text-2)}.ibiz-control-drtab-more-dropdown__link svg{color:var(--ibiz-color-text-2);fill:var(--ibiz-color-text-2)}.ibiz-control-drtab-more-dropdown__link:hover{color:var(--ibiz-color-text-0)}.ibiz-control-drtab-more-dropdown__link:hover svg{color:var(--ibiz-color-text-0);fill:var(--ibiz-color-text-0)}.ibiz-control-drtab-more-dropdown__link::after{position:absolute;left:-16px;display:inline-block;width:100%;height:100%;content:""}.ibiz-control-drtab-more-dropdown-popper{width:240px}.ibiz-control-drtab-more-dropdown-popper__active{background-color:var(--ibiz-color-primary-active)}.ibiz-control-drtab-more-dropdown-popper__label{display:flex;align-items:center;width:100%;overflow:hidden}.ibiz-control-drtab-more-dropdown-popper__label--text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-control-drtab-more-dropdown-popper__label--counter{min-width:20px;margin-left:var(--ibiz-spacing-tight)}.ibiz-control-drtab-more-dropdown-popper.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list .ibiz-control-drtab-more-dropdown-popper__active.el-dropdown-menu__item{background-color:var(--ibiz-color-primary-active)}
+.ibiz-control-drtab{--ibiz-control-drtab-active-color:var(--ibiz-color-primary);--ibiz-control-drtab-hover-color:var(--ibiz-color-text-0);--ibiz-control-drtab-hover-bg-color:transparent}.ibiz-control-drtab__counter{margin-left:var(--ibiz-spacing-tight)}.ibiz-control-drtab .el-tabs .el-tabs__header{margin:var(--ibiz-spacing-none)}.ibiz-control-drtab .el-tabs .el-tabs__header .el-tabs__nav-wrap{margin:var(--ibiz-spacing-none)}.ibiz-control-drtab .el-tabs .el-tabs__header .el-tabs__nav-wrap .el-tabs__nav .el-tabs__active-bar{background-color:var(--ibiz-control-drtab-active-color)}.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-control-drtab-hover-color);background-color:var(--ibiz-control-drtab-hover-bg-color)}.ibiz-control-drtab .el-tabs .el-tabs__header .el-tabs__nav-wrap .el-tabs__nav .el-tabs__item.is-active{color:var(--ibiz-control-drtab-active-color)}.ibiz-control-drtab .el-tabs .el-tabs__header .el-tabs__nav-wrap .el-tabs__nav .el-tabs__item.is-top:last-child{padding-right:var(--ibiz-spacing-none)}.ibiz-control-drtab .el-tabs.el-tabs--bottom .el-tabs__nav-scroll,.ibiz-control-drtab .el-tabs.el-tabs--top .el-tabs__nav-scroll{padding:0 var(--ibiz-spacing-base)}.ibiz-control-drtab .el-tabs__item{padding:0 var(--ibiz-spacing-base)}.ibiz-control-drtab .el-tabs__nav-next,.ibiz-control-drtab .el-tabs__nav-prev{line-height:var(--el-tabs-header-height)}.ibiz-control-drtab-label__icon{margin-right:var(--ibiz-spacing-tight)}.ibiz-control-drtab-more .el-tabs.el-tabs.el-tabs--top .el-tabs__header .el-tabs__nav-next,.ibiz-control-drtab-more .el-tabs.el-tabs.el-tabs--top .el-tabs__header .el-tabs__nav-prev{display:none}.ibiz-control-drtab-more .el-tabs.el-tabs.el-tabs--top .el-tabs__nav-wrap.is-scrollable{padding:var(--ibiz-spacing-none)}.ibiz-control-drtab-more-dropdown{height:100%}.ibiz-control-drtab-more-dropdown__link{position:relative;display:flex;align-items:center;font-size:var(--ibiz-font-size-regular);color:var(--ibiz-color-text-2)}.ibiz-control-drtab-more-dropdown__link svg{color:var(--ibiz-color-text-2);fill:var(--ibiz-color-text-2)}.ibiz-control-drtab-more-dropdown__link:hover{color:var(--ibiz-color-text-0)}.ibiz-control-drtab-more-dropdown__link:hover svg{color:var(--ibiz-color-text-0);fill:var(--ibiz-color-text-0)}.ibiz-control-drtab-more-dropdown__link::after{position:absolute;left:-16px;display:inline-block;width:100%;height:100%;content:""}.ibiz-control-drtab-more-dropdown-popper{width:240px}.ibiz-control-drtab-more-dropdown-popper__active{background-color:var(--ibiz-color-primary-active)}.ibiz-control-drtab-more-dropdown-popper__label{display:flex;align-items:center;width:100%;overflow:hidden}.ibiz-control-drtab-more-dropdown-popper__label--text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-control-drtab-more-dropdown-popper__label--counter{min-width:20px;margin-left:var(--ibiz-spacing-tight)}.ibiz-control-drtab-more-dropdown-popper.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list .ibiz-control-drtab-more-dropdown-popper__active.el-dropdown-menu__item{background-color:var(--ibiz-color-primary-active)}.ibiz-control-drtab-dropdown-list .ibiz-badge{width:var(--ibiz-width-icon-medium);height:var(--ibiz-width-icon-medium);display:flex;align-items:center;justify-content:center;font-size:var(--ibiz-font-size-small)}.ibiz-control-drtab-dropdown-list__trigger{display:flex;cursor:pointer;align-items:center;font-size:var(--ibiz-font-size-header-5)}.ibiz-control-drtab-dropdown-list__trigger .caption{position:relative;padding:var(--ibiz-spacing-tight)}.ibiz-control-drtab-dropdown-list__trigger .caption .ibiz-badge{top:0;right:-6px;position:absolute}.ibiz-control-drtab-dropdown-list__popper{max-width:220px;min-width:150px}.ibiz-control-drtab-dropdown-list__popper--content{max-height:26vh;overflow:auto}.ibiz-control-drtab-dropdown-list__popper--item{display:flex;align-items:center}.ibiz-control-drtab-dropdown-list__popper--item .caption{padding-right:var(--ibiz-spacing-tight);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-control-drtab-dropdown-list__popper--item .ibiz-badge{width:var(--ibiz-width-icon-medium);height:var(--ibiz-width-icon-medium);display:flex;align-items:center;justify-content:center;font-size:var(--ibiz-font-size-small);margin-right:var(--ibiz-spacing-tight)}.ibiz-control-drtab-dropdown-list__popper--item ion-icon{color:var(--ibiz-color-primary);font-size:var(--ibiz-width-icon-medium)}.ibiz-control-drtab-dropdown-list__popper--item.is-active{background-color:var(--ibiz-color-fill-0)!important}.ibiz-control-drtab-dropdown-list__popper.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list{background-color:transparent}.ibiz-control-drtab-dropdown-list__popper.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list .el-dropdown-menu__item{min-height:38px;color:var(--ibiz-color-text-0);background-color:transparent}.ibiz-control-drtab-dropdown-list__popper.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list .el-dropdown-menu__item:hover{background-color:var(--ibiz-color-fill-0)}

package/es/control/drtab/drtab.d.ts

@@ -26,8 +26,10 @@ export declare const DRTabControl: import("vue").DefineComponent<{
     counterData: IData;
     visibleItems: import("vue").Ref<IData>;
     moreItems: import("vue").Ref<IData>;
+    tabPosition: string;
+    onTabChange: (key: string) => void;
     handleTabChange: () => void;
-    handleMoreChange: (key: string) => void;
+    renderDropdownList: () => JSX.Element;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelData: {
         type: PropType<IDEDRTab>;

package/es/control/drtab/drtab.mjs

@@ -1,12 +1,12 @@
-import { defineComponent, ref, reactive, onUnmounted, watch, createVNode, resolveComponent, createTextVNode } from 'vue';
+import { defineComponent, ref, reactive, computed, onUnmounted, watch, createVNode, resolveComponent, createTextVNode } from 'vue';
 import { useControlController, useNamespace, getNestedRoutePath, route2routePath } from '@ibiz-template/vue3-util';
 import { useRouter, useRoute } from 'vue-router';
 import { hasSubRoute } from '@ibiz-template/runtime';
 import { isNil } from 'ramda';
 import { showTitle } from '@ibiz-template/core';
 import { DRTabController } from './drtab.controller.mjs';
-import './drtab.css';
 import { useAppDRTab } from './drtab-control.util.mjs';
+import './drtab.css';
 
 "use strict";
 const DRTabControl = /* @__PURE__ */ defineComponent({
@@ -29,6 +29,7 @@ const DRTabControl = /* @__PURE__ */ defineComponent({
     }
   },
   setup() {
+    var _a;
     const c = useControlController((...args) => new DRTabController(...args));
     const ns = useNamespace("control-".concat(c.model.controlType.toLowerCase()));
     const router = useRouter();
@@ -41,20 +42,24 @@ const DRTabControl = /* @__PURE__ */ defineComponent({
     const fn = (counter) => {
       Object.assign(counterData, counter);
     };
+    const tabPosition = ((_a = c.view.model.tabLayout) == null ? void 0 : _a.toLowerCase()) || "top";
     c.evt.on("onCreated", () => {
       if (c.counter) {
         c.counter.onChange(fn, true);
       }
     });
+    const activeTab = computed(() => {
+      return c.state.drTabPages.find((tab) => tab.tag === c.state.activeName);
+    });
     onUnmounted(() => {
-      var _a;
-      (_a = c.counter) == null ? void 0 : _a.offChange(fn);
+      var _a2;
+      (_a2 = c.counter) == null ? void 0 : _a2.offChange(fn);
     });
     c.setRouter(router);
     const handleTabChange = () => {
       c.handleTabChange();
     };
-    const handleMoreChange = (key) => {
+    const onTabChange = (key) => {
       c.state.activeName = key;
       c.handleTabChange();
     };
@@ -93,6 +98,55 @@ const DRTabControl = /* @__PURE__ */ defineComponent({
         immediate: true
       });
     }
+    const renderDropdownList = () => {
+      return createVNode(resolveComponent("el-dropdown"), {
+        "trigger": "click",
+        "class": ns.b("dropdown-list"),
+        "popper-class": ns.be("dropdown-list", "popper"),
+        "onCommand": onTabChange
+      }, {
+        default: () => {
+          var _a2, _b, _c;
+          return createVNode("div", {
+            "class": ns.be("dropdown-list", "trigger")
+          }, [((_a2 = activeTab.value) == null ? void 0 : _a2.sysImage) && createVNode(resolveComponent("iBizIcon"), {
+            "icon": activeTab.value.sysImage
+          }, null), createVNode("div", {
+            "class": "caption"
+          }, [(_b = activeTab.value) == null ? void 0 : _b.caption, ((_c = activeTab.value) == null ? void 0 : _c.counterId) && createVNode(resolveComponent("iBizBadge"), {
+            "value": counterData[activeTab.value.counterId],
+            "counterMode": activeTab.value.counterMode
+          }, null)]), createVNode("ion-icon", {
+            "name": "chevron-down-outline"
+          }, null)]);
+        },
+        dropdown: () => {
+          return createVNode("div", {
+            "class": ns.bem("dropdown-list", "popper", "content")
+          }, [c.state.drTabPages.map((tab) => {
+            if (!tab.hidden) {
+              return createVNode(resolveComponent("el-dropdown-item"), {
+                "class": [ns.bem("dropdown-list", "popper", "item"), ns.is("active", tab.tag === c.state.activeName)],
+                "command": tab.tag,
+                "disabled": tab.disabled
+              }, {
+                default: () => [tab.sysImage && createVNode(resolveComponent("iBizIcon"), {
+                  "icon": tab.sysImage
+                }, null), createVNode("span", {
+                  "class": "caption"
+                }, [tab.caption]), tab.counterId && createVNode(resolveComponent("iBizBadge"), {
+                  "value": counterData[tab.counterId],
+                  "counterMode": tab.counterMode
+                }, null), tab.tag === c.state.activeName && createVNode("ion-icon", {
+                  "name": "checkmark-outline"
+                }, null)]
+              });
+            }
+            return null;
+          })]);
+        }
+      });
+    };
     return {
       c,
       ns,
@@ -100,8 +154,10 @@ const DRTabControl = /* @__PURE__ */ defineComponent({
       counterData,
       visibleItems,
       moreItems,
+      tabPosition,
+      onTabChange,
       handleTabChange,
-      handleMoreChange
+      renderDropdownList
     };
   },
   render() {
@@ -137,7 +193,7 @@ const DRTabControl = /* @__PURE__ */ defineComponent({
             return this.moreItems.map((item) => {
               return createVNode(resolveComponent("el-dropdown-item"), {
                 "class": [this.c.state.activeName === item.tag ? this.ns.be("more-dropdown-popper", "active") : ""],
-                "onClick": () => this.handleMoreChange(item.tag)
+                "onClick": () => this.onTabChange(item.tag)
               }, {
                 default: () => [createVNode("span", {
                   "class": [this.ns.be("more-dropdown-popper", "label")]
@@ -160,7 +216,7 @@ const DRTabControl = /* @__PURE__ */ defineComponent({
       "controller": this.c,
       "class": [this.ns.b(), this.moreItems.length > 0 ? this.ns.b("more") : ""]
     }, {
-      default: () => [isCreated && isCalculatedPermission && createVNode(resolveComponent("el-tabs"), {
+      default: () => [isCreated && isCalculatedPermission && this.tabPosition === "top_dropdownlist" ? this.renderDropdownList() : createVNode(resolveComponent("el-tabs"), {
         "modelValue": this.c.state.activeName,
         "onUpdate:modelValue": ($event) => this.c.state.activeName = $event,
         "onTabChange": this.handleTabChange
@@ -177,7 +233,10 @@ const DRTabControl = /* @__PURE__ */ defineComponent({
               label: () => {
                 return createVNode("span", {
                   "class": this.ns.b("label")
-                }, [createVNode("span", {
+                }, [tab.sysImage && createVNode(resolveComponent("iBizIcon"), {
+                  "class": this.ns.be("label", "icon"),
+                  "icon": tab.sysImage
+                }, null), createVNode("span", {
                   "class": this.ns.be("label", "text")
                 }, [tab.caption]), !isNil(counterNum) && createVNode(resolveComponent("iBizBadge"), {
                   "class": this.ns.e("counter"),

package/es/control/drtab/index.d.ts

@@ -22,8 +22,10 @@ export declare const IBizDRTabControl: import("@ibiz-template/vue3-util").TypeWi
     counterData: IData;
     visibleItems: import("vue").Ref<IData>;
     moreItems: import("vue").Ref<IData>;
+    tabPosition: string;
+    onTabChange: (key: string) => void;
     handleTabChange: () => void;
-    handleMoreChange: (key: string) => void;
+    renderDropdownList: () => JSX.Element;
 }, 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").IDEDRTab>;

package/es/control/form/form-detail/form-group-panel/form-group-panel.mjs

@@ -126,7 +126,7 @@ const FormGroupPanel = /* @__PURE__ */ defineComponent({
       }, [!state.isShowMore ? ibiz.i18n.t("control.form.formGroupPanel.showMore") : ibiz.i18n.t("app.retract")])]);
     }
     return createVNode("div", {
-      "id": this.modelData.id,
+      "id": "".concat(this.controller.form.view.model.codeName, "_").concat(this.controller.form.model.codeName, "_").concat(this.modelData.codeName),
       "class": classArr,
       "onClick": (event) => this.controller.onClick(event)
     }, [header, createVNode("div", {

package/es/control/form/form-detail/form-item/form-item.d.ts

@@ -18,6 +18,7 @@ export declare const FormItem: import("vue").DefineComponent<{
 }, {
     ns: import("@ibiz-template/core").Namespace;
     c: FormItemController;
+    extraParams: import("vue").Ref<{}>;
     onValueChange: (val: unknown, name?: string) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelData: {

package/es/control/form/form-detail/form-item/form-item.mjs

@@ -1,4 +1,4 @@
-import { isVNode, defineComponent, resolveComponent, h, createVNode } from 'vue';
+import { isVNode, defineComponent, ref, resolveComponent, h, createVNode } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import './form-item.css';
 import { FormItemController } from '@ibiz-template/runtime';
@@ -24,14 +24,32 @@ const FormItem = /* @__PURE__ */ defineComponent({
     }
   },
   setup(props) {
+    var _a, _b, _c, _d;
     const ns = useNamespace("form-item");
     const c = props.controller;
     const onValueChange = (val, name) => {
       props.controller.setDataValue(val, name);
     };
+    const extraParams = ref({});
+    let emptyHiddenUnit = ibiz.config.form.emptyHiddenUnit;
+    const emptyhiddenunit = (_b = (_a = props.controller.form) == null ? void 0 : _a.controlParams) == null ? void 0 : _b.emptyhiddenunit;
+    if (emptyhiddenunit) {
+      emptyHiddenUnit = Object.is(emptyhiddenunit, "true");
+    }
+    const editorParams = ((_d = (_c = props.controller.editor) == null ? void 0 : _c.model) == null ? void 0 : _d.editorParams) || {};
+    const {
+      EMPTYHIDDENUNIT
+    } = editorParams;
+    if (EMPTYHIDDENUNIT) {
+      emptyHiddenUnit = Object.is(EMPTYHIDDENUNIT, "true");
+    }
+    Object.assign(extraParams.value, {
+      emptyHiddenUnit
+    });
     return {
       ns,
       c,
+      extraParams,
       onValueChange
     };
   },
@@ -50,6 +68,7 @@ const FormItem = /* @__PURE__ */ defineComponent({
       disabled: this.controller.state.disabled,
       readonly: this.controller.state.readonly,
       onChange: this.onValueChange,
+      extraParams: this.extraParams,
       controlParams: editMode ? {
         ...this.controller.form.controlParams,
         editmode: editMode
@@ -75,7 +94,7 @@ const FormItem = /* @__PURE__ */ defineComponent({
       }
     }
     return createVNode(resolveComponent("iBizFormItemContainer"), {
-      "id": this.c.model.id,
+      "id": "".concat(this.controller.form.view.model.codeName, "_").concat(this.controller.form.model.codeName, "_").concat(this.modelData.codeName),
       "class": [this.ns.b(), this.ns.m(this.modelData.id), ...this.controller.containerClass],
       "style": this.modelData.cssStyle,
       "required": this.c.state.required,

package/es/control/form/form-detail/form-item/index.d.ts

@@ -15,6 +15,7 @@ export declare const IBizFormItem: import("@ibiz-template/vue3-util").TypeWithIn
 }, {
     ns: import("@ibiz-template/core").Namespace;
     c: import("@ibiz-template/runtime").FormItemController;
+    extraParams: import("vue").Ref<{}>;
     onValueChange: (val: unknown, name?: string | undefined) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelData: {