网报小程序 — 校区详情 — 产品需求说明书

版本 V1.5 更新 2026-08-06 归属:二期(M2 · 首页-附近校区-校区详情,2026-07-30 技术可上线) 全局规则引用:01-全局通用规则.html
一、校区详情主页(原生) 5 区块 + 3 隐藏模块

模块说明:校区详情页原生改造,归属二期。来源:20260917网报三期功能梳理.xlsx 三期计划表「首页 → 配置-附近校区 → 校区详情:校区显示配置(1pd)/ 校区信息(地址、电话、图片)(2pd)」(原生 P1)+ 网报3.0升级设计稿-20260804。

1.1 主页结构(校区详情.png)
校区详情主页

页面结构(自上而下 5 区块)

区块内容来源
① 校区 Banner大图轮播/单图(校区环境照),左下角叠加校区名(如"天河区华港")校区信息·图片(TMS/后台配置)
② 位置 + 电话定位 icon + 校区地址(如"华港商务广场");右侧橙色电话 icon → 弹电话确认弹窗(1.2)→ 拨打校区信息·地址/电话
③ 校区介绍文案框浅橙底介绍文案(如"校区提供学习咨询、报名缴费、调课转班等业务咨询,为学生提供专业的授课服务。")+ 吉祥物插图校区显示配置
④ 精选服务科目标签行:「推荐」(实心橙,默认选中)/ 编程 / 文学美育 / 多元思维 / 双语…,点击筛选下方课程列表校区显示配置
⑤ 课程列表课程卡片:类型标签(线下橙/在线粉)+ 课程名 + 老师头像组 + 价格「¥XXX 起」;右侧悬浮「客服」按钮该校区在售课程(复用 04 课程卡片样式)

隐藏模块

  • 校区详情页隐藏「介绍(校区简介/交通路线)、评价、师资」3 个模块,9 月版本不展示(对应旧 H5 校区详情代码中实际隐藏配置)
  • 注:2026-08-04 企微讨论记录 15.9 中"之前文档表格写的班次列表/指导员详情"为笔误,以本条裁定口径为准(原表格不再维护)

交互规则

  • 点击课程卡片 → 课程详情(06-课程详情)
  • 精选服务标签切换 → 课程列表按科目筛选
  • 客服悬浮按钮 → 客服会话(客服入口规则以现行口径为准)
二、状态与异常 2 态
2.1 无照片态与电话弹窗(校区详情-无照片.png / 校区详情-电话弹窗.png)
校区详情-无照片
校区详情-电话弹窗

状态说明

状态表现
校区未配置照片Banner 区展示缺省占位(图「校区详情-无照片.png」),其余区块正常
电话弹窗点击电话 icon → 底部/中部弹窗展示校区电话号码 + 拨打/取消

异常与兜底

三、入口与跳转 3 入口
联想推荐进入校区详情
校区详情空状态

入口清单

入口说明
首页 · 附近校区列表excel「配置-附近校区:根据首页城市显示校区 / 从近到远排序 / 校区列表」(原生 P1,原列于三期计划表,2026-08-05 用户裁定归属二期)→ 点校区卡片进本页
课程详情 · 所属校区课程详情校区信息点击跳本页(如有入口,以 06 现行规则为准)
老师详情 · 所属校区老师详情校区信息点击跳本页(如有入口,以 06 §1.6 现行规则为准)
设计稿图说明:「点击联想推荐-进入校区详情 / 校区详情-空状态」2 图为设计稿提供的「搜索联想 → 校区详情」跳转示例;但 2026-08-05 用户裁定搜索联想不增加校区类型(见 三期/11-搜索),故此入口不实现,图仅承载校区详情空态样式参考。另「点击联想推荐-进入班次列表 / 进入老师详情」2 图对应的老师/班次联想跳转以 11-搜索现行规则为准。
四、修订记录(V1.5 / 2026-08-06)
修订项修订内容期数依据来源日期
流程注清理删除「原待确认清单 N 已闭环」「用户裁定归属/承载/迁入」等闭环与归属性流程注,保留裁定结果内容与来源依据注二期用户裁定 2026-08-062026-08-06
红框标注校准按 PIL 图像测量 + 读图目检校准 1 处部件级红框位置:修正弹窗/toast/列表区域框错位,叠加弹窗图(输错 1/2)改框整组弹窗区,同页面不同状态截图确认沿用同参数二期PIL 测量校准 2026-08-052026-08-05
图组布局规则统一依 00 V1.10 新布局规则:同层级多图(同图不同状态/图+弹窗/同流程步骤)一律横排,每张统一 280px 宽(uniform),容器横向滚动查看(细滚动条常显 + 右侧渐变提示防漏看);本页 2 个图组统一改造,half/third 混宽与多图竖排旧规则废止二期用户裁定 2026-08-052026-08-05
异常兜底事实核查清理删除「电话弹窗 → 拨打(系统拨号)」中拨号方式描述(核查项 K6,图仅有弹窗,拨号方式无据);删除「课程列表为空 → 空状态(复用全局空状态样式)」(核查项 K7,无空态设计稿、全局规则无空状态条款),待有依据后写回二期portal-vue 源码 grep 核查 2026-08-052026-08-05
期数迁移用户裁定确认校区详情原生改造归属二期,覆盖 excel 三期计划表原归属;页面自 三期/ 迁入 二期/,侧边栏 / 首页卡片 / 00 目录结构同步更新;下方建页行所记「口述与 excel 不一致已登记待确认」差异闭环二期用户裁定 2026-08-052026-08-05
建页:校区详情原生改造按用户裁定(原待确认清单 9)将校区详情 3 图(校区详情/无照片/电话弹窗)+ 联想推荐校区 2 图承载为独立页;5 区块结构 + 隐藏介绍/评价/师资 3 模块(原待确认清单 2 闭环);期数归属以 excel 三期计划表为准(首页-附近校区-校区详情,原生 P1),用户口述"二期"与 excel"三期"不一致已登记待确认三期网报3.0升级设计稿-20260804 + 20260917网报三期功能梳理.xlsx + 用户裁定 2026-08-052026-08-05