fix: 删除会话图标改为Delete直显

This commit is contained in:
2026-04-03 17:30:30 +08:00
parent a9ae4bce44
commit a4a18f2b82

View File

@@ -39,17 +39,11 @@
<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-popover placement="left" :width="120" trigger="click"> <el-tooltip content="删除会话" placement="top">
<template #reference> <el-button link type="danger" @click.stop="deleteRecentChat(chat)">
<span class="chat-action-btn" title="删除会话">
<el-icon><MoreFilled /></el-icon>
</span>
</template>
<div class="chat-action-list" @click="deleteRecentChat(chat)">
<el-icon><Delete /></el-icon> <el-icon><Delete /></el-icon>
删除会话 </el-button>
</div> </el-tooltip>
</el-popover>
</div> </div>
<div v-if="recentChats.length === 0" class="sidebar-empty">暂无最近聊天</div> <div v-if="recentChats.length === 0" class="sidebar-empty">暂无最近聊天</div>
</div> </div>
@@ -223,7 +217,7 @@
<script setup> <script setup>
import { ref, computed, onMounted, onUnmounted, nextTick } from 'vue' import { ref, computed, onMounted, onUnmounted, nextTick } from 'vue'
import { ElMessage } from 'element-plus' import { ElMessage } from 'element-plus'
import { ChatLineRound, User, Search, Loading, Picture, Paperclip, Download, ChatDotRound, Promotion, MoreFilled, Delete } from '@element-plus/icons-vue' import { ChatLineRound, User, Search, Loading, Picture, Paperclip, Download, ChatDotRound, Promotion, Delete } from '@element-plus/icons-vue'
import { useUserStore } from '@/store/user' import { useUserStore } from '@/store/user'
import { getUsers, getMessages, sendMessage as sendMessageApi, uploadChatFile, getUnreadList, deleteConversation } from '@/api/message' import { getUsers, getMessages, sendMessage as sendMessageApi, uploadChatFile, getUnreadList, deleteConversation } from '@/api/message'
import { chatService } from '@/services/chat' import { chatService } from '@/services/chat'
@@ -579,15 +573,6 @@ const downloadFile = async (msg) => {
// ======== 其他操作 ======== // ======== 其他操作 ========
const handleChatAction = async (command, chat) => {
if (command === 'delete') {
await deleteConversation(chat.id)
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 deleteRecentChat = async (chat) => { const deleteRecentChat = async (chat) => {
try { try {
await deleteConversation(chat.id) await deleteConversation(chat.id)
@@ -706,10 +691,6 @@ 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-action-list { display: flex; align-items: center; gap: 8px; padding: 8px; cursor: pointer; border-radius: 4px; font-size: 13px; color: #f56c6c; transition: background 0.2s; }
.chat-action-list:hover { background: #fef0f0; }
.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; }