抽奖优化

src/api/single-page/lottery.js

@@ -23,9 +23,10 @@ export function recordLotteryResult(data) {
     })
 }
 
-export function selectWonUsers() {
+export function selectWonUsers(data) {
     return request({
         url: '/lottery/selectWonUsers',
-        method: 'get',
+        method: 'post',
+        data
     })
 }

src/views/single-page/Lottery.vue

@@ -7,18 +7,20 @@
             background-image: url('http://webhis.thyy.cn:8080/resource/image/happyAside.jpg')">
         <div style="height: 1px"></div>
 
-        <div style="background-color: rgba(255,255,255,0.7); margin: 30px; padding: 2px; border-radius: 8px">
+        <div style="background-color: rgba(255,255,255,0.7); margin: 16px; padding: 2px; border-radius: 8px">
           <div style="margin: 12px 0 12px 10px; font-size: 18px; color: #014841; font-weight: bold">
             奖项设置
             <span class="reset-pool" @click="initLotteryPool">重置为初始状态</span>
           </div>
-          <div style="margin-left: 20px">
+          <div style="margin-left: 12px">
             <div v-for="item in lotteryPool" :key="item.code">
               <div style="display: flex; line-height: 32px; font-size: 16px">
-                <div style="color: black; font-weight: bold">{{ item.name }}：</div>
-                <div style="width: 60px; color: #007bd9; font-weight: bold">{{ item.amount }} 份</div>
-                <div style="width: 40px; text-align: right">
+                <div style="width: 65px; color: black; font-weight: bold">{{ item.name }}：</div>
+                <div style="width: 40px; color: #007bd9; font-weight: bold">{{ item.amount }} 份</div>
+                <div style="width: calc(100% - 120px); text-align: right">
                   <el-button circle icon="Edit" @click="editRule(item)"></el-button>
+                  <el-checkbox v-model="item.showWinner" @change="refreshHistory"
+                               style="margin-left: 8px">名单</el-checkbox>
                 </div>
               </div>
             </div>
@@ -86,10 +88,10 @@ const currentUserName = ref('等待抽奖')
 
 function initLotteryPool() {
   lotteryPool.value = [
-    {code: 0, name: '特等奖', amount: 0, round: 0},
-    {code: 1, name: '一等奖', amount: 0, round: 0},
-    {code: 2, name: '二等奖', amount: 0, round: 0},
-    {code: 3, name: '三等奖', amount: 0, round: 0},
+    {code: 0, name: '特等奖', amount: 0, round: 0, showWinner: false},
+    {code: 1, name: '一等奖', amount: 0, round: 0, showWinner: false},
+    {code: 2, name: '二等奖', amount: 0, round: 0, showWinner: false},
+    {code: 3, name: '三等奖', amount: 0, round: 0, showWinner: false},
   ]
   localStorage.setItem('lotteryPool', JSON.stringify(lotteryPool.value))
 }
@@ -97,21 +99,21 @@ function initLotteryPool() {
 let carouselInterval = null
 
 function moveToWinner() {
+  let offset = continuous.value ? 1000 : 4500;
   let timer = 0;
   carouselInterval = setInterval(() => {
     timer += 100
-    if (timer >= 4000) {
+    if (timer >= offset) {
       winnerExposed()
       return
     }
     let index = Math.floor(Math.random() * lotteryUsers.value.length);
     let tempUser = lotteryUsers.value[index]
     currentUserName.value = tempUser.codeRs + ' - ' + tempUser.name
-    if (tempUser.codeRs === winner.userCodeRs && timer >= 3000) {
+    if (tempUser.codeRs === winner.userCodeRs && timer >= offset) {
       winnerExposed()
     }
   }, 100)
-
 }
 
 function winnerExposed() {
@@ -156,10 +158,6 @@ function startLottery() {
     })
   }).catch(() => {
     duringLottery.value = false
-    ElMessageBox.alert('所有奖项均已抽完！', '提示', {
-      type: 'error',
-      showCancelButton: false
-    })
   })
 }
 
@@ -173,10 +171,13 @@ function getWinnableLottery() {
       if (item.amount > 0) {
         item.amount -= 1
         item.round += 1
+        item.showWinner = true
         currentLotteryName.value = item.name
         localStorage.setItem('lotteryPool', JSON.stringify(lotteryPool.value))
         resolve(item)
         return
+      } else {
+        item.showWinner = false
       }
     }
     reject()
@@ -198,7 +199,13 @@ function editRule(item) {
 
 const historyWonUsers = ref([])
 function refreshHistory () {
-  selectWonUsers().then(res => {
+  const params = []
+  lotteryPool.value.forEach(item => {
+    if (item.showWinner) {
+      params.push(item.code)
+    }
+  })
+  selectWonUsers(params).then(res => {
     historyWonUsers.value = res
     if (res.length > 17) {
       scrollIfExceedLength(res.length - 17)