Merge branch 'iteration_0307' into jenkins-main

src/views/coursewarePlay/component/points.tsx

@@ -3,12 +3,7 @@ import styles from './point.module.less'
 import iconMulv from '../image/icon-mulv.svg'
 import iconArrow from '../image/icon-arrow.svg'
 import iconZhibo from '../image/icon-load.gif'
-import iconImage from '../image/icon-image.svg'
-import iconImageActive from '../image/icon-image-active.svg'
-import iconVideo from '../image/icon-video.svg'
-import iconVideoActive from '../image/icon-video-active.svg'
-import iconSong from '../image/icon-song.svg'
-import iconSongActive from '../image/icon-song-active.svg'
+import { iconImage, iconImageActive, iconVideo, iconVideoActive, iconSong, iconSongActive } from '../image/icons.json'
 import { Collapse, CollapseItem, Icon, Image } from 'vant'
 export default defineComponent({
   name: 'points',

src/views/coursewarePlay/component/video-play.tsx

@@ -8,6 +8,7 @@ import iconLoop from '../image/icon-loop.svg'
 import iconLoopActive from '../image/icon-loop-active.svg'
 import iconplay from '../image/icon-play.svg'
 import iconpause from '../image/icon-pause.svg'
+import { iconVideobg } from '../image/icons.json'
 
 export default defineComponent({
   name: 'video-play',
@@ -158,12 +159,6 @@ export default defineComponent({
       toggleHideControl
     })
 
-    // onUnmounted(() => {
-    //   if (videoItem.value) {
-    //     videoItem.value?.pause()
-    //     videoItem.value?.destroy()
-    //   }
-    // })
     return () => (
       <div class={styles.videoWrap}>
         <video
@@ -171,6 +166,7 @@ export default defineComponent({
           src={isEmtry.value ? '' : item.value.content}
           ref={videoRef}
           playsinline="false"
+          poster={iconVideobg}
         ></video>
       </div>
     )

src/views/coursewarePlay/index.tsx

@@ -268,8 +268,6 @@ export default defineComponent({
             type: 'fullscreen'
           }
         })
-        //检测是否录屏
-        // handleLimitScreenRecord()
       })
     }
     const getDetail = async () => {
@@ -339,39 +337,6 @@ export default defineComponent({
       }
     }
 
-    //录屏时间触发
-    const handleLimitScreenRecord = async () => {
-      const result = await promisefiyPostMessage({
-        api: 'getDeviceStatus',
-        content: { type: 'video' }
-      })
-      const { status } = result?.content || {}
-      if (status == '1') {
-        data.itemList.forEach((item: any) => (item.autoPlay = false))
-        handleStop()
-        showDialog({
-          title: '温馨提示',
-          message: '课件内容请勿录屏',
-          beforeClose: () => {
-            return new Promise(async (resolve) => {
-              const { content } =
-                (await promisefiyPostMessage({
-                  api: 'getDeviceStatus',
-                  content: { type: 'video' }
-                })) || {}
-              if (content?.status == '1') {
-                resolve(false)
-              } else {
-                const activeItem = data.itemList[popupData.activeIndex]
-                togglePlay(activeItem, true)
-                resolve(true)
-              }
-            })
-          }
-        })
-      }
-    }
-
     onMounted(() => {
       const hasVip = handleCheckVip()
       if (!hasVip) {
@@ -390,31 +355,8 @@ export default defineComponent({
       getCourseSchedule()
       window.addEventListener('message', iframeHandle)
 
-      //禁止录屏 ios
-      // listenerMessage('setVideoPlayer', (result) => {
-      //   if (result?.content?.status == 'pause') {
-      //     handleLimitScreenRecord()
-      //   }
-      // })
-
-      // // 安卓
-      // postMessage({
-      //   api: 'limitScreenRecord',
-      //   content: {
-      //     type: 1
-      //   }
-      // })
     })
 
-    // onBeforeUnmount(() => {
-    //   postMessage({
-    //     api: 'limitScreenRecord',
-    //     content: {
-    //       type: 0
-    //     }
-    //   })
-    // })
-
     const playRef = ref()
     // 返回
     const goback = () => {
@@ -436,13 +378,25 @@ export default defineComponent({
       toolOpen: false // 工具弹窗控制
     })
 
+    const stopVideo = (el: HTMLVideoElement) => {
+      return new Promise((resolve) => {
+        if(el.paused) return resolve(true)
+        el.onpause = () => {
+          console.log('暂停')
+          resolve(true)
+        }
+        el.pause()
+      })
+    }
+
     /**停止所有的播放 */
-    const handleStop = () => {
+    const handleStop = async () => {
       const videos = document.querySelectorAll('video')
       for (let i = 0; i < videos.length; i++) {
         const videoEle = videos[i] as HTMLVideoElement
-        videoEle.pause();
+        await stopVideo(videoEle)
       }
+      console.log('视频暂停完成')
       data.itemList.forEach((item: any) => {
         if (item.type === 'SONG') {
           item.iframeRef?.contentWindow?.postMessage({ api: 'setPlayState' }, '*')
@@ -577,10 +531,10 @@ export default defineComponent({
 
     const acitveTimer = ref()
     // 轮播切换
-    const handleSwipeChange = (index: number) => {
+    const handleSwipeChange = async (index: number) => {
       // 如果是当前正在播放 或者是视频最后一个
       if (popupData.activeIndex == index) return
-      handleStop()
+      await handleStop()
       clearTimeout(acitveTimer.value)
       checkedAnimation(popupData.activeIndex, index)
       nextTick(() => {