79 lines
2.0 KiB
Plaintext
79 lines
2.0 KiB
Plaintext
<template>
|
|
<div class="preview-wrapper">
|
|
<iframe
|
|
v-if="fileType.indexOf('jpg') !== -1 || fileType.indexOf('png') !== -1"
|
|
frameborder="0"
|
|
:src="filePath"
|
|
width="100%"
|
|
height="100%"
|
|
/>
|
|
<!-- <embed v-else-if="fileType.indexOf('pdf') !== -1" :src="filePath+'#toolbar=0'" style="width: 100%; height: 100%"> -->
|
|
<!-- <iframe v-else-if="fileType.indexOf('pdf') !== -1" :src="filePath+'#toolbar=0'" width="100%" height="100%" frameborder="0" /> -->
|
|
<iframe v-else-if="fileType.indexOf('pdf') !== -1" :src="`/static/pdfjs/web/viewer.html?file=${filePath}?userName=${name}%26email=932230508@qq.com`" width="100%" height="100%" frameborder="0" />
|
|
<!-- <pdf-->
|
|
<!-- v-else-if="fileType.indexOf('pdf') !== -1"-->
|
|
<!-- :src="`/static/pdfjs/web/viewer.html?file=${filePath}`">-->
|
|
<!-- </pdf>-->
|
|
<div v-else>
|
|
{{ $t('common:message:downloadFile') }}
|
|
<el-link type="primary" @click="downLoadFile">{{ $t('common:button:download') }}</el-link>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import {mapGetters} from "vuex";
|
|
|
|
export default {
|
|
name: 'PreviewFile',
|
|
computed: {
|
|
...mapGetters(['name'])
|
|
},
|
|
props: {
|
|
filePath: {
|
|
type: String,
|
|
required: true
|
|
},
|
|
fileType: {
|
|
type: String,
|
|
required: true
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
currentUser: zzSessionStorage.getItem('userName')
|
|
}
|
|
},
|
|
mounted() {
|
|
// document.querySelector('iframe').attachEvent('onload', () => {
|
|
// document.querySelector('iframe').contentDocument.oncontextmenu = function() {
|
|
// console.log('本站禁止此操作')
|
|
// return false
|
|
// }
|
|
// })
|
|
},
|
|
methods: {
|
|
// 下载文件
|
|
downLoadFile() {
|
|
if (!this.filePath) return
|
|
window.open(this.filePath, '_blank')
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss">
|
|
.preview-wrapper{
|
|
height: 100%;
|
|
width:100%;
|
|
padding: 10px;
|
|
::-webkit-scrollbar {
|
|
width: 7px;
|
|
height: 7px;
|
|
}
|
|
::-webkit-scrollbar-thumb {
|
|
border-radius: 10px;
|
|
background: #d0d0d0;
|
|
}
|
|
|
|
}
|
|
</style>
|