diff --git a/subPages/lottery/lottery.vue b/subPages/lottery/lottery.vue index 85af11e..abac78f 100644 --- a/subPages/lottery/lottery.vue +++ b/subPages/lottery/lottery.vue @@ -3,7 +3,7 @@ - @@ -16,7 +16,7 @@ --> + display-multiple-items="2" :duration="duration"> @@ -28,7 +28,7 @@ - + 活动规则 @@ -136,8 +136,8 @@ goldNum: 20, // 每天免费抽奖次数 freeNumDay: 3, - interval:3000, - duration:12000, + interval: 3000, + duration: 12000, list: ['1分钟前,无夏购买了会员', '2分钟前,无夏购买了会员', '3分钟前,无夏购买了会员'] } }, @@ -162,23 +162,77 @@ }, // 重新生成 handleInitCanvas() { - - this.prizeList = [] this.getPrizeList() }, // 获取奖品列表 - async getPrizeList() { + getPrizeList() { uni.showLoading({ title: '奖品准备中...' }) // 等待接口返回的数据进一步处理 - let res = await this.requestApiGetPrizeList() - if (res.ok) { - uni.hideLoading() - let data = res.data - if (data.length) { - this.prizeList = data + // let res = await this.requestApiGetPrizeList() + // if (res.ok) { + // uni.hideLoading() + // let data = res.data + // if (data.length) { + this.prizeList = [{ + prizeId: 1, + prizeName: '0.1元现金', + prizeStock: 10, + prizeWeight: 200, + prizeImage: '/static/img/order3.png' + }, + { + prizeId: 2, + prizeName: '10元现金', + prizeStock: 0, + prizeWeight: 50, + prizeImage: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/56f085e0-bcfe-11ea-b244-a9f5e5565f30.png' + }, + { + prizeId: 3, + prizeName: '5元话费', + prizeStock: 1, + prizeWeight: 80, + prizeImage: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAABCElEQVRoge3YMa4BURSH8Y8o7UAp0WgkotBZwluAfhqlZSgUGr23ENUUCpppJnTswAIUSCaTiziZJ8d9/193zdzrfMltABF5plb+oLscDoAV0Pn8OC/lwDhL0k35QT3wstcIuM61Cj0IhXiNuAvOFwr5SgrxRiHeKMSbhnHfAVgU1i1gajhnBpwK6wnQtgxkDTlmSTq/L7rLYQ9byG+WpLvCOT8YQ6K5WgrxRiHeKMQbhXijEG8U4o1CvIkmxPrDquwMrI37KlFJSJake2BUxVlW0VytaEKsV6t5+8Ohak3rRmtIH9hav/QvRHO1FOKNQrwJheQfn+I9wflCIeNHLzuQc51PRP6rC1ZeIm1I8cC5AAAAAElFTkSuQmCC' + }, + { + prizeId: 4, + prizeName: '50元现金', + prizeStock: 0, + prizeWeight: 10, + prizeImage: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAB2klEQVRIia3Wv09TURjG8U+u2kQZcNENh2ok0cnJ0R+L0RB2g/EvwITEwRgnV0Zx0fAHYBh0khBD4sBAmAgDiwQNg4qwmSBDAYf7Fi+n97al9UlObnvO836f3tO355b2GsAYZrCBPRzGdSPmx8J3YtXwDDsB7TR2wl/rNmAYK13C07ES9W11E9s9BjTHdnBKVf8PAcWgehpwCssF0w/5FzqLgw7AA7zDQ/wqzC8H90jjSeFMYW0Yr8PzALfjOh7z1wve2YTzpLlQw2ay+KZ1N7vS24SziVqGexhKzB07pEJXk/dDwTetdZ9HewwZLWFNw2oyudZjQFNrCW8109pqS32GpPX1TOu586fPkLR+IEMjmbzYZ0ha34Atx/fwW58hXxPeFixo7Yg7PQbcKmEtZFgsMb/C4AkDBuUnQKpFuFZI3cZuvP6C+8g6wDP572O95C4Og49/W/YJl/G5YPqO9yV3dh4f8LMCfhjcI93Afix8xAX5SVx2YBY10yagEdxjmiwY7uISXuIFrlSEPG0TMllWcAbzYViXd0rzeXC6ImSiImA+eKU6h7mCeV/eCBMnCJkLzpHSztnFCJ7L//ZkOFv1iRLtRd1IcLpSHVP4jccVnkexPqXkmd7UX15b7tiz29ReAAAAAElFTkSuQmCC' + }, + { + prizeId: 5, + prizeName: '1卷抽纸', + prizeStock: 3, + prizeWeight: 3000, + prizeImage: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAABCElEQVRoge3YMa4BURSH8Y8o7UAp0WgkotBZwluAfhqlZSgUGr23ENUUCpppJnTswAIUSCaTiziZJ8d9/193zdzrfMltABF5plb+oLscDoAV0Pn8OC/lwDhL0k35QT3wstcIuM61Cj0IhXiNuAvOFwr5SgrxRiHeKMSbhnHfAVgU1i1gajhnBpwK6wnQtgxkDTlmSTq/L7rLYQ9byG+WpLvCOT8YQ6K5WgrxRiHeKMQbhXijEG8U4o1CvIkmxPrDquwMrI37KlFJSJake2BUxVlW0VytaEKsV6t5+8Ohak3rRmtIH9hav/QvRHO1FOKNQrwJheQfn+I9wflCIeNHLzuQc51PRP6rC1ZeIm1I8cC5AAAAAElFTkSuQmCC' + }, + { + prizeId: 6, + prizeName: '0.2元现金', + prizeStock: 8, + prizeWeight: 120, + prizeImage: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAABCElEQVRoge3YMa4BURSH8Y8o7UAp0WgkotBZwluAfhqlZSgUGr23ENUUCpppJnTswAIUSCaTiziZJ8d9/193zdzrfMltABF5plb+oLscDoAV0Pn8OC/lwDhL0k35QT3wstcIuM61Cj0IhXiNuAvOFwr5SgrxRiHeKMSbhnHfAVgU1i1gajhnBpwK6wnQtgxkDTlmSTq/L7rLYQ9byG+WpLvCOT8YQ6K5WgrxRiHeKMQbhXijEG8U4o1CvIkmxPrDquwMrI37KlFJSJake2BUxVlW0VytaEKsV6t5+8Ohak3rRmtIH9hav/QvRHO1FOKNQrwJheQfn+I9wflCIeNHLzuQc51PRP6rC1ZeIm1I8cC5AAAAAElFTkSuQmCC' + }, + { + prizeId: 7, + prizeName: '谢谢参与', + prizeStock: 100, + prizeWeight: 10000, + prizeImage: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAABCElEQVRoge3YMa4BURSH8Y8o7UAp0WgkotBZwluAfhqlZSgUGr23ENUUCpppJnTswAIUSCaTiziZJ8d9/193zdzrfMltABF5plb+oLscDoAV0Pn8OC/lwDhL0k35QT3wstcIuM61Cj0IhXiNuAvOFwr5SgrxRiHeKMSbhnHfAVgU1i1gajhnBpwK6wnQtgxkDTlmSTq/L7rLYQ9byG+WpLvCOT8YQ6K5WgrxRiHeKMQbhXijEG8U4o1CvIkmxPrDquwMrI37KlFJSJake2BUxVlW0VytaEKsV6t5+8Ohak3rRmtIH9hav/QvRHO1FOKNQrwJheQfn+I9wflCIeNHLzuQc51PRP6rC1ZeIm1I8cC5AAAAAElFTkSuQmCC' + }, + { + prizeId: 8, + prizeName: '100金币', + prizeStock: 100, + prizeWeight: 3000, + prizeImage: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAABCElEQVRoge3YMa4BURSH8Y8o7UAp0WgkotBZwluAfhqlZSgUGr23ENUUCpppJnTswAIUSCaTiziZJ8d9/193zdzrfMltABF5plb+oLscDoAV0Pn8OC/lwDhL0k35QT3wstcIuM61Cj0IhXiNuAvOFwr5SgrxRiHeKMSbhnHfAVgU1i1gajhnBpwK6wnQtgxkDTlmSTq/L7rLYQ9byG+WpLvCOT8YQ6K5WgrxRiHeKMQbhXijEG8U4o1CvIkmxPrDquwMrI37KlFJSJake2BUxVlW0VytaEKsV6t5+8Ohak3rRmtIH9hav/QvRHO1FOKNQrwJheQfn+I9wflCIeNHLzuQc51PRP6rC1ZeIm1I8cC5AAAAAElFTkSuQmCC' + } + ] // 如果开启了前端控制概率 // 得出权重的最大值并生成权重数组 @@ -189,15 +243,15 @@ prizeWeightArrSort.sort((a, b) => b - a) this.prizeWeightMax = prizeWeightArrSort[0] } - } - } else { - uni.hideLoading() - uni.showToast({ - title: '获取奖品失败', - mask: true, - icon: 'none' - }) - } + // } + // } else { + // uni.hideLoading() + // uni.showToast({ + // title: '获取奖品失败', + // mask: true, + // icon: 'none' + // }) + // } }, // 模拟请求 获取奖品列表 接口, // 注意这里返回的是一个 Promise @@ -276,113 +330,12 @@ // 本次抽奖开始 handleDrawStart() { console.log('触发抽奖按钮') - if (this.prizeing) return - this.prizeing = true - - // 还有免费数次或者剩余金币足够抽一次 - if (this.freeNum > 0 || this.goldCoin >= this.goldNum) { - - // 更新免费次数或金币余额 - if (this.freeNum > 0) { - this.freeNum-- - } else if (this.goldCoin >= this.goldNum) { - this.goldCoin -= this.goldNum - } - - this.tryLotteryDraw() - } else { - this.prizeing = false - uni.showModal({ - title: '金币不足', - content: '是否前往赚取金币?', - success: (res) => { - // 这里需要根据业务需求处理,一般情况下会引导用户前往赚取金币的页面 - console.log('金币不足', res) - } - }) - } + this.tryLotteryDraw() }, // 尝试发起抽奖 tryLotteryDraw() { console.log('旋转开始,获取中奖下标......') - // 判断是否由前端控制概率 - if (this.onFrontend) { - this.localGetPrizeIndex() - } else { - this.remoteGetPrizeIndex() - } - }, - // 本地获取中奖下标 - localGetPrizeIndex() { - console.warn('###当前处于前端控制中奖概率,安全起见,强烈建议由后端控制###') - // 前端控制概率的情况下,需要拿到最接近随机权重且大于随机权重的值 - // 后端控制概率的情况下,通常会直接返回 prizeId - if (!this.prizeWeightMax) { - console.warn('###当前已开启前端控制中奖概率,但是奖品数据列表中的 prizeWeight 参数似乎配置不正确###') - return - } - console.log('当前权重最大值为 =>', this.prizeWeightMax) - - // 注意这里使用了 Math.ceil,如果某个权重的值为 0,则始终无法中奖 - let randomWeight = Math.ceil(Math.random() * this.prizeWeightMax) - console.log('本次权重随机数 =>', randomWeight) - - // 生成大于等于随机权重的数组 - let tempMaxArrs = [] - this.prizeList.forEach((item) => { - if (item.prizeWeight >= randomWeight) { - tempMaxArrs.push(item.prizeWeight) - } - }) - console.log('tempMaxArrs', tempMaxArrs) - - // 如果大于随机权重的数组有值,先对这个数组排序然后取值 - // 反之新建一个临时的包含所有权重的已排序数组,然后取值 - let tempMaxArrsLen = tempMaxArrs.length - if (tempMaxArrsLen) { - tempMaxArrs.sort((a, b) => a - b) - // 取值时,如果存在多个值,分两种情况 - if (tempMaxArrsLen > 1) { - // 检查是否存在重复的值 - let sameCount = 0 - for (let i = 0; i < tempMaxArrs.length; i++) { - if (tempMaxArrs[i] === tempMaxArrs[0]) { - sameCount++ - } - } - - // 值不相等的情况下取最接近的值,也就是第1个值 - if (sameCount === 1) { - this.prizeIndex = this.prizeWeightArr.indexOf(tempMaxArrs[0]) - } else { - // 存在值相等时,随机取值,当然这里你可以自己决定是否随机取值 - let sameWeight = tempMaxArrs[0] - let sameWeightArr = [] - let sameWeightItem = {} - this.prizeWeightArr.forEach((item, index) => { - if (item === sameWeight) { - sameWeightArr.push({ - prizeWeight: item, - index - }) - } - }) - console.log('sameWeightArr', sameWeightArr) - sameWeightItem = sameWeightArr[Math.floor(Math.random() * sameWeightArr.length)] - console.log('sameWeightItem', sameWeightItem) - this.prizeIndex = sameWeightItem.index - } - } else { - this.prizeIndex = this.prizeWeightArr.indexOf(tempMaxArrs[0]) - } - } - - console.log('本次抽中奖品 =>', this.prizeList[this.prizeIndex].prizeName) - - // 如果奖品设有库存 - if (this.onStock) { - console.log('本次奖品库存 =>', this.prizeList[this.prizeIndex].prizeStock) - } + this.remoteGetPrizeIndex() }, // 远程请求接口获取中奖下标 // 大哥,这里只是模拟,别告诉我你不会对接自己的接口 @@ -392,12 +345,9 @@ let stoTimer = setTimeout(() => { clearTimeout(stoTimer) stoTimer = null - let list = [...this.prizeList] - // 这里随机产生的 prizeId 是模拟后端返回的 prizeId - let prizeId = Math.floor(Math.random() * list.length + 1) - + let prizeId = Math.floor(Math.random() * list.length + 1); // 拿到后端返回的 prizeId 后,开始循环比对得出那个中奖的数据 for (let i = 0; i < list.length; i++) { let item = list[i] @@ -463,7 +413,6 @@