151 lines
3.4 KiB
Vue
151 lines
3.4 KiB
Vue
<template>
|
||
<s-layout title="发票预览" class="invoice_preview">
|
||
<view class="invoicePreview_box">
|
||
<!-- <view class="downloadBtn" @click.stop="handleDownload()">下载</view> -->
|
||
<!-- <web-view :src="showUrl" :fullscreen="false"></web-view> -->
|
||
|
||
<view class="sameBtn wenj" @click="lookfile" >
|
||
点击预览发票
|
||
</view>
|
||
|
||
<view class="sameBtn goDownloadbtn" @tap.stop="copyTodownload">复制pdf地址去浏览器下载</view>
|
||
</view>
|
||
|
||
</s-layout>
|
||
</template>
|
||
|
||
<script setup>
|
||
import {
|
||
ref,
|
||
onUnmounted
|
||
} from 'vue';
|
||
import {
|
||
onLoad,
|
||
onUnload
|
||
} from '@dcloudio/uni-app';
|
||
import sheep from '@/sheep';
|
||
let timerId = null;
|
||
let showUrl = ref('')
|
||
onLoad((options) => {
|
||
showUrl.value = options.invoiceUrl || 'https://xcx.dfhg888.cn/admin-api/infra/file/29/get/pp1.pdf'
|
||
// downloadFile()
|
||
// handleDownload()
|
||
// checkAndDownloadFile(showUrl.value);
|
||
|
||
// lookfile();
|
||
|
||
// timerId = setTimeout(() => {
|
||
// copyTodownload();
|
||
// }, 3000);
|
||
})
|
||
|
||
// onUnload(()=>{
|
||
// if (timerId) {
|
||
// clearTimeout(timerId);
|
||
// timerId = null;
|
||
// }
|
||
// })
|
||
const lookfile=()=>{
|
||
uni.showToast({
|
||
title: '加载中',
|
||
duration: 5000,
|
||
icon:"loading"
|
||
});
|
||
uni.downloadFile({
|
||
url: showUrl.value, //文件名
|
||
success: function (res) {
|
||
var pdffilePath = res.tempFilePath;
|
||
uni.openDocument({
|
||
filePath: pdffilePath,
|
||
showMenu: true,
|
||
success: function (res) {
|
||
console.log('打开文档成功');
|
||
uni.hideToast();
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
|
||
const copyTodownload = () => {
|
||
uni.showModal({
|
||
title: '复制下载',
|
||
content: `是否复制地址去浏览器下载？`,
|
||
success: function(modalRes) {
|
||
if (modalRes.confirm) {
|
||
// 用户确认后开始下载
|
||
// downloadFile(fileUrl);
|
||
uni.setClipboardData({
|
||
data: showUrl.value,
|
||
success: function() {
|
||
console.log('success');
|
||
}
|
||
})
|
||
|
||
} else if (modalRes.cancel) {
|
||
console.log('用户取消复制');
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
const handleDownload = () => {
|
||
// 调用函数，传入文件URL
|
||
console.log("点击了")
|
||
// checkAndDownloadFile(showUrl.value);
|
||
uni.downloadFile({
|
||
url: showUrl.value, // 下载文件的URL地址
|
||
success: function(res) {
|
||
if (res.statusCode === 200) {
|
||
// 下载成功，res.tempFilePath为临时文件路径
|
||
console.log('下载成功，临时文件路径为：', res.tempFilePath);
|
||
|
||
// 接下来可以使用uni.saveFile保存到本地
|
||
uni.saveFile({
|
||
tempFilePath: res.tempFilePath, // 刚才下载得到的临时文件路径
|
||
success: function(saveRes) {
|
||
|
||
console.log('文件已保存到本地，路径为：', saveRes.savedFilePath);
|
||
sheep.$helper.toast('保存成功!');
|
||
}
|
||
});
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.invoicePreview_box {
|
||
width: 100%;
|
||
.sameBtn{
|
||
width: 75%;
|
||
height: 100rpx;
|
||
border: 1rpx solid #D2D1D1;
|
||
margin: 80rpx auto ;
|
||
text-align: center;
|
||
line-height: 100rpx;
|
||
font-weight: bold;
|
||
color: #7d9337;
|
||
border-radius: 100rpx;
|
||
font-size: 30rpx;
|
||
}
|
||
}
|
||
|
||
.downloadBtn {
|
||
// position: absolute;
|
||
// top: 80vh;
|
||
width: 300rpx;
|
||
color: #7d9337;
|
||
line-height: 41px;
|
||
// left: 50%;
|
||
// transform: translate(-50%, -50%);
|
||
border: 1rpx solid #7d9337;
|
||
height: 80rpx;
|
||
border-radius: 100rpx;
|
||
text-align: center;
|
||
font-size: 36rpx;
|
||
cursor: pointer;
|
||
}
|
||
</style> |