From 493775cd1ea066242c22058008109ad9d9c1785b Mon Sep 17 00:00:00 2001
From: Jerry Yan <792602257@qq.com>
Date: Wed, 10 Jun 2026 18:11:46 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=A0=E9=99=A4=E4=BC=9A=E8=AF=9D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/package.json                      |  1 +
 web/pnpm-lock.yaml                    |  8 ++++
 web/src/views/chat/ChatDetailView.vue | 68 ++++++++++++++++++++++++---
 3 files changed, 70 insertions(+), 7 deletions(-)

diff --git a/web/package.json b/web/package.json
index 58ea92b..e4bf936 100644
--- a/web/package.json
+++ b/web/package.json
@@ -19,6 +19,7 @@
   "license": "ISC",
   "packageManager": "pnpm@10.32.1",
   "dependencies": {
+    "@vicons/ionicons5": "^0.13.0",
     "markdown-it": "^14.1.1",
     "naive-ui": "^2.44.1",
     "pinia": "^3.0.4",
diff --git a/web/pnpm-lock.yaml b/web/pnpm-lock.yaml
index 54b179d..1b946b5 100644
--- a/web/pnpm-lock.yaml
+++ b/web/pnpm-lock.yaml
@@ -8,6 +8,9 @@ importers:
 
   .:
     dependencies:
+      '@vicons/ionicons5':
+        specifier: ^0.13.0
+        version: 0.13.0
       markdown-it:
         specifier: ^14.1.1
         version: 14.1.1
@@ -524,6 +527,9 @@ packages:
     resolution: {integrity: sha512-LdDNl6C5iJExcM0Yh0PwAIBb9PrSiCsWamF/JyEZawm3kFDnRoaq3LGE4bpyRao/fWeGKKyw7icx0YxrLFC5Cg==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
+  '@vicons/ionicons5@0.13.0':
+    resolution: {integrity: sha512-zvZKBPjEXKN7AXNo2Na2uy+nvuv6SP4KAMQxpKL2vfHMj0fSvuw7JZcOPCjQC3e7ayssKnaoFVAhbYcW6v41qQ==}
+
   '@vitejs/plugin-vue@6.0.6':
     resolution: {integrity: sha512-u9HHgfrq3AjXlysn0eINFnWQOJQLO9WN6VprZ8FXl7A2bYisv3Hui9Ij+7QZ41F/WYWarHjwBbXtD7dKg3uxbg==}
     engines: {node: ^20.19.0 || >=22.12.0}
@@ -2065,6 +2071,8 @@ snapshots:
       '@typescript-eslint/types': 8.59.1
       eslint-visitor-keys: 5.0.1
 
+  '@vicons/ionicons5@0.13.0': {}
+
   '@vitejs/plugin-vue@6.0.6(vite@8.0.10(@types/node@25.6.0)(jiti@2.6.1)(yaml@2.8.3))(vue@3.5.33(typescript@6.0.3))':
     dependencies:
       '@rolldown/pluginutils': 1.0.0-rc.13
diff --git a/web/src/views/chat/ChatDetailView.vue b/web/src/views/chat/ChatDetailView.vue
index 569bd7f..86695d2 100644
--- a/web/src/views/chat/ChatDetailView.vue
+++ b/web/src/views/chat/ChatDetailView.vue
@@ -14,17 +14,39 @@
           v-for="c in chat.conversations"
           :key="c.id"
           :class="[
-            'p-2 rounded cursor-pointer hover:bg-neutral-100',
+            'group p-2 rounded cursor-pointer hover:bg-neutral-100 flex items-center justify-between gap-2',
             chat.currentConversation?.id === c.id ? 'bg-blue-50' : '',
           ]"
           @click="open(c.id)"
         >
-          <div class="truncate text-sm">
-            {{ c.title || '(未命名)' }}
-          </div>
-          <div class="text-xs text-neutral-400">
-            {{ formatTime(c.updated_at) }}
+          <div class="flex-1 min-w-0">
+            <div class="truncate text-sm">
+              {{ c.title || '(未命名)' }}
+            </div>
+            <div class="text-xs text-neutral-400">
+              {{ formatTime(c.updated_at) }}
+            </div>
           </div>
+          <NPopconfirm
+            :show-icon="false"
+            @positive-click="chat.deleteConversation(c.id)"
+          >
+            <template #trigger>
+              <NButton
+                text
+                size="tiny"
+                class="opacity-0 group-hover:opacity-100 transition-opacity"
+                @click.stop
+              >
+                <template #icon>
+                  <NIcon><TrashOutline /></NIcon>
+                </template>
+              </NButton>
+            </template>
+            <template #default>
+              删除后无法恢复，确定删除此会话？
+            </template>
+          </NPopconfirm>
         </div>
         <div
           v-if="chat.conversations.length === 0"
@@ -43,6 +65,28 @@
           选择或新建会话
         </div>
         <template v-else>
+          <!-- 头部操作栏 -->
+          <div class="border-b px-4 py-2 flex items-center justify-between">
+            <div class="text-sm font-medium truncate flex-1">
+              {{ chat.currentConversation.title || '(未命名)' }}
+            </div>
+            <NPopconfirm
+              :show-icon="false"
+              @positive-click="deleteCurrentConversation"
+            >
+              <template #trigger>
+                <NButton text size="small">
+                  <template #icon>
+                    <NIcon><TrashOutline /></NIcon>
+                  </template>
+                  删除
+                </NButton>
+              </template>
+              <template #default>
+                删除后无法恢复，确定删除此会话？
+              </template>
+            </NPopconfirm>
+          </div>
           <div
             ref="scrollEl"
             class="flex-1 overflow-y-auto p-4 space-y-3"
@@ -101,7 +145,8 @@
 <script setup lang="ts">
 import { computed, nextTick, onMounted, ref, watch } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
-import { NButton, NInput } from 'naive-ui'
+import { NButton, NInput, NPopconfirm, NIcon } from 'naive-ui'
+import { TrashOutline } from '@vicons/ionicons5'
 
 import AppShell from '@/layouts/AppShell.vue'
 import { useChatStore } from '@/stores/chat'
@@ -206,6 +251,15 @@ async function onCreated(id: string) {
   await open(id)
 }
 
+async function deleteCurrentConversation() {
+  const id = chat.currentConversation?.id
+  if (!id) return
+  await chat.deleteConversation(id)
+  await router.replace({
+    path: projectId.value ? `/projects/${projectId.value}/chat` : `/chat`,
+  })
+}
+
 function formatTime(iso: string) {
   return new Date(iso).toLocaleString('zh-CN', { hour12: false })
 }