ActiveReportsJS Viewer 打印功能
ActiveReportJS Viewer 提供了打印
按钮 ,当报表加载完成后,可点击打印按钮进行报表打印。 除此之外,Viewer提供了打印方法API。一键打印报表
ActiveReportsJS 提供了一键打印的 API ,即在不预览报表情况下,可以直接打印,代码示例:
|
也可以在导出报表为PDF 文件或者HTML 文档的时候,设置自动打印
为 true
。当报表导出完成后会立即进行打印。
下面我们来讲讲如何实现无预览打印实现参数过滤
1、新建一个项目,项目名称"noviewerprint"
使用 Vue CLI创建项目
|
2、安装 ActivereportsJS npm 包
可通过安装@grapecity/activereports-vue npm 包来安装activereports vue相关的文件。 @grapecity/activereports 包提供了核心功能。 在项目的根目录下执行以下命令:
|
3、打开项目中的 app.Vue 项目,进行无预览导出PDF的设置
|
4、导出PDF进行参数传递的实现
<template> <image id="pdf" type="application/pdf" width="100%" height="800px" /> </template> <script> import "@grapecity/activereports/styles/ar-js-ui.css"; import "@grapecity/activereports/styles/ar-js-viewer.css"; import { Core, PdfExport } from "@grapecity/activereports"; import { FontStore } from "@grapecity/activereports/core"; FontStore.registerFonts("/fonts/fontsConfig.json"); const pdfExportSettings= { title: "Test document", author: "GrapeCity", keywords: "export, report", subject: "Report", pdfVersion: "1.4", }; var report = new Core.PageReport(); report.load("参数赋值.rdlx-json") .then(() => { report._parameters.P1.values[0] = '11';//给报表参数赋值 return report.run() }) .then((doc) => { PdfExport.exportDocument(doc,pdfExportSettings).then((result)=> { //result.download("exportedreport.pdf"); window.open(URL.createObjectURL(result.data)) } ); }); </script> <style> #viewer-host { width: 100%; height: 100vh; } </style>
5、预览结果
6、demo下载