From 54730b188630e71ac9ee4044a4b9be160072d0d1 Mon Sep 17 00:00:00 2001 From: 龚焕茏 <2842157468@qq.com> Date: 星期二, 02 七月 2024 10:59:22 +0800 Subject: [PATCH] feat:新增考试记录题目查看 --- src/views/answer/components/QuestionAnswerShow.vue | 126 +++++++++++++++++++++++++++++------------- 1 files changed, 87 insertions(+), 39 deletions(-) diff --git a/src/views/answer/components/QuestionAnswerShow.vue b/src/views/answer/components/QuestionAnswerShow.vue index f94f3ad..613bdf1 100644 --- a/src/views/answer/components/QuestionAnswerShow.vue +++ b/src/views/answer/components/QuestionAnswerShow.vue @@ -1,12 +1,13 @@ <template> <div v-loading="qLoading" style="line-height:1.8"> - <div v-if="qType == 1 || qType == 2 || qType == 3 || qType == 4 || qType == 5 || qType == 6 || qType == 7 || qType == 8"> - <!-- 閫夋嫨鎴栬闊� --> + <div + v-if="qType == 1 || qType == 2 || qType == 3 || qType == 4 || qType == 5 || qType == 6 || qType == 7 || qType == 8"> + <!-- 閫夋嫨鎴栬闊� --> <div v-if="qType == 1 || qType == 6"> - <div class="q-title" v-html="question.title" /> + <div class="q-title" v-html="question.title"/> <div class="q-content"> - <el-radio-group v-model="answer.content"> - <el-radio v-for="item in question.items" :key="item.prefix" :label="item.prefix"> + <el-radio-group v-model="question.answer"> + <el-radio class="custom-radio" v-for="item in question.questionItemList" :key="item.prefix" :label="item.prefix " disabled> <span class="question-prefix">{{ item.prefix }}.</span> <span v-html="item.content" class="q-item-span-content"></span> </el-radio> @@ -15,10 +16,10 @@ </div> <!-- 澶氶�� --> <div v-else-if="qType == 2"> - <div class="q-title" v-html="question.title" /> + <div class="q-title" v-html="question.title"/> <div class="q-content"> - <el-checkbox-group v-model="answer.contentArray"> - <el-checkbox v-for="item in question.items" :label="item.prefix" :key="item.prefix"> + <el-checkbox-group v-model="question.answerList"> + <el-checkbox v-for="item in question.questionItemList" :label="item.prefix" :key="item.prefix" disabled> <span class="question-prefix">{{ item.prefix }}.</span> <span v-html="item.content" class="q-item-span-content"></span> </el-checkbox> @@ -29,8 +30,8 @@ <div v-else-if="qType == 3"> <div class="q-title" v-html="question.title" style="display: inline;margin-right: 10px" /> <span style="padding-right: 10px;">(</span> - <el-radio-group v-model="answer.content"> - <el-radio v-for="item in question.items" :key="item.prefix" :label="item.prefix"> + <el-radio-group v-model="question.answer"> + <el-radio v-for="item in question.questionItemList" :key="item.prefix" :label="item.prefix " disabled> <span v-html="item.content" class="q-item-span-content"></span> </el-radio> </el-radio-group> @@ -38,52 +39,54 @@ </div> <!-- 濉┖ --> <div v-else-if="qType == 4"> - <div class="q-title" v-html="question.title" /> - <div v-if="answer.contentArray !== null"> - <el-form-item :label="item.prefix" :key="item.prefix" v-for="item in question.items" label-width="50px" - style="margin-top: 10px;margin-bottom: 10px;"> - <el-input v-model="answer.contentArray[item.prefix - 1]" /> + <div class="q-title" v-html="question.title"/> + <div v-if="question.answerList !== null"> + <el-form-item :label="item.prefix" :key="item.prefix" v-for="item in question.questionItemList" + label-width="50px" + style="margin-top: 10px;margin-bottom: 10px;"> + <el-input v-model="question.answerList[item.prefix - 1]" disabled/> </el-form-item> </div> </div> <!-- 绠�绛斻�佽绠椼�佸垎鏋� --> <div v-else-if="qType == 5 || qType == 7 || qType == 8"> - <div class="q-title" v-html="question.title" /> + <div class="q-title" v-html="question.title"/> <div> - <el-input v-model="answer.content" type="textarea" rows="5"></el-input> + <el-input v-model="question.answer" type="textarea" rows="5" ></el-input> </div> </div> <div class="question-answer-show-item" style="margin-top: 15px"> <span class="question-show-item">缁撴灉锛�</span> - <el-tag :type="doRightTagFormatter(answer.doRight)"> - {{ doRightTextFormatter(answer.doRight) }} + <el-tag :type="rightTagFormatter(question.right)"> + {{ rightTextFormatter(question.right) }} </el-tag> </div> <div class="question-answer-show-item"> - <span class="question-show-item">鍒嗘暟锛�</span> + <span class="question-show-item">鎬诲垎锛�</span> + <span>{{ question.questionScore }}</span> + </div> + <div class="question-answer-show-item"> + <span class="question-show-item">寰楀垎锛�</span> <span>{{ question.score }}</span> </div> <div class="question-answer-show-item"> <span class="question-show-item">闅惧害锛�</span> <el-rate disabled v-model="question.difficult" class="question-show-item"></el-rate> </div> - <br /> + <br/> <div class="question-answer-show-item" style="line-height: 1.8"> <span class="question-show-item">瑙f瀽锛�</span> - <span v-html="question.analyze" class="q-item-span-content" /> + <span v-html="question.analyze" class="q-item-span-content"/> </div> <div class="question-answer-show-item"> <span class="question-show-item">姝g‘绛旀锛�</span> <!-- 閫夋嫨銆佸閫夈�佺畝绛斻�佽闊炽�佽绠椼�佸垎鏋� --> - <span v-if="qType == 1 || qType == 2 || qType == 5 || qType == 6 || qType == 7 || qType == 8" v-html="question.correct" class="q-item-span-content" /> + <span v-if="qType == 1 || qType == 2 || qType == 5 || qType == 6 || qType == 7 || qType == 8" + v-html="question.questionAnswer" class="q-item-span-content"/> <!-- 鍒ゆ柇 --> - <span v-if="qType == 3" v-html="trueFalseFormatter(question)" class="q-item-span-content" /> + <span v-if="qType == 3" v-html="trueFalseFormatter(question)" class="q-item-span-content"/> <!-- 濉┖ --> - <span v-if="qType == 4">{{ question.correctArray }}</span> - </div> - <div v-if = "answer.doRight == null"> - <span style="color:#ECAB3C;">{{'鎵规敼锛�'}}</span> - <el-input-number size="mini" v-model="answer.score" :precision="1" :min="0" :max="parseInt(question.score)" ></el-input-number> + <span v-if="qType == 4">{{ question.questionAnswer }}</span> </div> </div> <div v-else> @@ -94,6 +97,7 @@ <script> import { mapState, mapGetters } from 'vuex' + export default { name: 'QuestionShow', props: { @@ -104,9 +108,9 @@ } }, answer: { - type: Object, + type: Array, default: function () { - return { id: null, content: '', contentArray: [], doRight: false } + return {} } }, qLoading: { @@ -119,22 +123,66 @@ } }, methods: { - trueFalseFormatter(question) { - return question.items.filter(d => d.prefix === question.correct)[0].content + updateRight () { + // 褰搒core鍙樺寲鏃讹紝妫�鏌ュ畠鏄惁绛変簬questionScore + this.question.right = this.question.score === parseInt(this.question.questionScore) + const foundAnswer = this.answer.find(answer => answer.itemOrder === this.question.itemOrder) + if (foundAnswer) { + foundAnswer.right = this.question.right + } }, - doRightTagFormatter(status) { - return this.enumFormat(this.doRightTag, status) + trueFalseFormatter (question) { + return question.questionItemList.filter(d => d.prefix === question.questionAnswer)[0].content }, - doRightTextFormatter(status) { - return this.enumFormat(this.doRightEnum, status) + rightTagFormatter (status) { + return this.enumFormat(this.rightTag, status) + }, + rightTextFormatter (status) { + return this.enumFormat(this.rightEnum, status) } }, computed: { ...mapGetters('enumItem', ['enumFormat']), ...mapState('enumItem', { - doRightEnum: state => state.exam.question.answer.doRightEnum, - doRightTag: state => state.exam.question.answer.doRightTag + rightEnum: state => state.exam.question.answer.doRightEnum, + rightTag: state => state.exam.question.answer.doRightTag }) } } </script> + +<style scoped> + +/deep/ .el-checkbox__input.is-disabled + .el-checkbox__label { + color: #606266 +} + +/deep/ .el-checkbox__input.is-disabled.is-checked + .el-checkbox__label { + color: #606266 +} + +/deep/ .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner:after { + border-color: #606266 +} + +/deep/ .el-radio__input.is-disabled + span.el-radio__label { + color: #606266 +} + +/deep/ .el-radio__input.is-disabled.is-checked .el-radio__inner::after { + background-color: #606266; +} + +/deep/ .el-radio__input.is-disabled .el-radio__inner, .el-radio__input.is-disabled.is-checked .el-radio__inner { + border-color: #606266 +} + +/deep/ .el-input.is-disabled .el-input__inner, textarea:disabled { + color: #606266 +} + +/deep/ .el-range-editor.is-disabled input { + color: #606266 +} + +</style> -- Gitblit v1.8.0