Commit 0595a72da9c666af81a0916663e8e6a014e6fa69

Authored by 无木
1 parent c7c0a7e4

fix(mix-sider): fix mix-sider hover logic

修复左侧混合菜单的悬停处理逻辑
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;