From faa49cff1ca8899f365e211b51e8a140992517df Mon Sep 17 00:00:00 2001 From: cnliucheng Date: Tue, 28 Jul 2026 09:20:43 +0800 Subject: [PATCH] =?UTF-8?q?feat(leaderboard):=20=E4=B8=8B=E6=8B=89?= =?UTF-8?q?=E5=88=B7=E6=96=B0=E5=8A=A8=E7=94=BB=E5=9B=BE=E6=A0=87?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 下拉刷新时顶部显示主题色旋转 spinner + "刷新中…"指示器, 仅下拉刷新显示(pullRefreshing),后台静默刷新保持无感。 Co-Authored-By: Claude --- pages/leaderboard/leaderboard.js | 7 ++++++- pages/leaderboard/leaderboard.wxml | 6 ++++++ pages/leaderboard/leaderboard.wxss | 33 ++++++++++++++++++++++++++++++ 3 files changed, 45 insertions(+), 1 deletion(-) diff --git a/pages/leaderboard/leaderboard.js b/pages/leaderboard/leaderboard.js index d907617..a57252c 100644 --- a/pages/leaderboard/leaderboard.js +++ b/pages/leaderboard/leaderboard.js @@ -18,6 +18,7 @@ Page({ myEntry: null, loading: false, refreshing: false, + pullRefreshing: false, empty: false, icons: iconsMod.build() }, @@ -48,7 +49,11 @@ Page({ }, onPullDownRefresh() { - this.fetchRank(() => wx.stopPullDownRefresh(), true) + this.setData({ pullRefreshing: true }) + this.fetchRank(() => { + this.setData({ pullRefreshing: false }) + wx.stopPullDownRefresh() + }, true) }, switchPeriod(e) { diff --git a/pages/leaderboard/leaderboard.wxml b/pages/leaderboard/leaderboard.wxml index 10c4a28..7c5de7f 100644 --- a/pages/leaderboard/leaderboard.wxml +++ b/pages/leaderboard/leaderboard.wxml @@ -12,6 +12,12 @@ + + + + 刷新中… + + diff --git a/pages/leaderboard/leaderboard.wxss b/pages/leaderboard/leaderboard.wxss index 49f08b7..80a1947 100644 --- a/pages/leaderboard/leaderboard.wxss +++ b/pages/leaderboard/leaderboard.wxss @@ -467,6 +467,39 @@ color: var(--text-secondary); } +/* 刷新中指示器:下拉刷新时顶部显示(后台静默刷新不显示,保持无感) */ +.refresh-indicator { + display: flex; + align-items: center; + justify-content: center; + gap: 10rpx; + padding: 14rpx 0; + animation: refreshFadeIn 0.2s ease; +} + +.refresh-spinner { + width: 28rpx; + height: 28rpx; + border: 3rpx solid rgba(var(--primary-rgb), 0.2); + border-top-color: var(--primary); + border-radius: 50%; + animation: refreshSpin 0.8s linear infinite; +} + +.refresh-text { + font-size: 24rpx; + color: var(--text-secondary); +} + +@keyframes refreshSpin { + to { transform: rotate(360deg); } +} + +@keyframes refreshFadeIn { + from { opacity: 0; } + to { opacity: 1; } +} + /* Loading: 旋转加载图标 + 骨架屏容器 */ .leaderboard-skeleton { padding: 40rpx 32rpx 0;