# 页面名:notes(备注记录) > PRD 参考:P6 `docs/prd/specs/P6-miniapp-fe-tasks.md`;`apps/miniprogram/doc/prd.md` 第十一节 > 已实现:否 ## 页面说明 展示用户所有备注记录,支持按 Tab 切换「客户备注」和「助教备注」两个分类。 ## 状态变量 | 变量名 | 类型 | 初始值 | 说明 | |--------|------|--------|------| | activeTab | string | "customer" | 当前 Tab(customer/coach) | | customerNotes | array | [] | 客户备注列表 | | coachNotes | array | [] | 助教备注列表 | | loading | boolean | true | 数据加载中 | | error | boolean | false | 加载失败 | ## 用户操作 → 响应 | 操作 | 触发条件 | 响应行为 | 目标状态 | |------|----------|----------|----------| | 页面加载 | 进入页面 | GET /api/xcx/notes | loading→false | | 点击"客户备注" Tab | activeTab≠customer | 切换显示客户备注列表,隐藏助教备注 | activeTab=customer | | 点击"助教备注" Tab | activeTab≠coach | 切换显示助教备注列表,隐藏客户备注 | activeTab=coach | | 点击返回 | 顶部导航栏 | navigateBack | — | | 点击"重试" | error=true | 重新请求数据 | loading=true | ## Tab 切换(忠于原型 HTML) - 两个 Tab:客户备注(`id="tabCustomer"`)/ 助教备注(`id="tabCoach"`) - 切换时互斥显隐对应列表容器(`id="customerNotes"` / `id="coachNotes"`) - 由 `notes.js` 的 `switchTab(tab)` 控制 ## 列表展示规则 - 按时间倒序(由近到远)平铺 - 每条记录:备注全文 + 关联对象(客户/助教)+ 创建时间 - 不进入详情页,本页即为详情展示 ## 页面状态枚举 | 状态名 | 视觉表现 | 触发条件 | |--------|----------|----------| | 加载中 | 区域文案"加载中..." | loading=true | | 正常态 | 备注列表 | 有数据 | | 空数据态 | "暂无数据" | 当前 Tab 列表为空 | | 错误态 | "加载失败,请点击重试" + 重试按钮 | error=true | ## 后端 API 依赖 | API | 方法 | 说明 | |-----|------|------| | `GET /api/xcx/notes` | GET | 获取备注列表(含客户和助教两类) | ## 页面导航 - 来源:my-profile(点击"备注记录") - 去向:无(末端页面) ## 全局组件 - 自定义顶部导航栏(返回按钮 + "备注记录") - AI 悬浮按钮