屈光手术诺莫图管理系统

产品实际界面

WorkBuddy 完整复刻提示词

将下方指令复制到 WorkBuddy；生成结果与所用版本、模型和配置有关，请按实际环境检查。不要在指令中填入真实密钥或敏感业务数据。

## 角色

你是一名屈光手术临床工程专家 + 资深前端工程师，为眼科屈光手术中心搭建一个「屈光手术诺莫图管理系统」。它把病例数据收集、术后效果分析、诺莫图（Nomogram）回归拟合与版本管理、双眼激光器参数计算、手术参数单输出整合进一个网页应用，帮助医生用真实术后随访数据持续修正个性化矫正模型。

硬性要求：

1. **所有功能必须真实可操作**，不允许出现点了没反应的按钮、写死的假界面、只有标题没有内容的空卡片。
2. **所有计算必须真实**：等效球镜、线性/二次最小二乘回归、决定系数 R²、Pearson r、RMSE、顶点距离换算、诺莫图反算，全部用纯 JS 实现，禁止假数据假装算过。
3. **医学严谨性**：计算结果页必须带免责声明（"参数需由主刀医师复核确认后方可用于设备输入；本系统计算结果不替代临床判断"）；缺少术后随访数据的眼不得参与回归拟合。
4. **零依赖**：不引入任何 CDN、框架、图表库；图表用原生 Canvas 2D 手写；数据存 localStorage。
5. **内置自检**：系统自带一套可实际执行的单元测试页面，对公式做对拍验证。

---

## 一、界面与视觉规范

- **深色专业风**（医疗数据系统）：页面底色 `#0b1017`，面板 `#141d28`/`#19232f`，边框 `#26333f`，正文 `#e6edf3`。
- 主色 `#3b9dff`（蓝），辅助 `#22d3b6`（青）、`#f5b544`（琥珀）、`#ff6b6b`（红）、`#3ecf8e`（绿）、`#a78bfa`（紫）。图表调色板固定 8 色。
- 布局：**顶部水平导航条**（高 58px：Logo 渐变方块 + 应用名 + 5 个模块 Tab + 右侧当前诺莫图 chip 与操作按钮）+ 主内容区 + **底部状态栏**（26px：实时显示系统状态、当前版本、数据量）。
- 字体 13px 微软雅黑/PingFang SC；数值用等宽字体（Consolas）展示回归方程与系数；带符号数值统一显示正负号（如 +0.25 / -4.50）。
- 内容节奏：页头（标题 + 副标题 + 右侧操作按钮组）→ 筛选/表单面板 → 图表卡片网格 → 明细面板。面板 = 白描边深色圆角卡片（8px 圆角 + 深阴影）。
- 交互反馈：操作后右上角 toast（成功绿/信息蓝/错误红，1.8~3 秒自动消失）；删除与覆盖类操作一律弹确认 Modal（红色危险样式需二次确认）；表单走 Modal 或面板内联。
- 顶点距离 VD、R² 等关键参数在结果卡中加粗高亮。

---

## 二、技术架构（按此分层，文件名前缀决定拼接顺序）

```
template.html        HTML 骨架 + 占位符 /*__CSS__*/ 与 /*__JS__*/
build.py             构建脚本：把 src/*.css 与 src/*.js 按文件名前缀排序拼接，
                     注入模板占位符，产出「屈光手术诺莫图管理系统.html」单文件
src/
  00-style.css       全部样式（CSS 变量定义配色）
  10-core.js         App 命名空间、工具函数 U（uid/esc/round/CSV 解析/下载等）、
                     默认配置（字典/字段映射/报告模板）、演示数据（mulberry32 确定性随机）、
                     状态管理 App.Store（localStorage 读写 + 状态栏）
  20-math.js         算法层 M：等效球镜、计划/实际矫正量、样本点抽取、
                     线性+二次最小二乘拟合（高斯消元解正规方程）、预测/反算、
                     顶点距离换算、诺莫图构建、8 维筛选、直方图/分组/月度统计
  30-charts.js       图表引擎 C：纯 Canvas 2D，散点/柱状/折线/直方图，
                     devicePixelRatio 适配，坐标轴 nice 取整，PNG 导出
  40-ui.js           通用 UI：data-act 事件委托、Toast、Modal、Esc 关闭、roundRect polyfill
  50-collect.js      模块 01 收集数据
  60-analyze.js      模块 02 分析数据
  70-create.js       模块 03 创建诺莫图
  80-select.js       模块 04 选择诺莫图
  90-settings.js     模块 05 系统设置
  95-tests.js        模块 06 内置自检（可执行单元测试）
  99-app.js          启动入口：加载/初始化、全局错误捕获、10 分钟定时备份
tests/               Node 冒烟测试 + math.test.js + 截图脚本（开发期用）
```

约定：

- 持久化键名 `refractive_nomogram_db_v1`，定时备份键 `refractive_nomogram_db_v1_bak`（每 10 分钟快照一次，存储满时静默跳过，手动备份始终可用）。
- 数据对象 `App.state = { cases, nomograms, activeNomogramId, calcLogs, dictionaries, fieldMap, report, settings }`；UI 瞬态放 `App.ui`（选中病例、筛选器、临时区等），不持久化。
- 渲染 = 各视图 render() 返回 HTML 字符串；事件全部用 `data-act` 委托到 `App.handlers`，禁止散落的内联 onclick。
- 所有用户输入进入 HTML 前必须经 `U.esc()` 转义。
- 首次启动载入约 40 例确定性生成的演示病例（mulberry32 固定种子），并 toast 提示可导入真实数据或重置。

---

## 三、顶部导航与 5+1 个模块

```
01 收集数据    病例库 · 双眼屈光录入 · 数据导入
02 分析数据    多维筛选 · 回归散点 · 统计图表
03 创建诺莫图  拟合工作台 · 参数开关 · 版本保存
04 选择诺莫图  版本应用 · 双眼参数计算 · 参数单打印
05 系统设置    字典 · 导入模板 · 报告模板 · 备份
06 系统自检    内置单元测试（在系统设置内提供入口，逐项可执行）
```

---

## 四、各模块功能细则

### 模块 01 收集数据

- **三栏布局**：左侧病例列表面板（搜索框按姓名/病历号/日期过滤、按手术日期倒序、「＋ 病例数据导入」按钮、选中高亮）；中部患者信息面板 + 双眼屈光数据面板 + 激光器输入值面板；右侧辅助信息。
- **患者信息**：姓名、性别/年龄、病历号、手术日期、主刀医生、激光器、治疗术式（SMILE / FS-LASIK / TransPRK / LASEK / ICL）、屈光不正类型（单纯近视 / 近视伴散光 / 远视 / 远视伴散光 / 混合散光）。
- **OD/OS 双眼录入**（左右眼各一组）：球镜 sph、柱镜 cyl、轴向 axis、目标屈光度 target、术后球镜 postSph、术后柱镜 postCyl、术前视力 preVa、术后视力 postVa。所有数值输入即时校验（轴向 0~180 等），改动后保存按钮高亮。
- **病例数据导入**：弹窗支持粘贴/上传 CSV 或 TSV，自动识别分隔符；按「字段映射模板」匹配表头别名（多别名竖线分隔、忽略大小写与首尾空格）；导入预览（逐列识别成功/失败标记）→ 确认入库；提供「下载 CSV 模板」。
- **打印**：输出单例病例核对页。

### 模块 02 分析数据

- **筛选器（8 类基础 + 3 类高级）**：主刀医生、激光器、治疗术式、屈光不正类型、性别、年龄上下限、术前 SE 上下限、手术日期起止；高级折叠区：检查次数上下限、术后视力下限、「仅完整随访」（排除缺少术后数据的病例）。显示「已启用 N 项条件」徽标 + 一键重置。
- **核心散点图**：计划矫正量（x）vs 实际矫正量（y），叠加当前拟合曲线与 45° 参考线，标注 n 眼数；支持 PNG 导出。
- **双眼视力 4 图**：各术式双眼术后视力均值（OD/OS 对比）、屈光度区间双眼术后视力（按术前 SE 分组）、双眼术前 vs 术后视力均值对比、双眼术后视力差值分布（OD − OS）。
- **统计 6 图**：① 治疗术式分布（横向柱状）② 术前等效球镜分布（直方图 12 bins）③ 医生手术量 ④ 术后视力 ≥1.0 达成率（按术式，百分比）⑤ 月度手术量趋势（折线）⑥ 检查次数分布。
- 所有图表响应式重绘，随筛选条件实时联动。

### 模块 03 创建诺莫图

- **双区布局**：左侧「工作区域」散点图 + 拟合参数卡，右侧「临时区域」可做对比试验（改参数立即在临时区重算，不影响工作区）。
- **目标量切换**：等效球镜 SE（sph + cyl/2）或柱镜 CYL（取绝对值建模）。
- **参数开关（Switch）**：二次回归（y = a + b·x + c·x²）、轴向对齐等，开关切换后自动重拟合。
- **拟合呈现**：回归方程（等宽字体、4 位小数）、R² 决定系数 / Pearson r、RMSE (D)、样本量 n 眼、样本 X 范围 (D)、顶点距离 VD。
- **样本阈值保护**：低于设置的最小样本量（默认 20 眼）时禁止保存并 toast 警告。
- **保存 / 导出 / 对比**：保存为命名版本（自动带版本号与创建时间）；导出诺莫图 JSON；支持两版本并排对比关键系数。
- **实时模式**：开关开启时筛选条件或参数变化即时重算（缓存 key 判断 dirty）。

### 模块 04 选择诺莫图

- **版本选择器**：下拉列出全部诺莫图（名称 + 版本号 + 创建日期），激活后右上角 chip 同步显示。
- **双统计卡**：SE 模型卡与 CYL 模型卡并排，展示回归方程、系数 a/b/c（二次项未启用显示 —）、R²、r、RMSE、样本量、样本范围、VD。
- **双眼参数计算**：输入目标矫正量后，用诺莫图反算 `x = inverse(y = T)` 得到镜架平面矫正量，再经顶点距离换算到角膜平面（VD 默认 12mm），输出双眼各自应输入激光器的带符号参数。
- **回填与留痕**：「回填激光器参数」把计算结果写回病例并写入计算留痕（时间、操作员、诺莫图版本、输入/输出参数）；留痕可导出、可清空（危险确认）。
- **版本维护**：「按当前条件重拟合」用当前筛选集重算并覆盖为新版本号（历史留痕不受影响）；「另存新版本」fork。
- **打印手术参数单**：按打印模板（医院名、标题、页眉说明、参数表、页脚签名栏、免责声明开关）输出，可与所选诺莫图版本关联追溯。

### 模块 05 系统设置（7 个 Tab）

1. **基础字典维护**：医生、激光器、治疗术式、屈光不正类型 4 组字典，pill 标签增删。
2. **数据源与导入模板**：24 个系统字段的表头别名映射表（如 `odSph: 'OD球镜|右眼球镜'`），可编辑、保存、恢复默认、下载 CSV 模板。
3. **打印与报告模板**：医院名称、报告标题、页眉、页脚签名栏、免责声明开关与文案。
4. **基础参数**：最小样本量（默认 20）、顶点距离 VD（默认 12mm）、操作员姓名、小数位数、自动备份开关。
5. **备份与恢复**：导出完整 JSON、导入恢复、定时备份快照的手动恢复。
6. **数据管理**：病例列表清理、重置演示数据、清空全部数据（三重确认）。
7. **关于系统**：版本、架构说明、算法说明、免责声明。

### 模块 06 内置自检（95-tests.js）

系统内置**可实际执行**的测试用例，每项显示通过/失败与实测值：

- localStorage 写入/回读、演示数据结构完整性（双眼字段 + 日期格式）
- 等效球镜公式对拍（sph -4.00 + cyl -1.00 / 2 = -4.50 D）
- 线性回归对拍（y = 2x + 1 精确还原系数，R² → 1）
- 二次回归对拍（y = 0.5x² − 2x + 1 精确还原 a/b/c）
- 顶点距离换算对拍、诺莫图反算往返一致性、CSV 解析转义、筛选统计等
  全部通过才视为「可上线」，并在页面给出整体结论徽标。

---

## 五、算法与公式（必须精确实现）

```
等效球镜    SE = sph + cyl / 2
计划矫正量  planned  = SE术前 − 目标屈光度
实际矫正量  achieved = SE术前 − SE术后
回归模型    线性 y = a + b·x；二次 y = a + b·x + c·x²
            最小二乘正规方程 + 高斯列主元消元求解
质量指标    R²（决定系数）、Pearson r、RMSE、样本量 n、X 范围
诺莫图反算  给定目标矫正量 T，解 y(x) = T 得镜架平面矫正量（二次取有效根）
顶点距离换算 F(角膜平面) = F(镜架平面) / (1 − d · F(镜架平面))，d = VD(mm)/1000
            （负值矫正量时换算量小于绝对值，此物理特性必须保留）
样本规则    任一眼缺少术后球镜/柱镜数据 → 该眼不进入回归样本；CYL 建模时
            x = |术前柱镜|，y = |术前柱镜| − |术后柱镜|
```