@ibiz-template/vue3-components 0.7.38-alpha.43 → 0.7.39

package/es/control/dashboard/custom-dashboard-container/custom-dashboard-container.d.ts

@@ -2233,6 +2233,7 @@ export declare const CustomDashboardContainer: import("vue").DefineComponent<{
                         layoutPanel?: any | undefined;
                         getController: (name: string, traceRoot?: boolean | undefined) => import("@ibiz-template/runtime").IController<import("@ibiz/model-core").IModelObject, object, import("@ibiz-template/runtime").IComponentEvent> | undefined;
                         getTopView: () => import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>;
+                        getCtx: () => import("@ibiz-template/runtime").CTX<import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>>;
                         created: () => Promise<void>;
                         destroyed: () => Promise<void>;
                         force: (_callback?: (() => void) | undefined) => void;
@@ -5163,6 +5164,7 @@ export declare const CustomDashboardContainer: import("vue").DefineComponent<{
                     childNames: string[];
                     getController: (name: string, traceRoot?: boolean | undefined) => import("@ibiz-template/runtime").IController<import("@ibiz/model-core").IModelObject, object, import("@ibiz-template/runtime").IComponentEvent> | undefined;
                     getTopView: () => import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>;
+                    getCtx: () => import("@ibiz-template/runtime").CTX<import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>>;
                     created: () => Promise<void>;
                     destroyed: () => Promise<void>;
                     force: (_callback?: (() => void) | undefined) => void;
@@ -5208,6 +5210,7 @@ export declare const CustomDashboardContainer: import("vue").DefineComponent<{
                 endLoading: () => void;
                 onActivated: () => void;
                 onDeactivated: () => void;
+                initTimeoutTimer: () => void;
                 readonly id: string;
                 state: {
                     activated: boolean;
@@ -9236,6 +9239,7 @@ export declare const CustomDashboardContainer: import("vue").DefineComponent<{
                 childNames: string[];
                 getController: (name: string, traceRoot?: boolean | undefined) => import("@ibiz-template/runtime").IController<import("@ibiz/model-core").IModelObject, object, import("@ibiz-template/runtime").IComponentEvent> | undefined;
                 getTopView: () => import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>;
+                getCtx: () => import("@ibiz-template/runtime").CTX<import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>>;
                 created: () => Promise<void>;
                 destroyed: () => Promise<void>;
                 force: (_callback?: (() => void) | undefined) => void;
@@ -12241,6 +12245,7 @@ export declare const CustomDashboardContainer: import("vue").DefineComponent<{
                     layoutPanel?: any | undefined;
                     getController: (name: string, traceRoot?: boolean | undefined) => import("@ibiz-template/runtime").IController<import("@ibiz/model-core").IModelObject, object, import("@ibiz-template/runtime").IComponentEvent> | undefined;
                     getTopView: () => import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>;
+                    getCtx: () => import("@ibiz-template/runtime").CTX<import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>>;
                     created: () => Promise<void>;
                     destroyed: () => Promise<void>;
                     force: (_callback?: (() => void) | undefined) => void;
@@ -12364,6 +12369,7 @@ export declare const CustomDashboardContainer: import("vue").DefineComponent<{
                     endLoading: () => void;
                     onActivated: () => void;
                     onDeactivated: () => void;
+                    initTimeoutTimer: () => void;
                     readonly id: string;
                     state: {
                         activated: boolean;
@@ -16183,6 +16189,7 @@ export declare const CustomDashboardContainer: import("vue").DefineComponent<{
                     childNames: string[];
                     getController: (name: string, traceRoot?: boolean | undefined) => import("@ibiz-template/runtime").IController<import("@ibiz/model-core").IModelObject, object, import("@ibiz-template/runtime").IComponentEvent> | undefined;
                     getTopView: () => import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>;
+                    getCtx: () => import("@ibiz-template/runtime").CTX<import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>>;
                     created: () => Promise<void>;
                     destroyed: () => Promise<void>;
                     force: (_callback?: (() => void) | undefined) => void;
@@ -19169,6 +19176,7 @@ export declare const CustomDashboardContainer: import("vue").DefineComponent<{
                 childNames: string[];
                 getController: (name: string, traceRoot?: boolean | undefined) => import("@ibiz-template/runtime").IController<import("@ibiz/model-core").IModelObject, object, import("@ibiz-template/runtime").IComponentEvent> | undefined;
                 getTopView: () => import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>;
+                getCtx: () => import("@ibiz-template/runtime").CTX<import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>>;
                 created: () => Promise<void>;
                 destroyed: () => Promise<void>;
                 force: (_callback?: (() => void) | undefined) => void;
@@ -21303,6 +21311,7 @@ export declare const CustomDashboardContainer: import("vue").DefineComponent<{
             force: (_callback?: (() => void) | undefined) => void;
             getController: (name: string, traceRoot?: boolean | undefined) => import("@ibiz-template/runtime").IController<import("@ibiz/model-core").IModelObject, object, import("@ibiz-template/runtime").IComponentEvent> | undefined;
             getTopView: () => import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>;
+            getCtx: () => import("@ibiz-template/runtime").CTX<import("@ibiz-template/runtime").IViewController<import("@ibiz/model-core").IAppView, import("@ibiz-template/runtime").IViewState, import("@ibiz-template/runtime").IViewEvent>>;
             listenNewController: (cb: (name: string, c: import("@ibiz-template/runtime").IController<import("@ibiz/model-core").IModelObject, object, import("@ibiz-template/runtime").IComponentEvent>) => void) => void;
         };
         customModelData: IData[];

package/es/control/dashboard/custom-dashboard-container/custom-dashboard-container.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, reactive, ref, nextTick, onMounted, createVNode, resolveComponent } from 'vue';
+import { reactive, ref, nextTick, onMounted, resolveComponent, createVNode, resolveDirective, withDirectives, defineComponent } from 'vue';
 import { CustomDashboardController } from '@ibiz-template/runtime';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import './custom-dashboard-container.css';
@@ -151,7 +151,7 @@ const CustomDashboardContainer = /* @__PURE__ */ defineComponent({
   },
   render() {
     var _a, _b;
-    return createVNode("div", {
+    return withDirectives(createVNode("div", {
       "class": [this.ns.b()]
     }, [this.customC.showDesignBtn ? createVNode("div", {
       "class": this.ns.b("build-btn")
@@ -211,7 +211,7 @@ const CustomDashboardContainer = /* @__PURE__ */ defineComponent({
       return createVNode("div", {
         "style": itemStyle
       }, [(_b2 = (_a2 = this.$slots)[item.portletCodeName]) == null ? void 0 : _b2.call(_a2)]);
-    }))]);
+    }))]), [[resolveDirective("loading"), !this.isInited]]);
   }
 });
 

package/es/control/dashboard/dashboard-design/dashboard-design.css

@@ -1 +1 @@
-.ibiz-dashboard-design{width:100%;height:100%}.ibiz-dashboard-design .ibiz-dashboard-design-header{height:48px;padding:var(--ibiz-spacing-tight);display:flex;align-items:center;justify-content:space-between}.ibiz-dashboard-design .ibiz-dashboard-design-header .ibiz-dashboard-design-header-utils{display:flex;align-items:center;justify-content:flex-start}.ibiz-dashboard-design-header-utils__col-num{margin-right:var(--ibiz-spacing-tight)}.ibiz-dashboard-design-header-utils__row-h{margin-right:var(--ibiz-spacing-tight)}.ibiz-dashboard-design .ibiz-dashboard-design-content{width:100%;height:calc(100% - 48px);display:flex;align-items:flex-start;justify-content:flex-start}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree{min-width:300px;height:100%;overflow-y:scroll}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-filter{width:100%;height:32px;padding:var(--ibiz-spacing-none) var(--ibiz-spacing-tight)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content{height:calc(100% - 32px);overflow:auto}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu{height:100%;border:none}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item{display:flex;flex-flow:flex nowrap;align-items:center;justify-content:space-between}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item>span{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item ion-icon{font-size:calc(var(--ibiz-width-icon-medium) - 2px);cursor:pointer}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item ion-icon:hover{color:var(--ibiz-color-primary)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-scroll-box{flex-grow:1;height:100%;overflow-y:scroll;background:var(--ibiz-color-fill-1)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel{position:relative}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout-mask{position:absolute;inset:0;height:100%;min-height:1248px;background:linear-gradient(to bottom,var(--ibiz-color-primary) 10px,transparent 10px),linear-gradient(to right,var(--ibiz-color-primary) 10px,transparent 10px)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item{width:100%;height:100%}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .el-card__body{display:flex;flex-flow:column nowrap;height:100%;background-color:var(--ibiz-color-bg-1)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .ibiz-dashboard-design-grid-layout-item-header{display:flex;align-items:center;justify-content:space-between}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .ibiz-dashboard-design-grid-layout-item-header>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .ibiz-dashboard-design-grid-layout-item-header ion-icon{cursor:pointer}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .ibiz-dashboard-design-grid-layout-item-content{display:flex;align-items:center;justify-content:center;width:100%;height:100%;pointer-events:none}
+.ibiz-dashboard-design{width:100%;height:100%}.ibiz-dashboard-design .ibiz-dashboard-design-header{height:48px;padding:var(--ibiz-spacing-tight);display:flex;align-items:center;justify-content:space-between}.ibiz-dashboard-design .ibiz-dashboard-design-header .ibiz-dashboard-design-header-utils{display:flex;align-items:center;justify-content:flex-start}.ibiz-dashboard-design-header-utils__col-num{margin-right:var(--ibiz-spacing-tight)}.ibiz-dashboard-design-header-utils__row-h{margin-right:var(--ibiz-spacing-tight)}.ibiz-dashboard-design .ibiz-dashboard-design-content{width:100%;height:calc(100% - 48px);display:flex;align-items:flex-start;justify-content:flex-start}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree{min-width:300px;height:100%;overflow-y:scroll}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-filter{width:100%;height:32px;padding:var(--ibiz-spacing-none) var(--ibiz-spacing-tight)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content{height:calc(100% - 32px);overflow:auto}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu{height:100%;border:none}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item{display:flex;flex-flow:flex nowrap;align-items:center;justify-content:space-between}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item>span{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item ion-icon{font-size:calc(var(--ibiz-width-icon-medium) - 2px);cursor:pointer}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-tree .ibiz-dashboard-design-tree-content>.el-menu .el-menu-item ion-icon:hover{color:var(--ibiz-color-primary)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-scroll-box{flex-grow:1;height:100%;overflow-y:scroll;background:var(--ibiz-color-fill-1)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel{position:relative}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout-mask{position:absolute;inset:0;height:100%;min-height:1248px;background:linear-gradient(to bottom,var(--ibiz-color-primary) 10px,transparent 10px),linear-gradient(to right,var(--ibiz-color-primary) 10px,transparent 10px)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item{width:100%;height:100%}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .el-card__body{display:flex;flex-flow:column nowrap;height:100%;position:relative;background-color:var(--ibiz-color-bg-1)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .ibiz-dashboard-design-grid-layout-item-icon{cursor:pointer;position:absolute;right:var(--ibiz-spacing-tight);top:var(--ibiz-spacing-tight)}.ibiz-dashboard-design .ibiz-dashboard-design-content .ibiz-dashboard-design-panel .ibiz-dashboard-design-grid-layout .ibiz-dashboard-design-grid-layout-item .ibiz-dashboard-design-grid-layout-item-content{display:flex;align-items:center;justify-content:center;width:100%;height:100%;pointer-events:none}

package/es/control/dashboard/dashboard-design/dashboard-design.mjs

@@ -1,4 +1,4 @@
-import { isVNode, defineComponent, ref, computed, watch, onUnmounted, createVNode, resolveComponent, h, createTextVNode, withDirectives, resolveDirective } from 'vue';
+import { isVNode, ref, computed, watch, onUnmounted, resolveComponent, createVNode, h, createTextVNode, resolveDirective, withDirectives, defineComponent } from 'vue';
 import { getPortletProvider } from '@ibiz-template/runtime';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { showTitle } from '@ibiz-template/core';
@@ -559,12 +559,12 @@ const DashboardDesign = /* @__PURE__ */ defineComponent({
         default: () => [createVNode(resolveComponent("el-card"), {
           "class": this.ns.b("grid-layout-item")
         }, {
-          default: () => [createVNode("div", {
-            "class": this.ns.b("grid-layout-item-header")
-          }, [createVNode("span", null, [item.portletName]), createVNode("ion-icon", {
+          default: () => [createVNode("ion-icon", {
             "name": "close-outline",
-            "onClick": () => this.removeItem(item)
-          }, null)]), createVNode("div", {
+            "title": ibiz.i18n.t("app.delete"),
+            "onClick": () => this.removeItem(item),
+            "class": this.ns.b("grid-layout-item-icon")
+          }, null), createVNode("div", {
             "class": this.ns.b("grid-layout-item-content")
           }, [renderPortlet(item)])]
         })]

package/es/control/dashboard/dashboard-design/dashboard-design.util.mjs

@@ -11,8 +11,8 @@ function calcGridSpanOffset(layoutPos) {
     colMDOffset,
     colLGOffset
   } = layoutPos;
-  const _span = colXS || colSM || colMD || colLG;
-  const _offset = colXSOffset || colSMOffset || colMDOffset || colLGOffset;
+  const _span = colLG || colMD || colSM || colXS;
+  const _offset = colLGOffset || colMDOffset || colSMOffset || colXSOffset;
   const spanDefault = layout === "TABLE_24COL" ? 24 : 12;
   const span = !_span || _span === -1 ? 1 : _span / spanDefault;
   const offset = !_offset || _offset === -1 ? 0 : _offset / spanDefault;

package/es/control/dashboard/dashboard.mjs

@@ -1,4 +1,4 @@
-import { isVNode, createVNode, resolveComponent, h, defineComponent, getCurrentInstance, ref, isReactive, reactive } from 'vue';
+import { isVNode, createVNode, resolveComponent, h, getCurrentInstance, ref, isReactive, reactive, defineComponent } from 'vue';
 import { useControlController, useNamespace } from '@ibiz-template/vue3-util';
 import './dashboard.css';
 import { DashboardController } from '@ibiz-template/runtime';

package/es/control/dashboard/index.mjs

@@ -1,4 +1,4 @@
-import { registerControlProvider, ControlType } from '@ibiz-template/runtime';
+import { ControlType, registerControlProvider } from '@ibiz-template/runtime';
 import { withInstall } from '@ibiz-template/vue3-util';
 import { DashboardControl } from './dashboard.mjs';
 import { DashboardDesign } from './dashboard-design/dashboard-design.mjs';

package/es/control/dashboard/portlet/actionbar-portlet/actionbar-portlet.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, createVNode, resolveComponent } from 'vue';
+import { resolveComponent, createVNode, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { ActionBarPortletController } from '@ibiz-template/runtime';
 

package/es/control/dashboard/portlet/chart-portlet/chart-portlet.mjs

@@ -1,4 +1,4 @@
-import { isVNode, defineComponent, onMounted, onBeforeUnmount, createVNode, resolveComponent, h } from 'vue';
+import { isVNode, onMounted, onBeforeUnmount, resolveComponent, h, createVNode, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { ChartPortletController, ControlType } from '@ibiz-template/runtime';
 

package/es/control/dashboard/portlet/container-portlet/container-portlet.mjs

@@ -1,4 +1,4 @@
-import { isVNode, defineComponent, createVNode, resolveComponent } from 'vue';
+import { isVNode, resolveComponent, createVNode, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { ContainerPortletController } from '@ibiz-template/runtime';
 import './container-portlet.css';

package/es/control/dashboard/portlet/filter-portlet/filter-portlet-design/filter-portlet-design.mjs

@@ -1,4 +1,4 @@
-import { isVNode, defineComponent, ref, reactive, createVNode, resolveComponent, createTextVNode, withDirectives, resolveDirective } from 'vue';
+import { isVNode, ref, reactive, resolveComponent, createVNode, createTextVNode, resolveDirective, withDirectives, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { clone } from '@ibiz-template/core';
 import './filter-portlet-design.css';

package/es/control/dashboard/portlet/filter-portlet/filter-portlet-item/filter-portlet-item.mjs

@@ -1,4 +1,4 @@
-import { isVNode, defineComponent, ref, computed, watch, resolveComponent, h, createVNode } from 'vue';
+import { isVNode, ref, computed, watch, resolveComponent, h, createVNode, defineComponent } from 'vue';
 import { getEditorProvider } from '@ibiz-template/runtime';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import './filter-portlet-item.css';

package/es/control/dashboard/portlet/filter-portlet/filter-portlet.mjs

@@ -1,4 +1,4 @@
-import { isVNode, defineComponent, h, createVNode, resolveComponent } from 'vue';
+import { isVNode, h, resolveComponent, createVNode, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { FilterPortletController } from '@ibiz-template/runtime';
 import { FilterPortletItem } from './filter-portlet-item/filter-portlet-item.mjs';

package/es/control/dashboard/portlet/html-portlet/html-portlet.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, createVNode, resolveComponent } from 'vue';
+import { resolveComponent, createVNode, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { HtmlPortletController } from '@ibiz-template/runtime';
 import './html-portlet.css';

package/es/control/dashboard/portlet/list-portlet/list-portlet.mjs

@@ -1,4 +1,4 @@
-import { isVNode, defineComponent, onMounted, onBeforeUnmount, createVNode, resolveComponent, h } from 'vue';
+import { isVNode, onMounted, onBeforeUnmount, resolveComponent, h, createVNode, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { ListPortletController, ControlType } from '@ibiz-template/runtime';
 

package/es/control/dashboard/portlet/menu-portlet/app-menu-portlet/app-menu-portlet.mjs

@@ -1,4 +1,4 @@
-import { isVNode, defineComponent, ref, createVNode, resolveComponent } from 'vue';
+import { isVNode, ref, resolveComponent, createVNode, defineComponent } from 'vue';
 import { AppMenuIconViewController } from '@ibiz-template/runtime';
 import { useControlController, useNamespace } from '@ibiz-template/vue3-util';
 import './app-menu-portlet.css';

package/es/control/dashboard/portlet/menu-portlet/menu-portlet.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, createVNode, resolveComponent } from 'vue';
+import { resolveComponent, createVNode, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { MenuPortletController, ControlType } from '@ibiz-template/runtime';
 

package/es/control/dashboard/portlet/portlet-layout/portlet-layout.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, computed, createVNode, resolveComponent } from 'vue';
+import { computed, resolveComponent, createVNode, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import './portlet-layout.css';
 import { PortletPartController } from '@ibiz-template/runtime';

package/es/control/dashboard/portlet/rawitem-portlet/rawitem-portlet.mjs

@@ -1,4 +1,4 @@
-import { isVNode, defineComponent, createVNode, resolveComponent, h } from 'vue';
+import { isVNode, resolveComponent, h, createVNode, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { RawItemPortletController } from '@ibiz-template/runtime';
 

package/es/control/dashboard/portlet/report-portlet/report-portlet.mjs

@@ -1,4 +1,4 @@
-import { isVNode, defineComponent, computed, onMounted, onBeforeUnmount, createVNode, resolveComponent, h } from 'vue';
+import { isVNode, computed, onMounted, onBeforeUnmount, resolveComponent, h, createVNode, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { ReportPortletController, ControlType } from '@ibiz-template/runtime';
 

package/es/control/dashboard/portlet/view-portlet/view-portlet.mjs

@@ -1,4 +1,4 @@
-import { isVNode, defineComponent, onMounted, onBeforeUnmount, createVNode, resolveComponent, h } from 'vue';
+import { isVNode, onMounted, onBeforeUnmount, resolveComponent, h, createVNode, defineComponent } from 'vue';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { ViewPortletController } from '@ibiz-template/runtime';
 

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

@@ -1 +1 @@
-.ibiz-control-dataview{--ibiz-control-dataview-text-color:var(--ibiz-color-text-0);--ibiz-control-dataview-hover-bg-color:var(--ibiz-color-fill-1);--ibiz-control-dataview-active-bg-color:var(--ibiz-color-fill-2);--ibiz-control-dataview-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base) 0;--ibiz-control-dataview-page-height:50px;--ibiz-control-dataview-item-bg-color:transparent;display:flex;flex-flow:column nowrap;align-items:stretch;justify-content:flex-start;position:relative;height:100%}.ibiz-control-dataview__nav-icon{position:absolute;top:20px;right:10px;color:var(--ibiz-color-primary);cursor:pointer}.ibiz-control-dataview__content{flex-grow:1;height:100%}.ibiz-control-dataview__pagination{flex-shrink:0}.ibiz-control-dataview__load-more{width:calc(100% - var(--ibiz-spacing-base-tight));text-align:center}.ibiz-control-dataview__load-more i{font-size:var(--ibiz-font-size-header-3);color:var(--ibiz-color-text-2);cursor:pointer}.ibiz-control-dataview__load-more i:hover{color:var(--ibiz-color-primary-light-hover)}.ibiz-control-dataview__collapse-expand-icon{width:calc(100% - var(--ibiz-spacing-base-tight));text-align:center}.ibiz-control-dataview__collapse-expand-icon i{font-size:var(--ibiz-font-size-header-3);color:var(--ibiz-color-text-2);cursor:pointer}.ibiz-control-dataview__collapse-expand-icon i:hover{color:var(--ibiz-color-primary-light-hover)}.ibiz-control-dataview-scroll{display:flex;flex-wrap:wrap;align-content:flex-start;padding:var(--ibiz-control-dataview-padding);overflow:auto}.ibiz-control-dataview-scroll>*{margin:calc(var(--ibiz-spacing-base-tight)/ 2)}.ibiz-control-dataview-item-col{padding:0 var(--ibiz-spacing-base-tight) var(--ibiz-spacing-base-tight) 0}.ibiz-control-dataview-item{--ibiz-control-dataview-text-color:var(--ibiz-color-text-0);--ibiz-control-dataview-hover-bg-color:var(--ibiz-color-fill-1);--ibiz-control-dataview-active-bg-color:var(--ibiz-color-fill-2);--ibiz-control-dataview-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base) 0;--ibiz-control-dataview-page-height:50px;--ibiz-control-dataview-item-bg-color:transparent;color:var(--ibiz-control-dataview-text-color);cursor:pointer;background-color:var(--ibiz-control-dataview-item-bg-color)}.ibiz-control-dataview-item:hover{background-color:var(--ibiz-control-dataview-hover-bg-color)}.ibiz-control-dataview-item.is-active{background-color:var(--ibiz-control-dataview-active-bg-color)}.ibiz-control-dataview-item-content{--ibiz-control-dataview-text-color:var(--ibiz-color-text-0);--ibiz-control-dataview-hover-bg-color:var(--ibiz-color-fill-1);--ibiz-control-dataview-active-bg-color:var(--ibiz-color-fill-2);--ibiz-control-dataview-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base) 0;--ibiz-control-dataview-page-height:50px;--ibiz-control-dataview-item-bg-color:transparent}.ibiz-control-dataview-item-content__top--title{text-align:center}.ibiz-control-dataview-item-content__top--description{min-width:150px;text-align:justify;text-justify:newspaper;word-break:break-all}.ibiz-control-dataview-item-content__bottom--actions{display:flex;justify-content:center}.ibiz-control-dataview-group-content{--ibiz-control-dataview-group-item-header-bg-color:transparent;--ibiz-control-dataview-group-item-header-padding:var(--ibiz-spacing-base-tight);--ibiz-control-dataview-group-item-header-border-color:var(--ibiz-color-border);--ibiz-control-dataview-group-item-caption-text-color:var(--ibiz-color-text-0);--ibiz-control-dataview-group-item-caption-font-size:var(--ibiz-font-size-header-5);--ibiz-control-dataview-group-item-caption-font-weight:var(--ibiz-font-weight-bold);--ibiz-control-dataview-group-item-content-bg-color:transparent;--ibiz-control-dataview-group-item-content-padding:var(--ibiz-spacing-tight);width:100%}.ibiz-control-dataview-group-content__item .el-collapse-item__content{display:flex;flex-wrap:wrap}.ibiz-control-dataview-group-content__item--empty{width:100%;text-align:center}.ibiz-control-dataview-group-content__item.is-collapse .ibiz-control-dataview-group-content__item-content{height:0;overflow:hidden}.ibiz-control-dataview-group-content__item-header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--ibiz-control-dataview-group-item-header-padding);border-bottom:1px solid var(--ibiz-control-dataview-group-item-header-border-color)}.ibiz-control-dataview-group-content__item-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--ibiz-control-dataview-group-item-caption-font-size);font-weight:var(--ibiz-control-dataview-group-item-caption-font-weight);color:var(--ibiz-control-dataview-group-item-caption-text-color)}.ibiz-control-dataview-group-content__item-content{display:flex;flex-wrap:wrap;padding:var(--ibiz-control-dataview-group-item-content-padding);background-color:var(--ibiz-control-dataview-group-item-content-bg-color);will-change:height}.ibiz-control-dataview-group-content__item-content>*{margin:calc(var(--ibiz-spacing-base-tight)/ 2)}.ibiz-control-dataview-group-content__item-row{padding:var(--ibiz-control-dataview-group-item-content-padding)}.ibiz-control-dataview-group-content__item-col{padding:0 var(--ibiz-spacing-base-tight) var(--ibiz-spacing-base-tight) 0}
+.ibiz-control-dataview{--ibiz-control-dataview-text-color:var(--ibiz-color-text-0);--ibiz-control-dataview-hover-bg-color:var(--ibiz-color-fill-1);--ibiz-control-dataview-active-bg-color:var(--ibiz-color-fill-2);--ibiz-control-dataview-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base) 0;--ibiz-control-dataview-page-height:50px;--ibiz-control-dataview-item-bg-color:transparent;display:flex;flex-flow:column nowrap;align-items:stretch;justify-content:flex-start;position:relative;height:100%}.ibiz-control-dataview__nav-icon{position:absolute;top:20px;right:10px;color:var(--ibiz-color-primary);cursor:pointer}.ibiz-control-dataview__content{flex-grow:1;height:100%;overflow:auto;padding:var(--ibiz-control-dataview-padding)}.ibiz-control-dataview__pagination{flex-shrink:0}.ibiz-control-dataview__load-more{width:calc(100% - var(--ibiz-spacing-base-tight));text-align:center}.ibiz-control-dataview__load-more i{font-size:var(--ibiz-font-size-header-3);color:var(--ibiz-color-text-2);cursor:pointer}.ibiz-control-dataview__load-more i:hover{color:var(--ibiz-color-primary-light-hover)}.ibiz-control-dataview__collapse-expand-icon{width:calc(100% - var(--ibiz-spacing-base-tight));text-align:center}.ibiz-control-dataview__collapse-expand-icon i{font-size:var(--ibiz-font-size-header-3);color:var(--ibiz-color-text-2);cursor:pointer}.ibiz-control-dataview__collapse-expand-icon i:hover{color:var(--ibiz-color-primary-light-hover)}.ibiz-control-dataview__layout-row{padding:var(--ibiz-spacing-tight)}.ibiz-control-dataview__layout-col{padding:0 var(--ibiz-spacing-base-tight) var(--ibiz-spacing-base-tight) 0}.ibiz-control-dataview__layout-flex{display:flex;flex-wrap:wrap;overflow:auto;align-content:flex-start}.ibiz-control-dataview__layout-flex>*{margin:calc(var(--ibiz-spacing-base-tight)/ 2)}.ibiz-control-dataview-item{--ibiz-control-dataview-text-color:var(--ibiz-color-text-0);--ibiz-control-dataview-hover-bg-color:var(--ibiz-color-fill-1);--ibiz-control-dataview-active-bg-color:var(--ibiz-color-fill-2);--ibiz-control-dataview-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base) 0;--ibiz-control-dataview-page-height:50px;--ibiz-control-dataview-item-bg-color:transparent;cursor:pointer;color:var(--ibiz-control-dataview-text-color);background-color:var(--ibiz-control-dataview-item-bg-color)}.ibiz-control-dataview-item:hover{background-color:var(--ibiz-control-dataview-hover-bg-color)}.ibiz-control-dataview-item__content{width:100%;height:100%;display:flex;align-items:center}.ibiz-control-dataview-item__content--checkbox{flex-shrink:0;margin-right:var(--ibiz-spacing-tight)!important}.ibiz-control-dataview-item.is-active{background-color:var(--ibiz-control-dataview-active-bg-color)}.ibiz-control-dataview-item-content{--ibiz-control-dataview-text-color:var(--ibiz-color-text-0);--ibiz-control-dataview-hover-bg-color:var(--ibiz-color-fill-1);--ibiz-control-dataview-active-bg-color:var(--ibiz-color-fill-2);--ibiz-control-dataview-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base) 0;--ibiz-control-dataview-page-height:50px;--ibiz-control-dataview-item-bg-color:transparent}.ibiz-control-dataview-item-content__top--title{text-align:center}.ibiz-control-dataview-item-content__top--description{min-width:150px;text-align:justify;text-justify:newspaper;word-break:break-all}.ibiz-control-dataview-item-content__bottom--actions{display:flex;justify-content:center}.ibiz-control-dataview-group-content{--ibiz-control-dataview-group-item-header-bg-color:transparent;--ibiz-control-dataview-group-item-header-padding:var(--ibiz-spacing-base-tight);--ibiz-control-dataview-group-item-header-border-color:var(--ibiz-color-border);--ibiz-control-dataview-group-item-caption-text-color:var(--ibiz-color-text-0);--ibiz-control-dataview-group-item-caption-font-size:var(--ibiz-font-size-header-5);--ibiz-control-dataview-group-item-caption-font-weight:var(--ibiz-font-weight-bold);--ibiz-control-dataview-group-item-content-bg-color:transparent;--ibiz-control-dataview-group-item-content-padding:var(--ibiz-spacing-tight);width:100%}.ibiz-control-dataview-group-content__item .el-collapse-item__content{display:flex;flex-wrap:wrap}.ibiz-control-dataview-group-content__item--empty{width:100%;text-align:center}.ibiz-control-dataview-group-content__item.is-collapse .ibiz-control-dataview-group-content__item-content{height:0;overflow:hidden}.ibiz-control-dataview-group-content__item-header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--ibiz-control-dataview-group-item-header-padding);border-bottom:1px solid var(--ibiz-control-dataview-group-item-header-border-color)}.ibiz-control-dataview-group-content__item-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--ibiz-control-dataview-group-item-caption-font-size);font-weight:var(--ibiz-control-dataview-group-item-caption-font-weight);color:var(--ibiz-control-dataview-group-item-caption-text-color)}

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

@@ -65,7 +65,6 @@ export declare const DataViewControl: import("vue").DefineComponent<{
     classNames: import("vue").ComputedRef<string[]>;
     infiniteScroll: import("vue").Ref<IData | undefined>;
     renderHasData: () => VNode;
-    onShowNavView: () => void;
     renderNoData: () => VNode | undefined;
     onPageChange: (page: number) => void;
     onPageRefresh: () => void;

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

@@ -1,9 +1,9 @@
-import { isVNode, defineComponent, computed, ref, watch, createVNode, resolveComponent, withDirectives, resolveDirective } from 'vue';
-import { useControlController, useNamespace } from '@ibiz-template/vue3-util';
+import { isVNode, computed, ref, watch, resolveComponent, createVNode, resolveDirective, withDirectives, defineComponent } from 'vue';
+import { useControlController, useNamespace, hasEmptyPanelRenderer, IBizCustomRender } from '@ibiz-template/vue3-util';
 import { DataViewControlController, ControlVO } from '@ibiz-template/runtime';
 import { createUUID } from 'qx-util';
-import './data-view.css';
 import '../../util/index.mjs';
+import './data-view.css';
 import { usePagination } from '../../util/pagination/use-pagination.mjs';
 
 "use strict";
@@ -73,6 +73,10 @@ const DataViewControl = /* @__PURE__ */ defineComponent({
       }
       return c.state.items.length >= c.state.total || c.state.isLoading || c.state.total <= c.state.size;
     });
+    const cardStyle = computed(() => {
+      var _a, _b;
+      return ((_b = (_a = c.model.controlParam) == null ? void 0 : _a.ctrlParams) == null ? void 0 : _b.CARDSTYLE) || "default";
+    });
     const showCollapseOrExpandIcon = computed(() => {
       return !c.model.enableGroup && (c.model.pagingMode === 2 || c.model.pagingMode === 3);
     });
@@ -103,6 +107,22 @@ const DataViewControl = /* @__PURE__ */ defineComponent({
         c.state.isLoaded = true;
       }
     });
+    const isSelected = (item) => {
+      let selected = !!c.state.selectedData.find((data) => data.srfkey === item.srfkey);
+      if (c.view.model.viewType === "DEDATAVIEW" && c.state.mdctrlActiveMode === 1 && c.state.singleSelect === true)
+        selected = false;
+      return selected;
+    };
+    const toggleSelection = (item) => {
+      const selected = c.state.selectedData;
+      const index = selected.findIndex((data) => data.srfkey === item.srfkey);
+      if (index === -1) {
+        selected.push(item);
+      } else {
+        selected.splice(index, 1);
+      }
+      c.setSelection(selected);
+    };
     watch(() => props.data, () => {
       if (props.isSimple) {
         initSimpleData();
@@ -160,25 +180,6 @@ const DataViewControl = /* @__PURE__ */ defineComponent({
       }, [renderItemAction(item)]) : null]);
     };
     const renderCard = (item) => {
-      const findIndex = c.state.selectedData.findIndex((data) => {
-        return data.srfkey === item.srfkey;
-      });
-      let showActive = findIndex !== -1;
-      if (c.view.model.viewType === "DEDATAVIEW" && c.state.mdctrlActiveMode === 1 && c.state.singleSelect === true) {
-        showActive = false;
-      }
-      const cardClass = [ns.b("item"), ns.is("active", showActive)];
-      const cardStyle = {};
-      if (c.model.cardWidth) {
-        Object.assign(cardStyle, {
-          width: "".concat(c.model.cardWidth, "px")
-        });
-      }
-      if (c.model.cardHeight) {
-        Object.assign(cardStyle, {
-          height: "".concat(c.model.cardHeight, "px")
-        });
-      }
       const itemStyle = ns.cssVarBlock({
         "item-bg-color": "".concat(item.bgcolor || ""),
         "text-color": "".concat(item.fontcolor || ""),
@@ -188,21 +189,62 @@ const DataViewControl = /* @__PURE__ */ defineComponent({
       const panel = props.modelData.itemLayoutPanel;
       return createVNode(resolveComponent("el-card"), {
         "shadow": "hover",
-        "class": cardClass,
+        "class": [ns.b("item"), ns.is("active", isSelected(item))],
         "style": itemStyle,
-        "body-style": cardStyle,
+        "body-style": {
+          width: c.model.cardWidth ? "".concat(c.model.cardWidth, "px") : "auto",
+          height: c.model.cardHeight ? "".concat(c.model.cardHeight, "px") : "auto"
+        },
         "onClick": (event) => onRowClick(item, event),
         "onDblclick": (event) => onDbRowClick(item, event)
       }, {
-        default: () => [panel ? renderPanelItem(item, panel) : renderDefaultItem(item)]
+        default: () => [createVNode("div", {
+          "class": ns.be("item", "content")
+        }, [cardStyle.value === "style2" && !c.state.singleSelect && createVNode(resolveComponent("el-checkbox"), {
+          "size": "large",
+          "class": ns.bem("item", "content", "checkbox"),
+          "modelValue": isSelected(item),
+          "onClick": (e) => e.stopPropagation(),
+          "onChange": () => toggleSelection(item)
+        }, null), panel ? renderPanelItem(item, panel) : renderDefaultItem(item)])]
       });
     };
-    const renderGroup = (group) => {
+    const renderCardLayout = (items) => {
+      let _slot;
       const {
         cardColXS,
         cardColSM,
         cardColMD,
-        cardColLG,
+        cardColLG
+      } = c.model;
+      if (cardColXS || cardColSM || cardColMD || cardColLG)
+        return createVNode(resolveComponent("el-row"), {
+          "class": ns.e("layout-row")
+        }, _isSlot(_slot = items.map((item) => {
+          return createVNode(resolveComponent("el-col"), {
+            "xs": cardColXS,
+            "sm": cardColSM,
+            "md": cardColMD,
+            "lg": cardColLG,
+            "class": ns.e("layout-col")
+          }, {
+            default: () => [createVNode("div", {
+              "class": ns.b("scroll-item")
+            }, [renderCard(item)])]
+          });
+        })) ? _slot : {
+          default: () => [_slot]
+        });
+      return createVNode("div", {
+        "class": ns.e("layout-flex")
+      }, [items.map((item) => {
+        return createVNode("div", {
+          "class": ns.b("scroll-item")
+        }, [renderCard(item)]);
+      })]);
+    };
+    const renderGroup = (group) => {
+      const {
         groupSysCss
       } = c.model;
       return createVNode("div", {
@@ -220,75 +262,19 @@ const DataViewControl = /* @__PURE__ */ defineComponent({
         "onActionClick": (detail, event) => {
           c.onGroupToolbarClick(detail, event, group);
         }
-      }, null)])]), cardColXS || cardColSM || cardColMD || cardColLG ? createVNode(resolveComponent("el-row"), {
-        "class": ns.be("group-content", "item-row")
-      }, {
-        default: () => [group.children.length > 0 ? group.children.map((child) => {
-          let _slot;
-          return createVNode(resolveComponent("el-col"), {
-            "xs": cardColXS,
-            "sm": cardColSM,
-            "md": cardColMD,
-            "lg": cardColLG,
-            "class": ns.be("group-content", "item-col")
-          }, _isSlot(_slot = renderCard(child)) ? _slot : {
-            default: () => [_slot]
-          });
-        }) : createVNode("div", {
-          "class": ns.bem("group-content", "item", "empty")
-        }, [ibiz.i18n.t("app.noData")])]
-      }) : createVNode("div", {
-        "class": ns.be("group-content", "item-content")
-      }, [group.children.length > 0 ? group.children.map((child) => {
-        return renderCard(child);
-      }) : createVNode("div", {
+      }, null)])]), group.children.length > 0 ? renderCardLayout(group.children) : createVNode("div", {
         "class": ns.bem("group-content", "item", "empty")
-      }, [ibiz.i18n.t("app.noData")])])]);
+      }, [ibiz.i18n.t("app.noData")])]);
     };
     const renderDataViewContent = () => {
-      const {
-        cardColXS,
-        cardColSM,
-        cardColMD,
-        cardColLG
-      } = c.model;
       if (c.model.enableGroup) {
         return createVNode("div", {
           "class": ns.b("group-content")
         }, [c.state.groups.map((group) => {
-          return createVNode("div", {
-            "class": [ns.b("scroll-item")]
-          }, [renderGroup(group)]);
+          return renderGroup(group);
         })]);
       }
-      let tempItems = c.state.items;
-      if (isCollapse.value) {
-        tempItems = c.state.items.slice(0, c.state.size);
-      }
-      if (cardColXS || cardColSM || cardColMD || cardColLG) {
-        let _slot3;
-        return createVNode(resolveComponent("el-row"), {
-          "class": [ns.b("item-row")]
-        }, _isSlot(_slot3 = tempItems.map((item) => {
-          let _slot2;
-          return createVNode(resolveComponent("el-col"), {
-            "xs": cardColXS,
-            "sm": cardColSM,
-            "md": cardColMD,
-            "lg": cardColLG,
-            "class": [ns.b("item-col")]
-          }, _isSlot(_slot2 = renderCard(item)) ? _slot2 : {
-            default: () => [_slot2]
-          });
-        })) ? _slot3 : {
-          default: () => [_slot3]
-        });
-      }
-      return tempItems.map((item) => {
-        return createVNode("div", {
-          "class": [ns.b("scroll-item")]
-        }, [renderCard(item)]);
-      });
+      return renderCardLayout(isCollapse.value ? c.state.items.slice(0, c.state.size) : c.state.items);
     };
     const scrollToTop = () => {
       var _a;
@@ -307,9 +293,6 @@ const DataViewControl = /* @__PURE__ */ defineComponent({
     const onExpandData = () => {
       isCollapse.value = false;
     };
-    const onShowNavView = () => {
-      c.state.showNavView = !c.state.showNavView;
-    };
     const upIcon = () => {
       return createVNode("div", {
         "class": ns.e("collapse-expand-icon")
@@ -342,10 +325,10 @@ const DataViewControl = /* @__PURE__ */ defineComponent({
     };
     const renderHasData = () => {
       return withDirectives(createVNode("div", {
-        "class": [ns.b("scroll"), ns.e("content")],
+        "class": ns.e("content"),
+        "ref": "infiniteScroll",
         "infinite-scroll-distance": 10,
         "infinite-scroll-disabled": isLodeMoreDisabled.value,
-        "ref": "infiniteScroll",
         "key": infiniteScrollKey.value
       }, [renderDataViewContent()]), [[resolveDirective("infinite-scroll"), () => c.loadMore()]]);
     };
@@ -356,12 +339,22 @@ const DataViewControl = /* @__PURE__ */ defineComponent({
       if (!isLoaded) {
         return;
       }
+      const noDataSlots = {};
+      if (hasEmptyPanelRenderer(c)) {
+        Object.assign(noDataSlots, {
+          customRender: () => createVNode(IBizCustomRender, {
+            "controller": c
+          }, null)
+        });
+      }
       return createVNode(resolveComponent("iBizNoData"), {
         "class": ns.e("content"),
         "text": c.model.emptyText,
         "emptyTextLanguageRes": c.model.emptyTextLanguageRes,
         "hideNoDataImage": c.state.hideNoDataImage
-      }, null);
+      }, _isSlot(noDataSlots) ? noDataSlots : {
+        default: () => [noDataSlots]
+      });
     };
     const renderCollapseExpandIcon = () => {
       let icon = null;
@@ -392,7 +385,6 @@ const DataViewControl = /* @__PURE__ */ defineComponent({
       classNames,
       infiniteScroll,
       renderHasData,
-      onShowNavView,
       renderNoData,
       onPageChange,
       onPageRefresh,
@@ -433,16 +425,16 @@ const DataViewControl = /* @__PURE__ */ defineComponent({
         "class": [this.ns.is("enable-page", !!this.c.state.enablePagingBar)],
         "controller": this.c
       }, {
-        default: () => [content, this.c.state.enableNavView ? !this.c.state.showNavView ? createVNode("ion-icon", {
+        default: () => [content, this.c.state.enableNavView && this.c.state.showNavIcon ? !this.c.state.showNavView ? createVNode("ion-icon", {
           "class": this.ns.e("nav-icon"),
           "title": ibiz.i18n.t("component.controlNavigation.showNav"),
           "name": "eye-outline",
-          "onClick": this.onShowNavView
+          "onClick": () => this.c.onShowNavViewChange()
         }, null) : createVNode("ion-icon", {
           "class": this.ns.e("nav-icon"),
           "title": ibiz.i18n.t("component.controlNavigation.hiddenNav"),
           "name": "eye-off-outline",
-          "onClick": this.onShowNavView
+          "onClick": () => this.c.onShowNavViewChange()
         }, null) : null, this.renderCollapseExpandIcon()]
       })]
     });

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

@@ -56,7 +56,6 @@ 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/data-view/index.mjs

@@ -1,4 +1,4 @@
-import { registerControlProvider, ControlType } from '@ibiz-template/runtime';
+import { ControlType, registerControlProvider } from '@ibiz-template/runtime';
 import { withInstall } from '@ibiz-template/vue3-util';
 import { DataViewControl } from './data-view.mjs';
 import { DataViewControlProvider } from './data-view.provider.mjs';