Agent-n8n/doc/任务/构建12 个DEMO演示.md

#  DuoduoAgent(多多智能体_演示版) - 12个订单班演示构建计划

## 项目概述

### 定义
多多智能体是多多畅职为学生在订单班中提供的AI助手，帮助学生快速弥补与企业岗位需求之间的技能差距，实现精准就业对接。

### 核心价值
- 🎯 **精准匹配**: 根据不同行业订单班的特点，定制化AI智能体能力
- 🚀 **快速成长**: 通过智能体协作，加速学生技能提升
- 💼 **就业导向**: 直接对接企业需求，提高就业成功率

## 当前进度状态

### ✅ 已完成（1/12）
- **文旅订单班**: 完整的演示系统（展会策划案例）
  - n8n工作流可视化
  - 7个专业AI Agent协作
  - 完整的前端展示页面

### 📝 文档已准备（11/12）✨ **[更新于2025-09-28]**
在 `doc/notion文档资料/` 目录下，所有订单班文案已全部准备完成：

#### 已有完整文案的订单班：
1. **财经商贸**: 化妆品电商全链路运营一体化方案
2. **食品**: 中高端个性化轻食店铺经营方案
3. **智能开发**: 在线教育平台开发项目
4. **智能制造**: 物流输送线节拍优化的PLC与机器人联合调试
5. **视觉设计**: 同里农文旅宣传片策划案
6. **交通物流**: 某冷链智慧共配中心"百车级"AGV全局交通管制与充电调度系统设计
7. **土木水利**: 宁川市滨河防洪堤加固及生态修复工程（一期）投标方案
8. **大健康**: 心理咨询实务中的AI辅助建议方案
9. **能源**: 光伏晶硅电池片印后AOI检测与分拣单元
10. **化工**: 半导体材料综合检测方案拟定与分析报告撰写
11. **环保**: 某地表水环境质量考核断面水质采样方案撰写

### ⏳ 待开发演示系统（11/12）
需要基于已有文案开发演示系统的订单班

## 项目技术架构 ✨ **[更新于2025-09-28]**

### 统一架构方案（单项目多订单班）
```
2025-09-08_n8nDEMO演示/
├── n8n-n8n-1.109.2/           # n8n工作流引擎（中文版）
├── web_frontend/
│   ├── exhibition-demo/       # 主入口：React智能体执行过程模拟
│   │   ├── src/
│   │   │   ├── data/
│   │   │   │   └── orderClasses.json  # 12个订单班统一配置
│   │   │   ├── components/
│   │   │   │   ├── OrderClassSelector.tsx  # 订单班选择器
│   │   │   │   └── DynamicAgentGrid.tsx   # 动态Agent加载
│   │   │   └── services/
│   │   │       └── dataLoader.ts          # 动态数据加载
│   │   └── public/
│   │       └── agents/                    # Agent头像资源
│   │           ├── 文旅/
│   │           ├── 食品/
│   │           └── ...（12个订单班）
│   └── web_result/           # 结果展示（混合模板方案）
│       ├── index.html        # 统一入口
│       └── templates/        # 各订单班模板
└── doc/
    └── notion文档资料/        # 各订单班素材

```

### 技术栈
- **后端**: n8n工作流引擎 (Node.js + TypeScript)
- **前端演示**: React 18 + TypeScript + Vite + Zustand
- **结果展示**: HTML5 + Tailwind CSS + 动态模板
- **数据存储**: JSON文件（orderClasses.json）
- **运行端口**:
  - n8n: 5678
  - React演示: 4173
  - 结果展示: 静态HTML + URL参数路由

## 12个订单班规划

### 订单班列表与特色定位

| 序号 | 订单班名称 | 状态 | 核心场景 | AI Agent特色 |
|------|------------|------|----------|--------------|
| 1 | 文旅 | ✅ 系统完成 | 展会策划 | 7个协作Agent |
| 2 | 财经商贸 | 📝 文档就绪 | 化妆品电商全链路运营 | 待设计 |
| 3 | 食品 | 📝 文档就绪 | 中高端轻食店铺经营 | 待设计 |
| 4 | 智能开发 | 📝 文档就绪 | 在线教育平台开发 | 待设计 |
| 5 | 智能制造 | 📝 文档就绪 | 物流PLC与机器人调试 | 待设计 |
| 6 | 视觉设计 | 📝 文档就绪 | 农文旅宣传片策划 | 待设计 |
| 7 | 交通物流 | 📝 文档就绪 | AGV交通管制与充电调度 | 待设计 |
| 8 | 土木水利 | 📝 文档就绪 | 防洪堤工程投标方案 | 待设计 |
| 9 | 大健康 | 📝 文档就绪 | 心理咨询AI辅助方案 | 待设计 |
| 10 | 能源 | 📝 文档就绪 | 光伏电池片AOI检测 | 待设计 |
| 11 | 化工 | 📝 文档就绪 | 半导体材料检测分析 | 待设计 |
| 12 | 环保 | 📝 文档就绪 | 地表水质采样方案 | 待设计 |

## 技术实现方案 ✅ **[已确定]**

### 核心技术决策
1. **统一架构**：单一exhibition-demo项目，动态切换12个订单班
2. **数据存储**：JSON文件存储所有配置（避免数据库复杂度）
3. **结果展示**：混合模板方案（基础模板+动态内容）
4. **页面跳转**：URL参数传递订单班信息

### 用户交互流程
```
1. 进入exhibition-demo主页
   ↓
2. 点击"输入需求"按钮
   ↓
3. 显示12个订单班选项（grid grid-cols-1 gap-3）
   ↓
4. 选择订单班后，右侧Agent网格动态更新
   ↓
5. 执行生产流程演示
   ↓
6. 完成后跳转到web_result对应页面
```

### 关键功能实现

#### 1. 订单班选择器
- 位置：RequirementModal组件内
- 布局：grid grid-cols-1 gap-3
- 功能：选择后动态加载对应Agent配置

#### 2. Agent动态加载
- 数据源：orderClasses.json
- 加载时机：选择订单班后
- 显示逻辑：未选择时不显示Agent

#### 3. 结果页面路由
```javascript
// URL参数跳转
window.location.href = `/web_result/?orderClass=food`;

// 可选：sessionStorage存储详细数据
sessionStorage.setItem('resultData', JSON.stringify(data));
```

## 实施计划 ✨ **[更新于2025-09-28]**

### ~~第一阶段：文档准备~~ ✅ **已完成**
- [x] 所有12个订单班文案已全部准备完成
- [x] 每个订单班都有明确的核心场景定义
- [x] 文档统一存放在 `doc/notion文档资料/` 目录

### 第二阶段：系统架构改造 🚀 **当前重点**
基础架构实现（统一入口）：
- [ ] 改造exhibition-demo添加订单班选择器
- [ ] 创建orderClasses.json统一配置文件
- [ ] 实现Agent动态加载机制
- [ ] 开发web_result混合模板系统
- [ ] 实现URL参数跳转逻辑

### 第三阶段：数据准备与配置
Agent数据收集与整理：
- [ ] 从n8n工程提取3个已有订单班Agent配置
- [ ] 设计其余9个订单班的Agent角色
- [ ] 生成所有Agent专家头像（约100个）
- [ ] 准备各订单班的演示数据和文案
- [ ] 配置每个订单班的执行流程

### 第四阶段：批量实施
完成12个订单班配置：
- [ ] **财经商贸**: 化妆品电商运营方案
- [ ] **食品**: 轻食店铺经营方案
- [ ] **智能开发**: 在线教育平台开发
- [ ] **智能制造**: PLC与机器人调试
- [ ] **视觉设计**: 宣传片策划方案
- [ ] **交通物流**: AGV调度系统
- [ ] **土木水利**: 工程投标方案
- [ ] **大健康**: 心理咨询方案
- [ ] **能源**: 光伏质检分析
- [ ] **化工**: 材料检测报告
- [ ] **环保**: 水质监测方案

### 第五阶段：优化与部署
- [ ] 统一启动脚本开发
- [ ] 性能优化和测试
- [ ] 编写使用文档
- [ ] 部署到生产环境

## 成功标准

### 功能要求
- ✅ 12个订单班都有完整的演示系统
- ✅ 每个系统都能展示AI Agent协作过程
- ✅ 生成的结果符合各行业特点
- ✅ 用户体验流畅，视觉效果专业

### 技术要求
- ✅ 一键启动所有服务
- ✅ 部署流程简化到3步以内
- ✅ 支持快速切换不同订单班演示
- ✅ 代码复用率达到80%以上

### 业务要求
- ✅ 能够清晰展示多多智能体的价值
- ✅ 帮助学生理解技能提升路径
- ✅ 支持销售团队的演示需求
- ✅ 可扩展到更多订单班

## 资源需求

### 人力资源
- 前端开发：1-2人
- 内容策划：1人
- UI设计：1人（复用现有设计）
- 测试：1人

### 开发要求
- **无需时间预估**（按实际进度推进）
- **数据驱动开发**（等待Agent数据完整后统一实施）
- **架构优先**（先完成基础架构改造）
- **复用最大化**（基于文旅订单班模板）

## 风险管理

### 主要风险
1. ~~**内容风险**: 订单班缺少素材~~ ✅ **已解决**
   - 所有12个订单班文案已全部准备完成

2. **技术风险**: 部署复杂度增加
   - 缓解措施：早期实施统一部署方案（Docker Compose）

3. **时间风险**: 开发效率问题
   - 缓解措施：使用模板化开发，最大化代码复用

## 下一步行动 🎯

### 待用户提供
1. **Agent数据**：其余11个订单班的Agent配置
   - 每个订单班7-9个专家角色
   - Agent名称、职责、技能描述
   - 输出样例和执行流程

### 准备就绪后执行
1. **架构改造**
   - 改造exhibition-demo添加订单班选择器
   - 创建统一的orderClasses.json配置
   - 实现Agent动态加载逻辑

2. **数据整合**
   - 提取n8n工程中的Agent配置
   - 生成所有Agent头像
   - 准备演示文案和数据

3. **功能实现**
   - 开发web_result混合模板系统
   - 实现URL参数跳转机制
   - 完成12个订单班的完整流程

---

*最后更新：2025-09-28*
*负责人：[待指定]*
*状态：文档准备完成，待开发*