| 
					
				 | 
			
			
				@@ -48,7 +48,8 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     </el-form-item> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     <el-form-item label="视频播放"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      <video v-if="videoUrl" ref="myvideo" :src="videoUrl" id="video" width="100%" height="300px" controls></video> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <video v-if="videoUrl.endsWith('mp4')" ref="myvideo" :src="videoUrl" id="video" width="100%" height="300px" controls></video> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <video v-if="videoUrl.endsWith('m3u8')" ref="myM3u8Video" :src="videoUrl" id="meu8Video" width="100%" height="300px" controls type="application/x-mpegURL"></video> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       <div v-if="fileName">视频文件名: {{ fileName }}</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       <div v-if="fileKey">文件Key: {{ fileKey }}</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       <div v-if="fileSize">文件大小(MB): {{ (fileSize / (1024 * 1024)).toFixed(2) }} MB</div> 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -122,8 +123,9 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 <script> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 import { uploadObject } from "@/utils/cos.js"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 import Pagination from "@/components/Pagination"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-// import { listVideoResource } from '@/api/course/videoResource'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-import { listLiveVideo, getLiveVideo, delLiveVideo, addLiveVideo, updateLiveVideo, exportLiveVideo } from "@/api/live/liveVideo"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import { listLiveVideo } from "@/api/live/liveVideo"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import Hls from 'hls.js'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import {isEmpty} from "@/components/LemonUI/utils/validate"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 export default { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   components: { 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -181,6 +183,9 @@ export default { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       default: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  destroyed() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    this.hls?.destroy(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   data() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     return { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       videoName:'', 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -228,8 +233,21 @@ export default { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   mounted() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     this.reset(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    if (this.videoUrl.endsWith(".m3u8")) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.$nextTick(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.initPlayer() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   watch: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    videoUrl(newVal,oldVal){ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      console.log("触发数据改变") 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      if (this.videoUrl.endsWith(".m3u8")) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.$nextTick(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          this.initPlayer() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     uploadType(newType) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       this.localUploadType = newType; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     }, 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -320,6 +338,29 @@ export default { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         this.$message.error("线路一上传失败"); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    initPlayer() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.hls?.destroy(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      if (Hls.isSupported()) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        const videoElement = this.$refs.myM3u8Video 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        if (!videoElement) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          console.error('找不到 video 元素') 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          return 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.hls = new Hls(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.hls.attachMedia(videoElement); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.hls.on(Hls.Events.MEDIA_ATTACHED, () => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          this.hls.loadSource(this.videoUrl); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          this.hls.on(Hls.Events.STREAM_LOADED, (event, data) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            videoElement.play(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.hls.on(Hls.Events.ERROR, (event, data) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          console.error('HLS 错误:', data); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } else { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        console.error('浏览器不支持 HLS') 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     //上传华为云Obs 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     async uploadVideoToHwObs() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       try { 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -404,7 +445,11 @@ export default { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       this.$emit("update:videoUrl", this.selectedVideo.videoUrl); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       this.$emit("change", this.selectedVideo.videoUrl,this.selectedVideo.lineOne); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      if (this.videoUrl.endsWith(".m3u8")) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.$nextTick(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          this.initPlayer() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       this.libraryOpen = false; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     /** 取消视频选择 */ 
			 |