llm结束后, 录音按钮没有归位的问题

src/views/Editor/EnglishSpeaking/composables/useDialogueEngine.ts

@@ -1,4 +1,4 @@
-import { ref, computed, onUnmounted } from 'vue'
+import { ref, reactive, computed, onUnmounted } from 'vue'
 import type { PreviewChatMessage, DialogueAPI, SessionConfig, DialogueReport } from '@/types/englishSpeaking'
 import { MockDialogueAPI, RealDialogueAPI } from '../services/llmService'
 
@@ -47,24 +47,24 @@ export function useDialogueEngine(mode: 'preview' | 'real' = 'preview') {
     if (!sessionId.value || isProcessing.value) return
 
     // Add student message (loading)
-    const studentMsg: PreviewChatMessage = {
+    const studentMsg = reactive<PreviewChatMessage>({
       id: crypto.randomUUID(),
       role: 'student',
       content: '',
       timestamp: new Date(),
       status: 'loading',
       audioBlob,
-    }
+    })
     messages.value.push(studentMsg)
 
     // Add AI message placeholder
-    const aiMsg: PreviewChatMessage = {
+    const aiMsg = reactive<PreviewChatMessage>({
       id: crypto.randomUUID(),
       role: 'ai',
       content: '',
       timestamp: new Date(),
       status: 'loading',
-    }
+    })
 
     currentAbortController = new AbortController()
 
@@ -141,13 +141,13 @@ export function useDialogueEngine(mode: 'preview' | 'real' = 'preview') {
     messages.value.splice(idx, 1)
 
     // Re-add AI placeholder and stream
-    const aiMsg: PreviewChatMessage = {
+    const aiMsg = reactive<PreviewChatMessage>({
       id: crypto.randomUUID(),
       role: 'ai',
       content: '',
       timestamp: new Date(),
       status: 'loading',
-    }
+    })
     messages.value.push(aiMsg)
 
     currentAbortController = new AbortController()
@@ -266,22 +266,22 @@ export function useDialogueEngine(mode: 'preview' | 'real' = 'preview') {
     }
 
     // 立即占位：录音按完成的那一刻 UI 就已经显示学生泡泡 + AI placeholder
-    const studentMsg: PreviewChatMessage = {
+    const studentMsg = reactive<PreviewChatMessage>({
       id: crypto.randomUUID(),
       role: 'student',
       content: '',
       timestamp: new Date(),
       status: 'loading',
-    }
+    })
     messages.value.push(studentMsg)
 
-    const aiMsg: PreviewChatMessage = {
+    const aiMsg = reactive<PreviewChatMessage>({
       id: crypto.randomUUID(),
       role: 'ai',
       content: '',
       timestamp: new Date(),
       status: 'loading',
-    }
+    })
     messages.value.push(aiMsg)
 
     const wsUrl = buildWsUrl('/speak-stream')