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