Display installment level delinquency (#1907)

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

src/app/account-transfers/make-account-transfers/make-account-transfers.component.html

@@ -134,7 +134,7 @@
     <mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
       <button type="button" mat-raised-button [routerLink]="['../..']">{{"labels.buttons.Cancel" | translate}}</button>
       <button mat-raised-button color="primary" [disabled]="!makeAccountTransferForm.valid"
-        *mifosxHasPermission="'CREATE_ACCOUNTTRANSFER'" (click)="submit()">{{"labels.buttons.Submit | translate}}</button>
+        *mifosxHasPermission="'CREATE_ACCOUNTTRANSFER'" (click)="submit()">{{"labels.buttons.Submit" | translate}}</button>
     </mat-card-actions>
 
   </mat-card>

src/app/loans/common-resolvers/loan-delinquency-data.resolver.ts

@@ -0,0 +1,31 @@
+/** Angular Imports */
+import { Injectable } from '@angular/core';
+import { Resolve, ActivatedRouteSnapshot } from '@angular/router';
+
+/** rxjs Imports */
+import { Observable } from 'rxjs';
+
+/** Custom Services */
+import { LoansService } from '../loans.service';
+
+/**
+ * Loan Delinquency data resolver.
+ */
+@Injectable()
+export class LoanDelinquencyDataResolver implements Resolve<Object> {
+
+    /**
+     * @param {LoansService} LoansService Loans service.
+     */
+    constructor(private loansService: LoansService) { }
+
+    /**
+     * Returns the Loans with Association data.
+     * @returns {Observable<any>}
+     */
+    resolve(route: ActivatedRouteSnapshot): Observable<any> {
+      const loanId = route.paramMap.get('loanId') || route.parent.paramMap.get('loanId');
+      return this.loansService.getDelinquencyData(loanId);
+    }
+
+}

src/app/loans/loans-account-stepper/loans-account-terms-step/loans-account-terms-step.component.html

@@ -10,7 +10,7 @@
       </mat-error>
     </mat-form-field>
 
-    <h4 fxFlex="98%" class="mat-h4">{{"labels.heading.Term Options <i class="fas fa-question" matTooltip="The loan term parameter in loan accounts
+    <h4 fxFlex="98%" class="mat-h4">{{"labels.heading.Term Options" | translate}} <i class="fas fa-question" matTooltip="The loan term parameter in loan accounts
       is the default-calculated field based on the number of repayments and repaid every value entered by the user"></i>" | translate}}</h4>
 
     <mat-form-field fxFlex="48%">
@@ -173,7 +173,7 @@
     </mat-checkbox>
 
     <mat-form-field fxFlex="48%">
-      <mat-label>{{"labels.inputs.Arrears tolerance" | translate}} {{currencyDisplaySymbol}}</mat-label>
+      <mat-label>{{"labels.inputs.Arrears tolerance" | translate}} </mat-label>
       <input matInput type="number" formControlName="inArrearsTolerance" matTooltip="{{ 'tooltips.With Arrears tolerance' | translate}}">
     </mat-form-field>
 

src/app/loans/loans-routing.module.ts

@@ -58,6 +58,7 @@ import { ExternalAssetOwnerTabComponent } from './loans-view/external-asset-owne
 import { ExternalAssetOwnerResolver } from './common-resolvers/external-asset-owner.resolver';
 import { ExternalAssetOwnerActiveTransferResolver } from './common-resolvers/external-asset-owner-active-transfer.resolver';
 import { LoanCollateralsResolver } from './common-resolvers/loan-collaterals.resolver';
+import { LoanDelinquencyDataResolver } from './common-resolvers/loan-delinquency-data.resolver';
 
 /** Loans Route. */
 const routes: Routes = [
@@ -131,7 +132,8 @@ const routes: Routes = [
             path: 'delinquencytags',
             data: { title: 'Loans Delinquency Tags', breadcrumb: 'Delinquency Tags', routeParamBreadcrumb: false },
             resolve: {
-              loanDelinquencyTagsData: LoanDelinquencyTagsResolver
+              loanDelinquencyTagsData: LoanDelinquencyTagsResolver,
+              loanDelinquencyData: LoanDelinquencyDataResolver
             },
             children: [
               {
@@ -363,7 +365,8 @@ const routes: Routes = [
     GLIMViewResolver,
     GSIMAccountsResolver,
     GLIMLoanTemplateResolver,
-    ExternalAssetOwnerResolver
+    ExternalAssetOwnerResolver,
+    LoanDelinquencyDataResolver
   ]
 })
 

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 || [];
+      }
     });
   }
 

src/app/loans/loans.service.ts

@@ -75,6 +75,13 @@ export class LoansService {
     return this.http.get(`/loans/${loanId}/delinquencytags`);
   }
 
+  getDelinquencyData(loanId: string) {
+    const httpParams = new HttpParams()
+      .set('associations', 'collection')
+      .set('exclude', 'guarantors,futureSchedule');
+    return this.http.get(`/loans/${loanId}`, { params: httpParams });
+  }
+
   /**
    * Returns the loan template data with specific condition
    * @param loanId Loan Id

src/app/loans/models/loan-account.model.ts

@@ -0,0 +1,26 @@
+
+export interface DelinquencyRange {
+  id:             number;
+  classification: string;
+  minimumAgeDays: number;
+}
+
+export interface DelinquentData {
+  availableDisbursementAmount:   number;
+  pastDueDays:                   number;
+  nextPaymentDueDate:            number[];
+  delinquentDays:                number;
+  delinquentDate:                number[];
+  delinquentAmount:              number;
+  lastPaymentAmount:             number;
+  lastRepaymentAmount:           number;
+  delinquencyCalculationPaused:  boolean;
+  installmentLevelDelinquency?:  InstallmentLevelDelinquency[];
+}
+
+export interface InstallmentLevelDelinquency {
+  rangeId:          number;
+  classification:   string;
+  minimumAgeDays:   number;
+  delinquentAmount: number;
+}

src/app/products/loan-products/loan-product-stepper/loan-product-settings-step/loan-product-settings-step.component.html

@@ -110,7 +110,7 @@
       </mat-checkbox>
     </div>
 
-    <h3 fxFlex="23%" class="mat-h3">Down Payment</h3>
+    <h3 fxFlex="96%" class="mat-h3">Down Payment</h3>
 
     <mat-checkbox fxFlex="73%" labelPosition="before" formControlName="enableDownPayment" matTooltip="Leave this checkbox checked if the loan has Down Payment, A Down Payment is
     a sum a buyer pays upfront when purchasing a good. It represents a percentage of the total purchase price, and the balance is usually financed" class="margin-b">