wm
2117225cbb
- navbar 背景由半透明渐变(rgba 0.55~0.92)改为实色不透明渐变(#0B0F0E→#0E1412)，杜绝 sticky 滚动时内容透视 - filter-bar 内联取消横滑铺全部：收起态只展示最多 3 个选中 chip + 末尾『全部类型』按钮，点击才展开面板陈列全部(选中置顶) - 单选点已选 chip 打开面板切换；多选点已选 chip 直接移除；超出 3 个显示 +N
FITCOACH 微信小程序（前端）
高端暗金风格（dark luxe）的健身动作推荐小程序。所有数据来自 NestJS 后端 API。
设计系统
设计令牌定义在 app.wxss 的 page 选择器（CSS 变量）：
- 背景
#0E1110、表面#171C19、金#D9B36C、次强调#58C9B9 - 圆角
--radius:28rpx、发丝分隔线--line、阴影--shadow - 图标统一使用 emoji + CSS 渐变（不依赖二进制图片资源）
配置
打开 config.js：
module.exports = { BASE_URL: 'http://localhost:3000' };
- 本地调试：填写电脑局域网 IP，如
http://192.168.1.10:3000 - 真机/发布：必须改为 HTTPS 且已在小程序后台配置为 request 合法域名
运行
- 微信开发者工具 → 导入项目 → 选择本目录（AppID 可用测试号）
- 本地调试可在「详情 → 本地设置」勾选「不校验合法域名、TLS 版本以及 HTTPS 证书」
- 编译预览
页面
| 页面 | 文件 | 说明 |
|---|---|---|
| 首页 | pages/index |
Hero + 快捷入口 + 精选轮播 + 官方计划分级入口 + 按部位/器械浏览 |
| 分类浏览 | pages/category |
按 dimension(bodyPart/equipment/target/type/muscleGroup) 筛选列表 |
| 智能推荐 | pages/recommend |
选目标肌群（按部位分组）+ 可选器械 → 评分排序结果 |
| 动作详情 | pages/detail |
GIF + 中文步骤 + 主要/协同肌群 + 收藏按钮 + 加入计划 + 相关推荐 + 分享 |
| 官方计划 | pages/collection |
按水平分级（新手/进阶/高级/全阶段）的官方推荐计划列表 |
| 计划详情 | pages/collection-detail |
官方计划动作列表 + 收藏/一键导入我的计划 |
| 搜索 | pages/search |
模糊搜索；mode=select 时用于向计划添加动作 |
| 我的 | pages/profile |
个人中心：登录态、资料编辑、收藏/计划统计、菜单入口 |
| 收藏动作 | pages/favorites |
我收藏的动作，可管理移除 |
| 我的计划 | pages/my-plans |
计划列表，新建/进入 |
| 编辑计划 | pages/plan-edit |
新建/编辑计划（名称/描述/图标/主题色） |
| 计划详情 | pages/plan-detail |
我的计划动作管理（增删/编辑/删除） |
| 收藏计划 | pages/plan-favorites |
我收藏的官方计划 |
用户体系
- 登录：
utils/auth.js封装wx.login → POST /api/auth/login；后端未配WX_APPID时走开发降级（任意 code 建号）。登录态存于wx.storage（access_token/openid/user_profile）。 - 自动重登：
utils/request.js在收到 401 时调用注册的unauthorizedHandler重新登录并重试一次原请求，页面无需感知。 - 个人中心
pages/profile：未登录显示登录卡片；已登录显示头像/昵称/统计/菜单，支持改昵称与 emoji 头像、退出登录。 - 收藏：动作收藏（详情页心形）、官方计划收藏（计划详情页）。
- 计划：可新建/编辑计划、向计划添加或移除动作（搜索页
select模式）、从官方计划一键导入为个人副本。
组件
exercise-card（动作卡）、section-header（分区标题）、chip（筛选标签）、
navbar（自定义导航栏，处理状态栏高度）、bottom-nav（底部导航：首页/分类/我的）、
level-tag（难度等级标签）、avatar（emoji 头像）、plan-card（计划卡）。
接口映射
services/exercise.js：列表/详情/分类/推荐/官方计划/搜索/统计。services/user.js、services/favorite.js、services/plan.js：用户资料、收藏、计划，字段与后端响应一一对应。
注意事项
- 小程序
<image>支持 GIF，动作演示直接使用gifUrl。 - 所有请求经
utils/request.js单点封装，自动带Authorization头、失败统一 toast。 - 包体保持精简：主包仅含页面与组件，无大体积本地资源。