收藏句子暂停

src/views/personalCenter/components/Collect.vue

@@ -140,7 +140,7 @@
     <template v-if="tabsIndex===2">
         <ul>
             <li v-for="(itemW,indexW) in sentenceList" :key="indexW">
-                <svg-icon v-if="itemW.audio_file_id&&!voiceSrc||itemW.audio_file_id&&activeIndex!==indexW" icon-class="voice" className="icon-voice" @click="handlePlayVoice(itemW,indexW)"></svg-icon>
+                <svg-icon v-if="itemW.audio_file_id&&!voiceSrc||itemW.audio_file_id&&activeIndex!==indexW" icon-class="voice" className="icon-voice" @click="handlePlayVoice(itemW,indexW,'sentence')"></svg-icon>
                 <img v-if="itemW.audio_file_id&&voiceSrc&&activeIndex===indexW" :src="voiceSrc" class="icon-voice" />
                 <svg-icon v-if="!itemW.audio_file_id" icon-class="voice" className="icon-voice" style="color:rgba(78, 89, 105, 0.3)"></svg-icon>
                 <span class="xuhao">{{(pageNumberS-1)*pageSizeS+indexW+1+'.'}}</span>
@@ -274,7 +274,8 @@ export default {
         voiceSrc: "",
         voicePauseSrc: '',
         voicePlaySrc: require("../../../assets/voice-play-gray.png"),
-        activeIndex: null
+        activeIndex: null,
+        playInfo: null
     }
   },
   //计算属性 类似于data概念
@@ -291,6 +292,8 @@ export default {
     handleChangeTabs(value){
         this.tabsIndex = value
         this.activeIndex = null
+        this.audio.pause()
+        this.playInfo = null
         this.getList(1)
     },
     handleSizeChange(val,type,page) {
@@ -490,7 +493,7 @@ export default {
       this.sortField = sortName;
       this.getList()
     },
-    async handlePlayVoice(item,index) {
+    async handlePlayVoice(item,index,type) {
       let _this = this;
       let url = ''
       if(item.audio_file_url.indexOf('http')){
@@ -513,6 +516,10 @@ export default {
         _this.audio.pause();
         _this.audio.load();
         _this.audio.src = url;
+        if(type==='sentence'){
+            _this.audio.currentTime = item.audio_begin_time / 1000
+            this.playInfo = item
+        }
         _this.audio.loop = false;
         _this.audio.play();
         _this.activeIndex = index
@@ -608,6 +615,22 @@ export default {
             _this.getList(1)
         }
     });
+    _this.audio.addEventListener("play", function () {
+    });
+    _this.audio.addEventListener("pause", function () {
+    });
+    _this.audio.addEventListener("ended", function () {
+    //   console.log("停止");
+    });
+    _this.audio.addEventListener("timeupdate", function () {
+        if(_this.playInfo){
+            const currentTime = _this.audio.currentTime;
+            if (currentTime >= _this.playInfo.audio_end_time/1000) {
+                _this.audio.pause();
+            }
+        }
+        
+    });
   },
   //生命周期-创建之前
   beforeCreated() { },