wm
b3b58e66fb
- backend: NestJS service with exercise/plan data - miniprogram: WeChat mini program client - exclude node_modules, dist, runtime data-store, local env
2.3 KiB
2.3 KiB
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 |
名称/部位/器械/目标模糊搜索 |
组件
exercise-card（动作卡）、section-header（分区标题）、chip（筛选标签）、
navbar（自定义导航栏，处理状态栏高度）、bottom-nav（底部导航）。
接口映射
services/exercise.js 直接映射后端 7 类接口（listExercises / getExercise /
getCategories / recommend / listCollections / getCollectionExercises /
search / getStats），字段与后端响应一一对应。
注意事项
- 小程序
<image>支持 GIF，动作演示直接使用gifUrl。 - 所有请求经
utils/request.js单点封装，失败统一 toast。 - 包体保持精简：主包仅含页面与组件，无大体积本地资源。