<template>
	<uni-popup ref="popupRef" :animation="false" :is-mask-click="false"
		mask-background-color="rgba(255, 255, 255, 0.6);" class="ezy-popup-width-all">
		<view>
			<!-- 导航 -->
			<view @click="handleBack">返回</view>

			<view>
				<view>图</view>
				<view> 单元测试已完成 </view>
			</view>

			<view>
				<view>
					<view>{{data.right}}</view>
					<view>正确</view>
				</view>
				<view>
					<view>{{data.wrong}}</view>
					<view>错误</view>
				</view>
			</view>

			<view>
				<button @click="handleRestart">重新测试</button>
				<button @click="handleCheckAnswer">查看答案</button>
			</view>
		</view>
	</uni-popup>
</template>

<script setup>
	import {
		ref,
		reactive
	} from "vue";

	const popupRef = ref(null)
	const data = reactive({
		right: 0,
		wrong: 0,
	})

	const emits = defineEmits(['check-answer', 'do-replay'])

	function handleRestart() {
		emits('do-replay')
	}

	function handleCheckAnswer() {
		emits('check-answer')
	}

	function showPopup(options) {
		data.right = options.right;
		data.wrong = options.wrong;

		popupRef.value.open();
	}

	function closePopup() {
		popupRef.value.close();
	}

	function handleBack() {
		closePopup();
	}


	defineExpose({
		showPopup,
		closePopup
	})
</script>

<style>
</style>