2025-11-10 00:59:40 +08:00
|
|
|
<script setup>
|
2026-02-24 21:41:05 +08:00
|
|
|
import { computed } from 'vue'
|
2025-11-10 00:59:40 +08:00
|
|
|
import { useUserStore } from '@/stores/user'
|
2025-11-12 22:45:29 +08:00
|
|
|
import UserDropdown from '@/components/UserDropdown.vue'
|
2026-03-04 02:13:16 +08:00
|
|
|
import BrandLogo from '@/components/BrandLogo.vue'
|
2025-11-10 00:59:40 +08:00
|
|
|
|
2026-02-24 21:41:05 +08:00
|
|
|
const userStore = useUserStore()
|
2025-11-10 00:59:40 +08:00
|
|
|
|
2025-11-12 22:45:29 +08:00
|
|
|
// 计算是否应该显示用户组件
|
|
|
|
|
const shouldShowUser = computed(() => {
|
|
|
|
|
const hasUserName = !!userStore.displayName && userStore.displayName !== '未命名用户'
|
2026-02-24 21:41:05 +08:00
|
|
|
return hasUserName
|
2025-11-12 22:45:29 +08:00
|
|
|
})
|
2025-11-10 00:59:40 +08:00
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<template>
|
2026-03-15 23:40:31 +08:00
|
|
|
<header
|
|
|
|
|
class="fixed top-0 left-0 right-0 z-[100]
|
|
|
|
|
h-[70px] flex items-center px-[30px]
|
|
|
|
|
bg-gray-900 text-white
|
|
|
|
|
border-b border-border"
|
|
|
|
|
>
|
|
|
|
|
<div class="flex items-center gap-3 flex-1">
|
|
|
|
|
<BrandLogo :size="40" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="flex items-center gap-4 pr-1">
|
|
|
|
|
<UserDropdown v-if="shouldShowUser" />
|
2025-11-10 00:59:40 +08:00
|
|
|
</div>
|
|
|
|
|
</header>
|
|
|
|
|
</template>
|
