侧边栏修正
This commit is contained in:
@@ -4,7 +4,7 @@
|
||||
<aside class="sidebar" :class="{ collapsed: collapsed }">
|
||||
<div class="sidebar-header">
|
||||
<div class="logo">
|
||||
<img src="/logo.jpg" alt="Logo" class="logo-img" />
|
||||
<img :src="logoUrl" alt="Logo" class="logo-img" />
|
||||
<span v-if="!collapsed" class="logo-text">城市生命线</span>
|
||||
</div>
|
||||
<div class="collapse-btn" @click="toggleSidebar">
|
||||
@@ -104,21 +104,12 @@ import {
|
||||
ArrowRight
|
||||
} from '@element-plus/icons-vue'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import type { MenuItem } from '@/types/menu'
|
||||
|
||||
interface Props {
|
||||
service?: string // 服务名称:platform, bidding, workcase
|
||||
}
|
||||
|
||||
interface MenuItem {
|
||||
key: string
|
||||
label: string
|
||||
icon: string
|
||||
url?: string
|
||||
type: 'route' | 'iframe'
|
||||
children?: MenuItem[] // 子菜单
|
||||
expanded?: boolean // 是否展开
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
service: undefined // 不设默认值,从路由自动检测
|
||||
})
|
||||
@@ -185,6 +176,18 @@ const currentService = computed(() => {
|
||||
return 'workcase'
|
||||
})
|
||||
|
||||
// 动态 Logo URL
|
||||
const logoUrl = computed(() => {
|
||||
const service = currentService.value
|
||||
// 根据不同服务返回对应的 logo 路径
|
||||
const serviceLogos: Record<string, string> = {
|
||||
'platform': '/platform/logo.jpg',
|
||||
'workcase': '/workcase/logo.jpg',
|
||||
'bidding': '/bidding/logo.jpg'
|
||||
}
|
||||
return serviceLogos[service] || '/logo.jpg' // 默认回退到根路径
|
||||
})
|
||||
|
||||
// 状态管理
|
||||
const collapsed = ref(false)
|
||||
const activeMenu = ref('home')
|
||||
@@ -310,12 +313,12 @@ const toggleMenu = (item: MenuItem) => {
|
||||
|
||||
// 处理菜单点击
|
||||
const handleMenuClick = (item: MenuItem) => {
|
||||
activeMenu.value = item.key
|
||||
activeMenu.value = item.key || ''
|
||||
|
||||
// 所有菜单都通过路由跳转
|
||||
if (item.url) {
|
||||
router.push(item.url)
|
||||
if (item.type === 'iframe') {
|
||||
if (item.viewType === 'iframe') {
|
||||
iframeLoading.value = true
|
||||
}
|
||||
}
|
||||
|
||||
@@ -3,6 +3,7 @@ export * from "./page"
|
||||
export * from "./base"
|
||||
export * from "./sys"
|
||||
export * from "./enums"
|
||||
export * from "./menu"
|
||||
|
||||
// 服务 types
|
||||
export * from "./auth"
|
||||
|
||||
42
urbanLifelineWeb/packages/shared/src/types/menu/index.ts
Normal file
42
urbanLifelineWeb/packages/shared/src/types/menu/index.ts
Normal file
@@ -0,0 +1,42 @@
|
||||
/**
|
||||
* 菜单相关类型定义
|
||||
* 基于 TbSysViewDTO 扩展
|
||||
*/
|
||||
|
||||
import type { TbSysViewDTO } from '../sys/permission'
|
||||
|
||||
/**
|
||||
* 菜单项类型
|
||||
* 扩展 TbSysViewDTO,添加运行时状态
|
||||
*/
|
||||
export interface MenuItem extends TbSysViewDTO {
|
||||
/** 唯一标识(用于菜单选中状态),覆盖为必需 */
|
||||
key: string
|
||||
/** 显示标签,覆盖为必需 */
|
||||
label: string
|
||||
/** 是否展开(运行时状态,仅用于有子菜单的项) */
|
||||
expanded?: boolean
|
||||
/** 子菜单(覆盖类型为 MenuItem[]) */
|
||||
children?: MenuItem[]
|
||||
}
|
||||
|
||||
/**
|
||||
* 从 TbSysViewDTO 转换为 MenuItem
|
||||
*/
|
||||
export function toMenuItem(view: TbSysViewDTO, expanded = false): MenuItem {
|
||||
return {
|
||||
...view,
|
||||
key: view.viewId || view.name || '',
|
||||
label: view.name || '',
|
||||
expanded,
|
||||
// 递归转换子菜单
|
||||
children: view.children?.map(child => toMenuItem(child, false))
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 从 TbSysViewDTO 数组转换为 MenuItem 数组
|
||||
*/
|
||||
export function toMenuItems(views: TbSysViewDTO[], defaultExpanded = false): MenuItem[] {
|
||||
return views.map(view => toMenuItem(view, defaultExpanded))
|
||||
}
|
||||
Reference in New Issue
Block a user