[测评系统]--前端(用户答题页面)
yj
2024-12-03 7f4105bc2f1d4f8562e1cb9776ce49f8be0c98d2
src/views/exam/paper/exercise.vue
@@ -1,6 +1,6 @@
<template>
  <div>
    <el-container  class="app-item-contain">
  <div v-loading.fullscreen.lock="!formDo">
    <el-container  class="app-item-contain" v-if="formDo">
      <el-main style="padding-top: 3%;">
        <el-form :model="form" ref="form" label-width="100%">
          <el-row :key="index"  v-for="(titleItem,index) in titleItems">
@@ -17,13 +17,10 @@
              <hr style="border : 0.5px dashed #b3d8ff;" />
              <div style="color: red;font-size: smaller">{{$t('pleaseAnswerCarefully_exercise')}}</div>
              
              <el-row class="do-align-center" v-if="itemOrder > 1">
                <el-button @click="doExam" type="success" round>{{$t('startDo_apifan')}}</el-button>
                <el-button @click="preSubject" type="warning" round>{{$t('lastQuestion')}}</el-button>
              </el-row>
              <el-row class="do-align-center" v-if="itemOrder <= 1">
                <el-button @click="doExam" type="success" round>{{$t('startDo_apifan')}}</el-button>
                <el-button @click="nextSubject" type="primary" round>{{$t('nextQuestion')}}</el-button>
              <el-row class="do-align-center">
                <el-button v-if="isSubmit" @click="doExam" type="success" round>{{$t('startDo_apifan')}}</el-button>
                <el-button v-if="isStart && !isLast" @click="preSubject" type="warning" round>{{$t('lastQuestion')}}</el-button>
                <el-button v-if="isStart && isLast" @click="nextSubject" type="primary" round>{{$t('nextQuestion')}}</el-button>
              </el-row>
            </el-card>
          </el-row>
@@ -62,35 +59,29 @@
  components: { QuestionEdit },
  data () {
    return {
      formDo: this.$route.query.formDo,
      memberName: this.$route.query.formDo.memberName,
      // formDo: this.$route.query.formDo,
      memberName: '',
      form: {
        name: this.$route.query.formDo.name
        name: ''
      },
      itemOrder: 1,
      itemSize: 2,
      itemSize: 3,
      note: this.$t('exercise_note'),
      guide: this.$t('exercise_guide'),
      note_1: this.$t('exercise_note_1'),
      guide_1: this.$t('exercise_guide_1'),
      answer: {
        answerItems: [
          {
            content: '',
            readOnly: false
          },
          {
            content: '',
            readOnly: false
          }
        ]
        answerItems: []
      },
      titleItems: [],
      questionItem: {},
      isSubmit: false
      isSubmit: false,
      isStart: false,
      isLast: false
    }
  },
  created: function () {
    this.getFormDo()
    this.initQuestion()
  },
  mounted () {
@@ -98,50 +89,72 @@
  beforeDestroy () {
  },
  watch: {
    'formDo': function (newVal, oldVal) {
      this.initQuestion()
    }
  },
  methods: {
    // 初始化题目
    initQuestion () {
      this.memberName = this.formDo.memberName
      this.form.name = this.formDo.name
      this.titleItems = [
        {
          questionItems: [
            this.formDo.titleItems[0].questionItems[0],
            this.formDo.titleItems[0].questionItems[1]
          ]
          questionItems: []
        }
      ]
      for (let i = 0; i < this.itemSize; i++) {
        this.titleItems[0].questionItems.push(this.formDo.titleItems[0].questionItems[i])
      }
      this.questionItem = this.titleItems[0].questionItems[this.itemOrder - 1]
      for (let i = 0; i < this.itemSize; i++) {
        let data = {
          content: '',
          readOnly: false
        }
        this.answer.answerItems.push(data)
      }
    },
    nextSubject () {
      console.log(this.answer)
      console.log('formDo')
      console.log(this.formDo)
      if (this.itemOrder === 2) {
      this.isStart = true
      this.isLast = false
      if (this.itemOrder === this.itemSize) {
        this.isSubmit = true
        this.$message({
          message: this.$t('exercise_submit_tip'),
          type: 'success'
        })
        return
      }
      this.itemOrder = 2
      this.itemOrder += 1
      this.answer.answerItems[this.itemOrder - 1].readOnly = false
      this.questionItem = this.titleItems[0].questionItems[this.itemOrder - 1]
      if (this.itemOrder === this.itemSize && this.answer.answerItems[this.itemOrder - 1].content !== '') {
        this.isSubmit = true
      }
    },
    preSubject () {
      this.isLast = true
      this.isSubmit = false
      this.itemOrder = 1
      this.itemOrder -= 1
      this.answer.answerItems[this.itemOrder - 1].readOnly = false
      this.questionItem = this.titleItems[0].questionItems[this.itemOrder - 1]
    },
    doExam () {
      let _this = this
      examPaperApi.updateTestMemberStatus(_this.memberToken).then(re => {
        _this.$router.push({ path: '/exam/' + _this.doUrl, query: { formDo: _this.$route.query.formDo } })
        _this.$router.push({ path: '/exam/' + _this.doUrl, query: { formDo: _this.formDo } })
      }).catch(re => {
        _this.$message.error(re.message + ' 更新状态失败')
      })
    }
    },
    ...mapMutations('user', ['getFormDo'])
  },
  computed: {
    ...mapState('exam', { doUrl: state => state.doUrl }),
    ...mapState('user', { memberToken: state => state.memberToken })
    ...mapState('user', { memberToken: state => state.memberToken }),
    ...mapState('user', { formDo: state => state.formDo })
  }
}
</script>