| | |
| | | <!-- 多选题 --> |
| | | <template> |
| | | <div class="answer-container w-full h-full"> |
| | | <el-scrollbar> |
| | |
| | | <div class="answer-item flex" v-for="item, index in activeQuestion.questionItemList" @click="answerClick(item)" |
| | | :class="answerState(item)"> |
| | | <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 class="answer-text text-gray-700" v-html="item.content"></div> |
| | | </div> |
| | | </div> |
| | | |
| | |
| | | |
| | | const answerClick = (item) => { |
| | | if (item) { |
| | | // resetAnswer(); |
| | | item.isActive = !item.isActive; |
| | | const answerList = filterAnswer(); |
| | | examStore.setQuestionAnswer(currentType.value, currentIndex.value, answerList.join(',')); |
| | | |
| | | examStore.setQuestionAnswerList(currentType.value, currentIndex.value, answerList); |
| | | } |
| | | }; |
| | | |
| | | const answerState = (item) => { |
| | | if(Array.isArray(activeQuestion.value.answerList) && activeQuestion.value.answerList.includes(item.prefix)) { |
| | | item.isActive = true; |
| | | } |
| | | return { |
| | | active: item.isActive |
| | | }; |
| | | }; |
| | | |
| | | const filterAnswer = () => { |
| | | return activeQuestion.value.items.filter(item => item.isActive); |
| | | return activeQuestion.value.questionItemList.filter(item => item.isActive).map(item => item.prefix); |
| | | } |
| | | |
| | | |
| | | |
| | | |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |