yuxuanhui
3.5 KiB
3.5 KiB
选股模块图表展示实施计划
1. 后端图表详情用例与契约
- 在 selection application 层新增
GetSelectionChart及具名返回模型，复用MarketDataReader.load_history和compute_kdj，在完整目标日前历史上计算后截取末尾最多 250 点。 - 为用例补充单元测试，覆盖升序输出、目标日截断、超过 250 点、KDJ 对齐、空历史和可空值。
- 在 selection HTTP 层新增
GET /stocks/{ts_code}/chart的 Pydantic response model、依赖组合和错误映射。 - 扩展 HTTP 测试，覆盖成功、404 空行情、503 存储错误、日期参数校验和完整响应字段。
2. 最佳案例契约与静态资源
- 调整
_pattern_score_response，让below_threshold与matched一样返回真实 value/case/breakdown，同时保留状态与阈值语义；补充后端 HTTP 测试。 - 将用户提供目录中的十张 JPG 复制到
zhixing-web/public/patterns/b1-cases/，保留文件名，并核对十个 case id 均有且仅有一个资源。 - 在 selection feature 中新增穷举案例图片映射和展示组件；测试断言匹配和低于阈值时详情恰有一张
<img>，其src、案例名称和分数来自同一个case.id，并覆盖未知案例、图片加载失败、score: null未评分和评分失败状态。
3. 前端详情数据链路
- 在
selection.types.ts定义图表响应类型，在selection.api.ts增加同源详情请求，在selection.query.ts增加包含股票代码和目标日的 query key/hook，并传递AbortSignal。 - 为 API URL 编码、查询参数和 query 启用条件补充窄测试。
- 在工作台/详情组件中接入图表 query，保证选择切换不会显示旧股票数据，并呈现加载、错误、空数据和成功状态。
4. ECharts 复合图表与布局
- 用 pnpm 添加
echarts运行时依赖并更新 lockfile，不引入 React wrapper。 - 新增 option 纯构造函数和图表组件；按需注册 candlestick、bar、line、grid、tooltip、legend、dataZoom、Canvas renderer，绑定三组 grid/axis/series。
- 实现最多 250 点、用 category
startValue/endValue精确显示最后 120 点（不足时全量）的 inside + slider 同步缩放，以及 ResizeObserver resize 和卸载 dispose。 - 用纯函数测试锁定
[open, close, low, high]顺序、volume/KDJ 对齐、缺失 OHLC 不绘制蜡烛、空 KDJ 不跨点连线、三个 xAxis 索引和精确 120 点初始范围；页面行为测试断言可见状态与可访问名称。 - 从
md双栏断点起将 grid 统一改为左1fr、右3fr，移除lg的旧比例覆盖并保持移动端现有记录卡行为；在图表正下方展示最佳案例 JPG，再展示评分分解和关键指标。
5. 验证与回滚点
- 运行后端窄测试：
uv run --directory zhixing-server pytest tests/unit/selection tests/test_selection_http.py -q。 - 运行前端窄测试：
pnpm --dir zhixing-web test -- selection，并运行pnpm --dir zhixing-web typecheck。 - 运行完整质量门禁：
./dev.sh check、./dev.sh test，再运行pnpm --dir zhixing-web build验证产物。 - 使用本地页面核对 1:3 布局、药明康德/方正科技案例图、股票切换、缩放同步和详情滚动；当前数据库未用于验收，已使用确定性 Mock API 与真实浏览器核对。
- 回滚前先确认无数据库迁移；按“HTTP/用例、前端 query/组件、静态资产与依赖、grid class”顺序撤销即可恢复旧行为。