Skip to content
This repository has been archived by the owner on Aug 28, 2024. It is now read-only.

fix: 修复顶部菜单模式，菜单布局不生效。 (fix #121) #205

Merged
merged 2 commits into from
Oct 25, 2023
Merged

fix: 修复顶部菜单模式，菜单布局不生效。 (fix #121) #205

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
311b249
fix: 修复顶部菜单模式，菜单布局不生效。 (fix #121)
Oct 25, 2023
0713c88
fix(顶部菜单): 修复顶部菜单模式，菜单布局不生效。 (fix #121)
Oct 25, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 14 additions & 2 deletions packages/layouts/src/components/menu/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,14 +10,16 @@ import { useI18n } from '@vben/locale'
import { REDIRECT_NAME } from '@vben/constants'
import { renderIcon } from '../index'
import { context } from '../../../bridge'
import type { RouteMeta } from 'vue-router'

const { Logo, useAppInject, useAppConfig } = context
const { Logo, useAppInject, useAppConfig, useMenuSetting } = context
import { getMenus, listenerRouteChange } from '@vben/router'

const { getIsMobile } = useAppInject()

const { menu, isMixSidebar, getCollapsedShowTitle, sidebar, isSidebar } =
useAppConfig()
const { getTopMenuAlign } = useMenuSetting()
const showSidebarLogo = computed(() => {
return unref(isSidebar) || unref(isMixSidebar)
})
Expand Down Expand Up @@ -72,7 +74,7 @@ async function handleMenuChange(route?: RouteLocationNormalizedLoaded) {
}

// 路由格式化
const routerToMenu = (item: RouteRecordItem) => {
const routerToMenu = (item: RouteRecordItem & RouteMeta) => {
const { name, children, meta, icon } = item
const title = t(meta.title as string)
return {
Expand Down Expand Up @@ -106,6 +108,11 @@ const routerToMenu = (item: RouteRecordItem) => {

<VbenScrollbar :class="bem('scrollbar')">
<VbenMenu
class="w-full"
:style="{
justifyContent:
getTopMenuAlign === 'center' ? 'center' : `flex-${getTopMenuAlign}`,
}"
v-model:value="activeKey"
:options="menuList"
:collapsed="getMenuCollapsed"
Expand All @@ -120,6 +127,11 @@ const routerToMenu = (item: RouteRecordItem) => {
</VbenScrollbar>
</div>
</template>
<style>
div:has(> div[class='layout-menu']) {
flex: 1;
}
</style>

<style lang="less" scoped>
.layout-menu {
Expand Down