教师小程序 / 提交记录查看
周策 老师
Prototype

教师小程序 · 提交记录查看

补齐提交记录查看页与记录切换逻辑。

设计视口: 375 x 812 · 当前缩放: 100% · 左右分栏: 拖动中线调整
Page PRD

提交记录查看

当前文档: prds/作业管理模块/teacher-mp/tm_grading_history.md

当前对照重点: 提交记录查看
Review Hint

左侧现在支持三种演示模式: 默认按设计稿完整缩放、按宽度铺满、以及 100% 原始尺寸滚动查看。 右侧默认读取当前页面对应的页面级 PRD,而不是整本总 PRD;改页面时,直接同步维护这个页面文档即可。

提交记录查看

页面元信息

  • 终端:教师小程序
  • Astro 路由:/teacher-mp/grading-history
  • 原始 HTML:tm_grading_history.html
  • 来源章节:4.3.8
  • 维护规则:后续以本页面 PRD 为准;若改动影响通用规则,再同步总览 / 全局规则文档。

视觉描述

  • 原型引用:产出文档/作业管理模块/原型图/tm_grading_history.html
  • 页面为教师小程序全屏原卷查看页,自上而下分为导航栏、原卷查看区、页码角标、底部工具条、底部提交记录选择弹层5个层级。背景以深色查看底承载浅色卷面,提高原卷回看对比度。
  • 顶部导航栏左侧为返回图标,中间标题展示当前选中的提交记录名称,右侧为小程序胶囊占位。标题区仅展示记录名称,不展示教研院标签和作业来源说明。参见 R56。
  • 原卷查看区居中展示当前页当前提交记录的原卷图片;右下角页码角标展示当前页码。
  • 底部工具条包含 提交记录放大缩小返回4个控件;其中 提交记录 用于打开当前页记录弹层,返回 用于回到来源页。
  • 提交记录选择弹层从底部上滑出现,包含 取消、标题提交记录确定 和同页记录列表。列表项采用单列按钮样式,当前选中记录高亮。

功能描述

页面入口

  • 教师在 tm_grading.htmltm_student_analysis.html 点击页级工具条中的 提交记录 进入本页,必须透传 homework_idstudent_idstatuscurrent_page_nocurrent_submission_idsource_page
  • 本页默认展示“当前页”范围内的最新一条提交记录;若来源页已透传 current_submission_id 且该记录属于当前页,则优先展示该记录。
  • 当前页提交记录按页隔离。若要查看其他页的提交记录,必须回到来源页切换到对应页,再点击 提交记录 重新进入本页;本页不直接提供跨页切换记录入口。参见 R54。

页面分区与控件交互

  • 本页按导航栏原卷查看区底部工具条提交记录选择弹层4个交互分区展开说明。

导航栏

区域/控件展示规则交互与系统行为
左侧返回始终展示点击后返回来源页,并带回当前选中的 submission_idcurrent_page_no。若来源页为 tm_grading.html,则恢复到对应学生和对应页码;若来源页为 tm_student_analysis.html,则恢复到对应学生题目查看页。
记录标题始终展示展示当前选中的 submission_label;切换记录后即时更新。
右侧胶囊占位始终展示不承接业务点击事件。

原卷查看区

区域/控件展示规则交互与系统行为
当前记录原卷始终展示展示当前页当前提交记录的原卷图片;切换记录后刷新。
页码角标始终展示只读展示 current_page_no;本页不支持直接跳页。

底部工具条

区域/控件展示规则交互与系统行为
提交记录始终展示点击打开当前页提交记录选择弹层;弹层内只展示当前页的记录列表。参见 R54。
放大始终展示以 10% 为步长放大原卷;与手势缩放共用缩放比例状态。
缩小始终展示以 10% 为步长缩小原卷;到达最小值后按钮保留可见但点击无效。
返回始终展示执行与导航返回一致的回跳逻辑;优先使用当前已确认选中的提交记录作为回传值。
  • 缩放与手势规则:
    • 双指缩放:支持双指捏合缩放原卷,范围固定为 50%-200%。参见 R55。
    • 单指长按拖移:单指长按 300ms 后进入拖移模式,仅允许上下滑动拖移当前原卷;释放手指后退出拖移模式。参见 R55。
    • 手势与工具条共用同一缩放状态;按钮缩放、手势缩放之间不允许出现两套比例口径。

提交记录选择弹层

区域/控件展示规则交互与系统行为
取消弹层打开时始终展示关闭弹层,不修改当前选中的提交记录。
标题 提交记录弹层打开时始终展示固定文案,不显示页码和数量。
确定弹层打开时始终展示确认当前高亮记录为新的当前记录,关闭弹层并刷新本页原卷;不立即返回来源页。
记录列表项当前页存在记录时展示submit_time 倒序展示当前页记录;点击某一项后仅切换高亮态,不立即生效。

文案和按钮状态变化

  • 当前记录切换后,导航标题同步更新为新的 submission_label
  • 弹层中被点击的记录项切换为高亮态;未点击 确定 前,本页原卷不切换。
  • 当前页只有 1 条记录时,提交记录 按钮仍可点击,弹层内仅展示该条记录。

页面跳转和返回逻辑

  • tm_grading.html 进入:返回时回到原学生、原页码,并将当前确认选中的 submission_id 带回。
  • tm_student_analysis.html 进入:返回时回到原学生题目查看页、原页码,并将当前确认选中的 submission_id 带回。
  • 在本页切换记录不自动返回来源页;只有点击导航返回或工具条 返回 才执行回跳。

批量操作范围

  • 本页不支持批量选择多条提交记录,不支持多选确认、批量删除、批量导出。
  • 当前页弹层的记录切换只影响“当前页当前学生”的查看上下文,不影响任何批改结果和来源页的学生列表顺序。

弹层规格

弹层 1:提交记录选择弹层

要素内容
触发条件点击底部工具条 提交记录
标题提交记录
正文展示当前页提交记录列表,仅含当前页记录,不展示其他页记录
主按钮确定 → 将当前高亮记录设为当前记录,刷新本页原卷
次按钮取消 → 关闭弹层,不切换记录
[x] 关闭取消
  • 业务规则:R18、R54、R55、R56。

异常描述

异常场景处理方式
原卷图片加载失败查看区展示错误态和 重试 按钮;记录弹层仍可打开,便于教师切换到同页其他记录重试。
当前页无提交记录页面展示空态 当前页暂无提交记录提交记录 按钮点击后弹层显示空列表,不自动跳转其他页。
记录切换后详情加载失败保留旧记录原卷不清空,并 Toast 提示 记录加载失败,请重试
缩放超出边界达到 50% 或 200% 后停止缩放;按钮点击无效,手势缩放回弹到边界值。
来源页参数缺失Toast 提示 页面来源已失效,并返回 tm_grading_list.html

数据需求

  • 接口:
    • 当前页提交记录列表接口:按 student_id + homework_id + current_page_no 返回当前页记录列表。
    • 提交记录详情接口:按 submission_id + current_page_no 返回当前记录当前页原卷图片。
  • 关键字段:
    • 页面上下文:homework_idstudent_idstatussource_pagecurrent_page_nocurrent_submission_id
    • 记录维度:submission_idsubmission_labelsubmit_timepage_nopage_image_url
    • 查看状态:zoom_ratiodrag_offset_yselected_submission_idconfirmed_submission_id
  • 页面状态缓存:
    • tm_grading_history_context 至少保存 source_pagestudent_idcurrent_page_noconfirmed_submission_idzoom_ratio
  • 埋点:
    • 页面浏览:记录 source_pagestudent_idcurrent_page_no、默认记录ID。
    • 工具条操作:记录 提交记录 点击、放大、缩小、返回。
    • 弹层过程:记录弹层曝光、记录项点击、确认切换、取消切换。
当前这页已经是“原型 + 页面 PRD”评审工作台。跨页面规则请维护在总览 / 全局规则文档,页面细节请直接维护右侧页面 PRD。
Review Workspace - Prototype + Page PRD