Skip to content

学生端Web设计文档_v1_0.md

Latest commit

 

History

History
653 lines (434 loc) · 13.1 KB

学生端Web设计文档_v1_0.md

File metadata and controls

653 lines (434 loc) · 13.1 KB
Raw

学生端 Web 设计文档 v1.0

1. 文档目标

本文档用于定义当前 AI 教育系统的学生端 Web 客户端设计方案。

设计前提：

  • 当前仓库中的后台管理系统继续承担管理员端、教师端。
  • 学生端单独建设为新的 Web 客户端，不与后台管理共用页面壳层。
  • 学生端必须与现有教师端、教育业务数据、AI 能力、账号密码体系互通。
  • 第一版优先保证“能登录、能看课、能做作业、能看批改、能用 AI 学习工具”。

2. 与现有系统的关系

2.1 当前后端已具备的基础

当前系统后端已经具备以下能力，可直接复用给学生端：

  • 登录认证：/api/auth/login、/api/auth/logout
  • 用户角色体系：sys_user、sys_role、sys_user_role
  • 学生业务信息：edu_student
  • 班级关系：edu_class、edu_class_student
  • 课程与章节：edu_course、edu_chapter、edu_knowledge_point
  • 作业与题目：edu_homework、edu_homework_question、edu_question
  • 学生答题：edu_student_answer
  • 错题本：edu_wrong_question
  • AI 对话：/api/ai/chat
  • AI 批改记录：/api/ai/reviews
  • 文档批阅、知识脑图、生成练习、教学素材、项目生成等教师侧 AI 工具

2.2 学生端与教师端的互通原则

学生端不是独立业务系统，而是复用当前后端数据库和接口体系的另一套前端。

互通关系如下：

  1. 教师端维护课程、章节、题库、作业。
  2. 学生端读取教师已发布的数据，不重复建模。
  3. 学生在学生端提交作业、产生答题记录和错题。
  4. 教师端继续在后台查看答题记录、批改结果、错题情况和 AI 建议。
  5. 学生端读取教师确认后的最终结果，不绕开教师最终确认。

也就是说：

  • 教师端负责“教、配、发、批、管”
  • 学生端负责“学、做、问、看、改”

3. 账号与密码控制设计

3.1 统一账号体系

学生端必须复用当前系统统一账号体系，不单独建一套登录库。

统一使用：

  • sys_user：登录账号
  • sys_role：角色
  • sys_user_role：用户角色关系
  • edu_student：学生业务信息

含义如下：

  • sys_user 管登录身份、用户名、密码、状态
  • edu_student 管学生业务属性，如学号、班级、学校
  • 一个学生先是系统用户，再绑定学生表

3.2 登录规则

学生端第一版采用与后台相同的登录接口：

  • POST /api/auth/login

入参：

{
  "username": "student",
  "password": "123456"
}

出参：

{
  "code": 200,
  "message": "登录成功",
  "data": {
    "token": "xxxx",
    "userId": 40001,
    "username": "student",
    "roleCode": "student"
  }
}

3.3 权限控制要求

学生端前端需要在登录后校验 roleCode。

只允许：

  • student

进入学生端页面。

如果登录用户是：

  • admin
  • teacher
  • school_admin

则学生端应提示：

当前账号不是学生账号，请前往教师/管理后台登录。

3.4 当前演示账号

根据现有种子数据，当前系统已有演示学生账号：

  • 用户名：student
  • 密码：123456

说明：

  • 密码存储仍由后端 sys_user.password 统一管理
  • 学生端不能自行改数据库密码规则
  • 后续如果增加“修改密码 / 找回密码”，仍走统一认证服务

4. 学生端产品定位

学生端 Web 第一版定位为：

面向学生的学习与作业入口。

不做后台管理感页面，不暴露教师管理菜单，不承载系统管理功能。

页面风格要求：

  • 比教师后台更轻
  • 更接近学习平台 / 课程平台
  • 明确区分“学习任务”和“AI 学习辅助”
  • 支持 PC 端优先，兼顾平板

5. 学生端第一版功能范围

第一版建议做 6 个一级功能。

5.1 登录

功能目标：

  • 学生使用统一账号密码登录
  • 登录后写入 token
  • 自动读取本人学生信息

页面内容：

  • 用户名
  • 密码
  • 登录按钮
  • 登录失败提示

复用接口：

  • POST /api/auth/login

5.2 学习首页

功能目标：

  • 登录后展示当前学生的学习总览
  • 作为学生端首页入口

页面内容建议：

  • 欢迎信息
  • 我的班级
  • 我的课程数量
  • 待完成作业数
  • 最近错题数
  • 快捷入口
    • 去做作业
    • 打开 AI 对话
    • 查看错题本

互通关系：

  • 数据来自教师端已配置课程、班级、作业和错题数据

5.3 我的课程

功能目标：

  • 学生查看自己当前关联班级/课程
  • 进入课程后查看章节结构

页面内容建议：

  • 课程卡片列表
    • 课程名称
    • 任课教师
    • 班级
    • 学分/类型
  • 课程详情页
    • 章节树
    • 知识点概览
    • 相关作业

互通关系：

  • 课程数据由教师端维护
  • 学生端只读展示

第一版要求：

  • 至少能基于 edu_student -> edu_class -> edu_course 查出学生课程
  • 至少能读出课程下的章节

5.4 我的作业

功能目标：

  • 学生查看教师发布的作业
  • 进入作业后完成题目作答
  • 提交后查看 AI/教师反馈

页面结构建议：

  1. 作业列表页

    • 作业标题
    • 所属课程
    • 开始时间
    • 截止时间
    • 完成状态

  2. 作业详情页

    • 作业说明
    • 题目列表
    • 每题分值
    • 作答区
    • 提交按钮

  3. 提交结果页

    • 总体状态
    • 各题作答情况
    • AI 反馈
    • 教师反馈

互通关系：

  • 教师端创建作业、配置题目
  • 学生端读取作业并提交答案
  • 教师端继续批改或确认
  • 学生端只显示最终可见结果

第一版边界：

  • 优先支持文本题作答
  • 不优先做复杂富文本答题器
  • 图片上传答题可作为第二阶段

5.5 错题本

功能目标：

  • 学生查看自己错题
  • 结合 AI 建议进行复盘

页面内容建议：

  • 错题列表

    • 所属课程
    • 题目标题
    • 最近出错时间
    • 错误次数
    • 复盘状态

  • 错题详情

    • 原题
    • 正确答案
    • 自己答案
    • AI 建议
    • 教师建议

互通关系：

  • 错题由学生答题与教师/AI 批改共同产生
  • 教师端可查看错题记录
  • 学生端负责查看和复盘

5.6 AI 学习助手

功能目标：

  • 为学生提供学习场景下的 AI 对话入口
  • 服务于答疑、知识解释、题目分析、错题复盘

第一版建议在学生端只开放这些能力：

  • 普通文本问答
  • 图片/文档辅助问答
  • 基于当前学习上下文进行提问

不直接开放教师工具：

  • 知识脑图
  • 生成练习
  • 教学素材
  • 项目生成

这些仍属于教师端 AI 管理功能。

互通关系：

  • 复用现有 POST /api/ai/chat
  • 复用现有模型配置和 Prompt 模板体系
  • 学生端只切到学生场景模板，不复用教师问答文案

因此后续建议补一个新的 Prompt 模板：

  • student_chat_default

6. 学生端信息架构

建议学生端一级导航如下：

首页
我的课程
我的作业
错题本
AI 学习助手
个人中心

说明：

  • 不暴露后台“系统管理 / 教育基础 / AI 管理”
  • 不把教师端菜单直接搬到学生端

7. 学生端与教师端的数据互通清单

7.1 教师端写，学生端读

  • 课程
  • 章节
  • 知识点
  • 题库题目
  • 作业
  • 题目分值

7.2 学生端写，教师端读

  • 学生答题记录
  • 作业提交状态
  • AI 对话学习痕迹（如果后续落库）

7.3 AI/教师共同影响，学生端读结果

  • AI 批改建议
  • 教师确认后的最终分数
  • 错题本
  • AI 复盘建议

8. 接口设计建议

学生端第一版尽量复用现有接口；不足的再新增学生视角接口。

8.1 复用接口

  • POST /api/auth/login
  • POST /api/auth/logout
  • GET /api/edu/courses
  • GET /api/edu/chapters
  • GET /api/edu/homeworks
  • GET /api/edu/answers
  • GET /api/edu/wrong-questions
  • POST /api/ai/chat

8.2 建议新增的学生端专用接口

为了避免学生端直接拉全量后台数据，建议新增学生视角聚合接口：

1. 学生首页概览

  • GET /api/student/dashboard

返回：

  • 学生基本信息
  • 待完成作业数
  • 已完成作业数
  • 错题数
  • 当前课程数

2. 我的课程

  • GET /api/student/courses
  • GET /api/student/courses/{courseId}

只返回当前学生可见课程。

3. 我的作业

  • GET /api/student/homeworks
  • GET /api/student/homeworks/{homeworkId}
  • POST /api/student/homeworks/{homeworkId}/submit

说明：

  • 学生提交作业建议走学生专用聚合接口
  • 由后端内部再拆分写入 edu_student_answer

4. 我的错题

  • GET /api/student/wrong-questions
  • GET /api/student/wrong-questions/{id}

5. 当前学生信息

  • GET /api/student/profile

9. 数据库与现有表的对应关系

学生端第一版不新增大批业务表，主要复用现有表。

学生端功能 主要数据表
登录 sys_user、sys_user_role、sys_role
学生身份 edu_student
班级关系 edu_class、edu_class_student
课程 edu_course、edu_course_teacher
章节 edu_chapter
知识点 edu_knowledge_point
作业 edu_homework、edu_homework_question
作答 edu_student_answer
错题本 edu_wrong_question
AI 对话审计 ai_generation_record、ai_token_usage

后续如果要增强学生端 AI 历史，可再新增：

  • ai_chat_session
  • ai_chat_message

但第一版不是必须项。

10. 权限与安全设计

10.1 登录态

沿用当前系统 Sa-Token 登录态机制。

学生端需：

  • 保存 token
  • 每次请求自动带上 token
  • token 失效时自动跳登录页

10.2 数据隔离

学生端最关键的不是菜单权限，而是“数据必须只属于当前学生本人”。

必须保证：

  • 学生只能看到自己的作业
  • 学生只能看到自己的答题记录
  • 学生只能看到自己的错题本
  • 学生不能查看其他学生的成绩与反馈

10.3 教师工具隔离

学生端不应暴露教师端 AI 管理功能。

即使知道接口地址，也不应允许调用：

  • 文档批阅
  • 知识脑图（教师版本）
  • 生成练习（教师版本）
  • 教学素材
  • 项目生成

后端建议后续增加角色校验拦截：

  • 教师功能接口：仅 teacher/admin
  • 学生功能接口：仅 student

11. 页面设计建议

11.1 设计方向

学生端页面不适合继续沿用教师后台的“管理面板”风格。

建议学生端风格：

  • 更轻量
  • 更卡片化
  • 更偏学习平台
  • 首页明确学习状态
  • 减少后台式表格

11.2 技术建议

学生端建议单独建一个新前端目录，例如：

student-ui/

技术栈可继续沿用：

  • React
  • Vite
  • TypeScript
  • React Router
  • Axios
  • Zustand 或 React Context

理由：

  • 与当前教师端技术栈一致
  • API 复用成本低
  • 团队维护成本低

12. 第一版开发顺序

建议按以下顺序建设学生端：

第一阶段

  1. 登录页
  2. 首页概览
  3. 我的课程

目标：

  • 学生能登录
  • 能看到自己的基础学习信息

第二阶段

  1. 我的作业
  2. 作业提交
  3. 错题本

目标：

  • 学生学习主流程打通

第三阶段

  1. AI 学习助手
  2. 作业结果与 AI 反馈展示
  3. 个人中心

目标：

  • 把 AI 能力接入到学生学习闭环

13. 与当前教师端功能的映射关系

教师端功能 学生端对应
课程管理 我的课程
章节管理 课程章节浏览
题库管理 作业题目来源
作业管理 我的作业
AI 批改 作业结果展示
错题管理/错题本数据 我的错题本
AI 对话 AI 学习助手

当前新增的教师 AI 管理功能与学生端关系如下：

教师 AI 功能 学生端关系
知识脑图 学生端暂不开放，后续可转成“课程脑图阅读页”
生成练习 教师生成后可转为作业/练习内容，学生端只接收结果
教学素材 仅教师端使用
项目生成 仅教师端使用，后续可转成学生课程项目任务

14. 第一版明确不做

为了控制范围，学生端第一版暂不做：

  • 独立注册
  • 手机验证码登录
  • 第三方登录
  • 复杂消息中心
  • 直播课堂
  • 在线考试监考
  • 项目在线编译运行
  • 学生端独立知识脑图生成
  • 学生端独立出题功能

15. 最终结论

当前系统已经具备建设学生端 Web 的基础条件。

核心原因是：

  1. 统一账号体系已存在。
  2. 学生、课程、章节、作业、答题、错题表已存在。
  3. AI 对话与 AI 审计能力已存在。
  4. 教师端负责生产教学数据，学生端只需围绕学习主流程消费数据。

因此学生端第一版应定义为：

一个与教师端后台共用后端、共用账号、共用教育业务数据、但界面独立的学习型 Web 客户端。

后续如果开始正式开发，建议下一步先做两件事：

  1. 在根目录下新增学生端前端工程目录。
  2. 先补学生视角聚合接口，再开始页面开发。