暫存

resources/js/src/views/Draw.vue

@@ -15,7 +15,7 @@
       </b-col>
 
       <b-modal id="modal-center" centered title="抽獎" cancel-variant="outline-secondary" cancel-title="Close"
-        :ok-only="draw_zero" ok-title="Accept" @ok="draw">
+        :ok-only="draw_zero" ok-title="Accept" no-stacking @ok="showMsgBoxOne">
         <div v-if="draw_zero">
           <label>獎品數量以抽完</label>
         </div>
@@ -28,9 +28,15 @@
           <br>
           <label>數量: </label>
           <b-form-spinbutton v-model="drawNumber" min="1" :max=drawMax />
+          <b-button v-b-modal.modal-test variant="primary">111</b-button>
         </div>
       </b-modal>
 
+      <b-modal id="modal-test" centered title="XXX" cancel-variant="outline-secondary" cancel-title="Close" ok-only
+        ok-title="Accept">
+        <label>XXX</label>
+      </b-modal>
+
       <b-col md="6">
         <b-card title="抽獎紀錄" style="height:75vh;">
           <b-table responsive :items="getRecipientsList(recipientsList)" bordered
@@ -48,7 +54,7 @@
 </template>
 
 <script>
-import { BRow, BCol, BCard, BCardText, BLink, BTable, BModal, BFormInput, BFormSpinbutton } from 'bootstrap-vue'
+import { BRow, BCol, BCard, BCardText, BLink, BTable, BModal, BFormInput, BFormSpinbutton, BButton } from 'bootstrap-vue'
 import useJwt from '@/auth/jwt/useJwt'
 import { VueGoodTable } from 'vue-good-table'
 import vSelect from 'vue-select'
@@ -65,6 +71,7 @@ export default {
     BModal,
     BFormInput,
     BFormSpinbutton,
+    BButton,
     VueGoodTable,
     vSelect,
   },
@@ -136,7 +143,6 @@ export default {
     getRecipientsList(recipientsList) {
       var output = [];
       recipientsList.forEach(element => {
-        console.log(element.created_at);
         output.push({ '獎項': this.getPrizeName(element.prize_id), '獲獎人': this.userIdList[element.user_id], '時間': this.dateFormat(element.created_at) });
       });
       return output;
@@ -181,6 +187,38 @@ export default {
         + ':' + d.getMinutes().toString().padStart(2, '0')
         + ':' + d.getSeconds().toString().padStart(2, '0');
     },
+    showMsgBoxOne() {
+      this.boxOne = ''
+      this.$bvModal
+        .msgBoxOk('得獎者是...', {
+          title: '得獎者是...',
+          cancelVariant: 'outline-secondary',
+          headerClass: 'p-2 border-bottom-0',
+          footerClass: 'p-2 border-top-0',
+          okVariant: 'success',
+          centered: true
+        })
+        .then(value => {
+          return
+        })
+
+      h('div', { class: ['foobar'] }, [
+        h('p', { class: ['text-center'] }, [
+          ' Flashy ',
+          h('strong', 'msgBoxOk'),
+          ' message ',
+        ]),
+        h('p', { class: ['text-center'] }, [h('b-spinner')]),
+        h('b-img', {
+          props: {
+            src: 'https://picsum.photos/id/20/250/250',
+            thumbnail: true,
+            center: true,
+            fluid: true, rounded: 'circle'
+          }
+        })
+      ])
+    },
   },
 }
 </script>