修改抽獎數量設定

resources/js/src/views/lottery/Draw.vue

@@ -3,8 +3,8 @@
     <b-row class="prize-list-wrapper">
       <b-col md="6">
         <b-card title="獎項列表" style="height:75vh;">
-          <b-table responsive hover sticky-header=true :items="getPrizeList(prizeList)" bordered :fields="fields" @row-clicked="click"
-            style="max-height: 57vh; overflow: auto;">
+          <b-table responsive hover sticky-header=true :items="getPrizeList(prizeList)" bordered :fields="fields"
+            @row-clicked="click" style="max-height: 57vh; overflow: auto;">
             <template #cell(ICON)="data" class="text-center">
               <div class="text-center">
                 <feather-icon :icon="data.value" />
@@ -18,7 +18,7 @@
         </b-card>
       </b-col>
 
-      <b-modal ref="draw-modal" centered title="抽獎" no-stacking hide-footer>
+      <b-modal ref="draw-modal" id="draw-modal" centered title="抽獎" no-stacking hide-footer>
         <label>獎品:</label>
         <b-form-input v-model="prize" :disabled=true />
         <br>
@@ -26,7 +26,14 @@
         <v-select multiple v-model="region" :options="regionOption" />
         <br>
         <label>數量: </label>
-        <b-form-spinbutton v-model="drawNumber" min="1" :max=drawMax />
+        <div class="demo-inline-spacing">
+          <b-form-radio v-model="drawOne" name="some-radios" :value=true>
+            單抽
+          </b-form-radio>
+          <b-form-radio v-model="drawOne" name="some-radios" :value=false>
+            全抽
+          </b-form-radio>
+        </div>
 
         <b-button v-ripple.400="'rgba(255, 255, 255, 0.15)'" class="mt-3" variant="outline-secondary" block
           @click="hideModal">
@@ -60,7 +67,7 @@
           </div>
         </div>
 
-        <div v-if="onlyOne(drawNumber)">
+        <div v-if="drawOne">
           <b-button v-ripple.400="'rgba(255, 255, 255, 0.15)'" class="mt-2" variant="outline-primary" block
             @click="donate">
             捐出
@@ -108,7 +115,7 @@
 </template>
 
 <script>
-import { BRow, BCol, BCard, BCardText, BLink, BTable, BModal, BFormInput, BFormSpinbutton, BButton } from 'bootstrap-vue'
+import { BRow, BCol, BCard, BCardText, BLink, BTable, BModal, BFormInput, BFormSpinbutton, BButton, BFormCheckbox, BFormRadio } from 'bootstrap-vue'
 import useJwt from '@/auth/jwt/useJwt'
 import { VueGoodTable } from 'vue-good-table'
 import vSelect from 'vue-select'
@@ -127,6 +134,8 @@ export default {
     BFormInput,
     BFormSpinbutton,
     BButton,
+    BFormCheckbox,
+    BFormRadio,
     VueGoodTable,
     vSelect,
   },
@@ -146,7 +155,7 @@ export default {
       regionOption: ['北區', '中區', '南區', '來賓'],
       region: ['北區', '中區', '南區', '來賓'],
       drawMax: 1,
-      drawNumber: 1,
+      drawOne: true,
 
       prize: '',
       prizeId: '',
@@ -260,11 +269,11 @@ export default {
     counterId(id) {
       return "counter_" + id;
     },
-    onlyOne(number) {
-      if (number == 1) {
-        return true;
+    drawNumber() {
+      if (this.drawOne) {
+        return 1;
       }
-      return false;
+      return this.drawMax;
     },
     showDraw() {
       this.$refs['draw-modal'].show();
@@ -296,8 +305,8 @@ export default {
     click(params) {
       this.prize = this.getPrizeName(params.id);
       this.prizeId = params.id;
+      this.drawOne = true;
       this.drawMax = params["數量"];
-      this.drawNumber = 1;
       this.drawList = [];
       if (this.drawMax == 0) {
         this.showDrawError();
@@ -306,11 +315,11 @@ export default {
       }
     },
     draw() {
-      useJwt.postData('/api/draw/draw', { 
-        activity_id: this.activityId, 
-        prize_id: this.prizeId, 
-        region: this.region, 
-        number: this.drawNumber 
+      useJwt.postData('/api/draw/draw', {
+        activity_id: this.activityId,
+        prize_id: this.prizeId,
+        region: this.region,
+        number: this.drawNumber()
       }).then(res => {
         if (res.data) {
           this.drawList = res.data;
@@ -329,10 +338,10 @@ export default {
       this.drawList.forEach(element => {
         idList.push(element.user_id);
       });
-      useJwt.postData('/api/draw/store', { 
-        users: idList, 
-        prize_id: String(this.prizeId), 
-        number: this.drawNumber 
+      useJwt.postData('/api/draw/store', {
+        users: idList,
+        prize_id: String(this.prizeId),
+        number: this.drawNumber()
       }).then(res => {
         if (res.data) {
           console.log("store success");