[测评系统]--前端(用户答题页面)
84702473
2023-03-06 c214f734b2208661345a33f9749db2813b7e40d9
src/views/exam/paper/values.vue
@@ -10,7 +10,8 @@
            </div>
            <div style="display: flex;justify-content: flex-start;padding: 10px 0;">
          <el-button @click="step1_start" type="primary" v-if="!step1Start">{{$t('start')}}</el-button>
               <el-button style="margin-top: 12px;" @click="step1_next" v-if="(step1Start && itemSize>0)">{{$t('next')}}</el-button>
               <el-button style="margin-top: 12px;" @click="step1_next" v-if="(step1Start && itemSize>0)">
                  {{$t('next')}}</el-button>
            </div>
            <div class="mullinediv" v-if="step1Start">
               <div v-for="question in questionItems" class="mullinediv-item" v-if="isNull(question.analyze)">
@@ -28,20 +29,23 @@
         <el-main class="">
            <div>
               <div class="tag-group">
                 <span class="tag-group__title" style="padding-right: 20px;">{{$t('values_cur_step')}}({{step2SubStep}} / {{step2ScoreRanges.length}})</span>
                 <el-tag
                   v-for="item in step2ScoreRanges"
                   :key="item.itemOrder"
                   :type="getStep2StepTagType(item.step)"
                     style="margin: 0 2px;font-size: 26px;"
              size="large"
                  <span class="tag-group__title"
                     style="padding-right: 20px;">{{$t('values_cur_step')}}({{step2SubStep}} /
                     {{step2ScoreRanges.length}})</span>
                  <el-tag v-for="item in step2ScoreRanges" :key="item.itemOrder"
                     :type="getStep2StepTagType(item.step)" style="margin: 0 2px;font-size: 26px;" size="large"
                   effect="light">
                   {{ item.quantity }}
                 </el-tag>
               </div>
               <div style="display: flex;justify-content: space-between;">
                  <div style="line-height: 50px;text-indent: 2em;">
              {{$t('values_step_tips1')}}{{(step2SubStep % 2 == 0)?$t('values_step_tips4'):''}}{{$t('values_step_tips2')}}{{getStep2StepItem(step2SubStep).quantity}}{{$t('values_step_tips3')}}
                     <span v-if="(step2SubStep == step2ScoreRanges.length) && (step2ScoreRanges.length % 2 == 1)">
                        {{$t('values_step_tips_for_3').replace('%N',getStep2StepItem(step2SubStep).quantity)}}
                     </span>
                     <span v-else>
                        {{(step2SubStep % 2 == 1)?$t('values_step_tips_for_1').replace('%N',getStep2StepItem(step2SubStep).quantity):$t('values_step_tips_for_2').replace('%N',getStep2StepItem(step2SubStep).quantity)}}
                     </span>
                  </div>
                  <div style="display: flex;justify-content: flex-end;">
                     <el-button style="" @click="step2_pre" v-if="step2SubStep>1">{{$t('pre')}}</el-button>
@@ -50,13 +54,18 @@
               </div>
            </div>
            <div>
               <el-divider content-position="left"><span :style="'padding: 0 10px;background-color: ' + ((getStep2StepItem(step2SubStep).selected>getStep2StepItem(step2SubStep).quantity)?'red;':'#c8c3c3;')">{{getStep2StepItem(step2SubStep).selected}} / {{getStep2StepItem(step2SubStep).quantity}}</span> </el-divider>
               <el-divider content-position="left"><span
                     :style="'padding: 0 10px;background-color: ' + ((getStep2StepItem(step2SubStep).selected>getStep2StepItem(step2SubStep).quantity)?'red;':'#c8c3c3;')">{{getStep2StepItem(step2SubStep).selected}}
                     / {{getStep2StepItem(step2SubStep).quantity}}</span> </el-divider>
               <div style="">
                  <div class="inlinediv">
                     <div v-for="question in questionItems" class="mullinediv-item" v-if="getStep2StepItem(step2SubStep).itemOrder == question.subjectId">
                     <div v-for="question in questionItems" class="mullinediv-item"
                        v-if="getStep2StepItem(step2SubStep).itemOrder == question.subjectId">
                        <el-image  :src="question.imgUrl" lazy :preview-src-list="[question.imgUrl]"></el-image>
                        <div style="display: flex;justify-content: center;padding: 5px 10px;"><!--/*background-color: #c8c3c3;*/-->
                           <i class="el-icon-delete" @click="step2Delete(question.id,getStep2StepItem(step2SubStep).itemOrder)"></i>
                        <div style="display: flex;justify-content: center;padding: 5px 10px;">
                           <!--/*background-color: #c8c3c3;*/-->
                           <i class="el-icon-delete"
                              @click="step2Delete(question.id,getStep2StepItem(step2SubStep).itemOrder)"></i>
                           <!-- <i class="el-icon-zoom-in"></i> -->
                        </div>
                     </div>
@@ -65,10 +74,13 @@
            <el-divider content-position="left">{{$t('values_select_tips')}}</el-divider>
            <div style="height: auto;overflow: auto;">
            <div class="mullinediv" style="" v-if="questionItems && questionItems.length>0">
               <div v-for="question in questionItems" class="mullinediv-item" v-if="isNull(question.subjectId)">
                        <div v-for="question in questionItems" class="mullinediv-item"
                           v-if="isNull(question.subjectId)">
                  <el-image  :src="question.imgUrl" lazy :preview-src-list="[question.imgUrl]"></el-image>
                     <div style="display: flex; justify-content: center;padding: 5px 10px;margin-top: -5px;">
                        <el-checkbox @change="checked=>step2Add(checked,question.id,getStep2StepItem(step2SubStep).itemOrder)">{{$t('values_select')}}</el-checkbox>
                              <el-checkbox
                                 @change="checked=>step2Add(checked,question.id,getStep2StepItem(step2SubStep).itemOrder)">
                                 {{$t('values_select')}}</el-checkbox>
                        <!-- <i class="el-icon-check"></i> -->
                        <!-- <i class="el-icon-zoom-in"></i> -->
                     </div>
@@ -85,17 +97,24 @@
         <el-main class="">
        <div style="display:flex;">
          <div style="display: inline-block;min-width: 110px;text-align: right;">
              <div class="mul-inlinediv-row mul-inlinediv-lineheight" v-for="(item,index) in step2ScoreRanges">
                 {{(index == 0)?$t('values_mostLikeMe'):''}}{{(index == (step2ScoreRanges.length-1))?$t('values_mostUnLikeMe'):''}} {{item.deviate}}
                  <div class="mul-inlinediv-row mul-inlinediv-lineheight"
                     v-for="(item,index) in step2ScoreRanges">
                     {{(index == 0)?$t('values_mostLikeMe'):''}}{{(index == (step2ScoreRanges.length-1))?$t('values_mostUnLikeMe'):''}}
                     {{item.deviate}}
              </div>
          </div>
          <div class="mul-inlinediv-box">
                  <div class="mul-inlinediv" v-for="item in step2ScoreRanges">
                     <div class="mul-inlinediv-row">
                     <div v-for="question in questionItems" class="mullinediv-item" v-if="question.subjectId == item.itemOrder">
                        <el-image  :src="question.imgUrl" lazy :preview-src-list="[question.imgUrl]"></el-image>
                        <div style="display: flex;justify-content: center;padding: 5px 10px;"><!--/*background-color: #c8c3c3;*/-->
                           <el-checkbox v-model="question['checked']" @change="checked=>step3Change(checked,question)" :disabled="(step3ChangeSrc.subjectId != question.subjectId || step3ChangeSrc.id == question.id)?false:true">
                        <div v-for="question in questionItems" class="mullinediv-item"
                           v-if="question.subjectId == item.itemOrder">
                           <el-image :src="question.imgUrl" lazy :preview-src-list="[question.imgUrl]">
                           </el-image>
                           <div style="display: flex;justify-content: center;padding: 5px 10px;">
                              <!--/*background-color: #c8c3c3;*/-->
                              <el-checkbox v-model="question['checked']"
                                 @change="checked=>step3Change(checked,question)"
                                 :disabled="(step3ChangeSrc.subjectId != question.subjectId || step3ChangeSrc.id == question.id)?false:true">
                              {{(step3ChangeSrc.id==null)?$t('values_select'):(question.id==step3ChangeSrc.id)?$t('values_select'):$t('values_select_exchange')}}
                           </el-checkbox>
                        </div>
@@ -105,7 +124,8 @@
          </div>
        </div>
         <div style="display: flex;justify-content: center;">
            <el-button style="margin-top: 12px;" @click="step3_commit" :disabled="submitDisable">{{$t('commit')}}</el-button>
               <el-button style="margin-top: 12px;" @click="step3_commit" :disabled="submitDisable">
                  {{$t('commit')}}</el-button>
         </div>
         </el-main>
      </el-container>
@@ -119,8 +139,14 @@
</template>
<script>
import { mapState, mapGetters, mapMutations } from 'vuex'
import { formatDate } from '@/utils'
   import {
      mapState,
      mapGetters,
      mapMutations
   } from 'vuex'
   import {
      formatDate
   } from '@/utils'
import examPaperApi from '@/api/examPaper'
import examPaperAnswerApi from '@/api/examPaperAnswer'
import demographyApi from '@/api/demography'
@@ -141,8 +167,7 @@
          //     "questionReports": null
          // }
      ],
      step2ScoreRangesDefault: [
          {
            step2ScoreRangesDefault: [{
              "itemOrder": 0,
              "quantity": 0,
              "score": 0,
@@ -150,8 +175,7 @@
              "questionReports": null,
              "step":0,
              "selected":0
          }
      ],
            }],
      step2SubStep:1,
      step3ChangeSrc:{
        "id": null,
@@ -165,28 +189,24 @@
        "name": "VAQ",
        "suggestTime": null,
        "limitDateTime": null,
        "titleItems": [
            {
               "titleItems": [{
                "guide": "",
                "name": "",
                "description": "",
                "permanentId": null,
                "questionOrder": 0,
                "questionReport": null,
                "questionItems": [
                    {
                  "questionItems": [{
                        "id": 786,
                        "questionType": 1,
                        "subjectId": null,
                        "title": "麻将桌",
                        "gradeLevel": null,
                        "items": [
                            {
                        "items": [{
                                "prefix": "1",
                                "content": "0",
                                "score": "0"
                            }
                        ],
                        }],
                        "analyze": null,
                        "correctArray": null,
                        "correct": null,
@@ -211,13 +231,11 @@
                        "subjectId": null,
                        "title": "麻将桌2",
                        "gradeLevel": null,
                        "items": [
                            {
                        "items": [{
                                "prefix": "1",
                                "content": "0",
                                "score": "0"
                            }
                        ],
                        }],
                        "analyze": null,
                        "correctArray": null,
                        "correct": null,
@@ -242,13 +260,11 @@
                        "subjectId": null,
                        "title": "测试1",
                        "gradeLevel": null,
                        "items": [
                            {
                        "items": [{
                                "prefix": "1",
                                "content": "0",
                                "score": "0"
                            }
                        ],
                        }],
                        "analyze": null,
                        "correctArray": null,
                        "correct": null,
@@ -273,13 +289,11 @@
                        "subjectId": null,
                        "title": "测试2",
                        "gradeLevel": null,
                        "items": [
                            {
                        "items": [{
                                "prefix": "1",
                                "content": "0",
                                "score": "0"
                            }
                        ],
                        }],
                        "analyze": null,
                        "correctArray": null,
                        "correct": null,
@@ -304,13 +318,11 @@
                        "subjectId": null,
                        "title": "测试3",
                        "gradeLevel": null,
                        "items": [
                            {
                        "items": [{
                                "prefix": "1",
                                "content": "0",
                                "score": "0"
                            }
                        ],
                        }],
                        "analyze": null,
                        "correctArray": null,
                        "correct": null,
@@ -333,8 +345,7 @@
                "startTime": null,
                "endTime": null,
                "parts": [],
                "scoreRanges": [
                    {
                  "scoreRanges": [{
                        "itemOrder": 1,
                        "quantity": 2,
                        "score": 5,
@@ -356,8 +367,7 @@
                        "questionReports": null
                    }
                ]
            }
        ],
               }],
        "score": null,
        "guide": "VAQ",
        "questionOrder": [
@@ -440,13 +450,11 @@
      // 防止刷新成了不同的语言
      demographyApi.queryDemographyParamInfo(_this.memberToken).then(
        re => {
               console.log('queryDemographyParamInfo...',re)
          if (re.response[0].langType !== null || re.response[0].langType.trim() !== '') {
            _this.setLangType(re.response[0].langType)
          }
          // 加载题目
          examPaperApi.select(_this.memberToken, _this.langType).then(re => {
                  console.log('select...',re)
            _this.form = re.response
            _this.remainTime = re.response.suggestTime * 60
            _this.titleItemsLength = _this.form.titleItems.length
@@ -468,23 +476,36 @@
              if (_this.answered !== null) {
                _this.answered.forEach(it => {
                  _this.answer.answerItems[parseInt(it.itemOrder) - 1].content = it.content
                  _this.answer.answerItems[parseInt(it.itemOrder) - 1].completed = true
                              _this.answer.answerItems[parseInt(it.itemOrder) -
                                 1].content = it.content
                              _this.answer.answerItems[parseInt(it.itemOrder) -
                                 1].completed = true
                })
              }
              for (let i = 0; i < _this.answer.answerItems.length; i++) {
                if (!_this.answer.answerItems[i].completed || _this.answer.answerItems[i].content === null || _this.answer.answerItems[i].content === '') {
                  _this.questionItem = _this.form.titleItems[0].questionItems[i]
                           if (!_this.answer.answerItems[i].completed || _this.answer
                              .answerItems[i].content === null || _this.answer
                              .answerItems[i].content === '') {
                              _this.questionItem = _this.form.titleItems[0]
                                 .questionItems[i]
                  _this.partOrder = _this.questionItem.partOrder
                  _this.itemOrder = _this.form.titleItems[0].questionItems[i].itemOrder
                              _this.itemOrder = _this.form.titleItems[0].questionItems[i]
                                 .itemOrder
                  _this.order = i
                  _this.preDisable = true
                  break
                }
                if (_this.isForFinish(i)) {
                  _this.$router.push({ path: '/exam/finish', query: { name: '', content: _this.$t('finishMsg'), tokenId: _this.memberToken } })
                              _this.$router.push({
                                 path: '/exam/finish',
                                 query: {
                                    name: '',
                                    content: _this.$t('finishMsg'),
                                    tokenId: _this.memberToken
                                 }
                              })
                }
              }
              // 如果上一题不是本段,则不能返回上一段
@@ -502,8 +523,7 @@
            _this.$message.info(_this.$t('noquestionMsg'))
          })
        }
      ).catch(e => {
      })
            ).catch(e => {})
    }
  },
  mounted () {
@@ -516,7 +536,9 @@
    step1_start(){
       this.step = "step1"
         this.step1Start = true
         this.questionItems.sort(function(i2, i1){return (i2.id - i1.id)})
            this.questionItems.sort(function(i2, i1) {
               return (i2.id - i1.id)
            })
         //console.log('step1_start...',this.questionItems)
    },
      step1_next(){
@@ -537,7 +559,10 @@
            _this.submitSubAnswer()
            
        this.step2SubStep = this.step2SubStep + 1
        if(this.step2SubStep > this.step2ScoreRanges.length){
               if(this.step2SubStep == this.step2ScoreRanges.length){//进入最后一步骤
                  this.resetAllQuestionItemsValueByKeyWhenNull("subjectId",this.getStep2StepItem(this.step2SubStep).itemOrder)
               }
               if (this.step2SubStep > this.step2ScoreRanges.length) {//完成最后一步骤
          this.step = "step3"
        }
            
@@ -575,8 +600,10 @@
          //对调自己
        } else {
          //对调
          this.resetQuestionItemsValueById(this.step3ChangeSrc.id,"subjectId",question.subjectId)//借用subjectId,存储
          this.resetQuestionItemsValueById(question.id,"subjectId",this.step3ChangeSrc.subjectId)//借用subjectId,存储
                  this.resetQuestionItemsValueById(this.step3ChangeSrc.id, "subjectId", question
                     .subjectId) //借用subjectId,存储
                  this.resetQuestionItemsValueById(question.id, "subjectId", this.step3ChangeSrc
                     .subjectId) //借用subjectId,存储
        }
            //清理
            this.step3ChangeSrc.id = null
@@ -642,13 +669,19 @@
         let type = this.getLikeType(this.step2SubStep)
         switch (type) {
            case 0://0:最像我
               this.questionItems.sort(function(i2, i1){return (i2.analyze == 'Like')?-1:1})
                  this.questionItems.sort(function(i2, i1) {
                     return (i2.analyze == 'Like') ? -1 : 1
                  })
               break
            case 1://1:有疑问
               this.questionItems.sort(function(i2, i1){return (i2.analyze == 'NotSure')?-1:1})
                  this.questionItems.sort(function(i2, i1) {
                     return (i2.analyze == 'NotSure') ? -1 : 1
                  })
               break
            case 2://2:最不像我
               this.questionItems.sort(function(i2, i1){return (i2.analyze == 'UnLike')?-1:1})
                  this.questionItems.sort(function(i2, i1) {
                     return (i2.analyze == 'UnLike') ? -1 : 1
                  })
               break
         }
      },
@@ -676,6 +709,17 @@
      }
      //console.log('resetQuestionItems...',id,key,value,this.questionItems)
    },
         resetAllQuestionItemsValueByKeyWhenNull(key, value) {
            for (let item of this.questionItems) {
               if (this.isNull(item[key])) {
                  item[key] = value
                  if ("subjectId" == key) {
                     item['content'] = this.getLikeTypeByScoreRangeItemOrder(value)
                  }
               }
            }
            //console.log('resetQuestionItems...',id,key,value,this.questionItems)
         },
    caculateScoreRangeSelectedById(id,value){
         let sum = 0
         for (let item of this.questionItems) {
@@ -692,8 +736,7 @@
    initTestData(){
      let _this = this
      //for test
      _this.step2ScoreRanges = [].concat([
        {
            _this.step2ScoreRanges = [].concat([{
            "itemOrder": 1,
            "quantity": 1,
            "score": 5,
@@ -751,20 +794,17 @@
        // },
      ])
      _this.questionItems = _this.questionItems.concat([
        {
            _this.questionItems = _this.questionItems.concat([{
            "id": 100,
            "questionType": 1,
            "subjectId": 3,
            "title": "麻将桌",
            "gradeLevel": null,
            "items": [
                {
                  "items": [{
                    "prefix": "1",
                    "content": "0",
                    "score": "0"
                }
            ],
                  }],
            "analyze": "Like",
            "correctArray": null,
            "correct": null,
@@ -789,13 +829,11 @@
            "subjectId": 3,
            "title": "麻将桌",
            "gradeLevel": null,
            "items": [
                {
                  "items": [{
                    "prefix": "1",
                    "content": "0",
                    "score": "0"
                }
            ],
                  }],
            "analyze": "UnLike",
            "correctArray": null,
            "correct": null,
@@ -820,13 +858,11 @@
            "subjectId": 3,
            "title": "麻将桌",
            "gradeLevel": null,
            "items": [
                {
                  "items": [{
                    "prefix": "1",
                    "content": "0",
                    "score": "0"
                }
            ],
                  }],
            "analyze": "NotSure",
            "correctArray": null,
            "correct": null,
@@ -851,13 +887,11 @@
            "subjectId": 3,
            "title": "麻将桌",
            "gradeLevel": null,
            "items": [
                {
                  "items": [{
                    "prefix": "1",
                    "content": "0",
                    "score": "0"
                }
            ],
                  }],
            "analyze": "Like",
            "correctArray": null,
            "correct": null,
@@ -882,13 +916,11 @@
            "subjectId": 3,
            "title": "麻将桌",
            "gradeLevel": null,
            "items": [
                {
                  "items": [{
                    "prefix": "1",
                    "content": "0",
                    "score": "0"
                }
            ],
                  }],
            "analyze": "UnLike",
            "correctArray": null,
            "correct": null,
@@ -913,13 +945,11 @@
            "subjectId": 1,
            "title": "麻将桌",
            "gradeLevel": null,
            "items": [
                {
                  "items": [{
                    "prefix": "1",
                    "content": "0",
                    "score": "0"
                }
            ],
                  }],
            "analyze": "NotSure",
            "correctArray": null,
            "correct": null,
@@ -944,13 +974,11 @@
            "subjectId": 1,
            "title": "麻将桌",
            "gradeLevel": null,
            "items": [
                {
                  "items": [{
                    "prefix": "1",
                    "content": "0",
                    "score": "0"
                }
            ],
                  }],
            "analyze": "Like",
            "correctArray": null,
            "correct": null,
@@ -975,13 +1003,11 @@
            "subjectId": 2,
            "title": "麻将桌",
            "gradeLevel": null,
            "items": [
                {
                  "items": [{
                    "prefix": "1",
                    "content": "0",
                    "score": "0"
                }
            ],
                  }],
            "analyze": "NotSure",
            "correctArray": null,
            "correct": null,
@@ -1006,13 +1032,11 @@
            "subjectId": 2,
            "title": "麻将桌",
            "gradeLevel": null,
            "items": [
                {
                  "items": [{
                    "prefix": "1",
                    "content": "0",
                    "score": "0"
                }
            ],
                  }],
            "analyze": "NotSure",
            "correctArray": null,
            "correct": null,
@@ -1065,10 +1089,12 @@
         }
        //设置每项step偏离最后step的正负距离值(奇数step正偏离,偶数step负偏离)
        if(_this.step2ScoreRanges[i]['step'] % 2 == 0){//偶数
          deviate = (max4O - _this.step2ScoreRanges[i]['step']) - (max4O - _this.step2ScoreRanges[i]['step'])/2
                  deviate = (max4O - _this.step2ScoreRanges[i]['step']) - (max4O - _this.step2ScoreRanges[i][
                     'step']) / 2
          _this.step2ScoreRanges[i]['deviate'] = 0 - deviate
        } else {
          deviate = (max4J - _this.step2ScoreRanges[i]['step']) - (max4J - _this.step2ScoreRanges[i]['step'])/2
                  deviate = (max4J - _this.step2ScoreRanges[i]['step']) - (max4J - _this.step2ScoreRanges[i][
                     'step']) / 2
          _this.step2ScoreRanges[i]['deviate'] = deviate
        }
        //设置每项已选择的数量
@@ -1118,7 +1144,11 @@
      this.questionItem = _this.form.titleItems[0].questionItems[num]
      _this.order = num
      setTimeout(function () {
        _this.$el.querySelector(selector).scrollIntoView({ behavior: 'instant', block: 'center', inline: 'nearest' })
               _this.$el.querySelector(selector).scrollIntoView({
                  behavior: 'instant',
                  block: 'center',
                  inline: 'nearest'
               })
      }, 200)
      _this.$refs['popovertag'].doClose()
    },
@@ -1130,13 +1160,29 @@
        let questionArray = titleItemArray[tIndex].questionItems
        for (let qIndex in questionArray) {
          let question = questionArray[qIndex]
          this.answer.answerItems.push({ title: question.title, permanentId: question.permanentId, questionId: question.id, content: question.content, contentArray: [], completed: false, itemOrder: question.itemOrder, lastContent: null, startTime: question.startTime, endTime: question.endTime, partOrder: question.partOrder, questionReport: {}, readOnly: false, imgUrl: question.imgUrl})
                  this.answer.answerItems.push({
                     title: question.title,
                     permanentId: question.permanentId,
                     questionId: question.id,
                     content: question.content,
                     contentArray: [],
                     completed: false,
                     itemOrder: question.itemOrder,
                     lastContent: null,
                     startTime: question.startTime,
                     endTime: question.endTime,
                     partOrder: question.partOrder,
                     questionReport: {},
                     readOnly: false,
                     imgUrl: question.imgUrl
                  })
        }
      }
      // 初始化开始时间,设置第一个时间
      for (let i = 0; i < this.answer.answerItems.length; i++) {
        if (this.answer.answerItems[i].startTime == null || this.answer.answerItems[i].startTime.trim() === '') {
               if (this.answer.answerItems[i].startTime == null || this.answer.answerItems[i].startTime.trim() ===
                  '') {
          this.answer.answerItems[i].startTime = this.formatDate(new Date(), 'yyyy-MM-dd hh:mm:ss')
          break
        }
@@ -1144,7 +1190,8 @@
    },
    isContentNotEmpty: function (num) {
      let _this = this
      return _this.answer.answerItems[num].content !== '' && _this.answer.answerItems[num].content !== null && _this.answer.answerItems[num].content.trim() !== ''
            return _this.answer.answerItems[num].content !== '' && _this.answer.answerItems[num].content !==
               null && _this.answer.answerItems[num].content.trim() !== ''
    },
    nextQuestion: function (nowPartOrder) {
      let _this = this
@@ -1181,7 +1228,8 @@
      // 本段的每一题都打完要指导语
      let showGuideFlag = true
      for (let i = 0; i < _this.answer.answerItems.length; i++) {
        if (_this.form.titleItems[0].questionItems[i].partOrder === nowPartOrder && !_this.isContentNotEmpty(i)) {
               if (_this.form.titleItems[0].questionItems[i].partOrder === nowPartOrder && !_this
                  .isContentNotEmpty(i)) {
          showGuideFlag = false
        }
      }
@@ -1207,76 +1255,6 @@
    isEmpty (obj) {
      return !this.isNotEmpty(obj)
    },
    nextSubject: function () {
      let _this = this
      _this.isShowGuide(false)
      let nowPartOrder = _this.partOrder
      // 设置上一题的结束时间
      this.answer.answerItems[_this.order].endTime = _this.formatDate(new Date(), 'yyyy-MM-dd hh:mm:ss')
      // 循环没有答的题目,这里同时决定了问答题打完可以进入下一题
      for (let i = 0; i < _this.order; i++) {
        if (!this.isContentNotEmpty(i)) {
          // 返回之前没做的那道题
          this.getEmptySubjct(i)
          return
        }
        // 如果循环到最后一题就提交
        if (_this.isForFinish(i)) {
          _this.submitForm()
          return
        }
      }
      // 全部答完了就可以提交了,但是如果是最后一题就自己提交
      for (let i = 0; i < _this.answer.answerItems.length; i++) {
        if (!_this.isContentNotEmpty(i)) {
          break
        }
        if (i === _this.answer.answerItems.length - 1 && _this.order !== _this.answer.answerItems.length - 1) {
          _this.submitForm()
          return
        }
      }
      this.answer.answerItems[_this.order].readOnly = true
      let answerSubmit = _this.getSubmitAnswerValue(nowPartOrder)
      // 已经答到了最后一题了,不用自动跳到下一题
      if (this.order + 1 > this.itemSize - 1) {
        this.submitDisable = false
        return
      }
      // 如果是最后一题就上面提交了,不会走到这里
      let loading = null
      if (this.isNextShowGuide(nowPartOrder)) {
        this.catThaiSubmit(answerSubmit)
        loading = _this.$loading({
          lock: false,
          text: _this.$t('nextPartInfo'),
          spinner: 'el-icon-loading'
        })
      }
      examPaperAnswerApi.answerSubmit(answerSubmit, _this.memberToken).then(re => {
        if (_this.isNotEmpty(loading)) {
          loading.close()
        }
        if (re.code !== 1) {
          _this.$message.error(re.message)
          throw (re.message)
        }
        // 展示指导语
        if (this.isNextShowGuide(nowPartOrder)) {
          // 展示指导语
          _this.showNextGuide(re.response.signalObject, true)
        } else {
          this.nextQuestionOrder(nowPartOrder)
        }
      }).catch(e => {
        if (_this.isNotEmpty(loading)) {
          loading.close()
        }
        _this.reloadPage(e)
      })
    },
    getSubmitAnswerValue (nowPartOrder) {
      let _this = this
      let answerSubmit = JSON.parse(JSON.stringify(_this.answer))
@@ -1297,7 +1275,8 @@
               langType: _this.langType, 
               partOrder: answerItem.partOrder, 
               imgUrl: answerItem.imgUrl,
               answer: answerItem.content }
                  answer: answerItem.content
               }
      })
      answerSubmit.langType = _this.langType
      answerSubmit.isCallTain = _this.isCallTain
@@ -1334,19 +1313,7 @@
         }
      return answerSubmit
    },
    preSubject () {
      let _this = this
      _this.isShowGuide(false)
      if (_this.order > 0) {
        let num = --_this.order
        _this.itemOrder = _this.form.titleItems[0].questionItems[num].itemOrder
        _this.questionItem = _this.form.titleItems[0].questionItems[num]
        _this.partOrder = _this.questionItem.partOrder
        _this.preDisable = false
        _this.nextDisable = true
        _this.answer.answerItems[_this.order].readOnly = false
      }
    },
    submitSubAnswer: function () {
      let _this = this
      this.answer.answerItems[_this.order].endTime = this.formatDate(new Date(), 'yyyy-MM-dd hh:mm:ss')
@@ -1381,7 +1348,14 @@
      examPaperAnswerApi.answerSubmit(answerSubmit, _this.memberToken).then(re => {
        loading.close()
        if (re.code === 1) {
          _this.$router.push({ path: '/exam/finish', query: { name: _this.form.name, content: mess, tokenId: _this.memberToken } })
                  _this.$router.push({
                     path: '/exam/finish',
                     query: {
                        name: _this.form.name,
                        content: mess,
                        tokenId: _this.memberToken
                     }
                  })
        } else {
          _this.$message.error(re.message + '/exam/finish')
        }
@@ -1394,7 +1368,8 @@
    showNextGuide: function (signalObject, nextQuestion) {
      let _this = this
      _this.guideDescirption = signalObject.signalDescription
      if (_this.guideDescirption !== null && _this.guideDescirption !== undefined && _this.guideDescirption !== '') {
            if (_this.guideDescirption !== null && _this.guideDescirption !== undefined && _this
               .guideDescirption !== '') {
        _this.isShowGuide(true)
        _this.preDisable = false
      } else {
@@ -1428,16 +1403,24 @@
      }
      // 调试用
      // _this.$router.push({ path: '/exam/exception', query: { name: _this.form.name, content: _this.$t('submitExceptionInfo') + '<br>' + mes } })
      _this.$router.push({ path: '/exam/exception', query: { name: _this.form.name, content: _this.$t('submitExceptionInfo') } })
            _this.$router.push({
               path: '/exam/exception',
               query: {
                  name: _this.form.name,
                  content: _this.$t('submitExceptionInfo')
               }
            })
      _this.formLoading = false
      _this.submitDisable = false
    },
    isForFinish (i) {
      return i === this.answer.answerItems.length - 1 && (this.answer.answerItems[i].content !== null && this.answer.answerItems[i].content !== '')
            return i === this.answer.answerItems.length - 1 && (this.answer.answerItems[i].content !== null && this
               .answer.answerItems[i].content !== '')
    },
    isDiffPartOrder: function () {
      let _this = this
      return _this.form.titleItems[0].questionItems[_this.order].partOrder !== _this.form.titleItems[0].questionItems[_this.order - 1].partOrder
            return _this.form.titleItems[0].questionItems[_this.order].partOrder !== _this.form.titleItems[0]
               .questionItems[_this.order - 1].partOrder
    },
    ...mapMutations('user', ['setMemberTocken']),
    ...mapMutations('user', ['setLangType']),
@@ -1445,11 +1428,21 @@
  },
  computed: {
    ...mapGetters('enumItem', ['enumFormat']),
    ...mapState('enumItem', { doCompletedTag: state => state.exam.question.answer.doCompletedTag }),
    ...mapState('user', { memberToken: state => state.memberToken }),
    ...mapState('user', { langType: state => state.langType }),
    ...mapState('user', { langFlag: state => state.langFlag }),
    ...mapState('exam', { doUrl: state => state.doUrl })
         ...mapState('enumItem', {
            doCompletedTag: state => state.exam.question.answer.doCompletedTag
         }),
         ...mapState('user', {
            memberToken: state => state.memberToken
         }),
         ...mapState('user', {
            langType: state => state.langType
         }),
         ...mapState('user', {
            langFlag: state => state.langFlag
         }),
         ...mapState('exam', {
            doUrl: state => state.doUrl
         })
  }
}
</script>
@@ -1458,36 +1451,19 @@
   .app-item-contain{
         margin-top: 45px;
   }
  .align-center {
    text-align: center;
  }
  .exam-question-item {
    padding: 10px;
    font-size: large;
    .el-form-item__label {
      font-size: large !important;
    }
  }
  .question-title-padding {
    padding-left: 25px;
    padding-right: 25px;
  }
  .footer {
    position: absolute;
    position: fixed;
    z-index: 1000;
    bottom: 0px;
  }
</style>
<style lang="scss" scpoed>
   .mul-inlinediv-box{
      overflow: auto;
      display: block;
      -webkit-box-flex: 1;
   }
  .mul-inlinediv {
    overflow-y: hidden;
    overflow-x: auto;
@@ -1496,20 +1472,24 @@
    padding: 10px 0;
    width: fit-content;
  }
  .mul-inlinediv div div{
    display: inline-table;
    vertical-align: top;
    width: 180px;
    margin: 0 2px;
  }
  .mul-inlinediv-row{
    min-height: 210px;
    margin: 0 10px;
  }
  .mul-inlinediv-lineheight{
    line-height: 210px;
    padding: 10px 0;
  }
  .inlinediv {
    overflow-y: hidden;
    overflow-x: auto;
@@ -1517,39 +1497,42 @@
    min-height: 180px;
    display: flex;
  }
  .inlinediv div{
    display: inline-table;
    vertical-align: top;
    width: 100px;
    margin: auto 2px;
  }
  .mullinediv{
    display: contents;
  }
  .mullinediv-item{
    display: flex;display:
      display: flex;
      display:
    inline-block;
    width: 180px;
    margin: 5px 4px;
  }
  .mullinediv-item:hover {
  }
   .mullinediv-item:hover {}
  img:hover {
     transform: scale(2);
    // -ms-transform: scale(2);
    // -webkit-transform: scale(2);
    // -o-transform: scale(2);
    // -moz-transform: scale(2);
      -ms-transform: scale(2);
      -webkit-transform: scale(2);
      -o-transform: scale(2);
      -moz-transform: scale(2);
    transition-duration: 0.5s;
  }
   .container {
     padding: 32px 20px;
     .configuration {
       width: 600px;
     }
   }
   .bg-purple {
       background: #d3dce6;
     }
</style>