ivus添加下载模板及oct标准更改

src/api/reading.js

@@ -1,5 +1,5 @@
 import request from '@/utils/request'
-
+import requestDownload from '@/utils/request-download'
 export function addBaseLineLesion(param) {
   return request({
     url: '/report/addBaseLineLesion',
@@ -201,3 +201,11 @@ export function getTaskUploadedDicomStudyList(param) {
     data: param
   })
 }
+export function getIVUSTemplate(param) {
+  return requestDownload({
+    url: '/IVUSCalculate/getIVUSTemplate',
+    method: 'post',
+    responseType: 'blob',
+    data: param
+  })
+}

src/views/trials/trials-panel/reading/dicoms/components/IVUS/QuestionList.vue

@@ -46,7 +46,7 @@
                   <div v-if="item.Type === 'basicTable'" class="flex-row" style="margin:3px 0;">
                     <div class="title">{{ item.QuestionName }}</div>
                     <div v-if="item.LesionType === 102 && readingTaskState < 2">
-                      <div class="add-icon">
+                      <div class="add-icon" @click.prevent="downloadTpl">
                         <i class="el-icon-download" />
                       </div>
                       <div class="add-icon" style="margin: 0 5px;">
@@ -82,7 +82,7 @@
                       :render-header="renderHeader"
                     />
                     <el-table-column
-                      v-if="readingTaskState < 2"
+                      v-if="readingTaskState < 2 && item.LesionType === 102"
                       :label="$t('common:action:action')"
                       width="100px"
                       fixed="right"
@@ -91,7 +91,7 @@
                         <el-button type="text" size="mini" @click="handleAddOrEdit('edit',item, scope.$index)">
                           {{ $t('common:button:edit') }}
                         </el-button>
-                        <el-button v-if="scope.row.IsCurrentTaskAdd === 'True'" type="text" size="mini" @click="handleDelete(item, scope.$index)">
+                        <el-button type="text" size="mini" @click="handleDelete(item, scope.$index)">
                           {{ $t('common:button:delete') }}
                         </el-button>
                       </template>
@@ -203,7 +203,7 @@
 </template>
 <script>
 import { saveTaskQuestion, submitTableQuestion, deleteReadingRowAnswer } from '@/api/trials'
-import { resetReadingTask } from '@/api/reading'
+import { resetReadingTask, getIVUSTemplate } from '@/api/reading'
 import DicomEvent from './../DicomEvent'
 import store from '@/store'
 import { mapGetters } from 'vuex'
@@ -469,7 +469,9 @@ export default {
     },
     limitBlur(qId, valueType) {
       const value = this.questionForm[qId]
-      if (isNaN(parseInt(value))) return
+      if (isNaN(parseInt(value))) {
+        this.$set(this.questionForm, qId, '')
+      } else {
         if (valueType === 0) {
           this.$set(this.questionForm, qId, parseInt(value))
         } else if (valueType === 3) {
@@ -477,6 +479,7 @@ export default {
         } else {
           this.$set(this.questionForm, qId, parseFloat(value).toFixed(this.digitPlaces))
         }
+      }
     },
     numberToFixed(v, unit) {
       return isNaN(parseFloat(v)) ? null : `${parseFloat(v).toFixed(this.digitPlaces)}${unit}`
@@ -588,7 +591,13 @@ export default {
         if (i.QuestionMark === 1003) {
           this.diffId = i.Id
         }
-        this.$set(this.qsForm, i.Id, type === 'add' ? null : row.TableQuestions.Answers && row.TableQuestions.Answers[index] ? row.TableQuestions.Answers[index][i.Id] : null)
+        let v = null
+        if (type === 'add') {
+          v = i.Type === 'number' ? undefined : null
+        } else {
+          v = row.TableQuestions.Answers && row.TableQuestions.Answers[index] ? row.TableQuestions.Answers[index][i.Id] : null
+        }
+        this.$set(this.qsForm, i.Id, v)
       })
       this.addOrEdit.visible = true
     },
@@ -660,6 +669,16 @@ export default {
         console.log(e)
       }
     },
+    async downloadTpl() {
+      try {
+        const params = {
+          visitTaskId: this.visitTaskId
+        }
+        await getIVUSTemplate(params)
+      } catch (e) {
+        console.log(e)
+      }
+    },
     renderHeader(h, { column, $index }) {
       const span = document.createElement('span')
       span.innerText = column.label
@@ -796,9 +815,9 @@ export default {
     /deep/ .el-table__fixed-right {
       height: 100% !important;
     }
-    /deep/ .el-table .cell {
+    // /deep/ .el-table .cell {
-      line-height: 14px;
+    //   line-height: 20px;
-    }
+    // }
     /deep/ .el-table__cell {
       padding: 5px 0;
     }

src/views/trials/trials-panel/reading/dicoms/components/IVUS/QuestionTableFormItem.vue

@@ -118,7 +118,7 @@
           </el-checkbox>
         </el-checkbox-group>
         <!-- 数值 -->
-        <template v-else-if="question.Type==='number'">
+        <!-- <template v-else-if="question.Type==='number'">
           <el-input-number
             v-if="question.ValueType === 0"
             v-model="questionForm[question.Id]"
@@ -142,7 +142,20 @@
             style="width: 100%"
             @change="((val)=>{formItemChange(val, question)})"
           />
+        </template> -->
+        <!-- 数值类型 -->
+        <el-input
+          v-else-if="question.Type==='number'"
+          v-model="questionForm[question.Id]"
+          :disabled="readingTaskState>=2 "
+          type="number"
+          @change="((val)=>{formItemChange(val, question)})"
+        >
+          <template v-if="question.Unit" slot="append">
+            {{ $fd('ValueUnit', parseInt(question.Unit)) }}
           </template>
+        </el-input>
+
         <el-input
           v-else-if="question.Type==='calculation'"
           v-model="questionForm[question.Id]"
@@ -206,6 +219,9 @@ export default {
       if (question.Childrens && question.Childrens.length > 0) {
         this.resetChild(question.Childrens)
       } else {
+        if (question.Type === 'number') {
+          v = this.limitBlur(question.ValueType, v)
+        }
         this.$emit('setFormItemData', { key: question.Id, val: v })
       }
     },
@@ -217,11 +233,31 @@ export default {
         }
       })
     },
+    limitBlur(valueType, value) {
+      if (isNaN(parseInt(value))) {
+        value = null
+      } else {
+        if (valueType === 0) {
+          value = parseInt(value)
+        } else if (valueType === 3) {
+          value = parseFloat(value)
+        } else {
+          value = parseFloat(value).toFixed(this.digitPlaces)
+        }
+      }
+      return value
+    },
     resetFormItemData(v) {
       this.$emit('resetFormItemData', v)
     },
     setFormItemData(obj) {
       this.$emit('setFormItemData', obj)
+    },
+    limitNumbersEvent(e) {
+      // 通过正则保留两位小数点
+      let val = e.target.value
+      if (val.length > 6) val = val.slice(0, 6)
+      e.target.value = (val.match(/^\d*(\.?\d{0,3})/g)[0]) || null
     }
   }
 }

src/views/trials/trials-panel/reading/dicoms/components/OCT/QuestionForm.vue

@@ -1,534 +0,0 @@
-<template>
-  <el-form
-    v-if="isRender"
-    ref="measurementForm"
-    v-loading="loading"
-    :model="questionForm"
-    size="mini"
-    class="measurement-form"
-  >
-    <div class="base-dialog-body">
-      <div style="display: flex;justify-content: space-between;">
-        <h3 v-if="questionName" style="color: #ddd;padding: 5px 0px;margin: 0;">
-          <!-- {{ `${questionName} (${orderMark}${String(rowIndex).padStart(2, '0')})` }} -->
-          {{ lesionName }}
-        </h3>
-        <!-- 关闭 -->
-        <div>
-          <i class="el-icon-circle-close" style="font-size: 25px;cursor: pointer;" @click="handleClose" />
-        </div>
-      </div>
-      <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:['radio', 'select', 'checkbox'].includes(qs.Type) ? $t('common:ruleMessage:select') : $t('common:ruleMessage:specify'), trigger: ['blur','change']},
-        ]"
-      >
-
-        <!-- 输入框 -->
-        <template v-if="qs.Type==='input'">
-          <el-input
-            v-model="questionForm[qs.Id]"
-            :disabled="!isCurrentTask || readingTaskState>=2 "
-            @change="((val)=>{formItemChange(val, qs)})"
-          />
-        </template>
-        <!-- 数值类型 -->
-        <template v-if="qs.Type==='number'">
-          <el-input
-            v-model="questionForm[qs.Id]"
-            :disabled="!isCurrentTask || readingTaskState>=2 "
-            @change="((val)=>{formItemChange(val, qs)})"
-            @blur="limitBlur(qs.Id, qs.ValueType)"
-          >
-            <template v-if="qs.Unit" slot="append">
-              {{ $fd('ValueUnit', parseInt(qs.Unit)) }}
-            </template>
-          </el-input>
-        </template>
-        <!-- 自动计算 -->
-        <template v-if="qs.Type==='calculation'">
-          <el-input
-            v-model="questionForm[qs.Id]"
-            disabled
-            @change="((val)=>{formItemChange(val, qs)})"
-          >
-            <template v-if="qs.Unit" slot="append">
-              {{ $fd('ValueUnit', parseInt(qs.Unit)) }}
-            </template>
-          </el-input>
-        </template>
-        <!-- 多行文本输入框 -->
-        <el-input
-          v-if="qs.Type==='textarea'"
-          v-model="questionForm[qs.Id]"
-          type="textarea"
-          :autosize="{ minRows: 2, maxRows: 4}"
-          :disabled="!isCurrentTask || readingTaskState>=2"
-          @change="((val)=>{formItemChange(val, qs)})"
-        />
-
-        <el-select
-          v-if="qs.Type==='select'"
-          v-model="questionForm[qs.Id]"
-          filterable
-          :placeholder="$t('common:placeholder:select')"
-          :disabled="!isCurrentTask || readingTaskState>=2"
-          @change="((val)=>{formItemChange(val, qs)})"
-        >
-          <template v-if="qs.DictionaryCode">
-            <el-option
-              v-for="item of $d[qs.DictionaryCode]"
-              :key="item.id"
-              :value="item.value"
-              :label="item.label"
-            />
-          </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-button
-        v-if="isCurrentTaskAdd !== 'False'"
-        size="mini"
-        @click="handleDelete"
-      >
-        {{ $t('common:button:delete') }}
-      </el-button>
-      <!-- 保存 -->
-      <el-button
-        size="mini"
-        @click="handleSave"
-      >
-        {{ $t('common:button:save') }}
-      </el-button>
-    </div>
-  </el-form>
-</template>
-<script>
-import { submitTableQuestion, deleteReadingRowAnswer } from '@/api/trials'
-import DicomEvent from './../DicomEvent'
-// 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: ''
-    },
-    questionName: {
-      type: String,
-      required: true
-    },
-    rowIndex: {
-      type: String,
-      required: true
-    },
-    tableQuestions: {
-      type: Array,
-      default() { return [] }
-    }
-  },
-  data() {
-    return {
-      questionForm: {},
-      loading: false,
-      trialId: '',
-      originalQuestionForm: {},
-      isRender: false,
-      toolType: '',
-      lesionName: '',
-      isCurrentTaskAdd: 'False',
-      lesionMark: '',
-      pictureBaseStr: '',
-      digitPlaces: 2
-    }
-  },
-  mounted() {
-    this.trialId = this.$route.query.trialId
-    var digitPlaces = Number(localStorage.getItem('digitPlaces'))
-    this.digitPlaces = digitPlaces === -1 ? this.digitPlaces : digitPlaces
-    this.initForm()
-    DicomEvent.$on('handleImageQualityAbnormal', () => {
-
-    })
-  },
-  beforeDestroy() {
-    DicomEvent.$off('handleImageQualityAbnormal')
-  },
-  methods: {
-    async initForm() {
-      const loading = this.$loading({ fullscreen: true })
-      this.questions.forEach(item => {
-        var val = this.answers[item.Id]
-        if (item.DictionaryCode) {
-          val = isNaN(parseInt(this.answers[item.Id])) ? this.answers[item.Id] : parseInt(this.answers[item.Id])
-        }
-
-        this.$set(this.questionForm, item.Id, val)
-      })
-      this.$set(this.questionForm, 'RowIndex', this.answers.RowIndex ? this.answers.RowIndex : '')
-      this.$set(this.questionForm, 'RowId', this.answers.RowId ? this.answers.RowId : '')
-      if (this.questionForm.RowId) {
-        this.$set(this.questionForm, 'saveTypeEnum', 2)
-      } else {
-        this.$set(this.questionForm, 'saveTypeEnum', 0)
-      }
-      this.$set(this.questionForm, 'IsDicomReading', this.answers.IsDicomReading !== 'False')
-      if (!this.questionForm.LesionType) {
-        this.$set(this.questionForm, 'LesionType', this.lesionType)
-      }
-      this.lesionName = this.getLesionInfo(this.orderMark, this.rowIndex)
-      this.isCurrentTaskAdd = this.answers.IsCurrentTaskAdd ? this.answers.IsCurrentTaskAdd : 'True'
-      this.lesionMark = this.getLesionName(this.orderMark, this.questionForm.RowIndex)
-      this.originalQuestionForm = { ...this.questionForm }
-      this.isRender = true
-      loading.close()
-    },
-    getLesionName(orderMark, rowIndex) {
-      var lessionName = ''
-      var rowIndexArr = rowIndex.split('.')
-      var x = parseInt(rowIndexArr[0])
-      var y = parseInt(rowIndexArr[1])
-      if (y > 0) {
-        y = String.fromCharCode(parseInt(rowIndexArr[1]) - 1 + 65 + 32)
-        lessionName = `${orderMark}${String(x).padStart(2, '0')}${y}`
-      } else {
-        lessionName = `${orderMark}${String(x).padStart(2, '0')}`
-      }
-
-      return lessionName
-    },
-    getLesionInfo(orderMark, rowIndex) {
-      var arr = []
-      var lessionName = ''
-      var rowIndexArr = rowIndex.split('.')
-      var x = parseInt(rowIndexArr[0])
-      var y = parseInt(rowIndexArr[1])
-      if (y > 0) {
-        y = String.fromCharCode(parseInt(rowIndexArr[1]) - 1 + 65 + 32)
-        lessionName = `${orderMark}${String(x).padStart(2, '0')}${y}`
-        arr.push(lessionName)
-      } else {
-        lessionName = `${orderMark}${String(x).padStart(2, '0')}`
-        arr.push(lessionName)
-      }
-      return arr.join(' ')
-    },
-    getQuestionId(questionMark) {
-      var idx = this.questions.findIndex(i => i.QuestionMark === questionMark)
-      if (idx > -1) {
-        return this.questions[idx].Id
-      } else {
-        return ''
-      }
-    },
-    async formItemChange(v, question) {
-      if (this.questionForm.RowId) {
-        this.$set(this.questionForm, 'saveTypeEnum', 1)
-      } else {
-        this.$set(this.questionForm, 'saveTypeEnum', 0)
-      }
-      if (question.QuestionMark === 1011 || question.QuestionMark === 1012 || question.QuestionMark === 1013) {
-        // 最小值
-        this.questionForm[this.getQuestionId(1014)] = this.calculate([1011, 1012, 1013], 'min')
-        // 平均值
-        this.questionForm[this.getQuestionId(1015)] = this.calculate([1011, 1012, 1013], 'avg')
-      }
-      let l1, l2, l3, min, mean, angle
-      if (this.lesionType === 101) {
-        l1 = this.getQuestionVal(1011)
-        l2 = this.getQuestionVal(1012)
-        l3 = this.getQuestionVal(1013)
-        min = this.getQuestionVal(1014)
-        mean = this.getQuestionVal(1015)
-      } else if (this.lesionType === 103) {
-        angle = this.getQuestionVal(1016)
-      }
-      this.$emit('resetQuestions', { l1, l2, l3, min, mean, angle, saveTypeEnum: this.questionForm.saveTypeEnum, rowIndex: this.rowIndex, questionId: this.parentQsId, anwsers: this.questionForm })
-    },
-    calculate(qsMarkArr, type) {
-      var num = 0
-      const arr = []
-      for (let i = 0; i < qsMarkArr.length; i++) {
-        const mark = qsMarkArr[i]
-        let v = this.questionForm[this.getQuestionId(mark)]
-        if (isNaN(parseFloat(v))) {
-          num = null
-          break
-        }
-        v = parseFloat(v)
-        if (i === 0) {
-          num = v
-          arr.push(v)
-        } else {
-          switch (type) {
-            case 'min':
-              num = num > v ? v : num
-              break
-            case 'avg':
-              arr.push(v)
-              if (arr.length === qsMarkArr.length) {
-                num = arr.reduce((acc, curr) => {
-                  return acc + curr
-                }, 0) / arr.length
-              }
-              break
-          }
-        }
-      }
-
-      return num === null ? num : num.toFixed(this.digitPlaces)
-    },
-    limitBlur(qId, valueType) {
-      const value = this.questionForm[qId]
-      if (isNaN(parseInt(value))) return
-      if (valueType === 0) {
-        this.$set(this.questionForm, qId, parseInt(value))
-      } else if (valueType === 3) {
-        this.$set(this.questionForm, qId, parseFloat(value))
-      } else {
-        this.$set(this.questionForm, qId, parseFloat(value).toFixed(this.digitPlaces))
-      }
-    },
-    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) {
-      const idx = this.questions.findIndex(i => i.QuestionMark === questionMark)
-      if (idx > -1) {
-        const questionId = this.questions[idx].Id
-        const answer = this.questionForm[questionId]
-        if (isNaN(parseFloat(answer))) {
-          return answer
-        } else {
-          return parseFloat(answer)
-        }
-      } else {
-        return ''
-      }
-    },
-    async handleSave() {
-      const valid = await this.$refs.measurementForm.validate()
-      if (!valid) return
-      const loading = this.$loading({ fullscreen: true })
-      try {
-        var answers = []
-        var reg = new RegExp(/^[0-9a-zA-Z]{8}-[0-9a-zA-Z]{4}-[0-9a-zA-Z]{4}-[0-9a-zA-Z]{4}-[0-9a-zA-Z]{12}$/)
-        for (const k in this.questionForm) {
-          if (reg.test(k)) {
-            if (answers.findIndex(i => i.tableQuestionId === k) === -1) {
-              answers.push({ tableQuestionId: k, answer: this.questionForm[k] })
-            }
-          }
-        }
-
-        var params = {
-          questionId: this.parentQsId,
-          rowId: this.questionForm.RowId,
-          rowIndex: this.answers.RowIndex,
-          visitTaskId: this.visitTaskId,
-          trialId: this.trialId,
-          answerList: answers
-        }
-        const res = await submitTableQuestion(params)
-        if (res.IsSuccess) {
-          // 保存成功！
-          this.$message.success(this.$t('common:message:savedSuccessfully'))
-          this.$set(this.questionForm, 'saveTypeEnum', 2)
-          this.originalQuestionForm = { ...this.questionForm }
-          this.$set(this.questionForm, 'RowId', res.Result.RowId)
-          let l1, l2, l3, min, mean, angle
-          if (this.lesionType === 101) {
-            l1 = this.getQuestionVal(1011)
-            l2 = this.getQuestionVal(1012)
-            l3 = this.getQuestionVal(1013)
-            min = this.getQuestionVal(1014)
-            mean = this.getQuestionVal(1015)
-          } else if (this.lesionType === 103) {
-            angle = this.getQuestionVal(1016)
-          }
-          this.$emit('resetQuestions', { l1, l2, l3, min, mean, angle, saveTypeEnum: this.questionForm.saveTypeEnum, rowIndex: this.rowIndex, questionId: this.parentQsId, anwsers: this.questionForm })
-          this.$emit('close')
-
-          DicomEvent.$emit('refreshQuestions')
-          DicomEvent.$emit('getReportInfo', true)
-        }
-        loading.close()
-      } catch (e) {
-        console.log(e)
-        loading.close()
-      }
-    },
-    async handleDelete() {
-      const loading = this.$loading({ fullscreen: true })
-      try {
-        const confirm = await this.$confirm(
-          this.$t('trials:reading:warnning:msg48'),
-          {
-            type: 'warning',
-            distinguishCancelAndClose: true
-          }
-        )
-        if (confirm !== 'confirm') return
-        if (this.questionForm.RowId) {
-          var param = {
-            visitTaskId: this.visitTaskId,
-            questionId: this.parentQsId,
-            rowId: this.questionForm.RowId
-          }
-          const res = await deleteReadingRowAnswer(param)
-          if (res.IsSuccess) {
-            this.$emit('close', { lesionType: this.lesionType, rowIndex: this.rowIndex, visitTaskId: this.visitTaskId })
-            DicomEvent.$emit('getReportInfo', true)
-            // '删除成功！'
-            this.$message.success(this.$t('common:message:deletedSuccessfully'))
-          }
-        } else {
-          this.$emit('close', { lesionType: this.lesionType, rowIndex: this.rowIndex, visitTaskId: this.visitTaskId })
-        }
-        loading.close()
-      } catch (e) {
-        loading.close()
-        console.log(e)
-      }
-    },
-    async handleClose() {
-      if (!this.questionForm.RowId) {
-        // '当前数据未保存。如果关闭窗口，将会删除，是否继续？'
-        const confirm = await this.$confirm(
-          this.$t('trials:reading:warnning:msg60'),
-          {
-            type: 'warning',
-            distinguishCancelAndClose: true
-          }
-        )
-        if (confirm !== 'confirm') return
-        this.$emit('close', { lesionType: this.lesionType, rowIndex: this.rowIndex, visitTaskId: this.visitTaskId })
-      } else {
-        this.$emit('close')
-      }
-    }
-  }
-}
-</script>
-<style lang="scss" scoped>
-.measurement-form{
-  /deep/ .el-form-item__label{
-    color: #c3c3c3;
-    text-align: left;
-  }
-  /deep/ .el-input .el-input__inner{
-    background-color: transparent;
-    color: #ddd;
-    border: 1px solid #5e5e5e;
-  }
-  /deep/ .el-form-item{
-    display: flex;
-    flex-direction: row;
-    justify-content: flex-start;
-  }
-  /deep/ .el-form-item__content{
-    flex: 1;
-  }
-  /deep/ .el-input.is-disabled .el-input__inner{
-    background-color: #646464a1;
-  }
-  /deep/ .el-select.is-disabled .el-input__inner{
-    background-color: #646464a1;
-  }
-  /deep/ .el-button--mini, .el-button--mini.is-round {
-    padding: 7px 10px;
-  }
-  .el-form-item__content
-  .el-select{
-    width: 100%;
-  }
-  .input-width1{
-    width: calc(100% -60px)!important;
-  }
-  .input-width2{
-    width: 100% !important;
-  }
-}
-
-</style>

src/views/trials/trials-panel/reading/dicoms/components/OCT/QuestionList.vue

@@ -29,8 +29,8 @@
       </div>
 
       <!-- 测量问题 -->
-      <template v-if="questions.length > 0 && CriterionType !== 10">
+      <template v-if="questions.length > 0">
-        <div v-for="(qs,index) in questions" :key="index" v-loading="loading" class="lesions lesions_wrapper">
+        <div v-for="(qs,index) in questions" :key="index" v-loading="loading" class="lesions lesions_wrapper" style="margin-bottom: 10px">
           <h4 v-if="qs.Type === 'group'" style="color: #ddd;padding: 5px 0px;margin: 0;">
             {{ language==='en'?qs.GroupEnName:qs.GroupName }}
           </h4>
@@ -41,75 +41,63 @@
               size="small"
               :model="questionForm"
             >
-              <div class="base-dialog-body">
+              <div class="table-wrapper">
                 <div v-for="item in qs.Childrens" :key="item.Id">
-                  <div v-if="item.Type === 'table'" class="flex-row" style="margin:3px 0;">
+                  <div v-if="item.Type === 'basicTable'" class="flex-row" style="margin:3px 0;">
                     <div class="title">{{ item.QuestionName }}</div>
-                    <div v-if="readingTaskState < 2" class="add-icon" @click.prevent="handleAdd(item)">
+                    <div v-if="item.LesionType === 112 && readingTaskState < 2">
+                      <div class="add-icon">
+                        <i class="el-icon-download" />
+                      </div>
+                      <div class="add-icon" style="margin: 0 5px;">
+                        <i class="el-icon-upload2" />
+                      </div>
+                      <div class="add-icon" @click.prevent="handleAddOrEdit('add',item)">
                         <i class="el-icon-plus" />
                       </div>
                     </div>
-                  <el-collapse
-                    v-if="item.Type === 'table' && item.TableQuestions"
-                    v-model="activeName"
-                    accordion
-                    style="margin-bottom: 10px;"
-                    @change="handleCollapseChange"
-                  >
-                    <el-collapse-item
-                      v-for="(q,i) in item.TableQuestions.Answers"
-                      :key="`${item.Id}_${q.RowIndex}`"
-                      :name="`${item.Id}_${q.RowIndex}`"
-                    >
-                      <template slot="title">
-                        <div style="width:300px;position: relative;" :style="{color:(activeName===item.Id+q.RowIndex?'#ffeb3b':'#fff')}">
 
-                          {{ getLesionName(item.OrderMark,q.RowIndex) }}
-                          <!-- 未保存 -->
-                          <el-tooltip v-if="readingTaskState<2 && parseInt(item.TableQuestions.Answers[i].saveTypeEnum) === 0" class="item" effect="dark" :content="$t('trials:reading:button:unsaved')" placement="bottom">
-                            <i class="el-icon-warning" style="color:red" />
-                          </el-tooltip>
-                          <!-- 信息不完整 -->
-                          <el-tooltip v-if="readingTaskState<2 && parseInt(item.TableQuestions.Answers[i].saveTypeEnum) ===1" class="item" effect="dark" :content="$t('trials:reading:button:incompleteInfor')" placement="bottom">
-                            <i class="el-icon-warning" style="color:#ff9800" />
-                          </el-tooltip>
-                          <div style="position: absolute;left: 60px;top: 2px;">
-                            <div style="display: flex;flex-direction: row;font-size: 11px;width:200px;height: 30px;">
-                              <div v-show="item.LesionType === 101" style="margin-left:10px;">
-                                min: {{ numberToFixed(item.TableQuestions.Answers[i].min,'μm') }}
                   </div>
-                              <div v-show="item.LesionType === 101" style="margin-left:10px;">
+                  <el-table
-                                mean: {{ numberToFixed(item.TableQuestions.Answers[i].mean,'μm') }}
+                    v-if="item.Type === 'basicTable' && item.TableQuestions"
-                              </div>
+                    :ref="item.Id"
-                              <div v-show="item.LesionType === 103" style="margin-left:10px;">
+                    :data="item.TableQuestions.Answers"
-                                {{ numberToFixed(item.TableQuestions.Answers[i].angle,'°') }}
+                    max-height="600"
-                              </div>
+                  >
-                            </div>
+                    <!-- <el-table-column :label="$t('CustomizeQuestionFormItem:label:OrderMark')" width="60px" show-overflow-tooltip>
-                          </div>
+                      <template slot-scope="scope">
-                        </div>
+                        {{ getLesionName(item.OrderMark,scope.row.RowIndex) }}
-
                       </template>
-                      <QuestionForm
+                    </el-table-column> -->
-                        :ref="`${item.Id}_${q.RowIndex}`"
+                    <el-table-column
-                        :questions="item.TableQuestions.Questions"
+                      type="index"
-                        :answers="item.TableQuestions.Answers[i]"
+                      width="40px"
-                        :lesion-type="item.LesionType"
-                        :order-mark="item.OrderMark"
-                        :table-questions="tableQuestions"
-                        :row-index="String(q.RowIndex)"
-                        :question-name="item.QuestionName"
-                        :parent-qs-id="item.Id"
-                        :visit-task-id="visitTaskId"
-                        :is-current-task="isCurrentTask"
-                        :reading-task-state="readingTaskState"
-                        :is-base-line-task="isBaseLineTask"
-                        @getReadingQuestionAndAnswer="getReadingQuestionAndAnswer"
-                        @resetQuestions="resetQuestions"
-                        @close="close"
                     />
-                    </el-collapse-item>
+                    <el-table-column
+                      v-for="q of item.TableQuestions.Questions"
+                      :key="q.Id"
+                      :prop="q.Id"
+                      :label="q.QuestionName"
+                      show-overflow-tooltip
+                      :render-header="renderHeader"
+                    />
+                    <el-table-column
+                      v-if="readingTaskState < 2 && (item.LesionType === 112 || item.LesionType === 101)"
+                      :label="$t('common:action:action')"
+                      width="100px"
+                      fixed="right"
+                    >
+                      <template slot-scope="scope">
+                        <el-button type="text" size="mini" @click="handleAddOrEdit('edit',item, scope.$index)">
+                          {{ $t('common:button:edit') }}
+                        </el-button>
+                        <el-button v-if="item.LesionType === 112" type="text" size="mini" @click="handleDelete(item, scope.$index)">
+                          {{ $t('common:button:delete') }}
+                        </el-button>
+                      </template>
+                    </el-table-column>
+                  </el-table>
 
-                  </el-collapse>
                   <template v-else>
                     <!-- 数值 -->
                     <el-form-item
@@ -123,24 +111,20 @@
                       ]"
                     >
                       <!-- 数值类型 -->
-                      <template v-if="item.Type==='number'">
+                      <template v-if="item.Type==='textarea'">
                         <el-input
-                          v-model="questionForm[item.Id]"
+                          v-model="questionForm[qs.Id]"
+                          type="textarea"
+                          :autosize="{ minRows: 2, maxRows: 4}"
                           :disabled="!isCurrentTask || readingTaskState>=2"
-                          @change="((val)=>{formItemChange(val, item)})"
+                          @change="((val)=>{formItemChange(val, qs)})"
-                          @blur="limitBlur(item.Id, item.ValueType)"
+                        />
-                        >
-                          <template v-if="item.Unit" slot="append">
-                            {{ $fd('ValueUnit', parseInt(item.Unit)) }}
-                          </template>
-                        </el-input>
                       </template>
                     </el-form-item>
                   </template>
-
                 </div>
                 <div
-                  v-if="isCurrentTask && readingTaskState<2"
+                  v-if="isCurrentTask && readingTaskState<2 && qs.GroupClassify === 5"
                   class="base-dialog-footer"
                   style="text-align:right;margin-top:10px;"
                 >
@@ -178,22 +162,58 @@
         :is-qulity-issues="false"
         :group-classify="5"
       />
+      <el-dialog
+        v-if="addOrEdit.visible"
+        :visible.sync="addOrEdit.visible"
+        :close-on-click-modal="false"
+        :title="addOrEdit.title"
+        width="500px"
+      >
+        <el-form
+          ref="tableQsForm"
+          v-loading="loading"
+          :model="qsForm"
+          size="small"
+        >
+          <QuestionTableFormItem
+            v-for="item in qsList"
+            :key="item.Id"
+            :question="item"
+            :question-form="qsForm"
+            :reading-task-state="readingTaskState"
+            @setFormItemData="setFormItemData"
+            @resetFormItemData="resetFormItemData"
+          />
+          <el-form-item style="text-align: right">
+            <el-button
+              size="small"
+              @click="addOrEdit.visible = false"
+            >
+              {{ $t('common:button:cancel') }}
+            </el-button>
+            <!-- 保存 -->
+            <el-button size="small" class="my_upload_btn" @click="saveFormData">
+              {{ $t('common:button:save') }}
+            </el-button>
+          </el-form-item>
+        </el-form>
+      </el-dialog>
     </div>
   </div>
 </template>
 <script>
-// import { saveTaskQuestion } from '@/api/trials'
+import { saveTaskQuestion, submitTableQuestion, deleteReadingRowAnswer } from '@/api/trials'
 import { resetReadingTask } from '@/api/reading'
 import DicomEvent from './../DicomEvent'
 import store from '@/store'
 import { mapGetters } from 'vuex'
 import Questions from './../Questions'
-import QuestionForm from './QuestionForm'
+import QuestionTableFormItem from './QuestionTableFormItem'
 export default {
   name: 'MeasurementList',
   components: {
     Questions,
-    QuestionForm
+    QuestionTableFormItem
   },
   props: {
     isShow: {
@@ -221,26 +241,26 @@ export default {
     return {
       height: window.innerHeight - 140,
       questions: [],
-      activeName: '',
-      activeItem: {
-        activeRowIndex: null,
-        activeCollapseId: null
-      },
       visitTaskId: '',
       isCurrentTask: false,
       loading: false,
-      unSaveTargets: [],
-      temporaryLesions: [],
       readingTaskState: 2,
       isBaseLineTask: false,
       taskBlindName: '',
       tableQuestions: [],
-      isFirstRender: false,
       CriterionType: null,
       subjectCode: '',
       questionForm: {},
       formChanged: false,
-      digitPlaces: 2
+      digitPlaces: 2,
+      addOrEdit: { visible: false, title: '' },
+      qsList: [],
+      answersList: [],
+      qsForm: {},
+      m1Id: '',
+      m2Id: '',
+      m3Id: '',
+      avgId: ''
     }
   },
   computed: {
@@ -298,9 +318,6 @@ export default {
         this.readingTaskState = this.visitTaskList[i].ReadingTaskState
         this.isBaseLineTask = this.visitTaskList[i].IsBaseLineTask
         this.isCurrentTask = this.visitTaskList[i].IsCurrentTask
-        this.activeName = ''
-        this.activeItem.activeRowIndex = null
-        this.activeItem.activeCollapseId = null
         if (!this.visitTaskList[i].IsInit) {
           var loading = this.$loading({ fullscreen: true })
           var triald = this.trialId = this.$router.currentRoute.query.trialId
@@ -323,13 +340,6 @@ export default {
           this.$refs['ecrf'].getQuestions(this.visitTaskId)
           this.$refs['ecrf2'].getQuestions(this.visitTaskId)
           this.$refs['ecrf3'].getQuestions(this.visitTaskId)
-          this.getTableQuestions()
-          this.tableQuestions.forEach(item => {
-            item.TableQuestions.Answers.forEach(i => {
-              var refName = `${item.Id}_${i.RowIndex}`
-              this.$refs[refName] && this.$refs[refName][0].initForm()
-            })
-          })
         })
       }
     },
@@ -353,18 +363,12 @@ export default {
     },
     setQuestions(questions, obj) {
       questions.forEach(item => {
-        if (item.Type === 'table' && item.Id === obj.questionId) {
+        if ((item.Type === 'table' || item.Type === 'basicTable') && item.Id === obj.questionId) {
           var idx = item.TableQuestions.Answers.findIndex(i => i.RowIndex === obj.rowIndex)
           item.TableQuestions.Answers[idx].saveTypeEnum = obj.saveTypeEnum
-          if (item.LesionType === 101) {
+          item.TableQuestions.Answers[idx].area1 = obj.area1
-            item.TableQuestions.Answers[idx].l1 = obj.l1
+          item.TableQuestions.Answers[idx].area2 = obj.area2
-            item.TableQuestions.Answers[idx].l2 = obj.l2
+          item.TableQuestions.Answers[idx].diff = obj.diff
-            item.TableQuestions.Answers[idx].l3 = obj.l3
-            item.TableQuestions.Answers[idx].min = obj.min
-            item.TableQuestions.Answers[idx].mean = obj.mean
-          } else if (item.LesionType === 103) {
-            item.TableQuestions.Answers[idx].angle = obj.angle
-          }
           for (const i in obj.anwsers) {
             item.TableQuestions.Answers[idx][i] = String(obj.anwsers[i])
           }
@@ -376,17 +380,11 @@ export default {
     },
     getQuestions(questions) {
       questions.forEach(item => {
-        if (item.Type === 'table' && item.TableQuestions && item.TableQuestions.Answers.length > 0) {
+        if ((item.Type === 'table' || item.Type === 'basicTable') && item.TableQuestions && item.TableQuestions.Answers.length > 0) {
           item.TableQuestions.Answers.forEach(answerObj => {
             if (answerObj.RowId) {
-              if (item.LesionType === 101) {
+              var diffVal = this.getQuestionAnswer(item.TableQuestions.Questions, 1003, answerObj)
-                var min = this.getQuestionAnswer(item.TableQuestions.Questions, 1014, answerObj)
+              this.$set(answerObj, 'saveTypeEnum', isNaN(parseFloat(diffVal)) ? 1 : 2)
-                var mean = this.getQuestionAnswer(item.TableQuestions.Questions, 1015, answerObj)
-                this.$set(answerObj, 'saveTypeEnum', (isNaN(parseFloat(min)) || isNaN(parseFloat(mean))) ? 1 : 2)
-              } else if (item.LesionType === 103) {
-                var angle = this.getQuestionAnswer(item.TableQuestions.Questions, 1016, answerObj)
-                this.$set(answerObj, 'saveTypeEnum', isNaN(parseFloat(angle)) ? 1 : 2)
-              }
             } else {
               this.$set(answerObj, 'saveTypeEnum', 0)
             }
@@ -398,37 +396,6 @@ export default {
       })
       return questions
     },
-    getTableQuestions() {
-      this.tableQuestions = []
-      this.questions.map(item => {
-        if (item.Type === 'table') {
-          this.tableQuestions.push(item)
-        }
-        if (item.Childrens.length > 0) {
-          this.getTableQuestionsChild(item.Childrens)
-        }
-      })
-    },
-    getTableQuestionsChild(obj) {
-      obj.map(item => {
-        if (item.Type === 'table') {
-          this.tableQuestions.push(item)
-        }
-        if (item.Childrens.length > 0) {
-          this.getTableQuestionsChild(item.Childrens)
-        }
-      })
-    },
-    refreshReadingQuestionAndAnswer(type) {
-      if (type === 0) {
-        // 删除
-        this.activeName = ''
-        this.activeItem.activeRowIndex = null
-        this.activeItem.activeCollapseId = null
-      }
-
-      this.getReadingQuestionAndAnswer(this.visitTaskId)
-    },
     getReadingQuestionAndAnswer() {
       return new Promise(async resolve => {
         try {
@@ -444,15 +411,6 @@ export default {
               this.isBaseLineTask = this.visitTaskList[idx].IsBaseLineTask
               this.isCurrentTask = this.visitTaskList[idx].IsCurrentTask
             }
-            this.getTableQuestions()
-            this.$nextTick(() => {
-              this.tableQuestions.forEach(item => {
-                item.TableQuestions.Answers.forEach(i => {
-                  var refName = `${item.Id}_${i.RowIndex}`
-                  this.$refs[refName] && this.$refs[refName][0].initForm()
-                })
-              })
-            })
           })
           loading.close()
           resolve()
@@ -474,37 +432,6 @@ export default {
     isCanActiveTool(toolName) {
       return { isCanActiveTool: true, reason: '' }
     },
-
-    async handleAdd(qs) {
-      if (!!qs.MaxQuestionCount && qs.MaxQuestionCount <= qs.TableQuestions.Answers.length) {
-        let msg = this.$t('trials:reading:warnning:msg14')
-        // msg = msg.replace('xxx', qs.QuestionName)
-        msg = msg.replace('xxx', qs.MaxQuestionCount)
-        this.$confirm(msg, {
-          type: 'warning',
-          showCancelButton: false,
-          callback: action => {}
-        })
-      } else {
-        // saveTypeEnum: 0
-        var obj = { saveTypeEnum: 0 }
-        // var questions = qs.TableQuestions.Questions.find(item => item.QuestionMark === 3)
-        // if (questions) {
-        //   console.log(questions)
-        //   var maxIndex = this.getMaxRowIndex(qs.TableQuestions.Answers)
-        //   obj.RowIndex = `${maxIndex + 1}.00`
-        //   obj[questions.Id] = `${qs.OrderMark}${String(maxIndex + 1).padStart(2, '0')}`
-        // }
-        var maxIndex = this.getMaxRowIndex(qs.TableQuestions.Answers)
-        obj.RowIndex = `${maxIndex + 1}.00`
-        obj.IsDicomReading = true
-        await store.dispatch('reading/addReadingQuestionAndAnswer', { lesionType: qs.LesionType, visitTaskId: this.visitTaskId, lesionObj: obj })
-
-        this.activeItem.activeRowIndex = String(obj.RowIndex)
-        this.activeItem.activeCollapseId = qs.Id
-        this.activeName = `${this.activeItem.activeCollapseId}_${this.activeItem.activeRowIndex}`
-      }
-    },
     getMaxRowIndex(answerList) {
       if (answerList.length > 0) {
         var arr = []
@@ -531,24 +458,6 @@ export default {
       }
 
       return lessionName
-    },
-    handleCollapseChange(val) {
-      if (this.activeName) {
-        var arr = this.activeName.split('_')
-        this.activeItem.activeRowIndex = arr[1]
-        this.activeItem.activeCollapseId = arr[0]
-      } else {
-        this.activeItem.activeRowIndex = null
-        this.activeItem.activeCollapseId = null
-      }
-    },
-    collapseRightClick(e, obj, activeCollapseId, activeRowIndex) {
-      e.stopImmediatePropagation()
-      e.stopPropagation()
-      e.preventDefault()
-    },
-    setCollapseActive(measureData) {
-
     },
     modifyMeasuredData(measureObj) {
     },
@@ -574,38 +483,29 @@ export default {
       return isNaN(parseFloat(v)) ? null : `${parseFloat(v).toFixed(this.digitPlaces)}${unit}`
     },
     async handleSave(index) {
-      // const refName = `questions${index}`
+      const refName = `questions${index}`
-      // const valid = await this.$refs[refName][0].validate()
+      const valid = await this.$refs[refName][0].validate()
-      // if (!valid) return
+      if (!valid) return
-      // const loading = this.$loading({ fullscreen: true })
+      const loading = this.$loading({ fullscreen: true })
-      // var answers = []
+      var answers = []
-      // for (const k in this.questionForm) {
+      for (const k in this.questionForm) {
-      //   answers.push({ id: k, answer: this.questionForm[k] })
+        answers.push({ id: k, answer: this.questionForm[k] })
-      // }
+      }
-      // var params = {
+      var params = {
-      //   visitTaskId: this.visitTaskId,
+        visitTaskId: this.visitTaskId,
-      //   answers: answers
+        answers: answers
-      // }
+      }
-      // try {
+      try {
-      //   await saveTaskQuestion(8, params)
+        await saveTaskQuestion(8, params)
-      //   this.$message.success(this.$t('common:message:savedSuccessfully'))
+        this.$message.success(this.$t('common:message:savedSuccessfully'))
-      //   loading.close()
+        loading.close()
-      //   DicomEvent.$emit('getReportInfo', true)
+        DicomEvent.$emit('getReportInfo', true)
-      //   this.refreshQuestions()
+        this.refreshQuestions()
-      //   this.formChanged = false
+        this.formChanged = false
-      // } catch (e) {
+      } catch (e) {
-      //   console.log(e)
+        console.log(e)
-      //   loading.close()
+        loading.close()
-      // }
-    },
-    async close(questionsObj) {
-      if (questionsObj) {
-        this.getReadingQuestionAndAnswer(questionsObj.visitTaskId)
-        this.refreshQuestions()
       }
-      this.activeItem.activeRowIndex = null
-      this.activeItem.activeCollapseId = null
-      this.activeName = ''
     },
     getECRFQuestions(obj) {
       this.$refs['ecrf'].getQuestions(obj.visitTaskId)
@@ -627,10 +527,6 @@ export default {
         const res = await resetReadingTask({ visitTaskId: this.visitTaskId })
         this.loading = false
         if (res.IsSuccess) {
-          // 刷新标注、表单、报告页信息
-          this.activeName = ''
-          this.activeItem.activeRowIndex = null
-          this.activeItem.activeCollapseId = null
           await this.getReadingQuestionAndAnswer(this.visitTaskId)
           const triald = this.$router.currentRoute.query.trialId
           await store.dispatch('reading/refreshDicomReadingQuestionAnswer', { trialId: triald, visitTaskId: this.visitTaskId })
@@ -647,14 +543,142 @@ export default {
     },
     async refreshQuestions() {
       const triald = this.$router.currentRoute.query.trialId
+      await this.getReadingQuestionAndAnswer(this.visitTaskId)
       await store.dispatch('reading/refreshDicomReadingQuestionAnswer', { trialId: triald, visitTaskId: this.visitTaskId })
       this.$refs['ecrf'].getQuestions(this.visitTaskId, true)
       this.$refs['ecrf2'].getQuestions(this.visitTaskId, true)
       this.$refs['ecrf3'].getQuestions(this.visitTaskId, true)
     },
     receiveMsg(event) {
+    },
+    resetFormItemData(v) {
+      this.qsForm[v] = null
+    },
+    setFormItemData(obj) {
+      this.qsForm[obj.key] = obj.val
+      if (obj.key === this.m1Id || obj.key === this.m2Id || obj.key === this.m3Id) {
+        const m1 = this.qsForm[this.m1Id]
+        const m2 = this.qsForm[this.m2Id]
+        const m3 = this.qsForm[this.m3Id]
+        if (isNaN(parseFloat(m1)) || isNaN(parseFloat(m2)) || isNaN(parseFloat(m3))) {
+          this.$set(this.qsForm, this.avgId, null)
+        } else {
+          const avg = (parseFloat(m1) + parseFloat(m2) + parseFloat(m3)) / 3
+          this.$set(this.qsForm, this.avgId, avg.toFixed(this.digitPlaces))
+        }
+      }
+    },
+    handleAddOrEdit(type, row, index) {
+      this.addOrEdit.title = row.QuestionName
+      this.qsList = row.TableQuestions.Questions
+      this.qsForm = {}
+      this.qsForm.questionId = row.Id
+      this.qsForm.rowId = type === 'add' ? null : row.TableQuestions.Answers && row.TableQuestions.Answers[index] ? row.TableQuestions.Answers[index].RowId : null
+      if (type === 'add') {
+        var maxIndex = this.getMaxRowIndex(row.TableQuestions.Answers)
+        this.qsForm.rowIndex = `${maxIndex + 1}.00`
+      } else {
+        this.qsForm.rowIndex = row.TableQuestions.Answers && row.TableQuestions.Answers[index] ? row.TableQuestions.Answers[index].RowIndex : null
+      }
+      row.TableQuestions.Questions.map(i => {
+        if (i.QuestionMark === 1011) {
+          this.m1Id = i.Id
+        }
+        if (i.QuestionMark === 1012) {
+          this.m2Id = i.Id
+        }
+        if (i.QuestionMark === 1013) {
+          this.m3Id = i.Id
+        }
+        if (i.QuestionMark === 1015) {
+          this.avgId = i.Id
+        }
+        let v = null
+        if (type === 'add') {
+          v = i.Type === 'number' ? undefined : null
+        } else {
+          v = row.TableQuestions.Answers && row.TableQuestions.Answers[index] ? row.TableQuestions.Answers[index][i.Id] : null
+        }
+        this.$set(this.qsForm, i.Id, v)
+      })
+      this.addOrEdit.visible = true
+    },
+    async saveFormData() {
+      const valid = await this.$refs.tableQsForm.validate()
+      if (!valid) return
+      const loading = this.$loading({ fullscreen: true })
+      try {
+        var answers = []
+        var reg = new RegExp(/^[0-9a-zA-Z]{8}-[0-9a-zA-Z]{4}-[0-9a-zA-Z]{4}-[0-9a-zA-Z]{4}-[0-9a-zA-Z]{12}$/)
+        for (const k in this.qsForm) {
+          if (reg.test(k)) {
+            if (answers.findIndex(i => i.tableQuestionId === k) === -1) {
+              answers.push({ tableQuestionId: k, answer: this.qsForm[k] })
+            }
+          }
         }
 
+        var params = {
+          questionId: this.qsForm.questionId,
+          rowId: this.qsForm.rowId,
+          rowIndex: this.qsForm.rowIndex,
+          visitTaskId: this.visitTaskId,
+          trialId: this.trialId,
+          answerList: answers
+        }
+        const res = await submitTableQuestion(params)
+        if (res.IsSuccess) {
+          // 保存成功！
+          this.$message.success(this.$t('common:message:savedSuccessfully'))
+          this.addOrEdit.visible = false
+          this.refreshQuestions()
+          DicomEvent.$emit('getReportInfo', true)
+        }
+        loading.close()
+      } catch (e) {
+        console.log(e)
+        loading.close()
+      }
+    },
+    async handleDelete(row, index) {
+      const loading = this.$loading({ fullscreen: true })
+      try {
+        const confirm = await this.$confirm(
+          this.$t('trials:reading:warnning:msg48'),
+          {
+            type: 'warning',
+            distinguishCancelAndClose: true
+          }
+        )
+        if (confirm !== 'confirm') return
+        if (row.TableQuestions.Answers[index].RowId) {
+          var param = {
+            visitTaskId: this.visitTaskId,
+            questionId: row.Id,
+            rowId: row.TableQuestions.Answers[index].RowId
+          }
+          const res = await deleteReadingRowAnswer(param)
+          if (res.IsSuccess) {
+            await this.getReadingQuestionAndAnswer(this.visitTaskId)
+            DicomEvent.$emit('getReportInfo', true)
+            // '删除成功！'
+            this.$message.success(this.$t('common:message:deletedSuccessfully'))
+          }
+        }
+        loading.close()
+      } catch (e) {
+        loading.close()
+        console.log(e)
+      }
+    },
+    renderHeader(h, { column, $index }) {
+      const span = document.createElement('span')
+      span.innerText = column.label
+      document.body.appendChild(span)
+      column.minWidth = span.getBoundingClientRect().width + 15
+      document.body.removeChild(span)
+      return h('span', column.label)
+    }
   }
 }
 </script>
@@ -690,6 +714,7 @@ export default {
 
   }
   .add-icon{
+    display: inline-block;
     padding: 5px;
     font-weight: bold;
     color: #ddd;
@@ -720,9 +745,14 @@ export default {
       color: #ddd;
       border: 1px solid #5e5e5e;
     }
+    /deep/ .el-textarea__inner{
+      background-color: transparent;
+      color: #ddd;
+      border: 1px solid #5e5e5e;
+    }
     /deep/ .el-form-item{
       display: flex;
-      flex-direction: row;
+      flex-direction: column;
       justify-content: flex-start;
     }
     /deep/ .el-form-item__content{
@@ -734,47 +764,62 @@ export default {
     /deep/ .el-select.is-disabled .el-input__inner{
       background-color: #646464a1;
     }
-    /deep/ .el-button--mini, .el-button--mini.is-round {
+
-      padding: 7px 10px;
-    }
     .el-form-item__content
     .el-select{
       width: 100%;
     }
   }
-  .el-collapse{
+  .table-wrapper {
-    border-bottom:none;
+    ::-webkit-scrollbar {
-    border-top:none;
+      width: 5px;
-    /deep/ .el-collapse-item{
+      height: 8px;
+    }
+    ::-webkit-scrollbar-thumb {
+      border-radius: 10px;
+      background: #d0d0d0;
+    }
+    /deep/ .el-table,
+    .el-table__expanded-cell {
+      background-color: #000;
+      color: #fff;
+      border-color: #444444;
+    }
+    /deep/ .el-table th,
+    .el-table tr {
+      background-color: #000;
+      color: #fff;
+      border-color: #444444;
+    }
+    /deep/ .el-table__body tr > td {
       background-color: #000 !important;
-      color: #ddd;
+      color: #fff;
-
+      border-color: #444444;
     }
-    /deep/ .el-collapse-item__header{
+    /deep/ .el-table__body tr:hover > td {
+      background-color: #858282 !important;
+      color: #fff;
+      border-color: #444444;
+    }
+    /deep/ .el-table--border th.gutter:last-of-type {
+      border: none;
+    }
+    /deep/ .el-table__fixed-right {
+      height: 100% !important;
+    }
+    // /deep/ .el-table .cell {
+    //   line-height: 20px;
+    // }
+    /deep/ .el-table__cell {
+      padding: 5px 0;
+    }
+    /deep/.el-table__fixed-right-patch {
       background-color: #000 !important;
-      color: #ddd;
+      border-color: #444444;
-      border-bottom-color:#5a5a5a;
-      padding-left: 5px;
-      height: 35px;
-      line-height: 35px;
     }
-    /deep/ .el-collapse-item__wrap{
+    /deep/.el-table__fixed-body-wrapper tr:hover > td {
       background-color: #000 !important;
-      color: #ddd;
     }
-    /deep/ .el-collapse-item__content{
-      width:260px;
-      position: absolute;
-      top: 0px;
-      right: 0px;
-      // border: 1px solid #ffeb3b;
-      border: 1px solid #fff;
-      z-index: 1;
-      color: #ddd;
-      padding: 5px;
-      background-color:#1e1e1e;
-    }
-
   }
 }
 </style>

src/views/trials/trials-panel/reading/dicoms/components/OCT/QuestionTableFormItem.vue

@@ -0,0 +1,291 @@
+<template>
+  <div>
+    <div
+      v-if="!!question.GroupName && question.Type==='group'"
+    >
+      <h4 style="color: #ddd;padding: 5px 0px;margin: 0;">
+        {{ language==='en'?question.GroupEnName:question.GroupName }}
+      </h4>
+    </div>
+    <template v-else>
+      <el-form-item
+        v-if="(question.ShowQuestion===1 && question.ParentTriggerValueList.includes(String(questionForm[question.ParentId]))) || question.ShowQuestion===0 "
+        :label="`${question.QuestionName}`"
+        :prop="question.Id"
+        :rules="[
+          { required: (question.IsRequired === 0 || (question.IsRequired ===1 && question.RelevanceId && (questionForm[question.RelevanceId] === question.RelevanceValue))) && question.Type!=='group' && question.Type!=='summary',
+            message: ['radio', 'select', 'checkbox'].includes(question.Type) ? $t('common:ruleMessage:select') : $t('common:ruleMessage:specify'), trigger: ['blur', 'change']},
+        ]"
+        :class="[question.Type==='group' ? 'mb' : (question.Type==='upload' || question.QuestionName.length > 15) ?'uploadWrapper' : '']"
+      >
+        <!-- 输入框 -->
+        <el-input
+          v-if="question.Type==='input'"
+          v-model="questionForm[question.Id]"
+          :disabled="readingTaskState >= 2"
+          @change="((val)=>{formItemChange(val, question)})"
+        />
+        <!-- 多行文本输入框 -->
+        <el-input
+          v-else-if="question.Type==='textarea'"
+          v-model="questionForm[question.Id]"
+          type="textarea"
+          :autosize="{ minRows: 2, maxRows: 4}"
+          maxlength="500"
+          :disabled="readingTaskState >= 2"
+          @change="((val)=>{formItemChange(val, question)})"
+        />
+        <!-- 下拉框 -->
+        <el-select
+          v-else-if="question.Type==='select'"
+          v-model="questionForm[question.Id]"
+          :disabled="readingTaskState >= 2 || ((question.TableQuestionType === 2 || question.QuestionGenre === 2) && !!question.DictionaryCode)"
+          clearable
+          @change="((val)=>{formItemChange(val, question)})"
+        >
+          <template v-if="question.TableQuestionType === 1">
+            <el-option
+              v-for="item in organList"
+              :key="item.Id"
+              :label="item[question.DataTableColumn]"
+              :value="item[question.DataTableColumn]"
+            />
+          </template>
+          <template v-else-if="question.TableQuestionType === 3 || question.QuestionGenre === 3">
+            <el-option
+              v-for="item of $d[question.DictionaryCode]"
+              :key="item.id"
+              :value="String(item.value)"
+              :label="item.label"
+            />
+          </template>
+          <template v-else-if="(question.TableQuestionType === 2 || question.QuestionGenre === 2) && question.DictionaryCode">
+            <el-option
+              v-for="item of $d[question.DictionaryCode]"
+              :key="item.id"
+              :value="String(item.value)"
+              :label="item.label"
+            />
+          </template>
+          <template v-else>
+            <el-option
+              v-for="val in question.TypeValue.split('|')"
+              :key="val"
+              :label="val"
+              :value="val"
+            />
+          </template>
+        </el-select>
+        <!-- 单选 -->
+        <el-radio-group
+          v-else-if="question.Type==='radio'"
+          v-model="questionForm[question.Id]"
+          :disabled="readingTaskState >= 2"
+          @change="((val)=>{formItemChange(val, question)})"
+        >
+          <template v-if="question.DictionaryCode">
+            <el-radio
+              v-for="item of $d[question.DictionaryCode]"
+              :key="item.id"
+              :label="String(item.value)"
+            >
+              {{ item.label }}
+            </el-radio>
+          </template>
+          <template v-else-if="question.TypeValue">
+            <el-radio
+              v-for="val in question.TypeValue.split('|')"
+              :key="val"
+              :label="val"
+            >
+              {{ val }}
+            </el-radio>
+          </template>
+        </el-radio-group>
+        <!-- 复选框 -->
+        <el-checkbox-group
+          v-else-if="question.Type==='checkbox'"
+          v-model="questionForm[question.Id]"
+          :disabled="readingTaskState >= 2"
+          @change="((val)=>{formItemChange(val, question)})"
+        >
+          <el-checkbox
+            v-for="val in question.TypeValue.split('|')"
+            :key="val"
+            :label="val"
+          >
+            {{ val }}
+          </el-checkbox>
+        </el-checkbox-group>
+        <!-- 数值 -->
+        <!-- <template v-else-if="question.Type==='number'">
+          <el-input-number
+            v-if="question.ValueType === 0"
+            v-model="questionForm[question.Id]"
+            :precision="0"
+            :disabled="readingTaskState >= 2"
+            style="width: 100%"
+            @change="((val)=>{formItemChange(val, question)})"
+          />
+          <el-input-number
+            v-else-if="question.ValueType === 3"
+            v-model="questionForm[question.Id]"
+            :disabled="readingTaskState >= 2"
+            style="width: 100%"
+            @change="((val)=>{formItemChange(val, question)})"
+          />
+          <el-input-number
+            v-else-if="question.ValueType === 1 || question.ValueType === 2"
+            v-model="questionForm[question.Id]"
+            :precision="digitPlaces"
+            :disabled="readingTaskState >= 2"
+            style="width: 100%"
+            @change="((val)=>{formItemChange(val, question)})"
+          />
+        </template> -->
+        <!-- 数值类型 -->
+        <el-input
+          v-else-if="question.Type==='number'"
+          v-model="questionForm[question.Id]"
+          :disabled="readingTaskState>=2 "
+          type="number"
+          @change="((val)=>{formItemChange(val, question)})"
+        >
+          <template v-if="question.Unit" slot="append">
+            {{ $fd('ValueUnit', parseInt(question.Unit)) }}
+          </template>
+        </el-input>
+
+        <el-input
+          v-else-if="question.Type==='calculation'"
+          v-model="questionForm[question.Id]"
+          disabled
+          @change="((val)=>{formItemChange(val, question)})"
+        >
+          <template v-if="question.Unit" slot="append">
+            {{ $fd('ValueUnit', parseInt(question.Unit)) }}
+          </template>
+        </el-input>
+      </el-form-item>
+    </template>
+
+    <QuestionTableFormItem
+      v-for="item in question.Childrens"
+      :key="item.Id"
+      :question="item"
+      :question-form="questionForm"
+      :reading-task-state="readingTaskState"
+      @setFormItemData="setFormItemData"
+      @resetFormItemData="resetFormItemData"
+    />
+  </div>
+</template>
+<script>
+import { mapGetters } from 'vuex'
+export default {
+  name: 'QuestionTableFormItem',
+  props: {
+    questionForm: {
+      type: Object,
+      default() {
+        return {}
+      }
+    },
+    question: {
+      type: Object,
+      default() {
+        return []
+      }
+    },
+    readingTaskState: {
+      type: Number,
+      required: true
+    }
+  },
+  data() {
+    return {
+      digitPlaces: 2
+    }
+  },
+  computed: {
+    ...mapGetters(['language'])
+  },
+  mounted() {
+    var digitPlaces = Number(localStorage.getItem('digitPlaces'))
+    this.digitPlaces = digitPlaces === -1 ? this.digitPlaces : parseInt(digitPlaces)
+  },
+  methods: {
+    formItemChange(v, question) {
+      if (question.Childrens && question.Childrens.length > 0) {
+        this.resetChild(question.Childrens)
+      } else {
+        if (question.Type === 'number') {
+          v = this.limitBlur(question.ValueType, v)
+        }
+        this.$emit('setFormItemData', { key: question.Id, val: v })
+      }
+    },
+    resetChild(obj) {
+      obj.forEach(i => {
+        this.$emit('resetFormItemData', i.Id)
+        if (i.Childrens && i.Childrens.length > 0) {
+          this.resetChild(i.Childrens)
+        }
+      })
+    },
+    limitBlur(valueType, value) {
+      if (isNaN(parseInt(value))) {
+        value = null
+      } else {
+        if (valueType === 0) {
+          value = parseInt(value)
+        } else if (valueType === 3) {
+          value = parseFloat(value)
+        } else {
+          value = parseFloat(value).toFixed(this.digitPlaces)
+        }
+      }
+      return value
+    },
+    resetFormItemData(v) {
+      this.$emit('resetFormItemData', v)
+    },
+    setFormItemData(obj) {
+      this.$emit('setFormItemData', obj)
+    },
+    limitNumbersEvent(e) {
+      // 通过正则保留两位小数点
+      let val = e.target.value
+      if (val.length > 6) val = val.slice(0, 6)
+      e.target.value = (val.match(/^\d*(\.?\d{0,3})/g)[0]) || null
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.mb{
+  margin-bottom: 0px;
+}
+.disabled{
+  /deep/ .el-upload--picture-card {
+    display: none;
+  }
+}
+.uploadWrapper{
+  display: flex;
+  flex-direction: column !important;
+  align-items: flex-start;
+}
+/deep/ .el-input.is-disabled .el-input__inner{
+    background-color: #646464a1;
+  }
+  /deep/ .el-input-group__append, .el-input-group__prepend{
+    padding: 0 10px;
+  }
+  /deep/ .el-form-item__content {
+    width: 100%;
+  }
+  /deep/ .el-select.is-disabled .el-input__inner{
+    background-color: #646464a1;
+  }
+</style>