184、HTML中,PDF版报告的展示和下载
2021-04-13 13:27
标签:width param method get query server 代码 gettime function 184、HTML中,PDF版报告的展示和下载 标签:width param method get query server 代码 gettime function 原文地址:https://www.cnblogs.com/gushixianqiancheng/p/12386837.htmlHTML中,PDF版报告的展示和下载
相关搜索:脚本编辑器;$scope.r_g_company.reportPage;文件上传中...
1、展示,在HTML中,划定一个区域,用做PDF版报告的展示
(1)封面内容:一个单独的HTML,内有动态数据插入
(2)展示内容:另一个单独的HTML,内有动态数据插入
(3)前端将配置的动态数据和起止时间参数传给后台(步骤一),后台将接收到的数据和自己过滤出来的数据插入到(1)和(2)里,然后将它俩拼成一个PDF文件返给前端、供前端下载,同时还将这个PDF文件放在服务器的一个url里,前端通过给插件jquery.media.js配置{src:url}(步骤二)来请求这个PDF文件并在划定区域里展示。
(4)相关JS代码如下
tradeApi
.query({
method: ‘post‘,
root: ‘report‘,
url: ‘/audit_report/downloads/report‘,
load: $scope.pagin_init.load(2),
data: params,//步骤一
responseType: ‘blob‘,
check_status: ‘never‘,
})
.then(function (data) {
$scope.filter_statu = 1;
$scope.pdfData = data;
if ($location.host() === ‘localhost‘) {
// 开发环境
$.get(‘/dev_config/devServerConfig.json?‘ + new Date().getTime(), {})
.then(function (dev) {
$scope.pdfSrc = dev.address + ‘/static/pdf/‘ + un_code.utf8Decode(data.headers(‘filename‘));
$(‘#handout_wrap_inner‘).media({
width: ‘100%‘,
height: ‘680px‘,
autoplay: true,
src: $scope.pdfSrc//步骤二
});
});
} else {
// 线上环境
$scope.pdfSrc = ‘../../static/pdf/‘ + un_code.utf8Decode(data.headers(‘filename‘));
$(‘#handout_wrap_inner‘).media({
width: ‘100%‘,
height: ‘680px‘,
autoplay: true,
src: $scope.pdfSrc//步骤二
});
}
});
上一篇:jQuery
文章标题:184、HTML中,PDF版报告的展示和下载
文章链接:http://soscw.com/index.php/essay/75211.html