使用Javascript打印输出
教学视频
概述
通过引用报表中的一个Javascript文件，调用该文件中的相关方法，实现报表的预览、打印和导出功能。
引用Javascript文件
Javascript文件URL格式如下：
http[s]://host[:port]/[context-path]/baskserver/res/baskreport/js/view/BaskReport.bundle.js
在我们的HTML文件中通过上面的URL引入BaskReport中提供的名为BaskReport.bundle.js的Javascript文件后，接下来就可以在自己的Javascript代码中通过Javascript调用实现特定报表的预览、打印和导出功能。
使用Javascript调用报表
引入BaskReport.bundle.js文件后，当前的HTML文件中就可以直接使用BaskReport这个Javascript对象，这个对象中提供的方法如下表所示：
| 方法名 | 说明 | 语法 |
|---|---|---|
| doPrint | 直接打印报表文件 | BaskReport.doPrint({id:reportFileId,[parameters:{name:value},] baseUrl:reportServerUrl}); |
| doMultiPrint | 直接打印多个报表文件， 将多个报表文件合并在一个文件中打印输出 |
BaskReport.doMultiPrint({files:[ { id:reportFileId[,parameters:{name:value}] }, { id:reportFileId[,parameters:{name:value}] } ], baseUrl:reportServerUrl}); |
| doPreview | 新开窗口以HTML形式预览报表文件 | BaskReport.doPreview({id:reportFileId, [parameters:{name:value},] baseUrl:reportServerUrl}); |
| doExportWord | 直接将报表文件以word形式导出 | BaskReport.doExportWord({ id:reportFileId, [parameters:{name:value},] baseUrl:reportServerUrl}); |
| doExportExcel | 直接将报表文件以excel形式导出 | BaskReport.doExportExcel({ id:reportFileId, [parameters:{name:value},] baseUrl:reportServerUrl}); |
| doExportMultiExcel | 导出多个报表文件，将多个报表文件放在一个Excel文件不同的Sheet页中导出。 | BaskReport.doExportMultiExcel({ files:[ { id:reportFileId[,parameters:{name:value}] }, { id:reportFileId[,parameters:{name:value}] } ] baseUrl:reportServerUrl}); |
| doExportPdf | 直接将报表文件以pdf形式导出 | BaskReport.doExportPdf({ id:reportFileId, [parameters:{name:value},] baseUrl:reportServerUrl}); |
| doExportCsv | 直接将报表文件以csv形式导出 | BaskReport.doExportCsv({ id:reportFileId, [parameters:{name:value},] baseUrl:reportServerUrl}); |
| doExportMultiPdf | 直接导出多个报表文件， 将多个报表文件合并在一个pdf文件中导出 |
BaskReport.doExportMultiPdf({ files:[ { id:reportFileId[,parameters:{name:value}] }, { id:reportFileId[,parameters:{name:value}] } ] baseUrl:reportServerUrl}); |
| doSave | 调用目标iframe窗口中存在的报表填报页面里的保存功能，实现数据填报提交。 需要在当前页面中通过iframe嵌入填报页面，且需要为这个iframe指定ID值； 同时在调用这个方法时，还可以添加一个名为callback的参数用于指定保存成功后要执行的回调函数， 该函数入参只有一个，里面包含当前提交的数据（数据需要调用decodeURIComponent方法解码），文件ID等信息。 |
BaskReport.doSave({iframe:"iframeId"[,callback:function]}) |
上面的语法中，reportFileId表示具体的已发布的报表文件ID，parameters属于可选参数，baseUrl表示报表服务器的URL，比如：http://192.168.18.106:8080/baskserver-test 。
上面的方法中，都是通过具体的报表文件ID来访问报表文件，需要注意的是访问的目标报表文件必须是已发布的，否则可能会出现访问不了的情况。 上面的方法中，ID参数也可修改为code参数，使用报表的CODE也是可以。例如：
BaskReport.doPrint({code:reportFileCode,[parameters:{name:value},] baseUrl:reportServerUrl});同时在访问报表文件时，还要保证访问的URL处理登录状态。如果当前报表引擎与应用集成在一起，那么登录不是问题，如果报表引擎与应用分别位于不同的系统当中，那么需要解决登录问题，具体可参考BaskServer平台中单点登录相关介绍。在执行导出报表文件操作时，还可以添加一个name参数用于指定报表导出后的文件名称，如果不加name参数，默认则采用目标报表名称为导出后的文件名（导出多个文件则采用第一个文件的文件名）。
举例
下面的HTML中包含五个按钮，通过引用BaskReport.bundle.js文件，使用BaskReport对象提供的对应方法，实现打印单张报表、打印多张报表、预览HTML报表、导出Word以及导出多张报表到一个PDF文件的功能，JSP源码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试</title>
<script type="text/javascript" src="http://192.168.18.106:8080/baskserver-test/baskserver/res/baskreport/js/view/BaskReport.bundle.js"></script>
</head>
<body>
<button onClick="print()">打印单张报表</button>
<button onClick="multiprint()">打印多张报表</button>
<button onClick="preview()">预览HTML报表</button>
<button onClick="exportWord()">导出Word</button>
<button onClick="multiexport()">导出多张报表到一个PDF文件</button>
<script>
var REPORT_BASE_URL = 'http://192.168.18.106:8080/baskserver-test';
function print(){
BaskReport.doPrint({
id:2001,
baseUrl:REPORT_BASE_URL
});
}
function multiprint(){
BaskReport.doMultiPrint({
baseUrl:REPORT_BASE_URL,
files:[
{
id:2001
},
{
id:1501
}
]
});
}
function multiexport(){
BaskReport.doExportMultiPdf({
baseUrl:REPORT_BASE_URL,
files:[
{
id:2001
},
{
id:1501
}
]
});
}
function preview(){
BaskReport.doPreview({
baseUrl:REPORT_BASE_URL,
id:1501
});
}
function exportWord(){
BaskReport.doExportWord({
baseUrl:REPORT_BASE_URL,
id:1501
});
}
</script>
</body>
</html>
上面的例子当中，通过REPORT_BASE_URL变量定义要操作的报表文件所在的应用地址，REPORT_BASE_URL的值为：http://192.168.18.106:8080/baskserver-test ，这里的baskserver-test为应用的contextpath，需要注意的是，如果我们的应用没有contextpath，那么REPORT_BASE_URL的值就应该为：http://192.168.18.106:8080。
预览效果如下图：
