From cf87d6fd9a43139a10e0b6bf10a233cbde66820f Mon Sep 17 00:00:00 2001
From: ZhangXianQiang <1135831638@qq.com>
Date: 星期三, 19 六月 2024 16:22:41 +0800
Subject: [PATCH] feat(考试):考试收卷提示

---
 src/views/exam/index.vue |   56 ++++++++++++++++++++++++++++++++++++++++++++++++++------
 1 files changed, 50 insertions(+), 6 deletions(-)

diff --git a/src/views/exam/index.vue b/src/views/exam/index.vue
index 733daf1..2866539 100644
--- a/src/views/exam/index.vue
+++ b/src/views/exam/index.vue
@@ -5,9 +5,9 @@
       <div class="exam-wrapper container mx-auto h-full flex flex-col">
         <div class="exam-header flex items-center mt-12 mb-10">
           <div class="title-container text-3xl font-semibold text-white mr-8">
-            娴嬭瘯娴嬭瘯娴嬭瘯
+            {{ examInfo.examName }}
           </div>
-          <AnswerTime></AnswerTime>
+          <AnswerTime @timeOut="timeOut"></AnswerTime>
 
           <div class="return-container grow flex justify-end">
             <el-button type="danger" size="large" circle @click="closeClick">
@@ -50,7 +50,9 @@
           <div class="answer-wrapper answer-right grow shadow-xl p-4">
             <div class="wrapper h-full flex flex-col">
               <div class="title-wrapper w-full flex mb-5">
-                <div class="title text-xl font-semibold ">{{ examType[currentType] }} ({{ examStore.getActiveQuestion.score}}鍒�)</div>
+                <div class="title text-xl font-semibold ">{{ examType[currentType] }} ({{
+                  examStore.getActiveQuestion.score }}鍒�)
+                </div>
               </div>
 
               <div class="main-wrapper w-full grow relative my-5">
@@ -109,13 +111,31 @@
         </div>
       </template>
     </el-dialog>
+
+    <!-- 鑰冭瘯鏃堕棿寮圭獥 -->
+    <el-dialog 
+    v-model="timeDialog" 
+    align-center width="500" 
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    :show-close="false"
+    >
+      <div class="dialog-container flex flex-col items-center">
+        <div class="icon-container">
+          <el-icon :size="50" color="#3680fa"><Timer /></el-icon>
+        </div>
+        <div class="dialog-info">
+          鑰冭瘯鏃堕棿鍒帮紝绯荤粺鑷姩鏀跺嵎涓�.......
+        </div>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script setup>
 import { ref, watchEffect } from 'vue';
 import { storeToRefs } from 'pinia';
-import { Close } from '@element-plus/icons-vue';
+import { Close,Timer } from '@element-plus/icons-vue';
 import AnswerTag from './components/answer-tag/index.vue';
 import AnswerProgress from './components/answer-progress/index.vue';
 import AnswerSheet from './components/answer-sheet/index.vue';
@@ -131,7 +151,7 @@
 const router = useRouter();
 
 const examStore = useExamStore();
-const { currentType, currentIndex, examDetail, examType } = storeToRefs(examStore);
+const { currentType, currentIndex, examDetail, examType, examInfo } = storeToRefs(examStore);
 
 const typeComponent = {
   1: AnswerSingle,
@@ -141,6 +161,7 @@
 
 const quitDialog = ref(false);
 const submitDialog = ref(false);
+const timeDialog = ref(false);
 
 const prevQuestion = () => {
   currentIndex.value--;
@@ -211,14 +232,26 @@
 // 浜ゅ嵎
 const submitExam = () => {
   submitDialog.value = true;
-}
+};
 
 const confirmSubmit = () => {
   submitDialog.value = false;
   router.back();
 };
 
+const resetAllDialog = () => {
+  quitDialog.value = false;
+  submitDialog.value = false;
+}
 
+// 鏃堕棿缁撴潫
+const timeOut = () => {
+  resetAllDialog();
+  timeDialog.value = true;
+  setTimeout(() => {
+    router.back();
+  },2000);
+};
 
 watchEffect(() => {
   let progress = 0;
@@ -282,4 +315,15 @@
 .tool-button {
   margin: 0 20px;
 }
+
+.icon-container {
+  width: 70px;
+  height: 70px;
+  border-radius: 50%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: rgba($color: #3680fa, $alpha: 0.2);
+  margin-bottom: 20px;
+}
 </style>
\ No newline at end of file

--
Gitblit v1.8.0