angular-ui / ui-grid

UI Grid: an Angular Data Grid
http://ui-grid.info
MIT License
5.39k stars 2.47k forks source link

Column footer row is not exported to PDF #5967

Open sashberd opened 7 years ago

sashberd commented 7 years ago

I was implemented PDF eporting and found that there is no was to export column agregation footer to pdf as pdf footer or part of the table at all. E.g. I have next grid: image

$this.gridOptions = {
                    enableSorting: false,
                    enableColumnMenus: false,
                    minRowsToShow: 4,
                    showColumnFooter: true,
                    appScopeProvider: $this,
                    data: response.data,
                    enableHorizontalScrollbar: 0,
                    enableVerticalScrollbar: 0,
                    enableGridMenu: false,
                    exporterPdfDefaultStyle: { fontSize: 9 },
                    exporterPdfTableStyle: { margin: [30, 30, 30, 30] },
                    exporterPdfTableHeaderStyle: { fontSize: 10, bold: true, italics: true, color: 'white', fillColor: '#6495ED' },
                    exporterPdfHeader: { text: "Over Speeding Distribution By Amount Report", style: 'headerStyle' },
                    exporterPdfFooter: function (currentPage, pageCount) {
                        return { text: currentPage.toString() + ' of ' + pageCount.toString(), style: 'footerStyle' };
                    },
                    exporterPdfCustomFormatter: function (docDefinition) {
                        docDefinition.styles.headerStyle = { fontSize: 22, bold: true };
                        docDefinition.styles.footerStyle = { fontSize: 10, bold: true };
                        docDefinition.content[0].table.body.forEach(function (item, index, array) {
                            if (index && index != array.length - 1) {
                                item.forEach(function (cell, ind,arr) {
                                    if(!ind)
                                        arr[ind] = { text: cell, fillColor: $this.gridOptions.data[index].colors.medium,color:'white' }
                                    else
                                        arr[ind] = { text: cell, fillColor: '#FFF8DC',color:'black' }
                                });
                            }
                        });
                        return docDefinition;
                    },
                    exporterPdfOrientation: 'portrait',
                    exporterPdfPageSize: 'LETTER',
                    exporterPdfMaxGridWidth: 500,
                    onRegisterApi: function(gridApi){
                        $this.gridApi = gridApi;
                    },
                    downloadPDF: function () {
                        $this.gridApi.exporter.pdfExport(uiGridExporterConstants.VISIBLE, uiGridExporterConstants.ALL);
                    },
                    columnDefs: [
                    {
                        name: 'Occurences',
                        field: 'OVERSPEED_AMOUNT',
                        width: 100,
                        cellTemplate: '<div ng-style="colRenderIndex?{\'background-color\':\'{{grid.options.data[rowRenderIndex].colors.light}}\'}:{\'background-color\':\'{{grid.options.data[rowRenderIndex].colors.medium}}\';\'color\':\'white\'}" class="ui-grid-cell-contents" >{{COL_FIELD }}</div>'
                    },
                    {
                        name: 'Vehicles',
                        field: 'VEHCILES_COUNT',
                        width: 100,
                        cellTemplate: '<div ng-style="colRenderIndex?{\'background-color\':\'{{grid.options.data[rowRenderIndex].colors.light}}\'}:{\'background-color\':\'{{grid.options.data[rowRenderIndex].colors.medium}}\';\'color\':\'white\'}" class="ui-grid-cell-contents" >{{COL_FIELD }}</div>',
                        aggregationType: uiGridConstants.aggregationTypes.sum,
                        footerCellTemplate: '<div class="ui-grid-cell-contents" >Total: {{col.getAggregationValue()}}</div>'
                    },
                     {
                         name: '%',
                         width: '*',
                         field: 'percentage',
                         cellTemplate: '<div ng-style="colRenderIndex?{\'background-color\':\'{{grid.options.data[rowRenderIndex].colors.light}}\'}:{\'background-color\':\'{{grid.options.data[rowRenderIndex].colors.medium}}\'}" class="ui-grid-cell-contents" >{{COL_FIELD }}</div>',
                         footerCellTemplate: '<img ng-click="grid.options.downloadPDF()" class="reports" src="js/dist/css/images/reports.png"/>'
                     }
                    ]
                };

When I export this table to PDF I get: image Is this a known issue that is still not implemented or I`m doing something wrong

phyzalis commented 5 years ago

anything new about this?