fix: 聊天删除按钮tooltip显示+点击生效

This commit is contained in:
2026-04-03 17:23:12 +08:00
parent 3f4a294128
commit 5367ad61db

View File

@@ -39,19 +39,18 @@
<div class="sidebar-item-name">{{ chat.name }}</div> <div class="sidebar-item-name">{{ chat.name }}</div>
<div class="sidebar-item-msg">{{ chat.lastMsg || '暂无消息' }}</div> <div class="sidebar-item-msg">{{ chat.lastMsg || '暂无消息' }}</div>
</div> </div>
<el-dropdown trigger="click" @command="(cmd) => handleChatAction(cmd, chat)" @click.stop> <el-tooltip content="删除会话" placement="top">
<el-button link style="padding: 4px"> <el-dropdown trigger="click" @command="(cmd) => handleChatAction(cmd, chat)">
<el-icon><MoreFilled /></el-icon> <span class="chat-action-btn">
</el-button> <el-icon><MoreFilled /></el-icon>
<template #dropdown> </span>
<el-dropdown-menu> <template #dropdown>
<el-dropdown-item command="delete"> <el-dropdown-menu>
<el-icon><Delete /></el-icon> <el-dropdown-item command="delete">删除会话</el-dropdown-item>
删除会话 </el-dropdown-menu>
</el-dropdown-item> </template>
</el-dropdown-menu> </el-dropdown>
</template> </el-tooltip>
</el-dropdown>
</div> </div>
<div v-if="recentChats.length === 0" class="sidebar-empty">暂无最近聊天</div> <div v-if="recentChats.length === 0" class="sidebar-empty">暂无最近聊天</div>
</div> </div>
@@ -697,6 +696,8 @@ onUnmounted(() => { if (unsubscribeWs) unsubscribeWs() })
.sidebar-item-status { font-size: 12px; color: #909399; } .sidebar-item-status { font-size: 12px; color: #909399; }
.sidebar-item-status.online { color: #67c23a; } .sidebar-item-status.online { color: #67c23a; }
.sidebar-empty { padding: 20px; text-align: center; color: #909399; font-size: 12px; } .sidebar-empty { padding: 20px; text-align: center; color: #909399; font-size: 12px; }
.chat-action-btn { display: flex; align-items: center; cursor: pointer; padding: 4px; border-radius: 4px; color: #909399; transition: all 0.2s; }
.chat-action-btn:hover { color: #409eff; background: #f0f9ff; }
.chat-main { flex: 1; display: flex; flex-direction: column; } .chat-main { flex: 1; display: flex; flex-direction: column; }
.chat-header { display: flex; align-items: center; gap: 8px; padding: 12px; border-bottom: 1px solid #e4e7ed; } .chat-header { display: flex; align-items: center; gap: 8px; padding: 12px; border-bottom: 1px solid #e4e7ed; }