feat(春节活动页面): 调整接口,设置预加载未成功每10s刷新一次页面
This commit is contained in:
parent
14d33b15b8
commit
92cc25ac07
@ -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==
|
||||
@ -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%;
|
||||
|
||||
@ -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 {
|
||||
// 正常处理逻辑
|
||||
|
||||
@ -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 = {
|
||||
activityType: 'CONSUMPTION_ACTIVITY',
|
||||
activityId: '2007771533988204877',
|
||||
}
|
||||
const resActivityReward = await activityRewardConfigs(data)
|
||||
const resActivityReward = await apiGiftsRankingRewardConfigs()
|
||||
if (resActivityReward.status && resActivityReward.body) {
|
||||
let tempList = resActivityReward.body.filter((_, index) => index <= 3)
|
||||
rankingRewards.value = tempList.map((rewards) => {
|
||||
let jsonData = JSON.parse(rewards.jsonData)
|
||||
rankingRewards.value = resActivityReward.body.map((rewards) => {
|
||||
let addReward = []
|
||||
|
||||
if (rewards.sort == 1) {
|
||||
if (rewards.rule.sort == 1) {
|
||||
addReward = [
|
||||
{
|
||||
type: 'TICKET',
|
||||
cover: imageUrl('ticket'),
|
||||
content: 10,
|
||||
type: 'DOLLARS',
|
||||
cover: '',
|
||||
content: 100,
|
||||
},
|
||||
{
|
||||
type: 'TICKET',
|
||||
cover: imageUrl('ticket'),
|
||||
content: 10,
|
||||
type: 'GIFT',
|
||||
cover: imageUrl('IDReward'),
|
||||
content: 'ID: XXXX',
|
||||
},
|
||||
]
|
||||
} else if (rewards.rule.sort == 2) {
|
||||
addReward = [
|
||||
{
|
||||
type: 'TICKET',
|
||||
cover: imageUrl('ticket'),
|
||||
type: 'DOLLARS',
|
||||
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(getImgName('rankingBtActive')),
|
||||
// imageUrl(getImgName('rankingBt')),
|
||||
// 背景
|
||||
imageUrl('bg1'),
|
||||
imageUrl('bg2'),
|
||||
imageUrl('bg3'),
|
||||
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;
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user