github_mirrors/gf-vben-admin
1
0
Fork 0
mirror of https://github.com/vbenjs/gf-vben-admin.git synced 2025-02-03 03:32:59 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

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

Browse Source 
修复左侧混合菜单的悬停处理逻辑
This commit is contained in:
无木 2021-07-09 13:56:33 +08:00
parent c7c0a7e4c8
commit 0595a72da9
2 changed files with 11 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.zh_CN.md
View File

@ -11,6 +11,7 @@
- 修复菜单默认折叠的配置不起作用的问题 - 修复菜单默认折叠的配置不起作用的问题
- 修复`safari`浏览器报错导致网站打不开 - 修复`safari`浏览器报错导致网站打不开
- 修复在 window 上，拉取代码后 eslint 因 endOfLine 而保错问题 - 修复在 window 上，拉取代码后 eslint 因 endOfLine 而保错问题
- 修复左侧混合菜单的悬停触发逻辑
### 🎫 Chores ### 🎫 Chores

18
src/layouts/default/sider/MixSider.vue
View File

@ -80,10 +80,10 @@
<script lang="ts"> <script lang="ts">
import type { Menu } from '/@/router/types'; import type { Menu } from '/@/router/types';
import type { CSSProperties } from 'vue'; import type { CSSProperties } from 'vue';
import { computed, defineComponent, onMounted, ref, unref } from 'vue';
import type { RouteLocationNormalized } from 'vue-router'; import type { RouteLocationNormalized } from 'vue-router';
import { defineComponent, onMounted, ref, computed, unref } from 'vue';
import { ScrollContainer } from '/@/components/Container'; import { ScrollContainer } from '/@/components/Container';
import { SimpleMenuTag } from '/@/components/SimpleMenu'; import { SimpleMenu, SimpleMenuTag } from '/@/components/SimpleMenu';
import { Icon } from '/@/components/Icon'; import { Icon } from '/@/components/Icon';
import { AppLogo } from '/@/components/Application'; import { AppLogo } from '/@/components/Application';
import Trigger from '../trigger/HeaderTrigger.vue'; import Trigger from '../trigger/HeaderTrigger.vue';
@ -93,11 +93,10 @@
import { useDesign } from '/@/hooks/web/useDesign'; import { useDesign } from '/@/hooks/web/useDesign';
import { useI18n } from '/@/hooks/web/useI18n'; import { useI18n } from '/@/hooks/web/useI18n';
import { useGo } from '/@/hooks/web/usePage'; import { useGo } from '/@/hooks/web/usePage';
import { SIDE_BAR_SHOW_TIT_MINI_WIDTH, SIDE_BAR_MINI_WIDTH } from '/@/enums/appEnum'; import { SIDE_BAR_MINI_WIDTH, SIDE_BAR_SHOW_TIT_MINI_WIDTH } from '/@/enums/appEnum';
import clickOutside from '/@/directives/clickOutside'; import clickOutside from '/@/directives/clickOutside';
import { getShallowMenus, getChildrenMenus, getCurrentParentPath } from '/@/router/menus'; import { getChildrenMenus, getCurrentParentPath, getShallowMenus } from '/@/router/menus';
import { listenerRouteChange } from '/@/logics/mitt/routeChange'; import { listenerRouteChange } from '/@/logics/mitt/routeChange';
import { SimpleMenu } from '/@/components/SimpleMenu';
export default defineComponent({ export default defineComponent({
name: 'LayoutMixSider', name: 'LayoutMixSider',
@ -179,6 +178,7 @@
return !unref(getMixSideFixed) return !unref(getMixSideFixed)
? { ? {
onMouseleave: () => { onMouseleave: () => {
setActive(true);
closeMenu(); closeMenu();
}, },
} }
@ -219,6 +219,10 @@
} else { } else {
closeMenu(); closeMenu();
} }
} else {
if (!unref(openMenu)) {
openMenu.value = true;
}
} }
if (!unref(openMenu)) { if (!unref(openMenu)) {
setActive(); setActive();
@ -241,8 +245,7 @@
async function setActive(setChildren = false) { async function setActive(setChildren = false) {
const path = currentRoute.value?.path; const path = currentRoute.value?.path;
if (!path) return; if (!path) return;
const parentPath = await getCurrentParentPath(path); activePath.value = await getCurrentParentPath(path);
activePath.value = parentPath;
// hanldeModuleClick(parentPath); // hanldeModuleClick(parentPath);
if (unref(getIsMixSidebar)) { if (unref(getIsMixSidebar)) {
const activeMenu = unref(menuModules).find((item) => item.path === unref(activePath)); const activeMenu = unref(menuModules).find((item) => item.path === unref(activePath));
@ -496,7 +499,6 @@
&-menu-list { &-menu-list {
position: fixed; position: fixed;
top: 0; top: 0;
width: 0;
width: 200px; width: 200px;
height: calc(100%); height: calc(100%);
background-color: #fff; background-color: #fff;