32 lines
909 B
Vue
32 lines
909 B
Vue
<script setup>
|
|
import { computed } from 'vue'
|
|
import { useUserStore } from '@/stores/user'
|
|
import UserDropdown from '@/components/UserDropdown.vue'
|
|
import BrandLogo from '@/components/BrandLogo.vue'
|
|
|
|
const userStore = useUserStore()
|
|
|
|
// 计算是否应该显示用户组件
|
|
const shouldShowUser = computed(() => {
|
|
const hasUserName = !!userStore.displayName && userStore.displayName !== '未命名用户'
|
|
return hasUserName
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<header
|
|
class="fixed top-0 left-0 right-0 z-[100]
|
|
flex items-center px-[30px]
|
|
bg-sidebar border-b border-sidebar-border
|
|
text-sidebar-foreground"
|
|
:style="{ height: 'var(--header-height)' }"
|
|
>
|
|
<div class="flex items-center gap-md flex-1">
|
|
<BrandLogo :size="40" />
|
|
</div>
|
|
<div class="flex items-center gap-md pr-1">
|
|
<UserDropdown v-if="shouldShowUser" />
|
|
</div>
|
|
</header>
|
|
</template>
|