From 1bccd96c37a58f1d8bada3ce0a8037b9cb2c57f5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jos=C3=A9=20Alberto=20Hern=C3=A1ndez?=
 <44206706+josehernandezfintecheandomx@users.noreply.github.com>
Date: Mon, 9 Jan 2023 00:26:46 -0600
Subject: [PATCH] Manage Report views updated (#1635)

Co-authored-by: Jose Alberto Hernandez <alberto@MacBook-Pro.local>
---
 .../loans/loans-view/loans-view.component.html |  3 +++
 .../view-transaction.component.html            |  6 +++---
 .../view-charge/view-charge.component.html     | 18 +++++++++---------
 .../view-charge/view-charge.component.ts       |  1 +
 src/app/reports/reports.component.html         |  1 -
 .../create-report/create-report.component.html | 12 ++++++++----
 .../create-report/create-report.component.ts   |  2 ++
 .../edit-report/edit-report.component.html     |  9 +++++++--
 .../edit-report/edit-report.component.ts       |  2 ++
 9 files changed, 35 insertions(+), 19 deletions(-)

diff --git a/src/app/loans/loans-view/loans-view.component.html b/src/app/loans/loans-view/loans-view.component.html
index b476b77b5..282d1f4ab 100644
--- a/src/app/loans/loans-view/loans-view.component.html
+++ b/src/app/loans/loans-view/loans-view.component.html
@@ -48,6 +48,9 @@
               <span *ngIf="loanDetailsData.inArrears">Arrears Since: {{loanDetailsData.summary.overdueSinceDate |
                 dateFormat}}
               </span>
+              <span *ngIf="loanDetailsData.totalOverpaid && loanDetailsData.totalOverpaid > 0">
+                Overpaid By: {{loanDetailsData.currency.displaySymbol}} {{loanDetailsData.totalOverpaid | number}}
+              </span>
             </div>
 
             <span fxFlex="auto"></span>
diff --git a/src/app/loans/loans-view/transactions/view-transaction/view-transaction.component.html b/src/app/loans/loans-view/transactions/view-transaction/view-transaction.component.html
index 4bf0117fb..b7ba15d8f 100644
--- a/src/app/loans/loans-view/transactions/view-transaction/view-transaction.component.html
+++ b/src/app/loans/loans-view/transactions/view-transaction/view-transaction.component.html
@@ -2,16 +2,16 @@
   *ngIf="!(transactionData.type.contra)">
   <span *mifosxHasPermission="'ADJUST_LOAN'">
     <button mat-raised-button color="primary" [routerLink]="'edit'" [disabled]="!allowEdition">
-      <fa-icon icon="edit"></fa-icon>&nbsp;&nbsp;{{ 'Edit' | translate }}
+      <fa-icon icon="edit" class="m-r-10"></fa-icon>{{ 'Edit' | translate }}
     </button>
 
     <button mat-raised-button color="warn" (click)="undoTransaction()" [disabled]="!allowUndo">
-      <fa-icon icon="undo"></fa-icon>&nbsp;&nbsp;{{ 'Undo' | translate }}
+      <fa-icon icon="undo" class="m-r-10"></fa-icon>{{ 'Undo' | translate }}
     </button>
   </span>
   <span *mifosxHasPermission="'CHARGEBACK_LOAN'">
     <button mat-raised-button color="warn" [disabled]="!allowChargeback" (click)="chargebackTransaction()">
-      <fa-icon icon="undo"></fa-icon>&nbsp;&nbsp;{{ 'Chargeback' | translate }}
+      <fa-icon icon="undo" class="m-r-10"></fa-icon>{{ 'Chargeback' | translate }}
     </button>
   </span>
 </div>
diff --git a/src/app/loans/loans-view/view-charge/view-charge.component.html b/src/app/loans/loans-view/view-charge/view-charge.component.html
index 9ab071e9f..9e61a69c5 100644
--- a/src/app/loans/loans-view/view-charge/view-charge.component.html
+++ b/src/app/loans/loans-view/view-charge/view-charge.component.html
@@ -1,18 +1,18 @@
 <div *ngIf="loansAccountData.status.value === 'Active' && chargeData.amountOutstanding !== 0" fxLayout="row"
   fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column" class="container m-b-20">
   <button mat-raised-button color="primary" *mifosxHasPermission="'WAIVE_SAVINGSACCOUNTCHARGE'" (click)="editCharge()">
-    <fa-icon icon="flag"></fa-icon>&nbsp;&nbsp;
+    <fa-icon icon="flag" class="m-r-10"></fa-icon>
     Edit
   </button>
   <span *ngIf="allowPayCharge">
     <button mat-raised-button color="accent" *mifosxHasPermission="'PAY_SAVINGSACCOUNTCHARGE'" (click)="payCharge()">
-      <fa-icon icon="dollar-sign"></fa-icon>&nbsp;&nbsp;
+      <fa-icon icon="dollar-sign" class="m-r-10"></fa-icon>
       Pay
     </button>
   </span>
   <span *ngIf="allowWaive">
     <button mat-raised-button color="primary" *mifosxHasPermission="'WAIVE_SAVINGSACCOUNTCHARGE'" (click)="waiveCharge()">
-      <fa-icon icon="flag"></fa-icon>&nbsp;&nbsp;
+      <fa-icon icon="flag" class="m-r-10"></fa-icon>
       Waive
     </button>
   </span>
@@ -21,11 +21,11 @@
 <div *ngIf="loansAccountData.status.value === 'Submitted and pending approval'" fxLayout="row" fxLayoutAlign="end"
   fxLayoutGap="2%" fxLayout.lt-md="column" class="container m-b-20">
   <button mat-raised-button color="primary" *mifosxHasPermission="'UPDATE_SAVINGSACCOUNTCHARGE'" (click)="editCharge()">
-    <fa-icon icon="edit"></fa-icon>&nbsp;&nbsp;
+    <fa-icon icon="edit" class="m-r-10"></fa-icon>
     Edit
   </button>
   <button mat-raised-button color="warn" *mifosxHasPermission="'DELETE_SAVINGSACCOUNTCHARGE'" (click)="deleteCharge()">
-    <fa-icon icon="trash"></fa-icon>&nbsp;&nbsp;
+    <fa-icon icon="trash" class="m-r-10"></fa-icon>
     Delete
   </button>
 </div>
@@ -93,7 +93,7 @@
         </div>
 
         <div fxFlex="50%">
-          {{ chargeData.amount }}
+          {{ chargeData.amount | number }}
         </div>
 
         <div fxFlex="50%" class="mat-body-strong">
@@ -101,7 +101,7 @@
         </div>
 
         <div fxFlex="50%">
-          {{ chargeData.amountPaid }}
+          {{ chargeData.amountPaid | number }}
         </div>
 
         <div fxFlex="50%" class="mat-body-strong">
@@ -109,7 +109,7 @@
         </div>
 
         <div fxFlex="50%">
-          {{ chargeData.amountWaived }}
+          {{ chargeData.amountWaived | number }}
         </div>
 
         <div fxFlex="50%" class="mat-body-strong">
@@ -117,7 +117,7 @@
         </div>
 
         <div fxFlex="50%">
-          {{ chargeData.amountOutstanding }}
+          {{ chargeData.amountOutstanding | number }}
         </div>
 
       </div>
diff --git a/src/app/loans/loans-view/view-charge/view-charge.component.ts b/src/app/loans/loans-view/view-charge/view-charge.component.ts
index cb77c65f2..c614cd657 100644
--- a/src/app/loans/loans-view/view-charge/view-charge.component.ts
+++ b/src/app/loans/loans-view/view-charge/view-charge.component.ts
@@ -127,6 +127,7 @@ export class ViewChargeComponent {
         label: 'Due Date',
         value: new Date(this.chargeData.dueDate),
         type: 'date',
+        maxDate: this.settingsService.maxAllowedDate,
         required: true
       })
     ];
diff --git a/src/app/reports/reports.component.html b/src/app/reports/reports.component.html
index bed0fc8a3..cd0674fcb 100644
--- a/src/app/reports/reports.component.html
+++ b/src/app/reports/reports.component.html
@@ -26,7 +26,6 @@
         <td mat-cell *matCellDef="let report"> {{ report.reportCategory }} </td>
       </ng-container>
 
-      
       <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
       <tr mat-row *matRowDef="let row; columns: displayedColumns;" class="select-row" [routerLink]="['/reports','run', row.reportName]" [queryParams]="{ type: row.reportType, id: row.id }"></tr>
 
diff --git a/src/app/system/manage-reports/create-report/create-report.component.html b/src/app/system/manage-reports/create-report/create-report.component.html
index f52c08e41..a34ff0299 100644
--- a/src/app/system/manage-reports/create-report/create-report.component.html
+++ b/src/app/system/manage-reports/create-report/create-report.component.html
@@ -45,11 +45,16 @@
 
           <mat-form-field fxFlex="40%">
             <mat-label>Report Category</mat-label>
-            <input matInput formControlName="reportCategory">
+            <mat-select formControlName="reportCategory">
+              <mat-option *ngFor="let reportCategoryType of reportCategoryTypeOptions"
+                [value]="reportCategoryType">
+                {{ reportCategoryType }}
+              </mat-option>
+            </mat-select>
           </mat-form-field>
 
           <div fxFlex="10%" class="user-report-wrapper">
-            <mat-checkbox class="user-report" labelPosition="before" formControlName="useReport">
+            <mat-checkbox class="user-report" labelPosition="after" formControlName="useReport">
               User Report (UI)
             </mat-checkbox>
           </div>
@@ -80,8 +85,7 @@
           <p fxFlex="20%" class="mat-title">Report Parameters</p>
 
           <button mat-raised-button fxFlex="20%" type="button" color="primary" (click)="addReportParameter()">
-            <fa-icon icon="plus"></fa-icon>&nbsp;&nbsp;
-            Add Report Parameter
+            <fa-icon icon="plus" class="m-r-10"></fa-icon>Add Report Parameter
           </button>
 
         </div>
diff --git a/src/app/system/manage-reports/create-report/create-report.component.ts b/src/app/system/manage-reports/create-report/create-report.component.ts
index aac3c0fd5..2668e5ca3 100644
--- a/src/app/system/manage-reports/create-report/create-report.component.ts
+++ b/src/app/system/manage-reports/create-report/create-report.component.ts
@@ -46,6 +46,8 @@ export class CreateReportComponent implements OnInit {
   /** Sorter for report parameters table. */
   @ViewChild(MatSort, { static: true }) sort: MatSort;
 
+  reportCategoryTypeOptions: string[] = ['Client', 'Loan', 'Savings', 'Fund', 'Accounting'];
+
   /**
    * Retrieves the report template data from `resolve`.
    * @param {FormBuilder} formBuilder Form Builder.
diff --git a/src/app/system/manage-reports/edit-report/edit-report.component.html b/src/app/system/manage-reports/edit-report/edit-report.component.html
index b35ea3c82..8bd670271 100644
--- a/src/app/system/manage-reports/edit-report/edit-report.component.html
+++ b/src/app/system/manage-reports/edit-report/edit-report.component.html
@@ -44,11 +44,16 @@
 
           <mat-form-field fxFlex="40%">
             <mat-label>Report Category</mat-label>
-            <input matInput formControlName="reportCategory">
+            <mat-select formControlName="reportCategory">
+              <mat-option *ngFor="let reportCategoryType of reportCategoryTypeOptions"
+                [value]="reportCategoryType">
+                {{ reportCategoryType }}
+              </mat-option>
+            </mat-select>
           </mat-form-field>
 
           <div fxFlex="10%" class="user-report-wrapper">
-            <mat-checkbox class="user-report" labelPosition="before" formControlName="useReport">
+            <mat-checkbox class="user-report" labelPosition="after" formControlName="useReport">
               User Report (UI)
             </mat-checkbox>
           </div>
diff --git a/src/app/system/manage-reports/edit-report/edit-report.component.ts b/src/app/system/manage-reports/edit-report/edit-report.component.ts
index 363801ce5..2d11b295c 100644
--- a/src/app/system/manage-reports/edit-report/edit-report.component.ts
+++ b/src/app/system/manage-reports/edit-report/edit-report.component.ts
@@ -46,6 +46,8 @@ export class EditReportComponent implements OnInit {
   /** Boolean to check if report parameters data is changed or not. */
   isReportParametersChanged: Boolean = false;
 
+  reportCategoryTypeOptions: string[] = ['Client', 'Loan', 'Savings', 'Fund', 'Accounting'];
+
   /** Paginator for report parameters table. */
   @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
   /** Sorter for report parameters table. */