Files
n8n_Demo/web_frontend/web_result/README.md
Yep_Q 3b8cb3c568 feat: 完成能源订单班图片重命名和文档整理
详细说明:
- 能源订单班: 重命名7个图片文件为描述性中文名称
- 能源订单班: 更新markdown文档中的所有图片引用
- 智能开发订单班: 优化图片命名结构
- 化工订单班: 整理图片资源
- 新增SuperDesign食品订单班设计迭代文件
- 新增能源订单班终端模拟数据(energy.ts)
- 清理web_frontend冗余文档

图片重命名映射:
- Whisk_1ebf7115ee180218c354deb8bff7f3eddr.jpg → 光伏面板室外场景图片.jpg
- Whisk_582dc133200b175859e4b322295fb3d1dr.jpg → 光伏面板生成画面.jpg
- image.jpg → PLC示意图.jpg
- Whisk_b35aa11c60670e38bea44dcd9fe7df5fdr.jpg → 工业机器人图片.jpg
- Whisk_028f4b832e3496db8814cd48f050ec03dr.jpg → 机器视觉相机图片.jpg
- Whisk_eb381c66f5156a4a74f49102095ae534dr.jpg → 输送与治具.jpg
- Mermaid_Chart[...].jpg → Mermaid流程图.jpg

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-10-01 22:06:59 +08:00

199 lines
6.8 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

# 订单班AI生成方案展示系统
## 📁 项目结构
```
web_result/
├── order-classes/ # 12个订单班独立文件夹
│ ├── wenlu/ # 文旅订单班(已完成)
│ │ ├── index.html # 主页
│ │ ├── overview.html # 项目概览
│ │ ├── exhibition.html# 展会设计
│ │ ├── marketing.html # 市场营销
│ │ ├── operation.html # 运营管理
│ │ ├── budget.html # 财务预算
│ │ ├── risk.html # 风险控制
│ │ ├── css/ # 专属CSS文件
│ │ ├── js/ # 专属JS文件
│ │ └── data/ # 专属数据资源
│ │
│ ├── food/ # 食品订单班(已完成)
│ │ ├── index.html # 轻食店铺经营方案
│ │ ├── css/ # 专属CSS文件
│ │ ├── js/ # 专属JS文件
│ │ └── data/ # 专属数据资源
│ │
│ ├── caijing/ # 财经商贸订单班(待开发)
│ ├── jiankang/ # 大健康订单班(待开发)
│ ├── huagong/ # 化工订单班(待开发)
│ ├── huanbao/ # 环保订单班(待开发)
│ ├── jiaotong/ # 交通物流订单班(待开发)
│ ├── nengyuan/ # 能源订单班(终端模拟已完成,网页待开发)
│ ├── shijue/ # 视觉设计订单班(待开发)
│ ├── tumu/ # 土木订单班(待开发)
│ ├── zhineng-dev/ # 智能开发订单班(待开发)
│ └── zhineng-mfg/ # 智能制造订单班(待开发)
├── app.js # Node.js Express服务器
├── routes.yaml # 路由配置文件
├── package.json # 项目依赖配置
├── start-router.sh # 启动脚本
└── README.md # 项目说明文档
```
## 🚀 快速启动
### 1. 安装依赖
```bash
npm install
```
### 2. 启动服务器
```bash
./start-router.sh
# 或
node app.js
```
### 3. 访问地址端口4155
- 首页http://localhost:4155/
- 文旅订单班http://localhost:4155/order-class/wenlu
- 食品订单班http://localhost:4155/order-class/food
**注能源订单班终端模拟已完成可在展示系统中查看Agent协作流程**
## 📝 文件管理原则
### 重要原则
**每个订单班的所有资源必须完全独立存放在其专属文件夹内**
1. **HTML文件**:所有页面文件放在订单班根目录
2. **CSS文件**:所有样式文件放在 `订单班/css/` 目录
3. **JS文件**:所有脚本文件放在 `订单班/js/` 目录
4. **数据资源**:所有数据、图片等放在 `订单班/data/` 目录
### 示例结构
```
order-classes/wenlu/
├── index.html # 主页
├── [其他页面].html # 子页面
├── css/
│ ├── styles.css # 主样式
│ └── animations.css # 动画样式
├── js/
│ ├── main.js # 主脚本
│ └── [其他脚本].js # 功能脚本
└── data/
└── 会展策划/ # 数据资源
└── image/ # 图片资源
```
## 🔧 路由配置
路由配置在 `routes.yaml` 文件中管理:
```yaml
order_classes:
wenlu:
name: "文旅订单班"
title: "2024长三角国际新能源汽车与智能交通产业博览会"
path: "/order-classes/wenlu/"
entry: "index.html"
status: "completed" # completed | pending
agents: [...]
```
## 🎯 开发新订单班流程
1. **创建文件夹结构**
```bash
mkdir -p order-classes/新订单班/{css,js,data}
```
2. **复制模板文件**(可选)
```bash
cp -r order-classes/wenlu/* order-classes/新订单班/
```
3. **开发页面内容**
- 创建 index.html 主页
- 添加所需的子页面
- 编写专属的CSS和JS
4. **更新路由配置**
`routes.yaml` 中添加新订单班配置,并将 status 改为 "completed"
5. **测试访问**
重启服务器后访问:`http://localhost:4155/order-class/新订单班`
## ⚠️ 注意事项
1. **端口必须是 4155**(硬性要求)
2. 每个订单班完全独立,不共享资源
3. 所有路径使用相对路径
4. 保持文件结构整洁规范
5. 开发完成后更新 routes.yaml 的状态
## 📊 当前进度
### 网页展示进度
- ✅ 文旅订单班100%完成)
- ✅ 食品订单班100%完成)
- ⏳ 其他10个订单班待开发
### 终端模拟进度
- ✅ 文旅订单班(终端模拟已完成)
- ✅ 食品订单班(终端模拟已完成)
- ✅ 视觉设计订单班(终端模拟已完成)
- ✅ 土木订单班(终端模拟已完成)
- ✅ 大健康订单班(终端模拟已完成)
- ✅ 能源订单班(终端模拟已完成)← **最新完成**
- ⏳ 其他6个订单班终端模拟待开发
## 🛠️ 技术栈
- Node.js + Express
- YAML配置管理
- Tailwind CSS
- 原生JavaScript
- Font Awesome图标
## 🖥️ 终端模拟系统
### 系统位置
终端模拟系统位于:`web_frontend/exhibition-demo/src/data/terminalSimulations/`
### 已完成的终端模拟
1. **文旅订单班** (`wenlu.ts`) - 2024长三角新能源汽车博览会
2. **食品订单班** (`food.ts`) - 青莳轻食店铺经营方案
3. **视觉设计订单班** (`visualDesign.ts`) - 非遗文化纪录片AIGC制作
4. **土木订单班** (`civilEngineering.ts`) - 物流输送线节拍优化PLC与机器人联调
5. **大健康订单班** (`health.ts`) - 心理咨询服务全流程方案
6. **能源订单班** (`energy.ts`) - 光伏晶硅电池片AOI检测与分拣单元 ← **最新完成**
### 能源订单班特点
- **项目主题**光伏晶硅电池片印后AOI检测与分拣单元
- **核心技术**PLC控制 + 机器视觉深度学习 + 六轴机器人分拣 + 质量追溯
- **Agent配置**4个工业自动化专家
- ⚙️ PLC工程师Siemens S7-1500控制系统设计
- 📷 机器视觉识别工程师Cognex D900深度学习AOI检测
- 🔍 机器视觉识别技术员(系统调试与性能验收)
- 🤖 机器人调试工程师ABB IRB 1200智能分拣
- **技术指标**节拍≥3600片/h漏检≤0.3%误检≤0.5%
- **创新亮点**
- 深度学习缺陷分类7类缺陷识别
- Ping-Pong双工位提升30%产能)
- 降级运行模式(相机异常时保证产线不停机)
- 全程质量追溯OPC UA实时上报MES
### 终端模拟使用方法
在展示系统中选择对应订单班即可查看完整的Agent协作流程动画演示。
## 📞 问题反馈
如有问题,请检查:
1. 端口是否为4155
2. 文件路径是否正确
3. routes.yaml配置是否正确
4. 依赖是否已安装
5. 终端模拟文件是否已正确导入到 `index.ts`