fix(RankingCard): 修复我的排名卡片在没有topRanks时的显示问题
当topRanks为空数组时,我的排名卡片不应显示。添加了条件判断确保只在有topRanks时显示我的排名卡片,并添加了备选显示逻辑。
Showing
1 changed file
with
25 additions
and
6 deletions
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2025-01-09 00:00:00 | 2 | * @Date: 2025-01-09 00:00:00 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2025-10-10 10:53:43 | 4 | + * @LastEditTime: 2025-10-10 10:56:32 |
| 5 | * @FilePath: /lls_program/src/components/RankingCard.vue | 5 | * @FilePath: /lls_program/src/components/RankingCard.vue |
| 6 | * @Description: 排行榜卡片组件 | 6 | * @Description: 排行榜卡片组件 |
| 7 | --> | 7 | --> |
| ... | @@ -110,22 +110,41 @@ | ... | @@ -110,22 +110,41 @@ |
| 110 | </view> | 110 | </view> |
| 111 | 111 | ||
| 112 | <!-- 我的排名卡片 --> | 112 | <!-- 我的排名卡片 --> |
| 113 | - <view v-if="myRank" class="my-rank-section"> | 113 | + <view v-if="myRank && topRanks.length" class="my-rank-section"> |
| 114 | <view class="my-rank-content"> | 114 | <view class="my-rank-content"> |
| 115 | <view class="my-rank-left"> | 115 | <view class="my-rank-left"> |
| 116 | <view class="my-rank-number"> | 116 | <view class="my-rank-number"> |
| 117 | - {{ myRank.isNotRanked ? '-' : (myRank.rank > 99 ? '99+' : myRank.rank) }} | 117 | + {{ myRank?.isNotRanked ? '-' : (myRank?.rank > 99 ? '99+' : myRank?.rank) }} |
| 118 | </view> | 118 | </view> |
| 119 | <view class="my-avatar"> | 119 | <view class="my-avatar"> |
| 120 | <image :src="myRank.avatar_url || defaultAvatar" class="my-avatar-img" mode="aspectFill" /> | 120 | <image :src="myRank.avatar_url || defaultAvatar" class="my-avatar-img" mode="aspectFill" /> |
| 121 | </view> | 121 | </view> |
| 122 | <view class="my-family-info"> | 122 | <view class="my-family-info"> |
| 123 | - <view class="my-family-name">{{ myRank.name }}</view> | 123 | + <view class="my-family-name">{{ myRank?.name }}</view> |
| 124 | - <view class="my-leader-name">{{ activeTab === 'support' ? `${myRank.created_by_nickname}个家庭` : `大家长:${myRank.created_by_nickname}` }}</view> | 124 | + <view class="my-leader-name">{{ activeTab === 'support' ? `${myRank?.created_by_nickname}个家庭` : `大家长:${myRank?.created_by_nickname}` }}</view> |
| 125 | </view> | 125 | </view> |
| 126 | </view> | 126 | </view> |
| 127 | <view class="my-rank-right"> | 127 | <view class="my-rank-right"> |
| 128 | - <view class="my-steps">{{ activeTab === 'support' ? formatSupportSteps(myRank.step) : formatStepsForList(myRank.step) }}</view> | 128 | + <view class="my-steps">{{ activeTab === 'support' ? formatSupportSteps(myRank?.step) : formatStepsForList(myRank?.step) }}</view> |
| 129 | + </view> | ||
| 130 | + </view> | ||
| 131 | + </view> | ||
| 132 | + <view v-else class="my-rank-section"> | ||
| 133 | + <view class="my-rank-content"> | ||
| 134 | + <view class="my-rank-left"> | ||
| 135 | + <view class="my-rank-number"> | ||
| 136 | + {{ myRank?.isNotRanked ? '-' : (myRank?.rank > 99 ? '99+' : myRank?.rank) }} | ||
| 137 | + </view> | ||
| 138 | + <view class="my-avatar"> | ||
| 139 | + <image :src="myRank?.avatar_url || defaultAvatar" class="my-avatar-img" mode="aspectFill" /> | ||
| 140 | + </view> | ||
| 141 | + <view class="my-family-info"> | ||
| 142 | + <view class="my-family-name">{{ myRank?.name }}</view> | ||
| 143 | + <view class="my-leader-name">{{ activeTab === 'support' ? `${myRank?.created_by_nickname}个家庭` : `大家长:${myRank?.created_by_nickname}` }}</view> | ||
| 144 | + </view> | ||
| 145 | + </view> | ||
| 146 | + <view class="my-rank-right"> | ||
| 147 | + <view class="my-steps">{{ activeTab === 'support' ? formatSupportSteps(myRank?.step) : formatStepsForList(myRank?.step) }}</view> | ||
| 129 | </view> | 148 | </view> |
| 130 | </view> | 149 | </view> |
| 131 | </view> | 150 | </view> | ... | ... |
-
Please register or login to post a comment