feat(春节活动页面): 调整接口，设置预加载未成功每10s刷新一次页面

.env.development

@@ -8,4 +8,4 @@ VITE_APP_TITLE=Azizi H5 (Development)
 #VITE_USER_AUTH=EB4BAD4C6439CF503B16267C712F5AB6.djIlM0ExOTU3MzQ1MzEyOTYxNTI3ODA5JTNBTElLRUklM0ExNzU4Mjc4MDEzNzQ0JTNBMTc1NTY4NjAxMzc0NA==
 
 # 代理用户 8826603
-VITE_USER_AUTH=F7D59165057DB9913571DF5A6C9B014B.djIlM0ExOTkwNjg1NTY1MzMzNTkwMDE3JTNBTElLRUklM0ExNzcxNTYwNTI4NTc1JTNBMTc2ODk2ODUyODU3NQ==
+VITE_USER_AUTH=45C34ABC2A47CB323383D9E78175DB2D.djIlM0ExOTkwNjg1NTY1MzMzNTkwMDE3JTNBTElLRUklM0ExNzcyNzgyNTI1MjIzJTNBMTc3MDE5MDUyNTIyMw==

src/views/Activities/SpringFestival/RankingReward.vue

@@ -9,7 +9,7 @@
     >
       <!-- 奖励列表 -->
       <div
-        v-for="(reward, rewardIndex) in rewardsTop.rewardProps"
+        v-for="(reward, rewardIndex) in rewardsTop.propsGroup.activityRewardProps"
         :key="rewardIndex"
         style="
           width: 100%;

src/views/Activities/SpringFestival/Task.vue

@@ -768,6 +768,7 @@ const barrageText = (item) => {
 const scrollWrapper = ref(null) //滚动模块
 
 watch(luckyUsers, async () => {
+  if (luckyUsers.value == [] || !scrollWrapper.value) return
   await nextTick()
 
   let retryCount = 0 // 当前重试次数
@@ -779,17 +780,17 @@ watch(luckyUsers, async () => {
     if (!wrapper) return
 
     const contentWidth = wrapper.scrollWidth
-    console.log('luckyUsers 更新后的宽度:', contentWidth)
+    // console.log('luckyUsers 更新后的宽度:', contentWidth)
 
     if (contentWidth === 0) {
       retryCount++
       if (retryCount <= maxRetries) {
-        console.warn(`宽度为 0，第 ${retryCount} 次重试...`)
+        // console.warn(`宽度为 0，第 ${retryCount} 次重试...`)
         // 清除旧的定时器，避免多个实例同时运行
         if (timerId) clearTimeout(timerId)
         timerId = setTimeout(calculateWidth, 500) // 延时重试
       } else {
-        console.error('重试次数已达上限，未能获取有效宽度')
+        // console.error('重试次数已达上限，未能获取有效宽度')
       }
     } else {
       // 正常处理逻辑

src/views/Activities/SpringFestival/index.vue

@@ -628,6 +628,7 @@ import {
   activityDetail, // 获取活动详情
   ranklist, //获取排行榜
   activityRewardConfigs, // 获取活动奖励配置列表
+  apiGiftsRankingRewardConfigs, // 获取礼物排行榜奖励列表.
   winnerHistory, //获取历史中奖用户
   withdrawableAmount, //获取可提现金额
 } from '@/api/lottery'
@@ -697,6 +698,7 @@ const currentLangType = computed(() => {
 })
 
 const isLoading = ref(true) // 预加载状态
+const timeoutId = ref(null) // 超时定时器 ID
 
 // 获取OSS图片URL的函数
 const imageUrl = (filename) => getPngUrl('Activities/SpringFestival/', filename)
@@ -949,7 +951,7 @@ const getMyLotteryTicketCount = async () => {
 
 //获取中奖用户列表
 const getWinners = async () => {
-  const resWinners = await winnerHistory()
+  const resWinners = await winnerHistory('2007771533988204877')
   if (resWinners.status && resWinners.body) {
     luckyUsers.value = resWinners.body
   }
@@ -1098,42 +1100,53 @@ const getRanking = async (rankingType = 'lottery') => {
 
 //获取游戏奖励列表
 const getGameReward = async () => {
-  let data = {
+  const resActivityReward = await apiGiftsRankingRewardConfigs()
-    activityType: 'CONSUMPTION_ACTIVITY',
-    activityId: '2007771533988204877',
-  }
-  const resActivityReward = await activityRewardConfigs(data)
   if (resActivityReward.status && resActivityReward.body) {
-    let tempList = resActivityReward.body.filter((_, index) => index <= 3)
+    rankingRewards.value = resActivityReward.body.map((rewards) => {
-    rankingRewards.value = tempList.map((rewards) => {
-      let jsonData = JSON.parse(rewards.jsonData)
       let addReward = []
-
+      if (rewards.rule.sort == 1) {
-      if (rewards.sort == 1) {
         addReward = [
           {
-            type: 'TICKET',
+            type: 'DOLLARS',
-            cover: imageUrl('ticket'),
+            cover: '',
-            content: 10,
+            content: 100,
           },
           {
-            type: 'TICKET',
+            type: 'GIFT',
-            cover: imageUrl('ticket'),
+            cover: imageUrl('IDReward'),
-            content: 10,
+            content: 'ID: XXXX',
           },
+        ]
+      } else if (rewards.rule.sort == 2) {
+        addReward = [
           {
-            type: 'TICKET',
+            type: 'DOLLARS',
-            cover: imageUrl('ticket'),
+            cover: '',
+            content: 50,
+          },
+        ]
+      } else if (rewards.rule.sort == 3) {
+        addReward = [
+          {
+            type: 'DOLLARS',
+            cover: '',
+            content: 30,
+          },
+        ]
+      } else if (rewards.rule.sort == 4) {
+        addReward = [
+          {
+            type: 'DOLLARS',
+            cover: '',
             content: 10,
           },
         ]
       }
 
-      rewards.rewardProps.push(...addReward) //补充奖励项
+      rewards.propsGroup.activityRewardProps.push(...addReward) //补充奖励项
 
       rewards = {
         ...rewards,
-        ...jsonData,
       }
       return rewards
     })
@@ -1146,7 +1159,7 @@ const getGameReward = async () => {
 const getRechargeReward = async () => {
   let data = {
     activityType: 'CONSUMPTION_ACTIVITY',
-    activityId: '2007771533988204877',
+    activityId: '2007771533988204888',
   }
   const resActivityReward = await activityRewardConfigs(data)
   if (resActivityReward.status && resActivityReward.body) {
@@ -1234,11 +1247,36 @@ const initData = async () => {
 // 预加载关键图片
 const preloadCriticalImages = async () => {
   const criticalImages = [
-    // // 背景
+    // 背景
-    // imageUrl('bg1'),
+    imageUrl('bg1'),
-    // // 按钮
+    imageUrl('bg2'),
-    // imageUrl(getImgName('rankingBtActive')),
+    imageUrl('bg3'),
-    // imageUrl(getImgName('rankingBt')),
+    imageUrl('bg4'),
+    imageUrl('bg5'),
+
+    // 排行榜背景
+    imageUrl('bg1'),
+    imageUrl('bg2-2'),
+
+    //  倒计时
+    imageUrl('TimeBg'),
+
+    //  按钮
+    imageUrl(getImgName('TagGameBt')),
+    imageUrl(getImgName('TagRechargeBt')),
+    imageUrl(getImgName('MTaskBt')),
+    imageUrl(getImgName('MRankingBt')),
+    imageUrl(getImgName('MRewardBt')),
+
+    // 任务列表
+    imageUrl('taskListBg'),
+    imageUrl('taskItemBg'),
+    imageUrl('taskTypeGift'),
+    imageUrl('taskTypeGame'),
+    imageUrl('ticket'),
+    imageUrl('taskBtGo'),
+    imageUrl('taskBtReceive'),
+    imageUrl('taskBtReceived'),
   ]
 
   await preloadImages(criticalImages)
@@ -1248,7 +1286,10 @@ const preloadCriticalImages = async () => {
 const completePreloading = async () => {
   try {
     // 执行所有初始化操作
-    await Promise.all([initData(), preloadCriticalImages()])
+    await Promise.all([
+      // initData(),
+      preloadCriticalImages(),
+    ])
     console.log('预加载完成，初始化数据成功')
   } catch (error) {
     console.error('预加载过程中发生错误:', error)
@@ -1260,7 +1301,52 @@ const completePreloading = async () => {
 
 // 预加载其他图片
 const preloadOtherImages = async () => {
-  const criticalImages = []
+  const criticalImages = [
+    // 我的排名
+    imageUrl('myRankingBg'),
+    imageUrl('rankingNumBg'),
+    imageUrl('userFrame'),
+
+    // 抽奖结果
+    imageUrl('resultBg'),
+    imageUrl('resultBack'),
+    imageUrl('resultNext'),
+
+    // 中奖历史
+    imageUrl('recordBg'),
+
+    // help弹窗
+    imageUrl(getImgName('helpInfo')),
+
+    // 抽奖组件
+    imageUrl('lotteryBg'),
+    imageUrl('historyBt'),
+    imageUrl('prizeActiveFrame'),
+    imageUrl('ticket'),
+    imageUrl('earningInfoBg'),
+
+    // 排行榜组件
+    imageUrl('top1Bg'),
+    imageUrl('top2Bg'),
+    imageUrl('top3Bg'),
+    imageUrl('rankingNumBg'),
+    imageUrl('rankingItemBg'),
+
+    // 排行榜奖励组件
+    imageUrl('rankingRewardTop1Bg'),
+    imageUrl('rankingRewardTop2Bg'),
+    imageUrl('rankingRewardTop3Bg'),
+    imageUrl('rankingRewardTop4Bg'),
+
+    // 充值奖励组件
+    imageUrl('receiveBt'),
+    imageUrl('rechargeReward100'),
+    imageUrl('rechargeReward500'),
+    imageUrl('rechargeReward1000'),
+    imageUrl('rechargeReward3000'),
+    imageUrl('rechargeReward5000'),
+    imageUrl('rechargeReward10000'),
+  ]
 
   await preloadImages(criticalImages)
 }
@@ -1273,8 +1359,26 @@ const connectToAppHandler = async () => {
   })
 }
 
+// 设置超时刷新逻辑
+const startTimeoutCheck = () => {
+  timeoutId.value = setTimeout(() => {
+    if (isLoading.value) {
+      console.warn('⏰ 预加载超时，正在刷新页面...')
+      window.location.reload() // 刷新页面
+    }
+  }, 20000) // 20 秒超时
+}
+
+// 清理定时器
+const clearTimeoutCheck = () => {
+  if (timeoutId.value) {
+    clearTimeout(timeoutId.value)
+    timeoutId.value = null
+  }
+}
+
 // 组件挂载时检测环境
-onMounted(() => {
+onMounted(async () => {
   springFestivalStore.clear()
 
   checkShow() // 检查是否展示每日弹窗
@@ -1287,7 +1391,12 @@ onMounted(() => {
     changeTag('gamePlay')
     changeModule('task')
   }
-  connectToAppHandler()
+
+  // 启动超时检测
+  startTimeoutCheck()
+
+  await connectToAppHandler()
+  initData()
   preloadOtherImages() // 预加载其他图片
   startCountdown() //开启倒计时
 })
@@ -1299,6 +1408,8 @@ onUnmounted(() => {
     clearInterval(countdownTimer)
     countdownTimer = null
   }
+
+  clearTimeoutCheck() // 清理超时检测定时器
   clearPayee() // 清空收款人信息
 })
 </script>
@@ -1315,7 +1426,7 @@ onUnmounted(() => {
 .fullPage {
   width: 100vw;
   min-height: 100vh;
-  background: #ff79a1;
+  background: #da4302;
   position: relative;
 }