hy/aslan-h5
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore(cp活动页): 将星座历史排行更改为从最新的开始展示

Browse Source
This commit is contained in:
hzj 2026-04-20 15:42:07 +08:00
parent 9e8465f29c
commit 4e17042e9c
1 changed files with 92 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

109
src/views/Ranking/Couple/index.vue
View File

@ -72,14 +72,14 @@
<!-- top1情侣头像 -->
<itemCenter
v-for="(item, index) in seasonTop1List"
v-for="(item, index) in seasonTop1DisplayList"
:key="`couple-${item.userId || index}`"
style="z-index: 1; min-width: 0; flex-shrink: 0; transition: all 0.8s ease"
:style="{
width: index === centerIndex ? '60vw' : '40vw',
zIndex: index === centerIndex ? 20 : 1,
}"
:imgUrl="twelveSigns[index]?.bgUrl"
:imgUrl="item.bgUrl"
:contentStyle="``"
>
<!-- 非居中时显示遮罩层用于移动 -->
@ -184,10 +184,10 @@
"
>
<div style="font-size: 1.2em; color: #fe649b; font-weight: 700">
Season{{ centerIndex + 1 }}
Season{{ currentSeasonTop1?.seasonNumber || '' }}
</div>
<div style="font-size: 0.9em; color: #fe649b; font-weight: 700">
{{ twelveSigns[centerIndex]?.time }}
{{ currentSeasonTop1?.seasonTime || '' }}
</div>
</div>
</div>
@ -1466,21 +1466,93 @@ const isMoving = ref(false)
const lastClickTime = ref(0) // ✅ 新增：记录上次点击时间
const clickLock = ref(false) // ✅ 新增：点击锁，防止同一事件多次触发
const zodiacBaseYear = 2026
const twelveSigns = ref([
{ name: 'Aquarius', time: '2026.1.20-2.18', bgUrl: imageUrl('AquariusCoupleFrame') }, // 水瓶座
{ name: 'Pisces', time: '2026.2.19-3.20', bgUrl: imageUrl('PiscesCoupleFrame') }, // 双鱼座
{ name: 'Aries', time: '2026.3.21-4.19', bgUrl: imageUrl('AriesCoupleFrame') }, // 白羊座
{ name: 'Taurus', time: '2026.4.20-5.20', bgUrl: imageUrl('TaurusCoupleFrame') }, // 金牛座
{ name: 'Gemini', time: '2026.5.21-6.21', bgUrl: imageUrl('') }, // 双子座
{ name: 'Cancer', time: '2026.6.22-7.22', bgUrl: imageUrl('') }, // 巨蟹座
{ name: 'Leo', time: '2026.7.23-8.22', bgUrl: imageUrl('') }, // 狮子座
{ name: 'Virgo', time: '2026.8.23-9.22', bgUrl: imageUrl('') }, // 处女座
{ name: 'Libra', time: '2026.9.23-10.22', bgUrl: imageUrl('') }, // 天秤座
{ name: 'Scorpio', time: '2026.10.23-11.21', bgUrl: imageUrl('') }, // 天蝎座
{ name: 'Sagittarius', time: '2026.11.22-12.21', bgUrl: imageUrl('') }, // 天蝎座
{ name: 'Capricorn', time: '2026.12.22-1.19', bgUrl: imageUrl('') }, // 摩羯座
{
name: 'Aquarius',
startMonthDay: '1.20',
endMonthDay: '2.18',
endYearOffset: 0,
bgUrl: imageUrl('AquariusCoupleFrame'),
}, // 水瓶座
{
name: 'Pisces',
startMonthDay: '2.19',
endMonthDay: '3.20',
endYearOffset: 0,
bgUrl: imageUrl('PiscesCoupleFrame'),
}, // 双鱼座
{
name: 'Aries',
startMonthDay: '3.21',
endMonthDay: '4.19',
endYearOffset: 0,
bgUrl: imageUrl('AriesCoupleFrame'),
}, // 白羊座
{
name: 'Taurus',
startMonthDay: '4.20',
endMonthDay: '5.20',
endYearOffset: 0,
bgUrl: imageUrl('TaurusCoupleFrame'),
}, // 金牛座
{ name: 'Gemini', startMonthDay: '5.21', endMonthDay: '6.21', endYearOffset: 0, bgUrl: imageUrl('') }, // 双子座
{ name: 'Cancer', startMonthDay: '6.22', endMonthDay: '7.22', endYearOffset: 0, bgUrl: imageUrl('') }, // 巨蟹座
{ name: 'Leo', startMonthDay: '7.23', endMonthDay: '8.22', endYearOffset: 0, bgUrl: imageUrl('') }, // 狮子座
{ name: 'Virgo', startMonthDay: '8.23', endMonthDay: '9.22', endYearOffset: 0, bgUrl: imageUrl('') }, // 处女座
{ name: 'Libra', startMonthDay: '9.23', endMonthDay: '10.22', endYearOffset: 0, bgUrl: imageUrl('') }, // 天秤座
{ name: 'Scorpio', startMonthDay: '10.23', endMonthDay: '11.21', endYearOffset: 0, bgUrl: imageUrl('') }, // 天蝎座
{
name: 'Sagittarius',
startMonthDay: '11.22',
endMonthDay: '12.21',
endYearOffset: 0,
bgUrl: imageUrl(''),
}, // 射手座
{
name: 'Capricorn',
startMonthDay: '12.22',
endMonthDay: '1.19',
endYearOffset: 1,
bgUrl: imageUrl(''),
}, // 摩羯座
]) // 十二星座
const getSeasonTimeByIndex = (index) => {
const signCount = twelveSigns.value.length
const signIndex = index % signCount
const cycleIndex = Math.floor(index / signCount)
const sign = twelveSigns.value[signIndex]
const startYear = zodiacBaseYear + cycleIndex
const endYear = startYear + (sign.endYearOffset || 0)
return endYear === startYear
? `${startYear}.${sign.startMonthDay}-${sign.endMonthDay}`
: `${startYear}.${sign.startMonthDay}-${endYear}.${sign.endMonthDay}`
}
const seasonTop1DisplayList = computed(() => {
return seasonTop1List.value
.map((item, index) => {
const signCount = twelveSigns.value.length
const sign = twelveSigns.value[index % signCount] || {}
return {
...item,
seasonIndex: index,
seasonNumber: index + 1,
seasonName: sign.name || '',
seasonTime: getSeasonTimeByIndex(index),
bgUrl: sign.bgUrl || '',
}
})
.reverse()
})
const currentSeasonTop1 = computed(() => {
return seasonTop1DisplayList.value[centerIndex.value] || {}
})
// 点击居中项头像
const handleAvatarClick = (userId, event) => {
const now = Date.now()
@ -1602,7 +1674,7 @@ const handleTouchEnd = (event) => {
// 先执行移动（此时 isSwipe 仍为 true）
if (isLeftSwipe && centerIndex.value > 0) {
moveToCenter(centerIndex.value - 1)
} else if (isRightSwipe && centerIndex.value < seasonTop1List.value.length - 1) {
} else if (isRightSwipe && centerIndex.value < seasonTop1DisplayList.value.length - 1) {
moveToCenter(centerIndex.value + 1)
}
@ -1825,6 +1897,9 @@ const getCpSeasonTop1List = async () => {
} else {
seasonTop1List.value = [{}]
}
centerIndex.value = 0
updatePosition()
}
}