视屏详情、自定义弹框组件

components/custom-popup-dialog.vue

@@ -0,0 +1,147 @@
+<template>
+	<uni-popup ref="popupDialog">
+		<view class="dialog_wrap" :style="{ width: `${dialogWidth}rpx` }">
+			<view class="dialog_title" v-if="showTitle">
+				<view class="dialog_title_lt">
+					<text class="title">{{title}}</text>
+				</view>
+				<image v-if="showDialogClose" src="@/static/image/icon/close.png" style="width: 48rpx;height: 48rpx;"
+					@click="CloseDialog"></image>
+			</view>
+			<view class="dialog_content">
+				<slot></slot>
+			</view>
+			<!-- 自定义底部按钮区域 -->
+			<view class="dialog_footer">
+				<view v-if="showCloseBtn" class="dialog-btn cancel-btn" @click="CloseDialog">取消</view>
+				<view class="dialog-btn confirm-btn" @click="handleConfirm">确定</view>
+			</view>
+		</view>
+	</uni-popup>
+</template>
+
+<script setup>
+	import uniPopup from '@/uni_modules/uni-popup/components/uni-popup/uni-popup.vue';
+	import {
+		ref
+	} from 'vue';
+
+	const props = defineProps({
+		showTitle: {
+			type: Boolean,
+			default: true
+		},
+		title: {
+			type: String,
+			default: '提示'
+		},
+		dialogWidth: {
+			type: String,
+			default: '610'
+		},
+		showDialogClose: {
+			type: Boolean,
+			default: true
+		},
+		showCloseBtn: {
+			type: Boolean,
+			default: true
+		}
+	})
+	const emit = defineEmits(['DialogConfirm']);
+	const popupDialog = ref(null);
+
+	//打开弹窗
+	const OpenDialog = () => {
+		popupDialog.value.open();
+	}
+	//关闭弹窗
+	const CloseDialog = () => {
+		popupDialog.value.close();
+	}
+
+	// 点击确定，只通知父组件，子组件不主动关闭！
+	const handleConfirm = () => {
+		emit('DialogConfirm')
+	}
+
+	defineExpose({
+		OpenDialog,
+		CloseDialog
+	})
+</script>
+
+<style scoped lang="scss">
+	.dialog_wrap {
+		background: #fff;
+		border-radius: 20rpx;
+		overflow: hidden;
+	}
+
+	.dialog_title {
+		height: 96rpx;
+		padding: 0 40rpx;
+		width: 100%;
+		background-color: #F5F7FA;
+		border-radius: 20rpx 20rpx 0 0;
+		box-sizing: border-box;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		.dialog_title_lt {
+			display: inline-flex;
+			align-items: center;
+			.title {
+				margin-left: 16rpx;
+				flex: 1;
+				white-space: nowrap;
+				overflow: hidden;
+				text-overflow: ellipsis;
+				color: #303133;
+				font-weight: 500;
+				font-size: 32rpx;
+			}
+		}
+	}
+
+	.dialog_content {
+		min-height: 160rpx;
+		height: auto;
+		display: flex;
+		// overflow: auto;
+		width: 100%;
+		box-sizing: border-box;
+		padding: 40rpx;
+		flex-wrap: wrap;
+	}
+
+	.dialog_footer {
+		display: flex;
+		border: 2rpx solid #EBEEF5;
+		padding: 24rpx 40rpx;
+		width: 100%;
+		box-sizing: border-box;
+		gap: 20rpx;
+		.dialog-btn {
+			flex: 1;
+			display: inline-flex;
+			align-items: center;
+			justify-content: center;
+			height: 80rpx;
+			
+			border-radius: 12rpx;
+			font-size: 28rpx;
+			font-weight: 500;
+		}
+
+		.cancel-btn {
+			color: #606266;
+			background-color: #f0f2f9;
+		}
+
+		.confirm-btn {
+			color: #ffffff;
+			background-color: #2e64fa;
+		}
+	}
+</style>

pages/teacherStudy/videoDetails.vue

@@ -6,7 +6,8 @@
 			<view class="video_content">
 				<!-- duration：指定视频时长，单位为秒（s） initial-time：指定视频初始播放位置，单位为秒（s） -->
 				<video 
-					id="myVideo"
+					ref="myVideoRef"
+					id="myVideoRef"
 					:title="state?.videoInfo?.courseName || ''"
 					:initial-time="state?.videoInfo?.initialTime"
 					:duration="state?.videoInfo?.duration"
@@ -38,26 +39,27 @@
 		</view>
 	</view>
 	<!-- 提示框 -->
-	<popup-dialog ref="popupDialogRef" popType="custom" title="试题弹出" :showDialogClose="false" :showCloseBtn="false" :showFootBorder="true" dialogWidth="702" @DialogConfirm="DialogConfirm">
+	<custom-popup-dialog ref="popupDialogRef" title="试题弹出" dialogWidth="702" :showCloseBtn="false" @DialogConfirm="DialogConfirm">
 		<view class="dialog_questions_input">
 			<view class="questions_title">{{state?.question?.codeName}}：{{state?.question?.questionsName}}</view>
-			<uni-easyinput type="textarea" v-model="value" :style="state.easyinputStyle" placeholder="请输入你的回答" placeholderStyle="font-weight: 400;font-size: 28rpx;color: #999999;"></uni-easyinput>
+			<uni-easyinput type="textarea" v-model="state.questionsAnswer" :style="state.easyinputStyle" placeholder="请输入你的回答" placeholderStyle="font-weight: 400;font-size: 28rpx;color: #999999;"></uni-easyinput>
 		</view>
-	</popup-dialog>	
+	</custom-popup-dialog>	
 </template>
 
 <script setup>
 	import uniEasyinput from '@/uni_modules/uni-easyinput/components/uni-easyinput/uni-easyinput.vue';
 	import navBar from '@/components/nav-bar.vue';
-	import popupDialog from '@/components/popup-dialog.vue';
-	import { selectCourseDetail } from '@/reqApi/teacherStudy.js';
+	import customPopupDialog from '@/components/custom-popup-dialog.vue';
+	import { selectCourseDetail,addQuestionAnswerData } from '@/reqApi/teacherStudy.js';
 	import {
 		onLoad,
 		onUnload
 	} from '@dcloudio/uni-app';
 	import {
 		reactive,
-		ref
+		ref,
+		getCurrentInstance
 	} from 'vue';
 	const state = reactive({
 		id: '', //视频id
@@ -67,14 +69,17 @@
 		easyinputStyle:{
 			color: '#303133',
 			borderColor: '#E9E9E9'
-		}
+		},
+		questionsAnswer:''
 	});
 	//提示框
 	const popupDialogRef = ref(null);
+	const myVideoRef = ref(null);
 	const videoCtx = ref(null);//播放器
 	onLoad((option) => {
 		state.id = option.id;
-		videoCtx.value = uni.createVideoContext('myVideo')
+		const instance = getCurrentInstance();
+		videoCtx.value = uni.createVideoContext('myVideoRef', instance.proxy);
 		GetCourseDetail();
 	})
 	//视频详情
@@ -101,10 +106,37 @@
 		const question = questionsList.find(item=>item.showTime == state.currentTime);//视频显示的时间
 		state.question = question;//试题弹框信息
 		if(question){
-			videoCtx.value?.pause();//暂停播放
+			videoCtx?.value?.pause();//暂停播放
+			state.questionsAnswer = '';
 			popupDialogRef.value.OpenDialog();
 		}
-		console.log(state.currentTime,323)
+	}
+	//提交试题
+	const DialogConfirm = () => {
+		if(state.questionsAnswer == ''){
+			uni.showToast({
+				title: '请输入答案!',
+				icon: 'none'
+			})
+			return false
+		}
+		addQuestionAnswerData({
+			teachCourseId: state.id,
+			teachQuestionsId: state?.question?.id || '',
+			teachQuestionsAnswer: state.questionsAnswer
+		}).then(res=>{
+			if(res.code == 200){
+				popupDialogRef.value.CloseDialog();//关闭弹框
+				console.log(videoCtx?.value)
+				videoCtx?.value?.play();//播放
+			}else{
+				uni.showToast({
+					title: res.msg || '请求异常',
+					icon: 'none'
+				})
+			}
+		})
+		
 	}
 	// 数字补零工具
 	const addZero = (num) => {
@@ -201,7 +233,6 @@
 		line-height: 44rpx;
 	}
 	.dialog_questions_input{
-		padding: 40rpx 30rpx;
 		display: flex;
 		width: 100%;
 		flex-direction: column;

reqApi/teacherStudy.js

@@ -15,4 +15,7 @@ export function minitorPageListData(data) {//研修监控分页列表
 }
 export function selectCourseDetail(id) {//视频详情
 	return request.get(`/api/v1/teachCourseRecord/selectCourseDetail/${id}`)
+}
+export function addQuestionAnswerData(data) {//教师学习课程答案信息填报接口
+	return request.post('/api/v1/teachCourse/addQuestionAnswerData', data)
 }

style/common.scss

@@ -628,6 +628,16 @@ uni-page-body {
 	&.white {
 		background: #ffffff;
 	}
+	&.footBorder{
+		.uni-dialog-button-group{
+			border-top-color: #EBEEF5;
+			border-top-width:1px !important;
+			padding: 24rpx 40rpx;
+			.uni-dialog-button{
+				height: 80rpx;
+			}
+		}
+	}
 	.uni-dialog-title {
 		display: none !important;
 	}
@@ -684,12 +694,6 @@ uni-page-body {
 		border-top-width: 0 !important;
 		padding: 40rpx 44rpx 28rpx;
 		box-sizing: border-box;
-		&.footBorder{
-			.uni-dialog-button-group{
-				border-top-color: #EBEEF5;
-				border-top-width:1px !important;
-			}
-		}
 		.uni-dialog-button {
 			height: 72rpx;
 			background-color: #f0f2f9;
@@ -726,15 +730,4 @@ uni-page-body {
 	font-size: 24rpx !important;
 	text-align: center !important;
 	white-space: nowrap;
-}
-
-.dialog_content {
-	width: 100%;
-	height: auto;
-	background-color: #fff;
-	z-index: 1009;
-
-	border-radius: 20px 20px 0 0;
-	padding: 15px 11px;
-	box-sizing: border-box;
 }

unpackage/cache/apk/apkurl

@@ -0,0 +1 @@
+https://app.liuyingyong.cn/build/download/8ac17c80-85a1-11f1-b56d-bdee4bf60bd3

unpackage/cache/certdata

@@ -0,0 +1,4 @@
+andrCertfile=C:/Users/huijiaoyan/Desktop/HBuilderX.4.75.2025071105/HBuilderX/plugins/app-safe-pack/Test.keystore
+andrCertAlias=android
+andrCertPass=ep/Tdjka4Y7WYqDB6/S7dw==
+storePassword=ep/Tdjka4Y7WYqDB6/S7dw==

unpackage/cache/cloudcertificate/certini

@@ -0,0 +1,4 @@
+[General]
+andrCertfile=package.keystore
+andrCertAlias=__UNI__07352BD
+andrCertPass="+SM9CMIn/p8YxESVg04xCg=="

unpackage/cache/wgt/__UNI__07352BD/__uniappview.html

@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <title>View</title>
+    <link rel="icon" href="data:,">
+    <link rel="stylesheet" href="app.css" />
+    <script>var __uniConfig = {"globalStyle":{},"darkmode":false}</script>
+    <script>
+      var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
+        CSS.supports('top: constant(a)'))
+      document.write(
+        '<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
+        (coverSupport ? ', viewport-fit=cover' : '') + '" />')
+    </script>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script src="uni-app-view.umd.js"></script>
+    
+    
+    
+  </body>
+</html>

unpackage/cache/wgt/__UNI__07352BD/app-config.js

@@ -0,0 +1 @@
+(function(){})();

unpackage/cache/wgt/__UNI__07352BD/pages/my/help.css

@@ -0,0 +1 @@
+.page_help{width:100%;height:100%;background-color:#f8f9fd;overflow-y:auto}.help_item{width:100%;height:auto}.item_title{font-weight:500;font-size:1rem;color:#333;line-height:1.5rem;margin-top:.625rem;text-indent:.75rem}.item_list{width:calc(100% - .6875rem);margin-left:.6875rem;height:auto;display:flex;justify-content:flex-start;gap:.6875rem;flex-wrap:wrap;margin-top:.3125rem;margin-bottom:.625rem}.video_item{width:calc(50% - .6875rem);height:auto;border-radius:.375rem}.image_item{width:100%;min-height:5.9375rem;height:auto;background-image:url(../../static/image/bg/video_bg.png);background-size:cover;background-repeat:no-repeat;background-position:center;border-radius:.375rem;cursor:pointer;position:relative}.video_title{font-weight:400;font-size:.875rem;color:#333;line-height:1.5625rem;height:1.5625rem}.video_title_span{position:absolute;font-weight:400;font-size:.875rem;color:#333;top:1.5625rem;left:.625rem}.play_icon{font-size:1.875rem;color:#fff;text-shadow:0 0 .3125rem rgba(0,0,0,.5)}.play_overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background:rgba(0,0,0,.3);border-radius:.375rem;z-index:10}