fix: 修复学习系统视频播放倍数改变后视频观看时长统计错误的问题

client/src/modules/viewer/components/player/chapterPlayer.vue

@@ -5,6 +5,7 @@
         <!-- 视频 -->
         <video-player
           :isSkip="isSkip"
+          :skipTime="skipTime"
           :video="chatperResources.video"
           @timeupdate="onTimeupdate"
           @ready="onReady"
@@ -26,7 +27,12 @@
       <em class="player-button player-button-download" v-if="chapter.pdf">
         <a :href="chapter.pdf" download target="_blank">下载PPT</a>
       </em>
-      <em :class="pptClass" @click="togglePPTVisible" v-if="chatperResources.ppts.length">同步显示PPT</em>
+      <em
+        :class="pptClass"
+        @click="togglePPTVisible"
+        v-if="chatperResources.ppts.length"
+        >同步显示PPT</em
+      >
       <em :class="skipClass" @click="toggleSkip">始终跳过片头</em>
     </div>
   </div>
@@ -57,9 +63,10 @@ export default {
       videoVisible: true,
       pptVisible: false,
       isSkip,
+      skipTime: 6,
       chatperResources: null,
       throttled: null,
-      throttleWait: 10, // 秒
+      throttleWait: 5, // 秒
       progress: {
         cpt: 0, // 当前播放时间
         mpt: 0, // 视频时长
@@ -67,7 +74,8 @@ export default {
         pt: 0 // 累计播放时间
       },
       player: null,
-      watchedTimePoint: [] // 视频观看的时间点
+      watchedTimePoint: [], // 视频观看的时间点
+      timer: null
     }
   },
   watch: {
@@ -142,12 +150,14 @@ export default {
       if (this.progress.cpt) {
         this.player.seek(this.progress.cpt)
       }
+      // 更新视频观看总时长
+      this.updateWatchTime()
     },
     // 当前播放时间更新
     onTimeupdate(time) {
       const ppts = this.chatperResources.ppts || []
       let index = this.chatperResources.ppts.findIndex(
-        item => item.ppt_point > time
+        (item) => item.ppt_point > time
       )
       index = index !== -1 ? index - 1 : ppts.length - 1
       this.$emit('change-ppt', index)
@@ -179,12 +189,12 @@ export default {
     getChapterVideo() {
       // 视频播放类型 1是CC加密; 2是非加密; 3是阿里云
       if (this.videoProvider === 3) {
-        api.getChapterVideoAliyun(this.resourceId).then(response => {
+        api.getChapterVideoAliyun(this.resourceId).then((response) => {
           this.chatperResources = response
           Array.isArray(response.ppts) && this.$emit('pptupdate', response.ppts)
         })
       } else {
-        api.getChapterVideo(this.resourceId).then(response => {
+        api.getChapterVideo(this.resourceId).then((response) => {
           let { video, audio, ppts } = response
           video = video.reduce(
             (result, item) => {
@@ -209,7 +219,7 @@ export default {
         .getChapterVideoProgress(this.sid, this.resourceId, {
           device_id: Cookies.get('_idt')
         })
-        .then(response => {
+        .then((response) => {
           this.progress = response
           // 跳转播放进度
           if (this.player && response.cpt) {
@@ -219,7 +229,7 @@ export default {
     },
     // 更新章节视频进度
     updateChapterVideoProgress(time, durations) {
-      this.progress.pt += this.throttleWait
+      // this.progress.pt += this.throttleWait
       // 登录用户信息
       const user = window.G.UserInfo
       const params = {
@@ -238,6 +248,24 @@ export default {
       api.updateChapterVideoProgress(params)
       // 清空已经上传过的观看时间点
       this.watchedTimePoint = []
+    },
+    // 更新观看总时长
+    updateWatchTime() {
+      this.timer && clearInterval(this.timer)
+      // 增加跳过片头时间
+      if (this.isSkip && !this.progress.pt) {
+        this.progress.pt = this.skipTime + this.throttleWait
+      }
+      // 默认增加时间
+      this.progress.pt = this.progress.pt || this.throttleWait
+      this.timer = setInterval(() => {
+        const status = this.player.getStatus()
+        if (status === 'playing') {
+          // 播放倍速
+          const speed = this.player._originalPlaybackRate || 1
+          this.progress.pt = this.progress.pt + 1 * speed
+        }
+      }, 1000)
     }
   },
   beforeMount() {
@@ -245,6 +273,9 @@ export default {
     this.getChapterVideo()
     // 获取视频进度
     this.getChapterVideoProgress()
+  },
+  destroyed() {
+    this.timer && clearInterval(this.timer)
   }
 }
 </script>