<template>
|
<div class="grade-container flex justify-center text-white items-center shadow-md">
|
<el-icon class="mr-1 text-xl" size="24"><Document /></el-icon>
|
<div class="label mr-1">考试成绩:</div>
|
<div class="grade font-bold text-3xl text-red-600">{{ examInfo.examGrade }}</div>
|
</div>
|
</template>
|
|
<script setup>
|
import {ref} from 'vue';
|
import { storeToRefs } from 'pinia';
|
import { Document } from '@element-plus/icons-vue';
|
import { useGradeStore } from '@/store/index.js';
|
|
const gradeStore = useGradeStore();
|
const { examInfo } = storeToRefs(gradeStore);
|
|
|
</script>
|
|
<style lang="scss" scoped>
|
.grade-container {
|
width: 200px;
|
border-radius: 100px;
|
padding: 10px 0;
|
background-color: rgba($color: #86d7f7, $alpha: 0.3);
|
}
|
|
</style>
|
