Loan account with Fixed Length attribute

src/app/deposits/recurring-deposits/recurring-deposits-account-view/general-tab/general-tab.component.html

@@ -266,7 +266,7 @@
           <td><span>{{recurringDepositsAccountData.interestCalculationType.value}}</span></td>
         </tr>
         <tr>
-          <td># {{"labels.inputs.Days in Year" | translate }}</td>
+          <td>{{"labels.inputs.Days in Year" | translate }}</td>
           <td><span>{{recurringDepositsAccountData.interestCalculationDaysInYearType.value}}</span></td>
         </tr>
         <tr *ngIf="recurringDepositsAccountData.preClosurePenalApplicable">
@@ -295,7 +295,7 @@
           <td><span>{{recurringDepositsAccountData.interestCalculationType.value}}</span></td>
         </tr>
         <tr>
-          <td># {{"labels.inputs.Days in Year" | translate }}</td>
+          <td>{{"labels.inputs.Days in Year" | translate }}</td>
           <td><span>{{recurringDepositsAccountData.interestCalculationDaysInYearType.value}}</span></td>
         </tr>
         <tr *ngIf="recurringDepositsAccountData.preClosurePenalApplicable">

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

@@ -86,7 +86,7 @@
       </mat-select>
     </mat-form-field>
 
-    <mat-form-field fxFlex="20%" *ngIf="loansAccountTermsForm.controls.repaymentFrequencyType.value == 2">
+    <mat-form-field fxFlex="14%" *ngIf="loansAccountTermsForm.controls.repaymentFrequencyType.value == 2">
       <mat-label>{{"labels.inputs.Select On" | translate}}</mat-label>
       <mat-select formControlName="repaymentFrequencyNthDayType">
         <mat-option *ngFor="let repaymentFrequencyNthDayType of repaymentFrequencyNthDayTypeData"
@@ -96,7 +96,7 @@
       </mat-select>
     </mat-form-field>
 
-    <mat-form-field fxFlex="20%" *ngIf="loansAccountTermsForm.controls.repaymentFrequencyType.value == 2">
+    <mat-form-field fxFlex="14%" *ngIf="loansAccountTermsForm.controls.repaymentFrequencyType.value == 2">
       <mat-label>{{"labels.inputs.Select Day" | translate}}</mat-label>
       <mat-select formControlName="repaymentFrequencyDayOfWeekType">
         <mat-option *ngFor="let repaymentFrequencyDayOfWeekType of repaymentFrequencyDaysOfWeekTypeData"
@@ -124,7 +124,7 @@
         </mat-select>
       </mat-form-field>
     
-      <mat-form-field fxFlex="23%">
+      <mat-form-field fxFlex="14%">
         <mat-label>{{"labels.inputs.Amortization" | translate}}</mat-label>
         <mat-select required matTooltip="{{ 'tooltips.The Amortization value' | translate}}" formControlName="amortizationType">
           <mat-option *ngFor="let amortizationType of amortizationTypeData" [value]="amortizationType.id">
@@ -135,8 +135,13 @@
           {{"labels.inputs.Amortization Type" | translate}} {{"labels.commons.is" | translate}} <strong>{{"labels.commons.required" | translate}}</strong>
         </mat-error>
       </mat-form-field>
+      
+      <mat-form-field fxFlex="14%" *ngIf="isEqualPrincipalPayments()">
+        <mat-label>{{"labels.inputs.Principal Percentage Per Installment" | translate}}</mat-label>
+        <input type="number" matInput formControlName="fixedPrincipalPercentagePerInstallment">
+      </mat-form-field>
 
-      <mat-checkbox fxFlex="23%" formControlName="isEqualAmortization"
+      <mat-checkbox fxFlex="14%" formControlName="isEqualAmortization"
         [checked]="loansAccountTermsData?.isEqualAmortization">
         <p>{{"labels.inputs.Is Equal Amortization" | translate}}</p>
       </mat-checkbox>
@@ -175,6 +180,7 @@
       </div>
 
     </ng-container>
+    <h4 fxFlex="98%" class="mat-h4">{{"labels.inputs.Loan Schedule" | translate}}</h4>
 
     <div fxFlex="48%" *ngIf="loanScheduleType">
       <span fxFlex="40%"><p>{{"labels.inputs.Loan Schedule Type" | translate}}</p></span>

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

@@ -269,10 +269,19 @@ export class LoansAccountTermsStepComponent implements OnInit, OnChanges {
         this.calculateLoanTerm(numberOfRepayments, repaymentEvery);
       });
 
-      this.loansAccountTermsForm.get('loanTermFrequencyType').valueChanges
+    this.loansAccountTermsForm.get('loanTermFrequencyType').valueChanges
         .subscribe(loanTermFrequencyType => {
           this.loansAccountTermsForm.patchValue({'repaymentFrequencyType': loanTermFrequencyType});
       });
+
+    this.loansAccountTermsForm.get('amortizationType').valueChanges
+      .subscribe(amortizationType => {
+        if (amortizationType === 0) {  // Equal Principal Payments
+          this.loansAccountTermsForm.addControl('fixedPrincipalPercentagePerInstallment', new UntypedFormControl(''));
+        } else {  // Equal Installments
+          this.loansAccountTermsForm.removeControl('fixedPrincipalPercentagePerInstallment');
+        }
+    });
   }
 
   setAdvancedPaymentStrategyControls(): void {
@@ -282,7 +291,7 @@ export class LoansAccountTermsStepComponent implements OnInit, OnChanges {
         this.loansAccountTermsForm.removeControl('fixedLength');
         if (this.loansAccountTermsData.product.fixedLength) {
           this.loansAccountTermsForm.addControl('interestRatePerPeriod', new UntypedFormControl({value: 0, disabled: true}, Validators.required));
-          this.loansAccountTermsForm.addControl('fixedLength', new UntypedFormControl({value: this.loansAccountTermsData.product.fixedLength, disabled: true}));
+          this.loansAccountTermsForm.addControl('fixedLength', new UntypedFormControl(this.loansAccountTermsData.product.fixedLength));
         } else {
           this.loansAccountTermsForm.addControl('interestRatePerPeriod', new UntypedFormControl(this.loansAccountTermsData.interestRatePerPeriod, Validators.required));
         }
@@ -296,6 +305,10 @@ export class LoansAccountTermsStepComponent implements OnInit, OnChanges {
     return false;
   }
 
+  isEqualPrincipalPayments(): boolean {
+    return (this.loansAccountTermsForm.value.amortizationType === 0);
+  }
+
   /** Create Loans Account Terms Form */
   createloansAccountTermsForm() {
     this.loansAccountTermsForm = this.formBuilder.group({
@@ -493,9 +506,7 @@ export class LoansAccountTermsStepComponent implements OnInit, OnChanges {
    * Returns loans account terms form value.
    */
   get loansAccountTerms() {
-    const terms = this.loansAccountTermsForm.getRawValue();
-    delete terms['fixedLength'];
-    return terms;
+    return this.loansAccountTermsForm.getRawValue();
   }
 
   get loanCollateral() {

src/app/loans/loans-view/account-details/account-details.component.html

@@ -1,27 +1,37 @@
-<div class="container">
+<div class="container p-b-20">
   <h3> {{"labels.heading.Loan Details" | translate}} </h3>
 
     <div fxLayout="row wrap" fxLayout.lt-md="column">
 
         <div fxFlexFill>
-            <span fxFlex="50%">{{"labels.inputs.Repayment Strategy" | translate}}:</span>
+            <span fxFlex="50%">{{"labels.inputs.Repayment Strategy" | translate}}</span>
             <span fxFlex="50%">{{ loanDetails.transactionProcessingStrategyName }}</span>
         </div>
 
         <div fxFlexFill>
-            <span fxFlex="50%">{{"labels.inputs.Repayments" | translate}}:</span>
+            <span fxFlex="50%">{{"labels.inputs.Repayments" | translate}}</span>
             <span fxFlex="50%">{{loanDetails.numberOfRepayments}} every {{loanDetails.repaymentEvery}}&nbsp;{{loanDetails.repaymentFrequencyType.value}}
-            <span *ngIf="loanDetails.repaymentFrequencyType?.id == 2 && loanDetails.repaymentFrequencyNthDayType?.id != 0 && loanDetails.repaymentFrequencyDayOfWeekType?.id != 0">
-              &nbsp;on&nbsp;{{loanDetails.repaymentFrequencyNthDayType?.value}}&nbsp;{{loanDetails.repaymentFrequencyDayOfWeekType?.value}}
+            <span *ngIf="loanDetails.repaymentFrequencyType?.id == 2 && loanDetails.repaymentFrequencyNthDayType?.id != 0 && loanDetails.repaymentFrequencyDayOfWeekType?.id != 0" class="m-l-10">
+              <span class="m-l-10">{{"labels.commons.on" | translate}}</span>{{loanDetails.repaymentFrequencyNthDayType?.value}}&nbsp;{{loanDetails.repaymentFrequencyDayOfWeekType?.value}}
             </span>
             </span>
         </div>
 
+        <div fxFlexFill *ngIf="loanDetails.fixedLength">
+            <span fxFlex="50%"> {{"labels.inputs.Fixed Length" | translate}} </span>
+            <span fxFlex="50%"> {{loanDetails.fixedLength}} {{loanDetails.repaymentFrequencyType.value}}</span>
+        </div>
+
         <div fxFlexFill>
             <span fxFlex="50%"> {{"labels.inputs.Amortization" | translate}} </span>
             <span fxFlex="50%"> {{loanDetails.amortizationType.value}} </span>
         </div>
 
+        <div fxFlexFill *ngIf="loanDetails.fixedPrincipalPercentagePerInstallment">
+            <span fxFlex="50%"> {{"labels.inputs.Principal Percentage Per Installment" | translate}} </span>
+            <span fxFlex="50%"> {{loanDetails.fixedPrincipalPercentagePerInstallment | formatNumber}} %</span>
+        </div>
+
         <div fxFlexFill>
             <span fxFlex="50%"> {{"labels.inputs.Equal Amortization" | translate}} </span>
             <span fxFlex="50%"> {{loanDetails.isEqualAmortization | yesNo}} </span>
@@ -29,7 +39,12 @@
 
         <div fxFlexFill>
             <span fxFlex="50%"> {{"labels.inputs.Interest" | translate}} </span>
-            <span fxFlex="50%"> {{loanDetails.annualInterestRate | formatNumber}} {{"labels.text.per annum" | translate}} ({{loanDetails.interestRatePerPeriod}} %&nbsp; {{loanDetails.interestRateFrequencyType.value}}) - {{"labels.text." + loanDetails.interestType.value | translate}} </span>
+            <span fxFlex="50%"> {{loanDetails.annualInterestRate | formatNumber}} % {{"labels.text.per annum" | translate}} ({{loanDetails.interestRatePerPeriod}} %&nbsp; {{loanDetails.interestRateFrequencyType.value}}) </span>
+        </div>
+
+        <div fxFlexFill>
+            <span fxFlex="50%"> {{"labels.inputs.Interest Type" | translate}} </span>
+            <span fxFlex="50%"> {{"labels.text." + loanDetails.interestType.value | translate}} </span>
         </div>
 
         <div fxFlexFill>
@@ -48,12 +63,12 @@
         </div>
 
         <div fxFlexFill>
-          <span fxFlex="50%"> Enable Installment Level Delinquency </span>
+          <span fxFlex="50%"> {{"labels.inputs.Enable Installment Level Delinquency" | translate}} </span>
           <span fxFlex="50%"> {{loanDetails.enableInstallmentLevelDelinquency | yesNo}} </span>
         </div>
 
         <div fxFlexFill>
-            <span fxFlex="50%"> Fund Source</span>
+            <span fxFlex="50%"> {{"labels.inputs.Fund Source" | translate}} </span>
             <span fxFlex="50%" *ngIf="loanDetails.fundName"> {{loanDetails.fundName}} </span>
             <span fxFlex="50%" *ngIf="!loanDetails.fundName"> {{"labels.inputs.Unassigned" | translate}} </span>
         </div>
@@ -73,11 +88,6 @@
             <span fxFlex="50%"> {{loanDetails.allowPartialPeriodInterestCalcualtion | yesNo}} </span>
         </div>
 
-        <div fxFlexFill>
-            <span fxFlex="50%"> {{"labels.inputs.Interest Type" | translate}}</span>
-            <span fxFlex="50%"> {{"labels.text." + loanDetails.interestType.value | translate}} </span>
-        </div>
-
         <div fxFlexFill>
             <span fxFlex="50%"> {{"labels.inputs.Submitted on" | translate}}</span>
             <span fxFlex="50%"> {{loanDetails.timeline.submittedOnDate | dateFormat }} </span>

src/app/products/charges/view-charge/view-charge.component.ts

@@ -37,7 +37,7 @@ export class ViewChargeComponent implements OnInit {
     private route: ActivatedRoute,
     private router: Router,
     private dialog: MatDialog,
-    private translateService:TranslateService) {
+    private translateService: TranslateService) {
     this.route.data.subscribe((data: { charge: any }) => {
       this.chargeData = data.charge;
       if (this.chargeData.minCap) {
@@ -57,7 +57,7 @@ export class ViewChargeComponent implements OnInit {
    */
   deleteCharge() {
     const deleteChargeDialogRef = this.dialog.open(DeleteDialogComponent, {
-      data: { deleteContext: this.translateService.instant('labels.inputs.Charge') + " " + this.chargeData.id}
+      data: { deleteContext: this.translateService.instant('labels.inputs.Charge') + ' ' + this.chargeData.id}
     });
     deleteChargeDialogRef.afterClosed().subscribe((response: any) => {
       if (response.delete) {

src/app/products/fixed-deposit-products/fixed-deposit-product-stepper/fixed-deposit-product-interest-rate-chart-step/fixed-deposit-product-interest-rate-chart-step.component.html

@@ -232,7 +232,7 @@
   </div>
 
   <div fxLayout="row" class="margin-t" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="2%">
-    <button mat-raised-button matStepperPrevious disabled>
+    <button mat-raised-button matStepperPrevious>
       <fa-icon icon="arrow-left" class="m-r-10"></fa-icon>
       Previous
     </button>

src/app/products/recurring-deposit-products/recurring-deposit-product-stepper/recurring-deposit-product-interest-rate-chart-step/recurring-deposit-product-interest-rate-chart-step.component.html

@@ -216,7 +216,7 @@
   </div>
 
   <div fxLayout="row" class="margin-t" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="2%">
-    <button mat-raised-button matStepperPrevious disabled>
+    <button mat-raised-button matStepperPrevious>
       <fa-icon icon="arrow-left" class="m-r-10"></fa-icon>
       Previous
     </button>

src/app/products/saving-products/saving-product-stepper/saving-product-currency-step/saving-product-currency-step.component.html

@@ -33,7 +33,7 @@
   </div>
 
   <div fxLayout="row" class="margin-t" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="2%">
-    <button mat-raised-button matStepperPrevious disabled>
+    <button mat-raised-button matStepperPrevious>
       <fa-icon icon="arrow-left" class="m-r-10"></fa-icon>
       {{'labels.buttons.Previous' | translate}}
     </button>

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

@@ -122,7 +122,7 @@
   </div>
 
   <div fxLayout="row" class="margin-t" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="2%">
-    <button mat-raised-button matStepperPrevious disabled>
+    <button mat-raised-button matStepperPrevious>
       <fa-icon icon="arrow-left" class="m-r-10"></fa-icon>
       {{'labels.buttons.Previous' | translate}}
     </button>

src/app/products/saving-products/saving-product-stepper/saving-product-terms-step/saving-product-terms-step.component.html

@@ -63,7 +63,7 @@
   </div>
 
   <div fxLayout="row" class="margin-t" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="2%">
-    <button mat-raised-button matStepperPrevious disabled>
+    <button mat-raised-button matStepperPrevious>
       <fa-icon icon="arrow-left" class="m-r-10"></fa-icon>
       {{'labels.buttons.Previous' | translate}}
     </button>

src/app/savings/savings-account-view/general-tab/general-tab.component.html

@@ -126,7 +126,7 @@
           <td>{{savingsAccountData.interestCalculationType.value}}</td>
         </tr>
         <tr>
-          <td># {{'labels.inputs.Days in Year' | translate}}</td>
+          <td>{{'labels.inputs.Days in Year' | translate}}</td>
           <td>{{savingsAccountData.interestCalculationDaysInYearType.value}}</td>
         </tr>
         <tr *ngIf="savingsAccountData.withdrawalFee">

src/app/savings/savings-account-view/transactions-tab/transactions-tab.component.html

@@ -93,7 +93,7 @@
   <div class="alert" [hidden]="accountWithTransactions">
     <div class="message">
       <i class="fa fa-exclamation-circle alert-check"></i>
-      {{ "labels.texts.No transaction was found" | translate }}
+      {{ "labels.text.No transaction was found" | translate }}
     </div>
   </div>
 </div>