Advanced payment allocation configuration on Loan products (#1852)

Co-authored-by: Jose Alberto Hernandez <[email protected]>
openMF · Aug 28, 2023 · 2dab3b7 · 2dab3b7
1 parent 10e84d1
commit 2dab3b7
Show file tree

Hide file tree

Showing 9 changed files with 249 additions and 69 deletions.
diff --git a/src/app/products/loan-products/create-loan-product/create-loan-product.component.html b/src/app/products/loan-products/create-loan-product/create-loan-product.component.html
@@ -53,17 +53,19 @@
       <mifosx-loan-product-settings-step
         [loanProductsTemplate]="loanProductsTemplate"
         [isLinkedToFloatingInterestRates]="loanProductTermsForm.get('isLinkedToFloatingInterestRates')"
+        (advancePaymentStrategy)="advancePaymentStrategy($event)"
       >
       </mifosx-loan-product-settings-step>
 
     </mat-step>
 
-    <mat-step *ngIf="isAdvancePaymentStrategy">
+    <mat-step *ngIf="isAdvancedPaymentStrategy">
 
-      <ng-template matStepLabel>PAYMENT STRATEGY</ng-template>
+      <ng-template matStepLabel>PAYMENT ALLOCATION</ng-template>
 
       <mifosx-loan-product-payment-strategy-step
         [loanProductsTemplate]="loanProductsTemplate"
+        (paymentAllocation)="setPaymentAllocation($event)"
       >
       </mifosx-loan-product-payment-strategy-step>
 

diff --git a/src/app/products/loan-products/create-loan-product/create-loan-product.component.ts b/src/app/products/loan-products/create-loan-product/create-loan-product.component.ts
@@ -8,12 +8,12 @@ import { LoanProductCurrencyStepComponent } from '../loan-product-stepper/loan-p
 import { LoanProductTermsStepComponent } from '../loan-product-stepper/loan-product-terms-step/loan-product-terms-step.component';
 import { LoanProductSettingsStepComponent } from '../loan-product-stepper/loan-product-settings-step/loan-product-settings-step.component';
 import { LoanProductChargesStepComponent } from '../loan-product-stepper/loan-product-charges-step/loan-product-charges-step.component';
-import { LoanProductPaymentStrategyStepComponent } from '../loan-product-stepper/loan-product-payment-strategy-step/loan-product-payment-strategy-step.component';
 import { LoanProductAccountingStepComponent } from '../loan-product-stepper/loan-product-accounting-step/loan-product-accounting-step.component';
 
 /** Custom Services */
 import { ProductsService } from 'app/products/products.service';
 import { LoanProducts } from '../loan-products';
+import { PaymentAllocation } from '../loan-product-stepper/loan-product-payment-strategy-step/loan-product-payment-strategy-step.component';
 
 @Component({
   selector: 'mifosx-create-loan-product',
@@ -26,15 +26,15 @@ export class CreateLoanProductComponent implements OnInit {
   @ViewChild(LoanProductCurrencyStepComponent, { static: true }) loanProductCurrencyStep: LoanProductCurrencyStepComponent;
   @ViewChild(LoanProductTermsStepComponent, { static: true }) loanProductTermsStep: LoanProductTermsStepComponent;
   @ViewChild(LoanProductSettingsStepComponent, { static: true }) loanProductSettingsStep: LoanProductSettingsStepComponent;
-  @ViewChild(LoanProductPaymentStrategyStepComponent, { static: true }) loanProductPaymentStrategyStep: LoanProductPaymentStrategyStepComponent;
   @ViewChild(LoanProductChargesStepComponent, { static: true }) loanProductChargesStep: LoanProductChargesStepComponent;
   @ViewChild(LoanProductAccountingStepComponent, { static: true }) loanProductAccountingStep: LoanProductAccountingStepComponent;
 
   loanProductsTemplate: any;
   accountingRuleData = ['None', 'Cash', 'Accrual (periodic)', 'Accrual (upfront)'];
   itemsByDefault: any[] = [];
 
-  isAdvancePaymentStrategy = false;
+  isAdvancedPaymentStrategy = false;
+  paymentAllocation: PaymentAllocation[] = [];
 
    /**
     * @param {ActivatedRoute} route Activated Route.
@@ -75,6 +75,14 @@ export class CreateLoanProductComponent implements OnInit {
     return this.loanProductTermsStep.loanProductTermsForm;
   }
 
+  advancePaymentStrategy(value: string) {
+    this.isAdvancedPaymentStrategy = (value === 'advanced-payment-allocation-strategy');
+  }
+
+  setPaymentAllocation(paymentAllocation: PaymentAllocation[]) {
+    this.paymentAllocation = paymentAllocation;
+  }
+
   get loanProductSettingsForm() {
     return this.loanProductSettingsStep.loanProductSettingsForm;
   }
@@ -83,12 +91,7 @@ export class CreateLoanProductComponent implements OnInit {
     return this.loanProductAccountingStep.loanProductAccountingForm;
   }
 
-  get loanProductPaymentStrategyForm() {
-    return this.loanProductPaymentStrategyStep.loanProductPaymentStrategyForm;
-  }
-
   get loanProductFormValid() {
-    this.isAdvancePaymentStrategy = (this.loanProductSettingsStep.loanProductSettings.transactionProcessingStrategyCode === 'advanced-payment-allocation-strategy');
     return (
       this.loanProductDetailsForm.valid &&
       this.loanProductCurrencyForm.valid &&
@@ -99,14 +102,18 @@ export class CreateLoanProductComponent implements OnInit {
   }
 
   get loanProduct() {
-    return {
+    const loanProduct = {
       ...this.loanProductDetailsStep.loanProductDetails,
       ...this.loanProductCurrencyStep.loanProductCurrency,
       ...this.loanProductTermsStep.loanProductTerms,
       ...this.loanProductSettingsStep.loanProductSettings,
       ...this.loanProductChargesStep.loanProductCharges,
       ...this.loanProductAccountingStep.loanProductAccounting
     };
+    if (this.isAdvancedPaymentStrategy) {
+      loanProduct['paymentAllocation'] = this.paymentAllocation;
+    }
+    return loanProduct;
   }
 
   submit() {

diff --git a/src/app/products/loan-products/edit-loan-product/edit-loan-product.component.html b/src/app/products/loan-products/edit-loan-product/edit-loan-product.component.html
@@ -46,18 +46,32 @@
 
       </mat-step>
 
-      <mat-step [stepControl]="loanProductSettingsForm" completed>
+      <mat-step [stepControl]="loanProductSettingsForm">
 
         <ng-template matStepLabel>SETTINGS</ng-template>
 
         <mifosx-loan-product-settings-step
           [loanProductsTemplate]="loanProductAndTemplate"
           [isLinkedToFloatingInterestRates]="loanProductTermsForm.get('isLinkedToFloatingInterestRates')"
+          (advancePaymentStrategy)="advancePaymentStrategy($event)"
         >
         </mifosx-loan-product-settings-step>
 
       </mat-step>
 
+      <mat-step *ngIf="isAdvancedPaymentStrategy">
+
+        <ng-template matStepLabel>PAYMENT ALLOCATION</ng-template>
+
+        <mifosx-loan-product-payment-strategy-step
+          [loanProductsTemplate]="loanProductsTemplate"
+          (paymentAllocation)="setPaymentAllocation($event)"
+          (paymentAllocationChange)="paymentAllocationChanged($event)"
+        >
+        </mifosx-loan-product-payment-strategy-step>
+
+      </mat-step>
+
       <mat-step completed>
 
         <ng-template matStepLabel>CHARGES</ng-template>

diff --git a/src/app/products/loan-products/edit-loan-product/edit-loan-product.component.ts b/src/app/products/loan-products/edit-loan-product/edit-loan-product.component.ts
@@ -14,6 +14,7 @@ import { LoanProductAccountingStepComponent } from '../loan-product-stepper/loan
 import { ProductsService } from 'app/products/products.service';
 import { GlobalConfiguration } from 'app/system/configurations/global-configurations-tab/configuration.model';
 import { LoanProducts } from '../loan-products';
+import { PaymentAllocation } from '../loan-product-stepper/loan-product-payment-strategy-step/loan-product-payment-strategy-step.component';
 
 @Component({
   selector: 'mifosx-edit-loan-product',
@@ -33,6 +34,10 @@ export class EditLoanProductComponent implements OnInit {
   accountingRuleData = ['None', 'Cash', 'Accrual (periodic)', 'Accrual (upfront)'];
   itemsByDefault: GlobalConfiguration[] = [];
 
+  isAdvancedPaymentStrategy = false;
+  wasPaymentAllocationChanged = false;
+  paymentAllocation: PaymentAllocation[] = [];
+
   /**
    * @param {ActivatedRoute} route Activated Route.
    * @param {ProductsService} productsService Product Service.
@@ -75,6 +80,18 @@ export class EditLoanProductComponent implements OnInit {
     return this.loanProductSettingsStep.loanProductSettingsForm;
   }
 
+  advancePaymentStrategy(value: string): void {
+    this.isAdvancedPaymentStrategy = (value === 'advanced-payment-allocation-strategy');
+  }
+
+  setPaymentAllocation(paymentAllocation: PaymentAllocation[]): void {
+    this.paymentAllocation = paymentAllocation;
+  }
+
+  paymentAllocationChanged(value: boolean): void {
+    this.wasPaymentAllocationChanged = value;
+  }
+
   get loanProductAccountingForm() {
     return this.loanProductAccountingStep.loanProductAccountingForm;
   }
@@ -92,20 +109,25 @@ export class EditLoanProductComponent implements OnInit {
         !this.loanProductTermsForm.pristine ||
         !this.loanProductSettingsForm.pristine ||
         !this.loanProductChargesStep.pristine ||
-        !this.loanProductAccountingForm.pristine
+        !this.loanProductAccountingForm.pristine ||
+        this.wasPaymentAllocationChanged
       )
     );
   }
 
   get loanProduct() {
-    return {
+    const loanProduct = {
       ...this.loanProductDetailsStep.loanProductDetails,
       ...this.loanProductCurrencyStep.loanProductCurrency,
       ...this.loanProductTermsStep.loanProductTerms,
       ...this.loanProductSettingsStep.loanProductSettings,
       ...this.loanProductChargesStep.loanProductCharges,
       ...this.loanProductAccountingStep.loanProductAccounting
     };
+    if (this.isAdvancedPaymentStrategy) {
+      loanProduct['paymentAllocation'] = this.paymentAllocation;
+    }
+    return loanProduct;
   }
 
   submit() {

diff --git a/...pper/loan-product-payment-strategy-step/loan-product-payment-strategy-step.component.html b/...pper/loan-product-payment-strategy-step/loan-product-payment-strategy-step.component.html
@@ -1,43 +1,27 @@
 <div class="container space-top" fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column">
 
-  <mat-form-field fxFlex="31%">
-    <mat-label>Transaction Type</mat-label>
-    <mat-select [formControl]="transactionType">
-      <mat-option *ngFor="let job of transactionTypeOptions" [value]="transactionType">
-        {{ transactionType }}
+  <mat-form-field fxFlex="33%">
+    <mat-label>Future Installment Allocation Rule</mat-label>
+    <mat-select [formControl]="futureInstallmentAllocationRule">
+      <mat-option *ngFor="let installmentAllocation of installmentAllocationOptions" [value]="installmentAllocation.code">
+        {{ installmentAllocation.name | translate }}
       </mat-option>
     </mat-select>
   </mat-form-field>
 
-  <div class="action-button" fxLayoutGap="25px">
-    <button mat-raised-button color="primary" (click)="addTransactionType()">
-      <fa-icon icon="plus" class="m-r-10"></fa-icon>Add Transaction Type
-    </button>
-  </div>
-
   <div class="mat-elevation-z8 container">
 
     <table mat-table [dataSource]="transactionTypesData" #table cdkDropList [cdkDropListData]="transactionTypesData"
       (cdkDropListDropped)="dropTable($event)">
 
-      <ng-container matColumnDef="transactionName">
-        <th mat-header-cell *matHeaderCellDef> Transaction Type </th>
-        <td mat-cell *matCellDef="let jobStep"> {{ jobStep.stepName }} </td>
-      </ng-container>
-
-      <ng-container matColumnDef="transactionOrder">
+      <ng-container matColumnDef="order">
         <th mat-header-cell *matHeaderCellDef> Order </th>
-        <td mat-cell *matCellDef="let jobStep"> {{ jobStep.order }} </td>
+        <td mat-cell *matCellDef="let transactionType; let rowIndex = index"> {{ (rowIndex + 1) }} </td>
       </ng-container>
 
-      <ng-container matColumnDef="actions">
-        <th mat-header-cell *matHeaderCellDef> Actions </th>
-        <td mat-cell *matCellDef="let row; let rowIndex = index">
-          <button type="button" mat-icon-button color="warn" (click)="removeTransactionType(rowIndex)" matTooltip="Delete"
-            matTooltipPosition="left">
-            <fa-icon icon="trash"></fa-icon>
-          </button>
-        </td>
+      <ng-container matColumnDef="transactionName">
+        <th mat-header-cell *matHeaderCellDef> Transaction Type </th>
+        <td mat-cell *matCellDef="let transactionType"> {{ transactionType.name }} </td>
       </ng-container>
 
       <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>