密码强制修改实现

xiangpei

2024-07-09 8a968bcc9d96c6ac88c6ec85b27be63ae40aef36

 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>
          <el-input v-model="answer.content" type="textarea" rows="5"></el-input>
        <div class="q-title" v-html="question.title"/>
        <div class="rich-text-box">
          <div v-html="question.answer"></div>
        </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">解析：</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">正确答案：</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,71 @@
    }
  },
  methods: {
    trueFalseFormatter(question) {
      return question.items.filter(d => d.prefix === question.correct)[0].content
    updateRight () {
      // 当score变化时，检查它是否等于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
}

.rich-text-box {
  border: 1px solid #ccc; /* 添加边框 */
  padding: 10px ; /* 添加内边距以提供空间 */
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}
</style>