系统概述
实验室安全教育考试系统移动端,面向在校师生提供安全知识学习、考试、证书管理等一站式服务。
22
功能页面
4
主功能Tab
4
底部导航Tab
3
用户角色
H5
单页应用
💡
本系统为 移动端 H5 单页应用,采用 screen 切换机制模拟原生 App 体验,无需安装,微信或浏览器直接访问。底部固定导航栏提供工作台、学习培训、在线考试、刷题练习四大入口。
目标用户
🎓
本科生 / 研究生
主要用户群体
  • 完成入学/学年安全考试
  • 在线学习安全知识课程
  • 参与线下培训并签到
  • 查看成绩、证书、积分
  • 申请实验室绑定
👩‍🏫
实验室管理员
管理角色(线下培训)
  • 发布/管理线下培训活动
  • 展示签到二维码
  • 查看签到统计与名单
  • 切换发布/草稿状态
🏛
实验室审批人
审批角色
  • 处理学生实验室绑定申请
  • 审批/驳回申请
  • 查看申请详情与安全须知
  • 待审批数角标提醒
页面架构
系统共包含 22 个功能页面,按底部 4 个导航 Tab 及独立页面分组,页面间通过 screen 参数切换。
🗂️
所有页面均为单页应用内的虚拟路由,通过 goto(screenId) 控制显示与隐藏,支持 goBack() 返回操作,保留滚动位置。
工作台(3 个页面)
🏠
screen-home
工作台首页,卡片式聚合展示考试任务、学习任务、培训活动、积分通知
🔔
screen-notice-list
消息通知列表,系统公告与个人消息
🏛️
screen-approval
实验室审批页,处理学生实验室绑定申请
学习培训(5 个页面)
📚
screen-knowledge-list
学习培训首页,推荐/全部/考前/线下四个子Tab
📖
screen-knowledge-detail
课程详情,含章节目录、简介、学习进度
📋
screen-posttest
课后测验,完成课程后的知识检测
🎤
screen-training-detail
线下培训详情,时间地点、签到二维码、名单统计
📖
screen-study-detail
学习资料详情,知识点阅读页
在线考试(7 个页面)
🎓
screen-exam-list
在线考试首页,考试任务/模拟考试/我的成绩三个子Tab
✍️
screen-exam-doing
答题中,题目展示、选项作答、倒计时
🏆
screen-exam-result
考试结果,成绩、通过状态、可查看答题详情
📋
screen-exam-detail
考试任务详情,考试说明与开始入口
🎯
screen-mock-detail
模拟考试详情,模拟说明与开始入口
📝
screen-regular-exam-detail
常规考试详情,考试信息与历史成绩
🔍
screen-score-detail
答题详情,逐题查看答案、解析与难度
刷题练习(2 个页面)
✏️
screen-practice-list
刷题练习首页,按科目/类型选择练习范围
📝
screen-practice-detail
刷题答题页,即时反馈正确答案与解析
我的个人中心(5 个页面,从工作台头像入口访问,非底部Tab)
👤
screen-my
我的首页,用户信息、学时/证书/积分概览及功能入口
📊
screen-scores
我的成绩,各科目历次考试成绩列表
🏅
screen-certs
我的证书,已获得安全资质证书列表
📁
screen-exam-records
考试记录,历次参加考试的详细记录
screen-wrong-questions
历史错题,汇总答错题目便于复习
工作台模块
工作台是应用的默认首屏,以卡片式布局聚合展示所有重要任务入口与数据概览,帮助用户快速了解待办事项。
📝
考试任务卡片
高优先级展示
  • 展示当前待完成与已完成考试列表
  • 每个考试显示截止时间与剩余天数
  • 进度条可视化展示完成状态
  • 点击卡片直接跳转考试入口
  • 已过期考试以灰色标注区分
  • 支持按截止时间紧急程度排序
📚
学习任务卡片
学时统计
  • 展示分配给用户的课程学习任务
  • 显示每门课程的学习进度百分比
  • 汇总已完成学时与总要求学时
  • 点击课程直接进入学习详情页
  • 完成课程后学时自动累计更新
  • 超期未完成课程红色高亮提示
🎯
模拟考试卡片
快速入口
  • 展示最近一次模拟考试成绩与时间
  • 一键快速开始新的模拟练习
  • 显示历史模拟最高分记录
  • 与正式考试隔离,不影响成绩档案
  • 模拟次数不限,随时练习
🎤
培训活动卡片
线下活动
  • 展示近期即将举行的线下培训活动
  • 显示活动时间、地点、剩余名额
  • 支持一键报名参加培训
  • 管理员可直接在此入口管理活动
  • 已报名活动显示签到入口
  • 活动结束后自动归档
积分展示
激励机制
  • 展示用户当前总积分与等级徽章
  • 积分来源:学习、考试通过、签到、活动参与
  • 显示距下一等级所需积分差值
  • 点击跳转积分详细记录页面
  • 等级标志在个人主页显示
🔔
消息通知
系统公告 + 个人消息
  • 系统公告:平台通知、考试提醒、安全预警
  • 个人消息:审批结果、培训报名确认
  • 未读消息数角标显示在导航图标上
  • 点击消息可跳转对应功能页
  • 支持消息标为已读与全部已读
  • 重要通知支持置顶展示
学习培训模块
提供在线课程、视频学习、考前培训与线下培训四个维度,满足不同学习场景需求,学习进度全程记录。
推荐课程 Tab
精选安全课程
  • 展示平台精选安全知识课程卡片
  • 卡片显示课程封面、名称、学时
  • 显示课程热度与学习人数
  • 个性化推荐基于用户学习历史
  • 支持收藏课程到个人学习清单
📂
全部课程 Tab
分类浏览
  • 按类别展示全部课程(化学/生物/辐射/消防等)
  • 支持关键字搜索课程名称
  • 筛选器:按类别/学时/难度过滤
  • 列表/网格视图切换
  • 显示已学和未学标记
🎓
考前课程 Tab
必修关联
  • 仅展示与考试任务关联的必修课程
  • 标注对应考试科目与完成要求
  • 未完成课程影响考试资格提示
  • 完成进度与考试倒计时同步显示
  • 完成后自动解锁对应考试入口
📍
线下培训 Tab
报名与签到
  • 展示所有线下培训活动列表
  • 活动状态:待开始/进行中/已结束
  • 一键报名,名额有限先到先得
  • 已报名活动显示签到二维码入口
  • 管理员可查看参与名单与统计
  • 活动结束后可查看历史记录
课程详情与视频播放
📖
课程详情页
screen-knowledge-detail
  • 展示课程封面、简介、讲师信息
  • 章节目录列表,点击跳转对应视频
  • 可视化学习进度(已学/全部章节数)
  • 课程资料下载入口(如有附件)
  • 学习记录:上次学到哪一章自动标记
  • 完成全部章节后标注"已完成"并发放积分
▶️
学习资料阅读页
screen-study-detail
  • 支持竖屏/横屏自动适配
  • 播放进度自动保存,下次续播
  • 播放速度调节(0.5x ~ 2x)
  • 视频下方显示当前章节笔记区域
  • 不可快进(防止学时作弊保障)
  • 完成播放自动更新课程进度
在线考试模块
支持正式考试与模拟考试,内置倒计时、防切屏、自动提交等机制,确保考试公正性;成绩实时反馈并可查看答题详情。
📋
考试任务 Tab
必考任务
  • 列出当前用户所有必参加考试任务
  • 每项显示考试名称、截止时间、剩余天数
  • 状态标签:待参加/进行中/已完成/已过期
  • 点击进入考试须知与开始确认页
  • 已完成考试显示成绩与通过状态
  • 可查看对应考试的历次成绩记录
🎯
模拟考试 Tab
不限次练习
  • 提供与正式考试同类型的模拟题库
  • 参加次数不限,成绩不计入档案
  • 系统随机抽题,每次题目不同
  • 模拟结束立即显示成绩与答题解析
  • 记录历次模拟成绩与最高分
  • 标记薄弱知识点辅助备考
📊
我的成绩 Tab
历次记录
  • 展示所有考试科目的历次成绩
  • 每条记录显示考试名称、时间、分数、通过状态
  • 支持按时间/科目/通过状态筛选
  • 点击记录查看答题详情与解析
  • 通过考试的记录关联证书信息
答题流程
1
考试须知
展示规则、题量、时长、注意事项
2
开始答题
点击确认后倒计时开始,进入答题页
3
答题中
逐题作答,可标记跳过,顶部进度条
4
提交确认
提交前显示未作答题数,确认后提交
5
考试结果
显示分数、通过状态、可查看详情
⚠️
答题过程中切换到其他 App 或页面时,系统将弹出警告提示。倒计时归零后自动提交当前已作答内容,未作答题目计为错误。
刷题练习模块
提供随机练习、错题本、按类别练习三种模式,帮助用户查漏补缺,强化薄弱知识点,答题即时反馈。
🎲
随机练习
系统随机出题
  • 系统从全题库随机抽取题目
  • 每次练习题目不重复,覆盖多知识点
  • 可设置单次练习题目数量(10/20/30题)
  • 作答后立即显示正误与解析
  • 错误题目自动加入错题本
  • 支持随时暂停,进度自动保存
📒
错题本
精准查漏补缺
  • 汇总所有练习与考试中的历史错题
  • 按知识点分类归纳错题
  • 显示错误次数与最近错误时间
  • 支持重新练习错题,答对后可移除
  • 手动收藏重要题目到错题本
  • 错题统计图表辅助分析薄弱环节
🗂️
按类别练习
针对性强化
  • 按知识点类别选择练习范围
  • 支持按题型筛选(单选/多选/判断)
  • 显示每个类别的历史正确率
  • 可选择困难模式(只做错过的题)
  • 完成一轮后显示本次练习分析报告
  • 成绩趋势图展示提升进度
实验室审批功能
学生可提交实验室绑定申请,审批人通过移动端处理申请,全流程通知推送,角标提示待处理数量。
审批流程
1
提交申请
学生填写实验室信息,提交绑定申请
2
通知推送
审批人收到消息通知,角标数量+1
3
查看详情
审批人查看申请详情与安全须知
4
审批操作
通过或驳回,可填写审批意见
5
结果通知
学生收到审批结果消息推送
🏛️
审批列表与详情
screen-approval
  • 展示待处理与历史审批列表
  • 每条显示申请人姓名、学号、申请实验室
  • 状态标签:待审批/已通过/已驳回
  • 「我的」页面显示待审批数量角标
  • 支持按状态筛选申请记录
  • 点击查看完整申请详情
📋
审批详情
screen-approval(详情区域)
  • 展示申请人完整信息(姓名/学院/学号)
  • 申请实验室名称与编号
  • 申请理由与实验室安全须知确认状态
  • 审批意见文本框(驳回时必填)
  • 通过/驳回操作按钮,操作不可撤销
  • 历史审批记录在详情页底部展示
💡
审批人身份由后台配置,普通学生无法看到审批入口。审批后的结果会通过消息通知实时推送给申请人,双方均可在消息中心查看记录。
线下培训管理功能
管理员可在移动端发布培训活动、展示签到二维码,实时查看签到统计与人员名单,支持草稿与发布状态管理。
发布培训活动
管理员专属
  • 填写培训标题、简介、培训目标
  • 设置培训时间(开始/结束时间)
  • 设置培训地点(支持文字或地图选点)
  • 设置最大参与人数限制
  • 支持存为草稿后继续编辑
  • 发布后学生端立即可见并可报名
📱
签到二维码
现场扫码签到
  • 管理员在培训详情页展示专属签到码
  • 二维码包含活动 ID 与时效校验
  • 学生使用微信/浏览器扫码完成签到
  • 签到成功后积分自动累计
  • 二维码支持刷新(每 5 分钟自动更新)
  • 重复签到系统自动拦截提示
📊
签到统计
实时查看
  • 实时显示总报名人数、已签到、未签到数
  • 进度环形图直观展示签到比例
  • 可查看已签到学生名单(姓名+学工号+学院)
  • 可查看未签到学生名单,支持手动补签
  • 名单支持导出为 Excel 文件
  • 按学院/专业分组查看签到情况
活动状态管理
📝
草稿状态
仅管理员可见
  • 草稿状态学生端不展示,仅管理员可编辑
  • 支持保存草稿后继续修改内容
  • 草稿列表在管理员的培训管理入口展示
  • 切换为发布状态后立即对学生可见
🚀
发布状态
学生可见可报名
  • 发布后出现在学习培训-线下培训列表
  • 符合条件的学生可报名参加
  • 管理员仍可编辑时间、地点等信息
  • 可切换回草稿状态(已报名学生收到通知)
我的成绩
汇总展示用户所有考试科目的历次成绩记录,支持筛选与排序,可深入查看每次考试的完整答题详情。
📊
成绩列表
screen-scores
  • 按科目分组展示所有历次考试成绩
  • 每条记录:科目名称、考试时间、得分、满分、通过状态
  • 通过 / 未通过 标签直观区分
  • 支持按时间倒序或成绩高低排序
  • 支持按科目/通过状态筛选
  • 点击任意记录进入答题详情页
📈
成绩统计
数据概览
  • 顶部展示总考试次数与通过率
  • 各科目最高分与平均分对比
  • 成绩趋势折线图(近 6 次考试)
  • 通过考试关联证书,点击可查看
  • 未通过考试显示建议复习知识点
答题详情
逐题展示考试作答情况,标注正确答案与解析,帮助用户找出知识盲点,支持将错题加入练习本。
📝
题目回顾
screen-score-detail
  • 逐题展示题目内容与用户作答
  • 绿色标注正确答案,红色标注错误作答
  • 每题附带知识点解析说明
  • 顶部显示本次得分与题目总数
  • 快速跳转到指定题目编号
  • 错题可一键加入错题本
🔍
答题分析
辅助提升
  • 按知识点分类汇总本次答题正确率
  • 标注薄弱知识点并推荐相关课程
  • 与上次考试对比,展示进步情况
  • 可直接从详情页发起再次刷题练习
  • 分享成绩卡片功能(可选)
💡
答题详情页同时适用于正式考试模拟考试的结果回顾,路由均为 screen-score-detail,通过传入不同的考试记录 ID 区分。
角色与权限说明
系统内置三种用户角色,权限由后台统一配置,前端根据角色动态显示/隐藏对应功能入口。
角色 可访问模块 特有权限 备注
学生(默认) 全部模块(工作台、学习培训、在线考试、刷题练习、我的) 学习课程/参加考试/培训签到/查看成绩与证书/提交实验室绑定申请 主要用户群体,登录后默认角色
实验室管理员 全部模块 + 线下培训管理功能 发布培训活动/展示签到二维码/查看签到统计与名单/切换草稿发布状态 需后台配置管理员身份,可同时拥有学生权限
实验室审批人 全部模块 + 审批管理功能 查看审批列表/审批或驳回申请/填写审批意见/查看申请详情 工作台与消息通知显示待审批数角标
⚠️
一个用户可同时具备多个角色(如既是管理员又是审批人)。权限组合由后台灵活配置,前端无需修改代码即可生效。
管理端功能汇总
具备管理员或审批人身份的用户,在移动端可使用以下专属管理功能,普通学生不可见。
🎤
培训活动管理
实验室管理员
  • 创建新的线下培训活动
  • 编辑已有活动信息(时间/地点/人数)
  • 切换活动草稿/发布状态
  • 展示并刷新签到二维码
  • 实时查看签到统计数据
  • 导出签到名单为 Excel
🏛️
申请审批管理
实验室审批人
  • 查看所有待处理实验室绑定申请
  • 审批或驳回申请,填写意见
  • 查看申请人完整信息与申请记录
  • 工作台角标实时提示待处理数量
  • 消息通知同步新申请提醒
  • 历史审批记录可随时查阅
📋
人员名单管理
实验室管理员
  • 查看培训活动已报名学生名单
  • 按已签到/未签到筛选名单
  • 名单信息:姓名、学工号、学院、签到时间
  • 支持手动为学生补录签到记录
  • 按学院/专业分组统计查看
  • 名单一键导出为 Excel 文件
💡
管理端功能均嵌入在移动端应用内,无需单独安装。管理员身份由系统后台统一配置,前端识别身份后动态展示对应管理入口,普通学生界面保持简洁。