-
-
-
-
+
+
+
+
+
+
![]()
+
-
-
-
-
-
-
+
+
+
![]()
+
+
-
-
-
-
-
-
-
-
+
+
+
+
-
-
-
-
- {{ listItem?.rank }}
+
+
-
-
![]()
+
+
+
+
+
-
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ listItem?.rank }}
+
+
+
+
![]()
+
+
- {{ listItem?.nickname }}
-
-
- {{ $t('user_id_prefix') }} {{ listItem?.account }}
+
+ {{ listItem?.nickname }}
+
+
+ {{ $t('user_id_prefix') }} {{ listItem?.account }}
+
-
-
-
-

-
- {{ listItem?.quantity }}
+ display: flex;
+ align-items: center;
+ "
+ >
+

+
+ {{ listItem?.quantity }}
+
-
-
+
+
+
+
+
+
-
-
![]()
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ listItem?.rank }}
+
+
+
+
![]()
+
+
+
+
+ {{ listItem?.nickname }}
+
+
+ {{ $t('user_id_prefix') }} {{ listItem?.account }}
+
+
+
+
+
+
+

+
+ {{ listItem?.quantity }}
+
+
+
+
+
+
+
![]()
+
@@ -462,7 +638,38 @@
v-show="rewardsShow"
style="display: flex; flex-direction: column; align-items: center"
>
+
+
+
+
+
![]()
+
+
+
+
+
![]()
+
+
+
+
+
+
+
@@ -766,6 +981,7 @@ import {
import BackgroundLayer from '@/components/BackgroundLayer.vue'
import itemCenter from '@/components/itemCenter.vue'
import TopUser from './components/topUser.vue'
+import TopUserDaily from './components/topUserDaily.vue'
import maskLayer from '@/components/MaskLayer.vue'
const gamesKingStore = useGamesKingStore()
@@ -873,10 +1089,33 @@ const changeModule = (module) => {
const historyTopList = ref([]) // 历史榜首
const historyTopIndex = ref(0)
-const Ranking = ref([]) // 排行榜
-const myRanking = ref({}) // 我的排名
+const weekShow = ref(true) // 周榜展示
+const dailyShow = ref(false) // 日榜展示
+const RankingWeek = ref([]) // 周榜
+const RankingDaily = ref([]) // 日榜
+const myWeekRanking = ref({}) // 我的周排名
+const myDailyRanking = ref({}) // 我的日排名
const rewardsList = ref([]) // 奖励列表
-// const specialReward = ref({}) // 奖励列表
+const myRanking = computed(() => {
+ if (weekShow.value) {
+ return myWeekRanking.value
+ }
+ return myDailyRanking.value
+}) // 我的排名
+
+// 榜单切换
+const changeRanking = (type) => {
+ switch (type) {
+ case 'week':
+ weekShow.value = true
+ dailyShow.value = false
+ break
+ case 'daily':
+ weekShow.value = false
+ dailyShow.value = true
+ break
+ }
+}
const topImg = ref([
imageUrl('top1RewardBg'),
@@ -885,11 +1124,11 @@ const topImg = ref([
imageUrl('top8_10RewardBg'),
]) // top奖励背景
-// 处理排行榜小于10人时的情况
+// 处理周榜小于10人时的情况
const RankingHasTop10 = computed(() => {
- let RankingShow = [...Ranking.value]
- if (Ranking.value.length < 10) {
- let addNullUser = Array.from({ length: 10 - Ranking.value.length }, () => ({
+ let RankingShow = [...RankingWeek.value]
+ if (RankingWeek.value.length < 10) {
+ let addNullUser = Array.from({ length: 10 - RankingWeek.value.length }, () => ({
avatar: '',
nickname: '',
quantity: '',
@@ -899,9 +1138,29 @@ const RankingHasTop10 = computed(() => {
return RankingShow
})
-// 展示用的榜单
+// 展示用的周榜
const showRanking = computed(() => {
- return Ranking.value.filter((_, index) => index >= 10)
+ return RankingWeek.value.filter((_, index) => index >= 10)
+ // return []
+})
+
+// 处理日榜小于3人时的情况
+const RankingDailyHasTop3 = computed(() => {
+ let RankingShow = [...RankingDaily.value]
+ if (RankingDaily.value.length < 3) {
+ let addNullUser = Array.from({ length: 3 - RankingDaily.value.length }, () => ({
+ avatar: '',
+ nickname: '',
+ quantity: '',
+ }))
+ RankingShow.push(...addNullUser)
+ }
+ return RankingShow
+})
+
+// 展示用的日榜
+const showRankingDaily = computed(() => {
+ return RankingDaily.value.filter((_, index) => index >= 3)
// return []
})
@@ -986,16 +1245,30 @@ const getAllTopOne = async () => {
}
}
-// 获取排行榜和我的排名
-const getListAndMy = async () => {
+// 获取周排行榜和我的排名
+const getWeekListAndMy = async () => {
let data = {
activityType: 10,
}
const resMyWeekStarRanking = await getRankingListAndMyRanking(data)
console.log('resMyWeekStarRanking:', resMyWeekStarRanking)
if (resMyWeekStarRanking.status && resMyWeekStarRanking.body) {
- myRanking.value = resMyWeekStarRanking.body.currentUserRank
- Ranking.value = resMyWeekStarRanking.body.rankingList
+ myWeekRanking.value = resMyWeekStarRanking.body.currentUserRank
+ RankingWeek.value = resMyWeekStarRanking.body.rankingList
+ }
+}
+
+// 获取日排行榜和我的排名
+const getDailyListAndMy = async () => {
+ let data = {
+ activityType: 15,
+ cycleType: 1,
+ }
+ const resDailyListAndMy = await getRankingListAndMyRanking(data)
+ console.log('resDailyListAndMy:', resDailyListAndMy)
+ if (resDailyListAndMy.status && resDailyListAndMy.body) {
+ myDailyRanking.value = resDailyListAndMy.body.currentUserRank
+ RankingDaily.value = resDailyListAndMy.body.rankingList
}
}
@@ -1007,25 +1280,13 @@ const getRewardsAndGifts = async () => {
}
}
-// 获取指定类型活动资源
-const getActivityResource = async () => {
- let data = {
- sysOrigin: 'LIKEI',
- activityType: 'GAME_KING',
- }
- const resActivityResource = await activityResource(data)
- if (resActivityResource.status && resActivityResource.body) {
- specialReward.value = resActivityResource.body?.[0]?.propsGroup?.activityRewardProps?.[0]
- }
-}
-
// 刷新页面数据
const initData = async () => {
await Promise.all([
getAllTopOne(), // 获取历史榜首
- getListAndMy(), // 获取排行榜和我的排名
+ getWeekListAndMy(), // 获取周榜和我的排名
+ getDailyListAndMy(), // 获取日榜和我的排名
getRewardsAndGifts(), // 获取本周的礼物和奖励列表
- // getActivityResource(), // 获取指定类型活动资源
])
}
@@ -1038,17 +1299,21 @@ const preloadCriticalImages = async () => {
imageUrl(getImgName('dailyPopUpNew')),
imageUrl('helpBt'),
imageUrl(getImgName('helpInfo')),
- imageUrl(getImgName('historyBt')),
imageUrl(getImgName('historyBtActive')),
imageUrl('myRankingBg'),
- imageUrl(getImgName('rankingBt')),
imageUrl(getImgName('rankingBtActive')),
imageUrl(getImgName('rewardBtActive')),
- imageUrl(getImgName('rewardsBt')),
+ imageUrl('rankDailyBt'),
+ imageUrl('rankWeeklyBt'),
imageUrl('RankingBottomBorder'),
imageUrl('RankingCenterBg'),
imageUrl('RankingItem'),
imageUrl(getImgName('RankingMain')),
+ imageUrl('rewardDailyBt'),
+ imageUrl('rewardWeeklyBt'),
+ imageUrl('top1RewardDaily'),
+ imageUrl('top2RewardDaily'),
+ imageUrl('top3RewardDaily'),
imageUrl('timeBg'),
imageUrl('topBackBt'),
imageUrl('topNextBt'),
@@ -1058,6 +1323,7 @@ const preloadCriticalImages = async () => {
imageUrl('top4'),
imageUrl('top5_7'),
imageUrl('top8_10'),
+ imageUrl('top1-3FrameDaily'),
]
await preloadImages(criticalImages)
@@ -1147,6 +1413,10 @@ onUnmounted(() => {
align-items: center;
}
+.grayscale-container {
+ filter: grayscale(100%) brightness(100%);
+}
+
.btTitle {
color: #fff;
font-weight: 700;