mirror of
https://gitee.com/yiming_chang/vue-pure-admin.git
synced 2024-12-02 03:07:37 +08:00
feat: 优化菜单,添加 menuArrowIconNoTransition
全局配置
This commit is contained in:
parent
3984ab19c9
commit
6e48ad79a7
@ -35,7 +35,7 @@
|
||||
"@pureadmin/components": "^1.1.0",
|
||||
"@pureadmin/descriptions": "^1.1.0",
|
||||
"@pureadmin/table": "^1.2.0",
|
||||
"@pureadmin/utils": "^1.2.1",
|
||||
"@pureadmin/utils": "^1.6.5",
|
||||
"@vueuse/core": "^9.5.0",
|
||||
"@vueuse/motion": "2.0.0-beta.12",
|
||||
"@wangeditor/editor": "^5.1.21",
|
||||
|
@ -22,7 +22,7 @@ specifiers:
|
||||
"@pureadmin/descriptions": ^1.1.0
|
||||
"@pureadmin/table": ^1.2.0
|
||||
"@pureadmin/theme": ^2.4.0
|
||||
"@pureadmin/utils": ^1.2.1
|
||||
"@pureadmin/utils": ^1.6.5
|
||||
"@types/element-resize-detector": 1.1.3
|
||||
"@types/js-cookie": ^3.0.1
|
||||
"@types/lodash": ^4.14.180
|
||||
@ -133,7 +133,7 @@ dependencies:
|
||||
"@pureadmin/components": 1.1.0_vue@3.2.45
|
||||
"@pureadmin/descriptions": 1.1.1_element-plus@2.2.21
|
||||
"@pureadmin/table": 1.2.0_element-plus@2.2.21
|
||||
"@pureadmin/utils": 1.2.1_aotapuqn7htzdjltsyimavekky
|
||||
"@pureadmin/utils": 1.6.5_aotapuqn7htzdjltsyimavekky
|
||||
"@vueuse/core": 9.5.0_vue@3.2.45
|
||||
"@vueuse/motion": 2.0.0-beta.12_vue@3.2.45
|
||||
"@wangeditor/editor": 5.1.22
|
||||
@ -1138,8 +1138,8 @@ packages:
|
||||
vue-i18n:
|
||||
optional: true
|
||||
dependencies:
|
||||
"@intlify/message-compiler": 9.3.0-beta.6
|
||||
"@intlify/shared": 9.3.0-beta.6
|
||||
"@intlify/message-compiler": 9.3.0-beta.7
|
||||
"@intlify/shared": 9.3.0-beta.7
|
||||
jsonc-eslint-parser: 1.4.1
|
||||
source-map: 0.6.1
|
||||
vue-i18n: 9.2.2_vue@3.2.45
|
||||
@ -1177,14 +1177,14 @@ packages:
|
||||
"@intlify/shared": 9.2.2
|
||||
source-map: 0.6.1
|
||||
|
||||
/@intlify/message-compiler/9.3.0-beta.6:
|
||||
/@intlify/message-compiler/9.3.0-beta.7:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-3PJqRJoqvFHExA9DCkf7fZYKbvYne1tYQ0fptJAhUOZsELarh8wr4aPLKWCkQSRuutdrtZ/n5CcPgJgUmVthDw==
|
||||
integrity: sha512-70r2UNp6DyKtIM4FgYCwdSuBK7xqCx2rVSXLMFiDRQi8pwooBklmOuzA0j7Q8ffbwKlFUJEEr2xPHZz2TJ6NAw==
|
||||
}
|
||||
engines: { node: ">= 14" }
|
||||
dependencies:
|
||||
"@intlify/shared": 9.3.0-beta.6
|
||||
"@intlify/shared": 9.3.0-beta.7
|
||||
source-map: 0.6.1
|
||||
dev: true
|
||||
|
||||
@ -1195,10 +1195,10 @@ packages:
|
||||
}
|
||||
engines: { node: ">= 14" }
|
||||
|
||||
/@intlify/shared/9.3.0-beta.6:
|
||||
/@intlify/shared/9.3.0-beta.7:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-ITA1R4tvJYwZXT5x6QCSwxcwQ4dU52zrzVm/EUbgsp8oWzYS1xexBrxyNM80PSQudYvL2rvcZJKQ7yBh7b0LkQ==
|
||||
integrity: sha512-weWqKXyv94rdPXbSFYvA4yIwLYDhzgIWfgrVQ6UYARobPFE3BN+woWmjlGmASTyXMzZtTsq21b0LCN9SHN8pxQ==
|
||||
}
|
||||
engines: { node: ">= 14" }
|
||||
dev: true
|
||||
@ -1222,7 +1222,7 @@ packages:
|
||||
optional: true
|
||||
dependencies:
|
||||
"@intlify/bundle-utils": 3.2.1_vue-i18n@9.2.2
|
||||
"@intlify/shared": 9.3.0-beta.6
|
||||
"@intlify/shared": 9.3.0-beta.7
|
||||
"@rollup/pluginutils": 4.2.1
|
||||
debug: 4.3.4
|
||||
fast-glob: 3.2.12
|
||||
@ -1410,10 +1410,10 @@ packages:
|
||||
string-hash: 1.1.3
|
||||
dev: true
|
||||
|
||||
/@pureadmin/utils/1.2.1_aotapuqn7htzdjltsyimavekky:
|
||||
/@pureadmin/utils/1.6.5_aotapuqn7htzdjltsyimavekky:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-qcuRwW2DoXHCblFcZcYVAypV12I2P5sw0fvBnLfREtQ3Zlx51y4z0hOByncBFrNc9vFc3CoNM9UYlzsIedNP9A==
|
||||
integrity: sha512-FxMRtKFWxkAcWBqjiI9uxo/3EnObFwAegSXEim5VFrEHogG177skpRj+Z51jfCAdCdwimDrZUdkuEn5c2yqIOA==
|
||||
}
|
||||
peerDependencies:
|
||||
dayjs: "*"
|
||||
|
@ -16,6 +16,7 @@
|
||||
"EpThemeColor": "#409EFF",
|
||||
"ShowLogo": true,
|
||||
"ShowModel": "smart",
|
||||
"menuArrowIconNoTransition": false,
|
||||
"MapConfigure": {
|
||||
"amapKey": "97b3248d1553172e81f168cf94ea667e",
|
||||
"options": {
|
||||
|
@ -29,6 +29,10 @@ import Refresh from "@iconify-icons/ep/refresh";
|
||||
import EditPen from "@iconify-icons/ep/edit-pen";
|
||||
import Delete from "@iconify-icons/ep/delete";
|
||||
import More from "@iconify-icons/ep/more-filled";
|
||||
import EpArrowDown from "@iconify-icons/ep/arrow-down";
|
||||
import ArrowUp from "@iconify-icons/ep/arrow-up";
|
||||
import ArrowRight from "@iconify-icons/ep/arrow-right";
|
||||
import ArrowLeft from "@iconify-icons/ep/arrow-left";
|
||||
addIcon("check", Check);
|
||||
addIcon("menu", Menu);
|
||||
addIcon("home-filled", HomeFilled);
|
||||
@ -56,6 +60,10 @@ addIcon("refresh", Refresh);
|
||||
addIcon("edits", EditPen);
|
||||
addIcon("delete", Delete);
|
||||
addIcon("more", More);
|
||||
addIcon("ep-arrow-down", EpArrowDown);
|
||||
addIcon("ep-arrow-up", ArrowUp);
|
||||
addIcon("ep-arrow-right", ArrowRight);
|
||||
addIcon("ep-arrow-left", ArrowLeft);
|
||||
|
||||
// remixicon
|
||||
import ArrowRightSLine from "@iconify-icons/ri/arrow-right-s-line";
|
||||
|
@ -1,5 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
import path from "path";
|
||||
import { getConfig } from "@/config";
|
||||
import { childrenType } from "../../types";
|
||||
import { useNav } from "@/layout/hooks/useNav";
|
||||
import { transformI18n } from "@/plugins/i18n";
|
||||
@ -76,6 +77,10 @@ const getSpanStyle = computed(() => {
|
||||
};
|
||||
});
|
||||
|
||||
const expandCloseIcon = computed(() => {
|
||||
return getConfig()?.menuArrowIconNoTransition ? "expand-close-icon" : "";
|
||||
});
|
||||
|
||||
const onlyOneChild: childrenType = ref(null);
|
||||
// 存放菜单是否存在showTooltip属性标识
|
||||
const hoverMenuMap = new WeakMap();
|
||||
@ -212,7 +217,15 @@ function resolvePath(routePath) {
|
||||
</el-menu-item>
|
||||
</template>
|
||||
|
||||
<el-sub-menu v-else ref="subMenu" :index="resolvePath(props.item.path)">
|
||||
<el-sub-menu
|
||||
v-else
|
||||
ref="subMenu"
|
||||
:index="resolvePath(props.item.path)"
|
||||
v-bind:[expandCloseIcon]="useRenderIcon('ep-arrow-down')"
|
||||
:expand-open-icon="useRenderIcon('ep-arrow-up')"
|
||||
:collapse-close-icon="useRenderIcon('ep-arrow-right')"
|
||||
:collapse-open-icon="useRenderIcon('ep-arrow-left')"
|
||||
>
|
||||
<template #title>
|
||||
<div v-if="toRaw(props.item.meta.icon)" class="sub-menu-icon">
|
||||
<component
|
||||
|
@ -40,16 +40,3 @@
|
||||
.breadcrumb-leave-active {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
/**
|
||||
* @description 重置el-menu的展开收起动画时长
|
||||
* @see {@link https://github.com/element-plus/element-plus/issues/4509#issuecomment-980165001}
|
||||
*/
|
||||
.outer-most .el-collapse-transition-leave-active,
|
||||
.outer-most .el-collapse-transition-enter-active {
|
||||
transition: 0.12s all ease-in-out !important;
|
||||
}
|
||||
|
||||
.horizontal-collapse-transition {
|
||||
transition: var(--pure-transition-duration) all !important;
|
||||
}
|
||||
|
1
types/global.d.ts
vendored
1
types/global.d.ts
vendored
@ -110,6 +110,7 @@ declare global {
|
||||
EpThemeColor?: string;
|
||||
ShowLogo?: boolean;
|
||||
ShowModel?: string;
|
||||
menuArrowIconNoTransition?: boolean;
|
||||
MapConfigure?: {
|
||||
amapKey?: string;
|
||||
options: {
|
||||
|
Loading…
Reference in New Issue
Block a user