wangguoyu há 1 mês atrás
pai
commit
c39b6a42a9
2 ficheiros alterados com 139 adições e 52 exclusões
  1. 12 0
      api/kecheng.js
  2. 127 52
      pages/client/Kecheng/study.vue

+ 12 - 0
api/kecheng.js

@@ -72,6 +72,18 @@ export function getVideoAuth(data = {}) {
   })
 }
 
+export function getVideoId(data = {}) {
+  return request({
+    url: '/app/kejian/auth',
+    headers: {
+      isToken: true
+    },
+    method: 'post',
+    data,
+    timeout: 20000
+  })
+}
+
 
 
 export function getClientKechengList(data = {}) {

+ 127 - 52
pages/client/Kecheng/study.vue

@@ -5,11 +5,15 @@
 			<text class="nav-bar-title">{{name}}</text>
 		</view> -->
 		<!-- 播放器 -->
-		<videoPlayVue v-if="showVideo" ref="videoRef" class="phone-video-box" @play-end="onPlayEnd" @play-play="onPlay"
-			@play-pause="onPause" @play-timeupdate="onTimeupdate"></videoPlayVue>
-			<!-- 视频背景图 -->
+		<!-- 	<videoPlayVue v-if="showVideo" ref="videoRef" class="phone-video-box" @play-end="onPlayEnd" @play-play="onPlay"
+			@play-pause="onPause" @play-timeupdate="onTimeupdate"></videoPlayVue> -->
+
+		<video v-if="showVideo" :src="videoUrl" :poster="videoPoster" controls class="video-player" @play="onVideoPlay"
+			@pause="onVideoPause" @ended="onVideoEnd" @error="onVideoError" id="myVideo"></video>
+
+		<!-- 视频背景图 -->
 		<view v-else class="phone-video-box master-image">
-				<!-- <view class="video-player-icon" @click="handlePlayFirst"></view> -->
+			<!-- <view class="video-player-icon" @click="handlePlayFirst"></view> -->
 		</view>
 		<!-- 播放引导 -->
 		<view class="yindao-shadow-image" v-if="!showVideo"> </view>
@@ -86,6 +90,19 @@
 				kcId: null,
 				from: '',
 				jzId: null,
+
+
+
+
+				videoUrl: '', // 视频地址
+				videoPoster: '', // 视频封面
+				videoInfo: {}, // 视频信息
+				loading: false, // 加载状态
+				error: false, // 错误状态
+				errorMessage: '', // 错误信息
+				videoContext: null // 视频上下文
+
+
 			}
 		},
 		onLoad(options) {
@@ -95,6 +112,65 @@
 			this.init();
 		},
 		methods: {
+
+
+			// 播放视频
+			playVideo() {
+				if (this.videoUrl) {
+					this.videoContext.play()
+				} else {
+					uni.showToast({
+						title: '暂无视频可播放',
+						icon: 'none'
+					})
+				}
+			},
+
+			// 暂停视频
+			pauseVideo() {
+				this.videoContext.pause()
+			},
+
+			// 重新播放
+			replayVideo() {
+				this.videoContext.seek(0)
+				this.videoContext.play()
+			},
+
+			// 视频开始播放
+			onVideoPlay() {
+				console.log('视频开始播放')
+			},
+
+			// 视频暂停
+			onVideoPause() {
+				console.log('视频暂停')
+			},
+
+			// 视频播放结束
+			onVideoEnd() {
+				console.log('视频播放结束')
+				uni.showToast({
+					title: '播放完成',
+					icon: 'success'
+				})
+			},
+
+			// 视频播放错误
+			onVideoError(e) {
+				console.error('视频播放错误:', e.detail.errMsg)
+				this.error = true
+				this.errorMessage = '视频播放出错,请检查视频地址或格式'
+			},
+
+			// 重新加载视频
+			retryLoadVideo() {
+				this.getVideoData()
+			},
+
+
+
+
 			handlePlayFirst() {
 				if (this.list && this.list[0].jieList && this.list[0].jieList[0].kejianList) {
 					// 设置默认展开项
@@ -103,7 +179,7 @@
 					// 设置播放可见
 					const kejian = this.list[0].jieList[0].kejianList[0];
 					this.handlePlay(kejian)
-					
+
 				}
 			},
 			onPause() {
@@ -113,35 +189,40 @@
 			onPlay() {
 				clearInterval(this.timer1);
 				this.timer1 = null;
-			// 	this.timer = setInterval(() => {
-			// 		updateSectionProgress(this.operId);
-			// 	}, 1000 * 1 * 60) // 自动保存进度 1分钟已保存
-			
+				// 	this.timer = setInterval(() => {
+				// 		updateSectionProgress(this.operId);
+				// 	}, 1000 * 1 * 60) // 自动保存进度 1分钟已保存
+
 			},
 			sectionPlayerProgress(progress) {
 				let sectionPage = getKechengSectionPageFromHistory(this.operId);
-				let maxProcess = this.list[sectionPage.iChapter].jieList[sectionPage.iSection].kejianList.find(it1=>it1.kjId == sectionPage.kjId).maxProcess;
+				let maxProcess = this.list[sectionPage.iChapter].jieList[sectionPage.iSection].kejianList.find(it1 => it1
+					.kjId == sectionPage.kjId).maxProcess;
 				// 更新缓存进度
-				this.list[sectionPage.iChapter].jieList[sectionPage.iSection].kejianList.find(it1=>it1.kjId == sectionPage.kjId).curProcess = progress;
+				this.list[sectionPage.iChapter].jieList[sectionPage.iSection].kejianList.find(it1 => it1.kjId ==
+					sectionPage.kjId).curProcess = progress;
 				if (progress < 100) {
 					// 播放进度小于100
 					if (progress < maxProcess) {
-						this.list[sectionPage.iChapter].jieList[sectionPage.iSection].kejianList.find(it1=>it1.kjId == sectionPage.kjId).maxProcess = maxProcess
+						this.list[sectionPage.iChapter].jieList[sectionPage.iSection].kejianList.find(it1 => it1.kjId ==
+							sectionPage.kjId).maxProcess = maxProcess
 					} else {
-						this.list[sectionPage.iChapter].jieList[sectionPage.iSection].kejianList.find(it1=>it1.kjId == sectionPage.kjId).maxProcess = progress
+						this.list[sectionPage.iChapter].jieList[sectionPage.iSection].kejianList.find(it1 => it1.kjId ==
+							sectionPage.kjId).maxProcess = progress
 					}
 				} else {
 					// 播放进度大于100
-					this.list[sectionPage.iChapter].jieList[sectionPage.iSection].kejianList.find(it1=>it1.kjId == sectionPage.kjId).maxProcess = 100
+					this.list[sectionPage.iChapter].jieList[sectionPage.iSection].kejianList.find(it1 => it1.kjId ==
+						sectionPage.kjId).maxProcess = 100
 				}
 			},
 			onTimeupdate(time) {
 				const progress = parseInt(time / this.curPlayData.duration * 100);
 				this.curPlayData.curProgress = parseInt(progress >= 100 ? '99' : progress);
 				// 保存进度
-			//	saveCourseProgress(time, this.curPlayData.duration, this.operId)
+				//	saveCourseProgress(time, this.curPlayData.duration, this.operId)
 				// 更新进度
-			//	this.sectionPlayerProgress(progress)
+				//	this.sectionPlayerProgress(progress)
 			},
 			onPlayEnd() {
 				clearInterval(this.timer1);
@@ -155,7 +236,7 @@
 			},
 			goUpPage() {
 				const pages = getCurrentPages();
-				if (pages.length>1) {
+				if (pages.length > 1) {
 					uni.navigateBack()
 				} else {
 					/* if (this.from == 'kechengList') {
@@ -171,9 +252,9 @@
 							url: '/pages/client/ShouYe/shouye'
 						})
 					} */
-					 history.back();
+					history.back();
 				}
-				
+
 			},
 			onClickItem(e) {
 				if (this.current !== e.currentIndex) {
@@ -194,49 +275,43 @@
 				if (this.curPlayData && this.curPlayData.url == data.url) {
 					return;
 				}
+				console.log('data', data);
 				this.curPlayData = data;
-				const {
-					zhangIndex,
-					jieIndex
-				} = getCurKjIndex(data.kjId,this.operId)
-				const sectionPage = {};
-				sectionPage.iChapter = zhangIndex;
-				sectionPage.iSection = jieIndex;
-				sectionPage.kjId = data.kjId;
-				sectionPage.operId = this.operId;
-			//	saveKechengSectionPage(this.operId, sectionPage)
-				kechengApi.getVideoAuth({
+				kechengApi.getVideoId({
 					videoId: data.url
 				}).then(res => {
-					const progress = data.curProcess || 0;
-					this.$refs.videoRef.init({
-						videoId: data.url,
-						playAuth: res.data,
-						seekTime: data.duration * progress / 100,
-						isPlay: false
-					})
+
+					this.videoUrl = res.data
+					console.log('res', res);
+					// const progress = data.curProcess || 0;
+					// this.$refs.videoRef.init({
+					// 	videoId: data.url,
+					// 	playAuth: res.data,
+					// 	seekTime: data.duration * progress / 100,
+					// 	isPlay: false
+					// })
 
 				})
 			},
 			initFirstVideo() {
-				
-			if (this.list && this.list[0].jieList && this.list[0].jieList[0].kejianList) {
-				// 设置默认展开项
-				this.list[0].open = true;
-				this.list[0].jieList[0].open = true;
-				// 设置播放可见
-				const kejian = this.list[0].jieList[0].kejianList[0];
-				// this.handlePlay(kejian)
-			
-			}
-		
+
+				if (this.list && this.list[0].jieList && this.list[0].jieList[0].kejianList) {
+					// 设置默认展开项
+					this.list[0].open = true;
+					this.list[0].jieList[0].open = true;
+					// 设置播放可见
+					const kejian = this.list[0].jieList[0].kejianList[0];
+					// this.handlePlay(kejian)
+
+				}
+
 				//saveKechengSectionPage(this.operId, sectionPage)
 			},
 
 			init() {
 				kechengApi.getClientKechengStart({
 					kcId: this.kcId,
-					jzId:this.jzId
+					jzId: this.jzId
 				}).then(res => {
 					const {
 						userCount,
@@ -247,16 +322,16 @@
 						operId,
 					} = res.data;
 					this.userCount = userCount;
-					this.period = formatSecondsToCnhms(period,true);
+					this.period = formatSecondsToCnhms(period, true);
 					this.name = name;
 					this.formatData(kejianUserVo.zhangList)
 					this.list = kejianUserVo.zhangList;
 					this.intro = intro;
 					this.operId = operId;
-					
+
 					// 获取课程缓存 && 课件缓存(课件缓存点击后产生)
 					//let historyArrKecheng = getKechengDataFromHistory(this.operId)
-				//	let sectionPageHistory = getKechengSectionPageFromHistory(this.operId)
+					//	let sectionPageHistory = getKechengSectionPageFromHistory(this.operId)
 					// // 判断是否有前台缓存
 					// if (historyArrKecheng && sectionPageHistory) {
 					// 	// 有缓存---- 把start接口中,返回数据进度100%,更新到前台缓存