feat：语音对话优化

frontend/src/components/ChatPanel/index.tsx

@@ -13,6 +13,9 @@ interface ChatPanelProps {
   messages: ChatMessage[];
   currentReply?: string;
   connectionStatus: ConnectionStatus;
+  isProcessing?: boolean;
+  isVADReady?: boolean;
+  vadError?: string;
   isMicOn?: boolean;
   isSpeaking?: boolean;
   onSendText?: (text: string) => void;
@@ -34,6 +37,9 @@ export function ChatPanel({
   messages,
   currentReply,
   connectionStatus,
+  isProcessing,
+  isVADReady,
+  vadError,
   isMicOn,
   isSpeaking,
   onSendText,
@@ -144,6 +150,44 @@ export function ChatPanel({
           </div>
         )}
 
+        {/* 连接中状态 */}
+        {connectionStatus === "connecting" && (
+          <div className="system-message system-message--info">
+            <span className="typing-indicator">
+              <span className="typing-indicator__dot" />
+              <span className="typing-indicator__dot" />
+              <span className="typing-indicator__dot" />
+            </span>
+            <span>{t("chat.connecting")}</span>
+          </div>
+        )}
+
+        {/* VAD 初始化中 */}
+        {isConnected && isVADReady === false && !vadError && (
+          <div className="system-message system-message--info">
+            <span className="typing-indicator">
+              <span className="typing-indicator__dot" />
+              <span className="typing-indicator__dot" />
+              <span className="typing-indicator__dot" />
+            </span>
+            <span>{t("chat.vadInit")}</span>
+          </div>
+        )}
+
+        {/* AI 处理中（尚未开始流式输出） */}
+        {isProcessing && !currentReply && (
+          <div className="chat-message chat-message--assistant">
+            <div className="chat-message__role">AI</div>
+            <div className="chat-message__content">
+              <span className="typing-indicator">
+                <span className="typing-indicator__dot" />
+                <span className="typing-indicator__dot" />
+                <span className="typing-indicator__dot" />
+              </span>
+            </div>
+          </div>
+        )}
+
         <div ref={bottomRef} />
       </div>