From 360f252566e55aae61f0bb17469cb28955dc32bc Mon Sep 17 00:00:00 2001 From: ZhangXianQiang <1135831638@qq.com> Date: 星期二, 11 六月 2024 10:12:02 +0800 Subject: [PATCH] feat:答题切换 --- src/views/exam/components/answer-main/answer-single/index.vue | 43 ++++++++++--------------------------------- 1 files changed, 10 insertions(+), 33 deletions(-) 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 c5316c2..140d1b7 100644 --- a/src/views/exam/components/answer-main/answer-single/index.vue +++ b/src/views/exam/components/answer-main/answer-single/index.vue @@ -1,13 +1,13 @@ <template> <div class="answer-container w-full h-full"> <el-scrollbar> - <ExamInfo class="mb-5"></ExamInfo> + <ExamInfo class="mb-5" :questionIndex="currentIndex" :title="activeQuestion.title"></ExamInfo> <div class="answer-content"> - <div class="answer-item flex" v-for="item, index in examInfo.answerList" @click="answerClick(item)" + <div class="answer-item flex" v-for="item, index in activeQuestion.items" @click="answerClick(item)" :class="answerState(item)"> - <div class="answer-icon flex flex-col justify-center items-center flex-shrink-0">{{ item.type }}</div> - <div class="answer-text text-gray-700">{{ item.text }}</div> + <div class="answer-icon flex flex-col justify-center items-center flex-shrink-0">{{ item.prefix }}</div> + <div class="answer-text text-gray-700">{{ item.content }}</div> </div> </div> @@ -17,36 +17,12 @@ <script setup> import { ref } from 'vue'; +import {storeToRefs} from 'pinia'; import ExamInfo from '@/components/ExamInfo/index.vue'; +import {useExamStore} from '@/store/index.js'; +const examStore = useExamStore(); -const examInfo = ref({ - qId: 1, - answerList: [ - { - type: 'A', - text: '娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯璇曟祴璇�', - isActive: false - }, - { - type: 'B', - text: '娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯璇曟祴璇�', - isActive: false - }, - { - type: 'C', - text: '娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯璇曟祴璇�', - isActive: false - }, - { - type: 'D', - text: '娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯娴嬭瘯璇曟祴璇�', - isActive: false - }, - ] -}); - -const activeIndex = ref(null); - +const {currentIndex,activeQuestion} = storeToRefs(examStore); const answerClick = (item) => { if(item) { resetAnswer(); @@ -61,9 +37,10 @@ } const resetAnswer = () => { - examInfo.value.answerList.forEach(item => item.isActive = false); + activeQuestion.value.items.forEach(item => item.isActive = false); } + </script> <style lang="scss" scoped> -- Gitblit v1.8.0