p2-mcp-schema-error-step-enhancements

frontend/src/pages/front/ChatPage.css

@@ -1779,3 +1779,8 @@ html.dark .ai-sending-timeout {
   width: 16px;
   height: 16px;
 }
+
+.ai-process-running { animation: aiPulse 1.5s ease-in-out infinite; }
+@keyframes aiPulse { 0%,100% { opacity: 1; } 50% { opacity: 0.6; } }
+.ai-process-error { background: rgba(255,0,0,0.05); border-left: 2px solid #e74c3c; }
+.ai-process-running { border-left: 2px solid #3498db; }

frontend/src/pages/front/ChatPage.tsx

@@ -531,18 +531,41 @@ const AiProcessBlock: React.FC<{ steps: any[]; autoExpand: boolean }> = ({ steps
         AI 思考 / 执行过程（{steps.length} 步 — {open ? '自动收拢中... 点击手动收起' : '点击展开查看'}）
       </summary>
       <div className="ai-process-list">
-        {steps.map((s: any, i: number) => (
-          <div key={i} className={`ai-process-item ai-process-${s.type}`}>
-            <span className="ai-process-ico">
-              {s.type === 'thinking' ? '💡' : s.type === 'skill' ? '🛠' : '🔌'}
-            </span>
+        {steps.map((s: any, i: number) => {
+          const isLast = i === steps.length - 1;
+          const hasResult = s.result && s.result.length > 0;
+          const isError = hasResult && (s.result.includes('error') || s.result.includes('失败') || s.result.includes('异常') || s.result.includes('拦截'));
+          const isRunning = isLast && !hasResult;
+          const stepIcon = s.type === 'thinking' ? '💡' : s.type === 'skill' ? '🛠' : '🔌';
+          const statusIcon = isRunning ? ' ⏳' : isError ? ' ❌' : hasResult ? ' ✅' : '';
+          const resultDisplay = (s.result || '').length > 400 ? (s.result || '').slice(0, 400) + '...' : (s.result || '');
+          
+          return (
+          <div key={i} className={`ai-process-item ai-process-${s.type}${isRunning ? ' ai-process-running' : ''}${isError ? ' ai-process-error' : ''}`}>
+            <span className="ai-process-ico">{stepIcon}{statusIcon}</span>
             <div className="ai-process-body">
               {s.type === 'thinking' && (<><b className="ai-process-title">思考</b><p className="ai-process-text">{s.text}</p></>)}
-              {s.type === 'skill' && (<><b className="ai-process-title">调用技能：{s.name}</b><p className="ai-process-text">{(s.result || '').slice(0, 400)}</p></>)}
-              {s.type === 'mcp' && (<><b className="ai-process-title">MCP · {s.server}：{s.name}</b><p className="ai-process-text">{(s.result || '').slice(0, 400)}</p></>)}
+              {s.type === 'skill' && (<>
+                <b className="ai-process-title">调用技能：{s.name}{statusIcon}</b>
+                {s.args && Object.keys(s.args).length > 0 && (
+                  <span style={{fontSize:'12px',color:'#666',margin:'2px 0',display:'block'}}>
+                    参数: {JSON.stringify(s.args).slice(0, 200)}
+                  </span>
+                )}
+                {hasResult && <p className="ai-process-text">{resultDisplay}</p>}
+              </>)}
+              {s.type === 'mcp' && (<>
+                <b className="ai-process-title">MCP · {s.server}：{s.name}{statusIcon}</b>
+                {s.args && Object.keys(s.args).length > 0 && (
+                  <span style={{fontSize:'12px',color:'#666',margin:'2px 0',display:'block'}}>
+                    参数: {JSON.stringify(s.args).slice(0, 200)}
+                  </span>
+                )}
+                {hasResult && <p className="ai-process-text">{resultDisplay}</p>}
+              </>)}
             </div>
           </div>
-        ))}
+        )})}
       </div>
     </details>
   );