对接后端

This commit is contained in:
ovo 2024-12-07 22:30:59 +08:00
parent 7a4e1e39b8
commit b72c5feff6
1 changed files with 9 additions and 8 deletions

View File

@ -6,27 +6,26 @@
<div class="right"> <div class="right">
<template v-if="userStore.userInfo"> <template v-if="userStore.userInfo">
<!-- 已登录状态 --> <el-dropdown :hide-on-click="false">
<el-dropdown trigger="click" @command="handleCommand"> <span class="user-info">
<div class="user-info">
<el-avatar <el-avatar
:size="32" :size="32"
:src="userStore.userInfo.avatar || defaultAvatar" :src="userStore.userInfo.avatar || defaultAvatar"
/> />
<span class="nickname">{{ userStore.userInfo.nickname || '用户' }}</span> <span class="nickname">{{ userStore.userInfo.nickname || '用户' }}</span>
<el-icon class="el-icon--right"><arrow-down /></el-icon> <el-icon class="el-icon--right"><arrow-down /></el-icon>
</div> </span>
<template #dropdown> <template #dropdown>
<el-dropdown-menu> <el-dropdown-menu>
<el-dropdown-item command="profile"> <el-dropdown-item @click="handleCommand('profile')">
<el-icon><User /></el-icon> <el-icon><User /></el-icon>
个人中心 个人中心
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item command="settings"> <el-dropdown-item @click="handleCommand('settings')">
<el-icon><Setting /></el-icon> <el-icon><Setting /></el-icon>
设置 设置
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item divided command="logout"> <el-dropdown-item divided @click="handleCommand('logout')">
<el-icon><SwitchButton /></el-icon> <el-icon><SwitchButton /></el-icon>
退出登录 退出登录
</el-dropdown-item> </el-dropdown-item>
@ -67,8 +66,9 @@ onMounted(async () => {
} }
}) })
// //
const handleCommand = async (command: string) => { const handleCommand = async (command: string) => {
console.log('Menu clicked:', command) //
switch (command) { switch (command) {
case 'profile': case 'profile':
router.push('/profile') router.push('/profile')
@ -126,6 +126,7 @@ const handleCommand = async (command: string) => {
padding: 2px 8px; padding: 2px 8px;
border-radius: 4px; border-radius: 4px;
transition: background-color 0.3s; transition: background-color 0.3s;
user-select: none; /* 防止文本被选中 */
} }
.user-info:hover { .user-info:hover {