uniProject/pages/client/Kaoshi/examCamera.vue

<template>
	<view class="phone-sztqr-page">
		<!-- 导航区域 -->
		<customNavbarVue title="摄像头确认" :show-back-btn="true" @back="handleBack"></customNavbarVue>
		
		<zhuapaiConfirm ref="zhuapaiConfirmRef" @success="zpConfirmSuccess" key="1"></zhuapaiConfirm>
			
		<button type="default" class="phone-green-btn zp-qr-btn" @click="zpConfirmSuccess">确认</button>
		
		<view class="sztqr-tip-content">
			注：<br/>
			1.考试过程中切换应用程序，会退出当前考试，返回应用后，需重新进入考试。<br/>
			2.考生进入考试页面后，小程序自动请求摄像头权限。授权通过后，摄像头开启，实时显示考生画面。考试期间系统将会使用您的摄像头进行拍照，抓拍照片自动上传至服务器，仅用于考试核验，照片将严格保密。<br/>
			3.请您确保摄像头设备可以正常使用，并赋予了小程序摄像头权限（设置→摄像头→开启）
		</view>
	</view>
</template>

<script setup>
	import {
		onLoad,
		onShow,
		onHide
	} from "@dcloudio/uni-app";
	import {
		ref,nextTick
	} from "vue";
	import zhuapaiConfirm from "@/components/zhuapaiConfirm/index.vue";
	import customNavbarVue from "@/components/custom-navbar/custom-navbar.vue";

	const opt = ref(null);
	const zhuapaiConfirmRef = ref(null);

	onLoad((options) => {
		opt.value = options;
		setTimeout(() => {
			zhuapaiConfirmRef.value.showDialog()
		},1000)
	})

	function zpConfirmSuccess() {
		uni.redirectTo({
			url: `/pages/client/Kaoshi/exam?ksId=${opt.value.ksId}&zhuapai=${opt.value.zhuapai}&userKaozhengId=${opt.value.userKaozhengId}&from=${opt.value.from}`
		})
	}

	function zpConfirmError(e) {
    uni.showToast({
      icon: 'none',
      title: '考试环境异常请检测摄像头是否正常',
      duration: 3000,
      mask: true // 防止触摸穿透
    })
    setTimeout(() => {
      handleBack();
    }, 3000)
	}

	function zpConfirmCancel() {
		handleBack();
	}

	function handleBack() {
		const pages = getCurrentPages();
		if (pages.length > 1) {
			uni.navigateBack()
		} else {
			history.back();
		}
	}
</script>

<style>

</style>