学生端 / 选择教辅
周策 老师
Prototype

学生端 · 选择教辅

补齐教辅选择页与回填逻辑。

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

选择教辅

当前文档: prds/作业管理模块/student/s_select_book.md

当前对照重点: 选择教辅
Review Hint

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

选择教辅

页面元信息

  • 终端:学生端
  • Astro 路由:/student/select-book
  • 原始 HTML:s_select_book.html
  • 来源章节:4.4.5
  • 维护规则:后续以本页面 PRD 为准;若改动影响通用规则,再同步总览 / 全局规则文档。

视觉描述

  • 原型引用:产出文档/作业管理模块/原型图/s_select_book.html
  • 页面采用学生端单列卡片布局,自上而下分为导航栏、搜索与筛选条、教辅列表区 3 个层级;头部背景为浅蓝到浅灰渐变,内容区为白底圆角卡片。
  • 顶部导航栏左侧为返回图标,中间标题固定为 选择对应的作业本,右侧仅做居中占位,不提供额外操作。
  • 搜索与筛选条左侧为胶囊型搜索框,placeholder 文案为 请输入您要查找的内容;右侧展示图标+文字组合按钮 筛选。当前原型未提供筛选弹层,按钮仅保留视觉位。
  • 教辅列表区为单列卡片流。每张卡片左侧展示教辅封面或封面占位图,封面可叠加 推荐基础性作业 等推荐标签;右侧展示教辅名称、出版社/配套教材、日期信息,右下角为主按钮 选择
  • 选择 按钮默认蓝色渐变样式;点击后按钮即时切换为灰色禁用态 已选

功能描述

  • 页面入口与默认态:
    • 页面入口:学生在 s_submit.html 切换到 纸质教辅作业 页签后,点击 点击选择需要提交的教辅 卡片进入本页。
    • 返回入口:点击左上角返回图标,回到 s_submit.html?tab=paper
    • 返回保留策略:若学生只是进入本页浏览或搜索但未重新点击 选择,返回后提交页必须保留进入前已选教辅、已拍照片和当前页签;不允许因为进入选择页而清空提交上下文。
    • 默认加载范围:仅加载当前学生身份可见且允许学生端提交的纸质教辅列表,至少按当前绑定学生、班级归属和教辅可见范围做数据隔离;不展示其他学生、教师或家长账号的教辅数据。参见 R18。
    • 默认排序:本页延续既有教辅检索与推荐链路,不新增用户可见排序控件;列表按 推荐优先 + 最近更新优先 返回。
  • 页面分区与控件交互:
    • 导航栏:
      • 左侧返回图标:点击后直接返回提交页纸质教辅作业页签,不触发二次确认弹窗;是否保留已选内容由提交页上下文恢复逻辑承接。
      • 中间标题:固定展示 选择对应的作业本,不随搜索状态变化。
      • 右侧占位:仅用于保持标题居中,不响应点击。
    • 搜索与筛选条:
      • 搜索框:
        • 文案:placeholder 为 请输入您要查找的内容
        • 检索范围:按教辅名称、出版社、配套教材做关键词模糊匹配;关键词仅作用于当前学生权限范围内的教辅结果集。
        • 触发规则:输入关键词后 300ms 防抖触发查询;点击键盘搜索键时立即触发查询。
        • 清空规则:清空输入框后,立即恢复当前默认结果集,不依赖重新进入页面。
      • 筛选 按钮:
        • 默认态:黑灰色图标+文案 筛选
        • 本期规则:按钮仅保留视觉占位,不打开筛选 Bottom Sheet、不触发新页面跳转、不改变当前列表结果。
    • 教辅列表区:
      • 列表加载:
        • 首次进入页面时展示卡片骨架屏,骨架结构与教辅卡片布局一致。
        • 正式实现采用分页加载;触底续载时保留已加载结果,避免一次性拉取全部教辅。
        • 触底加载失败时保留已加载数据,在列表底部展示 加载失败,点击重试
      • 卡片元素:
        • 封面区:展示教辅封面;如命中推荐资源,可在封面底部展示 推荐基础性作业 等推荐标签。
        • 标题区:展示教辅名称,超出 2 行省略。
        • 信息区:展示出版社、配套教材、日期;不展示个性化作业的班级、页数、题数、评级等字段。
        • 选择 按钮:每张卡片均展示;点击后按钮文案立即切换为 已选,按钮变灰并禁用,约 400ms 后返回 s_submit.html?tab=paper&selected={教辅名称}
        • 单选范围:本页一次仅允许带回 1 本教辅,不支持多选勾选、批量确认或一次带回多本教辅。
  • 页面跳转与返回逻辑:
    • 本页仅承接“选择纸质教辅”动作,不承担教辅详情查看、章节浏览、提交记录、批改结果或分析查看等跳转。
    • 点击 选择 返回提交页后,提交页需至少恢复并展示以下信息:book_idbook_namesubject_namepublisher_nametextbook_version
    • 提交页底部 提交 按钮的可用性仍由 s_submit.html 统一控制:只有“已选教辅 + 至少 1 张照片”同时满足时才可提交。参见 R03。
    • 若从本页返回提交页时检测到存在未完成上传任务,仍以 s_submit.html 的上传恢复逻辑优先,不允许本页覆盖恢复中的教辅上下文。
  • 业务规则:R03、R18。

异常描述

异常场景处理方式
教辅列表加载失败页面主体展示错误占位,文案为 教辅列表加载失败,请稍后重试,并提供 重试 按钮;顶部导航栏和搜索区仍保留可见。
学生权限范围内无可选教辅首次进入即返回空列表时,展示空状态文案 当前暂无可选择的教辅;仍保留搜索框和返回入口。
搜索无结果列表区隐藏,展示空状态文案 未找到匹配的教辅;保留当前关键词,不自动回退默认结果集。
学生点击 选择 时教辅已被下线、删除、停用或权限失效点击后先执行可用性校验;若接口返回失败,按钮不切换为 已选,页面停留当前页,Toast 提示 当前教辅已不可选择,请重新选择
网络中断搜索、续载或选择校验请求失败时,Toast 提示 网络连接异常,请检查后重试,不清空当前列表和关键词。
返回上下文恢复失败若从本页返回提交页时未能恢复原提交上下文,提交页需提示 未恢复到上次选择,请重新选择教辅,并保留当前页签在 纸质教辅作业,避免误切到个性化作业。

数据需求

  • 接口:
    • 学生可选教辅列表接口:入参包含 student_idbound_student_idclass_idkeywordpage_nopage_size;出参返回 book_idbook_namesubject_namepublisher_nametextbook_versioncover_urlupdated_atrecommend_tag
    • 教辅可用性校验接口:用于在点击 选择 时校验当前教辅是否仍可用于本次提交。
    • 教辅摘要接口:根据 book_id 获取提交页回填所需的摘要信息。
  • 状态与缓存:
    • 页面需维护 keywordpage_nosource_page=s_submittab=paper 和当前 submit_context_id,确保返回提交页后不丢失已拍图片与上下文。
    • 提交页正式实现需优先基于 book_id 回填教辅对象;若采用 URL 参数回传,仅可将名称作为展示辅助字段,不能作为唯一主键。
    • 本页不新增筛选字典缓存,筛选 按钮仅保留视觉位。
  • 埋点:
    • 页面浏览:记录入口来源、当前页签、首屏结果数量。
    • 搜索行为:记录关键词、触发方式、结果数量。
    • 筛选点击:记录 筛选 视觉位点击次数。
    • 选择行为:记录 book_idbook_namesubject_name、返回耗时。
当前这页已经是“原型 + 页面 PRD”评审工作台。跨页面规则请维护在总览 / 全局规则文档,页面细节请直接维护右侧页面 PRD。
Review Workspace - Prototype + Page PRD