wm
b3b58e66fb
- backend: NestJS service with exercise/plan data - miniprogram: WeChat mini program client - exclude node_modules, dist, runtime data-store, local env
48 lines
2.3 KiB
Markdown
48 lines
2.3 KiB
Markdown
# FITCOACH 微信小程序（前端）
|
||
|
||
高端暗金风格（dark luxe）的健身动作推荐小程序。所有数据来自 NestJS 后端 API。
|
||
|
||
## 设计系统
|
||
设计令牌定义在 `app.wxss` 的 `page` 选择器（CSS 变量）：
|
||
- 背景 `#0E1110`、表面 `#171C19`、金 `#D9B36C`、次强调 `#58C9B9`
|
||
- 圆角 `--radius:28rpx`、发丝分隔线 `--line`、阴影 `--shadow`
|
||
- 图标统一使用 **emoji + CSS 渐变**（不依赖二进制图片资源）
|
||
|
||
## 配置
|
||
打开 `config.js`：
|
||
```js
|
||
module.exports = { BASE_URL: 'http://localhost:3000' };
|
||
```
|
||
- 本地调试：填写电脑局域网 IP，如 `http://192.168.1.10:3000`
|
||
- 真机/发布：**必须**改为 HTTPS 且已在小程序后台配置为 request 合法域名
|
||
|
||
## 运行
|
||
1. 微信开发者工具 → 导入项目 → 选择本目录（AppID 可用测试号）
|
||
2. 本地调试可在「详情 → 本地设置」勾选「不校验合法域名、TLS 版本以及 HTTPS 证书」
|
||
3. 编译预览
|
||
|
||
## 页面
|
||
| 页面 | 文件 | 说明 |
|
||
|------|------|------|
|
||
| 首页 | `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。
|
||
- 包体保持精简：主包仅含页面与组件，无大体积本地资源。
|