Skip to content

Commit

Permalink
feat(grids): export to csv with custom options (#1554)
Browse files Browse the repository at this point in the history
This commit uses the `ui-grid-exporter` plugin to provide the ability to export to CSV on the client from any grid.  These changes are prototyped on the Trial Balance modal.
  • Loading branch information
mbayopanda authored and jniles committed May 15, 2017
1 parent cb96f6c commit 869599d
Show file tree
Hide file tree
Showing 12 changed files with 216 additions and 18 deletions.
9 changes: 9 additions & 0 deletions client/src/i18n/en/form.json
Original file line number Diff line number Diff line change
Expand Up @@ -122,6 +122,7 @@
"PREVIOUS":"Previous",
"SALE_DETAILS":"Sale Details",
"SAVE_SUCCESS":"Save success",
"EXPORT_SUCCESS": "Successfully exported",
"SEARCH":"Search",
"SHOWING":"Showing",
"TRANSACTION_REVER_SUCCESS":"This transaction was reversed with success",
Expand Down Expand Up @@ -241,6 +242,14 @@
"FATHER_NAME":"Father's Name",
"FAX":"Fax",
"FEMALE":"Female",
"RECORDS":"Records (Rows)",
"FILE_NAME":"File Name",
"COLS_ALL":"All columns",
"COLS_VISIBLE":"Visible columns",
"COLS_SELECTED":"Selected columns",
"ROWS_ALL":"All records",
"ROWS_VISIBLE":"Visible records",
"ROWS_SELECTED":"Selected records",
"FINANCIAL_DETAIL":"Current balance, the posting journal is included:",
"FINANCIAL_STATUS":"Financial Status",
"FIRST_NAME":"First Name",
Expand Down
12 changes: 12 additions & 0 deletions client/src/i18n/fr/form.json
Original file line number Diff line number Diff line change
Expand Up @@ -122,6 +122,7 @@
"PREVIOUS":"Précédent",
"SALE_DETAILS":"Détaille de la Facture",
"SAVE_SUCCESS":"Enregistrement avec succès",
"EXPORT_SUCCESS": "Exportation avec succes",
"SEARCH":"Recherche",
"SHOWING":"Aperçue",
"TRANSACTION_REVER_SUCCESS":"Cette transaction a été Annulée avec succès",
Expand Down Expand Up @@ -206,6 +207,9 @@
"DEBTOR_GROUP":"Groupe Débiteur",
"DEBTOR_GROUP_FORM":"Formulaire d'enregistrement de groupe débiteur",
"DEBTOR_CREDITOR":"Débiteur/Créditeur",
"DEFAULTS" : "Filtre par defaut",
"SEARCH_QUERRIES" : "Recherche",
"LIMIT":"Limite",
"DEFINE_UNTIL_DATE":"Définir une date limite",
"DESCRIPTION":"Description",
"DETAILS":"Details",
Expand Down Expand Up @@ -241,6 +245,14 @@
"FATHER_NAME":"Nom du Père",
"FAX":"Fax",
"FEMALE":"Femme",
"RECORDS":"Enregistrements (Lignes)",
"FILE_NAME":"Nom de fichier",
"COLS_ALL":"Toutes les colonnes",
"COLS_VISIBLE":"Les colonnes visibles",
"COLS_SELECTED":"Les colonnes selectionnées",
"ROWS_ALL":"Tous les enregistrements",
"ROWS_VISIBLE":"Les enregistrements visibles",
"ROWS_SELECTED":"Les enregistrements selectionnés",
"FINANCIAL_DETAIL":"Balance actuelle, journal de saisie inclue :",
"FINANCIAL_STATUS":"Situation Financière",
"FIRST_NAME":"Prenom",
Expand Down
6 changes: 3 additions & 3 deletions client/src/i18n/fr/periods.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,10 @@
"PERIODS" : {
"TODAY" : "Aujourd'hui",
"THIS_WEEK" : "Cette semaine",
"THIS_MONTH" : "Ce Mois",
"THIS_YEAR" : "Cette Année",
"THIS_MONTH" : "Ce mois",
"THIS_YEAR" : "Cette année",
"YESTERDAY" : "Hier",
"LAST_WEEK" : "Semaine derniére",
"LAST_WEEK" : "Semaine derniere",
"LAST_MONTH" : "Mois dernier",
"LAST_YEAR" : "Année derniére",
"ALL_TIME" : "Tout le temps",
Expand Down
2 changes: 1 addition & 1 deletion client/src/i18n/fr/posting_journal.json
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@
"MISSING_DATES":"Date(s) manquante(s)",
"MISSING_DOCUMENT_ID":"Ligne(s) sans ID Document",
"MISSING_ENTITY":"Ligne(s) sans ID entite",
"MISSING_FISCAL_OR_PERIOD":"Annee fiscale ou periode omise",
"MISSING_FISCAL_OR_PERIOD":"Année fiscale ou periode omise",
"MULTIPLE_CANCELLING":"Annulation multiple. Cette transaction a deja été annulée",
"SINGLE_LINE_TRANSACTION":"Transaction(s) avec une ligne",
"EDIT_INVALID_ACCOUNT":"Transaction avec des comptes non valides",
Expand Down
3 changes: 2 additions & 1 deletion client/src/js/app.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,8 @@ var bhima = angular.module('bhima', [
'tmh.dynamicLocale', 'ngFileUpload', 'ui.grid',
'ui.grid.selection', 'ui.grid.autoResize', 'ui.grid.resizeColumns',
'ui.grid.edit', 'ui.grid.grouping', 'ui.grid.treeView', 'ui.grid.cellNav',
'ui.grid.pagination', 'ui.grid.moveColumns', 'angularMoment', 'ngMessages',
'ui.grid.pagination', 'ui.grid.moveColumns', 'ui.grid.exporter',
'angularMoment', 'ngMessages',
'growlNotifications', 'ngAnimate', 'ngSanitize', 'ui.select', 'ngTouch',
'ui.router.state.events',
]);
Expand Down
56 changes: 56 additions & 0 deletions client/src/js/services/grid/GridExport.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
angular.module('bhima.services')
.service('GridExportService', GridExportService);

GridExportService.$inject = ['$uibModal', 'util'];

function GridExportService(Modal, util) {

/**
* @constructor
*/
function GridExport(gridOptions, defaultRowKey, defaultColKey) {

this.gridOptions = gridOptions;
this.ROWS = defaultRowKey;
this.COLS = defaultColKey;

util.after(gridOptions, 'onRegisterApi', function onRegisterApi(api) {
this.api = api;
}.bind(this));
}

/**
* @method run
* @description run the export tool
*/
GridExport.prototype.run = function run() {
var gridApi = this.api;
var gridOptions = this.gridOptions;
var rows = this.ROWS;
var cols = this.COLS;

var request = {
api: gridApi,
options: gridOptions,
rows: rows,
cols: cols,
};

var params = {
templateUrl : 'modules/templates/modals/export.modal.html',
controller : 'ExportGridModalController',
controllerAs : '$ctrl',
size : 'md',
backdrop : 'static',
animation : false,
resolve : {
data : function dataProvider() { return request; },
},
};

var instance = Modal.open(params);
return instance.result;
}

return GridExport;
}
3 changes: 2 additions & 1 deletion client/src/modules/journal/journal.html
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,8 @@
ui-grid-selection
ui-grid-cellNav
ui-grid-edit
ui-grid-grouping>
ui-grid-grouping
ui-grid-exporter>

<bh-grid-loading-indicator
loading-state="JournalCtrl.loading"
Expand Down
15 changes: 6 additions & 9 deletions client/src/modules/journal/journal.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ JournalController.$inject = [
'SessionService', 'NotifyService', 'TransactionService', 'GridEditorService',
'bhConstants', '$state', 'uiGridConstants', 'ModalService', 'LanguageService',
'AppCache', 'Store', 'uiGridGroupingConstants', 'ExportService', 'FindEntityService',
'FilterService', '$rootScope', '$filter', 'TransactionTypeService', '$translate', '$scope',
'FilterService', '$rootScope', '$filter', '$translate', 'GridExportService', 'TransactionTypeService', '$scope',
];

/**
Expand All @@ -34,14 +34,14 @@ function JournalController(Journal, Sorting, Grouping,
Filtering, Columns, Config, Session, Notify, Transactions, Editors,
bhConstants, $state, uiGridConstants, Modal, Languages, AppCache, Store,
uiGridGroupingConstants, Export, FindEntity, Filters, $rootScope, $filter,
TransactionType, $translate, $scope) {

$translate, GridExport, TransactionType, $scope) {
// Journal utilities
var sorting;
var grouping;
var filtering;
var columnConfig;
var transactions;
var exportation;

var filter = new Filters();

Expand All @@ -51,6 +51,7 @@ function JournalController(Journal, Sorting, Grouping,
// top level cache
var cache = AppCache(cacheKey + '-module');
var vm = this;

vm.filter = filter;

// number of all of the transactions in the system
Expand Down Expand Up @@ -95,6 +96,7 @@ function JournalController(Journal, Sorting, Grouping,
grouping = new Grouping(vm.gridOptions, true, 'trans_id', vm.grouped, false);
columnConfig = new Columns(vm.gridOptions, cacheKey);
transactions = new Transactions(vm.gridOptions);
exportation = new GridExport(vm.gridOptions, 'selected', 'visible');

// attaching the filtering object to the view
vm.filtering = filtering;
Expand Down Expand Up @@ -350,12 +352,7 @@ function JournalController(Journal, Sorting, Grouping,

// export data into csv file
vm.exportFile = function exportFile() {
var url = '/reports/finance/journal';
var params = formatExportParameters('csv');

if (!params) { return; }

Export.download(url, params, 'POSTING_JOURNAL.TITLE');
exportation.run();
};

function errorHandler(error) {
Expand Down
20 changes: 19 additions & 1 deletion client/src/modules/journal/modals/trialBalanceMain.body.html
Original file line number Diff line number Diff line change
@@ -1,3 +1,17 @@
<!-- exportation -->
<div class="row text-right" style="margin: 5px;">
<div class="col-xs-12">
<button
id="export"
type="button"
class="btn btn-success"
ng-click="TrialBalanceMainBodyCtrl.exportGrid()">
<i class="fa fa-file-excel-o"></i>
<span translate>FORM.BUTTONS.EXPORT</span>
</button>
</div>
</div>

<div class="row" style="margin: 5px;" ng-if="TrialBalanceMainBodyCtrl.showErrorButton">
<div class="col-xs-4">
<button
Expand All @@ -20,10 +34,14 @@
id="main-grid"
ui-grid="TrialBalanceMainBodyCtrl.gridOptions"
ui-grid-auto-resize
ui-grid-grouping>
ui-grid-grouping
ui-grid-exporter>
<bh-grid-loading-indicator
loading-state="TrialBalanceMainBodyCtrl.loading"
empty-state="TrialBalanceMainBodyCtrl.gridOptions.data.length === 0"
error-state="TrialBalanceMainBodyCtrl.hasError">
</bh-grid-loading-indicator>
</div>

<span class="ui-grid-exporter-csv-link">&nbsp</span>

17 changes: 15 additions & 2 deletions client/src/modules/journal/modals/trialBalanceMain.body.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ angular.module('bhima.controllers')
TrialBalanceMainBodyController.$inject = [
'SessionService', 'TrialBalanceService', 'NotifyService',
'$state', 'uiGridConstants', 'uiGridGroupingConstants', '$filter',
'AccountService',
'AccountService', 'GridExportService',
];

/**
Expand All @@ -14,7 +14,9 @@ TrialBalanceMainBodyController.$inject = [
* This controller provides a tool to view the main state of trial balance
* The main state let you post transaction into the general ledger
*/
function TrialBalanceMainBodyController(Session, TrialBalance, Notify, $state, uiGridConstants, uiGridGroupingConstants, $filter, Accounts) {
function TrialBalanceMainBodyController(Session, TrialBalance, Notify,
$state, uiGridConstants, uiGridGroupingConstants, $filter,
Accounts, GridExport) {
var vm = this;
var currencyId = Session.enterprise.currecny_id;
var $currency = $filter('currency');
Expand Down Expand Up @@ -94,6 +96,7 @@ function TrialBalanceMainBodyController(Session, TrialBalance, Notify, $state, u

vm.enterprise = Session.enterprise;
vm.dataByTrans = records;
vm.exportGrid = exportGrid;
vm.hasError = false;

vm.gridOptions = {
Expand All @@ -107,6 +110,9 @@ function TrialBalanceMainBodyController(Session, TrialBalance, Notify, $state, u
onRegisterApi : function (api) { gridApi = api; },
};


var exportation = new GridExport(vm.gridOptions, 'all', 'visible');

/**
* @function : fetchDataByAccount
* @description :
Expand Down Expand Up @@ -257,5 +263,12 @@ function TrialBalanceMainBodyController(Session, TrialBalance, Notify, $state, u
fetchDataByAccount();
}

/**
* Export to csv
*/
function exportGrid() {
exportation.run();
}

startup();
}
45 changes: 45 additions & 0 deletions client/src/modules/templates/modals/export.modal.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
<div class="modal-header">
<ol class="headercrumb">
<li class="title">
<i class="fa fa-file-excel-o text-success"></i> <span translate>FORM.BUTTONS.EXPORT</span>
</li>
</ol>
</div>

<div class="modal-body">

<div class="form-group">
<label translate>FORM.LABELS.FILE_NAME</label>

<input type="text" class="form-control" ng-model="$ctrl.filename" required>
</div>

<div class="form-group">
<label translate>FORM.LABELS.RECORDS</label>
<select class="form-control" ng-model="$ctrl.exportRowType"</select>
<option value='all' translate>FORM.LABELS.ROWS_ALL</option>
<option value='visible' translate>FORM.LABELS.ROWS_VISIBLE</option>
<option value='selected' translate>FORM.LABELS.ROWS_SELECTED</option>
</select>
</div>

<div class="form-group">
<label translate>FORM.LABELS.COLUMNS</label>
<select class="form-control" ng-model="$ctrl.exportColType"</select>
<option value='all' translate>FORM.LABELS.COLS_ALL</option>
<option value='visible' translate>FORM.LABELS.COLS_VISIBLE</option>
</select>
</div>

<span class="ui-grid-exporter-csv-link">&nbsp</span>
</div>

<div class="modal-footer">
<button type="button" class="btn btn-default" ng-click="$ctrl.dismiss()" data-method="cancel">
<span translate>FORM.BUTTONS.CANCEL</span>
</button>

<button type="button" class="btn btn-success" ng-click="$ctrl.exportGrid()" data-method="export">
<span translate>FORM.BUTTONS.EXPORT</span>
</button>
</div>
46 changes: 46 additions & 0 deletions client/src/modules/templates/modals/export.modal.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
angular.module('bhima.controllers')
.controller('ExportGridModalController', ExportGridModalController);

ExportGridModalController.$inject = [
'$uibModalInstance', 'uiGridConstants', '$filter',
'moment', 'bhConstants', 'data',
];

function ExportGridModalController(Instance, uiGridConstants, $filter,
moment, bhConstants, Data) {
var vm = this;

var gridOptions = Data.options || {};
var gridApi = Data.api || {};
var filename = Data.filename || 'Export ' + moment().format('YYYY-MM-DD');
var ROWS = Data.rows || 'visible';
var COLS = Data.cols || 'visible';

// bind with view
vm.exportColType = COLS;
vm.exportRowType = ROWS;

// expose to the view
vm.exportGrid = exportGrid;
vm.dismiss = Instance.dismiss;

/**
* Export to csv
*/
function exportGrid() {
var myElement = angular.element(document.querySelectorAll('.ui-grid-exporter-csv-link'));
filename = vm.filename || filename;
gridOptions.exporterCsvFilename = filename.concat('.csv');
gridOptions.exporterHeaderFilter = exporterHeaderFilter;
gridOptions.exporterOlderExcelCompatibility = true;
gridApi.exporter.csvExport(vm.exportRowType, vm.exportColType, myElement);
Instance.close(true);
}

/**
* Exporter apply header filter
*/
function exporterHeaderFilter(displayName) {
return $filter('translate')(displayName);
}
}

0 comments on commit 869599d

Please sign in to comment.