325 lines
		
	
	
		
			9.4 KiB
		
	
	
	
		
			Plaintext
		
	
	
			
		
		
	
	
			325 lines
		
	
	
		
			9.4 KiB
		
	
	
	
		
			Plaintext
		
	
	
<template>
 | 
						||
  <el-form
 | 
						||
    ref="clinicalDataForm"
 | 
						||
    v-loading="loading"
 | 
						||
    :model="form"
 | 
						||
    size="small"
 | 
						||
    :rules="rules"
 | 
						||
    label-width="210px"
 | 
						||
  >
 | 
						||
    <div class="base-dialog-body">
 | 
						||
      <!-- 临床数据名称 -->
 | 
						||
      <el-form-item
 | 
						||
        :label="$t('trials:processCfg:title:clinicalDataName') "
 | 
						||
        prop="ClinicalDataSetEnName"
 | 
						||
      >
 | 
						||
        <el-input
 | 
						||
          v-model="form.ClinicalDataSetEnName"
 | 
						||
          :disabled="data.IsFromSystemData === true"
 | 
						||
        />
 | 
						||
      </el-form-item>
 | 
						||
      <!-- 临床数据名称 -->
 | 
						||
      <el-form-item
 | 
						||
        :label="$t('trials:processCfg:title:clinicalDataName')+ '(CN)'"
 | 
						||
        prop="ClinicalDataSetName"
 | 
						||
      >
 | 
						||
        <el-input
 | 
						||
          v-model="form.ClinicalDataSetName"
 | 
						||
          :disabled="data.IsFromSystemData === true"
 | 
						||
        />
 | 
						||
      </el-form-item>
 | 
						||
      <!-- 上传人 -->
 | 
						||
      <el-form-item
 | 
						||
        :label="$t('trials:processCfg:title:uploader')"
 | 
						||
        prop="UploadRole"
 | 
						||
      >
 | 
						||
        <el-select
 | 
						||
          v-model="form.UploadRole"
 | 
						||
          style="width:100%;"
 | 
						||
          @change="handleUploadRoleChange"
 | 
						||
        >
 | 
						||
          <el-option
 | 
						||
            v-for="(item,index) of $d.ClinicalDataUploadRole"
 | 
						||
            :key="index"
 | 
						||
            :label="item.label"
 | 
						||
            :value="item.value"
 | 
						||
          />
 | 
						||
        </el-select>
 | 
						||
      </el-form-item>
 | 
						||
      <!-- 数据级别 -->
 | 
						||
      <el-form-item
 | 
						||
        :label="$t('trials:processCfg:title:dataLevel')"
 | 
						||
        prop="ClinicalDataLevel"
 | 
						||
      >
 | 
						||
        <el-select
 | 
						||
          v-model="form.ClinicalDataLevel"
 | 
						||
          style="width:100%;"
 | 
						||
          @change="() => {form.ClinicalUploadType = null}"
 | 
						||
        >
 | 
						||
          <el-option
 | 
						||
            v-for="(item,index) of $d.ClinicalLevel"
 | 
						||
            :key="index"
 | 
						||
            :label="item.label"
 | 
						||
            :value="item.value"
 | 
						||
          />
 | 
						||
        </el-select>
 | 
						||
      </el-form-item>
 | 
						||
 | 
						||
      <!--传输方式  暂时限制PM不允许选择数据传输方式 -->
 | 
						||
      <el-form-item
 | 
						||
        :label="$t('trials:processCfg:title:transferType')"
 | 
						||
        prop="ClinicalUploadType"
 | 
						||
      >
 | 
						||
        <el-select
 | 
						||
          v-model="form.ClinicalUploadType"
 | 
						||
          style="width:100%;"
 | 
						||
        >
 | 
						||
          <el-option
 | 
						||
            v-for="(item,index) of $d.ClinicalUploadType"
 | 
						||
            :key="index"
 | 
						||
            :label="item.label"
 | 
						||
            :value="item.value"
 | 
						||
            :disabled="item.value === 0 || item.value === 2 && form.UploadRole === 1 || (form.UploadRole === 0 && [2, 3].includes(form.ClinicalDataLevel) && item.value === 1)"
 | 
						||
          />
 | 
						||
        </el-select>
 | 
						||
      </el-form-item>
 | 
						||
      <!--  阅片标准 -->
 | 
						||
      <el-form-item
 | 
						||
        :label="$t('trials:processCfg:title:criterion')"
 | 
						||
        prop="TrialCriterionIdList"
 | 
						||
      >
 | 
						||
        <el-select
 | 
						||
          v-model="form.TrialCriterionIdList"
 | 
						||
          multiple
 | 
						||
          style="width:100%;"
 | 
						||
        >
 | 
						||
          <el-option
 | 
						||
            v-for="(item,index) of criterionList"
 | 
						||
            :key="index"
 | 
						||
            :label="item.CriterionName"
 | 
						||
            :value="item.Id"
 | 
						||
          />
 | 
						||
        </el-select>
 | 
						||
      </el-form-item>
 | 
						||
      <!-- 模板 -->
 | 
						||
      <el-form-item
 | 
						||
        v-if="form.ClinicalUploadType === 1"
 | 
						||
        :label="$t('trials:processCfg:title:module')"
 | 
						||
      >
 | 
						||
        <div class="upload-container">
 | 
						||
          <el-upload
 | 
						||
            class="upload-demo"
 | 
						||
            action
 | 
						||
            accept=".doc,.docx"
 | 
						||
            :before-upload="beforeUpload"
 | 
						||
            :http-request="handleUploadFile"
 | 
						||
            :on-preview="handlePreview"
 | 
						||
            :on-remove="handleRemoveFile"
 | 
						||
            :show-file-list="true"
 | 
						||
            :file-list="fileList"
 | 
						||
            :limit="1"
 | 
						||
            :on-exceed="handleExceed"
 | 
						||
            :disabled="form.Type === ''"
 | 
						||
          >
 | 
						||
            <!-- 选择 -->
 | 
						||
            <el-button size="small" type="primary">{{ $t('trials:processCfg:button:select') }}</el-button>
 | 
						||
            <span
 | 
						||
              slot="tip"
 | 
						||
              style="margin-left:10px;"
 | 
						||
              class="el-upload__tip"
 | 
						||
            >
 | 
						||
              <!-- (必须是doc/docx格式) -->
 | 
						||
              {{ $t('trials:processCfg:title:docFormat') }}
 | 
						||
            </span>
 | 
						||
          </el-upload>
 | 
						||
        </div>
 | 
						||
      </el-form-item>
 | 
						||
 | 
						||
    </div>
 | 
						||
    <div
 | 
						||
      class="base-dialog-footer"
 | 
						||
      style="text-align:right;margin-top:10px;"
 | 
						||
    >
 | 
						||
      <el-form-item>
 | 
						||
        <!-- 取消 -->
 | 
						||
        <el-button
 | 
						||
          :disabled="btnLoading"
 | 
						||
          size="small"
 | 
						||
          type="primary"
 | 
						||
          @click="close"
 | 
						||
        >
 | 
						||
          {{ $t('common:button:cancel') }}
 | 
						||
        </el-button>
 | 
						||
        <!-- 保存 -->
 | 
						||
        <el-button
 | 
						||
          size="small"
 | 
						||
          type="primary"
 | 
						||
          :loading="btnLoading"
 | 
						||
          @click="save"
 | 
						||
        >
 | 
						||
          {{ $t('common:button:save') }}
 | 
						||
        </el-button>
 | 
						||
      </el-form-item>
 | 
						||
    </div>
 | 
						||
  </el-form>
 | 
						||
</template>
 | 
						||
<script>
 | 
						||
import { addOrUpdateClinicalDataTrialSet, uploadClinicalTemplate, getTrialCriterionSelectList, getReadingQuestionCriterionTrialList } from '@/api/trials'
 | 
						||
export default {
 | 
						||
  name: 'AddOrUpdateClinicalData',
 | 
						||
  props: {
 | 
						||
    data: {
 | 
						||
      type: Object,
 | 
						||
      default() { return {} }
 | 
						||
    },
 | 
						||
    trialId: {
 | 
						||
      type: String,
 | 
						||
      required: true
 | 
						||
    }
 | 
						||
  },
 | 
						||
 | 
						||
  data() {
 | 
						||
    return {
 | 
						||
      form: {
 | 
						||
        TrialId: '',
 | 
						||
        Id: '',
 | 
						||
        ClinicalDataSetName: '',
 | 
						||
        ClinicalDataSetEnName: '',
 | 
						||
        ClinicalDataLevel: null,
 | 
						||
        ClinicalUploadType: null,
 | 
						||
        UploadRole: null,
 | 
						||
        FileName: '',
 | 
						||
        Path: '',
 | 
						||
        TrialCriterionIdList: []
 | 
						||
      },
 | 
						||
      rules: {
 | 
						||
        ClinicalDataSetName: [{ required: true, message: this.$t('common:ruleMessage:specify'), trigger: ['blur', 'change'] }],
 | 
						||
        ClinicalDataSetEnName: [{ required: true, message: this.$t('common:ruleMessage:specify'), trigger: ['blur', 'change'] }],
 | 
						||
        ClinicalDataLevel: [{ required: true, message: this.$t('common:ruleMessage:select'), trigger: ['blur', 'change'] }],
 | 
						||
        ClinicalUploadType: [{ required: true, message: this.$t('common:ruleMessage:select'), trigger: ['blur', 'change'] }],
 | 
						||
        UploadRole: [{ required: true, message: this.$t('common:ruleMessage:select'), trigger: ['blur', 'change'] }],
 | 
						||
        TrialCriterionIdList: [{ required: true, message: this.$t('common:ruleMessage:select'), trigger: ['blur', 'change'] }]
 | 
						||
      },
 | 
						||
      loading: false,
 | 
						||
      btnLoading: false,
 | 
						||
      fileList: [],
 | 
						||
      trialCriterionSelectList: [],
 | 
						||
      criterionList: []
 | 
						||
    }
 | 
						||
  },
 | 
						||
  mounted() {
 | 
						||
    this.initForm()
 | 
						||
    this.getCriterionList()
 | 
						||
  },
 | 
						||
  methods: {
 | 
						||
    getCriterionList(isSelect = false) {
 | 
						||
      getReadingQuestionCriterionTrialList({
 | 
						||
        TrialId: this.trialId,
 | 
						||
        PageIndex: 1,
 | 
						||
        PageSize: 500
 | 
						||
      }).then(res => {
 | 
						||
        this.criterionList = res.Result.CurrentPageData
 | 
						||
      }).catch(() => { this.listLoading = false })
 | 
						||
    },
 | 
						||
    getTrialCriterionSelectList() {
 | 
						||
      getTrialCriterionSelectList({ TrialId: this.trialId }).then(res => {
 | 
						||
        this.trialCriterionSelectList = res.Result
 | 
						||
      })
 | 
						||
    },
 | 
						||
    initForm() {
 | 
						||
      if (Object.keys(this.data).length > 0) {
 | 
						||
        for (const k in this.form) {
 | 
						||
          if (this.data.hasOwnProperty(k)) {
 | 
						||
            this.form[k] = this.data[k]
 | 
						||
          }
 | 
						||
        }
 | 
						||
        if (!this.data.Path) return
 | 
						||
        this.fileList = [
 | 
						||
          {
 | 
						||
            name: this.data.FileName,
 | 
						||
            path: this.data.Path
 | 
						||
          }
 | 
						||
        ]
 | 
						||
      }
 | 
						||
    },
 | 
						||
    save() {
 | 
						||
      this.$refs.clinicalDataForm.validate(valid => {
 | 
						||
        if (!valid) return
 | 
						||
        this.btnLoading = true
 | 
						||
        this.form.TrialId = this.trialId
 | 
						||
        addOrUpdateClinicalDataTrialSet(this.form).then(res => {
 | 
						||
          this.btnLoading = false
 | 
						||
          this.$emit('getList', true)
 | 
						||
          this.$emit('close')
 | 
						||
          this.$message.success(this.$t('common:message:savedSuccessfully'))
 | 
						||
        })
 | 
						||
          .catch(() => {
 | 
						||
            this.btnLoading = false
 | 
						||
          })
 | 
						||
      })
 | 
						||
    },
 | 
						||
    // 上传模板uploadClinicalTemplate
 | 
						||
    async handleUploadFile(param) {
 | 
						||
      this.loading = true
 | 
						||
      const file = await this.fileToBlob(param.file)
 | 
						||
      const res = await this.OSSclient.put(`/TrialConfig/${this.trialId}/ClinicalData/${param.file.name}`, file)
 | 
						||
      // console.log(res)
 | 
						||
      const file1 = { name: param.file.name, path: this.form.Path, url: this.$getObjectName(res.url) }
 | 
						||
      this.fileList.push(file1)
 | 
						||
      this.form.Path = this.$getObjectName(res.url)
 | 
						||
      this.form.FileName = param.file.name
 | 
						||
      this.loading = false
 | 
						||
    },
 | 
						||
    beforeUpload(file) {
 | 
						||
      // 检测文件类型是否符合要求
 | 
						||
      if (this.checkFileSuffix(file.name)) {
 | 
						||
        this.fileList = []
 | 
						||
        return true
 | 
						||
      } else {
 | 
						||
        this.$alert(this.$t('trials:processCfg:title:docFormat')) // '(必须是doc/docx格式)'
 | 
						||
 | 
						||
        return false
 | 
						||
      }
 | 
						||
    },
 | 
						||
    handleRemoveFile() {
 | 
						||
      this.fileList = []
 | 
						||
      this.form.Path = ''
 | 
						||
      this.form.FileName = ''
 | 
						||
    },
 | 
						||
    handlePreview(file) {
 | 
						||
      if (file.fullPath) {
 | 
						||
        window.open(file.fullPath, '_blank')
 | 
						||
      }
 | 
						||
    },
 | 
						||
    handleExceed(files, fileList) {
 | 
						||
      this.$message.warning(this.$t('trials:processCfg:title:onlyOneFile')) // `只允许上传一个文件`
 | 
						||
    },
 | 
						||
    checkFileSuffix(fileName) {
 | 
						||
      var typeArr = ['doc', 'docx']
 | 
						||
      var extendName = fileName.substring(fileName.lastIndexOf('.') + 1).toLocaleLowerCase()
 | 
						||
      if (typeArr.indexOf(extendName) !== -1) {
 | 
						||
        return true
 | 
						||
      } else {
 | 
						||
        return false
 | 
						||
      }
 | 
						||
    },
 | 
						||
    handleUploadRoleChange(val) {
 | 
						||
      this.form.ClinicalDataLevel = null
 | 
						||
      this.form.ClinicalUploadType = null
 | 
						||
    },
 | 
						||
    close() {
 | 
						||
      this.$emit('close')
 | 
						||
    }
 | 
						||
 | 
						||
  }
 | 
						||
}
 | 
						||
</script>
 | 
						||
<style lang="scss" scoped>
 | 
						||
.upload-container{
 | 
						||
  /deep/ .el-upload {
 | 
						||
    width: 100%;
 | 
						||
    text-align: left;
 | 
						||
  }
 | 
						||
}
 | 
						||
</style>
 |