hookehuyr

fix(RankingCard): 修复我的排名卡片在没有topRanks时的显示问题

当topRanks为空数组时,我的排名卡片不应显示。添加了条件判断确保只在有topRanks时显示我的排名卡片,并添加了备选显示逻辑。
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>
......