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

package/lib/control/data-view/data-view.cjs

@@ -181,10 +181,17 @@ const DataViewControl = /* @__PURE__ */ vue.defineComponent({
           height: "".concat(c.model.cardHeight, "px")
         });
       }
+      const itemStyle = ns.cssVarBlock({
+        "item-bg-color": "".concat(item.bgcolor || ""),
+        "text-color": "".concat(item.fontcolor || ""),
+        "hover-bg-color": "".concat(item.hovercolor || ""),
+        "active-bg-color": "".concat(item.activecolor || "")
+      });
       const panel = props.modelData.itemLayoutPanel;
       return vue.createVNode(vue.resolveComponent("el-card"), {
         "shadow": "hover",
         "class": cardClass,
+        "style": itemStyle,
         "body-style": cardStyle,
         "onClick": (event) => onRowClick(item, event),
         "onDblclick": (event) => onDbRowClick(item, event)
@@ -302,9 +309,6 @@ const DataViewControl = /* @__PURE__ */ vue.defineComponent({
     const onExpandData = () => {
       isCollapse.value = false;
     };
-    const onShowNavView = () => {
-      c.state.showNavView = !c.state.showNavView;
-    };
     const upIcon = () => {
       return vue.createVNode("div", {
         "class": ns.e("collapse-expand-icon")
@@ -351,12 +355,22 @@ const DataViewControl = /* @__PURE__ */ vue.defineComponent({
       if (!isLoaded) {
         return;
       }
+      const noDataSlots = {};
+      if (vue3Util.hasEmptyPanelRenderer(c)) {
+        Object.assign(noDataSlots, {
+          customRender: () => vue.createVNode(vue3Util.IBizCustomRender, {
+            "controller": c
+          }, null)
+        });
+      }
       return vue.createVNode(vue.resolveComponent("iBizNoData"), {
         "class": ns.e("content"),
         "text": c.model.emptyText,
         "emptyTextLanguageRes": c.model.emptyTextLanguageRes,
-        "enableShowImage": c.state.hideNoDataImage
-      }, null);
+        "hideNoDataImage": c.state.hideNoDataImage
+      }, _isSlot(noDataSlots) ? noDataSlots : {
+        default: () => [noDataSlots]
+      });
     };
     const renderCollapseExpandIcon = () => {
       let icon = null;
@@ -387,7 +401,6 @@ const DataViewControl = /* @__PURE__ */ vue.defineComponent({
       classNames,
       infiniteScroll,
       renderHasData,
-      onShowNavView,
       renderNoData,
       onPageChange,
       onPageRefresh,
@@ -428,16 +441,16 @@ const DataViewControl = /* @__PURE__ */ vue.defineComponent({
         "class": [this.ns.is("enable-page", !!this.c.state.enablePagingBar)],
         "controller": this.c
       }, {
-        default: () => [content, this.c.state.enableNavView ? !this.c.state.showNavView ? vue.createVNode("ion-icon", {
+        default: () => [content, this.c.state.enableNavView && this.c.state.showNavIcon ? !this.c.state.showNavView ? vue.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) : vue.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/lib/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;display:flex;flex-flow:column nowrap;align-items:stretch;justify-content:flex-start;position:relative;height:100%}.ibiz-control-dataview__nav-icon{right:10px;top:20px;cursor:pointer;position:absolute;color:var(--ibiz-color-primary)}.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;color:var(--ibiz-control-dataview-text-color);cursor:pointer}.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-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%}.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}

package/lib/control/drbar/drbar.controller.cjs

@@ -470,6 +470,8 @@ class DRBarController extends runtime.ControlController {
    */
   async openNavPosView(drBarItem, isRoutePushed = false) {
     var _a;
+    if (!drBarItem.appViewId)
+      return;
     const { context, params } = this.prepareParams(drBarItem);
     context.currentSrfNav = drBarItem.id;
     this.state.srfnav = drBarItem.id;

package/lib/control/drtab/drtab-control.util.cjs

@@ -1,7 +1,7 @@
 'use strict';
 
 var vue = require('vue');
-var namespace = require('../../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.cjs');
+var namespace = require('../../node_modules/.pnpm/@ibiz-template_core@0.7.38-alpha.57_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.cjs');
 
 "use strict";
 function useAppDRTab(c, controlRef, counterData) {

package/lib/control/drtab/drtab.controller.cjs

@@ -441,6 +441,8 @@ class DRTabController extends runtime.ControlController {
   async openNavPosView(drTabPages, isRoutePushed = false, navViewKey) {
     var _a;
     const { context, params } = this.prepareParams(drTabPages);
+    if (!drTabPages.appViewId)
+      return;
     (_a = this.navPos) == null ? void 0 : _a.openView({
       key: navViewKey || drTabPages.id,
       context,

package/lib/control/form/form-detail/form-group-panel/form-group-panel.cjs

@@ -78,7 +78,7 @@ const FormGroupPanel = /* @__PURE__ */ vue.defineComponent({
     })) ? _slot : {
       default: () => [_slot]
     });
-    const classArr = [this.ns.b(), this.ns.m(this.modelData.codeName), ...this.controller.containerClass];
+    const classArr = [this.ns.b(), this.ns.m(this.modelData.codeName), this.modelData.detailStyle ? this.ns.m(this.modelData.detailStyle.toLowerCase()) : "", ...this.controller.containerClass];
     if (this.modelData.showCaption === true) {
       classArr.push(this.ns.m("show-header"));
       classArr.push(this.ns.b("collapse"));
@@ -99,7 +99,10 @@ const FormGroupPanel = /* @__PURE__ */ vue.defineComponent({
         "class": [this.ns.be("header", "left")]
       }, [vue.createVNode("div", {
         "class": [this.ns.e("caption"), ...this.controller.labelClass]
-      }, [this.captionText])]), vue.createVNode("div", {
+      }, [this.modelData.sysImage && vue.createVNode(vue.resolveComponent("iBizIcon"), {
+        "class": this.ns.em("caption", "icon"),
+        "icon": this.modelData.sysImage
+      }, null), this.captionText])]), vue.createVNode("div", {
         "class": [this.ns.be("header", "right")]
       }, [this.modelData.uiactionGroup && vue.createVNode(vue.resolveComponent("iBizActionToolbar"), {
         "class": this.ns.e("toolbar"),
@@ -108,15 +111,25 @@ const FormGroupPanel = /* @__PURE__ */ vue.defineComponent({
         "onActionClick": this.onActionClick,
         "caption": this.modelData.uiactionGroup.name,
         "mode": this.modelData.actionGroupExtractMode === "ITEMS" ? "dropdown" : "buttons"
-      }, null), this.modelData.titleBarCloseMode !== void 0 && this.modelData.titleBarCloseMode !== 0 && (this.controller.state.collapse ? vue.createVNode("ion-icon", {
-        "name": "caret-forward-sharp",
-        "class": this.ns.be("header", "icon"),
-        "title": ibiz.i18n.t("control.form.formGroup.unfold")
-      }, null) : vue.createVNode("ion-icon", {
-        "name": "caret-down-sharp",
-        "class": this.ns.be("header", "icon"),
-        "title": ibiz.i18n.t("control.form.formGroup.fold")
-      }, null))])]);
+      }, null), this.modelData.titleBarCloseMode !== void 0 && this.modelData.titleBarCloseMode !== 0 && (this.controller.state.collapse ? vue.createVNode("svg", {
+        "xmlns": "http://www.w3.org/2000/svg",
+        "viewBox": "0 0 1024 1024",
+        "width": "1em",
+        "height": "1em",
+        "class": this.ns.be("header", "icon")
+      }, [vue.createVNode("title", null, [ibiz.i18n.t("control.form.formGroup.unfold")]), vue.createVNode("path", {
+        "fill": "currentColor",
+        "d": "M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"
+      }, null)]) : vue.createVNode("svg", {
+        "xmlns": "http://www.w3.org/2000/svg",
+        "viewBox": "0 0 1024 1024",
+        "width": "1em",
+        "height": "1em",
+        "class": this.ns.be("header", "icon")
+      }, [vue.createVNode("title", null, [ibiz.i18n.t("control.form.formGroup.fold")]), vue.createVNode("path", {
+        "fill": "currentColor",
+        "d": "M831.872 340.864 512 652.672 192.128 340.864a30.592 30.592 0 0 0-42.752 0 29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728 30.592 30.592 0 0 0-42.752 0z"
+      }, null)]))])]);
     }
     let footer = null;
     if (this.modelData.showMoreMode === 2) {

package/lib/control/form/form-detail/form-group-panel/form-group-panel.css

@@ -1 +1 @@
-.ibiz-form-group{--ibiz-form-group-bg-color:transparent;--ibiz-form-group-footer-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-form-group-show-more-color:var(--ibiz-color-primary);--ibiz-form-group-footer-height:35px;--ibiz-form-group-header-bg-color:transparent;--ibiz-form-group-header-padding:var(--ibiz-spacing-base-tight) 0;--ibiz-form-group-header-margin:0 var(--ibiz-spacing-base-tight);--ibiz-form-group-header-border-color:var(--ibiz-color-border);--ibiz-form-group-header-height:49px;--ibiz-form-group-caption-text-color:var(--ibiz-color-text-0);--ibiz-form-group-caption-font-size:var(--ibiz-font-size-header-5);--ibiz-form-group-caption-font-weight:var(--ibiz-font-weight-bold);--ibiz-form-group-content-bg-color:transparent;--ibiz-form-group-content-padding:var(--ibiz-spacing-tight)}.ibiz-form-group{height:100%;background-color:var(--ibiz-form-group-bg-color);border-radius:var(--ibiz-border-radius-base)}.ibiz-form-group__caption{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--ibiz-form-group-caption-font-size);font-weight:var(--ibiz-form-group-caption-font-weight);color:var(--ibiz-form-group-caption-text-color)}.ibiz-form-group__toolbar{text-align:right}.ibiz-form-group-collapse>.ibiz-form-group-content{display:block}.ibiz-form-group-collapse.is-collapse>.ibiz-form-group-content{display:none}.ibiz-form-group-header{display:flex;height:var(--ibiz-form-group-header-height);padding:var(--ibiz-form-group-header-padding);margin:var(--ibiz-form-group-header-margin);border-bottom:1px solid var(--ibiz-form-group-header-border-color)}.ibiz-form-group-header__left,.ibiz-form-group-header__right{display:inline-block;width:50%}.ibiz-form-group-header__right{text-align:right;display:flex;align-items:center;justify-content:flex-end}.ibiz-form-group-header__icon{cursor:pointer}.ibiz-form-group-content{width:100%;height:100%}.ibiz-form-group-content__row{width:100%;height:100%}.ibiz-form-group--show-header>.ibiz-form-group-content{height:calc(100% - var(--ibiz-form-group-header-height));padding:var(--ibiz-form-group-content-padding);background-color:var(--ibiz-form-group-content-bg-color)}.ibiz-form-group--show-more>.ibiz-form-group-content{height:calc(100% - var(--ibiz-form-group-footer-height))}.ibiz-form-group--show-header.ibiz-form-group--show-more>.ibiz-form-group-content{height:calc(100% - var(--ibiz-form-group-header-height) - var(--ibiz-form-group-footer-height))}.ibiz-form-group-footer{height:var(--ibiz-form-group-footer-height);padding:var(--ibiz-form-group-footer-padding)}.ibiz-form-group-footer__show-more-button{display:inline-block;color:var(--ibiz-form-group-show-more-color);cursor:pointer}
+.ibiz-form-group{--ibiz-form-group-bg-color:transparent;--ibiz-form-group-footer-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);--ibiz-form-group-show-more-color:var(--ibiz-color-primary);--ibiz-form-group-footer-height:35px;--ibiz-form-group-header-bg-color:transparent;--ibiz-form-group-header-padding:var(--ibiz-spacing-base-tight) 0;--ibiz-form-group-header-margin:0 var(--ibiz-spacing-base-tight);--ibiz-form-group-header-border-color:var(--ibiz-color-border);--ibiz-form-group-header-height:49px;--ibiz-form-group-caption-text-color:var(--ibiz-color-text-0);--ibiz-form-group-caption-font-size:var(--ibiz-font-size-header-5);--ibiz-form-group-caption-font-weight:var(--ibiz-font-weight-bold);--ibiz-form-group-content-bg-color:transparent;--ibiz-form-group-content-padding:var(--ibiz-spacing-tight)}.ibiz-form-group{height:100%;background-color:var(--ibiz-form-group-bg-color);border-radius:var(--ibiz-border-radius-base)}.ibiz-form-group__caption{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--ibiz-form-group-caption-font-size);font-weight:var(--ibiz-form-group-caption-font-weight);color:var(--ibiz-form-group-caption-text-color)}.ibiz-form-group__caption--icon{padding-right:var(--ibiz-spacing-tight)}.ibiz-form-group__toolbar{text-align:right}.ibiz-form-group-collapse>.ibiz-form-group-content{display:block}.ibiz-form-group-collapse.is-collapse>.ibiz-form-group-content{display:none}.ibiz-form-group-header{display:flex;justify-content:space-between;height:var(--ibiz-form-group-header-height);padding:var(--ibiz-form-group-header-padding);margin:var(--ibiz-form-group-header-margin);border-bottom:1px solid var(--ibiz-form-group-header-border-color)}.ibiz-form-group-header__left{overflow:hidden}.ibiz-form-group-header__left,.ibiz-form-group-header__right{display:inline-block}.ibiz-form-group-header__right{flex-shrink:0;max-width:100%;text-align:right;display:flex;align-items:center;justify-content:flex-end}.ibiz-form-group-header__icon{cursor:pointer}.ibiz-form-group-content{width:100%;height:100%}.ibiz-form-group-content__row{width:100%;height:100%}.ibiz-form-group--show-header>.ibiz-form-group-content{height:calc(100% - var(--ibiz-form-group-header-height));padding:var(--ibiz-form-group-content-padding);background-color:var(--ibiz-form-group-content-bg-color)}.ibiz-form-group--show-more>.ibiz-form-group-content{height:calc(100% - var(--ibiz-form-group-footer-height))}.ibiz-form-group--show-header.ibiz-form-group--show-more>.ibiz-form-group-content{height:calc(100% - var(--ibiz-form-group-header-height) - var(--ibiz-form-group-footer-height))}.ibiz-form-group-footer{height:var(--ibiz-form-group-footer-height);padding:var(--ibiz-form-group-footer-padding)}.ibiz-form-group-footer__show-more-button{display:inline-block;color:var(--ibiz-form-group-show-more-color);cursor:pointer}

package/lib/control/form/form-detail/form-item/composite-form-item/composite-form-item.cjs

@@ -0,0 +1,98 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+var runtime = require('@ibiz-template/runtime');
+
+"use strict";
+const CompositeFormItem = /* @__PURE__ */ vue.defineComponent({
+  name: "IBizCompositeFormItem",
+  props: {
+    modelData: {
+      type: Object,
+      required: true
+    },
+    controller: {
+      type: runtime.FormItemController,
+      required: true
+    },
+    attrs: {
+      type: Object,
+      required: false
+    }
+  },
+  setup(props) {
+    var _a, _b, _c, _d;
+    const c = props.controller;
+    const onValueChange = (val, name) => {
+      props.controller.setDataValue(val, name);
+    };
+    const extraParams = vue.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 {
+      c,
+      extraParams,
+      onValueChange
+    };
+  },
+  render() {
+    var _a, _b, _c, _d, _e;
+    if (!this.c.state.visible || ((_a = this.controller.model.editor) == null ? void 0 : _a.editorType) === "HIDDEN") {
+      return null;
+    }
+    let editor = null;
+    const editMode = (_d = (_c = (_b = this.controller.editor) == null ? void 0 : _b.model) == null ? void 0 : _c.editorParams) == null ? void 0 : _d.editMode;
+    const editorProps = {
+      style: (_e = this.controller.editor) == null ? void 0 : _e.style,
+      value: this.controller.value,
+      data: this.controller.data,
+      controller: this.controller.editor,
+      disabled: this.controller.state.disabled,
+      readonly: this.controller.state.readonly,
+      onChange: this.onValueChange,
+      extraParams: this.extraParams,
+      controlParams: editMode ? {
+        ...this.controller.form.controlParams,
+        editmode: editMode
+      } : this.controller.form.controlParams,
+      onFocus: (event) => this.c.onFocus(event),
+      onBlur: (event) => this.c.onBlur(event),
+      onEnter: (event) => this.controller.onEnter(event),
+      onClick: (event, params) => this.controller.onClick(event, params),
+      ...this.attrs
+    };
+    if (this.c.form.state.isLoaded) {
+      if (this.$slots.default) {
+        editor = this.$slots.default(editorProps);
+      } else if (this.controller.editorProvider) {
+        const component = vue.resolveComponent(this.controller.editorProvider.formEditor);
+        editor = vue.h(component, {
+          ...editorProps
+        });
+      } else {
+        editor = vue.createVNode(vue.resolveComponent("not-supported-editor"), {
+          "modelData": this.modelData.editor
+        }, null);
+      }
+    }
+    return editor;
+  }
+});
+
+exports.CompositeFormItem = CompositeFormItem;
+exports.default = CompositeFormItem;

package/lib/control/form/form-detail/form-item/form-item-container/form-item-container.cjs

@@ -41,6 +41,9 @@ const IBizFormItemContainer = /* @__PURE__ */ vue.defineComponent({
     },
     inputTipClosable: {
       type: Boolean
+    },
+    labelSysImg: {
+      type: Object
     }
   },
   setup(props) {
@@ -71,7 +74,10 @@ const IBizFormItemContainer = /* @__PURE__ */ vue.defineComponent({
           default: () => {
             return vue.createVNode("div", {
               "class": classList
-            }, [props.label]);
+            }, [props.labelSysImg && vue.createVNode(vue3Util.IBizIcon, {
+              "class": ns.em("label", "icon"),
+              "icon": props.labelSysImg
+            }, null), props.label]);
           },
           content: () => {
             return vue.createVNode("div", {
@@ -89,7 +95,10 @@ const IBizFormItemContainer = /* @__PURE__ */ vue.defineComponent({
       return vue.createVNode("div", {
         "class": classList,
         "title": core.showTitle(props.label)
-      }, [props.label]);
+      }, [props.labelSysImg && vue.createVNode(vue3Util.IBizIcon, {
+        "class": ns.em("label", "icon"),
+        "icon": props.labelSysImg
+      }, null), props.label]);
     };
     return {
       ns,

package/lib/control/form/form-detail/form-item/form-item-container/form-item-container.css

@@ -1 +1 @@
-.ibiz-form-item-container{--ibiz-form-item-container-label-width:130px;--ibiz-form-item-container-line-height:var(--ibiz-height-control-default);--ibiz-form-item-container-require-mark-color:var(--ibiz-color-danger);--ibiz-form-item-container-label-left-padding:0 var(--ibiz-spacing-base-tight) 0 0;--ibiz-form-item-container-label-right-padding:0 0 0 var(--ibiz-spacing-base-tight);--ibiz-form-item-container-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-tight) var(--ibiz-spacing-extra-tight);--ibiz-form-item-container-font-size:var(--ibiz-font-size-regular);--ibiz-form-item-container-label-color:var(--ibiz-color-text-1);--ibiz-form-item-container-error-font-size:var(--ibiz-font-size-small);--ibiz-form-item-container-error-color:var(--ibiz-color-danger);width:100%;height:100%;padding:var(--ibiz-form-item-container-padding)}.ibiz-form-item-container__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0;font-size:var(--ibiz-form-item-container-font-size);color:var(--ibiz-form-item-container-label-color)}.ibiz-form-item-container__label--tooltip{max-width:150px}.ibiz-form-item-container__label--tooltip:has(ion-icon){padding-right:var(--ibiz-width-icon-large)}.ibiz-form-item-container__label--tooltip a{padding:0 var(--ibiz-spacing-extra-tight);color:var(--ibiz-color-link)}.ibiz-form-item-container__label--tooltip ion-icon{position:absolute;font-size:var(--ibiz-width-icon-large);color:var(--ibiz-color-fill-2)}.ibiz-form-item-container__popper.el-popper.is-light{padding:0 var(--ibiz-spacing-extra-tight);border:1px solid var(--ibiz-color-text-0);border-radius:0}.ibiz-form-item-container--left,.ibiz-form-item-container--right{display:flex;min-height:var(--ibiz-form-item-container-line-height)}.ibiz-form-item-container--left .ibiz-form-item-container__label,.ibiz-form-item-container--right .ibiz-form-item-container__label{width:var(--ibiz-form-item-container-label-width)}.ibiz-form-item-container--left .ibiz-form-item-container__content,.ibiz-form-item-container--right .ibiz-form-item-container__content{width:calc(100% - var(--ibiz-form-item-container-label-width))}.ibiz-form-item-container--bottom,.ibiz-form-item-container--top{display:flex;flex-flow:column nowrap}.ibiz-form-item-container--top .ibiz-form-item-container__label{margin-bottom:var(--ibiz-spacing-extra-tight)}.ibiz-form-item-container--bottom .ibiz-form-item-container__label{margin-top:var(--ibiz-spacing-extra-tight)}.ibiz-form-item-container--left .ibiz-form-item-container__label{padding:var(--ibiz-form-item-container-label-left-padding);line-height:var(--ibiz-form-item-container-line-height);text-align:right}.ibiz-form-item-container--right .ibiz-form-item-container__label{padding:var(--ibiz-form-item-container-label-right-padding);line-height:var(--ibiz-form-item-container-line-height);text-align:left}.ibiz-form-item-container.is-required .ibiz-form-item-container__label::before{display:inline-block;margin-right:4px;font-family:SimSun;line-height:1;color:var(--ibiz-form-item-container-require-mark-color);content:"*"}.ibiz-form-item-container__content{display:flex;flex-flow:column nowrap;position:relative;flex-grow:1}.ibiz-form-item-container__content--label-left,.ibiz-form-item-container__content--label-none,.ibiz-form-item-container__content--label-right{height:100%}.ibiz-form-item-container__editor{position:relative;flex-grow:1;height:100%}.ibiz-form-item-container__error{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;position:absolute;top:100%;width:100%;font-size:var(--ibiz-form-item-container-error-font-size);line-height:calc(var(--ibiz-form-item-container-error-font-size) + 2px);color:var(--ibiz-form-item-container-error-color);word-wrap:break-word}.ibiz-form-item-container.is-error .el-input__wrapper{box-shadow:0 0 0 1px var(--ibiz-form-item-container-error-color) inset}
+.ibiz-form-item-container{--ibiz-form-item-container-label-width:130px;--ibiz-form-item-container-line-height:var(--ibiz-height-control-default);--ibiz-form-item-container-require-mark-color:var(--ibiz-color-danger);--ibiz-form-item-container-label-left-padding:0 var(--ibiz-spacing-base-tight) 0 0;--ibiz-form-item-container-label-right-padding:0 0 0 var(--ibiz-spacing-base-tight);--ibiz-form-item-container-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-tight) var(--ibiz-spacing-extra-tight);--ibiz-form-item-container-font-size:var(--ibiz-font-size-regular);--ibiz-form-item-container-label-color:var(--ibiz-color-text-1);--ibiz-form-item-container-error-font-size:var(--ibiz-font-size-small);--ibiz-form-item-container-error-color:var(--ibiz-color-danger);width:100%;height:100%;padding:var(--ibiz-form-item-container-padding)}.ibiz-form-item-container__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0;font-size:var(--ibiz-form-item-container-font-size);color:var(--ibiz-form-item-container-label-color)}.ibiz-form-item-container__label--tooltip{max-width:150px}.ibiz-form-item-container__label--tooltip:has(ion-icon){padding-right:var(--ibiz-width-icon-large)}.ibiz-form-item-container__label--tooltip a{padding:0 var(--ibiz-spacing-extra-tight);color:var(--ibiz-color-link)}.ibiz-form-item-container__label--tooltip ion-icon{position:absolute;font-size:var(--ibiz-width-icon-large);color:var(--ibiz-color-fill-2)}.ibiz-form-item-container__label--icon{padding-right:var(--ibiz-spacing-tight)}.ibiz-form-item-container__popper.el-popper.is-light{padding:0 var(--ibiz-spacing-extra-tight);border:1px solid var(--ibiz-color-text-0);border-radius:0}.ibiz-form-item-container--left,.ibiz-form-item-container--right{display:flex;min-height:var(--ibiz-form-item-container-line-height)}.ibiz-form-item-container--left .ibiz-form-item-container__label,.ibiz-form-item-container--right .ibiz-form-item-container__label{width:var(--ibiz-form-item-container-label-width)}.ibiz-form-item-container--left .ibiz-form-item-container__content,.ibiz-form-item-container--right .ibiz-form-item-container__content{width:calc(100% - var(--ibiz-form-item-container-label-width))}.ibiz-form-item-container--bottom,.ibiz-form-item-container--top{display:flex;flex-flow:column nowrap}.ibiz-form-item-container--top .ibiz-form-item-container__label{margin-bottom:var(--ibiz-spacing-extra-tight)}.ibiz-form-item-container--bottom .ibiz-form-item-container__label{margin-top:var(--ibiz-spacing-extra-tight)}.ibiz-form-item-container--left .ibiz-form-item-container__label{padding:var(--ibiz-form-item-container-label-left-padding);line-height:var(--ibiz-form-item-container-line-height);text-align:right}.ibiz-form-item-container--right .ibiz-form-item-container__label{padding:var(--ibiz-form-item-container-label-right-padding);line-height:var(--ibiz-form-item-container-line-height);text-align:left}.ibiz-form-item-container.is-required .ibiz-form-item-container__label::before{display:inline-block;margin-right:4px;font-family:SimSun;line-height:1;color:var(--ibiz-form-item-container-require-mark-color);content:"*"}.ibiz-form-item-container__content{display:flex;flex-flow:column nowrap;position:relative;flex-grow:1}.ibiz-form-item-container__content--label-left,.ibiz-form-item-container__content--label-none,.ibiz-form-item-container__content--label-right{height:100%}.ibiz-form-item-container__editor{position:relative;flex-grow:1;height:100%}.ibiz-form-item-container__error{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;position:absolute;top:100%;width:100%;font-size:var(--ibiz-form-item-container-error-font-size);line-height:calc(var(--ibiz-form-item-container-error-font-size) + 2px);color:var(--ibiz-form-item-container-error-color);word-wrap:break-word}.ibiz-form-item-container.is-error .ibiz-form-item-container__editor .el-input__wrapper{box-shadow:0 0 0 1px var(--ibiz-form-item-container-error-color) inset}

package/lib/control/form/form-detail/form-item/form-item.cjs

@@ -6,6 +6,7 @@ var vue = require('vue');
 var vue3Util = require('@ibiz-template/vue3-util');
 require('./form-item.css');
 var runtime = require('@ibiz-template/runtime');
+var compositeFormItem = require('./composite-form-item/composite-form-item.cjs');
 
 "use strict";
 function _isSlot(s) {
@@ -31,8 +32,8 @@ const FormItem = /* @__PURE__ */ vue.defineComponent({
     var _a, _b, _c, _d;
     const ns = vue3Util.useNamespace("form-item");
     const c = props.controller;
-    const onValueChange = (val, name) => {
-      props.controller.setDataValue(val, name);
+    const onValueChange = (val, name, ignore = false) => {
+      props.controller.setDataValue(val, name, ignore);
     };
     const extraParams = vue.ref({});
     let emptyHiddenUnit = ibiz.config.form.emptyHiddenUnit;
@@ -63,47 +64,63 @@ const FormItem = /* @__PURE__ */ vue.defineComponent({
       return null;
     }
     let editor = null;
-    const editMode = (_d = (_c = (_b = this.controller.editor) == null ? void 0 : _b.model) == null ? void 0 : _c.editorParams) == null ? void 0 : _d.editMode;
-    const editorProps = {
-      style: (_e = this.controller.editor) == null ? void 0 : _e.style,
-      value: this.controller.value,
-      data: this.controller.data,
-      controller: this.controller.editor,
-      disabled: this.controller.state.disabled,
-      readonly: this.controller.state.readonly,
-      onChange: this.onValueChange,
-      extraParams: this.extraParams,
-      controlParams: editMode ? {
-        ...this.controller.form.controlParams,
-        editmode: editMode
-      } : this.controller.form.controlParams,
-      onFocus: (event) => this.c.onFocus(event),
-      onBlur: (event) => this.c.onBlur(event),
-      onEnter: (event) => this.controller.onEnter(event),
-      onClick: (event, params) => this.controller.onClick(event, params),
-      ...this.attrs
-    };
-    if (this.c.form.state.isLoaded) {
-      if (this.$slots.default) {
-        editor = this.$slots.default(editorProps);
-      } else if (this.controller.editorProvider) {
-        const component = vue.resolveComponent(this.controller.editorProvider.formEditor);
-        editor = vue.h(component, {
-          ...editorProps
-        });
-      } else {
-        editor = vue.createVNode(vue.resolveComponent("not-supported-editor"), {
-          "modelData": this.modelData.editor
+    const compositeItem = this.controller.model.compositeItem;
+    if (compositeItem) {
+      const {
+        editorItems = []
+      } = this.controller.model.editor || {};
+      editor = editorItems.map((item) => {
+        const controller = this.controller.form.details[item.id];
+        return vue.createVNode(compositeFormItem.CompositeFormItem, {
+          "modelData": controller.model,
+          "controller": controller,
+          "attrs": this.attrs
         }, null);
+      });
+    } else {
+      const editMode = (_d = (_c = (_b = this.controller.editor) == null ? void 0 : _b.model) == null ? void 0 : _c.editorParams) == null ? void 0 : _d.editMode;
+      const editorProps = {
+        style: (_e = this.controller.editor) == null ? void 0 : _e.style,
+        value: this.controller.value,
+        data: this.controller.data,
+        controller: this.controller.editor,
+        disabled: this.controller.state.disabled,
+        readonly: this.controller.state.readonly,
+        onChange: this.onValueChange,
+        extraParams: this.extraParams,
+        controlParams: editMode ? {
+          ...this.controller.form.controlParams,
+          editmode: editMode
+        } : this.controller.form.controlParams,
+        onFocus: (event) => this.c.onFocus(event),
+        onBlur: (event) => this.c.onBlur(event),
+        onEnter: (event) => this.controller.onEnter(event),
+        onClick: (event, params) => this.controller.onClick(event, params),
+        ...this.attrs
+      };
+      if (this.c.form.state.isLoaded) {
+        if (this.$slots.default) {
+          editor = this.$slots.default(editorProps);
+        } else if (this.controller.editorProvider) {
+          const component = vue.resolveComponent(this.controller.editorProvider.formEditor);
+          editor = vue.h(component, {
+            ...editorProps
+          });
+        } else {
+          editor = vue.createVNode(vue.resolveComponent("not-supported-editor"), {
+            "modelData": this.modelData.editor
+          }, null);
+        }
       }
     }
     return vue.createVNode(vue.resolveComponent("iBizFormItemContainer"), {
       "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],
+      "class": [this.ns.b(), this.ns.m(this.modelData.id), this.ns.is("compositeItem", compositeItem), ...this.controller.containerClass],
       "style": this.modelData.cssStyle,
       "required": this.c.state.required,
       "error": this.c.state.error,
       "label": this.c.labelCaption,
+      "labelSysImg": this.modelData.sysImage,
       "labelClass": this.controller.labelClass,
       "label-pos": this.c.model.labelPos,
       "label-width": this.c.model.labelWidth,

package/lib/control/form/form-detail/form-item/form-item.css

@@ -1 +1 @@
-.ibiz-form-item{border-color:var(--ibiz-color-border);--ibiz-form-item-label-color:var(--ibiz-color-text-1);--ibiz-form-item-text-color:var(--ibiz-color-text-2);--ibiz-form-item-hover-color:var(--ibiz-color-text-0);--ibiz-form-item-hover-bg-color:var(--ibiz-color-fill-1);--ibiz-form-item-readonly-color:var(--ibiz-color-disabled-text);--ibiz-form-item-border-color:transparent;--ibiz-form-item-font-size:var(--ibiz-font-size-regular);--ibiz-form-item-placeholder-color:var(--ibiz-color-text-3);--ibiz-form-item-disabled-color:var(--ibiz-color-disabled-text);--ibiz-form-item-disabled-bg-color:var(--ibiz-color-disabled-fill);--ibiz-form-item-disabled-border-color:var(--ibiz-color-disabled-border);--ibiz-form-item-active-bg:var(--ibiz-color-fill-2);--ibiz-form-item-active-border:var(--ibiz-active-bg);--ibiz-form-item-focus-bg:var(--ibiz-color-fill-0);--ibiz-form-item-focus-border:var(--ibiz-color-focus-border);--ibiz-form-item-line-height:var(--ibiz-editor-default-line-height);--ibiz-form-item-font-weight:var(--ibiz-font-weight-regular);--ibiz-form-item-hover-edit-padding:var(--ibiz-spacing-none) 11px}
+.ibiz-form-item{border-color:var(--ibiz-color-border);--ibiz-form-item-label-color:var(--ibiz-color-text-1);--ibiz-form-item-text-color:var(--ibiz-color-text-2);--ibiz-form-item-hover-color:var(--ibiz-color-text-0);--ibiz-form-item-hover-bg-color:var(--ibiz-color-fill-1);--ibiz-form-item-readonly-color:var(--ibiz-color-disabled-text);--ibiz-form-item-border-color:transparent;--ibiz-form-item-font-size:var(--ibiz-font-size-regular);--ibiz-form-item-placeholder-color:var(--ibiz-color-text-3);--ibiz-form-item-disabled-color:var(--ibiz-color-disabled-text);--ibiz-form-item-disabled-bg-color:var(--ibiz-color-disabled-fill);--ibiz-form-item-disabled-border-color:var(--ibiz-color-disabled-border);--ibiz-form-item-active-bg:var(--ibiz-color-fill-2);--ibiz-form-item-active-border:var(--ibiz-active-bg);--ibiz-form-item-focus-bg:var(--ibiz-color-fill-0);--ibiz-form-item-focus-border:var(--ibiz-color-focus-border);--ibiz-form-item-line-height:var(--ibiz-editor-default-line-height);--ibiz-form-item-font-weight:var(--ibiz-font-weight-regular);--ibiz-form-item-hover-edit-padding:var(--ibiz-spacing-none) 11px}.ibiz-form-item.is-compositeItem{--ibiz-form-item-compositeItem-gap:var(--ibiz-spacing-tight)}.ibiz-form-item.is-compositeItem .ibiz-form-item-container__editor{display:flex;gap:var(--ibiz-form-item-compositeItem-gap)}

package/lib/control/form/form-detail/form-tab-panel/form-tab-panel.cjs

@@ -80,7 +80,7 @@ const FormTabPanel = /* @__PURE__ */ vue.defineComponent({
       }, null), c.model.showCaption && c.model.caption]);
     };
     return vue.createVNode(vue.resolveComponent("el-tabs"), {
-      "class": [this.ns.b(), this.ns.m(this.modelData.codeName), ...this.controller.containerClass],
+      "class": [this.ns.b(), this.ns.m(this.modelData.codeName), this.modelData.detailStyle ? this.ns.m(this.modelData.detailStyle.toLowerCase()) : "", ...this.controller.containerClass],
       "model-value": this.controller.state.activeTab,
       "onTabClick": this.onTabClick
     }, _isSlot(_slot2 = defaultSlots.map((slot) => {

package/lib/control/gantt/gantt.cjs

@@ -9,6 +9,9 @@ var elTreeUtil = require('../tree/el-tree-util.cjs');
 require('./gantt.css');
 
 "use strict";
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !vue.isVNode(s);
+}
 const GanttControl = /* @__PURE__ */ vue.defineComponent({
   name: "IBizGanttControl",
   props: {
@@ -322,10 +325,20 @@ const GanttControl = /* @__PURE__ */ vue.defineComponent({
       const {
         isLoaded
       } = c.state;
+      const noDataSlots = {};
+      if (vue3Util.hasEmptyPanelRenderer(c)) {
+        Object.assign(noDataSlots, {
+          customRender: () => vue.createVNode(vue3Util.IBizCustomRender, {
+            "controller": c
+          }, null)
+        });
+      }
       return isLoaded && vue.createVNode(vue.resolveComponent("iBizNoData"), {
         "text": c.model.emptyText,
         "emptyTextLanguageRes": c.model.emptyTextLanguageRes
-      }, null);
+      }, _isSlot(noDataSlots) ? noDataSlots : {
+        default: () => [noDataSlots]
+      });
     };
     const renderColumn = (model, index) => {
       const {

package/lib/control/grid/grid/grid-control.util.cjs

@@ -4,6 +4,8 @@ var core = require('@ibiz-template/core');
 var runtime = require('@ibiz-template/runtime');
 var lodashEs = require('lodash-es');
 var vue = require('vue');
+require('../../../util/index.cjs');
+var keydownUtil = require('../../../util/keydown-util/keydown-util.cjs');
 
 "use strict";
 function sortMergeData(rowSpanKeys, items) {
@@ -33,16 +35,58 @@ function useITableEvent(c) {
   let isCtrlDown = false;
   let cleanKeyDown = core.NOOP;
   let cleanKeyUp = core.NOOP;
+  let cleanClick = core.NOOP;
+  let cleanEnter = core.NOOP;
   cleanKeyDown = core.listenJSEvent(window, "keydown", (e) => {
-    if (e.code === "ControlLeft") {
+    if (e.code === "ControlLeft" && !c.state.singleSelect) {
       isCtrlDown = true;
     }
   });
   cleanKeyUp = core.listenJSEvent(window, "keyup", (e) => {
-    if (e.code === "ControlLeft") {
+    if (e.code === "ControlLeft" && !c.state.singleSelect) {
       isCtrlDown = false;
     }
   });
+  if (c.state.isAutoGrid) {
+    if (c.editShowMode === "row") {
+      cleanClick = core.listenJSEvent(window, "click", async (event) => {
+        const classList = [];
+        core.eventPath(event).forEach((e) => {
+          if (e && e.classList) {
+            classList.push(...e.classList);
+          }
+        });
+        if (classList.includes("el-popper") || classList.includes("el-scrollbar") || classList.includes("el-table__row"))
+          return;
+        const editingRow = c.state.rows.find((item) => item.showRowEdit);
+        if (editingRow) {
+          await c.switchRowEdit(editingRow);
+        }
+      });
+    }
+    const timer = setInterval(() => {
+      var _a;
+      const tableEl = (_a = tableRef.value) == null ? void 0 : _a.$el;
+      if (tableEl) {
+        clearInterval(timer);
+        const querySelect = [
+          "tbody select",
+          "tbody textarea",
+          'tbody input:not([type="checkbox"])'
+        ];
+        const callback = async () => {
+          if (c.editShowMode === "row") {
+            const editingRow = c.state.rows.find((item) => item.showRowEdit);
+            if (editingRow) {
+              await c.switchRowEdit(editingRow);
+            }
+          }
+        };
+        const { cleanup } = keydownUtil.useFocusByEnter(tableEl, querySelect, callback);
+        cleanEnter = cleanup;
+      }
+    }, 300);
+  }
   c.evt.on("onToggleRowExpansion", (event) => {
     const { row, expand } = event;
     if (tableRef.value) {
@@ -58,7 +102,41 @@ function useITableEvent(c) {
       }
     }
   });
+  async function onRowClickDynamic(data, _column, _event) {
+    if (data.srfuf === runtime.Srfuf.CREATE) {
+      if (c.editShowMode === "row") {
+        const row = c.findRowState(data);
+        if (row) {
+          await c.switchRowEdit(row);
+        }
+      }
+      return;
+    }
+    if (isCtrlDown) {
+      const selection = [...c.state.selectedData];
+      const index = selection.findIndex((x) => x.srfkey === data.srfkey);
+      if (index !== -1) {
+        selection.splice(index, 1);
+        c.setSelection(selection);
+      } else {
+        c.setSelection([...selection, data]);
+      }
+      return;
+    }
+    if (c.editShowMode === "row" && c.allowRowEdit) {
+      const row = c.findRowState(data);
+      if (row) {
+        await c.switchRowEdit(row);
+      }
+    } else {
+      c.onRowClick(data);
+    }
+  }
   async function onRowClick(data, _column, _event) {
+    if (c.state.isAutoGrid) {
+      await onRowClickDynamic(data, _column, _event);
+      return;
+    }
     if (data.srfuf === runtime.Srfuf.CREATE) {
       return;
     }
@@ -228,7 +306,9 @@ function useITableEvent(c) {
     handleRowClassName,
     handleHeaderCellClassName,
     cleanKeyDown,
-    cleanKeyUp
+    cleanKeyUp,
+    cleanClick,
+    cleanEnter
   };
 }
 function useAppGridPagination(c) {