meida/docs/开发任务包/F1-登录与个人页.md

F1 · 登录页与个人页

分支：task/f1-fe ｜ worktree：G:\meida-app-f1 ｜ 只改：app/entry/src/main/ets/pages/LoginPage.ets、pages/ProfilePage.ets（填桩）、ets/components/f1/（可自建） 先读《README-FE批次.md》（协作规程 + ArkTS 铁律 + API 速查），严格遵守。

目标

登录闭环与个人中心：dev-token 登录页（含 baseUrl 设置）+ 个人页（用户信息、配额卡片、登出）。

LoginPage 要求

1. 品牌区（"美搭"标题 + 一句 slogan）+ 设备标识输入框（默认值随机生成一次并 @State 记住，可改）+「进入美搭」按钮
2. 服务器地址设置：折叠区（"高级设置"）显示当前 AuthStore.getBaseUrl()，可编辑保存（setBaseUrl）——真机连开发机靠它
3. 登录流程：按钮 loading 态 → AuthStore.loginByDevToken(deviceKey) → 成功 router.replaceUrl({url:'pages/HomePage'})；失败 catch ApiError 展示 message+hint（错误横幅/对话框）
4. 已登录态进入本页时 aboutToAppear 直接跳 HomePage

ProfilePage 要求

1. 顶部：用户 ID（AuthStore.getUserId()，脱敏显示前 6 后 4）、登出按钮（确认弹窗 → AuthStore.logout() → 回 LoginPage）
2. 配额卡片：并行拉 agent_chat、tryon、report_basic 三个 GET /api/v1/quota（具名 interface 对齐速查结构；reset_at 显示"明日恢复"或日期，null=终身/月度文案区分）
3. 进度条展示 used/(limit_value+bonus_granted)，剩余数大字
4. 「最近流水」：GET /api/v1/quota/ledger?limit=10 列表（tx_type 中文映射：consume=消耗/refund=退还/system_grant=奖励；status 颜色区分）
5. 下拉刷新（Refresh 组件）可加分但非必须

验收

1. 构建门禁 BUILD SUCCESSFUL（见规程 §1 命令）
2. 无 ArkTS 铁律违规（规程 §3 逐条自查）
3. 请求全部走 ApiClient/AuthStore（不直接碰 http）
4. 单次提交，信息：feat(app): login page with dev-token flow and profile with quota cards（F1） + 正文中文说明 + 偏差说明