irc_web/src/components/uploadDicomAndNonedicom/study-view.vue

<template>
  <div v-if="model_cfg.visible">
    <base-model :config="model_cfg">
      <div slot="dialog-body">
        <el-table :data="modelList" style="width: 100%" height="300">
          <!--检查编号-->
          <el-table-column
            prop="StudyCode"
            :label="$t('trials:uploadImage:table:StudyCode')"
          />
          <!--检查类型-->
          <el-table-column
            prop="ModalityForEdit"
            :label="$t('trials:uploadImage:table:ModalityForEdit')"
            v-if="IsDicom"
          />
          <!--检查模态-->
          <el-table-column
            prop="Modalities"
            :label="$t('trials:uploadImage:table:Modalities')"
            v-if="IsDicom"
          />
          <!--检查部位-->
          <el-table-column
            prop="BodyPartForEdit"
            :label="$t('trials:uploadImage:table:BodyPartForEdit')"
            v-if="IsDicom"
          >
            <template slot-scope="scope">
              <span>{{
                $fd(
                  'Bodypart',
                  scope.row.BodyPartForEdit,
                  'Code',
                  { Bodypart: bodyPart },
                  'Name'
                )
              }}</span>
            </template>
          </el-table-column>
          <!--序列数量-->
          <el-table-column
            prop="SeriesCount"
            :label="$t('trials:uploadImage:table:SeriesCount')"
            v-if="IsDicom"
          />
          <!--图像数量-->
          <el-table-column
            prop="InstanceCount"
            :label="$t('trials:uploadImage:table:InstanceCount')"
            v-if="IsDicom"
          />
          <!--检查时间-->
          <el-table-column
            prop="StudyTime"
            :label="$t('trials:uploadImage:table:StudyTime')"
            v-if="IsDicom"
            min-width="130"
          />
          <!--检查模态-->
          <el-table-column
            prop="Modality"
            :label="$t('trials:uploadImage:table:Modalities')"
            v-if="!IsDicom"
          />
          <!--检查部位-->
          <el-table-column
            prop="BodyPart"
            :label="$t('trials:uploadImage:table:BodyPartForEdit')"
            v-if="!IsDicom"
          >
            <template slot-scope="scope">
              <span>{{
                $fd(
                  'Bodypart',
                  scope.row.BodyPart,
                  'Code',
                  { Bodypart: bodyPart },
                  'Name'
                )
              }}</span>
            </template>
          </el-table-column>
          <!--文件数量-->
          <el-table-column
            prop="FileCount"
            :label="$t('trials:uploadImage:table:FileCount')"
            v-if="!IsDicom"
          />
          <!--检查时间-->
          <el-table-column
            prop="ImageDate"
            :label="$t('trials:uploadImage:table:StudyTime')"
            v-if="!IsDicom"
            min-width="130"
          />
          <el-table-column
            :label="$t('common:action:action')"
            fixed="right"
            width="80"
          >
            <template slot-scope="scope">
              <!--预览--->
              <el-button
                circle
                icon="el-icon-view"
                :title="$t('trials:uploadImage:button:preview')"
                v-if="!isUpload"
                @click.stop="preview(scope.row)"
              />
              <!--编辑--->
              <el-button
                circle
                icon="el-icon-edit-outline"
                :title="$t('trials:uploadImage:button:edit')"
                v-else
                @click.stop="openEdit(scope.row)"
              />
            </template>
          </el-table-column>
        </el-table>
      </div>
    </base-model>
    <!--新增检查部位-->
    <base-model v-if="editModality_model.visible" :config="editModality_model">
      <template slot="dialog-body">
        <el-form
          ref="editModalityform"
          :inline="true"
          :model="form"
          class="demo-form-inline"
          :rules="rules"
        >
          <el-form-item
            :label="$t('trials:uploadImage:form:ModalityForEdit')"
            prop="Modality"
            label-width="150px"
          >
            <el-select v-model="form.Modality" placeholder="">
              <el-option
                v-for="item in TrialModality"
                :key="item"
                :label="item"
                :value="item"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-form>
      </template>
      <template slot="dialog-footer">
        <el-button
          type="primary"
          @click="updateTaskStudyModality"
          :loading="loading"
        >
          {{ $t('common:button:confirm') }}
        </el-button>
        <el-button
          @click="editModality_model.visible = false"
          :loading="loading"
        >
          {{ $t('common:button:cancel') }}
        </el-button>
      </template>
    </base-model>
  </div>
</template>
<script>
import baseModel from '@/components/BaseModel'
import { getToken } from '@/utils/auth'
import { updateTaskStudyModality } from '@/api/load.js'
export default {
  name: 'studyView',
  props: {
    model_cfg: {
      type: Object,
      default: () => {
        return {}
      },
    },
    bodyPart: {
      type: Array,
      default: () => {
        return []
      },
    },
    modelList: {
      type: Array,
      default: () => {
        return []
      },
    },
    TrialModality: {
      type: Array,
      default: () => {
        return []
      },
    },
    visitTaskId: {
      type: String,
    },
    IsDicom: {
      required: true,
      type: Boolean,
      default: true,
    },
    isUpload: {
      required: true,
      type: Boolean,
      default: false,
    },
  },
  components: {
    'base-model': baseModel,
  },
  data() {
    return {
      form: {
        Modality: null,
        TaskStudyId: null,
      },
      editModality_model: {
        visible: false,
        title: this.$t('trials:uploadImage:button:edit'),
        width: '500px',
        appendToBody: true,
      },
      rules: {
        Modality: [
          {
            required: true,
            message: this.$t('trials:uploadImage:format:notModality'),
            trigger: ['blur', 'change'],
          },
        ],
      },
      loading: false,
    }
  },
  methods: {
    // 预览
    preview(row) {
      let routeData = null
      if (this.IsDicom) {
        var token = getToken()
        routeData = this.$router.resolve({
          path: `/showdicom?studyId=${row.Id}&TokenKey=${token}&type=Study&visitTaskId=${this.visitTaskId}`,
        })
      } else {
        let trialId = this.$route.query.trialId
        var token = getToken()
        routeData = this.$router.resolve({
          path: `/showNoneDicoms?trialId=${trialId}&subjectVisitId=${row.SourceSubjectVisitId}&studyId=${row.Id}&TokenKey=${token}`,
        })
      }
      window.open(routeData.href, '_blank')
    },
    // 打开编辑
    openEdit(row) {
      this.form.TaskStudyId = row.Id
      this.form.Modality = row.ModalityForEdit
      this.editModality_model.visible = true
    },
    // 修改检查类型
    async updateTaskStudyModality() {
      try {
        let validate = await this.$refs.editModalityform.validate()
        if (!validate) return false
        this.loading = true
        let res = await updateTaskStudyModality(this.form)
        this.loading = false
        if (res.IsSuccess) {
          this.modelList.some((item) => {
            if (this.form.TaskStudyId === item.Id) {
              item.ModalityForEdit = this.form.Modality
            }
            return this.form.TaskStudyId === item.Id
          })
          this.editModality_model.visible = false
          this.$emit('getList')
        }
      } catch (err) {
        console.log(err)
      }
    },
  },
}
</script>
<style lang="scss" scoped>
</style>