151 lines
4.4 KiB
JavaScript
151 lines
4.4 KiB
JavaScript
// vim: set tw=80 ts=4 sw=4 sts=4:
|
|
/*
|
|
This file is part of Accountant.
|
|
|
|
Accountant is free software: you can redistribute it and/or modify
|
|
it under the terms of the GNU Affero General Public License as published by
|
|
the Free Software Foundation, either version 3 of the License, or
|
|
(at your option) any later version.
|
|
|
|
Accountant is distributed in the hope that it will be useful,
|
|
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
GNU Affero General Public License for more details.
|
|
|
|
You should have received a copy of the GNU Affero General Public License
|
|
along with Accountant. If not, see <http://www.gnu.org/licenses/>.
|
|
*/
|
|
/* jshint node: true */
|
|
'use strict';
|
|
|
|
var moment = require('moment'),
|
|
c3 = require('c3');
|
|
|
|
var angular = require('angular');
|
|
|
|
var ngResource = require('angular-resource');
|
|
|
|
|
|
var balanceChartModule = angular.module('balanceChartModule', [
|
|
ngResource
|
|
])
|
|
|
|
.component('balanceChart', {
|
|
template: '<div></div>',
|
|
bindings: {
|
|
onUpdate: '&'
|
|
},
|
|
controller: function($routeParams, Balances, $element) {
|
|
var vm = this;
|
|
|
|
vm.loadData = function() {
|
|
Balances.query({
|
|
id: $routeParams.accountId
|
|
}, function(results) {
|
|
var headers = [['date', 'balances', 'expenses', 'revenues']];
|
|
|
|
var rows = results.map(function(result) {
|
|
return [
|
|
result.operation_date,
|
|
result.balance,
|
|
result.expenses,
|
|
result.revenues
|
|
];
|
|
});
|
|
|
|
vm.chart.unload();
|
|
|
|
vm.chart.load({
|
|
rows: headers.concat(rows)
|
|
});
|
|
|
|
var x = vm.chart.x();
|
|
var balances = x.balances;
|
|
|
|
vm.onUpdate(balances[0], balances[balances.length - 1]);
|
|
});
|
|
};
|
|
|
|
vm.$onInit = function() {
|
|
vm.chart = c3.generate({
|
|
bindto: $element[0].children[0],
|
|
size: {
|
|
height: 500,
|
|
},
|
|
data: {
|
|
x: 'date',
|
|
rows: [],
|
|
axes: {
|
|
expenses: 'y2',
|
|
revenues: 'y2'
|
|
},
|
|
type: 'bar',
|
|
types: {
|
|
balances: 'area'
|
|
},
|
|
groups: [
|
|
['expenses', 'revenues']
|
|
]
|
|
},
|
|
axis: {
|
|
x: {
|
|
type: 'timeseries',
|
|
tick: {
|
|
format: '%Y-%m-%d',
|
|
rotate: 50,
|
|
}
|
|
},
|
|
y: {
|
|
label: {
|
|
text: 'Amount',
|
|
position: 'outer-middle'
|
|
}
|
|
},
|
|
y2: {
|
|
show: true,
|
|
label: {
|
|
text: 'Amount',
|
|
position: 'outer-middle'
|
|
}
|
|
}
|
|
},
|
|
grid: {
|
|
x: {
|
|
show: true,
|
|
},
|
|
y: {
|
|
show: true,
|
|
lines: [
|
|
{ value: 0, axis: 'y2' },
|
|
{ value: 0, axis: 'y', class: 'zeroline'}
|
|
]
|
|
}
|
|
},
|
|
tooltip: {
|
|
format: {
|
|
value: function(value, ratio, id, index) {
|
|
return value + '€';
|
|
}
|
|
}
|
|
},
|
|
subchart: {
|
|
show: true,
|
|
onbrush: function(domain) {
|
|
vm.onUpdate({minDate: domain[0], maxDate: domain[1]});
|
|
}
|
|
}
|
|
});
|
|
|
|
vm.loadData();
|
|
};
|
|
}
|
|
}).factory('Balances', function($resource) {
|
|
return $resource(
|
|
'/api/account/:id/daily_balances', {
|
|
id: '@id'
|
|
}
|
|
);
|
|
});
|
|
|
|
module.exports = balanceChartModule;
|