commit 9bfb281cd792ceae5dbb0e38489b0c77f1d773b3
parent 8e1adb6e617f59cca529a9f83956f1092e927435
Author: Felicitus <felicitus@felicitus.org>
Date: Fri, 6 Nov 2015 19:05:36 +0100
Added the grid exporter which exports the visible rows and columns in a grid and exports it to a specified format
Diffstat:
4 files changed, 150 insertions(+), 22 deletions(-)
diff --git a/src/PartKeepr/FrontendBundle/Resources/public/js/Components/Exporter/GridExporter.js b/src/PartKeepr/FrontendBundle/Resources/public/js/Components/Exporter/GridExporter.js
@@ -0,0 +1,82 @@
+/**
+ * Exports a grid with all visible fields and rows
+ */
+Ext.define("PartKeepr.Exporter.GridExporter", {
+ constructor: function (gridPanel, format, extension)
+ {
+ this.gridPanel = gridPanel;
+ this.format = format;
+ this.extension = extension;
+ },
+ exportGrid: function ()
+ {
+ var columns = this.gridPanel.getColumns();
+
+ var store = this.gridPanel.getStore();
+ var records = store.getData();
+ var record, i, j, value, column, fieldValue;
+ var rows = [], rowValues = [], headers = [];
+
+ for (i = 0; i < columns.length; i++) {
+ if (!columns[i].isHidden()) {
+ rowValues.push(Ext.util.Format.stripTags(columns[i].text));
+ }
+ }
+
+ rows.push(rowValues);
+
+ for (i = 0; i < records.length; i++) {
+ rowValues = [];
+ record = records.getAt(i);
+
+ for (j = 0; j < columns.length; j++) {
+ column = columns[j];
+
+ fieldValue = record.data[column.dataIndex];
+
+ if (column.renderer && column.renderer.call) {
+ value = column.renderer.call(
+ column.usingDefaultRenderer ? column : column.scope || this.gridPanel,
+ fieldValue,
+ null,
+ record,
+ i,
+ j,
+ store,
+ this.gridPanel.getView());
+
+ } else {
+ value = fieldValue;
+ }
+
+ if (!column.isHidden()) {
+ rowValues.push(Ext.util.Format.stripTags(value));
+ }
+ }
+
+ rows.push(rowValues);
+ }
+
+
+ var options = {
+ headers: {}
+ };
+
+ options.headers["Accept"] = "text/comma-separated-values";
+ options.jsonData = rows;
+ options.method = "POST";
+ //this.down("#formatSelector").getValue().get("mimetype");
+ options.url = PartKeepr.getBasePath() + "/api/export";
+ options.callback = Ext.bind(this.onExportSuccessful, this);
+ Ext.Ajax.request(options);
+ },
+ /**
+ * Callback for when the export is complete. Creates a client-side blob object and forces
+ * download of it.
+ */
+ onExportSuccessful: function (options, success, response)
+ {
+ var blob = new Blob([response.responseText], {type: this.format});
+ saveAs(blob, "export." + this.extension);
+ },
+});
diff --git a/src/PartKeepr/FrontendBundle/Resources/public/js/Components/Exporter/GridExporterButton.js b/src/PartKeepr/FrontendBundle/Resources/public/js/Components/Exporter/GridExporterButton.js
@@ -0,0 +1,63 @@
+Ext.define("PartKeepr.Exporter.GridExporterButton", {
+ extend: "Ext.button.Button",
+
+ genericExporter: true,
+
+ initComponent: function ()
+ {
+ this.menu = [
+ {
+ text: i18n("Export Grid"),
+ menu: [
+ {
+ text: i18n("CSV"),
+ handler: "onCSVExport",
+ scope: this
+ }, {
+ text: i18n("Excel 2007 and later"),
+ handler: "onExcelExport",
+ scope: this
+ }
+ ]
+ }
+ ];
+
+ console.log(this.genericExporter);
+ if (this.genericExporter) {
+ this.menu.push({
+ text: i18n("Custom Export…"),
+ handler: "onCustomExport",
+ scope: this
+ });
+ }
+ this.callParent(arguments);
+ },
+ onCSVExport: function ()
+ {
+ var gridPanel = this.up("gridpanel");
+ var exporter = Ext.create("PartKeepr.Exporter.GridExporter", gridPanel, "text/comma-separated-values", "csv");
+ exporter.exportGrid();
+ },
+ onExcelExport: function ()
+ {
+ var gridPanel = this.up("gridpanel");
+ var exporter = Ext.create("PartKeepr.Exporter.GridExporter", gridPanel,
+ "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", "xlsx");
+ exporter.exportGrid();
+ },
+ onCustomExport: function () {
+ var j = Ext.create("Ext.window.Window", {
+ items: Ext.create("PartKeepr.Exporter.Exporter", {
+ model: this.up("gridpanel").getStore().getModel()
+ }),
+ title: i18n("Export"),
+ width: "80%",
+ height: "80%",
+ layout: 'fit',
+ maximizable: true,
+ closeAction: 'destroy'
+
+ });
+ j.show();
+ }
+});
diff --git a/src/PartKeepr/FrontendBundle/Resources/public/js/Components/Widgets/PagingToolbar.js b/src/PartKeepr/FrontendBundle/Resources/public/js/Components/Widgets/PagingToolbar.js
@@ -6,31 +6,12 @@ Ext.define("PartKeepr.PagingToolbar", {
getPagingItems: function () {
var items = this.callParent(arguments);
- items.push({
+ items.push(Ext.create("PartKeepr.Exporter.GridExporterButton", {
itemId: 'export',
tooltip: i18n("Export"),
iconCls: "fugue-icon application-export",
- disabled: this.store.isLoading(),
- handler: this.doExport,
- scope: this
- });
+ disabled: this.store.isLoading()
+ }));
return items;
- },
- doExport: function ()
- {
- var j = Ext.create("Ext.window.Window", {
- items: Ext.create("PartKeepr.Exporter.Exporter", {
- model: this.store.getModel()
- }),
- title: i18n("Export"),
- width: "80%",
- height: "80%",
- layout: 'fit',
- maximizable: true,
- closeAction: 'destroy'
-
- });
- j.show();
-
}
});
diff --git a/src/PartKeepr/FrontendBundle/Resources/views/index.html.twig b/src/PartKeepr/FrontendBundle/Resources/views/index.html.twig
@@ -57,6 +57,8 @@
{% javascripts output='js/compiled/main2.js'
'@PartKeeprFrontendBundle/Resources/public/js/Util/i18n.js'
+ '@PartKeeprFrontendBundle/Resources/public/js/Components/Exporter/GridExporter.js'
+ '@PartKeeprFrontendBundle/Resources/public/js/Components/Exporter/GridExporterButton.js'
'@PartKeeprFrontendBundle/Resources/public/js/Util/Blob.js'
'@PartKeeprFrontendBundle/Resources/public/js/Util/FileSaver.js'
'@PartKeeprFrontendBundle/Resources/public/js/Components/Widgets/PagingToolbar.js'
