import { Component, OnInit } from '@angular/core';
import {Observable} from 'rxjs';
import {Recent10LoansData} from '../models/recent-ten-loans.model';
import {HttpClient} from '@angular/common/http';
import {AuthService} from '../service/auth.service';
import {map} from 'rxjs/operators';

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

  gridData: Observable<Recent10LoansData[]>;
  constructor(private http: HttpClient, private auth: AuthService) { }

  ngOnInit(): void {
    this.gridData = this.http.get<Recent10LoansData[]>(this.auth.getUrl('chart/recent-10-loans')).pipe(map(
      data => {
        data.forEach((value, index) => {
          const strPercentage = (100 * value.OffsetBalance / value.Balance).toFixed(1);
          value.Percentage = parseFloat(strPercentage);
        });
        return data;
      }
    ));
  }
}
