From 1a20a2c7a9e1ba9a0ffb83fb3d09ee7215d260c4 Mon Sep 17 00:00:00 2001 From: ZhangXianQiang <1135831638@qq.com> Date: 星期三, 19 六月 2024 09:55:24 +0800 Subject: [PATCH] chore(考试store):简化数据获取 --- src/views/exam/components/answer-main/answer-multiple/index.vue | 5 ++ src/api/index.js | 2 + src/store/modules/exam.js | 30 ++++++++++++--- src/views/exam/components/answer-sheet/index.vue | 10 +++- src/views/exam/components/answer-main/answer-single/index.vue | 11 ++--- src/views/exam/index.vue | 7 +-- 6 files changed, 45 insertions(+), 20 deletions(-) diff --git a/src/api/index.js b/src/api/index.js index d2351d2..9f72466 100644 --- a/src/api/index.js +++ b/src/api/index.js @@ -1,6 +1,8 @@ import axios from "axios"; import { useRoute } from "vue-router"; + const route = useRoute(); + axios.defaults.headers["Content-Type"] = "application/json;charset=utf-8"; const service = axios.create({ diff --git a/src/store/modules/exam.js b/src/store/modules/exam.js index fb33503..4622a95 100644 --- a/src/store/modules/exam.js +++ b/src/store/modules/exam.js @@ -1,4 +1,4 @@ -import { ref,computed } from 'vue'; +import { ref, computed } from 'vue'; import { defineStore } from 'pinia'; export const useExamStore = defineStore('exam', () => { const examInfo = ref({ @@ -47,7 +47,7 @@ } ], "analyze": "闂皬鏈嬪弸", - "correct": "B", + "correct": "", "score": "", "difficult": 5 }, @@ -76,7 +76,7 @@ } ], "analyze": "闂皬鏈嬪弸", - "correct": "B", + "correct": "", "score": "", "difficult": 5 } @@ -110,7 +110,7 @@ } ], "analyze": "闂皬鏈嬪弸", - "correct": "B", + "correct": "", "score": "", "difficult": 5 }, @@ -139,7 +139,7 @@ } ], "analyze": "闂皬鏈嬪弸", - "correct": "B", + "correct": "", "score": "", "difficult": 5 } @@ -148,6 +148,14 @@ ]); const activeQuestion = ref(null); + + + const getActiveQuestion = computed(() => { + const temp = examDetail.value.find(item => item.questionType === currentType.value); + if(temp) { + return temp.questionList[currentIndex.value]; + } + }) const setExamInfo = (info) => { examInfo.value = info; @@ -161,6 +169,14 @@ activeQuestion.value = detail; }; + const setQuestionAnswer = (type, index, answer) => { + const temp = examDetail.value.find(item => item.questionType === type); + if(temp) { + temp.questionList[index].correct = answer; + } + }; + + return { examInfo, examDetail, @@ -168,8 +184,10 @@ activeQuestion, currentType, currentIndex, + getActiveQuestion, setExamInfo, setExamDetail, - setActiveQuestion + setActiveQuestion, + setQuestionAnswer }; }); diff --git a/src/views/exam/components/answer-main/answer-multiple/index.vue b/src/views/exam/components/answer-main/answer-multiple/index.vue index 328da09..4142e61 100644 --- a/src/views/exam/components/answer-main/answer-multiple/index.vue +++ b/src/views/exam/components/answer-main/answer-multiple/index.vue @@ -23,7 +23,10 @@ const examStore = useExamStore(); -const {currentIndex,activeQuestion} = storeToRefs(examStore); +const {currentIndex} = storeToRefs(examStore); + +const activeQuestion = ref(examStore.getActiveQuestion); + const answerClick = (item) => { if(item) { // resetAnswer(); diff --git a/src/views/exam/components/answer-main/answer-single/index.vue b/src/views/exam/components/answer-main/answer-single/index.vue index 8f9ee44..288bca2 100644 --- a/src/views/exam/components/answer-main/answer-single/index.vue +++ b/src/views/exam/components/answer-main/answer-single/index.vue @@ -16,19 +16,21 @@ </template> <script setup> -import { ref } from 'vue'; +import { ref, onMounted } from 'vue'; import {storeToRefs} from 'pinia'; import ExamInfo from '@/components/ExamInfo/index.vue'; import {useExamStore} from '@/store/index.js'; const examStore = useExamStore(); -const {currentType,currentIndex,activeQuestion,examDetail} = storeToRefs(examStore); +const {currentType,currentIndex,examDetail} = storeToRefs(examStore); + +const activeQuestion = ref(examStore.getActiveQuestion); const answerClick = (item) => { if(item) { resetAnswer(); item.isActive = true; - + examStore.setQuestionAnswer(currentType.value, currentIndex.value, item.prefix); } }; @@ -42,9 +44,6 @@ activeQuestion.value.items.forEach(item => item.isActive = false); } -const filterExam = () => { - -} </script> diff --git a/src/views/exam/components/answer-sheet/index.vue b/src/views/exam/components/answer-sheet/index.vue index 4c44045..e3a7418 100644 --- a/src/views/exam/components/answer-sheet/index.vue +++ b/src/views/exam/components/answer-sheet/index.vue @@ -5,7 +5,7 @@ <template v-for="item in examDetail"> <el-collapse-item :title="examType[item.questionType]" :name="item.questionType"> <div class="sheet-list grid grid-cols-5 gap-4 justify-items-center"> - <div class="sheet-item cursor-pointer flex justify-center items-center" v-for="question,index in item.questionList" @click="sheetClick(item.questionType,index,question)" :class="itemClass(item,item.questionType, index)"> + <div class="sheet-item cursor-pointer flex justify-center items-center" v-for="question,index in item.questionList" @click="sheetClick(item.questionType,index)" :class="itemClass(item,item.questionType, index)"> {{ index + 1 }} </div> </div> @@ -33,10 +33,9 @@ const activeNames = ref(examDetail.value.map(item => item.questionType)); -const sheetClick = (type,index,question) => { +const sheetClick = (type,index) => { currentType.value = type; currentIndex.value = index; - examStore.setActiveQuestion(question); } </script> @@ -55,4 +54,9 @@ .active { border-color: #3680fa; } +.answer { + border-color: #3680fa !important; + background-color: #3680fa !important; + color: #fff !important; +} </style> \ No newline at end of file diff --git a/src/views/exam/index.vue b/src/views/exam/index.vue index 61ee1a9..62b56d5 100644 --- a/src/views/exam/index.vue +++ b/src/views/exam/index.vue @@ -82,7 +82,7 @@ <el-dialog v-model="dialogVisible" title="娉ㄦ剰" width="500"> <div class="dialog-container"> <p>璇风‘璁ゆ槸鍚﹂��鍑哄綋鍓嶈�冭瘯</p> - <p>褰撳墠鑰冭瘯璇曞嵎浼氳嚜鍔ㄦ彁浜�,鍚庣画鏃犳硶缁х画浣滅瓟</p> + <p>褰撳墠鑰冭瘯璇曞嵎浼氳嚜鍔ㄦ彁浜�,鍚庣画灏嗘棤娉曠户缁綔绛�</p> </div> <template #footer> <div class="dialog-footer"> @@ -112,13 +112,12 @@ const router = useRouter(); const examStore = useExamStore(); -const { currentType, currentIndex, activeQuestion, examDetail } = storeToRefs(examStore); +const { currentType, currentIndex, examDetail } = storeToRefs(examStore); const typeComponent = { 1: AnswerSingle, 2: AnswerMultiple, }; -examStore.setActiveQuestion(examDetail.value[0].questionList[0]); const dialogVisible = ref(false); @@ -163,7 +162,7 @@ currentIndex.value = 0; } } - findQuestion(currentType.value, currentIndex.value); + // findQuestion(currentType.value, currentIndex.value); } }; -- Gitblit v1.8.0