58 lines
2.0 KiB
Vue
58 lines
2.0 KiB
Vue
<template>
|
|
<div style="overflow: auto; height: 100vh">
|
|
<vue-office-docx v-if="urlKey.includes('.doc') || urlKey.includes('.docx')" :src="url" />
|
|
<vue-office-excel
|
|
v-if="urlKey.includes('.xls') || urlKey.includes('.xlsx')"
|
|
:src="url"
|
|
:options="excelOptions"
|
|
/>
|
|
<!-- <vue-office-pdf v-if="url.includes('.pdf')" :src="url" /> -->
|
|
<iframe v-if="urlKey.includes('.pdf')" :src="url" style="width: 100%; height: 99%"></iframe>
|
|
<img
|
|
v-if="
|
|
urlKey.includes('.png') || urlKey.includes('.jpg') || urlKey.includes('.gif') || urlKey.includes('.bmp')
|
|
"
|
|
:src="url"
|
|
/>
|
|
</div>
|
|
</template>
|
|
<script lang="ts" setup>
|
|
import { useRouter } from 'vue-router'
|
|
import { ref } from 'vue'
|
|
//引入相关样式
|
|
import '@vue-office/excel/lib/index.css'
|
|
//引入VueOfficeDocx组件
|
|
import VueOfficeDocx from '@vue-office/docx'
|
|
import VueOfficeExcel from '@vue-office/excel'
|
|
//引入VueOfficePdf组件
|
|
import VueOfficePdf from '@vue-office/pdf'
|
|
import { downloadFile } from '@/api/system-boot/file'
|
|
import { previewFile } from '@/utils/fileDownLoad'
|
|
|
|
const { push, options, currentRoute } = useRouter()
|
|
const VITE_FLAG = import.meta.env.VITE_NAME == 'jibei'
|
|
// const url = 'http://192.168.1.22:9009/excelreport' + currentRoute.value.href?.split('?')[1]
|
|
const url = ref('')
|
|
const excelOptions = ref({})
|
|
const urlKey = currentRoute.value?.href?.split('?')[1]
|
|
if (VITE_FLAG) {
|
|
url.value = '/api-docx/excelreport' + currentRoute.value?.href?.split('?')[1]
|
|
excelOptions.value = ref({
|
|
xls: currentRoute.value.href?.split('?')[1].split('.')[1] == 'xls' ? true : false
|
|
})
|
|
} else {
|
|
console.log('🚀 ~ urlKey:', urlKey)
|
|
setTimeout(async () => {
|
|
const previewUrl = await previewFile(currentRoute.value?.href?.split('?')[1])
|
|
url.value = previewUrl
|
|
}, 0)
|
|
}
|
|
|
|
onMounted(() => {
|
|
// 从路由参数获取文件路径
|
|
|
|
console.log()
|
|
})
|
|
</script>
|
|
<style lang="less" scoped></style>
|