140 lines
6.9 KiB
Plaintext
140 lines
6.9 KiB
Plaintext
<view class="rank-page">
|
||
<!-- 顶区:黄底 + 白 Tab + 时间筛选 -->
|
||
<view class="header-zone">
|
||
<view class="role-tabs">
|
||
<view
|
||
wx:for="{{roleList}}" wx:key="key"
|
||
class="role-tab {{currentRole === item.key ? 'active' : ''}}"
|
||
data-role="{{item.key}}" bindtap="onRoleTap"
|
||
>
|
||
<text class="role-tab-text">{{item.label}}</text>
|
||
<view class="role-tab-line" wx:if="{{currentRole === item.key}}"></view>
|
||
</view>
|
||
</view>
|
||
|
||
<scroll-view scroll-x class="date-scroll" enhanced show-scrollbar="{{false}}">
|
||
<view class="date-line">
|
||
<view
|
||
wx:for="{{dateList}}" wx:key="key"
|
||
class="date-tab {{currentDate === item.key ? 'active' : ''}}"
|
||
data-date="{{item.key}}" bindtap="onDateTap"
|
||
>{{item.label}}</view>
|
||
</view>
|
||
</scroll-view>
|
||
|
||
<view class="scope-row">
|
||
<!-- 临时隐藏集团总榜,恢复时取消 wx:if 注释 -->
|
||
<view wx:if="{{showJituanScope}}" class="scope-tab {{fanwei === 'jituan' ? 'active' : ''}}" data-fanwei="jituan" bindtap="onScopeTap">集团总榜</view>
|
||
<view class="scope-tab {{fanwei === 'club' ? 'active' : ''}}" data-fanwei="club" bindtap="onScopeTap">本俱乐部榜</view>
|
||
<view class="refresh-btn" bindtap="onRefreshTap">
|
||
<image class="refresh-ico" src="{{imgUrls.refreshIcon}}" mode="aspectFit" />
|
||
</view>
|
||
</view>
|
||
<text class="sort-tip">{{currentDate}} · 按{{sortLabel}} · TOP50</text>
|
||
|
||
<view class="reward-banner" wx:if="{{rewardInfo && rewardInfo.scheme_enabled}}" bindtap="onShowRules">
|
||
<view class="reward-banner-main">
|
||
<text class="reward-tag">🏆 {{rewardInfo.title || '排行榜奖励'}}</text>
|
||
<text class="reward-club">俱乐部 {{rewardInfo.club_id || myClubId}}</text>
|
||
<text class="reward-status" wx:if="{{rewardInfo.period_status === 'open'}}">进行中 · 结束后可领</text>
|
||
<text class="reward-status pending" wx:elif="{{rewardInfo.my_claim}}">待领取 ¥{{rewardInfo.my_claim.amount}}</text>
|
||
<text class="reward-status claimed" wx:elif="{{rewardInfo.my_claimed}}">已领取 ¥{{rewardInfo.my_claimed.amount}}</text>
|
||
</view>
|
||
<text class="reward-link">规则 ›</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="state-wrap" wx:if="{{isLoading}}">
|
||
<view class="loader"></view>
|
||
<text>加载中</text>
|
||
</view>
|
||
|
||
<view class="state-wrap" wx:elif="{{isEmpty}}">
|
||
<image class="state-img" src="{{imgUrls.emptyIcon}}" mode="aspectFit" />
|
||
<text>暂无排行数据</text>
|
||
</view>
|
||
|
||
<scroll-view wx:else scroll-y class="body-scroll" enhanced show-scrollbar="{{false}}">
|
||
<!-- 前三名领奖台 -->
|
||
<view class="podium-zone" wx:if="{{topThree.length > 0}}">
|
||
<view class="podium-row">
|
||
|
||
<view class="podium-col col-2" wx:if="{{topThree[1]}}">
|
||
<view class="crown crown-silver">👑</view>
|
||
<view class="avatar-ring ring-silver">
|
||
<image class="p-avatar" src="{{topThree[1].avatar || defaultAvatar}}" mode="aspectFill" data-zone="top" data-index="1" binderror="onAvatarError" />
|
||
</view>
|
||
<text class="p-name">{{topThree[1].nicheng}}</text>
|
||
<text class="p-label">{{topThree[1].mainLabel}}</text>
|
||
<text class="p-amount">{{topThree[1].mainPrefix}}{{topThree[1].mainValue}}</text>
|
||
<view class="p-metrics">
|
||
<text class="p-metric" wx:for="{{topThree[1].metrics}}" wx:key="label" wx:for-item="m">{{m.label}} {{m.value}}</text>
|
||
</view>
|
||
<text class="p-reward" wx:if="{{topThree[1].rewardAmount > 0}}">奖 ¥{{topThree[1].rewardAmount}}</text>
|
||
<view class="pedestal pedestal-2"></view>
|
||
</view>
|
||
|
||
<view class="podium-col col-1" wx:if="{{topThree[0]}}">
|
||
<view class="crown crown-gold">👑</view>
|
||
<view class="avatar-ring ring-gold">
|
||
<image class="p-avatar p-avatar-lg" src="{{topThree[0].avatar || defaultAvatar}}" mode="aspectFill" data-zone="top" data-index="0" binderror="onAvatarError" />
|
||
</view>
|
||
<text class="p-name p-name-lg">{{topThree[0].nicheng}}</text>
|
||
<text class="p-label">{{topThree[0].mainLabel}}</text>
|
||
<text class="p-amount p-amount-lg">{{topThree[0].mainPrefix}}{{topThree[0].mainValue}}</text>
|
||
<view class="p-metrics">
|
||
<text class="p-metric" wx:for="{{topThree[0].metrics}}" wx:key="label" wx:for-item="m">{{m.label}} {{m.value}}</text>
|
||
</view>
|
||
<text class="p-reward" wx:if="{{topThree[0].rewardAmount > 0}}">奖 ¥{{topThree[0].rewardAmount}}</text>
|
||
<view class="pedestal pedestal-1"></view>
|
||
</view>
|
||
|
||
<view class="podium-col col-3" wx:if="{{topThree[2]}}">
|
||
<view class="crown crown-bronze">👑</view>
|
||
<view class="avatar-ring ring-bronze">
|
||
<image class="p-avatar" src="{{topThree[2].avatar || defaultAvatar}}" mode="aspectFill" data-zone="top" data-index="2" binderror="onAvatarError" />
|
||
</view>
|
||
<text class="p-name">{{topThree[2].nicheng}}</text>
|
||
<text class="p-label">{{topThree[2].mainLabel}}</text>
|
||
<text class="p-amount">{{topThree[2].mainPrefix}}{{topThree[2].mainValue}}</text>
|
||
<view class="p-metrics">
|
||
<text class="p-metric" wx:for="{{topThree[2].metrics}}" wx:key="label" wx:for-item="m">{{m.label}} {{m.value}}</text>
|
||
</view>
|
||
<text class="p-reward" wx:if="{{topThree[2].rewardAmount > 0}}">奖 ¥{{topThree[2].rewardAmount}}</text>
|
||
<view class="pedestal pedestal-3"></view>
|
||
</view>
|
||
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 4 名以后列表 -->
|
||
<view class="list-panel" wx:if="{{restList.length > 0}}">
|
||
<view class="list-row" wx:for="{{restList}}" wx:key="mingci">
|
||
<text class="li-rank">{{item.mingci}}</text>
|
||
<image class="li-avatar" src="{{item.avatar || defaultAvatar}}" mode="aspectFill" data-zone="rest" data-index="{{index}}" binderror="onAvatarError" />
|
||
<text class="li-name">{{item.nicheng}}</text>
|
||
<view class="li-right">
|
||
<text class="li-amount">{{item.mainPrefix}}{{item.mainValue}}</text>
|
||
<text class="li-label">{{item.mainLabel}}</text>
|
||
<view class="li-tags">
|
||
<text class="li-tag" wx:for="{{item.metrics}}" wx:key="label" wx:for-item="m">{{m.label}} {{m.value}}</text>
|
||
</view>
|
||
<text class="li-reward" wx:if="{{item.rewardAmount > 0}}">奖¥{{item.rewardAmount}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="bottom-gap"></view>
|
||
</scroll-view>
|
||
|
||
<view class="claim-bar" wx:if="{{showClaimBar && rewardInfo.my_claim}}">
|
||
<view class="claim-text">
|
||
<text class="claim-title">🎉 第{{rewardInfo.my_claim.mingci}}名 · 待领取</text>
|
||
<text class="claim-amount">¥{{rewardInfo.my_claim.amount}}</text>
|
||
</view>
|
||
<button class="claim-btn" loading="{{claimLoading}}" bindtap="onClaimTap">立即领取</button>
|
||
</view>
|
||
</view>
|
||
|
||
<global-notification id="global-notification" />
|