diff --git a/package1/components/planet/planet-header.vue b/package1/components/planet/planet-header.vue
index 5e3314f..316777e 100644
--- a/package1/components/planet/planet-header.vue
+++ b/package1/components/planet/planet-header.vue
@@ -56,7 +56,7 @@
得现金奖励
-
+
￥
{{poolText}}
@@ -92,12 +92,17 @@
data() {
return {
remain: 0,
- timer: null
+ timer: null,
+ poolTimer: null,
+ poolBongTimer: null,
+ displayPoolAmount: 0,
+ lastPoolAmount: 0,
+ poolBong: false
}
},
computed: {
poolText() {
- const v = Number(this.data.poolAmount || 0)
+ const v = Number(this.displayPoolAmount || 0)
return v.toFixed(2)
},
rankText() {
@@ -121,14 +126,19 @@
'data.countdownMillis'(val) {
this.remain = val || 0
this.startTimer()
+ },
+ 'data.poolAmount'(val) {
+ this.animatePool(Number(val || 0))
}
},
mounted() {
this.remain = this.data.countdownMillis || 0
+ this.animatePool(Number(this.data.poolAmount || 0), true)
this.startTimer()
},
beforeDestroy() {
if (this.timer) clearInterval(this.timer)
+ this.clearPoolTimers()
},
methods: {
goTicketLog() {
@@ -156,6 +166,47 @@
}
this.remain -= 1000
}, 1000)
+ },
+ clearPoolTimers() {
+ if (this.poolTimer) clearInterval(this.poolTimer)
+ if (this.poolBongTimer) clearTimeout(this.poolBongTimer)
+ this.poolTimer = null
+ this.poolBongTimer = null
+ },
+ animatePool(target, initial) {
+ target = Number(target || 0)
+ this.clearPoolTimers()
+ this.poolBong = false
+ const start = initial ? 0 : Number(this.displayPoolAmount || 0)
+ const diff = target - start
+ this.lastPoolAmount = target
+ if (Math.abs(diff) < 0.01) {
+ this.displayPoolAmount = target
+ this.playPoolBong()
+ return
+ }
+ const duration = initial ? 1500 : 900
+ const startTime = Date.now()
+ this.displayPoolAmount = start
+ this.poolTimer = setInterval(() => {
+ const progress = Math.min(1, (Date.now() - startTime) / duration)
+ const eased = 1 - Math.pow(1 - progress, 3)
+ this.displayPoolAmount = start + diff * eased
+ if (progress >= 1) {
+ clearInterval(this.poolTimer)
+ this.poolTimer = null
+ this.displayPoolAmount = target
+ this.playPoolBong()
+ }
+ }, 30)
+ },
+ playPoolBong() {
+ this.poolBong = true
+ if (this.poolBongTimer) clearTimeout(this.poolBongTimer)
+ this.poolBongTimer = setTimeout(() => {
+ this.poolBong = false
+ this.poolBongTimer = null
+ }, 520)
}
}
}
@@ -548,20 +599,82 @@
.ph-pool {
position: relative;
text-align: center;
- margin-top: 8rpx;
- color: #16A779;
+ margin-top: 10rpx;
+ padding: 4rpx 22rpx 10rpx;
+ color: #FFF7B8;
+ border-radius: 999rpx;
+ background:
+ radial-gradient(circle at 50% 0%, rgba(255,255,255,0.68), transparent 34%),
+ linear-gradient(135deg, rgba(255,214,92,0.28), rgba(255,122,89,0.1));
+ text-shadow:
+ 0 2rpx 0 #8A4A00,
+ 0 8rpx 20rpx rgba(255,145,35,0.48),
+ 0 0 34rpx rgba(255,224,138,0.8);
+ filter: drop-shadow(0 12rpx 24rpx rgba(255,145,35,0.26));
+ overflow: hidden;
+ transform-origin: center center;
+ }
+
+ .ph-pool::before {
+ content: '';
+ position: absolute;
+ left: -80rpx;
+ top: 0;
+ width: 56rpx;
+ height: 100%;
+ background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,0.92), rgba(255,255,255,0));
+ transform: skewX(-18deg);
+ animation: poolShine 1.8s ease-in-out infinite;
+ }
+
+ .ph-pool::after {
+ content: '';
+ position: absolute;
+ left: 24rpx;
+ right: 24rpx;
+ bottom: 6rpx;
+ height: 10rpx;
+ border-radius: 999rpx;
+ background: radial-gradient(circle, rgba(255,184,77,0.78), rgba(255,184,77,0));
+ filter: blur(4rpx);
+ }
+
+ .ph-pool.bong {
+ animation: poolBong .52s cubic-bezier(.2, 1.65, .32, 1);
+ }
+
+ @keyframes poolShine {
+ 0% { transform: translateX(0) skewX(-18deg); opacity: 0; }
+ 24% { opacity: .95; }
+ 58% { opacity: .78; }
+ 100% { transform: translateX(410rpx) skewX(-18deg); opacity: 0; }
+ }
+
+ @keyframes poolBong {
+ 0% { transform: scale(1); }
+ 42% { transform: scale(1.22) rotate(-2deg); }
+ 68% { transform: scale(.95) rotate(1deg); }
+ 100% { transform: scale(1) rotate(0); }
}
.ph-pool-symbol {
- font-size: 38rpx;
+ position: relative;
+ z-index: 1;
+ font-size: 42rpx;
font-weight: 900;
+ color: #FFE08A;
}
.ph-pool-num {
- font-size: 92rpx;
+ position: relative;
+ z-index: 1;
+ font-size: 98rpx;
font-weight: 900;
font-family: DIN, sans-serif;
letter-spacing: -2rpx;
+ background: linear-gradient(180deg, #FFFFFF 0%, #FFF4A8 34%, #FFB52F 76%, #F77719 100%);
+ -webkit-background-clip: text;
+ color: transparent;
}
.ph-pool-label {
diff --git a/package1/planet/rank.vue b/package1/planet/rank.vue
index 1c63338..c5e9569 100644
--- a/package1/planet/rank.vue
+++ b/package1/planet/rank.vue
@@ -31,13 +31,67 @@
WEALTH COORDINATES
财富坐标榜
- 已加载 {{pageNum}} / {{totalPages}} 页
-
+
+
+
+
+ TOP HUNTERS ARE WATCHING
+ 前三领奖台
+
+ 抢榜越高 · 越容易被盯上
+
+
+ 每日 21:30 按校区分别结算，有券前 5 名瓜分星球券
+
+ 第1名 +5
+ 第2名 +4
+ 第3名 +3
+ 第4名 +2
+ 第5名 +1
+
+
+
+
+ 2
+
+ {{podiumName(podiumSecond)}}
+ {{podiumSecond.ticketCount || 0}}券
+ 第二名
+
+
+ 1
+
+
+ {{podiumName(podiumFirst)}}
+ {{podiumFirst.ticketCount || 0}}券
+ 第一名
+
+
+ 3
+
+ {{podiumName(podiumThird)}}
+ {{podiumThird.ticketCount || 0}}券
+ 第三名
+
+
+ 点领奖台头像即可发起追查，今天还剩 {{home.remainHunt || 0}} 次机会
+
+
+
#{{item._displayRankNo}}
@@ -60,7 +114,7 @@
- 暂无上榜居民，攒券登顶成为今日主角
+ 暂无上榜居民，攒券登顶成为今日主角
{{loadMoreText}}
@@ -128,6 +182,28 @@
pagedList() {
return this.rankList
},
+ podiumList() {
+ return this.rankList.filter((item) => item._displayRankNo >= 1 && item._displayRankNo <= 3)
+ },
+ podiumMap() {
+ const map = {}
+ this.podiumList.forEach((item) => {
+ map[item._displayRankNo] = item
+ })
+ return map
+ },
+ podiumFirst() {
+ return this.podiumMap[1]
+ },
+ podiumSecond() {
+ return this.podiumMap[2]
+ },
+ podiumThird() {
+ return this.podiumMap[3]
+ },
+ normalList() {
+ return this.rankList.filter((item) => item._displayRankNo > 3)
+ },
loadMoreText() {
if (this.listLoading) return '正在加载更多坐标...'
if (this.noMore) return '没有更多财富坐标了'
@@ -210,6 +286,11 @@
if ((this.home.remainHunt || 0) <= 0) return '次数用完'
return '发起追查'
},
+ podiumName(item) {
+ if (!item) return '神秘同学'
+ if (item.stealth) return '隐身侠'
+ return item.nickname || '神秘同学'
+ },
onHunt(item) {
if (item.self) {
this.tui.toast('不能追捕自己')
@@ -299,6 +380,40 @@
.rank-head { margin-top: 30rpx; display: flex; align-items: flex-end; justify-content: space-between; }
.rank-title { margin-top: 6rpx; color: #12342F; font-size: 40rpx; font-weight: 900; }
.rank-page-no { color: #6B817D; font-size: 23rpx; font-weight: 800; }
+ .podium-card { position: relative; margin-top: 22rpx; padding: 30rpx 24rpx 26rpx; border-radius: 46rpx; background: radial-gradient(circle at 50% 8%, rgba(255,184,77,0.42), transparent 36%), linear-gradient(155deg, rgba(30,27,75,0.94), rgba(36,58,84,0.9) 48%, rgba(18,52,47,0.88)); border: 2rpx solid rgba(255,255,255,0.24); box-shadow: 0 30rpx 72rpx rgba(30,27,75,0.24); overflow: hidden; }
+ .podium-bg-glow { position: absolute; left: 50%; top: -170rpx; width: 620rpx; height: 620rpx; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(circle, rgba(255,214,92,0.38), rgba(255,122,89,0.12) 42%, transparent 68%); animation: podiumPulse 2.4s ease-in-out infinite; }
+ @keyframes podiumPulse { 0%,100%{ opacity:.58; transform: translateX(-50%) scale(.92); } 50%{ opacity:1; transform: translateX(-50%) scale(1.06); } }
+ .podium-head { position: relative; z-index: 1; display: flex; justify-content: space-between; gap: 16rpx; align-items: flex-start; }
+ .podium-kicker { color: rgba(255,214,92,0.86); font-size: 17rpx; font-weight: 900; letter-spacing: 2rpx; }
+ .podium-title { margin-top: 6rpx; color: #FFFFFF; font-size: 40rpx; font-weight: 900; text-shadow: 0 8rpx 20rpx rgba(0,0,0,0.18); }
+ .podium-prize { max-width: 210rpx; padding: 10rpx 16rpx; border-radius: 999rpx; background: rgba(255,255,255,0.12); color: #FFE08A; font-size: 19rpx; font-weight: 900; line-height: 1.25; text-align: center; border: 1rpx solid rgba(255,255,255,0.18); }
+ .reward-rule { position: relative; z-index: 1; margin-top: 20rpx; padding: 18rpx; border-radius: 28rpx; background: linear-gradient(135deg, rgba(255,224,138,0.18), rgba(255,255,255,0.1)); border: 1rpx solid rgba(255,255,255,0.18); box-shadow: inset 0 1rpx 0 rgba(255,255,255,0.18); }
+ .reward-main { color: #FFF4B8; font-size: 23rpx; font-weight: 900; line-height: 1.35; }
+ .reward-chips { margin-top: 12rpx; display: flex; flex-wrap: wrap; gap: 10rpx; }
+ .reward-chips text { padding: 7rpx 12rpx; border-radius: 999rpx; background: rgba(255,255,255,0.16); color: rgba(255,255,255,0.92); font-size: 19rpx; font-weight: 900; }
+ .podium-stage { position: relative; z-index: 1; margin-top: 28rpx; height: 430rpx; display: flex; align-items: flex-end; justify-content: center; gap: 14rpx; }
+ .podium-player { position: relative; width: 200rpx; display: flex; flex-direction: column; align-items: center; transition: transform .18s ease; }
+ .podium-player:active { transform: scale(.96); }
+ .podium-player.first { width: 222rpx; margin-bottom: 28rpx; }
+ .podium-player.second { margin-bottom: 0; }
+ .podium-player.third { margin-bottom: -18rpx; }
+ .king-aura { position: absolute; top: 22rpx; width: 190rpx; height: 190rpx; border-radius: 50%; background: radial-gradient(circle, rgba(255,214,92,0.48), transparent 68%); animation: kingAura 1.8s ease-in-out infinite; }
+ @keyframes kingAura { 0%,100%{ transform: scale(.88); opacity:.66; } 50%{ transform: scale(1.08); opacity:1; } }
+ .crown { position: relative; z-index: 3; width: 62rpx; height: 50rpx; line-height: 50rpx; border-radius: 18rpx 18rpx 10rpx 10rpx; text-align: center; color: #4A2A00; font-size: 28rpx; font-weight: 900; box-shadow: 0 12rpx 24rpx rgba(0,0,0,0.2); transform: translateY(16rpx); }
+ .crown.gold { background: linear-gradient(145deg, #FFF7B8, #FFB84D); }
+ .crown.silver { background: linear-gradient(145deg, #FFFFFF, #BFD7FF); color: #28415F; }
+ .crown.bronze { background: linear-gradient(145deg, #FFE0B8, #C87A35); color: #4A2500; }
+ .podium-avatar { position: relative; z-index: 2; width: 112rpx; height: 112rpx; border-radius: 38rpx; border: 6rpx solid rgba(255,255,255,0.88); box-shadow: 0 18rpx 36rpx rgba(0,0,0,0.22); background: rgba(255,255,255,0.22); }
+ .podium-avatar.champion { width: 136rpx; height: 136rpx; border-radius: 46rpx; border-color: #FFE08A; box-shadow: 0 20rpx 46rpx rgba(255,184,77,0.36); animation: championFloat 2.1s ease-in-out infinite; }
+ @keyframes championFloat { 0%,100%{ transform: translateY(0); } 50%{ transform: translateY(-8rpx); } }
+ .podium-avatar.stealth { opacity: .62; filter: grayscale(100%); }
+ .podium-name { margin-top: 14rpx; max-width: 178rpx; color: #FFFFFF; font-size: 24rpx; font-weight: 900; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+ .champion-name { font-size: 28rpx; color: #FFF4B8; }
+ .podium-ticket { margin-top: 8rpx; padding: 6rpx 14rpx; border-radius: 999rpx; background: rgba(255,255,255,0.14); color: rgba(255,255,255,0.88); font-size: 20rpx; font-weight: 900; }
+ .podium-ticket.hot { background: linear-gradient(135deg, #FF7A59, #FFB84D); color: #FFFFFF; box-shadow: 0 10rpx 24rpx rgba(255,122,89,0.3); }
+ .podium-base { margin-top: 16rpx; width: 170rpx; height: 92rpx; line-height: 92rpx; border-radius: 28rpx 28rpx 12rpx 12rpx; text-align: center; color: rgba(255,255,255,0.92); font-size: 24rpx; font-weight: 900; background: linear-gradient(180deg, rgba(255,255,255,0.18), rgba(255,255,255,0.07)); border: 1rpx solid rgba(255,255,255,0.16); }
+ .podium-base.king { width: 198rpx; height: 126rpx; line-height: 126rpx; color: #4A2A00; font-size: 28rpx; background: linear-gradient(180deg, #FFE08A, #FFB84D); border: 0; box-shadow: inset 0 10rpx 22rpx rgba(255,255,255,0.26), 0 18rpx 36rpx rgba(255,184,77,0.22); }
+ .podium-tip { position: relative; z-index: 1; margin-top: 16rpx; height: 58rpx; line-height: 58rpx; border-radius: 999rpx; background: rgba(255,255,255,0.12); color: #FFE08A; font-size: 22rpx; font-weight: 900; text-align: center; border: 1rpx solid rgba(255,255,255,0.16); }
.rank-list { margin-top: 18rpx; }
.rank-row { margin-top: 16rpx; padding: 22rpx; border-radius: 34rpx; background: rgba(255,255,255,0.82); border: 2rpx solid rgba(255,255,255,0.94); box-shadow: 0 16rpx 36rpx rgba(53,214,166,0.1); display: flex; align-items: center; }
.rank-no { min-width: 70rpx; color: #22B889; font-size: 28rpx; font-weight: 900; }
diff --git a/package1/planet/ticketLog.vue b/package1/planet/ticketLog.vue
index 45f8d59..8c84b61 100644
--- a/package1/planet/ticketLog.vue
+++ b/package1/planet/ticketLog.vue
@@ -125,7 +125,7 @@
noMore: false,
raiders: [],
raiderPageNumber: 1,
- raiderPageSize: 5,
+ raiderPageSize: 10,
raiderTotal: 0,
raiderLoading: false,
raiderNoMore: false,