Display installment level delinquency (#1907)

Co-authored-by: Jose Alberto Hernandez <alberto@blue-daemon.local>

src/app/loans/loans-view/loan-delinquency-tags-tab/loan-delinquency-tags-tab.component.html

@@ -33,4 +33,31 @@
     <tr mat-header-row *matHeaderRowDef="loanDelinquencyTagsColumns"></tr>
     <tr mat-row *matRowDef="let row; columns: loanDelinquencyTagsColumns;"></tr>
   </table>
+
+  <div *ngIf="installmentLevelDelinquency.length > 0">
+
+    <h3>{{"labels.heading.Loan Delinquency Installment Tags" | translate}}</h3>
+
+    <table mat-table [dataSource]="installmentLevelDelinquency">
+
+      <ng-container matColumnDef="classification">
+        <th mat-header-cell *matHeaderCellDef> {{"labels.inputs.Delinquency Classification" | translate}} </th>
+        <td mat-cell *matCellDef="let item"> {{ item.classification }} </td>
+      </ng-container>
+
+      <ng-container matColumnDef="minimumAgeDays">
+        <th mat-header-cell *matHeaderCellDef> {{"labels.inputs.Days" | translate}} </th>
+        <td mat-cell *matCellDef="let item"> {{ item.minimumAgeDays | formatNumber }} </td>
+      </ng-container>
+
+      <ng-container matColumnDef="amount">
+        <th mat-header-cell *matHeaderCellDef> {{"labels.inputs.Amount" | translate}} </th>
+        <td mat-cell *matCellDef="let item"> {{ item.delinquentAmount | currency:currency.code:'symbol-narrow':'1.2-2' }} </td>
+      </ng-container>
+
+      <tr mat-header-row *matHeaderRowDef="installmentDelinquencyTagsColumns"></tr>
+      <tr mat-row *matRowDef="let row; columns: installmentDelinquencyTagsColumns;"></tr>
+    </table>
+
+  </div>
 </div>

src/app/loans/loans-view/loan-delinquency-tags-tab/loan-delinquency-tags-tab.component.ts

@@ -1,5 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
+import { DelinquentData, InstallmentLevelDelinquency } from 'app/loans/models/loan-account.model';
+import { Currency } from 'app/shared/models/general.model';
 
 @Component({
   selector: 'mifosx-loan-delinquency-tags-tab',
@@ -9,11 +11,20 @@ import { ActivatedRoute } from '@angular/router';
 export class LoanDelinquencyTagsTabComponent implements OnInit {
 
   loanDelinquencyTags: any;
+  currency: Currency;
+  installmentLevelDelinquency: InstallmentLevelDelinquency[] = [];
   loanDelinquencyTagsColumns: string[] = ['classification', 'addedOn', 'liftedOn'];
+  installmentDelinquencyTagsColumns: string[] = ['classification', 'minimumAgeDays', 'amount'];
 
   constructor(private route: ActivatedRoute) {
-    this.route.parent.data.subscribe((data: { loanDelinquencyTagsData: any }) => {
+    this.route.parent.data.subscribe((data: { loanDelinquencyTagsData: any, loanDelinquencyData: any }) => {
       this.loanDelinquencyTags = data.loanDelinquencyTagsData;
+      const loanDelinquencyData: DelinquentData | null  = data.loanDelinquencyData.delinquent || null;
+      this.currency = data.loanDelinquencyData.currency;
+      this.installmentLevelDelinquency = [];
+      if (loanDelinquencyData != null) {
+        this.installmentLevelDelinquency = loanDelinquencyData.installmentLevelDelinquency || [];
+      }
     });
   }