门店手机端 · 视光档案 效果图 v3（质感重做）

图中病历数值为示意，非真实业务数据；本版只改视觉呈现，业务结构/字段与 v2 基本一致（v2 已扒自现网代码与 test 真机截图），个别字段因"字段真实性核对"发现与后端数据结构不符而做了结构性修正，见下方 changelog 第 7 条与交付报告。

本图是对 v2（store-mobile-refractive-archive-mockup-v1.html 定稿版 · 本文件旧版）的质感重做，长官原话「感觉不到圆润、那种质感」，逐帧另有 7 条具体意见。 根因诊断：v2 把渐变/色块砍干净了，但阴影和圆角也做得过于克制，卡片"贴"在背景上没有厚度。 v3 核心动作：把厚度加回来，但不把颜色加回来——圆角 18→22px、单层阴影→两层柔阴影、卡片内边距 18→20px、按钮加 44px 触控高度 + 唯一彩色阴影、字阶整体调大一档、"药丸"类控件圆角改 14px 与按钮的 999px 全胶囊拉开区分。

v2 → v3 质感重做（长官逐帧意见 7 条 + 质感系统，非业务改动）
  1. 质感系统：帧内背景 rgba(60,60,67,.12)→#F2F2F7；卡片圆角 18→22px、阴影单层 0 1px 2px 改两层 0 1px 2px + 0 10px 30px -12px、内边距 18→20px；按钮 44px 触控高度 + 唯一彩色阴影 0 6px 16px -6px rgba(47,163,124,.5)；字阶整体调大一档（卡标题 16/650→17/700，大数值 22→24，表格数字 16→17）；新增「分段标题」token（17px/700 + 左侧3px绿色竖条），全七帧统一用于卡片级/页面级标题
  2. 【意见1】示范档案标记恢复橙色徽标（长官"跟原先差不多"）：色值出自 frame1-child-list.tsx:150-186 真机代码（示范档案 #fef3c7底/#b45309字/#fde68a描边；只读 #eef4f9底/#43617a字），非自造配色
  3. 【意见2·长官特别点名要验·9-15已作废见下方 v3.1】帧②列表行"姓名+性别+年龄+生日+手机号+最近检查"实测在 360/375/390/414px 下用原写法（含手机号全号）均放不下（360px 缺口 48px）；改为手机号只显示后4位尾号掩码 + "最近检查"去标签只留日期，四档宽度实测均不再截断，且未使用任何负 letter-spacing
  4. 【意见3】帧④检查记录卡：日期 14→17px/700，"第N次"改右侧纯文字淡灰小标签（12px #6E6E73，无底色）；OD/OS 列头与首行留白 8→12px；每行 padding 9→11px；三卡间距 14→16px
  5. 【意见4】帧⑤录入页 1-8 段号标题套用新「分段标题」token（17px/700 + 绿色竖条），其余结构不动（长官原话"勉强还行"）
  6. 【意见5】帧⑥"赵阳智脑分析"重排：卡标题/门店结论标题套用「分段标题」；风险提示条改用与真实 p3_warning 字段一致的橙底样式（#fdf1e3底/#b8641f字，出自 frame4-record-view.tsx:230-239）；4L 圆点 6→8px、标题 600→650、项间 18→20px
  7. 【意见6】帧⑦趋势图：折线改三次贝塞尔平滑曲线 + 线下8%透明度面积填充；数据点只首末两点显示（白心圆+同色描边）；末端数值去实色块改同色文字+白色描边；纵横轴刻度字 9/8.5→11px；图例色块改小圆点
  8. 【意见7·字段真实性核对，结构性修正】grep refractive_record_service.py 发现赵阳智脑分析真实存储结构是 {p1_diag, p2_advice, p3_warning, plan_4l}（_try_parse_analysis_fields），前端 frame4-record-view.tsx:217-268 把 p1_diag 渲染成**单个自由文本段落**（whitespace-pre-wrap），并**不存在**独立的"综合判定"字段或按眼轴/角膜曲率/球镜拆开的三条结构化指标行——v2 的"诊断分型"三条卡片 + "综合判定"卡是虚构结构。v3 已改为单段落文本（信息不丢，用 <strong> 保留关键数值加粗，与真机 renderBold 效果一致），删除虚构的"综合判定"卡
v3 → v3.1（长官 9-15 二次拍板修订，D6/D7 + 1 处补齐）
  1. D6 分析页「和平板一样」：诊断分型段落此前用自造分段着色（蓝色术语名 + 橙色"偏长" + 绿色"轴性近视"），逐字对照真机截图 vf-tablet-05-record-view-ai.png 与 frame4-record-view.tsx:217-268 后发现真机是纯色文本、仅 renderBold 解析 **markdown** 加粗、保留原始换行——已改为四行纯文本 + 仅"轴性近视"一处加粗，与真机逐字一致；4L 呈现此前是"圆点+竖排列表"，真机（L4_STATIC 常量，line 187-192）是四色彩卡网格（badge+label+描述），已改为同结构彩卡，手机窄屏把平板 4 列改 2x2（信息结构/配色与平板一致，仅排版因窄屏调整）
  2. D7 列表手机号「不行就不显示了」：此前 v3 意见2 的"后4位尾号掩码"方案作废——那次是拿截断的掩码串测出的假"放得下"结论；9-15 改为手机号整段不展示，并用真实生产代码结构（姓名16px粗体+性别·年龄·生日12.5px+右侧最近检查+状态徽标，出自 frame1-child-list.tsx:229-244）在 360/375/390/414 四档重新真渲染实测，含示范档案卡与4字姓名压力测试，全部通过
  3. 示范档案卡补齐左侧橙色竖边：frame1-child-list.tsx:115 borderLeft:"3px solid #f59e0b" 此前效果图漏画，已补上；像素采样真机截图确认卡内底色为纯白 #ffffff，非淡橙底
v3.1 → 方案P·苹果浅色（长官拍板，色值来自长官提供方案P附件 ef5b86b4-numeric-list-card-final.html，非仓库现网扒取）
  1. 全七帧统一切换「苹果浅色」皮肤：帧内页面底色 #F2F2F7；卡片圆角 16px、去投影 box-shadow:none；主文字 #000、次文字/单位统一 #6E6E73；分隔线 rgba(60,60,67,.12)；OD 色压暗为 #177A57、OS 色压暗为 #3A6FC4（原按钮/pill/chip/分段标题竖条等品牌绿 #2fa37c 属通用强调色，非 OD 语义，未随此次换色变动，新增专用 .ap-eye-od 类与既有 .ap-green（已绑定状态等）区分）
  2. 帧④时间线卡（3张）+ 帧⑥记录查看两张数据卡 改用方案P"眼别做行、指标做列"转置排法：表头一行（空格+各指标名+单位小字）、「右」行（OD 色）、「左」行（OS 色）；每列仅装同一指标，位数相同居中天然对齐；负号统一改真减号 U+2212 −；卡片内边距改 16px 18px 12px、卡间距 16→12px
  3. 帧⑤录入页、帧⑦趋势数据表不改排法：录入页是输入控件、趋势表是"日期×OD/OS"另一种结构，均只跟随苹果浅色皮肤换色，不做转置
帧①入口
源：web/app/h5/chat/page.tsx:2998-3129（门店坐席 chip 条）
对话页底部工具条
报告秒读
历史解读
抗近领航
谣言粉碎机
近视的世界
量身定案
关于赵阳智脑
新增 web/app/h5/chat/page.tsx:2998-3129 门店坐席分支 视光档案
门禁：featureFlags.enable_refractive_record && 门店坐席(seat_type!=='parent')
帧②儿童列表
源：frame1-child-list.tsx
视光档案
返回
平板一行塞满 → 手机拆两行(搜索/新建)
搜索姓名或手机号
示范档案区 系统内置样板 · 仅供参考，不可编辑
【v3长官意见1】去底色纯文字标注 → 恢复橙色徽标（长官"跟原先差不多"）；色值出自 frame1-child-list.tsx:150-186 真机代码，非自造。【9-15 补齐】此前效果图漏画真机同款左侧 3px 橙色竖边（frame1-child-list.tsx:115 borderLeft:"3px solid #f59e0b"），已补上；像素采样 vf-tablet-01-child-list.png 卡内底色确认为纯白(255,255,255)，非淡橙底
张思源 示范档案 只读
男 · 9岁 · 2017-03-15 · 最近检查 08-01
一行塞满 → 卡片两行（姓名+绑定 / 性别年龄生日+最近检查）；补画头像（长官9-15当面提，样式同示范档案卡）。【v3长官意见2】原写法在360/375/390/414px四档实测均放不下手机号全号（360px缺48px）→ 曾改为手机号后4位尾号掩码。【9-15 D7 二次拍板"手机号不行就不显示了"】掩码方案作废：那版是拿截断手机号测出"放得下"的假结论；改成手机号整段不展示后，用真实生产代码结构(姓名16px粗体+性别·年龄·生日12.5px+右侧最近检查+状态徽标)在360/375/390/414四档真渲染复测，含示范档案卡+4字姓名压力测试全部通过，最紧的360px档最小余量仍有 +20px（详见交付报告宽度实测表）
张晓虎 未绑定
男 · 7岁 · 2019-01-01最近检查 09-02
王小甜 未绑定
女 · 8岁 · 2018-08-01最近检查 09-02
王晓芳 已绑定
女 · 8岁 · 2018-01-01最近检查 —
周思源 已绑定
男 · 9岁 · 2017-04-15最近检查 09-06
帧③建档
源：frame2-create-modal.tsx
420px 居中弹窗 → 底部 Sheet 全屏（长官"就像苹果一样简洁"：sheet 顶部去掉圆角把手条以外的多余装饰）
新建视光档案
上传头像
姓名*
请输入姓名
性别*
女 男
出生月日*
点击选择
年龄
—
家族近视史
无父亲近视母亲近视 父母均近视其他
戴镜史
无框架镜OK镜其他
家长身份
妈妈爸爸爷爷奶奶 姥姥姥爷本人其他
家长手机号
请输入手机号（选填）
身份证号
请输入身份证号（选填）
既往防控手段
光疗类远疗类眼镜类 训练类营养类其他
帧④档案详情 + 时间线
源：frame3-patient-profile.tsx

张思源
男 · 9岁 · 2017-03-15
未绑定家长
检查记录 眼轴趋势
眼轴较上次 +0.06 / +0.06 mm
12格每格挂OD/OS小标签 → 迷你表(OD/OS只在卡顶标一次+细线分隔+tabular-nums)；四格横排→2×2宫格的改动出处 frame3-patient-profile.tsx:374,384,400 不变。【v3长官意见3】三卡间距14→16px【方案P·苹果浅色】迷你表(OD/OS按列) → 转置成"眼别做行/指标做列"(表头4指标+右行+左行)，真减号U+2212，卡间距16→12px，卡片改苹果浅色皮肤(圆角16/无投影)
新增·时间线未读标记(小标签)：便于店员扫读跟进；仅门店可见（D10：家长端不显示）。【9-15 长官意见】未读的不要小金边了 → 已删除卡片左侧橙色竖边，仅保留未读小标签。【9-15 二次调整·长官反馈"已读未读不见了"】胶囊加粗字号12px+padding4/10+加1px描边rgba(184,100,31,.35)（由#b8641f低透明度描边而来，非新配色）补回视觉分量，不重新加回左侧竖边
2026-08-01 未读 第6次
裸眼视力 球镜D 眼轴mm 眼压mmHg 右 4.3 −2.00 23.57 16 左 4.4 −1.75 23.52 15
2026-05-01 第5次
裸眼视力 球镜D 眼轴mm 眼压mmHg 右 4.4 −1.75 23.51 15 左 4.4 −1.50 23.46 15
2026-02-01 第4次
裸眼视力 球镜D 眼轴mm 眼压mmHg 右 4.4 −1.50 23.46 15 左 4.5 −1.25 23.41 16
帧⑤检查记录录入
源：frame5-record-entry.tsx（本图核心改动）
张晓虎 · 第2次
两个状态标签换行到第二行裸眼 OD 未记录 · 眼轴 OD 未记录
1 视力 2 自镜 3 验光 4 基础 5 生物 6 眼部 7 视功能 8 备注
检查日期*
2026年9月15日
1 · 视力数据已完成
平板 1fr 108px 108px 写死 → 手机 minmax(84px,max-content) 1fr 1fr（共10处 L123/452/485/495/567/580/598/607/616/657）
1 · 视力数据*
小数制 5分制
右眼 OD左眼 OS
裸眼视力*必填
未记录
未记录
戴镜视力
未记录
未记录
矫正视力主觉验光后
未记录
未记录
2 · 自镜度数已完成
2 · 自镜度数
右眼 OD左眼 OS
球镜 DS(D)
未记录
未记录
柱镜 DC(D)
未记录
未记录
轴位 AX(°)
未记录
未记录
3 · 本次验光已完成 · 小瞳综合
请先选择验光方式，选好后才能 AI 识别或手动填写度数
小瞳综合散瞳散开雾视
3 · 本次验光
主觉验光数据*
右眼 OD左眼 OS
主觉球镜 DS*(D)
-2.00
-1.75
主觉柱镜 DC*(D)
未记录
未记录
主觉轴位 AX(°)
未记录
未记录
已识别并回填 6 项，请核对后提交
补漏：真机卡4「基础测量」（frame5-record-entry.tsx:594-623）本图此前漏画
4 · 基础测量眼压 · 瞳距 · 瞳高
右眼 OD左眼 OS
眼压 IOP(mmHg)
未记录
未记录
单眼瞳距 PD(mm)
未记录
未记录
单眼瞳高 PH(mm)
未记录
未记录
5
5 · 生物测量必填 · 待录入
补漏：真机卡5「生物测量」+AI识别（frame5-record-entry.tsx:631-671）本图此前漏画
5 · 生物测量*未检查项保持"未记录"
右眼 OD左眼 OS
本次眼轴 AL*(mm)
未记录
未记录
角膜曲率 K1(D)
未记录
未记录
角膜曲率 K2(D)
未记录
未记录
6
6 · 眼部检查未检查不选
补漏：真机卡6「眼部检查」眼前节/眼底/OCT 三组状态+备注（frame5-record-entry.tsx:674-724，对应后端 EyePayload anterior_segment/fundus/oct 六字段）本图此前漏画
6 · 眼部检查
眼前节 OD 未见明显异常异常
眼前节 OS 未见明显异常异常
眼底 OD 未见明显异常异常
眼底 OS 未见明显异常异常
视网膜周边轻度变薄
OCT OD 未见明显异常异常 未检查 → 都不选
OCT OS 未见明显异常异常 未检查 → 都不选
7
7 · 视功能检查选填
补画（长官9-15当面提"视功能好像没显示出来"）：真机卡7「视功能检查」原样整卡复用 AdvancedVisionSection （web/app/h5/tablet/pane/panes/refractive-record/advanced-vision-section.tsx）；字段与分段名物理来源同文件 + app/models/refractive_record.py:245-299 RefractiveRecordVisualFunction，未自造字段；配色仍走本图绿系，不搬真机该组件原有紫色调（色系统一铁律）
7 · 视功能检查选填 · 没做留空
本次已做 本次未做
双眼视觉融合与立体视 · 展开态
按标准戴法：右眼红片 / 左眼绿片
Worth 远
4点·融合5点·复视 2点·左眼抑制3点·右眼抑制其他
Worth 近
4点·融合5点·复视 2点·左眼抑制3点·右眼抑制其他
立体视 有无
400″200″ 100″60″其他
以下 4 段为折叠态示意（真机点击可展开；字段来源同上，未逐项画出以控制篇幅）
眼位与 AC/ADLP/NLP/DVP/NVP · AC/A
遮盖试验远/近 UCT + ACT
融像与集合PFC/NFC/NPC 破裂·恢复
调节功能 & 评估NRA/PRA/BCC/AMP · 6选
8
8 · 本次检查备注选填
补漏：真机卡8「本次检查备注」（frame5-record-entry.tsx:741-748，纯文本域、无占位提示文案）本图此前漏画
8 · 本次检查备注
还差 1 项：左眼眼轴
帧⑥记录查看
源：frame4-record-view.tsx
张思源 · 第6次
2026-08-01 · 小瞳综合
该记录已完成（2026-08-01 02:00）· 检查数据修改后家长端同步更新；门店结论需单独点击「推送给家长」
智脑分析 门店结论 检查数据
【v3长官意见5+7·结构性修正】卡标题套分段标题token；诊断分型三条虚构指标卡+综合判定卡 → 单段落文本(真实p1_diag数据形状，见交付报告字段真实性核对)；风险提示改真实p3_warning橙底样式（诊断分型段落写法与4L呈现 9-15 二次订正，见下方内层标注）
赵阳智脑分析
仅门店可见 重新生成
本次分析 历次对比
9-15 长官拍板 D6「和平板一样」：此前自造分段着色(蓝色术语名+橙色偏长+绿色轴性近视)与真机 renderBold 渲染(仅 **markdown** 加粗、同色纯文本、保留原始换行)不符，已改为纯色 + 保留换行 + 仅综合行加粗「轴性近视」，文案/换行逐字对照 vf-tablet-05-record-view-ai.png 真机截图
诊断分型

眼轴: 23.57/23.52mm → 偏长(超同龄均值 +0.57/+0.52mm) K1/K2(角膜曲率): 42.10/43.55D → 正常范围(41‑45D) SPH(球镜): -2.00D/-1.75D → 低度近视 综合: 轴性近视(眼轴增长主导)

白话解释

孩子目前属于低度近视，右眼约200度，左眼约175度。眼球长度比同龄孩子平均长了0.5mm左右，这是近视的主要原因。建议尽快配戴DOT离焦镜(周边离焦框架镜)进行光学矫正，以延缓眼轴进一步拉长。日常需保证每日2-3小时户外阳光下活动，或使用全光谱台灯改善室内光照。每3个月复查眼轴和角膜曲率，监测近视进展速度。

本次检查未见需即刻处理的风险项，仍建议按期复查。角膜散光在正常范围内，无需特殊干预。
9-15 长官拍板 D6「和平板一样」：此前「圆点+竖排列表」写法与真机 frame4-record-view.tsx:241-258 的 2x2 彩色卡片网格(badge+label+描述)不符，已改为同结构彩色卡片；手机窄屏把平板 4 列改 2x2(排版为窄屏调整，信息结构/配色与平板一致)
4L 防控方案
L1Laser 光疗

建议每日使用弥散透射红光治疗仪，每次15分钟，安全剂量RRE≤3J/cm²，辅助延缓眼轴增长。

L2Light 补光

改造室内光环境，使用Ra>95全光谱台灯，桌面照度900-1500lux，模拟阳光光谱，补充光营养。

L3Long 远像

使用远像设备进行雾视训练，配合读写台保持33-40cm视距，主动制造远像，缓解睫状肌疲劳。

L4Lens 镜片

配戴DOT离焦镜(周边离焦框架镜)矫正视力，利用周边离焦信号抑制眼轴增长，需全天佩戴。

此为AI建议非医疗诊断，以医生面诊和门店实际检查数据为准
与上次对比 近半年 近一年 全部历史
对比 2026-05-01 → 2026-08-01 · 隔 92 天
项目基准本次变化
右眼眼轴23.5123.57+0.06mm
左眼眼轴23.4623.52+0.06mm
右眼球镜−1.75−2.00−0.25D
左眼球镜−1.50−1.75−0.25D
AI 判读与建议
趋势判读

本次与上次检查间隔较短，眼轴变化在0.1mm误差阈值内，提示眼轴增长暂时稳定。然而球镜度数双眼均加深0.25D，显示屈光状态仍在进展。需警惕眼轴稳定期可能伴随的调节滞后，建议结合日常视功能检查，确认离焦镜佩戴是否规范，避免度数波动。

方案调整

维持现方案。眼轴增长已得到较好控制，继续执行L1红光治疗以巩固疗效，L4离焦镜需确保全天佩戴以维持周边离焦信号，无需调整其他层级。

此为AI建议非医疗诊断，以医生面诊和门店实际检查数据为准
9-16 二次调整：「另一种状态」脚手架文案移出手机框，改为帧外「状态对照」小区块；已读态改做与未读同形不同色的胶囊（形状对齐、颜色区分轻重），绿色复用图内「已绑定」标签色值 #2fa37c，不新配色
状态对照：门店结论推送后的两种状态
家长未读 家长已读于 08-02 09:15
Tab2 / Tab3 内容预览（静态图用 display:none 折叠未选中 Tab；内容与改造前完全一致，未做任何修改）
Tab2 · 门店结论
门店结论

家长您好，这是思源本次复查的结果。孩子这次眼轴右眼 23.57mm、左眼 23.52mm……（全文见源码，未改动）

Tab3 · 检查数据
1 · 视力数据
裸眼 4.3/4.4 · 戴镜 5.0/5.0 · 矫正 5.0/5.0（另 7 张数据卡见源码，未改动）
9-16 结构性修正：帧⑥「智脑分析」面板此前误画两张标题相同的并列分析卡（第二张放"历次对比"），真机是一张卡+卡内两个子Tab；已改回一张卡，"历次对比"整块移入卡内隐藏面板（内容未改一字），此处补一块缩略预览
卡内 Tab：历次对比 内容预览（智脑分析卡内的第二个子 Tab，静态图用 display:none 折叠未选中态；内容与改造前完全一致，未做任何修改）
子Tab · 历次对比
历次对比
对比 2026-05-01 → 2026-08-01 · 隔 92 天 · 右眼眼轴 +0.06mm（完整表格与 AI 判读见源码，未改动）
帧⑦眼轴趋势
源：trend-chart-dialog.tsx
检查记录 眼轴趋势
趋势对比
裸眼视力 等效球镜 眼轴
OD 右眼 OS 左眼
【v3长官意见6】直线折线 → 三次贝塞尔平滑曲线+8%面积填充；数据点只首末两点(白心圆+同色描边)；末端数值去实色块改文字+白描边；轴刻度9/8.5→11px；图例色块改小圆点 23.7 23.5 23.3 23.1 25/05 25/08 25/11 26/02 26/05 26/08 23.57 23.52
按检查日期连续展示；缺测日期自动断开。
4列表 → 3列+次行（验光方法降到检查日期下方小字）
检查日期OD 右眼(mm)OS 左眼(mm)
2025-05-01小瞳综合23.2023.15
2025-08-01小瞳综合23.3023.25
2025-11-01小瞳综合23.4023.35
2026-02-01散瞳23.4623.41
2026-05-01小瞳综合23.5123.46
2026-08-01小瞳综合23.5723.52
以上均为已完成记录的事实数据，不构成任何医学结论。