Merge branch 'video-tcplayer' into jenkins-main

src/student/pre-register-active/video.module.less

@@ -12,7 +12,6 @@
   background: url('./images/video-bg.png') no-repeat center;
   background-size: contain;
   min-height: 265px;
-
 }
 
 .video-content {
@@ -37,15 +36,6 @@
   }
 
   :global {
-    .plyr {
-      height: 100%;
-      border-radius: 18px;
-    }
-
-    .plyr__video-wrapper {
-      border-radius: 18px;
-    }
-
     .video-back {
       position: absolute;
       left: 20px;
@@ -60,6 +50,15 @@
       padding: 4px 5px 4px 3px;
     }
 
+
+    .video-js {
+      width: 100%;
+      height: 100%;
+      border-radius: 30px;
+      overflow: hidden;
+    }
+
+
     .plyr__poster {
       background-size: cover;
     }
@@ -73,33 +72,23 @@
       background-color: transparent !important;
     }
 
-    .plyr__menu {
-      &>.plyr__control[data-plyr="settings"] {
-        font-size: 0;
-        padding: 0;
-        background-color: transparent;
-
-        &::before {
-          content: ' ';
-          display: inline-block;
-          background: url('./images/video-speed1.png') no-repeat center;
-          background-size: contain;
-          width: 32px;
-          height: 32px;
-        }
-
-        svg {
-          display: none !important;
-        }
-      }
-    }
-
     .video-js {
       width: 100%;
       height: 100%;
-      border-radius: 30px;
-      overflow: hidden;
     }
+
+    .tcp-skin .vjs-play-progress {
+      background-color: var(--van-primary) !important;
+    }
+
+    .vjs-slider:focus {
+      box-shadow: none !important;
+    }
+
+    .video-js .vjs-progress-control:hover .vjs-progress-holder {
+      font-size: 1em !important;
+    }
+
   }
 
   .video {

src/views/courseList/index.tsx

@@ -5,29 +5,12 @@ import {
   Cell,
   CellGroup,
   Dialog,
-  Empty,
-  Grid,
-  GridItem,
   Icon,
-  Image,
-  Loading,
   Popup,
   showConfirmDialog,
-  showLoadingToast,
-  showToast,
-  Skeleton,
-  SkeletonImage,
-  Space
+  showLoadingToast
 } from 'vant'
-import {
-  defineComponent,
-  onMounted,
-  reactive,
-  onUnmounted,
-  nextTick,
-  Transition,
-  TransitionGroup
-} from 'vue'
+import { defineComponent, onMounted, reactive, onUnmounted, TransitionGroup } from 'vue'
 import styles from './index.module.less'
 import { useRoute, useRouter } from 'vue-router'
 import {

src/views/coursewarePlay/index.tsx

@@ -409,7 +409,6 @@ export default defineComponent({
           activeItem.videoEle?.pause()
           // activeItem.videoEle?.stop()
         }
-        // console.log('🚀 ~ activeItem:', activeItem)
         // 停止曲谱的播放
         if (activeItem.type === 'SONG') {
           activeItem.iframeRef?.contentWindow?.postMessage({ api: 'setPlayState' }, '*')

src/views/exercise-after-class/video-class.tsx

@@ -1,4 +1,4 @@
-import { defineComponent, onMounted, ref, watch, Transition, toRefs } from 'vue'
+import { defineComponent, onMounted, ref, watch, Transition, toRefs, nextTick } from 'vue'
 import styles from './index.module.less'
 import { Slider } from 'vant'
 import iconplay from '../coursewarePlay/image/icon-play.svg'
@@ -29,14 +29,19 @@ export default defineComponent({
 
     const __init = () => {
       if (videoItem.value) {
+        nextTick(() => {
+          videoItem.value?.pause()
+        })
+        console.log(props.item, item.value)
         videoItem.value.poster(props.item.coverImg) // 封面
-        videoItem.value.src(item.value.content) // url 播放地址
+        videoItem.value.src(props.item.content) // url 播放地址
+        videoItem.value.loop(props.item.loop)
+        videoItem.value.muted(props.item.muted)
+        videoItem.value.autoplay(props.item.autoplay)
 
         // 初步加载时
         videoItem.value.one('loadedmetadata', (e: any) => {
-          // console.log(' Loading metadata')
-
-          if (item.value.autoPlay && videoItem.value) {
+          if (item.value.autoplay && videoItem.value) {
             videoItem.value?.play()
           }
           // 获取时长
@@ -64,18 +69,17 @@ export default defineComponent({
           console.log('暂停')
           //暂停
           item.value.paused = true
+          item.value.videoEle?.pause()
         })
 
         videoItem.value.on('play', () => {
-          console.log('播放')
-          // 播放
           item.value.paused = false
+          // 播放
           if (item.value.muted) {
             item.value.muted = false
-            videoItem.value.muted(false)
-            videoItem.value.volume(1)
-            // item.value.videoEle.pause()
-            videoItem.value.pause()
+            item.value.videoEle?.muted(false)
+            item.value.videoEle?.volume(1)
+            item.value.videoEle?.pause()
           }
         })