From 74a00243db34c09952855059b81de9810a99cf08 Mon Sep 17 00:00:00 2001
From: ZhangXianQiang <1135831638@qq.com>
Date: 星期四, 20 六月 2024 11:04:03 +0800
Subject: [PATCH] feat:考试成绩组件
---
src/views/grade/components/answer-grade/index.vue | 29 +++++++++++++++++++++++++++++
src/store/modules/grade.js | 1 +
src/views/grade/index.vue | 7 ++++---
3 files changed, 34 insertions(+), 3 deletions(-)
diff --git a/src/store/modules/grade.js b/src/store/modules/grade.js
index 12d02de..b7fbe28 100644
--- a/src/store/modules/grade.js
+++ b/src/store/modules/grade.js
@@ -9,6 +9,7 @@
examStartTime: '2021-01-01',
examEndTime: '2021-01-01',
examTime: 5,
+ examGrade: 60
});
const examType = ref({
diff --git a/src/views/grade/components/answer-grade/index.vue b/src/views/grade/components/answer-grade/index.vue
new file mode 100644
index 0000000..c5ddc58
--- /dev/null
+++ b/src/views/grade/components/answer-grade/index.vue
@@ -0,0 +1,29 @@
+<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>
\ No newline at end of file
diff --git a/src/views/grade/index.vue b/src/views/grade/index.vue
index db604db..e3ef142 100644
--- a/src/views/grade/index.vue
+++ b/src/views/grade/index.vue
@@ -7,7 +7,8 @@
<div class="title-container text-3xl font-semibold text-white mr-8">
{{ examInfo.examName }}
</div>
-
+ <AnswerGrade></AnswerGrade>
+
<div class="return-container grow flex justify-end">
<el-button type="danger" size="large" circle @click="closeClick">
<template #icon>
@@ -74,12 +75,12 @@
</template>
<script setup>
-import { ref, watchEffect } from 'vue';
import { storeToRefs } from 'pinia';
-import { Close,Timer } from '@element-plus/icons-vue';
+import { Close } from '@element-plus/icons-vue';
import AnswerTag from './components/answer-tag/index.vue';
import AnswerSheet from './components/answer-sheet/index.vue';
+import AnswerGrade from './components/answer-grade/index.vue';
import AnswerSingle from './components/answer-main/answer-single/index.vue';
import AnswerMultiple from './components/answer-main/answer-multiple/index.vue';
--
Gitblit v1.8.0