Loan Account Term calculation (#1871)

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

src/app/loans/create-loans-account/create-loans-account.component.ts

@@ -33,7 +33,7 @@ export class CreateLoansAccountComponent implements OnInit {
   /** Loans Account Template */
   loansAccountTemplate: any;
   /** Loans Account Product Template */
-  loansAccountProductTemplate: any;
+  loansAccountProductTemplate: any | null = null;
   /** Collateral Options */
   collateralOptions: any;
   /** Multi Disburse Loan */
@@ -63,8 +63,7 @@ export class CreateLoansAccountComponent implements OnInit {
     });
   }
 
-  ngOnInit() {
-  }
+  ngOnInit() { }
 
   /**
    * Sets loans account product template and collateral template

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

@@ -10,11 +10,12 @@
       </mat-error>
     </mat-form-field>
 
-    <h4 fxFlex="98%" class="mat-h4">Term Options</h4>
+    <h4 fxFlex="98%" class="mat-h4">Term Options <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></h4>
 
     <mat-form-field fxFlex="48%">
       <mat-label>Loan Term</mat-label>
-      <input type="number" matInput required formControlName="loanTermFrequency">
+      <input type="number" matInput required disabled formControlName="loanTermFrequency">
       <mat-error *ngIf="loansAccountTermsForm.controls.loanTermFrequency.hasError('required')">
         Loan Term is <strong>required</strong>
       </mat-error>
@@ -32,6 +33,9 @@
       </mat-error>
     </mat-form-field>
 
+    <h4 fxFlex="98%" class="mat-h4">Repayments <i class="fas fa-question" matTooltip="Enter the total count of repayments that loan schedule has excluding the down-payment.
+      Example: if the loan account has 4 Installments including down-payment then number of repayments is equal to 3"></i></h4>
+
     <mat-form-field fxFlex="48%">
       <mat-label>Number of repayments</mat-label>
       <input type="number" matInput formControlName="numberOfRepayments">
@@ -52,7 +56,7 @@
 
     <mat-form-field fxFlex="48%">
       <mat-label>Repaid every</mat-label>
-      <input matInput required formControlName="repaymentEvery">
+      <input type="number" matInput required formControlName="repaymentEvery">
       <mat-error *ngIf="loansAccountTermsForm.controls.repaymentEvery.hasError('required')">
         Repaid every is <strong>required</strong>
       </mat-error>
@@ -60,7 +64,7 @@
 
     <mat-form-field fxFlex="48%">
       <mat-label>Frequency</mat-label>
-      <mat-select formControlName="repaymentFrequencyType" required>
+      <mat-select formControlName="repaymentFrequencyType" disabled required>
         <mat-option *ngFor="let repaymentFrequencyType of termFrequencyTypeData" [value]="repaymentFrequencyType.id">
           {{ repaymentFrequencyType.value }}
         </mat-option>

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

@@ -2,7 +2,7 @@
 import { Component, OnInit, Input, OnChanges } from '@angular/core';
 import { UntypedFormGroup, UntypedFormBuilder, Validators, FormArray } from '@angular/forms';
 import { MatDialog } from '@angular/material/dialog';
-import { ActivatedRoute, Router } from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
 import { LoansAccountAddCollateralDialogComponent } from 'app/loans/custom-dialog/loans-account-add-collateral-dialog/loans-account-add-collateral-dialog.component';
 import { SettingsService } from 'app/settings/settings.service';
 import { DeleteDialogComponent } from 'app/shared/delete-dialog/delete-dialog.component';
@@ -10,7 +10,6 @@ import { FormDialogComponent } from 'app/shared/form-dialog/form-dialog.componen
 import { DatepickerBase } from 'app/shared/form-dialog/formfield/model/datepicker-base';
 import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base';
 import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base';
-import { TooltipPosition } from '@angular/material/tooltip';
 
 /**
  * Create Loans Account Terms Step
@@ -22,6 +21,8 @@ import { TooltipPosition } from '@angular/material/tooltip';
 })
 export class LoansAccountTermsStepComponent implements OnInit, OnChanges {
 
+  /** Loans Product Options */
+  @Input() loansProductOptions: any;
   /** Loans Account Product Template */
   @Input() loansAccountProductTemplate: any;
   /** Loans Account Template */
@@ -217,6 +218,7 @@ export class LoansAccountTermsStepComponent implements OnInit, OnChanges {
     }
     this.createloansAccountTermsForm();
     // this.setCustomValidators();
+    this.setLoanTermListener();
   }
 
   allowAddDisbursementDetails() {
@@ -244,15 +246,36 @@ export class LoansAccountTermsStepComponent implements OnInit, OnChanges {
       });
   }
 
+  /** Custom Listeners for the form to calculate Loan Term */
+  setLoanTermListener() {
+    this.loansAccountTermsForm.get('numberOfRepayments').valueChanges
+      .subscribe(numberOfRepayments => {
+        const repaymentEvery: number =  this.loansAccountTermsForm.value.repaymentEvery;
+        this.calculateLoanTerm(numberOfRepayments, repaymentEvery);
+      });
+
+    this.loansAccountTermsForm.get('repaymentEvery').valueChanges
+      .subscribe(repaymentEvery => {
+        const numberOfRepayments: number = this.loansAccountTermsForm.value.numberOfRepayments;
+        this.calculateLoanTerm(numberOfRepayments, repaymentEvery);
+      });
+
+      this.loansAccountTermsForm.get('loanTermFrequencyType').valueChanges
+        .subscribe(loanTermFrequencyType => {
+          this.loansAccountTermsForm.patchValue({'repaymentFrequencyType': loanTermFrequencyType});
+      });
+
+  }
+
   /** Create Loans Account Terms Form */
   createloansAccountTermsForm() {
     this.loansAccountTermsForm = this.formBuilder.group({
       'principalAmount': ['', Validators.required],
-      'loanTermFrequency': ['', Validators.required],
+      'loanTermFrequency': [{ value: '', disabled: true }, Validators.required],
       'loanTermFrequencyType': ['', Validators.required],
       'numberOfRepayments': ['', Validators.required],
       'repaymentEvery': ['', Validators.required],
-      'repaymentFrequencyType': ['', Validators.required],
+      'repaymentFrequencyType': [{ value: '', disabled: true }, Validators.required],
       'repaymentFrequencyNthDayType': [''],
       'repaymentFrequencyDayOfWeekType': [''],
       'repaymentsStartingFromDate': [''],
@@ -279,6 +302,11 @@ export class LoansAccountTermsStepComponent implements OnInit, OnChanges {
     });
   }
 
+  calculateLoanTerm(numberOfRepayments: number, repaymentEvery: number): void {
+    const loanTerm = numberOfRepayments * repaymentEvery;
+    this.loansAccountTermsForm.patchValue({'loanTermFrequency': loanTerm});
+  }
+
   /**
    * Gets the Disbursement Data array.
    * @returns {Array} Disbursement Data array.