ele-admin-plus 1.0.0-beta.2 → 1.0.0-beta.4

package/es/ele-menus/index.d.ts

@@ -1,7 +1,6 @@
-/** 菜单 */
-import type { VNode, Slot } from 'vue';
 import type { NavigationFailure } from 'vue-router';
 import type { MenuItemClicked } from 'element-plus';
+import type { ElMenuInstance } from '../ele-app/types';
 import type { MenuItem, MenuTheme, PopupMenuTheme, PopupColorful } from './types';
 declare const _default: import("vue").DefineComponent<{
     items: {
@@ -34,160 +33,7 @@ declare const _default: import("vue").DefineComponent<{
     ellipsis: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
     popperEffect: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "light" | "dark", unknown, "dark", boolean>;
 }, {
-    menuRef: import("vue").Ref<({
-        $: import("vue").ComponentInternalInstance;
-        $data: {};
-        $props: {
-            readonly ellipsis?: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown> | undefined;
-            readonly collapse?: boolean | undefined;
-            readonly mode?: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "horizontal" | "vertical", unknown> | undefined;
-            readonly defaultActive?: string | undefined;
-            readonly defaultOpeneds?: string[] | undefined;
-            readonly menuTrigger?: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "hover" | "click", unknown> | undefined;
-            readonly collapseTransition?: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown> | undefined;
-            readonly popperEffect?: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "light" | "dark", unknown> | undefined;
-            readonly uniqueOpened?: boolean | undefined;
-            readonly router?: boolean | undefined;
-            key?: string | number | symbol | undefined;
-            onClose?: ((index: string, indexPath: string[]) => any) | undefined;
-            onOpen?: ((index: string, indexPath: string[]) => any) | undefined;
-            onSelect?: ((index: string, indexPath: string[], item: MenuItemClicked, routerResult?: Promise<void | NavigationFailure> | undefined) => any) | undefined;
-            readonly backgroundColor?: string | undefined;
-            readonly textColor?: string | undefined;
-            readonly activeTextColor?: string | undefined;
-            ref?: import("vue").VNodeRef | undefined;
-            class?: unknown;
-            ref_for?: boolean | undefined;
-            ref_key?: string | undefined;
-            onVnodeBeforeMount?: ((vnode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            onVnodeMounted?: ((vnode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            onVnodeBeforeUpdate?: ((vnode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>, oldVNode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>, oldVNode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            onVnodeUpdated?: ((vnode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>, oldVNode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>, oldVNode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            onVnodeBeforeUnmount?: ((vnode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            onVnodeUnmounted?: ((vnode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void) | ((vnode: VNode<import("vue").RendererNode, import("vue").RendererElement, {
-                [key: string]: any;
-            }>) => void)[] | undefined;
-            style?: unknown;
-        };
-        $attrs: {
-            [x: string]: unknown;
-        };
-        $refs: {
-            [x: string]: unknown;
-        };
-        $slots: Readonly<{
-            [name: string]: Slot<any> | undefined;
-        }>;
-        $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null;
-        $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null;
-        $emit: ((event: "close", index: string, indexPath: string[]) => void) & ((event: "open", index: string, indexPath: string[]) => void) & ((event: "select", index: string, indexPath: string[], item: MenuItemClicked, routerResult?: Promise<void | NavigationFailure> | undefined) => void);
-        $el: any;
-        $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
-            readonly mode: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "horizontal" | "vertical", unknown, "vertical", boolean>;
-            readonly defaultActive: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
-            readonly defaultOpeneds: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string[]) | (() => string[]) | ((new (...args: any[]) => string[]) | (() => string[]))[], unknown, unknown, () => [], boolean>;
-            readonly uniqueOpened: BooleanConstructor;
-            readonly router: BooleanConstructor;
-            readonly menuTrigger: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "hover" | "click", unknown, "hover", boolean>;
-            readonly collapse: BooleanConstructor;
-            readonly backgroundColor: StringConstructor;
-            readonly textColor: StringConstructor;
-            readonly activeTextColor: StringConstructor;
-            readonly collapseTransition: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-            readonly ellipsis: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-            readonly popperEffect: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "light" | "dark", unknown, "dark", boolean>;
-        }>> & {
-            onClose?: ((index: string, indexPath: string[]) => any) | undefined;
-            onSelect?: ((index: string, indexPath: string[], item: MenuItemClicked, routerResult?: Promise<void | NavigationFailure> | undefined) => any) | undefined;
-            onOpen?: ((index: string, indexPath: string[]) => any) | undefined;
-        }, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
-            [key: string]: any;
-        }>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-            close: (index: string, indexPath: string[]) => boolean;
-            open: (index: string, indexPath: string[]) => boolean;
-            select: (index: string, indexPath: string[], item: MenuItemClicked, routerResult?: Promise<void | NavigationFailure> | undefined) => boolean;
-        }, string, {
-            readonly ellipsis: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
-            readonly collapse: boolean;
-            readonly mode: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "horizontal" | "vertical", unknown>;
-            readonly defaultActive: string;
-            readonly defaultOpeneds: string[];
-            readonly menuTrigger: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "hover" | "click", unknown>;
-            readonly collapseTransition: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
-            readonly popperEffect: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "light" | "dark", unknown>;
-            readonly uniqueOpened: boolean;
-            readonly router: boolean;
-        }, {}, string, {}> & {
-            beforeCreate?: ((() => void) | (() => void)[]) | undefined;
-            created?: ((() => void) | (() => void)[]) | undefined;
-            beforeMount?: ((() => void) | (() => void)[]) | undefined;
-            mounted?: ((() => void) | (() => void)[]) | undefined;
-            beforeUpdate?: ((() => void) | (() => void)[]) | undefined;
-            updated?: ((() => void) | (() => void)[]) | undefined;
-            activated?: ((() => void) | (() => void)[]) | undefined;
-            deactivated?: ((() => void) | (() => void)[]) | undefined;
-            beforeDestroy?: ((() => void) | (() => void)[]) | undefined;
-            beforeUnmount?: ((() => void) | (() => void)[]) | undefined;
-            destroyed?: ((() => void) | (() => void)[]) | undefined;
-            unmounted?: ((() => void) | (() => void)[]) | undefined;
-            renderTracked?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
-            renderTriggered?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
-            errorCaptured?: (((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null, info: string) => boolean | void)[]) | undefined;
-        };
-        $forceUpdate: () => void;
-        $nextTick: typeof import("vue").nextTick;
-        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
-    } & Readonly<import("vue").ExtractPropTypes<{
-        readonly mode: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "horizontal" | "vertical", unknown, "vertical", boolean>;
-        readonly defaultActive: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
-        readonly defaultOpeneds: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string[]) | (() => string[]) | ((new (...args: any[]) => string[]) | (() => string[]))[], unknown, unknown, () => [], boolean>;
-        readonly uniqueOpened: BooleanConstructor;
-        readonly router: BooleanConstructor;
-        readonly menuTrigger: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "hover" | "click", unknown, "hover", boolean>;
-        readonly collapse: BooleanConstructor;
-        readonly backgroundColor: StringConstructor;
-        readonly textColor: StringConstructor;
-        readonly activeTextColor: StringConstructor;
-        readonly collapseTransition: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-        readonly ellipsis: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
-        readonly popperEffect: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "light" | "dark", unknown, "dark", boolean>;
-    }>> & {
-        onClose?: ((index: string, indexPath: string[]) => any) | undefined;
-        onSelect?: ((index: string, indexPath: string[], item: MenuItemClicked, routerResult?: Promise<void | NavigationFailure> | undefined) => any) | undefined;
-        onOpen?: ((index: string, indexPath: string[]) => any) | undefined;
-    } & import("vue").ShallowUnwrapRef<() => VNode<import("vue").RendererNode, import("vue").RendererElement, {
-        [key: string]: any;
-    }>> & {} & import("vue").ComponentCustomProperties & {}) | null>;
+    menuRef: import("vue").Ref<ElMenuInstance>;
     open: (index: string) => void;
     close: (index: string) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {

package/es/ele-menus/index.js

@@ -1,9 +1,9 @@
 import { defineComponent, ref, h } from "vue";
 import { RouterLink } from "vue-router";
 import { menuEmits, ElMenu, ElIcon, ElBadge, ElMenuItem, ElMenuItemGroup, ElSubMenu } from "element-plus";
-import { isExternalLink } from "../utils/core";
+import { pick, isExternalLink } from "../utils/core";
 import { ArrowDown, ArrowRight } from "../icons";
-import { menusProps } from "./props";
+import { menusProps, menuPropKeys } from "./props";
 const index = defineComponent({
   name: "EleMenus",
   props: menusProps,
@@ -184,22 +184,13 @@ const index = defineComponent({
       return h(
         ElMenu,
         {
+          ...pick(props, menuPropKeys),
           ref: menuRef,
           class: [
             "ele-menu",
             { "ele-menu-dark": props.theme === "dark" },
             { "ele-menu-colorful": props.colorful === true }
           ],
-          mode: props.mode,
-          collapse: props.collapse,
-          ellipsis: props.ellipsis,
-          defaultActive: props.defaultActive,
-          defaultOpeneds: props.defaultOpeneds,
-          uniqueOpened: props.uniqueOpened,
-          menuTrigger: props.menuTrigger,
-          router: props.router,
-          collapseTransition: props.collapseTransition,
-          popperEffect: props.popperEffect,
           onOpen: (index2, indexPath) => {
             emit("open", index2, indexPath);
           },

package/es/ele-menus/props.d.ts

@@ -1,4 +1,5 @@
 import type { PropType, ExtractPropTypes } from 'vue';
+import { menuProps } from 'element-plus';
 import type { MenuItem, MenuTheme, PopupMenuTheme, PopupColorful } from './types';
 /**
  * 属性
@@ -35,3 +36,8 @@ export declare const menusProps: {
     popperEffect: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "light" | "dark", unknown, "dark", boolean>;
 };
 export type MenusProps = ExtractPropTypes<typeof menusProps>;
+export type MenuPropKeys = Array<keyof typeof menuProps>;
+/**
+ * 菜单组件属性名
+ */
+export declare const menuPropKeys: MenuPropKeys;

package/es/ele-menus/props.js

@@ -25,6 +25,8 @@ const menusProps = {
   // 禁用 tooltip
   tooltipDisabled: Boolean
 };
+const menuPropKeys = Object.keys(menuProps);
 export {
+  menuPropKeys,
   menusProps
 };

package/es/ele-menus/style/index.scss

@@ -42,13 +42,13 @@
     font-size: eleVar('menu', 'arrow-size');
     margin: 0 0 0 eleVar('menu', 'icon-margin');
 
-    & > svg.arrow-down path {
+    & > svg.ele-arrow-down path {
       transition: d 0.2s;
     }
   }
 
   .el-sub-menu.is-opened > .el-sub-menu__title {
-    .el-sub-menu__icon-arrow > svg.arrow-down path {
+    .el-sub-menu__icon-arrow > svg.ele-arrow-down path {
       #{'d'}: path('M3.75 10.2002L7.99274 5.7998L12.2361 10.0425');
     }
   }
@@ -76,12 +76,12 @@
       &::after {
         content: '';
         height: 2px;
-        width: 100%;
-        background: transparent;
+        width: calc(100% - #{eleVar('menu-horizontal', 'item-padding')} * 2);
         transition: background-color elVar('transition-duration');
+        background: transparent;
         position: absolute;
         bottom: 0;
-        left: 0;
+        left: eleVar('menu-horizontal', 'item-padding');
       }
     }
 
@@ -214,6 +214,7 @@
   }
 
   &.el-popper,
+  &.el-popper.is-light,
   &.el-menu--popup-container {
     background: none;
     border: none;
@@ -538,4 +539,10 @@
   max-height: calc(100vh - 10px);
   overflow-y: auto;
   overflow-y: overlay;
+
+  & > .el-menu-item > .el-badge,
+  & > .el-sub-menu > .el-sub-menu__title > .el-badge {
+    order: 3;
+    line-height: 1;
+  }
 }