From bc37cb4d63f00ef3e49e2a8f14b6efad11107be0 Mon Sep 17 00:00:00 2001 From: Kevin Clark Date: Mon, 18 Dec 2017 22:25:39 -0600 Subject: [PATCH] Excel export with npm instructions, fix error on menu and more examples (#6506) * Initial checkin of export to excel. No examples or unit tests * Eliminate $$hashKey and uidPrefix = 'uiGrid' from export * Sheet name cannot be empty string or it causes export errors. Default to 'Sheet1' * Additional languages * Add documentation * fix syntax causing lint errors. Check if not a tree when exporting to prevent error * Updated example with colors * Update unit tests and fix the lodash version for import to remove ambiguity. * Update comments * Fix menu under strict mode from throwing error * Updated directions for npm and add more formatting examples * Fix test cases for excel export that was a merge error --- misc/tutorial/206_exporting_data.ngdoc | 5 +++ .../410_excel_exporting_data_and_header.ngdoc | 40 ++++++++++++++--- src/features/exporter/test/exporter.spec.js | 45 ++++++++++++++++++- 3 files changed, 82 insertions(+), 8 deletions(-) diff --git a/misc/tutorial/206_exporting_data.ngdoc b/misc/tutorial/206_exporting_data.ngdoc index 4865e60302..a38b68bf5b 100644 --- a/misc/tutorial/206_exporting_data.ngdoc +++ b/misc/tutorial/206_exporting_data.ngdoc @@ -18,6 +18,11 @@ available through: 
  bower install lodash
   bower install jszip#2.6.1
   bower install excelbuilder
+or + +
  npm install lodash
+  npm install jszip@2.6.1
+  npm install excel-builder
The options and API for exporter can be found at {@link api/ui.grid.exporter ui.grid.exporter}, and diff --git a/misc/tutorial/410_excel_exporting_data_and_header.ngdoc b/misc/tutorial/410_excel_exporting_data_and_header.ngdoc index e4738c0dba..a280e5a77e 100644 --- a/misc/tutorial/410_excel_exporting_data_and_header.ngdoc +++ b/misc/tutorial/410_excel_exporting_data_and_header.ngdoc @@ -17,6 +17,13 @@ available through: bower install jszip#2.6.1 bower install excelbuilder +or + +
  npm install lodash
+  npm install jszip@2.6.1
+  npm install excel-builder
+ + The options and API for exporter can be found at {@link api/ui.grid.exporter ui.grid.exporter}, and - {@link api/ui.grid.exporter.api:ColumnDef columnDef} @@ -48,7 +55,9 @@ In this example we use the native grid menu buttons, and we show the pdf, csv an columnDefs: [ { field: 'name' }, { field: 'gender', visible: false}, - { field: 'company' } + { field: 'company' }, + { field: 'member' }, + { field: 'total' } ], enableGridMenu: true, enableSelectAll: true, @@ -74,8 +83,14 @@ In this example we use the native grid menu buttons, and we show the pdf, csv an exporterExcelCustomFormatters: function ( grid, workbook, docDefinition ) { var stylesheet = workbook.getStyleSheet(); + var stdStyle = stylesheet.createFontStyle({ + size: 9, fontName: 'Calibri' + }); + var boldStyle = stylesheet.createFontStyle({ + size: 9, fontName: 'Calibri', bold: true + }); var aFormatDefn = { - "font": { "size": 9, "fontName": "Calibri", "bold": true }, + "font": boldStyle.id, "alignment": { "wrapText": true } }; var formatter = stylesheet.createFormat(aFormatDefn); @@ -83,10 +98,14 @@ In this example we use the native grid menu buttons, and we show the pdf, csv an $scope.formatters['bold'] = formatter; aFormatDefn = { - "font": { "size": 9, "fontName": "Calibri" }, + "font": stdStyle.id, "fill": { "type": "pattern", "patternType": "solid", "fgColor": "FFFFC7CE" }, "alignment": { "wrapText": true } }; + var singleDefn = { + font: stdStyle.id, + format: '#,##0.0' + }; formatter = stylesheet.createFormat(aFormatDefn); // save the formatter $scope.formatters['red'] = formatter; @@ -99,14 +118,17 @@ In this example we use the native grid menu buttons, and we show the pdf, csv an // this can be defined outside this method var stylesheet = workbook.getStyleSheet(); var aFormatDefn = { - "font": { "size": 9, "fontName": "Calibri", "bold": true }, - "alignment": { "wrapText": true } - }; + "font": { "size": 11, "fontName": "Calibri", "bold": true }, + "alignment": { "wrapText": true } + }; var formatterId = stylesheet.createFormat(aFormatDefn); + // excel cells start with A1 which is upper left corner sheet.mergeCells('B1', 'C1'); var cols = []; + // push empty data cols.push({ value: '' }); + // push data in B1 cell with metadata formatter cols.push({ value: 'My header that is long enough to wrap', metadata: {style: formatterId.id} }); sheet.data.push(cols); }, @@ -114,7 +136,7 @@ In this example we use the native grid menu buttons, and we show the pdf, csv an // set metadata on export data to set format id. See exportExcelHeader config above for example of creating // a formatter and obtaining the id var formatterId = null; - if (cellValue && cellValue.startsWith('W')) { + if (cellValue && typeof cellValue === 'string' && cellValue.startsWith('W')) { formatterId = $scope.formatters['red'].id; } @@ -131,6 +153,10 @@ In this example we use the native grid menu buttons, and we show the pdf, csv an $http.get('/data/100.json') .success(function(data) { + for (var i=0; i < data.length; i++) { + data[i].member = false; + data[i].total = i + 0.1; + } $scope.gridOptions.data = data; }); diff --git a/src/features/exporter/test/exporter.spec.js b/src/features/exporter/test/exporter.spec.js index a5fe22a951..fe8233bf7f 100644 --- a/src/features/exporter/test/exporter.spec.js +++ b/src/features/exporter/test/exporter.spec.js @@ -82,7 +82,7 @@ describe('ui.grid.exporter', function() { grid.api.registerMethodsFromObject.calls.reset(); }); describe('public events', function() { - it('should define exporter public events as an empty object', function() { + it('should define exporter public events as an empty object', function () { expect(publicEvents.exporter).toEqual({}); }); }); @@ -115,6 +115,49 @@ describe('ui.grid.exporter', function() { }); }); + describe('defaultGridOptions', function() { + var options; + + beforeEach(function () { + options = {}; + }); + + it('set all options to default', function () { + uiGridExporterService.defaultGridOptions(options); + expect(options).toEqual({ + exporterSuppressMenu: false, + exporterMenuLabel: 'Export', + exporterCsvColumnSeparator: ',', + exporterCsvFilename: 'download.csv', + exporterPdfFilename: 'download.pdf', + exporterOlderExcelCompatibility: false, + exporterIsExcelCompatible: false, + exporterPdfDefaultStyle: {fontSize: 11}, + exporterPdfTableStyle: {margin: [0, 5, 0, 15]}, + exporterPdfTableHeaderStyle: {bold: true, fontSize: 12, color: 'black'}, + exporterPdfHeader: null, + exporterPdfFooter: null, + exporterPdfOrientation: 'landscape', + exporterPdfPageSize: 'A4', + exporterPdfMaxGridWidth: 720, + exporterPdfCustomFormatter: jasmine.any(Function), + exporterHeaderFilterUseName: false, + exporterMenuAllData: true, + exporterMenuVisibleData: true, + exporterMenuSelectedData: true, + exporterMenuCsv: true, + exporterMenuPdf: true, + exporterMenuExcel: true, + exporterFieldCallback: jasmine.any(Function), + exporterFieldFormatCallback: jasmine.any(Function), + exporterFieldApplyFilters: false, + exporterAllDataFn: null, + exporterSuppressColumns: [], + exporterMenuItemOrder: 200 + }); + }); + }); + describe('defaultGridOptions', function() { var options;