import { Component, OnInit } from '@angular/core';
import {Observable} from 'rxjs';
import {TypeOfLoansModel} from '../models/type-of-loans.model';
import {AuthService} from '../service/auth.service';
import {HttpClient} from '@angular/common/http';

@Component({
  selector: 'app-chart-amount-of-loans',
  templateUrl: './chart-amount-of-loans.component.html',
  styleUrls: ['./chart-amount-of-loans.component.scss']
})
export class ChartAmountOfLoansComponent implements OnInit {

  public autoFit = true;
  public data: Observable<TypeOfLoansModel[]>;

  public label = ['Q1', 'Q2', 'Q3', 'Q4'];
  public amount = [87, 154, 210, 215];
  public share = [87, 154, 210, 215];
  public count = [87, 154, 210, 215];

  constructor(private auth: AuthService, private http: HttpClient) { }

  ngOnInit(): void {
    this.getAmountOfLoans();
  }


  // tslint:disable-next-line:typedef
  public getAmountOfLoans() {
    this.http.get<TypeOfLoansModel[]>(this.auth.getUrl('chart/amount-of-loans')).subscribe(
      resp => {
        this.buildChart(resp);
      }
    );
  }

  // tslint:disable-next-line:typedef
  public buildChart(items: TypeOfLoansModel[]) {
    this.amount =[];
    this.share = [];
    this.label = [];
    this.count = [];
    items.forEach( (value, index) =>{
      this.label.push(value.Kind);
      this.amount.push(value.Amount / 1000000);
      this.share.push(value.Share);
      this.count.push(value.Count);
    });
  }

}
