From 3f4a294128e045512e6bd818e1a7b97597d90c27 Mon Sep 17 00:00:00 2001
From: gaoxq <376340421@qq.com>
Date: Fri, 3 Apr 2026 17:20:28 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E8=81=8A=E5=A4=A9=E5=88=A0?=
 =?UTF-8?q?=E9=99=A4=E6=8C=89=E9=92=AE=E6=94=B9=E7=94=A8=20el-dropdown=20?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web-vue/src/components/ChatDialog.vue | 32 ++++++++++++++++-----------
 1 file changed, 19 insertions(+), 13 deletions(-)

diff --git a/web-vue/src/components/ChatDialog.vue b/web-vue/src/components/ChatDialog.vue
index a223d94..c82c4f7 100644
--- a/web-vue/src/components/ChatDialog.vue
+++ b/web-vue/src/components/ChatDialog.vue
@@ -39,9 +39,19 @@
               <div class="sidebar-item-name">{{ chat.name }}</div>
               <div class="sidebar-item-msg">{{ chat.lastMsg || '暂无消息' }}</div>
             </div>
-            <el-button v-if="chat.lastMsg" class="delete-btn" link type="danger" @click.stop="deleteRecentChat(chat)">
-              <el-icon><Close /></el-icon>
-            </el-button>
+            <el-dropdown trigger="click" @command="(cmd) => handleChatAction(cmd, chat)" @click.stop>
+              <el-button link style="padding: 4px">
+                <el-icon><MoreFilled /></el-icon>
+              </el-button>
+              <template #dropdown>
+                <el-dropdown-menu>
+                  <el-dropdown-item command="delete">
+                    <el-icon><Delete /></el-icon>
+                    删除会话
+                  </el-dropdown-item>
+                </el-dropdown-menu>
+              </template>
+            </el-dropdown>
           </div>
           <div v-if="recentChats.length === 0" class="sidebar-empty">暂无最近聊天</div>
         </div>
@@ -215,7 +225,7 @@
 <script setup>
 import { ref, computed, onMounted, onUnmounted, nextTick } from 'vue'
 import { ElMessage } from 'element-plus'
-import { ChatLineRound, User, Search, Close, Loading, Picture, Paperclip, Download, ChatDotRound, Promotion } from '@element-plus/icons-vue'
+import { ChatLineRound, User, Search, Loading, Picture, Paperclip, Download, ChatDotRound, Promotion, MoreFilled, Delete } from '@element-plus/icons-vue'
 import { useUserStore } from '@/store/user'
 import { getUsers, getMessages, sendMessage as sendMessageApi, uploadChatFile, getUnreadList, deleteConversation } from '@/api/message'
 import { chatService } from '@/services/chat'
@@ -571,15 +581,13 @@ const downloadFile = async (msg) => {
 
 // ======== 其他操作 ========
 
-const deleteRecentChat = async (chat) => {
-  try {
+const handleChatAction = async (command, chat) => {
+  if (command === 'delete') {
     await deleteConversation(chat.id)
-  } catch (e) {
-    // 即使 API 失败也删本地
+    const idx = recentChats.value.findIndex(c => c.id === chat.id)
+    if (idx > -1) recentChats.value.splice(idx, 1)
+    if (currentContact.value?.id === chat.id) currentContact.value = null
   }
-  const idx = recentChats.value.findIndex(c => c.id === chat.id)
-  if (idx > -1) recentChats.value.splice(idx, 1)
-  if (currentContact.value?.id === chat.id) currentContact.value = null
 }
 
 const scrollToBottom = () => {
@@ -689,8 +697,6 @@ onUnmounted(() => { if (unsubscribeWs) unsubscribeWs() })
 .sidebar-item-status { font-size: 12px; color: #909399; }
 .sidebar-item-status.online { color: #67c23a; }
 .sidebar-empty { padding: 20px; text-align: center; color: #909399; font-size: 12px; }
-.delete-btn { opacity: 0.4; transition: opacity 0.2s; }
-.sidebar-item:hover .delete-btn { opacity: 1; }
 
 .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; }