This commit is contained in:
路 范
2021-09-18 10:54:55 +08:00
26 changed files with 260 additions and 293 deletions

View File

@@ -1,22 +1,27 @@
<template>
<div>
<pdf :src="url"></pdf>
<div ref="content" class="content">被保存的内容</div>
<div ref="content" class="content">
<pdf :src="url" class="PDF"></pdf>
</div>
<div class="bottom">
<a href="" download="">
<el-button type="primary">保存到相册</el-button>
</a>
</div>
<el-button type="primary" @click="this.savePdf()">测试2</el-button>
<el-button type="primary" @click="this.handlePrint()">测试3</el-button>
<el-button type="primary" @click="testdownload4()">测试4</el-button>
</div>
</template>
<script src="https://cdn.bootcss.com/html2canvas/0.5.0-beta4/html2canvas.js"></script>
<script>
import pdf from "vue-pdf";
import jquery from "jquery";
import $ from "jquery";
import html2canvas from "html2canvas";
import axios from "axios";
// import axios from "axios";
import request from "@/common/util";
import { mgop } from "@aligov/jssdk-mgop";
export default {
components: {
pdf,
@@ -32,7 +37,7 @@ export default {
},
mounted() {
// 截图
html2canvas(this.$refs.content).then((canvas) => {
html2canvas(this.$refs.PDF).then((canvas) => {
canvas.id = "mycanvas";
const base64 = canvas.toDataURL("image/png");
jquery("a").prop("href", base64);
@@ -42,10 +47,10 @@ export default {
onInit() {
this.onLoadData();
request({
url: "http://localhost:5566/agreement/info",
url: "http://10.19.94.9:7099/api/agreement/info",
method: "post",
data: {
ticket: "8a1188557bda7894017bed584f803119-ticket",
ticket: window.sessionStorage.getItem("ticket"),
id: "C655515B-FD91-48F2-BD79-EAABAFB7077C",
},
headers: { "Content-Type": "application/json; charset=UTF-8" },
@@ -57,36 +62,43 @@ export default {
this.url = window.URL.createObjectURL(
new Blob(binaryData, { type: "application/pdf" })
);
$("a").prop("href", this.url);
// if (pdfUrl) {
// this.handlePrint(pdfUrl);
// }
});
// axios({
// method: "post",
// url: "http://10.19.94.9:7099/api/agreement/info",
// responseType: "blob",
// data: {
// ticket: "8a1188557bda7894017bed584f803119-ticket",
// id: "C655515B-FD91-48F2-BD79-EAABAFB7077C",
// },
// }).then((res) => {
// debugger;
// console.log(res);
// if (!res) {
// return;
// }
// let blob = new Blob([res.data], {
// type: "application/octet-stream",
// });
// let url = window.URL.createObjectURL(blob);
// let link = document.createElement("a");
// link.style.display = "none";
// link.href = url;
// document.body.appendChild(link);
// link.click();
// });
mgop({
api: "mgop.kykj.houseexpropriat.getagreementinfo",
host: "https://mapi.zjzwfw.gov.cn/",
dataType: "JSON",
type: "POST",
data: {
ticket: "8a1189377bdad67c017bf66039d76376-ticket",
id: "C655515B-FD91-48F2-BD79-EAABAFB7077C",
},
appKey: "es4b8zmz+2001833218+dehllx",
onSuccess: (result) => {
console.log("pdf.vue页面请求pdf文件:", result);
if (result.data && result.data.success == true) {
console.log("result.data.data:", result.data.data);
this.url = result.data.data;
// const binaryData = [];
// binaryData.push(result.data);
// //获取blob链接
// this.url = window.URL.createObjectURL(
// new Blob(binaryData, { type: "application/pdf" })
// );
// if (pdfUrl) {
// this.handlePrint(pdfUrl);
// }
}
},
onFail: (err) => {
console.log("用户无数据,不展示");
},
});
},
handlePrint(pdf) {
handlePrint() {
if (document.getElementById("print-iframe")) {
document.body.removeChild(document.getElementById("print-iframe"));
}
@@ -95,7 +107,7 @@ export default {
if (!iframe) {
iframe = document.createElement("IFRAME");
let doc = null;
iframe.setAttribute("src", pdf);
iframe.setAttribute("src", this.url);
iframe.setAttribute("id", "print-iframe");
document.body.appendChild(iframe);
doc = iframe.contentWindow.document;
@@ -108,15 +120,44 @@ export default {
// console.log(this.$route.params);
// this.url = this.$route.params.url;
},
savePdf() {
ZWJSBridge.onReady(() => {
console.log("初始化完成后执行bridge方法-savePdf");
ZWJSBridge.saveImage({
url: this.url,
})
.then((result) => {
console.log("saveImage()成功:" + JSON.stringify(result));
})
.catch((error) => {
console.log("saveImage()失败:" + JSON.stringify(result));
console.log(error);
});
});
},
testdownload4() {
ZWJSBridge.onReady(() => {
console.log("初始化完成后执行bridge方法-testdownload4");
ZWJSBridge.openLink({
url: this.url,
})
.then((result) => {
console.log("testdownload4():" + result);
})
.catch((error) => {
console.log(error);
});
});
},
},
};
</script>
<style lang="less" scoped>
.content {
text-align: center;
height: 200px;
line-height: 200px;
font-size: 30px;
margin-bottom: 20px;
}
.bottom {
text-align: center;