8.7 KiB
8.7 KiB
学校管理模块 - 快速开始指南
🚀 5分钟快速上手
本指南帮助你快速了解和使用学校管理模块。
📋 前置条件
环境要求
- ✅ JDK 17+
- ✅ Maven 3.6+
- ✅ MySQL 8.0+
- ✅ Node.js 16+
- ✅ npm 8+
已完成的准备工作
- ✅ 后端代码已编译通过
- ✅ 前端代码已编译通过
- ✅ 数据库脚本已准备好
- ✅ Mock数据已配置
🎯 快速启动
步骤1: 数据库初始化 (2分钟)
# 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/pgWorkSpace/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分钟)
# 1. 进入项目目录
cd /Users/felix/pgWorkSpace/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分钟)
# 1. 进入前端目录
cd /Users/felix/pgWorkSpace/pangu-user-platform/frontend
# 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分钟)
-
打开浏览器
http://localhost:5173 -
登录系统
- 用户名：admin
- 密码：admin123
-
进入学校管理
- 点击左侧菜单"基础管理"
- 点击"学校管理"
🎨 界面预览
主界面布局
┌─────────────────────────────────────────────────────────┐
│ 学校管理 │
├──────────────┬──────────────────────────────────────────┤
│ │ [新增学校] [刷新] │
│ 区域筛选 │ │
│ ┌────────┐ │ ┌──────────────────────────────────────┐│
│ │ 湖北省 │ │ │ 名称 │ 编码 │ 类型 │ 状态 │ 操作 ││
│ │ ├武汉市 │ │ ├──────────────────────────────────────┤│
│ │ │├武昌区│ │ │ 学校A│ SCH20260001│ 初中│ 正常│ ... ││
│ │ │├汉口区│ │ │ ├七年级 ││
│ │ │└汉阳区│ │ │ │ ├1班 ││
│ │ └黄冈市 │ │ │ │ └2班 ││
│ └────────┘ │ │ └八年级 ││
│ │ └──────────────────────────────────────┘│
└──────────────┴──────────────────────────────────────────┘
📖 基本操作
操作1: 新增学校
- 点击"新增学校"按钮
- 填写表单：
- 学校名称：武汉市第一中学
- 学校类型：初中
- 所属区域：湖北省 > 武汉市 > 武昌区
- 详细地址：武昌区中山路123号
- 联系人：张老师
- 联系电话：13800138000
- 状态：正常
- 点击"确定"
- 提示"新增成功"
操作2: 挂载年级
- 找到刚创建的学校
- 点击"挂载年级"按钮
- 选择年级：
- ☑ 七年级
- ☑ 八年级
- ☑ 九年级
- 点击"确定"
- 提示"挂载年级成功"
- 学校树自动刷新，显示新挂载的年级
操作3: 挂载班级
- 展开学校，找到"七年级"
- 点击"挂载班级"按钮
- 选择班级：
- ☑ 1班
- ☑ 2班
- ☑ 3班
- 点击"确定"
- 提示"挂载班级成功"
- 学校树自动刷新，显示新挂载的班级
操作4: 编辑学校
- 找到要编辑的学校
- 点击"编辑"按钮
- 修改信息（如：联系电话）
- 点击"确定"
- 提示"修改成功"
操作5: 删除学校
- 找到要删除的学校
- 点击"删除"按钮
- 确认删除
- 提示"删除成功"
注意： 有年级或学生的学校无法删除！
🔍 常见问题
Q1: 后端启动失败？
可能原因：
- 数据库连接失败
- 端口被占用
- JDK版本不对
解决方法：
# 1. 检查数据库连接
mysql -u root -p
# 2. 检查端口占用
lsof -i:8080
# 3. 检查JDK版本
java -version # 应该是17+
Q2: 前端启动失败？
可能原因：
- 依赖未安装
- Node版本不对
- 端口被占用
解决方法：
# 1. 重新安装依赖
rm -rf node_modules
npm install
# 2. 检查Node版本
node -v # 应该是16+
# 3. 检查端口占用
lsof -i:5173
Q3: 页面显示空白？
可能原因：
- 后端服务未启动
- API地址配置错误
- Mock数据未加载
解决方法：
# 1. 检查后端服务
curl http://localhost:8080/api/school/tree
# 2. 检查浏览器控制台
# 打开浏览器开发者工具，查看Console和Network
# 3. 检查Mock配置
# 确认 src/mock/index.js 已导入 school.js
Q4: 删除学校失败？
可能原因：
- 学校下有年级
- 学校下有学生
解决方法：
- 先删除学校下的所有年级
- 再删除学校
- 或者查看错误提示，按提示操作
Q5: 学校树不显示？
可能原因：
- 未选择区域
- 该区域下没有学校
- API请求失败
解决方法：
- 点击左侧区域树选择区域
- 检查该区域是否有学校数据
- 查看浏览器控制台是否有错误
📚 进阶使用
使用真实API（而非Mock）
-
修改配置
// frontend/src/main.js // 注释掉Mock导入 // import './mock' -
配置API地址
// frontend/src/utils/request.js const service = axios.create({ baseURL: 'http://localhost:8080', // 后端地址 timeout: 5000 }) -
重启前端
npm run dev
查看API文档
- 启动后端服务
- 访问Swagger UI
http://localhost:8080/swagger-ui.html - 查看学校管理接口
- 找到"school-controller"
- 查看所有接口文档
运行单元测试
# 1. 进入项目目录
cd /Users/felix/pgWorkSpace/pangu-user-platform
# 2. 运行测试
mvn test -Dtest=SchoolServiceTest
# 3. 查看测试报告
# target/surefire-reports/
🎯 下一步
学习更多
- 技术方案 - 查看 学校管理模块技术方案_v1.0.md
- 开发计划 - 查看 完整开发计划_Day3-Day7.md
- 开发总结 - 查看 最终开发总结报告.md
- 验收清单 - 查看 最终验收清单.md
参与开发
- 阅读代码 - 从Controller开始，逐层深入
- 运行测试 - 确保所有测试通过
- 添加功能 - 参考现有代码风格
- 提交代码 - 遵循团队规范
📞 获取帮助
文档索引
联系方式
**开发团队 | pangu
🎊 恭喜！
你已经成功启动并使用了学校管理模块！
接下来可以：
- ✅ 探索更多功能
- ✅ 查看技术文档
- ✅ 参与功能开发
- ✅ 提出改进建议
祝使用愉快！ 🚀
快速开始指南生成时间：2026-01-31 23:00
开发团队 | pangu