Files
tra-app/src/pages/index/preview.vue
T
2025-09-26 16:42:39 +08:00

122 lines
2.7 KiB
Vue

<template>
<view class="popup-view">
<view class="body-title">
<uv-icon class="arrow-icon" name="arrow-left" @click="backRouter()" />
文件预览
</view>
<view class="popup-view-preview" v-if="showView">
<web-view
:src="showUrl"
:fullscreen="true"
:webview-styles="{
width: '100%',
height: '100%'
}"></web-view>
</view>
</view>
</template>
<script>
import common from '@/common/common'
import { getToken, getPhoneEnvBool, getUserInfo } from '@/common/common'
import { downloadFile } from '@/api/common.js'
import { get_base_url } from '@/api/request.js'
var wv
export default {
data() {
return {
fileId: '',
showUrl: '',
// viewerUrl: '/static/pdf-view/web/viewer.html',
viewerUrl: '/static/view-pdf/pdf.html',
showView: false,
wv: null,
userParams: ''
}
},
onLoad(params) {
this.fileId = params.fileId || ''
const userInfo = getUserInfo();
this.userParams = '/' + (userInfo?.loginName??'') + '/' + (userInfo?.loginName??'');
},
onShow() {
if (getPhoneEnvBool('AND')) {
this.openPdfFn({
fileId: this.fileId
})
}else{
const base_url = get_base_url('/traask/traFilePreview/');
let fileUrl = base_url + '/traask/traFilePreview/' + this.fileId + this.userParams;
this.showUrl = fileUrl
console.log(this.showUrl,111)
}
},
onReady() {
//#ifdef APP-PLUS
var currentWebview = this.$scope.$getAppWebview()
setTimeout(() => {
wv = currentWebview.children()[0]
if(!wv) return
wv.setStyle({
top: 80
})
uni.onKeyboardHeightChange(setHeight)
}, 1000)
// #endif
},
methods: {
setHeight(res){
//#ifdef APP-PLUS
if(!wv) return
wv.setStyle({
top: res.height + 20
})
// #endif
},
backRouter() {
common.navigateBack()
},
openPdfFn(data) {
const base_url = get_base_url('/traask/traFilePreview/')
let _id = data?.fileId
let fileUrl = base_url + '/traask/traFilePreview/' + _id + this.userParams
this.showUrl = this.viewerUrl + '?url=' + fileUrl
console.log(this.showUrl)
this.showView = true
}
}
}
</script>
<style lang="scss" scoped>
.popup-view {
width: 100vw;
height: 100vh;
}
.body-title {
height: 90rpx;
text-align: center;
font-size: 33rpx;
padding-top: 10rpx;
line-height: 46rpx;
box-sizing: border-box;
background-color: #fff;
font-weight: 500;
color: #000;
position: fixed;
top: var(--status-bar-height);
left: 0;
width: 100vw;
z-index: 10000;
// margin-bottom: 23rpx;
.arrow-icon {
position: absolute;
left: 21rpx;
top: 5rpx;
color: #000;
padding: 15rpx;
// background-color: red;
}
}
</style>