From 6ca4c29e38f5c8e35c677c7ce9c4a91fb3729258 Mon Sep 17 00:00:00 2001 From: Alexis Lahouze Date: Thu, 27 Jul 2017 14:08:11 +0200 Subject: [PATCH] Cleanup, indent. --- src/operations/balance-chart.component.ts | 362 ++++++++++------------ 1 file changed, 172 insertions(+), 190 deletions(-) diff --git a/src/operations/balance-chart.component.ts b/src/operations/balance-chart.component.ts index 3ef68b6..0796503 100644 --- a/src/operations/balance-chart.component.ts +++ b/src/operations/balance-chart.component.ts @@ -1,30 +1,12 @@ -// 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'; +// vim: set tw=80 ts=2 sw=2 sts=2: import * as moment from 'moment'; import * as c3 from 'c3'; import { - Component, ElementRef, - Inject, Input, Output, EventEmitter, - OnInit, OnChanges + Component, ElementRef, + Inject, Input, Output, EventEmitter, + OnInit, OnChanges } from '@angular/core'; import { Logger } from '@nsalaun/ng-logger'; @@ -33,185 +15,185 @@ import { Account } from '../accounts/account'; import { DailyBalanceService } from '../accounts/dailyBalance.service'; class DateRange { - minDate: Date; - maxDate: Date; + minDate: Date; + maxDate: Date; } class xAxis { - balances: Date[]; - expenses: Date[]; - revenues: Date[]; + balances: Date[]; + expenses: Date[]; + revenues: Date[]; } @Component({ - selector: 'balance-chart', - template: '
' + selector: 'balance-chart', + template: '
' }) export class BalanceChartComponent implements OnInit, OnChanges { - @Input() account: Account; - @Output() onUpdate: EventEmitter = new EventEmitter(); + @Input() account: Account; + @Output() onUpdate: EventEmitter = new EventEmitter(); - private chart: c3.ChartAPI; - private balances: number[]; + private chart: c3.ChartAPI; + private balances: number[]; - constructor( - private elementRef: ElementRef, - private logger: Logger, - private dailyBalanceService: DailyBalanceService, - @Inject('accountIdService') private accountIdService, - ) { - this.logger.log("Constructor BalanceChartComponent") + constructor( + private elementRef: ElementRef, + private logger: Logger, + private dailyBalanceService: DailyBalanceService, + @Inject('accountIdService') private accountIdService, + ) { + this.logger.log("Constructor BalanceChartComponent") + } + + loadData() { + this.dailyBalanceService.query( + this.accountIdService.get() + ).subscribe((results) => { + var headers: any[][] = [['date', 'balances', 'expenses', 'revenues']]; + + var rows = results.map(function(result) { + return [ + result.operation_date, + result.balance, + result.expenses, + result.revenues + ]; + }); + + this.chart.unload(); + + this.chart.load({ + rows: headers.concat(rows) + }); + + var x: any; + + x = this.chart.x(); + + this.logger.log("x", x); + + var balances = x.balances; + + this.onUpdate.emit({ + minDate: balances[0], + maxDate: balances[balances.length - 1] + }); + }); + }; + + $onInit() { + this.ngOnInit(); + } + + ngOnInit() { + var tomorrow = moment().endOf('day').valueOf(); + + this.chart = c3.generate({ + bindto: this.elementRef.nativeElement.children[0], + size: { + height: 450, + }, + data: { + x: 'date', + rows: [], + axes: { + expenses: 'y2', + revenues: 'y2' + }, + type: 'bar', + types: { + balances: 'area' + }, + groups: [ + ['expenses', 'revenues'] + ], + // Disable for the moment because there is an issue when + // using subchart line is not refreshed after subset + // selection. + //regions: { + // balances: [{ + // start: tomorrow, + // style: 'dashed' + // }] + //} + }, + regions: [{ + start: tomorrow, + }], + 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, + } + }, + tooltip: { + format: { + value: function(value, ratio, id, index) { + return value + '€'; + } + } + }, + subchart: { + show: true, + onbrush: function(domain) { + this.onUpdate.emit({minDate: domain[0], maxDate: domain[1]}); + } + } + }); + + this.loadData(); + }; + + setLines(account: Account) { + if(this.chart) { + this.chart.ygrids([ + { value: 0, axis: 'y2' }, + { value: 0, axis: 'y', class: 'zeroline'}, + ]); + + if(account) { + this.chart.ygrids.add({ + value: account.authorized_overdraft, + axis: 'y', + class: 'overdraft' + }); + } } + }; - loadData() { - this.dailyBalanceService.query( - this.accountIdService.get() - ).subscribe((results) => { - var headers: any[][] = [['date', 'balances', 'expenses', 'revenues']]; + $onChanges(changes) { + this.ngOnChanges(changes); + } - var rows = results.map(function(result) { - return [ - result.operation_date, - result.balance, - result.expenses, - result.revenues - ]; - }); - - this.chart.unload(); - - this.chart.load({ - rows: headers.concat(rows) - }); - - var x: any; - - x = this.chart.x(); - - this.logger.log("x", x); - - var balances = x.balances; - - this.onUpdate.emit({ - minDate: balances[0], - maxDate: balances[balances.length - 1] - }); - }); - }; - - $onInit() { - this.ngOnInit(); - } - - ngOnInit() { - var tomorrow = moment().endOf('day').valueOf(); - - this.chart = c3.generate({ - bindto: this.elementRef.nativeElement.children[0], - size: { - height: 450, - }, - data: { - x: 'date', - rows: [], - axes: { - expenses: 'y2', - revenues: 'y2' - }, - type: 'bar', - types: { - balances: 'area' - }, - groups: [ - ['expenses', 'revenues'] - ], - // Disable for the moment because there is an issue when - // using subchart line is not refreshed after subset - // selection. - //regions: { - // balances: [{ - // start: tomorrow, - // style: 'dashed' - // }] - //} - }, - regions: [{ - start: tomorrow, - }], - 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, - } - }, - tooltip: { - format: { - value: function(value, ratio, id, index) { - return value + '€'; - } - } - }, - subchart: { - show: true, - onbrush: function(domain) { - this.onUpdate.emit({minDate: domain[0], maxDate: domain[1]}); - } - } - }); - - this.loadData(); - }; - - setLines(account: Account) { - if(this.chart) { - this.chart.ygrids([ - { value: 0, axis: 'y2' }, - { value: 0, axis: 'y', class: 'zeroline'}, - ]); - - if(account) { - this.chart.ygrids.add({ - value: account.authorized_overdraft, - axis: 'y', - class: 'overdraft' - }); - } - } - }; - - $onChanges(changes) { - this.ngOnChanges(changes); - } - - ngOnChanges(changes) { - if('account' in changes) { - this.setLines(changes.account.currentValue); - } else { - this.setLines(this.account); - } - }; + ngOnChanges(changes) { + if('account' in changes) { + this.setLines(changes.account.currentValue); + } else { + this.setLines(this.account); + } + }; }