<template>
	<uni-popup ref="popupRef" :animation="false" :is-mask-click="false"
	 mask-background-color="rgba(255, 255, 255, 0.6);">
		<view class="exam-score-dialog">
			<view class="score-content-box">
				<view>答对:<text class="text-red">{{data.right}}</text>题  答错:<text class="text-red">{{data.wrong}}</text>题</view>
				<view class="text-score">{{data.jifen}}</view>
			</view>
			<view class="score-btn-box">
				<view @click="checkAnswer" class="ckst-btn"></view>
				<view @click="goStudyContinue" class="jxxx-btn"></view>
			</view>
		</view>
	</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>