[年会抽奖]修改继续抽奖逻辑

zouyang0921
1 parent 423a588b
Showing 2 changed files with 34 additions and 4 deletions
lottery.html
lottery.js
@@ -50,7 +50,9 @@
         .result {width: 100%;height: 1120px;box-sizing: border-box;padding: 290px 90px 0;background: url('./img/pc/result_bg.png') no-repeat;background-size: 100% 100%;}
         .result-title {text-align: center;font-size: 60px;color: #DC4834;margin-bottom: 22px;}
         .result-main-header, .result-item {display: flex;align-items: center;text-align: center;font-size: 40px;color: #DC4834;}
-        .result-item {margin-top: 11px;}
+        .result-list {margin-top: 10px;height: 600px;padding: 6px 0; overflow-y: auto;-ms-overflow-style: none;}
+        .result-list::-webkit-scrollbar {width: 0 !important;}
+        .result-item:not(:last-of-type) {margin-bottom: 11px;}
         .result-cell {flex: 2;-webkit-flex: 2;}
         .result-cell-del {flex: 1;-webkit-flex: 1;display: flex;justify-content: center;align-items: center;}
         .fw-500 {font-weight: 500;}
@@ -113,7 +115,7 @@
             </div>
             <div class="lottery-btn start-btn" onclick="action.start()">开始抽奖</div>
             <div class="lottery-btn stop-btn hide" onclick="action.stop()">暂停</div>
-            <div class="lottery-btn continue-btn hide" onclick="action.togglePage(true)">继续抽奖</div>
+            <div class="lottery-btn continue-btn hide" onclick="action.continueLottery()">继续抽奖</div>
         </div>
         <div class="main-right">
             <div class="result">
@@ -12,6 +12,7 @@ let action = {
     curPrizeIndex: -1, // 正在抽奖的奖项的索引
     userList: [], // 抽奖用户列表
     currentUser: null, // 当前中奖的用户
+    curUserIndex: -1, // 当前中奖的用户索引
     winnerList: [], // 中奖用户列表
     // 初始化数据
     init: function() {
@@ -157,6 +158,26 @@ let action = {
         }, interval);
         return timer;
     },
+    continueLottery: function() {
+        action.userList.splice(action.curUserIndex, 1);
+
+        // 初始化头像部分
+        $('.avatar-img, .user-info .scroll-wrap').show();
+        $('.winner, .winner-name, .winner-no').hide();
+        // 初始化按钮
+        $('.stop-btn').show();
+        $('.continue-btn, .start-btn').hide();
+
+        if (action.userList.length === 0) {
+            alert('暂无数据');
+            return;
+        }
+
+        // 开始抽奖动画
+        imgTimer = this.lotteryAnimation($('.avatar-list'), '.avatar-item', 244);
+        nameTimer = this.lotteryAnimation($('.user-name .scroll-list'), '.scroll-item', 146);
+        prizeNoTimer = this.lotteryAnimation($('.user-no .scroll-list'), '.scroll-item', 146);
+    },
     // 停止
     stop: function() {
         // 按钮效果
@@ -173,6 +194,7 @@ let action = {
         let random = Math.floor(Math.random() * (action.userList.length - 1 + 1)); // (0 ~ length-1)
         console.log('random: ', random);
         action.currentUser = action.userList[random];
+        action.curUserIndex = random;
         // 保存中奖记录
         action.saveLottery();
         action.winnerList.push(action.currentUser);
@@ -217,8 +239,14 @@ let action = {
     },
     // 删除中奖用户
     delWinner: function(index) {
-        this.winnerList.splice(index, 1);
-        this.updateResultTmpl();
+        var url = '/apicp.DelLottery.php';
+        var data = {
+            id: action.winnerList[index].id
+        };
+        var callback = function() {
+            action.getWinnerList(action.prizeList[action.curPrizeIndex].id);
+        };
+        baseRquest.post(url, data, callback);
     }
 }
 // 系统设置动作