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

package/lib/control/calendar/calendar.cjs

@@ -111,9 +111,6 @@ const CalendarControl = /* @__PURE__ */ vue.defineComponent({
         backgroundColor: data.bkColor
       };
     };
-    const onShowNavView = () => {
-      c.state.showNavView = !c.state.showNavView;
-    };
     const calcCalendarItems = (date) => {
       const weekRange = calendarUtil.getWeekRange(date);
       const calendarItems = c.state.items.filter((item) => {
@@ -139,6 +136,146 @@ const CalendarControl = /* @__PURE__ */ vue.defineComponent({
       }
       return calendarItems;
     };
+    let ContextMenu;
+    const iBizRawItem = vue.resolveComponent("IBizRawItem");
+    const iBizIcon = vue.resolveComponent("IBizIcon");
+    c.evt.on("onMounted", () => {
+      if (Object.values(c.contextMenus).length > 0) {
+        const importMenu = () => import('@imengyu/vue3-context-menu');
+        importMenu().then((value) => {
+          ContextMenu = value.default;
+          if (ContextMenu.default && !ContextMenu.showContextMenu) {
+            ContextMenu = ContextMenu.default;
+          }
+        });
+      }
+    });
+    const calcContextMenuItems = (toolbarItems, calendarData, evt, menuState) => {
+      const result = [];
+      toolbarItems.forEach((item) => {
+        var _a, _b;
+        if (item.itemType === "SEPERATOR") {
+          result.push({
+            divided: "self"
+          });
+          return;
+        }
+        const buttonState = menuState[item.id];
+        if (buttonState && !buttonState.visible) {
+          return;
+        }
+        let menuItem = {};
+        if (item.showCaption && item.caption) {
+          menuItem.label = item.caption;
+        }
+        if (item.sysImage && item.showIcon) {
+          menuItem.icon = vue.createVNode(iBizIcon, {
+            "icon": item.sysImage
+          }, null);
+        }
+        if (item.itemType === "DEUIACTION") {
+          menuItem.disabled = buttonState.disabled;
+          menuItem.clickClose = true;
+          const {
+            uiactionId
+          } = item;
+          if (uiactionId) {
+            menuItem.onClick = () => {
+              c.doUIAction(uiactionId, calendarData, evt, item.appId);
+            };
+          }
+        } else if (item.itemType === "RAWITEM") {
+          const {
+            rawItem
+          } = item;
+          if (rawItem) {
+            menuItem.label = vue.createVNode(iBizRawItem, {
+              "rawItem": item
+            }, null);
+          }
+        } else if (item.itemType === "ITEMS") {
+          const group = item;
+          if ((_a = group.detoolbarItems) == null ? void 0 : _a.length) {
+            menuItem.children = calcContextMenuItems(group.detoolbarItems, calendarData, evt, menuState);
+          }
+          if (group.uiactionGroup && group.groupExtractMode) {
+            const menuItems = (_b = group.uiactionGroup.uiactionGroupDetails) == null ? void 0 : _b.filter((detail) => {
+              const detailState = menuState[detail.id];
+              return detailState.visible;
+            }).map((detail) => {
+              const detailState = menuState[detail.id];
+              const {
+                sysImage
+              } = detail;
+              return {
+                label: detail.showCaption ? detail.caption : void 0,
+                icon: detail.showIcon ? vue.createVNode(iBizIcon, {
+                  "icon": sysImage
+                }, null) : void 0,
+                disabled: detailState.disabled,
+                clickableWhenHasChildren: true,
+                onClick: () => {
+                  ContextMenu.closeContextMenu();
+                  c.doUIAction(detail.uiactionId, calendarData, evt, detail.appId);
+                }
+              };
+            });
+            switch (group.groupExtractMode) {
+              case "ITEMS":
+                menuItem.children = menuItems;
+                break;
+              case "ITEMX":
+                if (menuItems) {
+                  menuItem = menuItems[0];
+                  menuItem.children = menuItems.slice(1);
+                }
+                break;
+              case "ITEM":
+              default:
+                menuItem = void 0;
+                if (menuItems) {
+                  result.push(...menuItems);
+                }
+                break;
+            }
+          }
+        }
+        if (menuItem) {
+          result.push(menuItem);
+        }
+      });
+      return result;
+    };
+    const onNodeContextmenu = async (item, evt) => {
+      evt.preventDefault();
+      evt.stopPropagation();
+      const {
+        sysCalendarItems
+      } = c.model;
+      const targetCalendarItem = sysCalendarItems == null ? void 0 : sysCalendarItems.find((_item) => {
+        return _item.id === item.itemType;
+      });
+      if (!(targetCalendarItem == null ? void 0 : targetCalendarItem.decontextMenu)) {
+        return;
+      }
+      const contextMenuC = c.contextMenus[targetCalendarItem.decontextMenu.id];
+      if (!contextMenuC.model.detoolbarItems) {
+        return;
+      }
+      await contextMenuC.calcButtonState(item.deData || (item.deData ? item : void 0), targetCalendarItem.appDataEntityId);
+      const menuState = contextMenuC.state.buttonsState;
+      const menus = calcContextMenuItems(contextMenuC.model.detoolbarItems, item, evt, menuState);
+      if (!menus.length) {
+        return;
+      }
+      ContextMenu.showContextMenu({
+        x: evt.x,
+        y: evt.y,
+        customClass: ns.b("context-menu"),
+        items: menus,
+        zIndex: 9999
+      });
+    };
     return {
       c,
       ns,
@@ -148,8 +285,8 @@ const CalendarControl = /* @__PURE__ */ vue.defineComponent({
       popoverValue,
       selectDate,
       calcItemStyle,
-      onShowNavView,
-      calcCalendarItems
+      calcCalendarItems,
+      onNodeContextmenu
     };
   },
   render() {
@@ -165,7 +302,7 @@ const CalendarControl = /* @__PURE__ */ vue.defineComponent({
         beginTime: item.beginTime,
         endTime: item.endTime,
         date
-      })), this.ns.is("end-time", date && dayjs(date).isSame(item.endTime, "day"))];
+      })), this.ns.is("no-begin-time", this.showDateRange && !item.beginTime), this.ns.is("no-end-time", this.showDateRange && !item.endTime), this.ns.is("end-time", date && dayjs(date).isSame(item.endTime, "day"))];
       const style = this.calcItemStyle(item);
       return vue.createVNode(vue.resolveComponent("iBizControlShell"), {
         "class": itemClass,
@@ -181,7 +318,8 @@ const CalendarControl = /* @__PURE__ */ vue.defineComponent({
         "onDblclick": (e) => {
           e.stopPropagation();
           return this.c.onDbRowClick(item);
-        }
+        },
+        "onContextmenu": (e) => this.onNodeContextmenu(item, e)
       }, null);
     };
     const renderDefaultItem = (item, date) => {
@@ -192,7 +330,7 @@ const CalendarControl = /* @__PURE__ */ vue.defineComponent({
         beginTime: item.beginTime,
         endTime: item.endTime,
         date
-      })), this.ns.is("end-time", date && dayjs(date).isSame(item.endTime, "day"))];
+      })), this.ns.is("no-begin-time", this.showDateRange && !item.beginTime), this.ns.is("no-end-time", this.showDateRange && !item.endTime), this.ns.is("end-time", date && dayjs(date).isSame(item.endTime, "day"))];
       const style = this.calcItemStyle(item);
       return vue.createVNode("div", {
         "class": itemClass,
@@ -200,8 +338,9 @@ const CalendarControl = /* @__PURE__ */ vue.defineComponent({
         "style": style,
         "title": core.showTitle(item.tips || item.text),
         "onClick": () => this.c.onRowClick(item),
-        "onDblclick": () => this.c.onDbRowClick(item)
-      }, [this.showDateRange ? date && (dayjs(date).isSame(item.beginTime, "day") || dayjs(date).day() === 0) ? item.text : "" : item.text]);
+        "onDblclick": () => this.c.onDbRowClick(item),
+        "onContextmenu": (evt) => this.onNodeContextmenu(item, evt)
+      }, [this.showDateRange ? date && (dayjs(date).isSame(item.beginTime, "day") || dayjs(date).day() === 0 || !item.beginTime && dayjs(date).isSame(item.endTime, "day")) ? item.text : "" : item.text]);
     };
     const renderCalendarItem = (item, date) => {
       var _a;
@@ -335,11 +474,21 @@ const CalendarControl = /* @__PURE__ */ vue.defineComponent({
       const {
         isLoaded
       } = this.c.state;
+      const noDataSlots = {};
+      if (vue3Util.hasEmptyPanelRenderer(this.c)) {
+        Object.assign(noDataSlots, {
+          customRender: () => vue.createVNode(vue3Util.IBizCustomRender, {
+            "controller": this.c
+          }, null)
+        });
+      }
       return isLoaded && vue.createVNode(vue.resolveComponent("iBizNoData"), {
         "text": this.c.model.emptyText,
         "emptyTextLanguageRes": this.c.model.emptyTextLanguageRes,
         "hideNoDataImage": this.c.state.hideNoDataImage
-      }, null);
+      }, _isSlot(noDataSlots) ? noDataSlots : {
+        default: () => [noDataSlots]
+      });
     };
     const renderWeekDay = () => {
       const slots = {};
@@ -425,16 +574,16 @@ const CalendarControl = /* @__PURE__ */ vue.defineComponent({
       default: () => [vue.createVNode(vue.resolveComponent("iBizControlBase"), {
         "controller": this.c
       }, {
-        default: () => [renderCalendar(), this.c.state.enableNavView ? !this.c.state.showNavView ? vue.createVNode("ion-icon", {
+        default: () => [renderCalendar(), 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]
       })]
     });

package/lib/control/calendar/calendar.css

@@ -1 +1 @@
-.ibiz-control-calendar{--ibiz-control-calendar-text-color:var(--ibiz-color-text-0);--ibiz-control-calendar-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-active-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-border-color:var(--ibiz-color-primary-active);--ibiz-control-calendar-font-size:var(--ibiz-font-size-small);--ibiz-control-calendar-item-padding:var(--ibiz-spacing-tight);--ibiz-control-calendar-border-radius:var(--ibiz-border-radius-small);--ibiz-control-calendar-margin:var(--ibiz-spacing-extra-tight);position:relative;width:100%;height:100%}.ibiz-control-calendar__nav-icon{position:absolute;top:18px;right:0;color:var(--ibiz-color-primary);cursor:pointer}.ibiz-control-calendar__calendar-item{display:flex;align-items:center;padding:var(--ibiz-control-calendar-item-padding)}.ibiz-control-calendar__icon{width:var(--ibiz-width-icon-small);height:var(--ibiz-width-icon-small);margin-right:var(--ibiz-spacing-base-tight);border-radius:var(--ibiz-border-radius-circle)}.ibiz-control-calendar-content{display:flex;flex-direction:column;width:100%;height:100%}.ibiz-control-calendar-content .el-calendar{display:flex;flex-direction:column;height:100%}.ibiz-control-calendar-content .el-calendar__header{flex-wrap:wrap}.ibiz-control-calendar-content .el-calendar-table,.ibiz-control-calendar-content .el-calendar-table .el-calendar-day{width:100%;height:100%;min-height:90px;cursor:pointer}.ibiz-control-calendar-content .el-calendar-table{flex:1;width:-moz-fit-content;width:fit-content}.ibiz-control-calendar-content .el-calendar-table .el-calendar-day:hover{cursor:pointer;background-color:var(--el-calendar-selected-bg-color)}.ibiz-control-calendar-content .el-calendar__body{display:flex;flex:1;padding:0;overflow:auto}.ibiz-control-calendar-content.is-show-date-range .el-calendar-day{padding:var(--ibiz-spacing-tight) 0}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item{width:calc(100% + 1px);min-height:34px;border-radius:0}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-begin-time{width:100%;margin-left:var(--ibiz-spacing-super-tight);border-radius:var(--ibiz-spacing-extra-tight) 0 0 var(--ibiz-spacing-extra-tight)}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-begin-time.is-end-time{width:calc(100% - var(--ibiz-spacing-super-tight) * 2);border-radius:var(--ibiz-spacing-extra-tight)}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-end-time{width:calc(100% - var(--ibiz-spacing-super-tight));border-radius:0 var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-extra-tight) 0}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-active{border-right:none;border-left:none}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-active.is-begin-time{border-left:solid .5px var(--ibiz-control-calendar-border-color)}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-active.is-end-time{border-right:solid .5px var(--ibiz-control-calendar-border-color)}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-hidden{position:relative;z-index:-1;opacity:0}.ibiz-control-calendar-more{width:100%;font-size:var(--ibiz-font-size-small);border-radius:var(--ibiz-spacing-extra-tight)}.ibiz-control-calendar-more:hover{background-color:var(--ibiz-control-calendar-hover-bg-color)}.ibiz-control-calendar-item{--ibiz-control-calendar-text-color:var(--ibiz-color-text-0);--ibiz-control-calendar-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-active-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-border-color:var(--ibiz-color-primary-active);--ibiz-control-calendar-font-size:var(--ibiz-font-size-small);--ibiz-control-calendar-item-padding:var(--ibiz-spacing-tight);--ibiz-control-calendar-border-radius:var(--ibiz-border-radius-small);--ibiz-control-calendar-margin:var(--ibiz-spacing-extra-tight);height:100%;padding:var(--ibiz-control-calendar-item-padding);margin-bottom:var(--ibiz-control-calendar-margin);overflow:hidden;font-size:var(--ibiz-control-calendar-font-size);color:var(--ibiz-control-calendar-text-color);text-overflow:ellipsis;white-space:nowrap;cursor:pointer;border:solid .5px transparent;border-radius:var(--ibiz-control-calendar-border-radius)}.ibiz-control-calendar-item:hover{background-color:var(--ibiz-control-calendar-hover-bg-color)}.ibiz-control-calendar-item.is-active{background-color:var(--ibiz-control-calendar-active-bg-color);border:solid .5px var(--ibiz-control-calendar-border-color)}.ibiz-control-calendar-date-text{--ibiz-control-calendar-text-color:var(--ibiz-color-text-0);--ibiz-control-calendar-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-active-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-border-color:var(--ibiz-color-primary-active);--ibiz-control-calendar-font-size:var(--ibiz-font-size-small);--ibiz-control-calendar-item-padding:var(--ibiz-spacing-tight);--ibiz-control-calendar-border-radius:var(--ibiz-border-radius-small);--ibiz-control-calendar-margin:var(--ibiz-spacing-extra-tight);padding-bottom:var(--ibiz-control-calendar-item-padding);margin:0;text-align:center}.ibiz-control-calendar-day{height:-moz-fit-content;height:fit-content}.ibiz-control-calendar-content-title{line-height:var(--ibiz-editor-default-line-height)}.ibiz-control-calendar-content-header{--ibiz-control-calendar-text-color:var(--ibiz-color-text-0);--ibiz-control-calendar-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-active-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-border-color:var(--ibiz-color-primary-active);--ibiz-control-calendar-font-size:var(--ibiz-font-size-small);--ibiz-control-calendar-item-padding:var(--ibiz-spacing-tight);--ibiz-control-calendar-border-radius:var(--ibiz-border-radius-small);--ibiz-control-calendar-margin:var(--ibiz-spacing-extra-tight);display:flex;align-items:center}.ibiz-control-calendar-content-header>*+*{margin-left:var(--ibiz-control-calendar-item-padding)}.ibiz-control-calendar-legend{display:flex;justify-content:flex-end;width:100%}.ibiz-control-calendar-legend>*+*{margin-left:var(--ibiz-spacing-base-loose)}.ibiz-control-calendar-timeline-content .el-timeline{padding-left:0}
+.ibiz-control-calendar{--ibiz-control-calendar-text-color:var(--ibiz-color-text-0);--ibiz-control-calendar-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-active-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-border-color:var(--ibiz-color-primary-active);--ibiz-control-calendar-font-size:var(--ibiz-font-size-small);--ibiz-control-calendar-item-padding:var(--ibiz-spacing-tight);--ibiz-control-calendar-border-radius:var(--ibiz-border-radius-small);--ibiz-control-calendar-margin:var(--ibiz-spacing-extra-tight);position:relative;width:100%;height:100%}.ibiz-control-calendar__nav-icon{position:absolute;top:18px;right:0;color:var(--ibiz-color-primary);cursor:pointer}.ibiz-control-calendar__calendar-item{display:flex;align-items:center;padding:var(--ibiz-control-calendar-item-padding)}.ibiz-control-calendar__icon{width:var(--ibiz-width-icon-small);height:var(--ibiz-width-icon-small);margin-right:var(--ibiz-spacing-base-tight);border-radius:var(--ibiz-border-radius-circle)}.ibiz-control-calendar-content{display:flex;flex-direction:column;width:100%;height:100%}.ibiz-control-calendar-content .el-calendar{display:flex;flex-direction:column;height:100%}.ibiz-control-calendar-content .el-calendar__header{flex-wrap:wrap}.ibiz-control-calendar-content .el-calendar-table,.ibiz-control-calendar-content .el-calendar-table .el-calendar-day{width:100%;height:100%;min-height:90px;cursor:pointer}.ibiz-control-calendar-content .el-calendar-table{flex:1;width:-moz-fit-content;width:fit-content}.ibiz-control-calendar-content .el-calendar-table .el-calendar-day:hover{cursor:pointer;background-color:var(--el-calendar-selected-bg-color)}.ibiz-control-calendar-content .el-calendar__body{display:flex;flex:1;padding:0;overflow:auto}.ibiz-control-calendar-content.is-show-date-range .el-calendar-day{padding:var(--ibiz-spacing-tight) 0}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item{width:calc(100% + 1px);min-height:34px;border-radius:0}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-begin-time{width:100%;margin-left:var(--ibiz-spacing-super-tight);border-radius:var(--ibiz-spacing-extra-tight) 0 0 var(--ibiz-spacing-extra-tight)}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-begin-time.is-end-time{width:calc(100% - var(--ibiz-spacing-super-tight) * 2);border-radius:var(--ibiz-spacing-extra-tight)}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-end-time{width:calc(100% - var(--ibiz-spacing-super-tight));border-radius:0 var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-extra-tight) 0}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-active{border-right:none;border-left:none}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-active.is-begin-time{border-left:solid .5px var(--ibiz-control-calendar-border-color)}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-active.is-end-time{border-right:solid .5px var(--ibiz-control-calendar-border-color)}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-hidden{position:relative;z-index:-1;opacity:0}.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-no-begin-time,.ibiz-control-calendar-content.is-show-date-range .ibiz-control-calendar-item.is-no-end-time{width:calc(100% - var(--ibiz-spacing-super-tight) * 2);margin-left:var(--ibiz-spacing-super-tight);border-radius:var(--ibiz-spacing-extra-tight)}.ibiz-control-calendar-more{width:100%;font-size:var(--ibiz-font-size-small);border-radius:var(--ibiz-spacing-extra-tight)}.ibiz-control-calendar-more:hover{background-color:var(--ibiz-control-calendar-hover-bg-color)}.ibiz-control-calendar-item{--ibiz-control-calendar-text-color:var(--ibiz-color-text-0);--ibiz-control-calendar-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-active-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-border-color:var(--ibiz-color-primary-active);--ibiz-control-calendar-font-size:var(--ibiz-font-size-small);--ibiz-control-calendar-item-padding:var(--ibiz-spacing-tight);--ibiz-control-calendar-border-radius:var(--ibiz-border-radius-small);--ibiz-control-calendar-margin:var(--ibiz-spacing-extra-tight);height:100%;padding:var(--ibiz-control-calendar-item-padding);margin-bottom:var(--ibiz-control-calendar-margin);overflow:hidden;font-size:var(--ibiz-control-calendar-font-size);color:var(--ibiz-control-calendar-text-color);text-overflow:ellipsis;white-space:nowrap;cursor:pointer;border:solid .5px transparent;border-radius:var(--ibiz-control-calendar-border-radius)}.ibiz-control-calendar-item:hover{background-color:var(--ibiz-control-calendar-hover-bg-color)}.ibiz-control-calendar-item.is-active{background-color:var(--ibiz-control-calendar-active-bg-color);border:solid .5px var(--ibiz-control-calendar-border-color)}.ibiz-control-calendar-date-text{--ibiz-control-calendar-text-color:var(--ibiz-color-text-0);--ibiz-control-calendar-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-active-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-border-color:var(--ibiz-color-primary-active);--ibiz-control-calendar-font-size:var(--ibiz-font-size-small);--ibiz-control-calendar-item-padding:var(--ibiz-spacing-tight);--ibiz-control-calendar-border-radius:var(--ibiz-border-radius-small);--ibiz-control-calendar-margin:var(--ibiz-spacing-extra-tight);padding-bottom:var(--ibiz-control-calendar-item-padding);margin:0;text-align:center}.ibiz-control-calendar-day{height:-moz-fit-content;height:fit-content}.ibiz-control-calendar-content-title{line-height:var(--ibiz-editor-default-line-height)}.ibiz-control-calendar-content-header{--ibiz-control-calendar-text-color:var(--ibiz-color-text-0);--ibiz-control-calendar-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-active-bg-color:var(--ibiz-color-fill-0);--ibiz-control-calendar-border-color:var(--ibiz-color-primary-active);--ibiz-control-calendar-font-size:var(--ibiz-font-size-small);--ibiz-control-calendar-item-padding:var(--ibiz-spacing-tight);--ibiz-control-calendar-border-radius:var(--ibiz-border-radius-small);--ibiz-control-calendar-margin:var(--ibiz-spacing-extra-tight);display:flex;align-items:center}.ibiz-control-calendar-content-header>*+*{margin-left:var(--ibiz-control-calendar-item-padding)}.ibiz-control-calendar-legend{display:flex;justify-content:flex-end;width:100%}.ibiz-control-calendar-legend>*+*{margin-left:var(--ibiz-spacing-base-loose)}.ibiz-control-calendar-timeline-content .el-timeline{padding-left:0}

package/lib/control/chart/chart.cjs

@@ -201,11 +201,21 @@ const ChartControl = /* @__PURE__ */ vue.defineComponent({
     };
     const renderNoData = () => {
       if (c.state.items.length === 0) {
+        const noDataSlots = {};
+        if (vue3Util.hasEmptyPanelRenderer(c)) {
+          Object.assign(noDataSlots, {
+            customRender: () => vue.createVNode(vue3Util.IBizCustomRender, {
+              "controller": c
+            }, null)
+          });
+        }
         return vue.createVNode(vue.resolveComponent("iBizNoData"), {
           "text": c.model.emptyText,
           "emptyTextLanguageRes": c.model.emptyTextLanguageRes,
           "hideNoDataImage": c.state.hideNoDataImage
-        }, null);
+        }, _isSlot(noDataSlots) ? noDataSlots : {
+          default: () => [noDataSlots]
+        });
       }
     };
     vue.onBeforeUnmount(() => {

package/lib/control/context-menu/context-menu.cjs

@@ -45,6 +45,11 @@ const ContextMenuControl = /* @__PURE__ */ vue.defineComponent({
     nodeModel: {
       type: Object,
       required: true
+    },
+    // 行为回调，和action-click事件互斥，二者只有一个生效，actionCallBack优先级大于行为回调
+    // 二者区别在于：行为回调为同步执行（主要解决pop打开视图位置异常），action-click为异步执行（不关心执行是否完成）
+    actionCallBack: {
+      type: Function
     }
   },
   setup(props, {
@@ -97,15 +102,21 @@ const ContextMenuControl = /* @__PURE__ */ vue.defineComponent({
     c.evt.on("onCreated", async () => {
       await c.calcButtonState(props.nodeData._deData || (props.nodeData.srfkey ? props.nodeData : void 0), props.nodeModel.appDataEntityId);
     });
-    const handleClick = (detail, e) => {
+    const handleClick = async (detail, e) => {
+      e.stopPropagation();
+      if (!detail.uiactionId) {
+        popoverVisible.value = false;
+        return;
+      }
+      if (props.actionCallBack) {
+        await props.actionCallBack(detail, e);
+      }
       if (props.mode === "buttons") {
         popoverVisible.value = false;
       } else if (dropdownRef.value) {
         dropdownRef.value.handleClose();
       }
-      e.stopPropagation();
-      popoverVisible.value = false;
-      if (detail.uiactionId) {
+      if (!props.actionCallBack) {
         emit("action-click", detail, e);
       }
     };

package/lib/control/dashboard/custom-dashboard-container/custom-dashboard-container.cjs

@@ -153,7 +153,7 @@ const CustomDashboardContainer = /* @__PURE__ */ vue.defineComponent({
   },
   render() {
     var _a, _b;
-    return vue.createVNode("div", {
+    return vue.withDirectives(vue.createVNode("div", {
       "class": [this.ns.b()]
     }, [this.customC.showDesignBtn ? vue.createVNode("div", {
       "class": this.ns.b("build-btn")
@@ -213,7 +213,7 @@ const CustomDashboardContainer = /* @__PURE__ */ vue.defineComponent({
       return vue.createVNode("div", {
         "style": itemStyle
       }, [(_b2 = (_a2 = this.$slots)[item.portletCodeName]) == null ? void 0 : _b2.call(_a2)]);
-    }))]);
+    }))]), [[vue.resolveDirective("loading"), !this.isInited]]);
   }
 });
 

package/lib/control/dashboard/dashboard-design/dashboard-design.cjs

@@ -561,12 +561,12 @@ const DashboardDesign = /* @__PURE__ */ vue.defineComponent({
         default: () => [vue.createVNode(vue.resolveComponent("el-card"), {
           "class": this.ns.b("grid-layout-item")
         }, {
-          default: () => [vue.createVNode("div", {
-            "class": this.ns.b("grid-layout-item-header")
-          }, [vue.createVNode("span", null, [item.portletName]), vue.createVNode("ion-icon", {
+          default: () => [vue.createVNode("ion-icon", {
             "name": "close-outline",
-            "onClick": () => this.removeItem(item)
-          }, null)]), vue.createVNode("div", {
+            "title": ibiz.i18n.t("app.delete"),
+            "onClick": () => this.removeItem(item),
+            "class": this.ns.b("grid-layout-item-icon")
+          }, null), vue.createVNode("div", {
             "class": this.ns.b("grid-layout-item-content")
           }, [renderPortlet(item)])]
         })]

package/lib/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/lib/control/dashboard/dashboard-design/dashboard-design.util.cjs

@@ -13,8 +13,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/lib/control/data-view/data-view.cjs

@@ -309,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")
@@ -358,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,
         "hideNoDataImage": c.state.hideNoDataImage
-      }, null);
+      }, _isSlot(noDataSlots) ? noDataSlots : {
+        default: () => [noDataSlots]
+      });
     };
     const renderCollapseExpandIcon = () => {
       let icon = null;
@@ -394,7 +401,6 @@ const DataViewControl = /* @__PURE__ */ vue.defineComponent({
       classNames,
       infiniteScroll,
       renderHasData,
-      onShowNavView,
       renderNoData,
       onPageChange,
       onPageRefresh,
@@ -435,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/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.43_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/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}