详细说明: - 能源订单班: 重命名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>
199 lines
6.8 KiB
Markdown
199 lines
6.8 KiB
Markdown
# 订单班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` |