Upload 62 files

ai-routes.js

@@ -373,6 +373,8 @@ router.post('/chat', checkAIAccess, async (req, res) => {
         }, res);
 
         if (answerText) {
+            // Signal that text generation is done and TTS is starting
+            res.write(`data: ${JSON.stringify({ status: 'tts' })}\n\n`);
             try {
                 const { GoogleGenAI } = await import("@google/genai");
                 const keys = await getKeyPool('gemini');
@@ -487,4 +489,4 @@ router.post('/evaluate', checkAIAccess, async (req, res) => {
     }
 });
 
-module.exports = router;
+module.exports = router;

components/ai/ChatPanel.tsx

@@ -34,6 +34,7 @@ export const ChatPanel: React.FC<ChatPanelProps> = ({ currentUser }) => {
     const [inputMode, setInputMode] = useState<'text' | 'audio'>('text');
     const [isChatProcessing, setIsChatProcessing] = useState(false);
     const [isChatRecording, setIsChatRecording] = useState(false);
+    const [generatingAudioId, setGeneratingAudioId] = useState<string | null>(null);
     const [toast, setToast] = useState<ToastState>({ show: false, message: '', type: 'success' });
 
     const mediaRecorderRef = useRef<MediaRecorder | null>(null);
@@ -68,7 +69,7 @@ export const ChatPanel: React.FC<ChatPanelProps> = ({ currentUser }) => {
     // Scroll to bottom
     useEffect(() => {
         messagesEndRef.current?.scrollIntoView({ behavior: isChatProcessing ? 'auto' : 'smooth', block: 'end' });
-    }, [messages, isChatProcessing]);
+    }, [messages, isChatProcessing, generatingAudioId]);
 
     const stopPlayback = () => {
         if (currentSourceRef.current) {
@@ -152,6 +153,8 @@ export const ChatPanel: React.FC<ChatPanelProps> = ({ currentUser }) => {
     const handleChatSubmit = async (text?: string, audioBase64?: string) => {
         if (!text && !audioBase64) return;
         stopPlayback();
+        setGeneratingAudioId(null);
+        
         const historyPayload = messages.filter(m => m.id !== 'welcome').map(m => ({ role: m.role, text: m.text }));
         
         const newUserMsg: AIChatMessage = { 
@@ -206,19 +209,27 @@ export const ChatPanel: React.FC<ChatPanelProps> = ({ currentUser }) => {
                         if (jsonStr === '[DONE]') break;
                         try {
                             const data = JSON.parse(jsonStr);
+                            
+                            if (data.status === 'tts') {
+                                setGeneratingAudioId(newAiMsgId);
+                            }
+
                             if (data.text) {
                                 aiTextAccumulated += data.text;
                                 setMessages(prev => prev.map(m => m.id === newAiMsgId ? { ...m, text: aiTextAccumulated } : m));
                             }
                             if (data.audio) {
+                                setGeneratingAudioId(null);
                                 setMessages(prev => prev.map(m => m.id === newAiMsgId ? { ...m, audio: data.audio } : m));
                                 playPCMAudio(data.audio);
                             }
                             if (data.ttsSkipped) {
+                                setGeneratingAudioId(null);
                                 setToast({ show: true, message: 'AI 语音额度已用尽，已切换至本地语音播报', type: 'error' });
                                 speakWithBrowser(aiTextAccumulated);
                             }
                             if (data.error) {
+                                setGeneratingAudioId(null);
                                 setMessages(prev => prev.map(m => m.id === newAiMsgId ? { ...m, text: `⚠️ 错误: ${data.message || '未知错误'}` } : m));
                             }
                         } catch (e) {}
@@ -227,7 +238,10 @@ export const ChatPanel: React.FC<ChatPanelProps> = ({ currentUser }) => {
             }
         } catch (error: any) {
             setMessages(prev => prev.map(m => m.id === newAiMsgId ? { ...m, text: '抱歉，连接断开或发生错误，请重试。' } : m));
-        } finally { setIsChatProcessing(false); }
+        } finally { 
+            setIsChatProcessing(false); 
+            setGeneratingAudioId(null);
+        }
     };
 
     const clearHistory = () => {
@@ -258,7 +272,16 @@ export const ChatPanel: React.FC<ChatPanelProps> = ({ currentUser }) => {
                         <div className={`max-w-[80%] p-3 rounded-2xl text-sm overflow-hidden ${msg.role === 'user' ? 'bg-blue-600 text-white rounded-tr-none' : 'bg-white border border-gray-200 text-gray-800 rounded-tl-none shadow-sm'}`}>
                             <div className="markdown-body"><ReactMarkdown remarkPlugins={[remarkGfm]}>{msg.text || ''}</ReactMarkdown></div>
                             {msg.role === 'model' && !msg.text && isChatProcessing && <div className="flex items-center gap-2 text-gray-400 py-1"><Loader2 className="animate-spin" size={14}/><span className="text-xs">思考中...</span></div>}
-                            {msg.audio ? (<button onClick={() => playPCMAudio(msg.audio!)} className="mt-2 flex items-center gap-2 text-xs bg-blue-50 text-blue-600 px-3 py-1.5 rounded-full hover:bg-blue-100 border border-blue-100 transition-colors w-fit"><Volume2 size={14}/> 播放语音 (AI)</button>) : (msg.role === 'model' && msg.text && !isChatProcessing) && (<button onClick={() => speakWithBrowser(msg.text!)} className="mt-2 flex items-center gap-2 text-xs bg-gray-50 text-gray-600 px-3 py-1.5 rounded-full hover:bg-gray-100 border border-gray-200 transition-colors w-fit"><Volume2 size={14}/> 朗读 (本地)</button>)}
+                            
+                            {/* Audio Generating Indicator */}
+                            {msg.id === generatingAudioId && (
+                                <div className="flex items-center gap-2 text-purple-600 py-2 animate-pulse mt-1 border-t border-purple-100 pt-2">
+                                    <Loader2 className="animate-spin" size={14}/>
+                                    <span className="text-xs font-bold">正在生成语音回复...</span>
+                                </div>
+                            )}
+
+                            {msg.audio ? (<button onClick={() => playPCMAudio(msg.audio!)} className="mt-2 flex items-center gap-2 text-xs bg-blue-50 text-blue-600 px-3 py-1.5 rounded-full hover:bg-blue-100 border border-blue-100 transition-colors w-fit"><Volume2 size={14}/> 播放语音 (AI)</button>) : (msg.role === 'model' && msg.text && !isChatProcessing && !generatingAudioId) && (<button onClick={() => speakWithBrowser(msg.text!)} className="mt-2 flex items-center gap-2 text-xs bg-gray-50 text-gray-600 px-3 py-1.5 rounded-full hover:bg-gray-100 border border-gray-200 transition-colors w-fit"><Volume2 size={14}/> 朗读 (本地)</button>)}
                         </div>
                     </div>
                 ))}