@ibiz-template/vue3-components 0.7.41-alpha.24 → 0.7.41-alpha.26

package/es/common/action-toolbar/action-toolbar.css

@@ -1 +1 @@
-@charset "UTF-8";.ibiz-action-toolbar{--ibiz-action-toolbar-item-margin:var(--ibiz-spacing-none) var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none) var(--ibiz-spacing-none);--ibiz-action-toolbar-item-padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-separator-height:var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-separator-width:var(--ibiz-spacing-super-tight);--ibiz-action-toolbar-separator-color:var(--ibiz-color-border);--ibiz-action-toolbar-popover-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-popover-button-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-popover-button-color:var(--ibiz-color-text-2);--ibiz-action-toolbar-popover-button-hover-bg:var(--ibiz-color-bg-0);display:flex;flex-wrap:wrap}.ibiz-action-toolbar__item{padding:var(--ibiz-action-toolbar-item-padding);margin:var(--ibiz-action-toolbar-item-margin)}.ibiz-action-toolbar__item--icon.is-has-icon{display:flex;align-items:baseline;justify-content:center;width:var(--ibiz-width-icon-medium);height:var(--ibiz-width-icon-medium);margin-right:var(--ibiz-spacing-extra-tight);margin-left:var(--ibiz-spacing-extra-tight);font-size:var(--ibiz-width-icon-medium)}.ibiz-action-toolbar__item--label.is-has-caption{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-action-toolbar__item+.ibiz-action-toolbar__item{margin:var(--ibiz-action-toolbar-item-margin)}.ibiz-action-toolbar__group-item>span{width:100%}.ibiz-action-toolbar__group-item--caption{display:flex;align-items:center;justify-content:space-between;width:100%}.ibiz-action-toolbar__separator{height:auto}.ibiz-action-toolbar__popover{--ibiz-action-toolbar-item-margin:var(--ibiz-spacing-none) var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none) var(--ibiz-spacing-none);--ibiz-action-toolbar-item-padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-separator-height:var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-separator-width:var(--ibiz-spacing-super-tight);--ibiz-action-toolbar-separator-color:var(--ibiz-color-border);--ibiz-action-toolbar-popover-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-popover-button-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-popover-button-color:var(--ibiz-color-text-2);--ibiz-action-toolbar-popover-button-hover-bg:var(--ibiz-color-bg-0);width:auto!important;min-width:150px;--el-popover-padding:var(--ibiz-action-toolbar-popover-padding)}.ibiz-action-toolbar__popover .el-button{--el-button-size:getCssVar("height-control", "large");display:block;width:100%;padding:var(--ibiz-action-toolbar-popover-button-padding);margin:var(--ibiz-spacing-none);font-size:var(--ibiz-font-size-regular);color:var(--ibiz-action-toolbar-popover-button-color);text-align:left;border-radius:0}.ibiz-action-toolbar__popover .el-button:hover{background-color:var(--ibiz-action-toolbar-popover-button-hover-bg)}.ibiz-action-toolbar__popover .el-button .ibiz-icon{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-action-toolbar__popover .ibiz-action-toolbar__separator{margin:var(--ibiz-spacing-none)}.ibiz-action-toolbar--dropdown .ibiz-action-toolbar__caption{cursor:pointer}.ibiz-action-toolbar--dropdown .ibiz-action-toolbar__caption-icon{vertical-align:bottom}
+@charset "UTF-8";.ibiz-action-toolbar{--ibiz-action-toolbar-item-margin:var(--ibiz-spacing-none) var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none) var(--ibiz-spacing-none);--ibiz-action-toolbar-item-padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-separator-height:var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-separator-width:var(--ibiz-spacing-super-tight);--ibiz-action-toolbar-separator-color:var(--ibiz-color-border);--ibiz-action-toolbar-popover-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-popover-button-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-popover-button-color:var(--ibiz-color-text-2);--ibiz-action-toolbar-popover-button-hover-bg:var(--ibiz-color-bg-0);display:flex;flex-wrap:wrap}.ibiz-action-toolbar__item{padding:var(--ibiz-action-toolbar-item-padding);margin:var(--ibiz-action-toolbar-item-margin)}.ibiz-action-toolbar__item--icon.is-has-icon{display:flex;align-items:baseline;justify-content:center;width:var(--ibiz-width-icon-medium);height:var(--ibiz-width-icon-medium);margin-right:var(--ibiz-spacing-extra-tight);margin-left:var(--ibiz-spacing-extra-tight);font-size:var(--ibiz-width-icon-medium)}.ibiz-action-toolbar__item--label.is-has-caption{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-action-toolbar__item+.ibiz-action-toolbar__item{margin:var(--ibiz-action-toolbar-item-margin)}.ibiz-action-toolbar__group-item>span{width:100%}.ibiz-action-toolbar__group-item--caption{display:flex;gap:var(--ibiz-spacing-extra-tight);align-items:center;justify-content:space-between;width:100%}.ibiz-action-toolbar__separator{height:auto}.ibiz-action-toolbar__popover{--ibiz-action-toolbar-item-margin:var(--ibiz-spacing-none) var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none) var(--ibiz-spacing-none);--ibiz-action-toolbar-item-padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-separator-height:var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-separator-width:var(--ibiz-spacing-super-tight);--ibiz-action-toolbar-separator-color:var(--ibiz-color-border);--ibiz-action-toolbar-popover-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-action-toolbar-popover-button-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);--ibiz-action-toolbar-popover-button-color:var(--ibiz-color-text-2);--ibiz-action-toolbar-popover-button-hover-bg:var(--ibiz-color-bg-0);width:auto!important;min-width:150px;--el-popover-padding:var(--ibiz-action-toolbar-popover-padding)}.ibiz-action-toolbar__popover .el-button{--el-button-size:getCssVar("height-control", "large");display:block;width:100%;padding:var(--ibiz-action-toolbar-popover-button-padding);margin:var(--ibiz-spacing-none);font-size:var(--ibiz-font-size-regular);color:var(--ibiz-action-toolbar-popover-button-color);text-align:left;border-radius:0}.ibiz-action-toolbar__popover .el-button:hover{background-color:var(--ibiz-action-toolbar-popover-button-hover-bg)}.ibiz-action-toolbar__popover .el-button .ibiz-icon{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-action-toolbar__popover .ibiz-action-toolbar__separator{margin:var(--ibiz-spacing-none)}.ibiz-action-toolbar--dropdown .ibiz-action-toolbar__caption{cursor:pointer}.ibiz-action-toolbar--dropdown .ibiz-action-toolbar__caption-icon{vertical-align:bottom}

package/es/common/action-toolbar/action-toolbar.d.ts

@@ -41,6 +41,10 @@ export declare const IBizActionToolbar: import("vue").DefineComponent<{
     actionCallBack: {
         type: FunctionConstructor;
     };
+    direction: {
+        type: PropType<"horizontal" | "vertical">;
+        default: string;
+    };
 }, {
     ns: import("@ibiz-template/core").Namespace;
     dropdownRef: Ref<any>;
@@ -50,7 +54,7 @@ export declare const IBizActionToolbar: import("vue").DefineComponent<{
     groupButtonRef: Ref<HTMLElement | null | undefined>;
     popoverVisible: Ref<boolean>;
     handleClick: (detail: IAppDEUIActionGroupDetail, e: MouseEvent) => Promise<void>;
-    calcActionItemClass: (item: IAppDEUIActionGroupDetail) => string[];
+    calcActionItemClass: (item: IAppDEUIActionGroupDetail) => (string | undefined)[];
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     actionDetails: {
         type: {
@@ -90,7 +94,12 @@ export declare const IBizActionToolbar: import("vue").DefineComponent<{
     actionCallBack: {
         type: FunctionConstructor;
     };
+    direction: {
+        type: PropType<"horizontal" | "vertical">;
+        default: string;
+    };
 }>>, {
     mode: "dropdown" | "buttons";
     groupLevelKeys: number[];
+    direction: "horizontal" | "vertical";
 }, {}>;

package/es/common/action-toolbar/action-toolbar.mjs

@@ -38,6 +38,10 @@ const IBizActionToolbar = /* @__PURE__ */ defineComponent({
     // 二者区别在于：行为回调为同步执行（主要解决pop打开视图位置异常），action-click为异步执行（不关心执行是否完成）
     actionCallBack: {
       type: Function
+    },
+    direction: {
+      type: String,
+      default: "horizontal"
     }
   },
   setup(props, {
@@ -87,10 +91,11 @@ const IBizActionToolbar = /* @__PURE__ */ defineComponent({
       });
     }
     const calcActionItemClass = (item) => {
+      var _a2;
       const {
         actionLevel
       } = item;
-      return [ns.e("item"), ns.is("disabled", false), ns.em("item", "level-".concat(actionLevel))];
+      return [ns.e("item"), (_a2 = item.sysCss) == null ? void 0 : _a2.codeName, ns.em("item", "level-".concat(actionLevel))];
     };
     const popoverIndex = props.zIndex;
     return {
@@ -109,10 +114,11 @@ const IBizActionToolbar = /* @__PURE__ */ defineComponent({
     var _a;
     const details = this.actionDetails || [];
     const renderDivider = (isExpand) => {
+      const ishorizontal = isExpand && this.direction === "horizontal";
       return createVNode(resolveComponent("el-divider"), {
         "class": this.ns.e("separator"),
         "border-style": "double",
-        "direction": isExpand ? "vertical" : "horizontal"
+        "direction": ishorizontal ? "vertical" : "horizontal"
       }, null);
     };
     const renderActionGroup = (detail, isExpand = true) => {
@@ -120,15 +126,17 @@ const IBizActionToolbar = /* @__PURE__ */ defineComponent({
       const actionGroup = detail.refUIActionGroup;
       if (!((_a2 = actionGroup == null ? void 0 : actionGroup.uiactionGroupDetails) == null ? void 0 : _a2.length))
         return null;
-      const pvisible = actionGroup.uiactionGroupDetails.findIndex((item) => {
-        return this.actionsState[item.id].visible === true;
-      }) !== -1;
+      const pvisible = actionGroup.uiactionGroupDetails.some((item) => {
+        return this.actionsState[item.id].visible;
+      });
       if (!pvisible)
         return null;
+      const ishorizontal = isExpand && this.direction === "horizontal";
       return [detail.addSeparator && renderDivider(isExpand), createVNode(resolveComponent("el-popover"), {
+        "trigger": "click",
         "teleported": false,
-        "placement": "right-start",
         "popper-class": this.ns.e("popover"),
+        "placement": ishorizontal ? "bottom" : "right-start",
         "popper-options": {
           modifiers: [{
             name: "offset",
@@ -147,14 +155,14 @@ const IBizActionToolbar = /* @__PURE__ */ defineComponent({
           }, {
             default: () => [createVNode("div", {
               "class": this.ns.em("group-item", "caption")
-            }, [createVNode("span", null, [actionGroup.id]), createVNode("ion-icon", {
+            }, [createVNode("span", null, [actionGroup.name || actionGroup.id]), createVNode("ion-icon", {
               "class": this.ns.em("group-item", "caption-icon"),
-              "name": "chevron-forward-outline"
+              "name": ishorizontal ? "chevron-down-outline" : "chevron-forward-outline"
             }, null)])]
           });
         },
         default: () => {
-          return renderActions(actionGroup.uiactionGroupDetails || [], isExpand);
+          return renderActions(actionGroup.uiactionGroupDetails || [], false);
         }
       })];
     };
@@ -162,7 +170,7 @@ const IBizActionToolbar = /* @__PURE__ */ defineComponent({
       return items.map((detail) => {
         var _a2;
         if (detail.detailType === "DEUIACTIONGROUP" && detail.refUIActionGroup)
-          return renderActionGroup(detail);
+          return renderActionGroup(detail, isExpand);
         if ((_a2 = this.actionsState[detail.id]) == null ? void 0 : _a2.visible) {
           return [detail.addSeparator && renderDivider(isExpand), createVNode(resolveComponent("el-button"), {
             "text": true,
@@ -246,10 +254,10 @@ const IBizActionToolbar = /* @__PURE__ */ defineComponent({
         default: () => [details.length > 0 && details.map((detail) => {
           if (this.actionsState[detail.id].visible) {
             return createVNode(resolveComponent("el-dropdown-item"), {
-              "class": [this.ns.e("item"), this.ns.is("disabled", false)],
+              "command": detail,
               "title": showTitle(detail.tooltip),
-              "disabled": this.actionsState[detail.id].disabled,
-              "command": detail
+              "class": this.calcActionItemClass(detail),
+              "disabled": this.actionsState[detail.id].disabled
             }, {
               default: () => [detail.showIcon && detail.sysImage && createVNode(resolveComponent("iBizIcon"), {
                 "icon": detail.sysImage

package/es/common/button-list/button-list.css

@@ -1 +1 @@
-.ibiz-button-list{--ibiz-button-list-icon-margin:var(--ibiz-spacing-extra-tight);--ibiz-button-list-icon-size:var(--ibiz-width-icon-medium);--ibiz-button-list-popover-bg:var(--ibiz-color-bg-3);--ibiz-button-list-popover-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-button-list-popover-button-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);--ibiz-button-list-popover-button-margin:var(--ibiz-spacing-none);--ibiz-button-list-popover-button-size:var(--ibiz-height-control-large);--ibiz-button-list-popover-button-font-size:var(--ibiz-font-size-regular);--ibiz-button-list-gap:var(--ibiz-spacing-base-tight)}.ibiz-button-list__content{display:flex}.ibiz-button-list__content .ibiz-button-list__dropdown{width:auto}.ibiz-button-list__content .el-button+.el-dropdown{margin-left:var(--ibiz-button-list-gap)}.ibiz-button-list__button-content{display:flex;align-items:center}.ibiz-button-list__button-content--icon{display:flex;align-items:center;justify-content:center;width:var(--ibiz-button-list-icon-size);height:var(--ibiz-button-list-icon-size);margin-right:var(--ibiz-button-list-icon-margin);font-size:var(--ibiz-button-list-icon-size)}.ibiz-button-list__item>span{pointer-events:none}.ibiz-button-list__dropdown{width:100%;height:100%}.ibiz-button-list__dropdown .ibiz-icon{margin-right:0}.ibiz-button-list__dropdown .ibiz-icon+.ibiz-button-list__button-content--caption{margin-left:var(--ibiz-button-list-icon-margin)}.ibiz-button-list__dropdown .el-button-group{display:flex;width:100%;height:100%;border-radius:var(--ibiz-border-radius-small)}.ibiz-button-list__dropdown .el-button-group .el-button:first-child{flex-grow:1}.ibiz-button-list__dropdown .el-button-group .el-button:last-child{flex-shrink:0}.ibiz-button-list__dropdown--style2 .el-button{--el-button-active-bg-color:transparent;--el-button-bg-color:transparent;--el-mask-color-extra-light:transparent;--el-button-hover-bg-color:transparent}.ibiz-button-list__dropdown--style2 .el-button-group .ibiz-button-list__item{padding-right:0}.ibiz-button-list__dropdown--style2 .el-button-group .el-button{color:var(--ibiz-color-text-2)}.ibiz-button-list__dropdown--style2 .el-button-group:hover .el-button{color:var(--ibiz-color-primary)}.ibiz-button-list--itemx .ibiz-button-list__more-button{width:32px;padding-right:0;padding-left:0}.ibiz-button-list__dropdown-popper{--ibiz-button-list-icon-margin:var(--ibiz-spacing-extra-tight);--ibiz-button-list-icon-size:var(--ibiz-width-icon-medium);--ibiz-button-list-popover-bg:var(--ibiz-color-bg-3);--ibiz-button-list-popover-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-button-list-popover-button-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);--ibiz-button-list-popover-button-margin:var(--ibiz-spacing-none);--ibiz-button-list-popover-button-size:var(--ibiz-height-control-large);--ibiz-button-list-popover-button-font-size:var(--ibiz-font-size-regular);--ibiz-button-list-gap:var(--ibiz-spacing-base-tight)}.ibiz-button-list__dropdown-popper.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list .el-dropdown-menu .el-dropdown-menu__item{padding:var(--ibiz-spacing-none)}.ibiz-button-list__dropdown-popper .el-button{--el-button-active-bg-color:transparent;--el-button-hover-bg-color:transparent;--el-button-bg-color:transparent;--el-mask-color-extra-light:transparent;display:block;width:100%;padding:var(--ibiz-button-list-popover-button-padding);margin:var(--ibiz-button-list-popover-button-margin);font-size:var(--ibiz-button-list-popover-button-font-size);text-align:left;border-radius:0}.ibiz-button-list__dropdown-popper--style2.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list{background-color:transparent}.ibiz-button-list__dropdown-popper--style2.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list .el-dropdown-menu{background-color:transparent}.ibiz-button-list__dropdown-popper--style2.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list .el-dropdown-menu__item{background-color:transparent}.ibiz-button-list__dropdown-popper--style2.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list .el-dropdown-menu__item:hover{background-color:var(--ibiz-color-bg-0)}.ibiz-button-list__dropdown-popper--style2 .el-button{color:var(--ibiz-color-text-2)}
+.ibiz-button-list{--ibiz-button-list-icon-margin:var(--ibiz-spacing-extra-tight);--ibiz-button-list-icon-size:var(--ibiz-width-icon-medium);--ibiz-button-list-popover-bg:var(--ibiz-color-bg-3);--ibiz-button-list-popover-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-button-list-popover-button-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);--ibiz-button-list-popover-button-margin:var(--ibiz-spacing-none);--ibiz-button-list-popover-button-size:var(--ibiz-height-control-large);--ibiz-button-list-popover-button-font-size:var(--ibiz-font-size-regular);--ibiz-button-list-gap:var(--ibiz-spacing-base-tight)}.ibiz-button-list__content{display:flex}.ibiz-button-list__content .ibiz-button-list__dropdown{width:auto}.ibiz-button-list__content .el-button+.el-dropdown{margin-left:var(--ibiz-button-list-gap)}.ibiz-button-list__button-content{display:flex;gap:var(--ibiz-spacing-extra-tight);align-items:center;width:100%}.ibiz-button-list__button-content--icon{display:flex;align-items:center;justify-content:center;width:var(--ibiz-button-list-icon-size);height:var(--ibiz-button-list-icon-size);margin-right:var(--ibiz-button-list-icon-margin);font-size:var(--ibiz-button-list-icon-size)}.ibiz-button-list__item>span{width:100%;pointer-events:none}.ibiz-button-list__item--group .ibiz-button-list__button-content{justify-content:space-between}.ibiz-button-list__dropdown{width:100%;height:100%}.ibiz-button-list__dropdown .ibiz-icon{margin-right:0}.ibiz-button-list__dropdown .ibiz-icon+.ibiz-button-list__button-content--caption{margin-left:var(--ibiz-button-list-icon-margin)}.ibiz-button-list__dropdown .el-button-group{display:flex;width:100%;height:100%;border-radius:var(--ibiz-border-radius-small)}.ibiz-button-list__dropdown .el-button-group .el-button:first-child{flex-grow:1}.ibiz-button-list__dropdown .el-button-group .el-button:last-child{flex-shrink:0}.ibiz-button-list__dropdown--style2 .el-button{--el-button-active-bg-color:transparent;--el-button-bg-color:transparent;--el-mask-color-extra-light:transparent;--el-button-hover-bg-color:transparent}.ibiz-button-list__dropdown--style2 .el-button-group .ibiz-button-list__item{padding-right:0}.ibiz-button-list__dropdown--style2 .el-button-group .el-button{color:var(--ibiz-color-text-2)}.ibiz-button-list__dropdown--style2 .el-button-group:hover .el-button{color:var(--ibiz-color-primary)}.ibiz-button-list--itemx .ibiz-button-list__more-button{width:32px;padding-right:0;padding-left:0}.ibiz-button-list__dropdown-popper{--ibiz-button-list-icon-margin:var(--ibiz-spacing-extra-tight);--ibiz-button-list-icon-size:var(--ibiz-width-icon-medium);--ibiz-button-list-popover-bg:var(--ibiz-color-bg-3);--ibiz-button-list-popover-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-button-list-popover-button-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base-loose);--ibiz-button-list-popover-button-margin:var(--ibiz-spacing-none);--ibiz-button-list-popover-button-size:var(--ibiz-height-control-large);--ibiz-button-list-popover-button-font-size:var(--ibiz-font-size-regular);--ibiz-button-list-gap:var(--ibiz-spacing-base-tight)}.ibiz-button-list__dropdown-popper>.el-scrollbar{min-width:150px;overflow:visible}.ibiz-button-list__dropdown-popper--style2.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list{background-color:transparent}.ibiz-button-list__dropdown-popper--style2.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list .el-dropdown-menu{background-color:transparent}.ibiz-button-list__dropdown-popper--style2.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list .el-dropdown-menu__item{background-color:transparent}.ibiz-button-list__dropdown-popper--style2.el-popper.el-dropdown__popper .el-scrollbar .el-dropdown__list .el-dropdown-menu__item:hover{background-color:var(--ibiz-color-bg-0)}.ibiz-button-list__dropdown-popper--style2 .el-button{color:var(--ibiz-color-text-2)}.ibiz-button-list__dropdown-popper-content{padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none)}.ibiz-button-list__popover{padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-none)!important;border-radius:0!important}.ibiz-button-list__dropdown-popper-content,.ibiz-button-list__popover{display:flex;flex-direction:column;background-color:var(--ibiz-color-primary)!important}.ibiz-button-list__dropdown-popper-content .el-button,.ibiz-button-list__popover .el-button{justify-content:flex-start;width:100%;height:var(--ibiz-height-control-large);padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-base);margin:var(--ibiz-spacing-none);font-size:var(--ibiz-font-size-regular);color:var(--ibiz-color-primary-text)}.ibiz-button-list__dropdown-popper-content .el-button ion-icon,.ibiz-button-list__popover .el-button ion-icon{margin-right:var(--ibiz-spacing-extra-tight)}.ibiz-button-list__dropdown-popper-content .el-button.is-text:not(.is-disabled):hover,.ibiz-button-list__popover .el-button.is-text:not(.is-disabled):hover{background-color:var(--el-button-hover-bg-color);border-color:var(--el-button-hover-border-color)}

package/es/common/button-list/button-list.mjs

@@ -1,14 +1,11 @@
-import { isVNode, ref, computed, nextTick, onActivated, onDeactivated, onMounted, resolveComponent, createVNode, defineComponent } from 'vue';
-import { useNamespace } from '@ibiz-template/vue3-util';
+import { ref, computed, nextTick, onActivated, onDeactivated, onMounted, resolveComponent, createVNode, defineComponent } from 'vue';
+import { useNamespace, useUIStore } from '@ibiz-template/vue3-util';
 import { debounce } from 'lodash-es';
 import '../../util/index.mjs';
 import './button-list.css';
 import { convertBtnType } from '../../util/button-util/button-util.mjs';
 
 "use strict";
-function _isSlot(s) {
-  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
-}
 const IBizButtonList = /* @__PURE__ */ defineComponent({
   name: "IBizButtonList",
   props: {
@@ -32,6 +29,9 @@ const IBizButtonList = /* @__PURE__ */ defineComponent({
     emit
   }) {
     const ns = useNamespace("button-list");
+    const {
+      zIndex
+    } = useUIStore();
     const dropdown = ref();
     const componentRef = ref();
     const {
@@ -137,27 +137,76 @@ const IBizButtonList = /* @__PURE__ */ defineComponent({
         (_d = (_c = dropdown.value) == null ? void 0 : _c.handleOpen) == null ? void 0 : _d.call(_c);
       }
     };
-    const renderButton = (item, type) => {
-      var _a, _b, _c, _d;
-      if (((_a = props.buttonsState[item.id]) == null ? void 0 : _a.visible) === false)
+    const renderActionGroup = (detail, isFlatten) => {
+      var _a;
+      const actionGroup = detail.refUIActionGroup;
+      if (!((_a = actionGroup == null ? void 0 : actionGroup.uiactionGroupDetails) == null ? void 0 : _a.length))
         return null;
-      return createVNode(resolveComponent("el-button"), {
-        "class": [ns.e("item"), ns.em("item", "".concat((_b = item.id) == null ? void 0 : _b.toLowerCase())), "".concat(((_c = item.sysCss) == null ? void 0 : _c.cssName) || "")],
-        "type": type || convertBtnType(item.buttonStyle),
-        "title": item.tooltip || item.caption,
-        "disabled": ((_d = props.buttonsState[item.id]) == null ? void 0 : _d.disabled) || props.disabled,
-        "onClick": (event) => handleClick(event, item)
+      const pvisible = actionGroup.uiactionGroupDetails.findIndex((item) => {
+        return props.buttonsState[item.id].visible === true;
+      }) !== -1;
+      if (!pvisible)
+        return null;
+      return createVNode(resolveComponent("el-popover"), {
+        "trigger": "click",
+        "teleported": isFlatten,
+        "popper-class": ns.e("popover"),
+        "placement": isFlatten ? "bottom" : "right-start",
+        "popper-options": {
+          modifiers: [{
+            name: "offset",
+            options: {
+              offset: [0, 4]
+            }
+          }]
+        },
+        "popper-style": "z-index: ".concat(zIndex.zIndex)
       }, {
-        default: () => [createVNode("div", {
-          "class": ns.e("button-content")
-        }, [item.showIcon && createVNode(resolveComponent("iBizIcon"), {
-          "icon": item.sysImage,
-          "class": ns.em("button-content", "icon")
-        }, null), item.showCaption && createVNode("span", {
-          "class": ns.em("button-content", "caption")
-        }, [item.caption])])]
+        reference: () => {
+          var _a2, _b;
+          return createVNode(resolveComponent("el-button"), {
+            "class": [ns.e("item"), ns.em("item", "group"), ns.em("item", "".concat((_a2 = detail.id) == null ? void 0 : _a2.toLowerCase())), "".concat(((_b = detail.sysCss) == null ? void 0 : _b.cssName) || "")],
+            "type": convertBtnType(detail.buttonStyle)
+          }, {
+            default: () => [createVNode("div", {
+              "class": ns.e("button-content")
+            }, [createVNode("span", {
+              "class": ns.em("button-content", "caption")
+            }, [actionGroup.name || actionGroup.id]), createVNode("ion-icon", {
+              "class": ns.em("button-content", "icon"),
+              "name": isFlatten ? "chevron-down-outline" : "chevron-forward-outline"
+            }, null)])]
+          });
+        },
+        default: () => {
+          var _a2;
+          return (_a2 = actionGroup.uiactionGroupDetails) == null ? void 0 : _a2.map((item) => renderButton(item, false));
+        }
       });
     };
+    const renderButton = (item, isFlatten, type) => {
+      var _a, _b, _c, _d;
+      if (item.detailType === "DEUIACTIONGROUP" && item.refUIActionGroup)
+        return renderActionGroup(item, isFlatten);
+      if ((_a = props.buttonsState[item.id]) == null ? void 0 : _a.visible)
+        return createVNode(resolveComponent("el-button"), {
+          "class": [ns.e("item"), ns.em("item", "".concat((_b = item.id) == null ? void 0 : _b.toLowerCase())), "".concat(((_c = item.sysCss) == null ? void 0 : _c.cssName) || "")],
+          "text": !isFlatten,
+          "title": item.tooltip || item.caption,
+          "type": type || convertBtnType(item.buttonStyle),
+          "onClick": (event) => handleClick(event, item),
+          "disabled": ((_d = props.buttonsState[item.id]) == null ? void 0 : _d.disabled) || props.disabled
+        }, {
+          default: () => [createVNode("div", {
+            "class": ns.e("button-content")
+          }, [item.showIcon && createVNode(resolveComponent("iBizIcon"), {
+            "icon": item.sysImage,
+            "class": ns.em("button-content", "icon")
+          }, null), item.showCaption && createVNode("span", {
+            "class": ns.em("button-content", "caption")
+          }, [item.caption])])]
+        });
+    };
     const renderDropdown = (items, iconName = "chevron-down-outline") => {
       const {
         id,
@@ -185,7 +234,7 @@ const IBizButtonList = /* @__PURE__ */ defineComponent({
         default: () => {
           const item = items[firstIndex.value];
           return createVNode(resolveComponent("el-button-group"), null, {
-            default: () => [actionGroupExtractMode === "ITEMX" && item && renderButton(item, convertBtnType(buttonListStyle.value)), (actionGroupExtractMode !== "ITEMX" || item) && createVNode(resolveComponent("el-button"), {
+            default: () => [actionGroupExtractMode === "ITEMX" && item && renderButton(item, true, convertBtnType(buttonListStyle.value)), (actionGroupExtractMode !== "ITEMX" || item) && createVNode(resolveComponent("el-button"), {
               "disabled": props.disabled,
               "class": ns.e("more-button"),
               "title": actionGroupExtractMode !== "ITEMX" ? caption || ibiz.i18n.t("app.more") : ibiz.i18n.t("app.more"),
@@ -206,21 +255,15 @@ const IBizButtonList = /* @__PURE__ */ defineComponent({
             })]
           });
         },
-        dropdown: () => {
-          let _slot2;
-          return createVNode(resolveComponent("el-dropdown-menu"), null, _isSlot(_slot2 = items.map((item, index) => {
-            var _a;
-            if (!(((_a = props.buttonsState[item.id]) == null ? void 0 : _a.visible) === false) && (actionGroupExtractMode !== "ITEMX" || index !== firstIndex.value)) {
-              let _slot;
-              return createVNode(resolveComponent("el-dropdown-item"), null, _isSlot(_slot = renderButton(item)) ? _slot : {
-                default: () => [_slot]
-              });
-            }
-            return null;
-          })) ? _slot2 : {
-            default: () => [_slot2]
-          });
-        }
+        dropdown: () => createVNode("div", {
+          "class": ns.e("dropdown-popper-content")
+        }, [items.map((item, index) => {
+          var _a;
+          if (!(((_a = props.buttonsState[item.id]) == null ? void 0 : _a.visible) === false) && (actionGroupExtractMode !== "ITEMX" || index !== firstIndex.value)) {
+            return renderButton(item, false);
+          }
+          return null;
+        })])
       });
     };
     const renderActions = () => {
@@ -230,7 +273,7 @@ const IBizButtonList = /* @__PURE__ */ defineComponent({
       return createVNode("div", {
         "class": ns.e("content"),
         "ref": componentRef
-      }, [items.map((item) => renderButton(item)), moreItems.length ? renderDropdown(moreItems, "ellipsis-horizontal") : null]);
+      }, [items.map((item) => renderButton(item, true)), moreItems.length ? renderDropdown(moreItems, "ellipsis-horizontal") : null]);
     };
     return {
       ns,

package/es/common/control-navigation/control-navigation.d.ts

@@ -21,7 +21,7 @@ export declare const IBizControlNavigation: import("vue").DefineComponent<{
         maxHeight: string | number | undefined;
     };
     provider: import("./provider/navigation-base.provider").NavgationBaseProvider;
-    splitMode: Ref<"vertical" | "horizontal">;
+    splitMode: Ref<"horizontal" | "vertical">;
     splitValue: Ref<string | number>;
     outerWrapper: Ref<HTMLDivElement | null>;
     renderNavView: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {

package/es/common/control-navigation/provider/chart-navigation.provider.d.ts

@@ -0,0 +1,59 @@
+import { ChartController, EventBase, INavViewMsg, MDControlController } from '@ibiz-template/runtime';
+import { INavigatable } from '@ibiz/model-core';
+import { NavgationBaseProvider } from './navigation-base.provider';
+export declare class ChartNavigationProvider extends NavgationBaseProvider {
+    /**
+     * 图表导航栈数据
+     *
+     * @type {IData[]}
+     * @memberof ChartNavigationProvider
+     */
+    chartNavStack: IData[];
+    controller: ChartController;
+    constructor(controller: MDControlController);
+    /**
+     * 获取默认激活数据
+     *
+     * @return {*}  {(IData | undefined)}
+     * @memberof ChartNavigationProvider
+     */
+    getDefaultActiveData(): IData | undefined;
+    /**
+     * 图表数据激活
+     *
+     * @param {EventBase} event
+     * @memberof ChartNavigationProvider
+     */
+    xDataActive(event: EventBase): void;
+    /**
+     * 通过栈数据导航
+     *
+     * @return {*}  {void}
+     * @memberof ChartNavigationProvider
+     */
+    onNavDataByStack(): void;
+    /**
+     * 解析参数
+     *
+     * @param {(INavigatable & { appDataEntityId?: string })} XDataModel
+     * @param {IData} data
+     * @param {IContext} context
+     * @param {IParams} params
+     * @return {*}  {{ context: IContext; params: IParams }}
+     * @memberof ChartNavigationProvider
+     */
+    prepareParams(XDataModel: INavigatable & {
+        appDataEntityId?: string;
+    }, data: IData, context: IContext, params: IParams): {
+        context: IContext;
+        params: IParams;
+    };
+    /**
+     * 获取导航视图信息
+     *
+     * @param {IData} data
+     * @return {*}  {INavViewMsg}
+     * @memberof ChartNavigationProvider
+     */
+    getNavViewMsg(data: IData): INavViewMsg;
+}

package/es/common/control-navigation/provider/chart-navigation.provider.mjs

@@ -0,0 +1,148 @@
+import { convertNavData } from '@ibiz-template/runtime';
+import { NavgationBaseProvider } from './navigation-base.provider.mjs';
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class ChartNavigationProvider extends NavgationBaseProvider {
+  constructor(controller) {
+    super(controller);
+    /**
+     * 图表导航栈数据
+     *
+     * @type {IData[]}
+     * @memberof ChartNavigationProvider
+     */
+    __publicField(this, "chartNavStack", []);
+    if (controller.state.enableNavView) {
+      controller.evt.on("onActive", (event) => {
+        this.xDataActive(event);
+      });
+    }
+  }
+  /**
+   * 获取默认激活数据
+   *
+   * @return {*}  {(IData | undefined)}
+   * @memberof ChartNavigationProvider
+   */
+  getDefaultActiveData() {
+    const activeSeriesGenerator = this.controller.generator.seriesGenerators.find((generator) => {
+      return generator.chartDataArr.length > 0 && generator.model.navAppViewId;
+    });
+    if (activeSeriesGenerator && activeSeriesGenerator.groupData) {
+      const firstGroupName = Object.keys(activeSeriesGenerator.groupData)[0];
+      const { chartData } = activeSeriesGenerator.groupData[firstGroupName].values().next().value;
+      return chartData;
+    }
+  }
+  /**
+   * 图表数据激活
+   *
+   * @param {EventBase} event
+   * @memberof ChartNavigationProvider
+   */
+  xDataActive(event) {
+    const { data } = event;
+    this.navViewMsg.value = this.getNavViewMsg(data[0]);
+    this.chartNavStack.unshift(data[0]);
+  }
+  /**
+   * 通过栈数据导航
+   *
+   * @return {*}  {void}
+   * @memberof ChartNavigationProvider
+   */
+  onNavDataByStack() {
+    const data = this.getDefaultActiveData();
+    if (!data)
+      return this.clearNavigation();
+    this.controller.setActive(data);
+    this.controller.setSelection([data]);
+  }
+  /**
+   * 解析参数
+   *
+   * @param {(INavigatable & { appDataEntityId?: string })} XDataModel
+   * @param {IData} data
+   * @param {IContext} context
+   * @param {IParams} params
+   * @return {*}  {{ context: IContext; params: IParams }}
+   * @memberof ChartNavigationProvider
+   */
+  prepareParams(XDataModel, data, context, params) {
+    var _a;
+    const { context: tempContext, params: tempParams } = super.prepareParams(
+      XDataModel,
+      data,
+      context,
+      params
+    );
+    if (data._seriesModelId) {
+      const seriesModel = (_a = this.controller.model.dechartSerieses) == null ? void 0 : _a.find(
+        (series) => {
+          return series.id === data._seriesModelId;
+        }
+      );
+      if (seriesModel) {
+        const { navigateContexts, navigateParams } = seriesModel;
+        const tempContext2 = convertNavData(
+          navigateContexts,
+          data,
+          params,
+          tempContext
+        );
+        const tempParams2 = convertNavData(
+          navigateParams,
+          data,
+          params,
+          tempParams
+        );
+        if (data.navParams)
+          Object.assign(tempParams2, data.navParams);
+        return {
+          context: Object.assign(tempContext.clone(), tempContext2),
+          params: tempParams2
+        };
+      }
+    }
+    return { context: tempContext, params: tempParams };
+  }
+  /**
+   * 获取导航视图信息
+   *
+   * @param {IData} data
+   * @return {*}  {INavViewMsg}
+   * @memberof ChartNavigationProvider
+   */
+  getNavViewMsg(data) {
+    var _a;
+    let viewModelId;
+    if (data._seriesModelId) {
+      const seriesModel = (_a = this.controller.model.dechartSerieses) == null ? void 0 : _a.find(
+        (series) => {
+          return series.id === data._seriesModelId;
+        }
+      );
+      viewModelId = seriesModel == null ? void 0 : seriesModel.navAppViewId;
+    }
+    const result = this.prepareParams(
+      this.controller.model,
+      data,
+      this.controller.context,
+      this.controller.params
+    );
+    return {
+      key: data._uuid,
+      context: result.context,
+      params: result.params,
+      viewId: viewModelId
+    };
+  }
+}
+
+export { ChartNavigationProvider };

package/es/common/control-navigation/provider/index.mjs

@@ -2,6 +2,7 @@ import { NavgationBaseProvider } from './navigation-base.provider.mjs';
 import { CalendarNavigationProvider } from './calendar-navigation.provider.mjs';
 import { TreeNavigationProvider } from './tree-navigation.provider.mjs';
 import { MapNavigationProvider } from './map-navigation.provider.mjs';
+import { ChartNavigationProvider } from './chart-navigation.provider.mjs';
 
 "use strict";
 function getNavigationProvider(controller) {
@@ -12,6 +13,8 @@ function getNavigationProvider(controller) {
     return new TreeNavigationProvider(controller);
   if (controlType === "MAP")
     return new MapNavigationProvider(controller);
+  if (controlType === "CHART")
+    return new ChartNavigationProvider(controller);
   return new NavgationBaseProvider(controller);
 }
 

package/es/common/custom-theme/custom-theme.mjs

@@ -1,10 +1,10 @@
 import { isVNode, getCurrentInstance, ref, watch, nextTick, onMounted, onUnmounted, computed, resolveComponent, createVNode, defineComponent } from 'vue';
 import { useNamespace, useUIStore } from '@ibiz-template/vue3-util';
 import { showTitle } from '@ibiz-template/core';
-import '../../node_modules/.pnpm/@monaco-editor_loader@1.4.0_monaco-editor@0.45.0/node_modules/@monaco-editor/loader/lib/es/index.mjs';
+import '../../node_modules/.pnpm/@monaco-editor_loader@1.4.0_monaco-editor@0.52.2/node_modules/@monaco-editor/loader/lib/es/index.mjs';
 import { CustomThemeController } from './custom-theme.controller.mjs';
 import './custom-theme.css';
-import loader from '../../node_modules/.pnpm/@monaco-editor_loader@1.4.0_monaco-editor@0.45.0/node_modules/@monaco-editor/loader/lib/es/loader/index.mjs';
+import loader from '../../node_modules/.pnpm/@monaco-editor_loader@1.4.0_monaco-editor@0.52.2/node_modules/@monaco-editor/loader/lib/es/loader/index.mjs';
 
 "use strict";
 function _isSlot(s) {
@@ -42,7 +42,7 @@ const CustomTheme = /* @__PURE__ */ defineComponent({
       nextTick(() => {
         loader.config({
           paths: {
-            vs: "".concat(ibiz.env.pluginBaseUrl, "/monaco-editor@0.45.0/min/vs")
+            vs: "".concat(ibiz.env.pluginBaseUrl, "/monaco-editor@0.52.2/min/vs")
           }
         });
         loader.init().then((loaderMonaco) => {