421 lines
		
	
	
		
			14 KiB
		
	
	
	
		
			Plaintext
		
	
	
			
		
		
	
	
			421 lines
		
	
	
		
			14 KiB
		
	
	
	
		
			Plaintext
		
	
	
<template>
 | 
						||
  <el-form
 | 
						||
    ref="measurementForm"
 | 
						||
    v-loading="loading"
 | 
						||
    :model="questionForm"
 | 
						||
    size="mini"
 | 
						||
    class="measurement-form"
 | 
						||
  >
 | 
						||
    <div class="base-dialog-body">
 | 
						||
      <el-form-item
 | 
						||
        v-for="qs in questions"
 | 
						||
        v-show="qs.ShowQuestion!==2"
 | 
						||
        :key="qs.Id"
 | 
						||
        :label="`${qs.QuestionName}`"
 | 
						||
        :prop="qs.Id"
 | 
						||
        :rules="[
 | 
						||
          { required: (qs.IsRequired === 0 || (qs.IsRequired ===1 && qs.RelevanceId && (questionForm[qs.RelevanceId] === qs.RelevanceValue))) && qs.Type!=='group' && qs.Type!=='summary',
 | 
						||
            message: '请注明', trigger: ['blur']},
 | 
						||
        ]"
 | 
						||
      >
 | 
						||
        <!-- 输入框 -->
 | 
						||
        <template v-if="qs.Type==='input'">
 | 
						||
          <el-input
 | 
						||
            v-if="qs.Type==='input'"
 | 
						||
            v-model="questionForm[qs.Id]"
 | 
						||
            :disabled="qs.TableQuestionType===2 || !isCurrentTask || qs.QuestionMark===0 || qs.QuestionMark===1 || qs.QuestionMark===4 || readingTaskState>=2 "
 | 
						||
          >
 | 
						||
            <template v-if="qs.QuestionMark===0 || qs.QuestionMark===1" slot="append">mm</template>
 | 
						||
          </el-input>
 | 
						||
        </template>
 | 
						||
        <!-- <template v-if="qs.Type==='input' && qs.QuestionMark===0">
 | 
						||
          <el-col :span="16">
 | 
						||
            <el-input
 | 
						||
              v-if="qs.Type==='input'"
 | 
						||
              v-model="questionForm[qs.Id]"
 | 
						||
              :disabled="qs.TableQuestionType===2 || !isCurrentTask"
 | 
						||
            />
 | 
						||
          </el-col>
 | 
						||
          <el-col :span="8" style="padding:0 5px">
 | 
						||
            <el-button
 | 
						||
              v-if="qs.QuestionMark === 0 && qs.MeasuredData=== '' && isCurrentTask"
 | 
						||
              type="text"
 | 
						||
              size="mini"
 | 
						||
              @click="activeTool"
 | 
						||
            >开始测量</el-button>
 | 
						||
          </el-col>
 | 
						||
        </template> -->
 | 
						||
        <!-- 多行文本输入框 -->
 | 
						||
        <el-input
 | 
						||
          v-if="qs.Type==='textarea'"
 | 
						||
          v-model="questionForm[qs.Id]"
 | 
						||
          type="textarea"
 | 
						||
          :autosize="{ minRows: 2, maxRows: 4}"
 | 
						||
          :disabled="!isCurrentTask || readingTaskState>=2"
 | 
						||
        />
 | 
						||
        <!-- 下拉框 -->
 | 
						||
        <el-select
 | 
						||
          v-if="qs.Type==='select'"
 | 
						||
          v-model="questionForm[qs.Id]"
 | 
						||
          clearable
 | 
						||
          :disabled="!isCurrentTask || readingTaskState>=2 || (!isBaseLineTask && qs.QuestionMark === 5 && (lesionType !== 2 || (lesionType === 2 && questionForm.IsCurrentTaskAdd === 'False')))"
 | 
						||
          @change="((val)=>{formItemChange(val, qs)})"
 | 
						||
        >
 | 
						||
          <template v-if="qs.TableQuestionType === 1">
 | 
						||
            <el-option
 | 
						||
              v-for="item in organList"
 | 
						||
              :key="item.Id"
 | 
						||
              :label="item[qs.DataTableColumn]"
 | 
						||
              :value="item[qs.DataTableColumn]"
 | 
						||
            />
 | 
						||
          </template>
 | 
						||
          <template v-else>
 | 
						||
            <el-option
 | 
						||
              v-for="val in qs.TypeValue.split('|')"
 | 
						||
              :key="val"
 | 
						||
              :label="val"
 | 
						||
              :value="val"
 | 
						||
            />
 | 
						||
          </template>
 | 
						||
 | 
						||
        </el-select>
 | 
						||
        <!-- 单选 -->
 | 
						||
        <el-radio-group
 | 
						||
          v-if="qs.Type==='radio'"
 | 
						||
          v-model="questionForm[qs.id]"
 | 
						||
          :disabled="!isCurrentTask || readingTaskState>=2"
 | 
						||
        >
 | 
						||
          <el-radio
 | 
						||
            v-for="val in qs.options.split('|')"
 | 
						||
            :key="val"
 | 
						||
            :label="val"
 | 
						||
          >
 | 
						||
            {{ val }}
 | 
						||
          </el-radio>
 | 
						||
        </el-radio-group>
 | 
						||
      </el-form-item>
 | 
						||
 | 
						||
    </div>
 | 
						||
    <div
 | 
						||
      v-if="isCurrentTask && readingTaskState<2"
 | 
						||
      class="base-dialog-footer"
 | 
						||
      style="text-align:right;margin-top:10px;"
 | 
						||
    >
 | 
						||
      <el-form-item>
 | 
						||
        <!-- 删除 -->
 | 
						||
        <el-button
 | 
						||
          v-if="questionForm.IsCurrentTaskAdd !== 'False'"
 | 
						||
          size="mini"
 | 
						||
          @click="handleDelete"
 | 
						||
        >
 | 
						||
          删除
 | 
						||
        </el-button>
 | 
						||
        <!-- 保存 -->
 | 
						||
        <el-button
 | 
						||
          size="mini"
 | 
						||
          @click="handleSave"
 | 
						||
        >
 | 
						||
          {{ $t('common:button:save') }}
 | 
						||
        </el-button>
 | 
						||
      </el-form-item>
 | 
						||
    </div>
 | 
						||
  </el-form>
 | 
						||
</template>
 | 
						||
<script>
 | 
						||
import { getTrialOrganList, submitTableQuestion, deleteReadingRowAnswer } from '@/api/trials'
 | 
						||
import Store from './Store'
 | 
						||
export default {
 | 
						||
  name: 'MeasurementForm',
 | 
						||
  props: {
 | 
						||
    questions: {
 | 
						||
      type: Array,
 | 
						||
      default() { return [] }
 | 
						||
    },
 | 
						||
    answers: {
 | 
						||
      type: Object,
 | 
						||
      default() { return {} }
 | 
						||
    },
 | 
						||
    lesionType: {
 | 
						||
      type: Number,
 | 
						||
      required: true
 | 
						||
    },
 | 
						||
    visitTaskId: {
 | 
						||
      type: String,
 | 
						||
      required: true
 | 
						||
    },
 | 
						||
    parentQsId: {
 | 
						||
      type: String,
 | 
						||
      required: true
 | 
						||
    },
 | 
						||
    isCurrentTask: {
 | 
						||
      type: Boolean,
 | 
						||
      required: true
 | 
						||
    },
 | 
						||
    readingTaskState: {
 | 
						||
      type: Number,
 | 
						||
      required: true
 | 
						||
    },
 | 
						||
    isBaseLineTask: {
 | 
						||
      type: Boolean,
 | 
						||
      required: true
 | 
						||
    },
 | 
						||
    orderMark: {
 | 
						||
      type: String,
 | 
						||
      default: ''
 | 
						||
    }
 | 
						||
  },
 | 
						||
  data() {
 | 
						||
    return {
 | 
						||
      questionForm: {},
 | 
						||
      loading: false,
 | 
						||
      trialId: '',
 | 
						||
      organList: [],
 | 
						||
      lesionNameId: '',
 | 
						||
      lesionOrganId: '',
 | 
						||
      lesionLocId: '',
 | 
						||
      originalQuestionForm: {}
 | 
						||
    }
 | 
						||
  },
 | 
						||
 | 
						||
  mounted() {
 | 
						||
    this.trialId = this.$route.query.trialId
 | 
						||
    this.initForm()
 | 
						||
    this.getOrganInfoList()
 | 
						||
  },
 | 
						||
  methods: {
 | 
						||
    initForm() {
 | 
						||
      for (const k in this.answers) {
 | 
						||
        // if (k === 'isSave') continue
 | 
						||
        if (k === 'MeasureData' && this.answers[k]) {
 | 
						||
          this.$set(this.questionForm, k, this.answers[k] ? JSON.parse(this.answers[k]) : null)
 | 
						||
        } else {
 | 
						||
          this.$set(this.questionForm, k, this.answers[k])
 | 
						||
        }
 | 
						||
      }
 | 
						||
      this.lesionNameId = this.getQuestionId(4)
 | 
						||
      this.lesionOrganId = this.getQuestionId(5)
 | 
						||
      this.lesionLocId = this.getQuestionId(6)
 | 
						||
      this.originalQuestionForm = { ...this.questionForm }
 | 
						||
    },
 | 
						||
    getQuestionId(questionMark) {
 | 
						||
      var idx = this.questions.findIndex(i => i.QuestionMark === questionMark)
 | 
						||
      if (idx > -1) {
 | 
						||
        return this.questions[idx].Id
 | 
						||
      } else {
 | 
						||
        return ''
 | 
						||
      }
 | 
						||
    },
 | 
						||
    handleLocation() {
 | 
						||
      Store.$emit('imageLocation', this.questionForm)
 | 
						||
    },
 | 
						||
    getOrganInfoList() {
 | 
						||
      var param = {
 | 
						||
        trialId: this.trialId,
 | 
						||
        lesionType: this.lesionType,
 | 
						||
        isEnable: true
 | 
						||
      }
 | 
						||
      getTrialOrganList(param).then(res => {
 | 
						||
        this.organList = res.Result
 | 
						||
      })
 | 
						||
    },
 | 
						||
    formItemChange(v, question) {
 | 
						||
      this.$emit('determineExistsUnsavedLession', val => {
 | 
						||
        if (val) {
 | 
						||
          if (question.TableQuestionType === 1 && question.RelationQuestions.length > 0) {
 | 
						||
            // 当选择器官时,联动位置、是否淋巴结问题答案
 | 
						||
            var index = this.organList.findIndex(item => item[question.DataTableColumn] === v)
 | 
						||
            if (index < 0) return
 | 
						||
            var selected = this.organList[index]
 | 
						||
            question.RelationQuestions.map(qs => {
 | 
						||
              var val = selected[qs.DataTableColumn]
 | 
						||
              if (typeof val === 'boolean') {
 | 
						||
                val = this.$fd('YesOrNo', val)
 | 
						||
              }
 | 
						||
              this.$set(this.questionForm, qs.Id, val)
 | 
						||
            })
 | 
						||
          }
 | 
						||
          if (question.Id === this.lesionOrganId || question.Id === this.lesionLocId) {
 | 
						||
            // 设置病灶名称
 | 
						||
            this.$set(this.questionForm, this.lesionNameId, `${this.questionForm[this.lesionOrganId]} ${this.questionForm[this.lesionLocId]}`)
 | 
						||
          }
 | 
						||
 | 
						||
          this.$set(this.questionForm, 'isSave', false)
 | 
						||
        } else {
 | 
						||
          this.$set(this.questionForm, question.Id, this.originalQuestionForm[question.Id])
 | 
						||
        }
 | 
						||
      })
 | 
						||
    },
 | 
						||
    setMeasureData(measureData) {
 | 
						||
      setTimeout(() => {
 | 
						||
        // 获取长径(0)
 | 
						||
 | 
						||
        if (measureData.type === 'Length' || measureData.type === 'Bidirectional') {
 | 
						||
          var lengthObj = this.questions.find(i => i.QuestionMark === 0)
 | 
						||
          var length = ''
 | 
						||
          if (measureData.type === 'Length') {
 | 
						||
            length = measureData.data.length ? measureData.data.length.toFixed(2) : ''
 | 
						||
          } else if (measureData.type === 'Bidirectional') {
 | 
						||
            length = measureData.data.longestDiameter
 | 
						||
          }
 | 
						||
          this.$set(this.questionForm, lengthObj.Id, length)
 | 
						||
          // 获取短径(1)
 | 
						||
          var shortObj = this.questions.find(i => i.QuestionMark === 1)
 | 
						||
          var short = ''
 | 
						||
          if (measureData.type === 'Bidirectional') {
 | 
						||
            short = measureData.data.shortestDiameter
 | 
						||
          }
 | 
						||
          this.$set(this.questionForm, shortObj.Id, short)
 | 
						||
        }
 | 
						||
        this.$set(this.questionForm, 'isSave', false)
 | 
						||
        this.$set(this.questionForm, 'MeasureData', measureData)
 | 
						||
      }, 100)
 | 
						||
    },
 | 
						||
    returnFloat(num) {
 | 
						||
      if (num) return
 | 
						||
      var value = Math.round(parseFloat(num) * 100) / 100
 | 
						||
      var s = value.toString().split('.')
 | 
						||
      if (s.length === 1) {
 | 
						||
        value = value.toString() + '.00'
 | 
						||
        return value
 | 
						||
      }
 | 
						||
      if (s.length > 1) {
 | 
						||
        if (s[1].length < 2) {
 | 
						||
          value = value.toString() + '0'
 | 
						||
        }
 | 
						||
        return value
 | 
						||
      }
 | 
						||
    },
 | 
						||
    getQuestionVal(questionMark) {
 | 
						||
      var idx = this.questions.findIndex(i => i.QuestionMark === questionMark)
 | 
						||
      if (idx > -1) {
 | 
						||
        var questionId = this.questions[idx].Id
 | 
						||
        return this.questionForm[questionId]
 | 
						||
      } else {
 | 
						||
        return ''
 | 
						||
      }
 | 
						||
    },
 | 
						||
    handleSave() {
 | 
						||
      this.$refs.measurementForm.validate(valid => {
 | 
						||
        if (!valid) return
 | 
						||
        var measureData = { ...this.questionForm.MeasureData }
 | 
						||
        // 普通靶病灶:长径大于10mm且不小于2倍层厚
 | 
						||
        // 淋巴结靶病灶:短径大于15mm且不小于2倍层厚
 | 
						||
        var lymphNodes = this.getQuestionVal(2)
 | 
						||
        var lesionLength = Number(this.getQuestionVal(0))
 | 
						||
        var lesionShort = Number(this.getQuestionVal(1))
 | 
						||
        if ((lymphNodes === '是' || lymphNodes === 'Yes') && this.lesionType === 0) {
 | 
						||
          if (!(lesionShort && measureData.thick && lesionShort > 15 && lesionShort >= 2 * measureData.thick)) {
 | 
						||
            this.$confirm(`淋巴结靶病灶短径应大于15mm且不小于2倍层厚`, {
 | 
						||
              type: 'warning',
 | 
						||
              showCancelButton: false,
 | 
						||
              callback: action => {}
 | 
						||
            })
 | 
						||
            return
 | 
						||
          }
 | 
						||
        }
 | 
						||
        if ((lymphNodes === '否' || lymphNodes === 'No') && this.lesionType === 0) {
 | 
						||
          if (!(lesionLength && measureData.thick && lesionLength > 10 && lesionLength >= 2 * measureData.thick)) {
 | 
						||
            this.$confirm(`普通靶病灶长径应大于10mm且不小于2倍层厚`, {
 | 
						||
              type: 'warning',
 | 
						||
              showCancelButton: false,
 | 
						||
              callback: action => {}
 | 
						||
            })
 | 
						||
            return
 | 
						||
          }
 | 
						||
        }
 | 
						||
        this.loading = true
 | 
						||
        var answers = []
 | 
						||
        for (const k in this.questionForm) {
 | 
						||
          if (k === 'isSave' || k === 'RowIndex' || k === 'InstanceId' || k === 'SeriesId' || k === 'MeasureData' || k === 'IsCurrentTaskAdd') continue
 | 
						||
          answers.push({ tableQuestionId: k, answer: this.questionForm[k] })
 | 
						||
        }
 | 
						||
        console.log(`${this.orderMark}${String(this.questionForm.RowIndex).padStart(2, '0')}`)
 | 
						||
        measureData.data.remark = `${this.orderMark}${String(this.questionForm.RowIndex).padStart(2, '0')}`
 | 
						||
        var params = {
 | 
						||
          questionId: this.parentQsId,
 | 
						||
          rowIndex: this.answers.RowIndex,
 | 
						||
          visitTaskId: this.visitTaskId,
 | 
						||
          trialId: this.trialId,
 | 
						||
          measureData: measureData ? JSON.stringify(measureData) : '',
 | 
						||
          answerList: answers,
 | 
						||
          seriesId: this.questionForm.MeasureData.seriesId,
 | 
						||
          instanceId: this.questionForm.MeasureData.instanceId
 | 
						||
        }
 | 
						||
        submitTableQuestion(params).then(res => {
 | 
						||
          this.loading = false
 | 
						||
          this.$message.success('保存成功!')
 | 
						||
          this.$emit('refreshReadingQuestionAndAnswer', 1)
 | 
						||
          var measureData = { ...this.questionForm.MeasureData }
 | 
						||
 | 
						||
          Store.$emit('resetMeasuredData', measureData.instanceId)
 | 
						||
          Store.$emit('getReportInfo', true)
 | 
						||
          this.$set(this.questionForm, 'isSave', true)
 | 
						||
          this.originalQuestionForm = { ...this.questionForm }
 | 
						||
        }).catch(() => { this.loading = false })
 | 
						||
      })
 | 
						||
    },
 | 
						||
    handleDelete() {
 | 
						||
      // 判断是否存在未保存的病灶
 | 
						||
      this.$emit('determineExistsUnsavedLession', val => {
 | 
						||
        if (val) {
 | 
						||
          this.$confirm('是否确认删除?', {
 | 
						||
            type: 'warning',
 | 
						||
            distinguishCancelAndClose: true
 | 
						||
          })
 | 
						||
            .then(() => {
 | 
						||
              this.loading = true
 | 
						||
              var param = {
 | 
						||
                visitTaskId: this.visitTaskId,
 | 
						||
                questionId: this.parentQsId,
 | 
						||
                rowIndex: this.questionForm.RowIndex
 | 
						||
              }
 | 
						||
              deleteReadingRowAnswer(param)
 | 
						||
                .then(res => {
 | 
						||
                  this.loading = false
 | 
						||
                  if (res.IsSuccess) {
 | 
						||
                    this.$emit('refreshReadingQuestionAndAnswer', 0)
 | 
						||
                    var measureData = { ...this.questionForm.MeasureData }
 | 
						||
                    Store.$emit('resetMeasuredData', measureData.instanceId)
 | 
						||
                    Store.$emit('getReportInfo', true)
 | 
						||
                    this.$message.success('删除成功!')
 | 
						||
                  }
 | 
						||
                }).catch(() => { this.loading = false })
 | 
						||
            })
 | 
						||
        }
 | 
						||
      })
 | 
						||
    }
 | 
						||
  }
 | 
						||
}
 | 
						||
</script>
 | 
						||
<style lang="scss" scoped>
 | 
						||
.measurement-form{
 | 
						||
  >>>.el-form-item__label{
 | 
						||
    color: #c3c3c3;
 | 
						||
  }
 | 
						||
  >>>.el-input__inner{
 | 
						||
    background-color: transparent;
 | 
						||
    color: #ddd;
 | 
						||
    border: 1px solid #5e5e5e;
 | 
						||
  }
 | 
						||
  >>>.el-form-item{
 | 
						||
    display: flex;
 | 
						||
    flex-direction: row;
 | 
						||
    justify-content: flex-start;
 | 
						||
  }
 | 
						||
  >>>.el-form-item__content{
 | 
						||
    flex: 1;
 | 
						||
  }
 | 
						||
  .el-form-item__content
 | 
						||
  .el-select{
 | 
						||
    width: 100%;
 | 
						||
  }
 | 
						||
  .input-width1{
 | 
						||
    width: calc(100% -60px)!important;
 | 
						||
  }
 | 
						||
  .input-width2{
 | 
						||
    width: 100% !important;
 | 
						||
  }
 | 
						||
}
 | 
						||
 | 
						||
</style>
 |