# 学校管理模块 - 快速开始指南

---

## 🚀 5分钟快速上手

本指南帮助你快速了解和使用学校管理模块。

---

## 📋 前置条件

### 环境要求

- ✅ JDK 17+
- ✅ Maven 3.6+
- ✅ MySQL 8.0+
- ✅ Node.js 16+
- ✅ npm 8+

### 已完成的准备工作

- ✅ 后端代码已编译通过
- ✅ 前端代码已编译通过
- ✅ 数据库脚本已准备好
- ✅ Mock数据已配置

---

## 🎯 快速启动

### 步骤1: 数据库初始化 (2分钟)

```bash
# 1. 登录MySQL
mysql -u root -p

# 2. 创建数据库（如果还没有）
CREATE DATABASE IF NOT EXISTS pangu DEFAULT CHARACTER SET utf8mb4;

# 3. 使用数据库
USE pangu;

# 4. 执行建表SQL
SOURCE /Users/felix/hbxhWorkSpace/pangu-user-platform/sql/pangu_school.sql;

# 5. 验证表是否创建成功
SHOW TABLES LIKE 'pg_school%';
```

**预期结果：**
```
+---------------------------+
| Tables_in_pangu (pg_school%) |
+---------------------------+
| pg_school                 |
| pg_school_class           |
| pg_school_grade           |
+---------------------------+
```

---

### 步骤2: 启动后端服务 (1分钟)

```bash
# 1. 进入项目目录
cd /Users/felix/hbxhWorkSpace/pangu-user-platform

# 2. 编译项目（如果还没编译）
mvn clean package -DskipTests

# 3. 启动服务
java -jar pangu-admin/target/pangu-admin.jar

# 或者使用IDE直接运行 PanguAdminApplication
```

**预期结果：**
```
  ____                        
 |  _ \ __ _ _ __   __ _ _   _ 
 | |_) / _` | '_ \ / _` | | | |
 |  __/ (_| | | | | (_| | |_| |
 |_|   \__,_|_| |_|\__, |\__,_|
                   |___/       

Application started successfully on port 8080
```

---

### 步骤3: 启动前端服务 (1分钟)

```bash
# 1. 进入前端目录
cd /Users/felix/hbxhWorkSpace/pangu-user-platform/pangu-ui

# 2. 安装依赖（如果还没安装）
npm install

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

**预期结果：**
```
  VITE v7.3.1  ready in 1234 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: http://192.168.1.100:5173/
  ➜  press h + enter to show help
```

---

### 步骤4: 访问系统 (1分钟)

1. **打开浏览器**
   ```
   http://localhost:5173
   ```

2. **登录系统**
   - 用户名：admin
   - 密码：admin123

3. **进入学校管理**
   - 点击左侧菜单"基础管理"
   - 点击"学校管理"

---

## 🎨 界面预览

### 主界面布局

```
┌─────────────────────────────────────────────────────────┐
│  学校管理                                                │
├──────────────┬──────────────────────────────────────────┤
│              │  [新增学校] [刷新]                        │
│  区域筛选    │                                            │
│  ┌────────┐  │  ┌──────────────────────────────────────┐│
│  │ 湖北省  │  │  │ 名称 │ 编码 │ 类型 │ 状态 │ 操作    ││
│  │ ├武汉市 │  │  ├──────────────────────────────────────┤│
│  │ │├武昌区│  │  │ 学校A│ SCH20260001│ 初中│ 正常│ ... ││
│  │ │├汉口区│  │  │  ├七年级                              ││
│  │ │└汉阳区│  │  │  │ ├1班                               ││
│  │ └黄冈市 │  │  │  │ └2班                               ││
│  └────────┘  │  │  └八年级                              ││
│              │  └──────────────────────────────────────┘│
└──────────────┴──────────────────────────────────────────┘
```

---

## 📖 基本操作

### 操作1: 新增学校

1. 点击"新增学校"按钮
2. 填写表单：
   - 学校名称：武汉市第一中学
   - 学校类型：初中
   - 所属区域：湖北省 > 武汉市 > 武昌区
   - 详细地址：武昌区中山路123号
   - 联系人：张老师
   - 联系电话：13800138000
   - 状态：正常
3. 点击"确定"
4. 提示"新增成功"

### 操作2: 挂载年级

1. 找到刚创建的学校
2. 点击"挂载年级"按钮
3. 选择年级：
   - ☑ 七年级
   - ☑ 八年级
   - ☑ 九年级
4. 点击"确定"
5. 提示"挂载年级成功"
6. 学校树自动刷新，显示新挂载的年级

### 操作3: 挂载班级

1. 展开学校，找到"七年级"
2. 点击"挂载班级"按钮
3. 选择班级：
   - ☑ 1班
   - ☑ 2班
   - ☑ 3班
4. 点击"确定"
5. 提示"挂载班级成功"
6. 学校树自动刷新，显示新挂载的班级

### 操作4: 编辑学校

1. 找到要编辑的学校
2. 点击"编辑"按钮
3. 修改信息（如：联系电话）
4. 点击"确定"
5. 提示"修改成功"

### 操作5: 删除学校

1. 找到要删除的学校
2. 点击"删除"按钮
3. 确认删除
4. 提示"删除成功"

**注意：** 有年级或学生的学校无法删除！

---

## 🔍 常见问题

### Q1: 后端启动失败？

**可能原因：**
- 数据库连接失败
- 端口被占用
- JDK版本不对

**解决方法：**
```bash
# 1. 检查数据库连接
mysql -u root -p

# 2. 检查端口占用
lsof -i:8080

# 3. 检查JDK版本
java -version  # 应该是17+
```

### Q2: 前端启动失败？

**可能原因：**
- 依赖未安装
- Node版本不对
- 端口被占用

**解决方法：**
```bash
# 1. 重新安装依赖
rm -rf node_modules
npm install

# 2. 检查Node版本
node -v  # 应该是16+

# 3. 检查端口占用
lsof -i:5173
```

### Q3: 页面显示空白？

**可能原因：**
- 后端服务未启动
- API地址配置错误
- Mock数据未加载

**解决方法：**
```bash
# 1. 检查后端服务
curl http://localhost:8080/api/school/tree

# 2. 检查浏览器控制台
# 打开浏览器开发者工具，查看Console和Network

# 3. 检查Mock配置
# 确认 src/mock/index.js 已导入 school.js
```

### Q4: 删除学校失败？

**可能原因：**
- 学校下有年级
- 学校下有学生

**解决方法：**
1. 先删除学校下的所有年级
2. 再删除学校
3. 或者查看错误提示，按提示操作

### Q5: 学校树不显示？

**可能原因：**
- 未选择区域
- 该区域下没有学校
- API请求失败

**解决方法：**
1. 点击左侧区域树选择区域
2. 检查该区域是否有学校数据
3. 查看浏览器控制台是否有错误

---

## 📚 进阶使用

### 使用真实API（而非Mock）

1. **修改配置**
   ```javascript
   // pangu-ui/src/main.js
   // 注释掉Mock导入
   // import './mock'
   ```

2. **配置API地址**
   ```javascript
   // pangu-ui/src/utils/request.js
   const service = axios.create({
     baseURL: 'http://localhost:8080', // 后端地址
     timeout: 5000
   })
   ```

3. **重启前端**
   ```bash
   npm run dev
   ```

### 查看API文档

1. **启动后端服务**
2. **访问Swagger UI**
   ```
   http://localhost:8080/swagger-ui.html
   ```
3. **查看学校管理接口**
   - 找到"school-controller"
   - 查看所有接口文档

### 运行单元测试

```bash
# 1. 进入项目目录
cd /Users/felix/hbxhWorkSpace/pangu-user-platform

# 2. 运行测试
mvn test -Dtest=SchoolServiceTest

# 3. 查看测试报告
# target/surefire-reports/
```

---

## 🎯 下一步

### 学习更多

1. **技术方案** - 查看 [学校管理模块技术方案_v1.0.md](./学校管理模块技术方案_v1.0.md)
2. **开发计划** - 查看 [完整开发计划_Day3-Day7.md](./完整开发计划_Day3-Day7.md)
3. **开发总结** - 查看 [最终开发总结报告.md](./最终开发总结报告.md)
4. **验收清单** - 查看 [最终验收清单.md](./最终验收清单.md)

### 参与开发

1. **阅读代码** - 从Controller开始，逐层深入
2. **运行测试** - 确保所有测试通过
3. **添加功能** - 参考现有代码风格
4. **提交代码** - 遵循团队规范

---

## 📞 获取帮助

### 文档索引

- 📄 [README.md](./README.md) - 文档总览
- 📄 [交付说明.md](./交付说明.md) - 交付内容
- 📄 [快速开始.md](./快速开始.md) - 本文档

### 联系方式

**开发团队 | pangu

---

## 🎊 恭喜！

你已经成功启动并使用了学校管理模块！

接下来可以：
- ✅ 探索更多功能
- ✅ 查看技术文档
- ✅ 参与功能开发
- ✅ 提出改进建议

**祝使用愉快！** 🚀

---

*快速开始指南生成时间：2026-01-31 23:00*  
*开发团队 | pangu*
