// 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 . */ /* jshint node: true */ 'use strict'; var moment = require('moment'); var angular = require('angular'); var balanceChartTmpl = require('./balance-chart.tmpl.html'); var ngResource = require('angular-resource'), ngChartJs = require('angular-chart.js'), chartJs = require('chart.js'), chartJsAnnotation = require('chartjs-plugin-annotation'); chartJs.plugins.register([ 'annotation' ]); var balanceChartModule = angular.module('balanceChartModule', [ ngResource, ngChartJs ]) .component('balanceChart', { templateUrl: balanceChartTmpl, bindings: { minDate: '<', maxDate: '<' }, controller: function($routeParams, $log, Balances) { var vm = this; vm.options = { scales: { yAxes: [{ id: 'y-axis-left', type: 'linear', display: true, position: 'left' }, { id: 'y-axis-right', type: 'linear', display: true, position: 'right', stacked: false }], xAxes: [{ type: 'time', time: { unit: 'day', }, stacked: true, ticks: { autoSkippadding: 10 } }] }, annotation: { annotations: [{ type: 'line', scaleID: 'y-axis-left', value: -200, borderColor: '#FF0000', borderWidth: 4 }] } }; vm.colors = [ '#4e74ff', '#ff6363', '#268c26' ]; vm.datasetOverride = [{ label: "Balance", borderWidth: 3, type: 'line', yAxisID: 'y-axis-left' }, { label: "Expenses", borderWidth: 3, barThickness: 3, type: 'bar', yAxisID: 'y-axis-right' }, { label: "Revenues", type: 'bar', yAxisID: 'y-axis-right' }]; vm.data = { data: [[], [], []], labels: [] }; vm.loadData = function() { $log.log(vm.minDate, vm.maxDate); vm.data = Balances.query({ id: $routeParams.accountId, begin: vm.minDate.format('YYYY-MM-DD'), end: vm.maxDate.format('YYYY-MM-DD') }).$promise.then(function(results) { var labels = [], balances = [], expenses = [], revenues = []; angular.forEach(results, function(result) { labels.push(result.operation_date); balances.push(result.balance); expenses.push(result.expenses); revenues.push(result.revenues); }); vm.data = { data: [ balances, expenses, revenues ], labels: labels }; return vm.data; }); }; vm.$onInit = function() { vm.loadData(); }; vm.$onChange = function(changes) { vm.loadData(); }; } }).factory('Balances', function($resource) { return $resource( '/api/account/:id/daily_balances', { id: '@id' } ); }) .config(function (ChartJsProvider) { ChartJsProvider.setOptions({ colors : [ '#803690', '#00ADF9', '#DCDCDC', '#46BFBD', '#FDB45C', '#949FB1', '#4D5360' ], responsive: true }); }); module.exports = balanceChartModule;