Enable or Disable DownPayment at Loan account level

2024-07-09 18:03:50 -06:00
parent b5990af9e2
commit 272922caed
13 changed files with 105 additions and 32 deletions
@@ -4,8 +4,11 @@

    <mat-form-field fxFlex="72%">
      <mat-label>{{"labels.inputs.Product Name" | translate}}</mat-label>
-      <mat-select formControlName="productId" matTooltip="{{ 'tooltips.Name of the loan product' | translate}}" required>
-        <mat-option *ngFor="let product of productData" [value]="product.id">
+      <mat-select required matTooltip="{{ 'tooltips.Name of the loan product' | translate}}" formControlName="productId">
+        <mat-option>
+          <ngx-mat-select-search [formControl]="filterFormCtrl"></ngx-mat-select-search>
+        </mat-option>
+        <mat-option *ngFor="let product of productData | async" [value]="product.id">
          {{ product.name }}
        </mat-option>
      </mat-select>
@@ -1,13 +1,14 @@
 /** Angular Imports */
-import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
-import { UntypedFormGroup, UntypedFormBuilder, Validators } from '@angular/forms';
+import { Component, OnInit, Input, Output, EventEmitter, OnDestroy } from '@angular/core';
+import { UntypedFormGroup, UntypedFormBuilder, Validators, UntypedFormControl } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';
 import { SettingsService } from 'app/settings/settings.service';
-import { TooltipPosition } from '@angular/material/tooltip';

 /** Custom Services */
 import { LoansService } from '../../loans.service';
 import { Commons } from 'app/core/utils/commons';
+import { takeUntil } from 'rxjs/operators';
+import { ReplaySubject, Subject } from 'rxjs';

 /**
 * Loans Account Details Step
@@ -17,7 +18,7 @@ import { Commons } from 'app/core/utils/commons';
  templateUrl: './loans-account-details-step.component.html',
  styleUrls: ['./loans-account-details-step.component.scss']
 })
-export class LoansAccountDetailsStepComponent implements OnInit {
+export class LoansAccountDetailsStepComponent implements OnInit, OnDestroy {

  /** Loans Account Template */
  @Input() loansAccountTemplate: any;
@@ -27,7 +28,7 @@ export class LoansAccountDetailsStepComponent implements OnInit {
  /** Maximum date allowed. */
  maxDate = new Date(2100, 0, 1);
  /** Product Data */
-  productData: any;
+  productList: any;
  /** Loan Officer Data */
  loanOfficerOptions: any;
  /** Loan Purpose Options */
@@ -44,6 +45,12 @@ export class LoansAccountDetailsStepComponent implements OnInit {
  loanId: any = null;

  loanProductSelected = false;
+  /** Currency data. */
+  protected productData: ReplaySubject<string[]> = new ReplaySubject<string[]>(1);
+  /** control for the filter select */
+  protected filterFormCtrl: UntypedFormControl = new UntypedFormControl('');
+  /** Subject that emits when the component has been destroyed. */
+  protected _onDestroy = new Subject<void>();

  /** Loans Account Template with product data  */
  @Output() loansAccountProductTemplate = new EventEmitter();
@@ -66,7 +73,7 @@ export class LoansAccountDetailsStepComponent implements OnInit {
    this.maxDate = this.settingsService.maxFutureDate;
    this.buildDependencies();
    if (this.loansAccountTemplate) {
-      this.productData = this.loansAccountTemplate.productOptions.sort(this.commons.dynamicSort('name'));
+      this.productList = this.loansAccountTemplate.productOptions.sort(this.commons.dynamicSort('name'));
      if (this.loansAccountTemplate.loanProductId) {
        this.loansAccountDetailsForm.patchValue({
          'productId': this.loansAccountTemplate.loanProductId,
@@ -79,6 +86,31 @@ export class LoansAccountDetailsStepComponent implements OnInit {
        });
      }
    }
+    this.filterFormCtrl.valueChanges
+    .pipe(takeUntil(this._onDestroy))
+    .subscribe(() => {
+      this.searchItem();
+    });
+    this.productData.next(this.productList.slice());
+  }
+
+  ngOnDestroy(): void {
+    this._onDestroy.next();
+    this._onDestroy.complete();
+  }
+
+  searchItem(): void {
+    if (this.productList) {
+      const search: string = this.filterFormCtrl.value.toLowerCase();
+
+      if (!search) {
+          this.productData.next(this.productList.slice());
+      } else {
+        this.productData.next(this.productList.filter((option: any) => {
+          return option['name'].toLowerCase().indexOf(search) >= 0;
+        }));
+      }
+    }
  }

  /**
@@ -72,6 +72,11 @@
      {{loansAccount.repaymentFrequencyDayOfWeekType | find: loansAccountProductTemplate.repaymentFrequencyDaysOfWeekTypeOptions:'id': 'name'}}</span>
  </div>

+  <div fxFlexFill *ngIf="productEnableDownPayment">
+    <span fxFlex="40%">{{ 'labels.inputs.Enable Down Payments' | translate}}:</span>
+    <span  fxFlex="60%">{{ loansAccount.enableDownPayment | yesNo }}</span>
+  </div>
+
  <div fxFlexFill *ngIf="loansAccount.repaymentsStartingFromDate">
    <span fxFlex="40%">{{"labels.inputs.First repayment on" | translate}}:</span>
    <span fxFlex="60%">{{ loansAccount.repaymentsStartingFromDate | dateFormat }}</span>
@@ -1,5 +1,5 @@
 /** Angular Imports */
-import { Component, OnInit, Input, Output, EventEmitter, OnDestroy } from '@angular/core';
+import { Component, OnInit, Input, Output, EventEmitter, OnDestroy, OnChanges, SimpleChanges } from '@angular/core';

 /**
 * Create Loans Account Preview Step
@@ -9,7 +9,7 @@ import { Component, OnInit, Input, Output, EventEmitter, OnDestroy } from '@angu
  templateUrl: './loans-account-preview-step.component.html',
  styleUrls: ['./loans-account-preview-step.component.scss']
 })
-export class LoansAccountPreviewStepComponent implements OnInit {
+export class LoansAccountPreviewStepComponent implements OnInit, OnChanges {

  /** Loans Account Template */
  @Input() loansAccountTemplate: any = [];
@@ -25,8 +25,14 @@ export class LoansAccountPreviewStepComponent implements OnInit {
  /** Overdue Charges Displayed Columns */
  overdueChargesDisplayedColumns: string[] = ['name', 'type', 'amount', 'collectedon'];

+  productEnableDownPayment = false;
+
  constructor() { }

  ngOnInit() { }

+  ngOnChanges(changes: SimpleChanges): void {
+    this.productEnableDownPayment = this.loansAccountProductTemplate.product.enableDownPayment;
+  }
+
 }
@@ -2,13 +2,10 @@

  <div fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column">

-    <mat-form-field fxFlex="48%">
-      <mat-label>{{"labels.inputs.Principal" | translate}} {{currencyDisplaySymbol}}</mat-label>
-      <input type="number" matInput formControlName="principalAmount">
-      <mat-error *ngIf="loansAccountTermsForm.controls.principalAmount.hasError('required')">
-        {{"labels.inputs.Principal" | translate}} {{"labels.commons.is" | translate}} <strong>{{"labels.commons.required" | translate}}</strong>
-      </mat-error>
-    </mat-form-field>
+    <mifosx-input-amount fxFlex="48%"  *ngIf="currency" [currency]="currency" [isRequired]="true"
+      [inputFormControl]="loansAccountTermsForm.controls.principalAmount"
+      [inputLabel]="'Principal'">
+    </mifosx-input-amount>

    <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></h4>
@@ -106,6 +103,11 @@
      </mat-select>
    </mat-form-field>

+    <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" *ngIf="productEnableDownPayment">
+      {{'labels.inputs.Enable Down Payment' | translate}}
+    </mat-checkbox>
+
    <h4 fxFlex="98%" class="mat-h4">{{"labels.inputs.Nominal interest rate" | translate}}</h4>

    <ng-container *ngIf="!loansAccountTermsData?.isLoanProductLinkedToFloatingRate">
@@ -12,6 +12,7 @@ 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 { Currency } from 'app/shared/models/general.model';
 import { CodeName, OptionData } from 'app/shared/models/option-data.model';

 /**
@@ -63,7 +64,6 @@ export class LoansAccountTermsStepComponent implements OnInit, OnChanges {
  clientActiveLoanData: any;
  /** Multi Disbursement Data */
  disbursementDataSource: {}[] = [];
-  currencyDisplaySymbol = '$';
  /** Loan repayment strategies */
  transactionProcessingStrategyOptions: any = [];
  repaymentStrategyDisabled = false;
@@ -85,11 +85,12 @@ export class LoansAccountTermsStepComponent implements OnInit, OnChanges {
  pristine = true;

  loanId: any = null;
-
  loanScheduleType: OptionData | null = null;
  loanProduct: LoanProduct | null = null;
-
  interestRateFrequencyTypeData: any[] = [];
+  currency: Currency;
+
+  productEnableDownPayment = false;

  /**
   * Create Loans Account Terms Form
@@ -108,19 +109,19 @@ export class LoansAccountTermsStepComponent implements OnInit, OnChanges {
   */
  ngOnChanges() {
    if (this.loansAccountProductTemplate) {
+      this.currency = this.loansAccountProductTemplate.currency;
+
      this.loansAccountTermsData = this.loansAccountProductTemplate;
-      this.currencyDisplaySymbol = this.loansAccountTermsData.currency.displaySymbol;
      if (this.loanId != null && this.loansAccountTemplate.accountNo) {
        this.loansAccountTermsData = this.loansAccountTemplate;
      }
+      this.productEnableDownPayment = this.loansAccountTermsData.product.enableDownPayment;

      if (this.loansAccountTermsData.product) {
        this.loanProduct = this.loansAccountTermsData.product;
      }

      this.interestRateFrequencyTypeData = this.loansAccountTermsData.interestRateFrequencyTypeOptions;
-      console.log(this.loansAccountTermsData);
-      console.log(this.loanProduct);

      this.loansAccountTermsForm.patchValue({
        'principalAmount': this.loansAccountTermsData.principal,
@@ -167,6 +168,10 @@ export class LoansAccountTermsStepComponent implements OnInit, OnChanges {
        this.loansAccountTermsForm.addControl('enableInstallmentLevelDelinquency', new UntypedFormControl(this.loansAccountTermsData.enableInstallmentLevelDelinquency || this.loanProduct.enableInstallmentLevelDelinquency));
      }
      this.collateralDataSource = this.loansAccountTermsData.collateral || [];
+      if (this.productEnableDownPayment) {
+        const enableDownPayment = (this.loansAccountTermsData['enableDownPayment'] === false) ? false : true;
+        this.loansAccountTermsForm.addControl('enableDownPayment', new UntypedFormControl(enableDownPayment));
+      }

      const allowAttributeOverrides = this.loansAccountTermsData.product.allowAttributeOverrides;
      if (!allowAttributeOverrides.repaymentEvery) {
@@ -318,7 +323,7 @@ export class LoansAccountTermsStepComponent implements OnInit, OnChanges {

  hasFixedLength(): boolean {
    if (this.loansAccountTermsData) {
-      return this.loansAccountTermsData.product.fixedLength ? true : false;
+      return this.loansAccountTermsData.product?.fixedLength ? true : false;
    }
    return false;
  }
@@ -529,6 +534,14 @@ export class LoansAccountTermsStepComponent implements OnInit, OnChanges {
    return true;
  }

+  isDownPaymentEnabled(): boolean {
+    console.log(this.loanProduct);
+    if (!this.loanProduct || !this.loanProduct.delinquencyBucket) {
+      return false;
+    }
+    return true;
+  }
+
  /**
   * Returns loans account terms form value.
   */
@@ -302,8 +302,7 @@ const routes: Routes = [
        component: LoanAccountActionsComponent,
        data: { title: 'Loan Account Actions', breadcrumb: 'action', routeParamBreadcrumb: 'action' },
        resolve: {
-          actionButtonData: LoanActionButtonResolver,
-          loanDetailsData: LoanDetailsResolver
+          actionButtonData: LoanActionButtonResolver
        }
      },
      {
@@ -47,6 +47,11 @@
            <span fxFlex="50%"> {{"labels.text." + loanDetails.interestType.value | translate}} </span>
        </div>

+        <div fxFlexFill>
+            <span fxFlex="50%">{{ 'labels.inputs.Enable Down Payments' | translate}}:</span>
+            <span fxFlex="50%">{{ loanDetails.enableDownPayment | yesNo }}</span>
+        </div>
+
        <div fxFlexFill>
            <span fxFlex="50%"> {{"labels.inputs.Grace: On Principal Payment" | translate}}</span>
            <span fxFlex="50%"> {{loanDetails.graceOnPrincipalPayment}} </span>
@@ -27,10 +27,10 @@
            <mat-datepicker #disbursementDatePicker></mat-datepicker>
          </mat-form-field>

-          <mat-form-field>
-            <mat-label>{{"labels.inputs.Approved Amount" | translate}}</mat-label>
-            <input matInput type="number" formControlName="approvedLoanAmount">
-          </mat-form-field>
+          <mifosx-input-amount [currency]="currency" [isRequired]="true"
+            [inputFormControl]="approveLoanForm.controls.approvedLoanAmount"
+            [inputLabel]="'Approved Amount'">
+          </mifosx-input-amount>

          <mat-form-field>
            <mat-label>{{"labels.inputs.Transaction Amount" | translate}}</mat-label>
@@ -7,6 +7,7 @@ import { Dates } from 'app/core/utils/dates';
 /** Custom Services. */
 import { LoansService } from 'app/loans/loans.service';
 import { SettingsService } from 'app/settings/settings.service';
+import { Currency } from 'app/shared/models/general.model';

 /**
 * Approve Loan component.
@@ -28,6 +29,7 @@ export class ApproveLoanComponent implements OnInit {
  minDate = new Date(2000, 0, 1);
  /** Loan Id */
  loanId: any;
+  currency: Currency;

  /**
   * Retrieve data from `Resolver`.
@@ -46,6 +48,7 @@ export class ApproveLoanComponent implements OnInit {
    private settingsService: SettingsService) {
    this.route.data.subscribe((data: { actionButtonData: any }) => {
      this.loanData = data.actionButtonData;
+      this.currency = data.actionButtonData.currency;
    });
    this.loanId = this.route.snapshot.params['loanId'];
  }
@@ -89,9 +89,8 @@ export class LoanAccountActionsComponent {
   * @param route Activated Route.
   */
  constructor(private route: ActivatedRoute) {
-      this.route.data.subscribe(( data: { actionButtonData: any, loanDetailsData: any }) => {
+      this.route.data.subscribe(( data: { actionButtonData: any }) => {
        this.actionButtonData = data.actionButtonData;
-        this.actionButtonData.currency = data.loanDetailsData.currency;
      });

    this.route.params.subscribe(params => {
@@ -20,3 +20,7 @@ table {
 .additional {
  color: $status-approved;
 }
+
+.downpayment {
+  color: $status-downpayment;
+}
@@ -49,6 +49,8 @@ export class RepaymentScheduleTabComponent implements OnInit {
  installmentStyle(installment: any): string {
    if (installment.isAdditional) {
      return 'additional';
+    } else if (installment.downPaymentPeriod) {
+      return 'downpayment';
    }
    return '';
  }