From 945cbd86a706804d3d8e9d4da14e159be7e6f3eb Mon Sep 17 00:00:00 2001 From: ZhangXianQiang <1135831638@qq.com> Date: 星期一, 17 六月 2024 13:43:02 +0800 Subject: [PATCH] feat(考试):多选题 --- src/views/exam/index.vue | 69 +++++++++++++++++++++++++++++++--- 1 files changed, 62 insertions(+), 7 deletions(-) diff --git a/src/views/exam/index.vue b/src/views/exam/index.vue index 8703f59..61ee1a9 100644 --- a/src/views/exam/index.vue +++ b/src/views/exam/index.vue @@ -56,7 +56,7 @@ <div class="main-wrapper w-full grow relative my-5"> <div class="main-content absolute top-0 bottom-0 w-full"> <Transition appear name="fade-transform" mode="out-in"> - <component :is="typeComponent[currentType]" :key="questionIndex"></component> + <component :is="typeComponent[currentType]" :key="currentIndex"></component> </Transition> </div> </div> @@ -98,6 +98,7 @@ <script setup> import { ref } from 'vue'; +import { storeToRefs } from 'pinia'; import { Close } from '@element-plus/icons-vue'; import AnswerTag from './components/answer-tag/index.vue'; import AnswerProgress from './components/answer-progress/index.vue'; @@ -105,23 +106,76 @@ import AnswerSingle from './components/answer-main/answer-single/index.vue'; import AnswerMultiple from './components/answer-main/answer-multiple/index.vue'; import AnswerTime from './components/answer-time/index.vue'; +import { useExamStore } from '@/store/index.js'; +import { useRouter } from 'vue-router'; + +const router = useRouter(); + +const examStore = useExamStore(); +const { currentType, currentIndex, activeQuestion, examDetail } = storeToRefs(examStore); const typeComponent = { 1: AnswerSingle, 2: AnswerMultiple, }; - -const currentType = ref(1); -const questionIndex = ref(0); +examStore.setActiveQuestion(examDetail.value[0].questionList[0]); const dialogVisible = ref(false); const prevQuestion = () => { - questionIndex.value--; + currentIndex.value--; + checkList(); }; const nextQuestion = () => { - questionIndex.value++; + currentIndex.value++; + checkList(); +}; + +const checkList = () => { + let tempIndex = 0; + const typeQuestion = examDetail.value.find((typeItem, index) => { + if (typeItem.questionType === currentType.value) { + tempIndex = index; + return typeItem; + } else { + return false; + } + }); + if (typeQuestion) { + if (currentIndex.value >= typeQuestion.questionList.length) { + tempIndex++; + if(examDetail.value[tempIndex]) { + currentType.value = examDetail.value[tempIndex].questionType; + currentIndex.value = 0; + } else { + currentType.value = typeQuestion.questionType; + currentIndex.value = typeQuestion.questionList.length - 1; + } + + } else if (currentIndex.value < 0) { + tempIndex--; + if(examDetail.value[tempIndex]) { + currentType.value = examDetail.value[tempIndex].questionType; + currentIndex.value = examDetail.value[tempIndex].questionList.length - 1; + } else { + currentType.value = typeQuestion.questionType; + currentIndex.value = 0; + } + } + findQuestion(currentType.value, currentIndex.value); + } + +}; + +const findQuestion = (type, index) => { + const typeQuestion = examDetail.value.find(typeItem => typeItem.questionType === type); + if (typeQuestion) { + const question = typeQuestion.questionList[index]; + if (question) { + examStore.setActiveQuestion(question); + } + } }; const closeClick = () => { @@ -130,7 +184,8 @@ const confirmCancel = () => { dialogVisible.value = false; -} + router.back(); +}; </script> <style lang="scss" scoped> -- Gitblit v1.8.0