lex-xin 2 weeks ago
parent
commit
4ad3ec8b3f
2 changed files with 33 additions and 14 deletions
  1. 30 12
      src/views/coursewarePlay/component/video-play.tsx
  2. 3 2
      src/views/coursewarePlay/index.tsx

+ 30 - 12
src/views/coursewarePlay/component/video-play.tsx

@@ -28,6 +28,7 @@ import 'tcplayer.js/dist/tcplayer.min.css';
 import { handleShowVip, state } from '@/state';
 import { showToast, Slider } from 'vant';
 import { vaildCurrentUrl } from '@/helpers/validate';
+import { usePageVisibility } from '@vant/use';
 
 // 秒转分
 export const getSecondRPM = (second: number, type?: string) => {
@@ -82,6 +83,8 @@ export default defineComponent({
     'timeupdate'
   ],
   setup(props, { emit, expose }) {
+    const pageVisibility = usePageVisibility();
+    const tmpVideoPlayTime = ref(0) // 临时的播放时间,页面隐藏的时候记录,显示的时候重新赋值
     const { item } = toRefs(props);
     const data = reactive({
       timer: null as any,
@@ -183,7 +186,9 @@ export default defineComponent({
       if (videoItem.value && props.item.id) {
         // console.log(videoItem.value, 'videoItem.value');
         nextTick(() => {
-          videoItem.value?.currentTime(0);
+          if(!tmpVideoPlayTime.value) {
+            videoItem.value?.currentTime(0);
+          }
         });
         videoItem.value.poster(props.item.coverImg); // 封面
         videoItem.value.src(props.item.content); // url 播放地址
@@ -204,6 +209,14 @@ export default defineComponent({
               nextTick(handlePlayVideo);
             });
           }
+          if(tmpVideoPlayTime.value) {
+            videoItem.value?.currentTime(tmpVideoPlayTime.value);
+            data.currentTime = tmpVideoPlayTime.value;
+            tmpVideoPlayTime.value = 0;
+          }
+
+
+
           emit('loadedmetadata', videoItem.value);
         });
 
@@ -246,14 +259,6 @@ export default defineComponent({
             videoItem.value.muted(false);
             videoItem.value.volume(1);
           }
-          // if (
-          //   !item.value.autoPlay &&
-          //   !item.value.isprepare &&
-          //   videoItem.value
-          // ) {
-          //   // 加载完成后,取消静音播放
-          //   videoItem.value.pause();
-          // }
           emit('togglePlay', videoItem.value?.paused);
           emit('play');
         });
@@ -331,7 +336,9 @@ export default defineComponent({
     watch(
       () => props.item,
       () => {
-        videoItem.value?.currentTime(0);
+        if(!tmpVideoPlayTime.value) {
+          videoItem.value?.currentTime(0);
+        }
         setTimeout(() => {
           videoItem.value?.pause();
           __initVideo();
@@ -339,7 +346,18 @@ export default defineComponent({
       }
     );
 
-    
+     /** 页面显示和隐藏 */
+     watch(
+      () => pageVisibility.value,
+      value => {
+        console.log(value, 'pageVisibility.value');
+        if (value == 'hidden') {
+          videoItem.value && (tmpVideoPlayTime.value = videoItem.value.currentTime());
+        }
+      }
+    );
+
+
 
     // 去云练习完整版
     const gotoAccomany = (e: any) => {
@@ -470,7 +488,7 @@ export default defineComponent({
           </div>
         </div>
 
-        
+
 
         <div
           style={{

+ 3 - 2
src/views/coursewarePlay/index.tsx

@@ -411,6 +411,7 @@ export default defineComponent({
 
     /** 从搜索页面来的 */
     const getSearchDetail = async (params: { type?: string, id?: any, search?: string }) => {
+      data.searchLoading = true
       try {
         const res = await request.get(
           state.platformApi +
@@ -572,6 +573,8 @@ export default defineComponent({
         return true
       } catch (error) {
         console.log(error);
+      } finally {
+        data.searchLoading = false
       }
     }
 
@@ -1425,7 +1428,6 @@ export default defineComponent({
                   toggleMaterial(res.itemActive);
                 }}
                 onHandleSearch={async (val: any) => {
-                  data.searchLoading = true
                   detailTempSearchList.value = []
                   if(data.source === 'search') {
                     await getSearchDetail({
@@ -1440,7 +1442,6 @@ export default defineComponent({
                     })
                   }
                   data.searchTemp = val.search;
-                  data.searchLoading = false
                 }} /> :
               <Points
                 data={data.knowledgePointList}