<template>
	<uni-popup ref="popupRef" :mask-background-color="popup_background_color">
		答对： {{data.right}}题，
		答错：{{data.wrong}}题
		已成功获得 {{data.jifen}}积分

		<button @click="checkAnswer">查看试题</button>
		<button @click="goStudyContinue">继续学习</button>
	</uni-popup>
</template>

<script setup>
	import {
		ref,
		reactive
	} from "vue"
	const popupRef = ref(null)
	const popup_background_color = `rgba(0,0,0,0.2)`; // 【弹出框模态层背景颜色】

	const emits = defineEmits(['checkAnswer', 'goStudy']);

	const data = reactive({
		right: 0,
		wrong: 0,
		jifen: 0
	})

	// 切换成绩
	function showPopup({
		right,
		wrong,
		jifen
	}) {
		data.right = right;
		data.wrong = wrong;
		data.jifen = jifen;
		popupRef.value.open()
	}

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

	// 查看答案
	function checkAnswer() {
		emits('checkAnswer');
		closePopup();
	}
	// 继续学习
	function goStudyContinue() {
		emits('goStudy');
		closePopup();
	}

	defineExpose({
		showPopup
	})
</script>

<style>

</style>