解决音频播放次数为负的bug

src/features/OnlineExam/Examing/QuestionBody.vue

@@ -3,9 +3,8 @@
     <div v-html="questionDetail.text"></div>
     <!-- <div v-html="questionDetail.audio"></div> -->
     <div v-for="({src, name}, index) in questionDetail.audio" :key="name" class="audio-div">
-      <audio controls preload="auto" controlsList='nodownload' :key="src" :name="name" :src="src" @play="($event) => played(index, $event)"></audio>
-      <span>（剩余播放次数：{{examQuestion.limitedPlayTimes -
-        (allAudioPlayTimes.find(a => a.name === name) || { times: 0 }).times}}）</span><br />
+      <audio controls preload="auto" controlsList='nodownload' :key="src" :name="name" :src="src" @click="audioClicked" @play="($event) => played(index, $event)"></audio>
+      <span>（剩余播放次数：{{getAudioPlayedTimes(name)}}）</span><br />
     </div>
   </div>
 
@@ -42,12 +41,12 @@ export default {
       let question = {};
       if (this.questionBody.includes("question-audio")) {
         // let audioArray = this.questionBody.match(/<a.*?question-audio.*?\/a>/g);
-        if (!this.examQuestion.audioPlayTimes) {
-          // 初始化音频播放次数
-          this.audioPlayTimes = [];
-        } else {
-          this.audioPlayTimes = JSON.parse(this.examQuestion.audioPlayTimes);
-        }
+        // if (!this.examQuestion.audioPlayTimes) {
+        //   // 初始化音频播放次数
+        //   this.audioPlayTimes = [];
+        // } else {
+        //   this.audioPlayTimes = JSON.parse(this.examQuestion.audioPlayTimes);
+        // }
         question.text = this.questionBody.replace(
           /<a.*?question-audio.*?\/a>/g,
           ""
@@ -127,15 +126,18 @@ export default {
     //     });
     //   });
     // },
+    audioClicked($event) {
+      if ($event.target.paused === false) {
+        // 正在播放中，不能暂停
+        $event.preventDefault();
+      }
+    },
     played(index, $event) {
-      // $event.target.pause();
       const limitedPlayTimes = this.examQuestion.limitedPlayTimes;
-      let audioPlayTimes = this.audioPlayTimes;
       console.log("开始播放");
-      // console.log($event.target.attributes.name.value);
       const name = $event.target.attributes.name.value;
       // console.log(name);
-      const theAudio = audioPlayTimes.find(a => a.name === name);
+      const theAudio = this.allAudioPlayTimes.find(a => a.name === name);
       const playedTimes = (theAudio || { times: 0 }).times;
       if (limitedPlayTimes - playedTimes <= 0) {
         console.log("无剩余播放次数");
@@ -146,12 +148,20 @@ export default {
       // var audio = new Audio($event.target.src);
       // audio.play();
 
-      if (theAudio) {
-        theAudio.times = playedTimes + 1;
-      } else {
-        this.audioPlayTimes.push({ name: name, times: 1 });
-      }
+      // if (theAudio) {
+      //   theAudio.times = playedTimes + 1;
+      // } else {
+      //   this.audioPlayTimes.push({ name: name, times: 1 });
+      // }
       this.updateQuestionAudioPlayTimes(name);
+    },
+    getAudioPlayedTimes(name) {
+      return Math.max(
+        this.examQuestion.limitedPlayTimes -
+          (this.allAudioPlayTimes.find(a => a.name === name) || { times: 0 })
+            .times,
+        0
+      );
     }
   },
   computed: {