Web端导出Excel时属性的设置
本帖最后由 KearneyKang 于 2020-6-17 19:04 编辑由于在导出Excel的时候，报表存在分页的情况，当导出Excel的时候会出现多个Sheet的情况。但是在实际生产中，有时候是不需要导出多个sheet的，因此就要进行一些对应属性的设置。 当使用WebViewer进行报表的渲染，然后在前端进行报表的导出时进行的属性设置由于是有Webviewer渲染报表，工具栏默认没有导出按钮的，因此需要我们自己进行对应的按钮的添加，并且在进行属性的设置。具体的实现代码如下：<script language="javascript" type="text/javascript">
var exportSelect = '<select id="ExportSelect" style="width:80px"><option selected disabled>Export</option><option value="PDF" style="background: url(images/pdf.png) right no-repeat; width: 50px">PDF</option><option value="Excel" style="background: url(images/Excel.gif) right no-repeat; width: 50px">Excel</option></select>';
$(document).ready(function () {
$(".arvToolBar").append(exportSelect);
$("#ExportSelect").change(function (e, args) {
var viewModel = GetViewModel("WebViewer1");
var valueSelected = this.value;
if (viewModel.PageLoaded()) {
switch (valueSelected) {
case "PDF":
viewModel.Export(ExportType.Pdf, function (uri) {
window.location = uri;
}, true);
break;
case "Excel":
viewModel.Export(ExportType.Xls,function (uri) {
window.location = uri;
}, true,
{ FileName: 'Test1', MultiSheet: true });//导出属性的设置
break;
}
}
});
});
</script><span style="color: black; font-family: 新宋体; font-size: 9.5pt; background-color: rgb(255, 255, 255);"> </span>当使用Html5进行报表渲染的时候，由于使用Html5进行渲染报表，工具栏里是有导出按钮的，为了整体UI的美观性，因此不需要再在页面上添加一个按钮，然后单独进行导出Excel属性的设置。可以进行如下的操作。(1)找到导出对应的JS文件，就是我们项目中引用的GrapeCity.ActiveReports.Viewer.Html.js JS文件(2)然后找到对应的导出属性设置的具体代码。(3)在进行 对应的属性的设置：exportTo: function(exportType) {
return {
exec: function() {
var options = {
FileName: viewer.report().reportName,
PreviewPages: 0 ,
Pagination: false,
MutiSheet: false
};
_isExportProcessing(!0), viewer.document().export(exportType, options, viewer.report().parameters()).done(function(exportUrl) {
if (_isExportProcessing(!1), exportUrl) {
var exportWindow = null;
try {
exportWindow = window.open(exportUrl + "&Attachment=1", "_blank"), exportWindow && exportWindow.focus();
} catch (e) {}
exportWindow || viewer.callExportCallback(exportUrl + "&Attachment=1", function(url) {
window.location = url;
});
}
});
},
enabled: _isDocReady
};
},当使用JSviewer渲染报表的时候，由于JSviewer现在的JS文件中没有提供对应的API所有我们需要自己自定义一个导出按钮，然后进行对应的导出的设置实现代码如下：viewer = GrapeCity.ActiveReports.JSViewer.create({
element: '#viewerContainer', documentLoaded: () => viewer.export('XLSX', null, true, { FileName: '1997 Annual Report1', Multisheet: false,LayoutMode:"Galley" })
});
页:
[1]