365 lines
		
	
	
		
			12 KiB
		
	
	
	
		
			Plaintext
		
	
	
			
		
		
	
	
			365 lines
		
	
	
		
			12 KiB
		
	
	
	
		
			Plaintext
		
	
	
<template>
 | 
						|
  <div v-loading="loading" style="min-height: 500px;">
 | 
						|
    <el-form
 | 
						|
      v-if="isRender"
 | 
						|
      ref="questions"
 | 
						|
      size="small"
 | 
						|
      :model="questionForm"
 | 
						|
    >
 | 
						|
<!--      <template v-if="formType===2">-->
 | 
						|
<!--        <el-tabs v-model="activeName">-->
 | 
						|
<!--          <el-tab-pane-->
 | 
						|
<!--            v-for="q of questions"-->
 | 
						|
<!--            :key="q.PageName"-->
 | 
						|
<!--            :label="q.PageName"-->
 | 
						|
<!--            :name="q.PageName"-->
 | 
						|
<!--          >-->
 | 
						|
<!--            <div v-if="q.Childrens.length>0" :class="{'tabContent':publicQuestions.length>0}">-->
 | 
						|
<!--              <FormItem-->
 | 
						|
<!--                v-for="question of q.Childrens"-->
 | 
						|
<!--                :key="question.Id"-->
 | 
						|
<!--                :question="question"-->
 | 
						|
<!--                :question-form="questionForm"-->
 | 
						|
<!--                :reading-task-state="readingTaskState"-->
 | 
						|
<!--                :criterion-id="criterionId"-->
 | 
						|
<!--                @resetFormItemData="resetFormItemData"-->
 | 
						|
<!--                @setFormItemData="setFormItemData"-->
 | 
						|
<!--              />-->
 | 
						|
<!--            </div>-->
 | 
						|
<!--          </el-tab-pane>-->
 | 
						|
<!--        </el-tabs>-->
 | 
						|
<!--        <el-divider v-if="publicQuestions.length>0" content-position="left">-->
 | 
						|
<!--          <!– 公共分页 –>-->
 | 
						|
<!--        </el-divider>-->
 | 
						|
<!--        <div v-for="q of publicQuestions" :key="q.PageName">-->
 | 
						|
<!--          <h4>{{ q.PageName }}</h4>-->
 | 
						|
<!--          <template v-if="q.Childrens.length>0">-->
 | 
						|
<!--            <FormItem-->
 | 
						|
<!--              v-for="question of q.Childrens"-->
 | 
						|
<!--              :key="question.Id"-->
 | 
						|
<!--              :question="question"-->
 | 
						|
<!--              :question-form="questionForm"-->
 | 
						|
<!--              :reading-task-state="readingTaskState"-->
 | 
						|
<!--              :criterion-id="criterionId"-->
 | 
						|
<!--              @resetFormItemData="resetFormItemData"-->
 | 
						|
<!--              @setFormItemData="setFormItemData"-->
 | 
						|
<!--            />-->
 | 
						|
<!--          </template>-->
 | 
						|
<!--        </div>-->
 | 
						|
<!--      </template>-->
 | 
						|
      <template>
 | 
						|
        <QuestionFormItem
 | 
						|
          v-for="question of questions"
 | 
						|
          :key="question.Id"
 | 
						|
          :question="question"
 | 
						|
          :question-form="questionForm"
 | 
						|
          :reading-task-state="readingTaskState"
 | 
						|
          :criterion-id="criterionId"
 | 
						|
          @formItemNumberChange="formItemNumberChange"
 | 
						|
          @resetFormItemData="resetFormItemData"
 | 
						|
          @setFormItemData="setFormItemData"
 | 
						|
        />
 | 
						|
      </template>
 | 
						|
    </el-form>
 | 
						|
  </div>
 | 
						|
 | 
						|
</template>
 | 
						|
 | 
						|
<script>
 | 
						|
 | 
						|
import { getTrialReadingQuestion, getCustomQuestionPreview, getCustomTableQuestionPreview, getQuestionCalculateRelation } from '@/api/trials'
 | 
						|
import QuestionFormItem from './QuestionFormItem'
 | 
						|
export default {
 | 
						|
  name: 'QuestionsPreview',
 | 
						|
  components: {
 | 
						|
    QuestionFormItem
 | 
						|
  },
 | 
						|
  props: {
 | 
						|
    criterionId: {
 | 
						|
      type: String,
 | 
						|
      required: true
 | 
						|
    },
 | 
						|
    formType: {
 | 
						|
      type: Number,
 | 
						|
      required: true
 | 
						|
    }
 | 
						|
  },
 | 
						|
  data() {
 | 
						|
    return {
 | 
						|
      loading: false,
 | 
						|
      questions: [],
 | 
						|
      questionForm: {},
 | 
						|
      publicQuestions: [],
 | 
						|
      isRender: false,
 | 
						|
      readingTaskState: 0,
 | 
						|
      activeName: 0
 | 
						|
    }
 | 
						|
  },
 | 
						|
  mounted() {
 | 
						|
    this.getQuestionCalculateRelation()
 | 
						|
    this.getCustomTableQuestionPreview()
 | 
						|
  },
 | 
						|
  methods: {
 | 
						|
    getQuestionCalculateRelation() {
 | 
						|
      getQuestionCalculateRelation({
 | 
						|
        TrialReadingCriterionId: this.criterionId
 | 
						|
      }).then(res => {
 | 
						|
      })
 | 
						|
    },
 | 
						|
    formItemNumberChange() {
 | 
						|
      try {
 | 
						|
        this.questions.forEach(v => {
 | 
						|
          if (v.Type === 'number' && v.DataSource === 1) {
 | 
						|
            var CalculateQuestions = JSON.parse(v.CalculateQuestions)
 | 
						|
            var num = 0
 | 
						|
            CalculateQuestions.forEach((o, i) => {
 | 
						|
              if (i === 0) {
 | 
						|
                if (v.CustomCalculateMark > 4) {
 | 
						|
                  switch (v.CustomCalculateMark) {
 | 
						|
                    case 5:
 | 
						|
                      this.questionForm[o.QuestionId].forEach((q, qi) => {
 | 
						|
                        if (qi === 0) {
 | 
						|
                          num = parseFloat(q[o.TableQuestionId])
 | 
						|
                        } else {
 | 
						|
                          num *= parseFloat(q[o.TableQuestionId])
 | 
						|
                        }
 | 
						|
                      })
 | 
						|
                      break;
 | 
						|
                    case 6:
 | 
						|
                      this.questionForm[o.QuestionId].forEach((q, qi) => {
 | 
						|
                        if (qi === 0) {
 | 
						|
                          num = parseFloat(q[o.TableQuestionId])
 | 
						|
                        } else {
 | 
						|
                          num += parseFloat(q[o.TableQuestionId])
 | 
						|
                        }
 | 
						|
                      })
 | 
						|
                      break;
 | 
						|
                    case 7:
 | 
						|
                      this.questionForm[o.QuestionId].forEach((q, qi) => {
 | 
						|
                        if (qi === 0) {
 | 
						|
                          num = parseFloat(q[o.TableQuestionId])
 | 
						|
                        } else {
 | 
						|
                          num += parseFloat(q[o.TableQuestionId])
 | 
						|
                        }
 | 
						|
                      })
 | 
						|
                      num = num / this.questionForm[o.QuestionId].length
 | 
						|
                      break;
 | 
						|
                    case 8:
 | 
						|
                      break;
 | 
						|
                    case 9:
 | 
						|
                      break;
 | 
						|
                  }
 | 
						|
                } else {
 | 
						|
                  num = this.questionForm[o.TableQuestionId]
 | 
						|
                }
 | 
						|
              } else {
 | 
						|
                switch (v.CustomCalculateMark) {
 | 
						|
                  case 1:
 | 
						|
                    num += this.questionForm[o.TableQuestionId]
 | 
						|
                    break;
 | 
						|
                  case 2:
 | 
						|
                    num -= this.questionForm[o.TableQuestionId]
 | 
						|
                    break;
 | 
						|
                  case 3:
 | 
						|
                    num *= this.questionForm[o.TableQuestionId]
 | 
						|
                    break;
 | 
						|
                  case 4:
 | 
						|
                    num /= this.questionForm[o.TableQuestionId]
 | 
						|
                    break;
 | 
						|
                }
 | 
						|
              }
 | 
						|
            })
 | 
						|
            this.$set(this.questionForm, v.Id, num)
 | 
						|
          } else if (v.Type === 'table') {
 | 
						|
 | 
						|
          }
 | 
						|
          if (v.Childrens.length > 0) {
 | 
						|
            this.setChangeChild(v.Childrens)
 | 
						|
          }
 | 
						|
        })
 | 
						|
      } catch (e) {
 | 
						|
      }
 | 
						|
    },
 | 
						|
    setChangeChild(obj) {
 | 
						|
      obj.forEach(v => {
 | 
						|
        if (v.Type === 'number' && v.DataSource === 1) {
 | 
						|
          var CalculateQuestions = JSON.parse(v.CalculateQuestions)
 | 
						|
          var num = 0
 | 
						|
          CalculateQuestions.forEach((o, i) => {
 | 
						|
            if (i === 0) {
 | 
						|
              if (v.CustomCalculateMark > 4) {
 | 
						|
                switch (v.CustomCalculateMark) {
 | 
						|
                  case 5:
 | 
						|
                    this.questionForm[o.QuestionId].forEach((q, qi) => {
 | 
						|
                      if (qi === 0) {
 | 
						|
                        num = parseFloat(q[o.TableQuestionId])
 | 
						|
                      } else {
 | 
						|
                        num *= parseFloat(q[o.TableQuestionId])
 | 
						|
                      }
 | 
						|
                    })
 | 
						|
                    break;
 | 
						|
                  case 6:
 | 
						|
                    this.questionForm[o.QuestionId].forEach((q, qi) => {
 | 
						|
                      if (qi === 0) {
 | 
						|
                        num = parseFloat(q[o.TableQuestionId])
 | 
						|
                      } else {
 | 
						|
                        num += parseFloat(q[o.TableQuestionId])
 | 
						|
                      }
 | 
						|
                    })
 | 
						|
                    break;
 | 
						|
                  case 7:
 | 
						|
                    this.questionForm[o.QuestionId].forEach((q, qi) => {
 | 
						|
                      if (qi === 0) {
 | 
						|
                        num = parseFloat(q[o.TableQuestionId])
 | 
						|
                      } else {
 | 
						|
                        num += parseFloat(q[o.TableQuestionId])
 | 
						|
                      }
 | 
						|
                    })
 | 
						|
                    num = num / this.questionForm[o.QuestionId].length
 | 
						|
                    break;
 | 
						|
                  case 8:
 | 
						|
                    break;
 | 
						|
                  case 9:
 | 
						|
                    break;
 | 
						|
                }
 | 
						|
              } else {
 | 
						|
                num = this.questionForm[o.TableQuestionId]
 | 
						|
              }
 | 
						|
            } else {
 | 
						|
              switch (v.CustomCalculateMark) {
 | 
						|
                case 1:
 | 
						|
                  num += this.questionForm[o.TableQuestionId]
 | 
						|
                  break;
 | 
						|
                case 2:
 | 
						|
                  num -= this.questionForm[o.TableQuestionId]
 | 
						|
                  break;
 | 
						|
                case 3:
 | 
						|
                  num *= this.questionForm[o.TableQuestionId]
 | 
						|
                  break;
 | 
						|
                case 4:
 | 
						|
                  num /= this.questionForm[o.TableQuestionId]
 | 
						|
                  break;
 | 
						|
              }
 | 
						|
            }
 | 
						|
          })
 | 
						|
          this.$set(this.questionForm, v.Id, num)
 | 
						|
        } else if (v.Type === 'table') {
 | 
						|
 | 
						|
        }
 | 
						|
        if (v.Childrens.length > 0) {
 | 
						|
          this.setChangeChild(v.Childrens)
 | 
						|
        }
 | 
						|
      })
 | 
						|
    },
 | 
						|
    getCustomTableQuestionPreview() {
 | 
						|
      this.loading = true
 | 
						|
      getCustomTableQuestionPreview({
 | 
						|
        TrialReadingCriterionId: this.criterionId
 | 
						|
      }).then(res => {
 | 
						|
        res.Result.SinglePage.map((v) => {
 | 
						|
          if (v.Type === 'group' && v.Childrens.length === 0) return
 | 
						|
          if (!v.IsPage && v.Type !== 'group' && v.Type !== 'summary' && v.Type !== 'table') {
 | 
						|
            this.$set(this.questionForm, v.Id, v.Answer)
 | 
						|
          }
 | 
						|
          if (v.Type === 'table') {
 | 
						|
            this.$set(this.questionForm, v.Id, v.TableQuestions.Answers)
 | 
						|
          }
 | 
						|
          if (v.Childrens.length > 0) {
 | 
						|
            this.setChild(v.Childrens)
 | 
						|
          }
 | 
						|
        })
 | 
						|
        this.questions = res.Result.SinglePage
 | 
						|
        this.isRender = true
 | 
						|
        this.loading = false
 | 
						|
      })
 | 
						|
    },
 | 
						|
    getQuestions() {
 | 
						|
      this.loading = true
 | 
						|
      var param = {
 | 
						|
        readingQuestionCriterionTrialId: this.criterionId,
 | 
						|
        formType: this.formType
 | 
						|
      }
 | 
						|
      getTrialReadingQuestion(param).then(res => {
 | 
						|
        if (res.OtherInfo.FormType === 2) {
 | 
						|
          if (res.Result.MultiPage.length > 0) {
 | 
						|
            res.Result.MultiPage.map((v) => {
 | 
						|
              if (v.Type === 'group' && v.Childrens.length === 0 && i.Type !== 'table') return
 | 
						|
              if (!v.IsPage && v.Type !== 'group' && v.Type !== 'summary' && i.Type !== 'table') {
 | 
						|
                this.$set(this.questionForm, v.Id, '')
 | 
						|
              }
 | 
						|
              if (v.Childrens.length > 0) {
 | 
						|
                this.setChild(v.Childrens)
 | 
						|
              }
 | 
						|
            })
 | 
						|
            this.questions = res.Result.MultiPage
 | 
						|
            this.activeName = res.Result.MultiPage[0].PageName
 | 
						|
          }
 | 
						|
          if (res.Result.PublicPage.length > 0) {
 | 
						|
            res.Result.PublicPage.map((v) => {
 | 
						|
              if (v.Type === 'group' && v.Childrens.length === 0 && i.Type !== 'table') return
 | 
						|
              if (!v.IsPage && v.Type !== 'group' && v.Type !== 'summary' && i.Type !== 'table') {
 | 
						|
                this.$set(this.questionForm, v.Id, '')
 | 
						|
              }
 | 
						|
              if (v.Childrens.length > 0) {
 | 
						|
                this.setChild(v.Childrens)
 | 
						|
              }
 | 
						|
            })
 | 
						|
            this.publicQuestions = res.Result.PublicPage
 | 
						|
          }
 | 
						|
        } else {
 | 
						|
          res.Result.SinglePage.map((v) => {
 | 
						|
            if (v.Type === 'group' && v.Childrens.length === 0 && i.Type !== 'table') return
 | 
						|
            if (!v.IsPage && v.Type !== 'group' && v.Type !== 'summary' && i.Type !== 'table' && i.Type !== 'number') {
 | 
						|
              this.$set(this.questionForm, v.Id, '')
 | 
						|
            }
 | 
						|
            if (i.Type === 'table') {
 | 
						|
              this.$set(this.questionForm, v.Id, [])
 | 
						|
            }
 | 
						|
            if (i.Type === 'number') {
 | 
						|
              this.$set(this.questionForm, v.Id, '0')
 | 
						|
            }
 | 
						|
            if (v.Childrens.length > 0) {
 | 
						|
              this.setChild(v.Childrens)
 | 
						|
            }
 | 
						|
          })
 | 
						|
          this.questions = res.Result.SinglePage
 | 
						|
        }
 | 
						|
        this.isRender = true
 | 
						|
        this.loading = false
 | 
						|
      }).catch(() => { this.loading = false })
 | 
						|
    },
 | 
						|
    setChild(obj) {
 | 
						|
      obj.forEach(i => {
 | 
						|
        if (i.Type !== 'group' && i.Type !== 'summary' && i.Id && i.Type !== 'table') {
 | 
						|
          this.$set(this.questionForm, i.Id, '')
 | 
						|
        }
 | 
						|
        if (i.Childrens && i.Childrens.length > 0) {
 | 
						|
          this.setChild(i.Childrens)
 | 
						|
        }
 | 
						|
      })
 | 
						|
    },
 | 
						|
    resetFormItemData(v) {
 | 
						|
      this.questionForm[v] = ''
 | 
						|
    },
 | 
						|
    setFormItemData(obj) {
 | 
						|
      this.$set(this.questionForm, obj.key, JSON.parse(JSON.stringify(obj.val)))
 | 
						|
    }
 | 
						|
  }
 | 
						|
}
 | 
						|
</script>
 | 
						|
<style lang="scss" scoped>
 | 
						|
::-webkit-scrollbar {
 | 
						|
    width: 7px;
 | 
						|
    height: 7px;
 | 
						|
  }
 | 
						|
  ::-webkit-scrollbar-thumb {
 | 
						|
    border-radius: 10px;
 | 
						|
    background: #d0d0d0;
 | 
						|
  }
 | 
						|
.tabContent{
 | 
						|
  height:300px;
 | 
						|
  overflow-y: auto;
 | 
						|
 | 
						|
}
 | 
						|
</style>
 |