uniProject/components/kaoshixuzhi/kaoshixuzhi.vue

<template>
	<view>
		<uni-popup ref="popupRef" :animation="false" :is-mask-click="false" mask-background-color="rgba(0, 0, 0, 0.4);">
			<view class="ksxz-content-box" style="background-color: #fff;padding: 20rpx;">
				<view>
					<text>考试须知</text>
					<!-- 倒计时 -->
					<examCountDownVue v-if="data.startSecond>0" :count="data.startSecond" ref="countDownRef"
						class="cur-exam-count-down" @time-end="onTimeEnd"></examCountDownVue>
				</view>
				<view v-if="data.name">考试名称：{{data.name}}</view>
				<view v-if="data.ksScore">用户名：{{data.ksScore}}</view>
				<view v-if="data.credit">学分：{{data.credit}}</view>
				<view v-if="data.okScore">及格分：{{data.okScore}}</view>
				<view v-if="data.ksScore">总分：{{data.ksScore}}</view>
				<view v-if="data.startTime">开始：{{data.startTime}}</view>
				<view v-if="data.endTime">结束：{{data.endTime}}</view>
				<view>
					<view v-if="data.textareaHtml" class="ksms-row">考试描述：</view>
					<rich-text v-if="data.textareaHtml" :nodes="data.textareaHtml" class="ksms-intro"></rich-text>
				</view>

				<view>
					<button class="cancel" @click="handleClose">取消</button>
					<button class="confirm" v-if="isCanJoinExam" @click="handleConfirm">确定</button>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script setup>
	import examCountDownVue from "./examCountDown.vue";
	import {
		ref,
		reactive,
		nextTick
	} from "vue";
	const popupRef = ref(null)
	const countDownRef = ref(null)
	const data = reactive({
		intro: '',
		name: '',
		ksScore: '',
		okScore: '',
		textareaHtml: '',
		credit: '',
		startTime: '',
		endTime: '',
		ksId: '',
		startSecond: 0
	})
	const isCanJoinExam = ref(false)

	const emits = defineEmits(['confirm', 'cancel'])

	function showDialog(options) {
		data.intro = options.intro;
		data.ksName = options.name;
		data.ksScore = options.ksScore;
		data.okScore = options.okScore;
		data.credit = options.credit;
		data.startTime = options.startTime;
		data.endTime = options.endTime;
		data.startSecond = options.startSecond;
		data.ksId = options.ksId;


		if (typeof options.intro == 'undefined' || options.intro == null || options.intro == '') {
			data.textareaHtml = '暂无描述信息';
		} else {
			data.textareaHtml = options.intro;
		}


		if (options.startSecond < 0) {
			isCanJoinExam.value = true;
		}

		popupRef.value.open('center')
		setTimeout(() => {
			countDownRef.value.init()
		}, 0)
	}

	function handleClose() {
		emits('cancel');
		popupRef.value.close()
		isCanJoinExam.value = false;
		countDownRef.value.termination()
	}

	function handleConfirm() {
		emits('confirm', data);
		popupRef.value.close()
	}

	function onTimeEnd() {
		isCanJoinExam.value = true;
	}

	defineExpose({
		showDialog
	})
</script>

<style lang="scss">

</style>