武汉大学抽奖音效

src/views/page/xhxcelshDraw.vue

@@ -97,6 +97,9 @@ import {
   drawLog,
   show
 } from "@/api/activity/drawPrize";
+import startMP3 from '@/assets/xhxcelsh/start.mp3'
+import endMP3 from '@/assets/xhxcelsh/end.mp3'
+let startAudio,endAudio;
 export default {
   components: {
   },
@@ -116,6 +119,13 @@ export default {
     }
   },
   methods: {
+    initAudio() {
+      startAudio = new Audio()
+      endAudio = new Audio()
+      startAudio.src = startMP3;
+      endAudio.src = endMP3;
+    },
+
     async getResult() {
       const res = await drawLog(
         {
@@ -206,16 +216,21 @@ export default {
       this.columnIndex = (this.columnIndex+1) % (19*2)
     },
     startDraw: throttle(function () {
+      startAudio.play()
       this.start = true
       this.setTimer()
     }),
     async end() {
       try {
+        if (!startAudio.paused) {
+          startAudio.pause()
+        }
         const result = (await draw({
           id: this.$route.params.id,
         })).draw_numbers;
         this.resultUsers = this.originalUsers.filter(item => result.indexOf(item.id) !== -1)
         clearInterval(this.timer)
+        endAudio.play()
         this.start = false
         this.isResult = true
         this.showEnd = true
@@ -235,6 +250,7 @@ export default {
   computed: {},
   created() {
     this.getProduct()
+    this.initAudio()
   },
   mounted() {
     this.getUsers().then(_ => {