Files
fitness-coach/miniprogram/pages/index/index.wxml
wm 393157e56b feat: 器械分类网格化 + 分类页标题防乱码 + 按器械/部位多维度筛选
- 首页『热门器械』由横滑 chips 改为与『按部位浏览』一致的网格
- 分类页 navbar 标题改由本地分类枚举回写,避免外部传入标题乱码
- 分类页新增二级维度多选筛选:器械维度交叉按部位,其余维度交叉按器械
- 后端 exercises.service 支持 equipment/bodyPart 逗号分隔多值 OR 过滤(向后兼容)
2026-07-24 10:28:40 +08:00

147 lines
5.5 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<view class="home" style="padding-top: {{statusBarHeight}}px;">
<!-- Hero -->
<view class="hero">
<view class="hero__eyebrow">FITCOACH · 智能健身教练</view>
<view class="hero__title">今天,练点什么?</view>
<view class="hero__sub">精准匹配你的目标肌群,让每一次训练都更高效</view>
<view class="search-pill" bindtap="onSearch">
<fc-icon name="search" size="28" color="var(--text-2)" />
<text class="search-pill__ph">搜索动作 / 器械 / 部位</text>
</view>
<view class="cta" bindtap="goRecommend">
<fc-icon name="sparkles" size="24" />
<text class="cta__txt">智能推荐</text>
<text class="cta__arrow"></text>
</view>
</view>
<!-- 为你准备(登录后个性化) -->
<view class="section personal" wx:if="{{isLogin}}">
<view class="personal__head">
<view class="personal__titlewrap">
<view class="eyebrow">FOR YOU</view>
<view class="personal__hi">{{greeting}}准备好训练了吗?</view>
</view>
<fc-icon name="sparkles" size="22" color="var(--accent)" />
</view>
<view class="personal__block" wx:if="{{myPlans.length}}">
<view class="personal__sub">我的计划</view>
<view class="plan-row">
<view class="plan-chip" wx:for="{{myPlans}}" wx:key="id" data-id="{{item.id}}" bindtap="onPlanTap">
<fc-icon name="clipboard-list" size="20" color="var(--accent)" />
<view class="plan-chip__body">
<text class="plan-chip__name">{{item.name}}</text>
<text class="plan-chip__meta">{{item.count}} 个动作</text>
</view>
</view>
</view>
</view>
<view class="personal__block" wx:if="{{todayRecommend.length}}">
<view class="personal__sub">今日推荐</view>
<view class="rec-row">
<view class="rec-item" wx:for="{{todayRecommend}}" wx:key="id" data-id="{{item.id}}" catch:tap="onExercise">
<view class="rec-item__body">
<text class="rec-item__name">{{item.name}}</text>
<text class="rec-item__reason">{{item.reason}}</text>
</view>
<fc-icon name="chevron-right" size="18" color="var(--text-3)" />
</view>
</view>
</view>
<view class="personal__block" wx:if="{{myFavorites.length}}">
<view class="personal__sub">我的收藏</view>
<scroll-view scroll-x class="hscroll fav-scroll">
<view class="fav-card" wx:for="{{myFavorites}}" wx:key="id" data-id="{{item.id}}" catch:tap="onExercise">
<image class="fav-card__img" src="{{item.image}}" mode="aspectFill" lazy-load />
<text class="fav-card__name">{{item.displayName || item.name}}</text>
</view>
</scroll-view>
</view>
</view>
<!-- 快捷入口 2x3 -->
<view class="section quick">
<view class="quick__grid">
<view
wx:for="{{quickEntries}}"
wx:key="key"
class="quick__tile"
data-url="{{item.url}}"
bindtap="onQuick">
<fc-icon name="{{item.icon}}" size="28" color="var(--text)" />
<text class="quick__label">{{item.label}}</text>
</view>
</view>
</view>
<!-- 精选动作 横向滑动 -->
<view class="section">
<section-header eyebrow="FEATURED" title="精选动作" subtitle="编辑精选 · 高效入门" action="全部" bind:action="goRecommend" />
<scroll-view wx:if="{{featured.length}}" scroll-x class="hscroll">
<view class="hscroll__item" wx:for="{{featured}}" wx:key="id">
<exercise-card exercise="{{item}}" compact catch:tap="onExercise" />
</view>
</scroll-view>
<view wx:else class="empty">暂无数据</view>
</view>
<!-- 训练组合 横向 -->
<view class="section" wx:if="{{collections.length}}">
<section-header eyebrow="PROGRAMS" title="训练组合" subtitle="一键开启主题训练" />
<scroll-view scroll-x class="chip-scroll">
<view
wx:for="{{collections}}"
wx:key="slug"
class="prog"
style="background: {{item.color}}22; border-color: {{item.color}}55;"
data-slug="{{item.slug}}"
bindtap="onCollection">
<fc-icon name="{{item.icon}}" size="36" color="{{item.color}}" />
<text class="prog__name" style="color: {{item.color}};">{{item.name}}</text>
</view>
</scroll-view>
</view>
<!-- 按部位浏览 -->
<view class="section">
<section-header eyebrow="BY BODY PART" title="按部位浏览" subtitle="选择你的目标区域" />
<view class="bp-grid">
<view
wx:for="{{bodyParts}}"
wx:key="value"
class="bp"
data-value="{{item.value}}"
data-label="{{item.label}}"
bindtap="onScanBodyPart">
<text class="bp__label">{{item.label}}</text>
<text class="bp__count">{{item.count}} 个动作</text>
</view>
</view>
</view>
<!-- 热门器械(网格,与按部位浏览一致) -->
<view class="section" wx:if="{{equipment.length}}">
<section-header eyebrow="EQUIPMENT" title="按器械浏览" subtitle="选择你的训练器械" />
<view class="eq-grid">
<view
wx:for="{{equipment}}"
wx:key="value"
class="eq"
data-value="{{item.value}}"
data-label="{{item.label}}"
bindtap="onScanEquipment">
<text class="eq__label">{{item.label}}</text>
<text class="eq__count">{{item.count}} 个动作</text>
</view>
</view>
</view>
<view style="height: 160rpx;"></view>
<bottom-nav active="home" />
</view>