소스 검색

feat: 初始化视频详情-答题模块

wenxingxing 2 일 전
부모
커밋
b163701cef
1개의 변경된 파일113개의 추가작업 그리고 2개의 파일을 삭제
  1. 113 2
      pages/course/info.vue

+ 113 - 2
pages/course/info.vue

@@ -484,7 +484,7 @@ export default {
 			textHeight: 0, //文本高度
 			courseId: null,
 			isShare: false,
-			videoId: null,
+			videoId: null,//当前视频(小节)章节ID
 			isLearning: false,
 			isShowQuestions: false,
 			isShowAnswerPrompt: false,
@@ -617,6 +617,11 @@ export default {
 				area: 0.25
 			},
 			socket: null,
+			// 页面一进入-答题奖励相关
+			pageEntryTimer: null, // 页面一进入-答题奖励计时器
+			pageEntryDuration: 0, // 页面一进入-答题奖励当前累计计时(秒)
+			pageEntryRequiredTime: 0, // 页面一进入-答题奖励当前小节后台设定的奖励时间(秒)
+			hasGotPageEntryReward: false, // 页面一进入-答题奖励当前小节是否已领取奖励
 			isSocketOpen: false,
 			isSend: true,
 			reOpenSocket: false,
@@ -661,6 +666,11 @@ export default {
 			this.checkFavorite();
 			this.getNewCommentArrList();
 			this.checkLike();
+
+			// 一进入页面显示时启动答题奖励计时器(需要先获取当前章节ID)
+			if (this.pickCatalog.videoId) {
+				this.startPageEntryTimer(this.pickCatalog.videoId);
+			}
 			// #ifndef H5
 			uni.onKeyboardHeightChange(this.keyboardHeightChange);
 			// #endif
@@ -723,6 +733,7 @@ export default {
 		this.exitFullscreen = 'yes' + new Date().getTime()
 		// 页面卸载时清除计时器
 		this.endCountsTime();
+		this.stopPageEntryTimer(); // 清理章节奖励计时器
 		this.addStudyCourse();
 		this.destoryAudio();
 		// #ifdef APP-PLUS
@@ -831,6 +842,106 @@ export default {
 				this.allLookTimer = null;
 			}
 		},
+		// 启动章节奖励计时器
+		startPageEntryTimer(videoId) {
+			// 如果已领取章节奖励,不再计时
+			if (this.hasGotPageEntryReward) {
+				return;
+			}
+
+			// 如果切换了章节,重置计时
+			if (this.videoId !== videoId) {
+				this.resetPageEntryTimer();
+				this.videoId = videoId;
+				// 获取该章节的奖励时间(假设后台接口返回)
+				this.getPageEntryRequiredTime(videoId);
+			}
+
+			// 如果章节奖励计时器已在运行,不再重复启动
+			if (this.pageEntryTimer) {
+				return;
+			}
+
+			// 每秒计时
+			this.pageEntryTimer = setInterval(() => {
+				this.pageEntryDuration++;
+				console.log(`当前章节奖励计时: ${this.pageEntryDuration}秒,目标: ${this.pageEntryRequiredTime}秒`);
+
+				// 检查是否满足章节奖励条件
+				this.checkPageEntryCondition();
+			}, 1000);
+		},
+		// 获取章节奖励所需时间(模拟后台接口)
+		getPageEntryRequiredTime(videoId) {
+			// TODO: 调用后台接口获取该章节的章节奖励时间(单位:分钟)
+			// 这里先模拟一个默认值,实际应该从接口获取
+			// 假设后台返回的是分钟,转换为秒
+			const requiredMinutes = 5; // 示例:5分钟
+			this.pageEntryRequiredTime = requiredMinutes * 60;
+
+			// 同时检查该章节是否已领取章节奖励
+			this.checkPageEntryStatus(videoId);
+		},
+		// 检查章节奖励领取状态
+		checkPageEntryStatus(videoId) {
+			// TODO: 调用后台接口检查该章节是否已领取章节奖励
+			// 这里先模拟未领取状态
+			this.hasGotPageEntryReward = false;
+		},
+		// 检查章节奖励条件
+		checkPageEntryCondition() {
+			if (this.hasGotPageEntryReward) {
+				this.stopPageEntryTimer();
+				return;
+			}
+
+			if (this.pageEntryDuration >= this.pageEntryRequiredTime) {
+				// 满足条件,领取章节奖励
+				this.getPageEntryReward();
+			}
+		},
+		// 领取章节奖励
+		async getPageEntryReward() {
+			if (this.hasGotPageEntryReward) {
+				return;
+			}
+
+			// TODO: 调用后台领取章节奖励接口
+			try {
+				// const res = await getPageEntryApi({ videoId: this.videoId });
+				// if (res.code === 200) {
+				this.hasGotPageEntryReward = true;
+				this.stopPageEntryTimer();
+				uni.showToast({
+				title: '恭喜获得章节奖励!',
+					icon: 'success'
+				});
+				// } else {
+				//     uni.showToast({
+				//         title: res.msg || '领取失败',
+				//         icon: 'none'
+				//     });
+				// }
+			} catch (error) {
+				uni.showToast({
+					title: '领取失败',
+					icon: 'none'
+				});
+			}
+		},
+		// 停止章节奖励计时器
+		stopPageEntryTimer() {
+			if (this.pageEntryTimer) {
+				clearInterval(this.pageEntryTimer);
+				this.pageEntryTimer = null;
+			}
+		},
+		// 重置章节奖励计时
+		resetPageEntryTimer() {
+			this.stopPageEntryTimer();
+			this.pageEntryDuration = 0;
+			this.hasGotPageEntryReward = false;
+		},
 		getCourseInfo() {
 			this.showDes = false
 			getCourseById(this.courseId).then(res => {
@@ -1399,7 +1510,7 @@ export default {
 				"videoId": this.pickCatalog.videoId
 			};
 			addDuration(parmas).then(res => {
-				if (res.code == 200) {}
+				if (res.code == 200) { }
 			},
 				rej => { }
 			);