xiaodou-ai-admin/src/layout/user.vue

<template>
  <div class="user" >
    <a-dropdown>
        <a-badge :count="0">
          <a-space>
            <a-avatar shape="round" :src="ava"  style="cursor: pointer;" />
            <div class="user-name" >{{userStore.userInfo.label || '蛟龙云'}}</div>
          </a-space>
        </a-badge>
    <template #overlay>
      <a-menu>
        <a-menu-item>
          <a href="javascript:;"  @click="userStore.openUserInfoModal()">个人信息</a>
        </a-menu-item>
        <a-menu-item>
          <a href="javascript:;" @click="userStore.logout()">退出登录</a>
        </a-menu-item>
      </a-menu>
    </template>
  </a-dropdown>
  </div>
</template>

<script lang="ts" setup >

import { useUserStore } from '@/store'

const ava = require('@/assets/logo/logo-blue.png')

const userStore = useUserStore()

</script>

<style lang="less" scoped >
.user-name {
  font: 16px 'Italiana', sans-serif;
  text-transform: lowercase;
  cursor: pointer;
}
</style>