# 🎓 教务系统产业版

一个包含12个产业的教务系统前端项目，支持智能启动、自动依赖管理和可视化导航。

## 📊 项目概览

| 产业名称 | 端口 | 状态 |
|----------|------|------|
| 文旅产业 | 5150 | ⚪ |
| 智能制造 | 5151 | ⚪ |
| 智能开发 | 5152 | ⚪ |
| 财经商贸 | 5153 | ⚪ |
| 视觉设计 | 5154 | ⚪ |
| 交通物流 | 5155 | ⚪ |
| 大健康 | 5156 | ⚪ |
| 土木水利 | 5157 | ⚪ |
| 食品产业 | 5158 | ⚪ |
| 化工产业 | 5159 | ⚪ |
| 能源产业 | 5160 | ⚪ |
| 环保产业 | 5161 | ⚪ |

## 🚀 快速开始

### 方法1：智能启动脚本（推荐）

```bash
# 赋予执行权限
chmod +x start-industry.sh

# 交互式启动界面
./start-industry.sh

# 快速命令
./start-industry.sh all       # 启动所有产业
./start-industry.sh 1         # 启动第1个产业（文旅）
./start-industry.sh status    # 查看运行状态
./start-industry.sh stop      # 停止所有产业
```

### 方法2：可视化导航页面

```bash
# 在浏览器中打开
open index.html
# 或直接双击 index.html 文件
```

### 方法3：手动启动

```bash
# 选择一个产业目录
cd frontend_食品

# 安装依赖（首次运行）
npm install

# 启动开发服务器
npm run dev
```

## 🛠️ 环境要求

- Node.js >= 16.0.0
- npm >= 7.0.0

## 📋 功能特性

### 🎯 智能启动脚本
- ✅ 自动检测依赖是否安装
- ✅ 自动安装缺失的依赖
- ✅ 端口冲突自动处理
- ✅ 彩色交互式界面
- ✅ 批量启动所有产业
- ✅ 实时运行状态检查

### 🌐 可视化导航页面
- ✅ 实时状态显示
- ✅ 一键访问各产业系统
- ✅ 响应式设计
- ✅ 自动状态刷新
- ✅ 现代化界面设计

## 📂 项目结构

```
frontend_all/
├── 📄 README.md                # 项目说明文档
├── 🌐 index.html               # 产业导航页面
├── 🚀 start-industry.sh        # 智能启动脚本
├── 📁 frontend/                 # 文旅产业 (5150)
├── 📁 frontend_智能制造/        # 智能制造 (5151)
├── 📁 frontend_智能开发/        # 智能开发 (5152)
├── 📁 frontend_财经商贸/        # 财经商贸 (5153)
├── 📁 frontend_视觉设计/        # 视觉设计 (5154)
├── 📁 frontend_交通物流/        # 交通物流 (5155)
├── 📁 frontend_大健康/          # 大健康 (5156)
├── 📁 frontend_土木水利/        # 土木水利 (5157)
├── 📁 frontend_食品/            # 食品产业 (5158)
├── 📁 frontend_化工/            # 化工产业 (5159)
├── 📁 frontend_能源/            # 能源产业 (5160)
└── 📁 frontend_环保/            # 环保产业 (5161)
```

## ⚡ 使用场景

### 开发模式
```bash
# 启动特定产业进行开发
./start-industry.sh 9  # 启动食品产业

# 同时启动多个产业
./start-industry.sh all
```

### 演示模式
```bash
# 使用可视化导航页面
open index.html
# 点击对应产业卡片即可访问
```

### 部署模式
```bash
# 构建所有产业
for dir in frontend*/; do
    cd "$dir" && npm run build && cd ..
done
```

## 🔧 常见问题

### Q: 如何解决端口被占用？
A: 脚本会自动检测端口冲突并提示是否停止现有服务

### Q: 依赖安装失败怎么办？
A: 可以手动进入对应目录执行 `npm install`

### Q: 如何查看所有产业的运行状态？
A: 运行 `./start-industry.sh status` 或打开 `index.html`

### Q: 如何批量停止所有服务？
A: 运行 `./start-industry.sh stop`

## 📦 部署指南

### 本地部署
1. 克隆项目到本地
2. 运行 `./start-industry.sh` 选择要启动的产业
3. 在浏览器访问对应端口

### 服务器部署
1. 安装 PM2: `npm install -g pm2`
2. 使用 PM2 管理进程:
```bash
# 启动所有产业
for dir in frontend*/; do
    cd "$dir"
    pm2 start "npm run dev" --name "${dir%/}"
    cd ..
done

# 查看状态
pm2 status

# 停止所有
pm2 stop all
```

## 🎨 自定义配置

### 修改端口
编辑各产业目录下的 `vite.config.js` 文件中的端口配置

### 添加新产业
1. 创建新的产业目录
2. 在 `start-industry.sh` 中添加对应配置
3. 在 `index.html` 中添加产业信息

## 📈 性能优化

- 已删除 node_modules 减少 4.2GB
- 已删除 .yoyo 缓存减少 1.2GB
- 总体积从 7.5GB 减少到 2.7GB
- 支持并行依赖安装，提升启动速度

## 🤝 贡献指南

1. Fork 项目
2. 创建特性分支
3. 提交变更
4. 发起 Pull Request

## 📄 许可证

本项目采用 MIT 许可证