101 lines
		
	
	
		
			2.9 KiB
		
	
	
	
		
			Plaintext
		
	
	
			
		
		
	
	
			101 lines
		
	
	
		
			2.9 KiB
		
	
	
	
		
			Plaintext
		
	
	
<template>
 | 
						|
  <div v-loading="loading" class="preview-wrapper">
 | 
						|
    <el-tabs tab-position="right" type="card">
 | 
						|
      <el-tab-pane v-for="file in fileList" :key="file.Id" :label="file.FileName">
 | 
						|
 | 
						|
        <iframe
 | 
						|
          v-if="file.Type.indexOf('jpg') !== -1 || file.Type.indexOf('png') !== -1"
 | 
						|
          frameborder="0"
 | 
						|
          :src="file.FullFilePath"
 | 
						|
          width="100%"
 | 
						|
          height="100%"
 | 
						|
        />
 | 
						|
        <!-- <embed v-else-if="file.Type.indexOf('pdf') !== -1" :src="file.FullFilePath" style="width: 100%; height: 100%"> -->
 | 
						|
        <!-- <iframe v-else-if="file.Type.indexOf('pdf') !== -1" :src="file.FullFilePath+'#toolbar=0'" width="100%" height="100%" frameborder="0" /> -->
 | 
						|
        <iframe v-else-if="file.Type.indexOf('pdf') !== -1" :src="`/static/pdfjs/web/viewer.html?file=${file.FullFilePath}`" width="100%" height="100%" frameborder="0" />
 | 
						|
        <div v-else>
 | 
						|
          {{ $t('common:message:downloadFile') }}
 | 
						|
          <el-link type="primary" @click="downLoadFile(file.FullFilePath)">{{ $t('common:button:download') }}</el-link>
 | 
						|
        </div>
 | 
						|
      </el-tab-pane>
 | 
						|
    </el-tabs>
 | 
						|
  </div>
 | 
						|
</template>
 | 
						|
<script>
 | 
						|
 | 
						|
import { getNoneDicomStudyFileList } from '@/api/trials'
 | 
						|
import store from '@/store'
 | 
						|
import { changeURLStatic } from '@/utils/history.js'
 | 
						|
export default {
 | 
						|
  name: 'SingleNoneDicom',
 | 
						|
  data() {
 | 
						|
    return {
 | 
						|
      fileType: '',
 | 
						|
      fileUrl: '',
 | 
						|
      loading: false,
 | 
						|
      fileList: [],
 | 
						|
      noneDicomId: ''
 | 
						|
    }
 | 
						|
  },
 | 
						|
  mounted() {
 | 
						|
    if (this.$router.currentRoute.query.TokenKey) {
 | 
						|
      store.dispatch('user/setToken', this.$router.currentRoute.query.TokenKey)
 | 
						|
      changeURLStatic('TokenKey', '')
 | 
						|
    }
 | 
						|
    this.noneDicomId = this.$router.currentRoute.query.Id
 | 
						|
    this.getFileList()
 | 
						|
  },
 | 
						|
  methods: {
 | 
						|
    getFileList() {
 | 
						|
      this.loading = true
 | 
						|
      getNoneDicomStudyFileList(this.noneDicomId).then(res => {
 | 
						|
        this.fileList = res.Result
 | 
						|
        this.fileList.forEach(file => {
 | 
						|
          const fileName = file.FileName
 | 
						|
          file.Type = fileName.substring(fileName.lastIndexOf('.') + 1).toLocaleLowerCase()
 | 
						|
        })
 | 
						|
        this.loading = false
 | 
						|
      }).catch(() => { this.loading = false })
 | 
						|
    },
 | 
						|
    downLoadFile(filePath) {
 | 
						|
      if (!filePath) return
 | 
						|
      window.open(filePath, '_blank')
 | 
						|
    }
 | 
						|
  }
 | 
						|
}
 | 
						|
</script>
 | 
						|
<style lang="scss">
 | 
						|
.preview-wrapper{
 | 
						|
  height: 100%;
 | 
						|
  ::-webkit-scrollbar {
 | 
						|
    width: 7px;
 | 
						|
    height: 7px;
 | 
						|
  }
 | 
						|
  ::-webkit-scrollbar-thumb {
 | 
						|
    border-radius: 10px;
 | 
						|
    background: #d0d0d0;
 | 
						|
  }
 | 
						|
  .el-tabs{
 | 
						|
    display: flex;
 | 
						|
    flex-direction: row !important;
 | 
						|
    width: 100%;
 | 
						|
    height: 100%;
 | 
						|
    .el-tabs__header{
 | 
						|
      margin-right: 10px !important;
 | 
						|
      height: 100% !important;
 | 
						|
      width: 300px;
 | 
						|
      border: 2px solid #E4E7ED;
 | 
						|
     overflow: auto;
 | 
						|
    }
 | 
						|
    .el-tabs__content{
 | 
						|
      flex: 1;
 | 
						|
      height: 100%;
 | 
						|
      .el-tab-pane{
 | 
						|
        height: 100%;
 | 
						|
      }
 | 
						|
    }
 | 
						|
  }
 | 
						|
 | 
						|
}
 | 
						|
</style>
 |