Neo
6f8f12314f
包含多个会话的累积代码变更： - backend: AI 聊天服务、触发器调度、认证增强、WebSocket、调度器最小间隔 - admin-web: ETL 状态页、任务管理、调度配置、登录优化 - miniprogram: 看板页面、聊天集成、UI 组件、导航更新 - etl: DWS 新任务（finance_area_daily/board_cache）、连接器增强 - tenant-admin: 项目初始化 - db: 19 个迁移脚本（etl_feiqiu 11 + zqyy_app 8） - packages/shared: 枚举和工具函数更新 - tools: 数据库工具、报表生成、健康检查 - docs: PRD/架构/部署/合约文档更新 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
61 lines
2.6 KiB
Markdown
61 lines
2.6 KiB
Markdown
# P9→NS1/RNS1 缺失项 #2：助教详情页档位进度时间轴的视觉规范
|
||
|
||
## 简要结论
|
||
- 状态：⚠️ 部分解决
|
||
- 风险等级：🟠 中
|
||
- 已实现 `perf-progress-bar` 进度条组件（含渐变填充、刻度标记、高光/火花动画），但非 P9 定义的"时间轴"样式，缺少当前档位高亮节点和升档动画。
|
||
|
||
## 详细审查
|
||
|
||
### 审查范围
|
||
- `apps/backend/app/schemas/xcx_coaches.py` — `tier_nodes` 字段定义
|
||
- `apps/backend/app/services/coach_service.py` — `_build_tier_nodes()` 实现
|
||
- `apps/miniprogram/miniprogram/components/perf-progress-bar/` — 进度条组件
|
||
- `apps/miniprogram/miniprogram/pages/coach-detail/coach-detail.wxml` — 绩效概览区域
|
||
- `apps/miniprogram/miniprogram/pages/coach-detail/coach-detail.ts` — 进度条数据构建
|
||
|
||
### 发现
|
||
|
||
1. **后端：tier_nodes 数据已返回**
|
||
- `CoachDetailResponse.tier_nodes: list[float]` 已定义
|
||
- `_build_tier_nodes()` 从配置表读取档位节点
|
||
|
||
2. **前端：进度条组件已实现，但非时间轴**
|
||
- `perf-progress-bar` 组件实现了水平进度条，含：
|
||
- 渐变填充条（`ppb-fill` + `ppb-gradient-bar`）
|
||
- 刻度标记（`ppb-ticks`，由 `ticks` 数组动态渲染）
|
||
- 高光动画（`ppb-shine`）和火花动画（`ppb-spark`）
|
||
- 当前档位高亮（`ppb-tick--done` class）
|
||
- 但这是**水平进度条**，非 P9 定义的**垂直时间轴**样式
|
||
- 缺少 P9 定义的"档位节点"（tierNodes）的时间轴展示（如里程碑节点、连接线、当前位置标记）
|
||
|
||
3. **动画已实现但非"升档动画"**
|
||
- 高光（shine）和火花（spark）是循环播放的装饰动画
|
||
- 非 P9 定义的"升档时触发的庆祝动画"
|
||
|
||
4. **前端 tier_nodes 未使用 API 数据**
|
||
- `coach-detail.ts` 中 `tierNodes` 硬编码为 `[0, 100, 130, 160, 190, 220]`，注释标注 "Mock，实际由接口返回"
|
||
- API 返回的 `tier_nodes` 未被前端消费
|
||
|
||
### 证据
|
||
|
||
前端硬编码 tierNodes：
|
||
```typescript
|
||
const tierNodes = [0, 100, 130, 160, 190, 220] // Mock，实际由接口返回
|
||
```
|
||
|
||
进度条组件刻度渲染（水平进度条，非时间轴）：
|
||
```html
|
||
<view class="ppb-ticks">
|
||
<text wx:for="{{ticks}}" wx:key="value"
|
||
class="ppb-tick {{currentTier >= index ? 'ppb-tick--done' : ''}}">
|
||
{{item.label}}
|
||
</text>
|
||
</view>
|
||
```
|
||
|
||
### 建议（如未完全解决）
|
||
1. 将前端 `tierNodes` 改为使用 API 返回的 `detail.tierNodes` 数据
|
||
2. 如需时间轴样式，新建 `tier-timeline` 组件，展示垂直时间轴（里程碑节点 + 连接线 + 当前位置）
|
||
3. 添加升档动画：当 `currentTier` 变化时触发一次性庆祝效果
|