diff --git a/src/operations/category-chart.component.ts b/src/operations/category-chart.component.ts index 57fb11b..079fa39 100644 --- a/src/operations/category-chart.component.ts +++ b/src/operations/category-chart.component.ts @@ -1,24 +1,5 @@ -// vim: set tw=80 ts=4 sw=4 sts=4: -/* - This file is part of Accountant. +// vim: set tw=80 ts=2 sw=2 sts=2 : - 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'; - -import * as moment from 'moment'; import * as c3 from 'c3'; import { @@ -27,101 +8,103 @@ import { OnInit, OnChanges } from '@angular/core'; +import { Logger } from '@nsalaun/ng-logger'; + import { Account } from '../accounts/account'; import { CategoryService } from './category.service'; @Component({ - selector: 'category-chart', - template: '
' + selector: 'category-chart', + template: '
' }) export class CategoryChartComponent implements OnInit, OnChanges { - @Input() minDate: Date; - @Input() maxDate: Date; - @Input() account: Account; + @Input() minDate: Date; + @Input() maxDate: Date; + @Input() account: Account; - chart: c3.ChartAPI; + chart: c3.ChartAPI; - constructor( - private elementRef: ElementRef, - private categoryService: CategoryService, - ) {} + constructor( + private elementRef: ElementRef, + private categoryService: CategoryService, + private logger: Logger, + ) {} - loadData(account: Account) { - this.categoryService.query( - account.id, - this.minDate, - this.maxDate - ).subscribe((results) => { - var expenses=[], - revenues=[], - colors={}, - names={}; + loadData(account: Account) { + this.categoryService.query( + account.id, + this.minDate, + this.maxDate + ).subscribe((results) => { + var expenses=[], + revenues=[], + colors={}, + names={}; - var revenuesColor = 'green', - expensesColor = 'orange'; + var revenuesColor = 'green', + expensesColor = 'orange'; - for(let result of results) { + for(let result of results) { + if(result.revenues > 0) { + var revenuesName = 'revenues-' + result.category; - if(result.revenues > 0) { - var revenuesName = 'revenues-' + result.category; + revenues.push([revenuesName, result.revenues]); + names[revenuesName] = result.category; + colors[revenuesName] = revenuesColor; + } - revenues.push([revenuesName, result.revenues]); - names[revenuesName] = result.category; - colors[revenuesName] = revenuesColor; - } + if(result.expenses < 0) { + var expensesName = 'expenses-' + result.category; - if(result.expenses < 0) { - var expensesName = 'expenses-' + result.category; + expenses.splice(0, 0, [expensesName, -result.expenses]); + names[expensesName] = result.category; + colors[expensesName] = expensesColor; + } + }; - expenses.splice(0, 0, [expensesName, -result.expenses]); - names[expensesName] = result.category; - colors[expensesName] = expensesColor; - } - }; + this.chart.unload(); - this.chart.unload(); + this.chart.load({ + columns: revenues.concat(expenses), + names: names, + colors: colors + }); + }); + }; - this.chart.load({ - columns: revenues.concat(expenses), - names: names, - colors: colors - }); - }); - }; + ngOnInit() { + this.chart = c3.generate({ + bindto: this.elementRef.nativeElement.children[0], + data: { + columns: [], + type: 'donut', + order: null, + }, + tooltip: { + format: { + value: function(value, ratio, id, index) { + return value + '€'; + } + } + }, + donut: { + label: { + format: function(value) { + return value + '€'; + } + } + }, + legend: { + show: false + } + }); + }; - ngOnInit() { - this.chart = c3.generate({ - bindto: this.elementRef.nativeElement.children[0], - data: { - columns: [], - type: 'donut', - order: null, - }, - tooltip: { - format: { - value: function(value, ratio, id, index) { - return value + '€'; - } - } - }, - donut: { - label: { - format: function(value) { - return value + '€'; - } - } - }, - legend: { - show: false - } - }); - }; - - ngOnChanges(changes) { - if('account' in changes && changes.account.currentValue) { - this.loadData(changes.account.currentValue); - } else if (this.account) { - this.loadData(this.account); - } - }; + ngOnChanges(changes) { + if('account' in changes && changes.account.currentValue) { + this.loadData(changes.account.currentValue); + } else if (this.account) { + this.loadData(this.account); + } + }; }