Commit 0595a72da9c666af81a0916663e8e6a014e6fa69
1 parent
c7c0a7e4
fix(mix-sider): fix mix-sider hover logic
修复左侧混合菜单的悬停处理逻辑
Showing
2 changed files
with
11 additions
and
8 deletions
CHANGELOG.zh_CN.md
@@ -11,6 +11,7 @@ | @@ -11,6 +11,7 @@ | ||
11 | - 修复菜单默认折叠的配置不起作用的问题 | 11 | - 修复菜单默认折叠的配置不起作用的问题 |
12 | - 修复`safari`浏览器报错导致网站打不开 | 12 | - 修复`safari`浏览器报错导致网站打不开 |
13 | - 修复在 window 上,拉取代码后 eslint 因 endOfLine 而保错问题 | 13 | - 修复在 window 上,拉取代码后 eslint 因 endOfLine 而保错问题 |
14 | + - 修复左侧混合菜单的悬停触发逻辑 | ||
14 | 15 | ||
15 | ### 🎫 Chores | 16 | ### 🎫 Chores |
16 | 17 |
src/layouts/default/sider/MixSider.vue
@@ -80,10 +80,10 @@ | @@ -80,10 +80,10 @@ | ||
80 | <script lang="ts"> | 80 | <script lang="ts"> |
81 | import type { Menu } from '/@/router/types'; | 81 | import type { Menu } from '/@/router/types'; |
82 | import type { CSSProperties } from 'vue'; | 82 | import type { CSSProperties } from 'vue'; |
83 | + import { computed, defineComponent, onMounted, ref, unref } from 'vue'; | ||
83 | import type { RouteLocationNormalized } from 'vue-router'; | 84 | import type { RouteLocationNormalized } from 'vue-router'; |
84 | - import { defineComponent, onMounted, ref, computed, unref } from 'vue'; | ||
85 | import { ScrollContainer } from '/@/components/Container'; | 85 | import { ScrollContainer } from '/@/components/Container'; |
86 | - import { SimpleMenuTag } from '/@/components/SimpleMenu'; | 86 | + import { SimpleMenu, SimpleMenuTag } from '/@/components/SimpleMenu'; |
87 | import { Icon } from '/@/components/Icon'; | 87 | import { Icon } from '/@/components/Icon'; |
88 | import { AppLogo } from '/@/components/Application'; | 88 | import { AppLogo } from '/@/components/Application'; |
89 | import Trigger from '../trigger/HeaderTrigger.vue'; | 89 | import Trigger from '../trigger/HeaderTrigger.vue'; |
@@ -93,11 +93,10 @@ | @@ -93,11 +93,10 @@ | ||
93 | import { useDesign } from '/@/hooks/web/useDesign'; | 93 | import { useDesign } from '/@/hooks/web/useDesign'; |
94 | import { useI18n } from '/@/hooks/web/useI18n'; | 94 | import { useI18n } from '/@/hooks/web/useI18n'; |
95 | import { useGo } from '/@/hooks/web/usePage'; | 95 | import { useGo } from '/@/hooks/web/usePage'; |
96 | - import { SIDE_BAR_SHOW_TIT_MINI_WIDTH, SIDE_BAR_MINI_WIDTH } from '/@/enums/appEnum'; | 96 | + import { SIDE_BAR_MINI_WIDTH, SIDE_BAR_SHOW_TIT_MINI_WIDTH } from '/@/enums/appEnum'; |
97 | import clickOutside from '/@/directives/clickOutside'; | 97 | import clickOutside from '/@/directives/clickOutside'; |
98 | - import { getShallowMenus, getChildrenMenus, getCurrentParentPath } from '/@/router/menus'; | 98 | + import { getChildrenMenus, getCurrentParentPath, getShallowMenus } from '/@/router/menus'; |
99 | import { listenerRouteChange } from '/@/logics/mitt/routeChange'; | 99 | import { listenerRouteChange } from '/@/logics/mitt/routeChange'; |
100 | - import { SimpleMenu } from '/@/components/SimpleMenu'; | ||
101 | 100 | ||
102 | export default defineComponent({ | 101 | export default defineComponent({ |
103 | name: 'LayoutMixSider', | 102 | name: 'LayoutMixSider', |
@@ -179,6 +178,7 @@ | @@ -179,6 +178,7 @@ | ||
179 | return !unref(getMixSideFixed) | 178 | return !unref(getMixSideFixed) |
180 | ? { | 179 | ? { |
181 | onMouseleave: () => { | 180 | onMouseleave: () => { |
181 | + setActive(true); | ||
182 | closeMenu(); | 182 | closeMenu(); |
183 | }, | 183 | }, |
184 | } | 184 | } |
@@ -219,6 +219,10 @@ | @@ -219,6 +219,10 @@ | ||
219 | } else { | 219 | } else { |
220 | closeMenu(); | 220 | closeMenu(); |
221 | } | 221 | } |
222 | + } else { | ||
223 | + if (!unref(openMenu)) { | ||
224 | + openMenu.value = true; | ||
225 | + } | ||
222 | } | 226 | } |
223 | if (!unref(openMenu)) { | 227 | if (!unref(openMenu)) { |
224 | setActive(); | 228 | setActive(); |
@@ -241,8 +245,7 @@ | @@ -241,8 +245,7 @@ | ||
241 | async function setActive(setChildren = false) { | 245 | async function setActive(setChildren = false) { |
242 | const path = currentRoute.value?.path; | 246 | const path = currentRoute.value?.path; |
243 | if (!path) return; | 247 | if (!path) return; |
244 | - const parentPath = await getCurrentParentPath(path); | ||
245 | - activePath.value = parentPath; | 248 | + activePath.value = await getCurrentParentPath(path); |
246 | // hanldeModuleClick(parentPath); | 249 | // hanldeModuleClick(parentPath); |
247 | if (unref(getIsMixSidebar)) { | 250 | if (unref(getIsMixSidebar)) { |
248 | const activeMenu = unref(menuModules).find((item) => item.path === unref(activePath)); | 251 | const activeMenu = unref(menuModules).find((item) => item.path === unref(activePath)); |
@@ -496,7 +499,6 @@ | @@ -496,7 +499,6 @@ | ||
496 | &-menu-list { | 499 | &-menu-list { |
497 | position: fixed; | 500 | position: fixed; |
498 | top: 0; | 501 | top: 0; |
499 | - width: 0; | ||
500 | width: 200px; | 502 | width: 200px; |
501 | height: calc(100%); | 503 | height: calc(100%); |
502 | background-color: #fff; | 504 | background-color: #fff; |