You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

51 lines
1.0 KiB

<template lang="pug">
div.preview
object(v-if="isPDF", v-bind:data="url", type="application/pdf")
embed(v-bind:src="url", type="application/pdf")
iframe(v-else-if="isWord", v-bind:src="officeViewer")
iframe(v-else, v-bind:src="url")
</template>
<style scoped>
.preview, object, iframe {
width: 100%;
height: 100%;
}
</style>
<script>
export default {
props: {
url: {
type: String,
default: '',
},
},
computed: {
fileExtension() {
const filename = new URL(this.url).pathname.split('/').pop();
const extension = filename.match(/[^#?]+/)[0].split('.').pop();
return extension.toLowerCase();
},
isPDF() {
return this.fileExtension === 'pdf';
},
isWord() {
return [
'doc',
'dot',
'docx',
'docm',
'dotm',
].indexOf(this.fileExtension) !== -1;
},
officeViewer() {
return `https://view.officeapps.live.com/op/view.aspx?src=${encodeURIComponent(this.url)}`;
},
},
};
</script>