最新历史版本 :自定义批量导出按钮 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 应用场景

用户有以下需求时:

  • 所有的表都放在一个 Excel 里面,然后分不同的 sheet 。

  • 多个普通报表,通过一个 url ,导出包含多个报表的 Excel 。

  • 十几个不同的模板,每个模板都有不同的参数,然后批量导出 Excel 。

  • 一次导出多个报表。

可参考本文方法实现。

1.2 功能简介

本文提供多个报表同时导出成某种格式的方法。

注:本文方法适用于普通报表。

2. 实现思路编辑

2.1 代码示例

增加一段 JS 代码,实现点击按钮后导出地区参数为「华北」的 Parameter.cpt 和无参数 Cross.cpt 到 Excel 中,代码如下:

http://localhost:8075/webroot/decision/view/report?reportlets=
[{reportlet:"/doc/Primary/Parameter/Parameter.cpt",地区:"华北"},
{reportlet:"/doc/Primary/CrossReport/Cross.cpt"}]
&format=excel&__filename__=export 

注:URL 不能直接访问,浏览器可能不支持[] / {} 特殊符号,因此需要进行 编码转换 后才能直接访问使用。上述示例编码后为:

http://localhost:8075/webroot/decision/view/report?reportlets=%5B%7Breportlet%3A%22%2Fdoc%2FPrimary%2FParameter%2FParameter.cpt
%22%2C%E5%9C%B0%E5%8C%BA%3A%22%E5%8D%8E%E5%8C%97%22%7D%2C%7Breportlet
%3A%22%2Fdoc%2FPrimary%2FCrossReport%2FCross.cpt%22%7D%5D
&format=excel&__filename__=export

2.2 代码介绍

利用「window.open」来打开带导出参数 URL 的方式来实现 Excel 导出。相关参数如下所示:

  参数示例  
1)报表中无参数时:
[{reportlet:"/doc/reportname.cpt"},{reportlet:"/doc/reportname.cpt"},{...}] 
 
其中{reportlet:"/doc/reportname.cpt"},是模板的访问路径
[{reportlet:"/doc/Primary/CrossReport/Cross.cpt"},{reportlet:"/doc/Primary/DetailReport/Details.cpt"}] 
2)报表中有参数时:
[{reportlet:"/doc/reportname.cpt",paraname1:"paravalue1",paraname2:"paravalue2",...},{reportlet:"/doc/reportname.cpt",paraname1:"paravalue1",paraname2:"paravalue2",...},{...}]
paraname1:"paravalue1",是指导出各模板内容时,对应的参数名和参数值,多个参数中间用逗号隔开

 [{reportlet:"/doc/Primary/Parameter/Parameter.cpt",地区:"华北"},{reportlet:"/doc/Primary/CrossReport/Cross.cpt"}]
  &format=XX,format后面的 XX,是指导出文件的格式 &format=excel 批量导出时导出的是一个文件,多个报表导出后为一个包含多个 sheet 的 excel 文件
 &__filename__=name,对导出的文件重命名"name"就是自定义的文件名&__filename__=export 重命名为 export

3. 操作步骤编辑

3.1 模板准备

使用模板:

  • %FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Primary\Parameter\Parameter.cpt

  • %FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Primary\CrossReport\Cross.cpt

3.2 新建 HTML 文件

1)增加一段 JS 代码,实现点击按钮后导出地区参数为「华北」的 Parameter.cpt 和无参数 Cross.cpt 到 Excel 中,代码如下:

var reportlets = "[{reportlet: '/doc/Primary/Parameter/Parameter.cpt',地区: '华北'}, {reportlet: '/doc/Primary/CrossReport/Cross.cpt'}]"
function clickEvent() {
     window.open(encodeURI('/webroot/decision/view/report?reportlets=' + reportlets + '&format=excel'));
}

完整代码如下所示:

点击下载文件:export.html

注:自定义批量导出时,如果在导出的同时还在下载多个文件,推荐将浏览器的安全级别降低,避免被浏览器将导出文件判定为不安全文件。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>FineReport自定义导出</title>
</head>
<script type="text/javascript">
    var reportlets = "[{reportlet: '/doc/Primary/Parameter/Parameter.cpt',地区: '华北'}, {reportlet: '/doc/Primary/CrossReport/Cross.cpt'}]"
    function clickEvent() {
        window.open(encodeURI('/webroot/decision/view/report?reportlets=' + reportlets + '&format=excel'));
    }
</script>
<body>
<button
        type="button"
        onclick= clickEvent()>导出[Excel]
</button>
</body>
</html>

2)将export.html放置到%FR_HOME%\webapps\webroot\help\page_demo路径下,如下图所示:

1634867970238032.png

3.3 效果预览

启动 FineReport 工程,在浏览器端输入http://localhost:8075/webroot/help/page_demo/export.html,点击「导出 Excel」,即可导出 Excel,效果如下图所示:

1601012701187559.gif