feat(aia): Complete AIA V2.0 with universal streaming capabilities

Major Changes: - Add StreamingService with OpenAI Compatible format - Upgrade Chat component V2 with Ant Design X integration - Implement AIA module with 12 intelligent agents - Update API routes to unified /api/v1 prefix - Update system documentation Backend (~1300 lines): - common/streaming: OpenAI Compatible adapter - modules/aia: 12 agents, conversation service, streaming integration - Update route versions (RVW, PKB to v1) Frontend (~3500 lines): - modules/aia: AgentHub + ChatWorkspace (100% prototype restoration) - shared/Chat: AIStreamChat, ThinkingBlock, useAIStream Hook - Update API endpoints to v1 Documentation: - AIA module status guide - Universal capabilities catalog - System overview updates - All module documentation sync Tested: Stream response verified, authentication working Status: AIA V2.0 core completed (85%)
2026-01-14 19:15:01 +08:00
parent 3d35e9c58b
commit 1b53ab9d52
386 changed files with 52096 additions and 65238 deletions
--- a/docs/03-业务模块/AIA-AI智能问答/04-开发计划/03-前端组件设计.md
+++ b/docs/03-业务模块/AIA-AI智能问答/04-开发计划/03-前端组件设计.md
@@ -1,7 +1,7 @@
 # AIA V2.1 å‰<C3A5>ç«¯ç»„ä»¶è®¾è®¡

 > **ç‰ˆæœ¬**ï¼šV2.1  
-> **创建日期**：2026-01-11  
+> **åˆ›å»ºæ—¥æœŸ**ï¼?026-01-11  
 > **æŠ€æœ¯æ ˆ**ï¼šReact 19 + TypeScript 5 + Ant Design 6 + Ant Design X 2.1

 ---
@@ -11,45 +11,45 @@
 ```
 frontend-v2/src/modules/aia/
 â”œâ”€â”€ pages/
-│   ├── Dashboard.tsx              # 智能体大厅（首页）
-│   └── Workspace.tsx              # 对话工作台
+â”?  â”œâ”€â”€ Dashboard.tsx              # æ™ºèƒ½ä½“å¤§åŽ…ï¼ˆé¦–é¡µï¼?
+â”?  â””â”€â”€ Workspace.tsx              # å¯¹è¯<EFBFBD>å·¥ä½œå<EFBFBD>?
 â”œâ”€â”€ components/
-│   ├── AgentPipeline/
-│   │   ├── index.tsx              # 5阶段流水线容器
-│   │   ├── StageColumn.tsx        # 单阶段列
-│   │   └── AgentCard.tsx          # 智能体卡片
-│   ├── IntentSearch/
-│   │   ├── index.tsx              # 意图搜索框
-│   │   └── SuggestionDropdown.tsx # 建议下拉框
-│   ├── ConversationList/
-│   │   ├── index.tsx              # 历史会话列表
-│   │   └── ConversationItem.tsx   # 会话项
-│   ├── MessageList/
-│   │   ├── index.tsx              # 消息列表
-│   │   ├── UserMessage.tsx        # 用户消息
-│   │   ├── AssistantMessage.tsx   # AI回复
-│   │   └── ThinkingBlock.tsx      # 深度思考折叠块
-│   ├── Attachment/
-│   │   ├── AttachmentUpload.tsx   # 附件上传
-│   │   ├── AttachmentCard.tsx     # 附件卡片
-│   │   └── AttachmentPreview.tsx  # 附件预览
-│   ├── SlashCommands/
-│   │   └── index.tsx              # 快捷指令菜单
-│   └── ActionBar/
-│       └── index.tsx              # 结果操作栏
+â”?  â”œâ”€â”€ AgentPipeline/
+â”?  â”?  â”œâ”€â”€ index.tsx              # 5é˜¶æ®µæµ<EFBFBD>æ°´çº¿å®¹å™?
+â”?  â”?  â”œâ”€â”€ StageColumn.tsx        # å<EFBFBD>•é˜¶æ®µåˆ—
+â”?  â”?  â””â”€â”€ AgentCard.tsx          # æ™ºèƒ½ä½“å<EFBFBD>¡ç‰?
+â”?  â”œâ”€â”€ IntentSearch/
+â”?  â”?  â”œâ”€â”€ index.tsx              # æ„<EFBFBD>å›¾æ<EFBFBD>œç´¢æ¡?
+â”?  â”?  â””â”€â”€ SuggestionDropdown.tsx # å»ºè®®ä¸‹æ‹‰æ¡?
+â”?  â”œâ”€â”€ ConversationList/
+â”?  â”?  â”œâ”€â”€ index.tsx              # åŽ†å<EFBFBD>²ä¼šè¯<EFBFBD>åˆ—è¡¨
+â”?  â”?  â””â”€â”€ ConversationItem.tsx   # ä¼šè¯<EFBFBD>é¡?
+â”?  â”œâ”€â”€ MessageList/
+â”?  â”?  â”œâ”€â”€ index.tsx              # æ¶ˆæ<EFBFBD>¯åˆ—è¡¨
+â”?  â”?  â”œâ”€â”€ UserMessage.tsx        # ç”¨æˆ·æ¶ˆæ<EFBFBD>¯
+â”?  â”?  â”œâ”€â”€ AssistantMessage.tsx   # AIå›žå¤<EFBFBD>
+â”?  â”?  â””â”€â”€ ThinkingBlock.tsx      # æ·±åº¦æ€<EFBFBD>è€ƒæŠ˜å<EFBFBD> å<EFBFBD>—
+â”?  â”œâ”€â”€ Attachment/
+â”?  â”?  â”œâ”€â”€ AttachmentUpload.tsx   # é™„ä»¶ä¸Šä¼ 
+â”?  â”?  â”œâ”€â”€ AttachmentCard.tsx     # é™„ä»¶å<EFBFBD>¡ç‰‡
+â”?  â”?  â””â”€â”€ AttachmentPreview.tsx  # é™„ä»¶é¢„è§ˆ
+â”?  â”œâ”€â”€ SlashCommands/
+â”?  â”?  â””â”€â”€ index.tsx              # å¿«æ<EFBFBD>·æŒ‡ä»¤è<EFBFBD>œå<EFBFBD>•
+â”?  â””â”€â”€ ActionBar/
+â”?      â””â”€â”€ index.tsx              # ç»“æžœæ“<EFBFBD>ä½œæ ?
 â”œâ”€â”€ hooks/
-│   ├── useConversation.ts         # 对话管理
-│   ├── useAgents.ts               # 智能体数据
-│   ├── useIntentRouter.ts         # 意图路由
-│   ├── useStreamMessage.ts        # 流式消息
-│   └── useAttachment.ts           # 附件上传
+â”?  â”œâ”€â”€ useConversation.ts         # å¯¹è¯<EFBFBD>ç®¡ç<EFBFBD>†
+â”?  â”œâ”€â”€ useAgents.ts               # æ™ºèƒ½ä½“æ•°æ<EFBFBD>?
+â”?  â”œâ”€â”€ useIntentRouter.ts         # æ„<EFBFBD>å›¾è·¯ç”±
+â”?  â”œâ”€â”€ useStreamMessage.ts        # æµ<EFBFBD>å¼<EFBFBD>æ¶ˆæ<EFBFBD>¯
+â”?  â””â”€â”€ useAttachment.ts           # é™„ä»¶ä¸Šä¼ 
 â”œâ”€â”€ api/
-│   └── index.ts                   # API 封装
+â”?  â””â”€â”€ index.ts                   # API å°<EFBFBD>è£…
 â”œâ”€â”€ types/
-│   └── index.ts                   # TypeScript 类型
+â”?  â””â”€â”€ index.ts                   # TypeScript ç±»åž‹
 â”œâ”€â”€ styles/
-│   ├── dashboard.module.css       # Dashboard 样式
-│   └── workspace.module.css       # Workspace 样式
+â”?  â”œâ”€â”€ dashboard.module.css       # Dashboard æ ·å¼<EFBFBD>
+â”?  â””â”€â”€ workspace.module.css       # Workspace æ ·å¼<EFBFBD>
 â””â”€â”€ index.tsx                      # æ¨¡å<C2A1>—å…¥å<C2A5>£ + è·¯ç”±
 ```

@@ -68,7 +68,7 @@ frontend-v2/src/modules/aia/
  --stage-write: #F59E0B;      /* æ©™è‰² - è®ºæ–‡æ’°å†™ */
  --stage-publish: #EF4444;    /* çº¢è‰² - æˆ<C3A6>æžœå<C593>‘å¸ƒ */
  
-  /* 功能色 */
+  /* åŠŸèƒ½è‰?*/
  --ai-assistant: #6366F1;     /* AIåŠ©æ‰‹ä¸»è‰² */
  --thinking-bg: #F3F4F6;      /* æ€<C3A6>è€ƒå<C692>—èƒŒæ™¯ */
  --thinking-border: #E5E7EB;  /* æ€<C3A6>è€ƒå<C692>—è¾¹æ¡† */
@@ -108,7 +108,7 @@ frontend-v2/src/modules/aia/

 ## ðŸ“„ é¡µé<C2B5>¢è®¾è®¡

-### 1. Dashboard（智能体大厅）
+### 1. Dashboardï¼ˆæ™ºèƒ½ä½“å¤§åŽ…ï¼?

 ```tsx
 // pages/Dashboard.tsx
@@ -119,7 +119,7 @@ import { AgentPipeline } from '../components/AgentPipeline';
 export const Dashboard: React.FC = () => {
  return (
    <div className={styles.dashboard}>
-      {/* 顶部意图搜索框 */}
+      {/* é¡¶éƒ¨æ„<EFBFBD>å›¾æ<EFBFBD>œç´¢æ¡?*/}
      <header className={styles.header}>
        <h1>AI æ™ºèƒ½åŠ©æ‰‹</h1>
        <p>æœ‰ä»€ä¹ˆå<EFBFBD>¯ä»¥å¸®åŠ©æ‚¨çš„ï¼Ÿ</p>
@@ -135,14 +135,14 @@ export const Dashboard: React.FC = () => {
 };
 ```

-**布局特点**：
+**å¸ƒå±€ç‰¹ç‚¹**ï¼?
 - é¡¶éƒ¨å±…ä¸å¤§æ<C2A7>œç´¢æ¡†
- 5阶段流水线横向平铺（桌面）/ 纵向滚动（移动）
- Gemini 风格大留白
+- 5é˜¶æ®µæµ<EFBFBD>æ°´çº¿æ¨ªå<EFBFBD>‘å¹³é“ºï¼ˆæ¡Œé<EFBFBD>¢ï¼? çºµå<C2B5>‘æ»šåŠ¨ï¼ˆç§»åŠ¨ï¼‰
+- Gemini é£Žæ ¼å¤§ç•™ç™?

 ---

-### 2. Workspace（对话工作台）
+### 2. Workspaceï¼ˆå¯¹è¯<EFBFBD>å·¥ä½œå<EFBFBD>°ï¼?

 ```tsx
 // pages/Workspace.tsx
@@ -201,7 +201,7 @@ export const Workspace: React.FC = () => {

 ## ðŸ§© ç»„ä»¶è¯¦ç»†è®¾è®¡

-### 1. AgentPipeline（5阶段流水线）
+### 1. AgentPipelineï¼?é˜¶æ®µæµ<C3A6>æ°´çº¿ï¼‰

 ```tsx
 // components/AgentPipeline/index.tsx
@@ -238,7 +238,7 @@ export const AgentPipeline: React.FC<AgentPipelineProps> = ({ onAgentClick }) =>
 };
 ```

-**样式特点**：
+**æ ·å¼<EFBFBD>ç‰¹ç‚¹**ï¼?
 ```css
 .pipeline {
  display: flex;
@@ -258,7 +258,7 @@ export const AgentPipeline: React.FC<AgentPipelineProps> = ({ onAgentClick }) =>

 ---

-### 2. IntentSearch（意图搜索框）
+### 2. IntentSearchï¼ˆæ„<EFBFBD>å›¾æ<EFBFBD>œç´¢æ¡†ï¼?

 ```tsx
 // components/IntentSearch/index.tsx
@@ -307,14 +307,14 @@ export const IntentSearch: React.FC = () => {

 ---

-### 3. ThinkingBlock（深度思考折叠块）
+### 3. ThinkingBlockï¼ˆæ·±åº¦æ€<EFBFBD>è€ƒæŠ˜å<EFBFBD> å<EFBFBD>—ï¼?

 ```tsx
 // components/MessageList/ThinkingBlock.tsx

 interface ThinkingBlockProps {
  content: string;
-  duration?: number;  // 思考耗时（秒）
+  duration?: number;  // æ€<EFBFBD>è€ƒè€—æ—¶ï¼ˆç§’ï¼?
  isStreaming?: boolean;  // æ˜¯å<C2AF>¦æ£åœ¨ç”Ÿæˆ<C3A6>
 }

@@ -328,7 +328,7 @@ export const ThinkingBlock: React.FC<ThinkingBlockProps> = ({
  
  useEffect(() => {
    if (!isStreaming && expanded) {
-      // 完成后 1.5s 自动收起
+      // å®Œæˆ<EFBFBD>å<EFBFBD>?1.5s è‡ªåŠ¨æ”¶èµ·
      const timer = setTimeout(() => setExpanded(false), 1500);
      return () => clearTimeout(timer);
    }
@@ -344,7 +344,7 @@ export const ThinkingBlock: React.FC<ThinkingBlockProps> = ({
          {isStreaming ? <LoadingOutlined spin /> : <BulbOutlined />}
        </span>
        <span className={styles.title}>
-          {isStreaming ? '正在深度思考...' : `已深度思考 (耗时 ${duration?.toFixed(1)}s)`}
+          {isStreaming ? 'æ£åœ¨æ·±åº¦æ€<EFBFBD>è€?..' : `å·²æ·±åº¦æ€<EFBFBD>è€?(è€—æ—¶ ${duration?.toFixed(1)}s)`}
        </span>
        <span className={styles.expandIcon}>
          {expanded ? <UpOutlined /> : <DownOutlined />}
@@ -363,7 +363,7 @@ export const ThinkingBlock: React.FC<ThinkingBlockProps> = ({
 };
 ```

-**样式**：
+**æ ·å¼<EFBFBD>**ï¼?
 ```css
 .thinkingBlock {
  background: var(--thinking-bg);
@@ -412,18 +412,18 @@ export const AttachmentUpload: React.FC<AttachmentUploadProps> = ({
  
  const handleUpload = async (file: File) => {
    if (attachments.length >= maxCount) {
-      message.error(`最多上传 ${maxCount} 个附件`);
+      message.error(`æœ€å¤šä¸Šä¼?${maxCount} ä¸ªé™„ä»¶`);
      return false;
    }
    
    // æ–‡ä»¶ç±»åž‹æ ¡éªŒ
    const allowedTypes = ['application/pdf', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document', 'text/plain', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'];
    if (!allowedTypes.includes(file.type)) {
-      message.error('仅支持 PDF、Word、TXT、Excel 文件');
+      message.error('ä»…æ”¯æŒ?PDFã€<C3A3>Wordã€<C3A3>TXTã€<C3A3>Excel æ–‡ä»¶');
      return false;
    }
    
-    // 文件大小校验（20MB）
+    // æ–‡ä»¶å¤§å°<EFBFBD>æ ¡éªŒï¼?0MBï¼?
    if (file.size > 20 * 1024 * 1024) {
      message.error('æ–‡ä»¶å¤§å°<C3A5>ä¸<C3A4>èƒ½è¶…è¿‡ 20MB');
      return false;
@@ -448,7 +448,7 @@ export const AttachmentUpload: React.FC<AttachmentUploadProps> = ({
        </Button>
      </Upload>
      
-      {/* 已上传附件列表 */}
+      {/* å·²ä¸Šä¼ é™„ä»¶åˆ—è¡?*/}
      <div className={styles.attachmentList}>
        {attachments.map(att => (
          <AttachmentCard
@@ -483,10 +483,10 @@ interface SlashCommandsProps {
 }

 const commands: SlashCommand[] = [
-  { key: 'polish', icon: '✨', label: '润色', description: '优化文本表达' },
+  { key: 'polish', icon: 'âœ?, label: 'æ¶¦è‰²', description: 'ä¼˜åŒ–æ–‡æœ¬è¡¨è¾¾' },
  { key: 'expand', icon: 'ðŸ“<EFBFBD>', label: 'æ‰©å†™', description: 'æ‰©å±•å†…å®¹ç»†èŠ‚' },
  { key: 'translate', icon: 'ðŸŒ<EFBFBD>', label: 'ç¿»è¯‘', description: 'ä¸è‹±äº’è¯‘' },
-  { key: 'export', icon: '📄', label: '导出Word', description: '导出为 Word 文档' },
+  { key: 'export', icon: 'ðŸ“„', label: 'å¯¼å‡ºWord', description: 'å¯¼å‡ºä¸?Word æ–‡æ¡£' },
 ];

 export const SlashCommands: React.FC<SlashCommandsProps> = ({
@@ -544,7 +544,7 @@ export const SlashCommands: React.FC<SlashCommandsProps> = ({

 ---

-### 6. ActionBar（结果操作栏）
+### 6. ActionBarï¼ˆç»“æžœæ“<EFBFBD>ä½œæ <EFBFBD>ï¼?

 ```tsx
 // components/ActionBar/index.tsx
@@ -623,7 +623,7 @@ export function useConversation(conversationId?: string): UseConversationReturn
    }
  }, [conversationId]);
  
-  // 发送消息（流式）
+  // å<EFBFBD>‘é€<EFBFBD>æ¶ˆæ<EFBFBD>¯ï¼ˆæµ<EFBFBD>å¼<EFBFBD>ï¼?
  const sendMessage = async (content: string, attachmentIds?: string[]) => {
    setIsLoading(true);
    
@@ -637,7 +637,7 @@ export function useConversation(conversationId?: string): UseConversationReturn
    };
    setMessages(prev => [...prev, userMessage]);
    
-    // 初始化 AI 消息
+    // åˆ<EFBFBD>å§‹åŒ?AI æ¶ˆæ<CB86>¯
    const aiMessage: Message = {
      id: `temp-ai-${Date.now()}`,
      role: 'assistant',
@@ -769,7 +769,7 @@ export function useStreamMessage() {

 ---

-## 📱 响应式设计
+## ðŸ“± å“<C3A5>åº”å¼<C3A5>è®¾è®?

 ### æ–ç‚¹ç–ç•¥

@@ -783,19 +783,19 @@ const breakpoints = {
 };
 ```

-### Dashboard 响应式
+### Dashboard å“<EFBFBD>åº”å¼?

 | æ–ç‚¹ | å¸ƒå±€ |
 |------|------|
 | `< 768px` | æµ<C3A6>æ°´çº¿çºµå<C2B5>‘æ»šåŠ¨ï¼Œå<C592>¡ç‰‡å<E280A1>•åˆ— |
-| `≥ 768px` | 流水线横向 5 列 |
+| `â‰?768px` | æµ<EFBFBD>æ°´çº¿æ¨ªå<EFBFBD>?5 åˆ?|

-### Workspace 响应式
+### Workspace å“<EFBFBD>åº”å¼?

 | æ–ç‚¹ | å¸ƒå±€ |
 |------|------|
 | `< 768px` | ä¾§è¾¹æ <C3A6>éš<C3A9>è—<C3A8>ï¼ˆæŠ½å±‰æ»‘å‡ºï¼‰ï¼Œè¾“å…¥æ¡†é”®ç›˜é€‚é…<C3A9> |
-| `≥ 768px` | 侧边栏固定显示 240px |
+| `â‰?768px` | ä¾§è¾¹æ <EFBFBD>å›ºå®šæ˜¾ç¤?240px |

 ---

@@ -883,3 +883,4 @@ export interface SlashCommand {



+