From a847d918865509c3045241bf0bccd2581763dafa Mon Sep 17 00:00:00 2001
From: ViperEkura <3081035982@qq.com>
Date: Thu, 26 Mar 2026 17:43:06 +0800
Subject: [PATCH] =?UTF-8?q?chore:=E4=BC=98=E5=8C=96=E4=B9=A6=E7=AD=BE?=
 =?UTF-8?q?=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/App.vue                     |  3 ++-
 frontend/src/components/ChatView.vue     | 11 +----------
 frontend/src/components/MessageNav.vue   | 24 ++++++++++++------------
 frontend/src/components/ProcessBlock.vue |  6 +++---
 4 files changed, 18 insertions(+), 26 deletions(-)

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 038ef0a..52e8af1 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -57,7 +57,7 @@
 </template>
 
 <script setup>
-import { ref, shallowRef, computed, onMounted, defineAsyncComponent, triggerRef } from 'vue'
+import { ref, shallowRef, computed, onMounted, defineAsyncComponent } from 'vue'
 import Sidebar from './components/Sidebar.vue'
 import ChatView from './components/ChatView.vue'
 
@@ -249,6 +249,7 @@ function createStreamCallbacks(convId, { updateConvList = true } = {}) {
   return {
     onThinkingStart() {
       updateStreamField(convId, 'streamThinking', streamThinking, '')
+      updateStreamField(convId, 'streamContent', streamContent, '')
     },
     onThinking(text) {
       updateStreamField(convId, 'streamThinking', streamThinking, prev => (prev || '') + text)
diff --git a/frontend/src/components/ChatView.vue b/frontend/src/components/ChatView.vue
index fed9efa..de33f8f 100644
--- a/frontend/src/components/ChatView.vue
+++ b/frontend/src/components/ChatView.vue
@@ -174,21 +174,12 @@ function scrollToMessage(msgId) {
     if (!scrollContainer.value) return
     const el = scrollContainer.value.querySelector(`[data-msg-id="${msgId}"]`)
     if (el) {
-      el.scrollIntoView({ behavior: 'smooth', block: 'center' })
+      el.scrollIntoView({ behavior: 'smooth', block: 'start' })
       activeMessageId.value = msgId
     }
   })
 }
 
-function scrollToBottom(smooth = true) {
-  nextTick(() => {
-    const el = scrollContainer.value
-    if (el) {
-      el.scrollTo({ top: el.scrollHeight, behavior: smooth ? 'smooth' : 'instant' })
-    }
-  })
-}
-
 // 流式时使用 instant 滚动，避免 smooth 动画与内容增长互相打架造成抖动
 watch([() => props.messages.length, () => props.streamingContent], () => {
   nextTick(() => {
diff --git a/frontend/src/components/MessageNav.vue b/frontend/src/components/MessageNav.vue
index 6d8075a..4d4ce3d 100644
--- a/frontend/src/components/MessageNav.vue
+++ b/frontend/src/components/MessageNav.vue
@@ -2,27 +2,31 @@
   <Teleport to="body">
     <div v-if="messages.length > 0" class="bookmark-rail">
       <div
-        v-for="(msg, idx) in messages"
+        v-for="msg in userMessages"
         :key="msg.id"
         class="bookmark"
-        :class="{ active: activeId === msg.id, user: msg.role === 'user' }"
+        :class="{ active: activeId === msg.id }"
         @click="$emit('scrollTo', msg.id)"
       >
         <div class="bookmark-dot"></div>
-        <div class="bookmark-label">{{ msg.role === 'user' ? '用户' : 'Claw' }} · {{ preview(msg) }}</div>
+        <div class="bookmark-label">{{ preview(msg) }}</div>
       </div>
     </div>
   </Teleport>
 </template>
 
 <script setup>
-defineProps({
+import { computed } from 'vue'
+
+const props = defineProps({
   messages: { type: Array, required: true },
   activeId: { type: String, default: null },
 })
 
 defineEmits(['scrollTo'])
 
+const userMessages = computed(() => props.messages.filter(m => m.role === 'user'))
+
 function preview(msg) {
   if (!msg.text) return '...'
   const clean = msg.text.replace(/[#*`~>\-\[\]()]/g, '').replace(/\s+/g, ' ').trim()
@@ -84,19 +88,15 @@ function preview(msg) {
 }
 
 .bookmark-dot {
-  width: 4px;
-  height: 4px;
-  border-radius: 50%;
+  width: 5px;
+  height: 5px;
+  border-radius: 1.5px;
   flex-shrink: 0;
-  background: var(--text-tertiary);
+  background: #3b82f6;
   opacity: 0.35;
   transition: all 0.2s ease;
 }
 
-.bookmark.user .bookmark-dot {
-  background: #3b82f6;
-}
-
 .bookmark.active .bookmark-dot,
 .bookmark-rail:hover .bookmark-dot {
   opacity: 1;
diff --git a/frontend/src/components/ProcessBlock.vue b/frontend/src/components/ProcessBlock.vue
index b2d65c8..4ce21cb 100644
--- a/frontend/src/components/ProcessBlock.vue
+++ b/frontend/src/components/ProcessBlock.vue
@@ -158,10 +158,10 @@ const processItems = computed(() => {
       }
     }
 
-    // 流式中追加正在增长的文本（仅当最后步骤不是 text 类型时）
+    // 流式中追加正在增长的文本（仅当还没有 text 类型的步骤时）
     if (props.streaming && props.streamingContent) {
-      const lastStep = items[items.length - 1]
-      if (!lastStep || lastStep.type !== 'text') {
+      const hasTextStep = items.some(it => it.type === 'text')
+      if (!hasTextStep) {
         items.push({
           type: 'text',
           content: props.streamingContent,