Skip to content

Commit

Permalink
次导航支持隐藏
Browse files Browse the repository at this point in the history
  • Loading branch information
hooray committed Jul 1, 2024
1 parent 8854836 commit 38723aa
Show file tree
Hide file tree
Showing 2 changed files with 33 additions and 10 deletions.
5 changes: 5 additions & 0 deletions src/App.vue
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,12 @@ import hotkeys from 'hotkeys-js'
import eventBus from './utils/eventBus'
import Provider from './ui-provider/index.vue'
import useSettingsStore from '@/store/modules/settings'
import useMenuStore from '@/store/modules/menu'
const route = useRoute()
const settingsStore = useSettingsStore()
const menuStore = useMenuStore()
const { auth } = useAuth()
const isAuth = computed(() => {
Expand All @@ -33,6 +35,9 @@ const subSidebarActualWidth = computed(() => {
if (settingsStore.settings.menu.subMenuCollapse && settingsStore.mode !== 'mobile') {
actualWidth = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--g-sub-sidebar-collapse-width'))
}
if (menuStore.sidebarMenus.every(item => item.meta?.menu === false)) {
actualWidth = 0
}
return `${actualWidth}px`
})
Expand Down
38 changes: 28 additions & 10 deletions src/layouts/components/SubSidebar/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -25,24 +25,42 @@ function onSidebarScroll() {
showShadowBottom.value = Math.ceil(scrollTop + clientHeight) < scrollHeight
}
const enableSidebar = computed(() => {
return settingsStore.mode === 'mobile' || (
menuStore.sidebarMenus.length !== 0
&& !menuStore.sidebarMenus.every(item => item.meta?.menu === false)
)
})
watch(enableSidebar, (val) => {
if (val) {
nextTick(() => {
onSidebarScroll()
})
}
}, {
immediate: true,
})
const menuRef = ref()
onMounted(() => {
onSidebarScroll()
const { height } = useElementSize(menuRef)
watch(() => height.value, () => {
if (height.value > 0) {
onSidebarScroll()
}
}, {
immediate: true,
})
if (enableSidebar.value) {
const { height } = useElementSize(menuRef)
watch(() => height.value, () => {
if (height.value > 0) {
onSidebarScroll()
}
}, {
immediate: true,
})
}
})
</script>

<template>
<div
class="sub-sidebar-container" :class="{
v-if="enableSidebar" class="sub-sidebar-container" :class="{
'is-collapse': settingsStore.mode === 'pc' && settingsStore.settings.menu.subMenuCollapse,
}"
>
Expand Down

0 comments on commit 38723aa

Please sign in to comment.