40 lines
1.2 KiB
Vue
40 lines
1.2 KiB
Vue
<template>
|
|
<div
|
|
:class="y > 50 ? 'bg-white shadow opacity-95' : ''"
|
|
class="px-4 py-2 top-0 z-5 wrap-fix background-color-transition"
|
|
>
|
|
<div class="flex justify-between my-2">
|
|
<div class="flex items-center gap-2" @click.stop="router.push({ name: 'user' })">
|
|
<div
|
|
class="z-100000 rounded-full border-1"
|
|
:class="y > 50 ? 'text-primary border-primary' : 'text-primary border-primary'"
|
|
>
|
|
<Icon icon="vuesax-linear:user" size="20" />
|
|
</div>
|
|
<div :class="y > 50 ? 'text-primary' : 'text-primary'" class="color-transition font-bold">
|
|
{{ userStore.userInfo?.name }}
|
|
</div>
|
|
</div>
|
|
<Icon
|
|
:color="y > 50 ? '#0A1B37' : '#0A1B37'"
|
|
class="color-transition"
|
|
icon="vuesax-linear:logout"
|
|
@click="$emit('logout')"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { useWindowScroll } from '@vueuse/core'
|
|
import { useUserStore } from '@/store/userStore'
|
|
import router from '@/router'
|
|
import Icon from '@/components/BasicPacks/BasicIcon.vue'
|
|
|
|
const { y } = useWindowScroll()
|
|
const userStore = useUserStore()
|
|
|
|
defineEmits<{
|
|
logout: []
|
|
}>()
|
|
</script> |