Merge branch 'master' of http://118.178.224.202:3000/ewide/zsxt_nbzs_h5
This commit is contained in:
路 范
137
FrontCode2/sunshine_levy/src/views/pdf/agreementInfo.vue
Normal file
137
FrontCode2/sunshine_levy/src/views/pdf/agreementInfo.vue
Normal file
@@ -0,0 +1,137 @@
|
||||
<template>
|
||||
<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>
|
||||
<iframe
|
||||
src="https://zsxt.nbzs.org.cn/Files/UploadFiles/e85a13ef-431c-46a5-85cd-9dd1b4f50fc6/80616f98-da17-49bc-92d0-b87199963787.pdf"
|
||||
frameborder="0"
|
||||
></iframe>
|
||||
<!-- <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 id="nav">222</div> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script src="https://cdn.bootcss.com/html2canvas/0.5.0-beta4/html2canvas.js"></script>
|
||||
<script>
|
||||
import pdf from "vue-pdf";
|
||||
import $ from "jquery";
|
||||
import html2canvas from "html2canvas";
|
||||
// import axios from "axios";
|
||||
import request from "@/common/util";
|
||||
import { mgop } from "@aligov/jssdk-mgop";
|
||||
export default {
|
||||
components: {
|
||||
pdf
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
url: ""
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.onInit();
|
||||
},
|
||||
mounted() {
|
||||
// 截图
|
||||
// html2canvas(this.$refs.PDF).then(canvas => {
|
||||
// canvas.id = "mycanvas";
|
||||
// const base64 = canvas.toDataURL("image/png");
|
||||
// jquery("a").prop("href", base64);
|
||||
// });
|
||||
},
|
||||
methods: {
|
||||
onInit() {
|
||||
this.onLoadData();
|
||||
request({
|
||||
url: "http://10.19.94.9:7099/api/agreement/info",
|
||||
method: "post",
|
||||
data: {
|
||||
ticket: window.sessionStorage.getItem("ticket"),
|
||||
id: "C655515B-FD91-48F2-BD79-EAABAFB7077C"
|
||||
},
|
||||
headers: { "Content-Type": "application/json; charset=UTF-8" },
|
||||
responseType: "arraybuffer" //一定要设置响应类型，否则页面会是空白pdf
|
||||
}).then(result => {
|
||||
console.log("请求成功了", result);
|
||||
const binaryData = [];
|
||||
binaryData.push(result.data);
|
||||
//获取blob链接
|
||||
this.url = window.URL.createObjectURL(
|
||||
new Blob(binaryData, { type: "application/pdf" })
|
||||
);
|
||||
$("a").prop("href", this.url);
|
||||
// if (pdfUrl) {
|
||||
// this.handlePrint(pdfUrl);
|
||||
// }
|
||||
});
|
||||
},
|
||||
handlePrint() {
|
||||
if (document.getElementById("print-iframe")) {
|
||||
document.body.removeChild(document.getElementById("print-iframe"));
|
||||
}
|
||||
//判断iframe是否存在，不存在则创建iframe
|
||||
let iframe = document.getElementById("print-iframe");
|
||||
if (!iframe) {
|
||||
iframe = document.createElement("IFRAME");
|
||||
let doc = null;
|
||||
iframe.setAttribute("src", this.url);
|
||||
iframe.setAttribute("id", "print-iframe");
|
||||
document.body.appendChild(iframe);
|
||||
doc = iframe.contentWindow.document;
|
||||
doc.close();
|
||||
iframe.contentWindow.focus();
|
||||
}
|
||||
iframe.contentWindow.print();
|
||||
},
|
||||
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;
|
||||
line-height: 200px;
|
||||
font-size: 30px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.bottom {
|
||||
text-align: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
@@ -50,7 +50,7 @@ export default {
|
||||
id: "C655515B-FD91-48F2-BD79-EAABAFB7077C",
|
||||
},
|
||||
appKey: "es4b8zmz+2001833218+dehllx",
|
||||
onSuccess: (result) => {
|
||||
onSuccess: result => {
|
||||
console.log("pdf.vue页面请求pdf文件:", result);
|
||||
if (result.data && result.data.success == true) {
|
||||
console.log("result.data.data:", result.data.data);
|
||||
@@ -60,9 +60,9 @@ export default {
|
||||
this.isloading = false;
|
||||
}
|
||||
},
|
||||
onFail: (err) => {
|
||||
onFail: err => {
|
||||
console.log("用户无数据，不展示");
|
||||
},
|
||||
}
|
||||
});
|
||||
},
|
||||
saveImages() {
|
||||
@@ -71,10 +71,10 @@ export default {
|
||||
ZWJSBridge.saveImage({
|
||||
url: this.apidata.pdf,
|
||||
})
|
||||
.then((result) => {
|
||||
.then(result => {
|
||||
console.log("saveImage()成功:" + JSON.stringify(result));
|
||||
})
|
||||
.catch((error) => {
|
||||
.catch(error => {
|
||||
console.log("saveImage()失败:" + JSON.stringify(result));
|
||||
console.log(error);
|
||||
});
|
||||
@@ -89,12 +89,12 @@ export default {
|
||||
.then((result) => {
|
||||
console.log("测试新开窗口():" + result);
|
||||
})
|
||||
.catch((error) => {
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
});
|
||||
});
|
||||
},
|
||||
},
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@@ -103,6 +103,7 @@ export default {
|
||||
line-height: 200px;
|
||||
font-size: 30px;
|
||||
margin-bottom: 20px;
|
||||
height: 200px;
|
||||
}
|
||||
.bottom {
|
||||
text-align: center;
|
||||
|
||||
Reference in New Issue
Block a user