Client views updated

alberto-art3ch · Apr 4, 2024 · e09fccf · e09fccf
1 parent 54dc91e
commit e09fccf
Show file tree

Hide file tree

Showing 10 changed files with 1,059 additions and 1,533 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/app/clients/client-stepper/client-general-step/client-general-step.component.html b/src/app/clients/client-stepper/client-general-step/client-general-step.component.html
@@ -14,7 +14,7 @@
       </mat-error>
     </mat-form-field>
 
-    <mat-form-field fxFlex="48%">
+    <mat-form-field fxFlex="23%">
       <mat-label>{{"labels.inputs.Legal Form" | translate}}</mat-label>
       <mat-select required formControlName="legalFormId">
         <mat-option *ngFor="let legalForm of legalFormOptions" [value]="legalForm.id">
@@ -23,17 +23,13 @@
       </mat-select>
     </mat-form-field>
 
-    <mat-form-field fxFlex="48%">
-      <mat-label>{{"labels.inputs.Staff" | translate}}</mat-label>
-      <mat-select formControlName="staffId">
-        <mat-option *ngFor="let staff of staffOptions" [value]="staff.id">
-          {{ staff.displayName }}
-        </mat-option>
-      </mat-select>
+    <mat-form-field fxFlex="23%">
+      <mat-label>{{"labels.inputs.External Id" | translate}}</mat-label>
+      <input matInput formControlName="externalId">
     </mat-form-field>
 
     <mat-form-field *ngIf="createClientForm.contains('fullname')" fxFlex="48%">
-      <mat-label>{{ createClientForm.value.legalFormId === 1 ? 'Name' : 'Entity Name' }}</mat-label>
+      <mat-label>{{ 'labels.inputs.' + getDateLabel(createClientForm.value.legalFormId, ['Name', 'Entity Name']) | translate }}</mat-label>
       <input matInput required formControlName="fullname">
       <mat-error *ngIf="createClientForm.controls.fullname.hasError('required')">
         {{"labels.inputs.Client name" | translate}} {{"labels.commons.is" | translate}} <strong>{{"labels.commons.required" | translate}}</strong>
@@ -73,18 +69,15 @@
       </mat-error>
     </mat-form-field>
 
+    <mat-divider></mat-divider>
+
     <mat-form-field fxFlex="48%" (click)="dateOfBirthDatePicker.open()">
-      <mat-label>{{ createClientForm.value.legalFormId === 1 ? 'Date of Birth' : 'Incorporation Date' }}</mat-label>
+      <mat-label>{{ 'labels.inputs.' + getDateLabel(createClientForm.value.legalFormId, ['Date of Birth', 'Incorporation Date']) | translate }}</mat-label>
       <input matInput [max]="maxDate" [matDatepicker]="dateOfBirthDatePicker" formControlName="dateOfBirth">
       <mat-datepicker-toggle matSuffix [for]="dateOfBirthDatePicker"></mat-datepicker-toggle>
       <mat-datepicker #dateOfBirthDatePicker></mat-datepicker>
     </mat-form-field>
 
-    <mat-form-field fxFlex="48%">
-      <mat-label>{{"labels.inputs.External Id" | translate}}</mat-label>
-      <input matInput formControlName="externalId">
-    </mat-form-field>
-
     <div fxFlex="100%" fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column" formGroupName="clientNonPersonDetails"
       *ngIf="createClientForm.contains('clientNonPersonDetails')">
 
@@ -134,10 +127,21 @@
       </mat-select>
     </mat-form-field>
 
+    <mat-form-field fxFlex="48%">
+      <mat-label>{{"labels.inputs.Staff" | translate}}</mat-label>
+      <mat-select formControlName="staffId">
+        <mat-option *ngFor="let staff of staffOptions" [value]="staff.id">
+          {{ staff.displayName }}
+        </mat-option>
+      </mat-select>
+    </mat-form-field>
+
     <mat-checkbox *ngIf="createClientForm.value.legalFormId === 1" fxFlex="48%" labelPosition="before" formControlName="isStaff" class="margin-v">
       {{"labels.inputs.Is staff" | translate}}?
     </mat-checkbox>
 
+    <mat-divider fxFlex="98%"></mat-divider>
+
     <mat-form-field fxFlex="48%">
       <mat-label>{{"labels.inputs.Mobile No" | translate}}</mat-label>
       <input matInput type="number" formControlName="mobileNo">

diff --git a/src/app/clients/client-stepper/client-general-step/client-general-step.component.ts b/src/app/clients/client-stepper/client-general-step/client-general-step.component.ts
@@ -153,6 +153,10 @@ export class ClientGeneralStepComponent implements OnInit {
     });
   }
 
+  getDateLabel(legalFormId: number, values: string[]): string {
+    return legalFormId === 1 ? values[0] : values[1];
+  }
+
   /**
    * Client General Details
    */

diff --git a/src/app/clients/clients-view/clients-view.component.html b/src/app/clients/clients-view/clients-view.component.html
@@ -60,6 +60,13 @@ <h3 fxFlex="95%">
               </span>
             </span>
             <br />
+            <span *ngIf="clientViewData.mobileNo">
+              <b>{{"labels.inputs.Mobile Number" | translate}}:</b><mifosx-external-identifier externalId="{{clientViewData.mobileNo}}" completed="true"></mifosx-external-identifier><br />
+            </span>
+            <span *ngIf="clientViewData.emailAddress">
+              <b>{{"labels.inputs.Email" | translate}}:</b><mifosx-external-identifier externalId="{{clientViewData.emailAddress}}" completed="true"></mifosx-external-identifier><br />
+            </span>
+            <br />
           </p>
         </mat-card-subtitle>
 

diff --git a/src/app/clients/clients.component.html b/src/app/clients/clients.component.html
@@ -31,7 +31,7 @@
 
       <!-- Account no Column -->
       <ng-container matColumnDef="accountNumber">
-        <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Account No" | translate}}. </th>
+        <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Account No" | translate}}</th>
         <td mat-cell *matCellDef="let row">
           <mifosx-account-number display="left" accountNo="{{row.accountNumber}}"></mifosx-account-number>
         </td>

diff --git a/src/app/clients/edit-client/edit-client.component.html b/src/app/clients/edit-client/edit-client.component.html
@@ -8,7 +8,7 @@
 
         <div fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column">
 
-          <mat-form-field fxFlex="48%">
+          <mat-form-field fxFlex="23%">
             <mat-label>{{"labels.inputs.Office" | translate}}</mat-label>
             <mat-select required formControlName="officeId">
               <mat-option *ngFor="let office of officeOptions" [value]="office.id">
@@ -20,7 +20,7 @@
             </mat-error>
           </mat-form-field>
 
-          <mat-form-field fxFlex="48%">
+          <mat-form-field fxFlex="23%">
             <mat-label>{{"labels.inputs.Legal Form" | translate}}</mat-label>
             <mat-select formControlName="legalFormId">
               <mat-option *ngFor="let legalForm of legalFormOptions" [value]="legalForm.id">
@@ -29,22 +29,18 @@
             </mat-select>
           </mat-form-field>
 
-          <mat-form-field fxFlex="48%">
+          <mat-form-field fxFlex="23%">
             <mat-label>{{"labels.inputs.Account No" | translate}}</mat-label>
             <input matInput formControlName="accountNo">
           </mat-form-field>
 
-          <mat-form-field fxFlex="48%">
-            <mat-label>{{"labels.inputs.Staff" | translate}}</mat-label>
-            <mat-select formControlName="staffId">
-              <mat-option *ngFor="let staff of staffOptions" [value]="staff.id">
-                {{ staff.displayName }}
-              </mat-option>
-            </mat-select>
+          <mat-form-field fxFlex="23%">
+            <mat-label>{{"labels.inputs.External Id" | translate}}</mat-label>
+            <input matInput formControlName="externalId">
           </mat-form-field>
 
           <mat-form-field *ngIf="editClientForm.contains('fullname')" fxFlex="48%">
-            <mat-label>{{ legalFormId === 1 ? 'Name' : 'Entity Name' }}</mat-label>
+            <mat-label>{{ 'labels.inputs.' + getDateLabel(legalFormId, ['Name', 'Entity Name']) | translate }}</mat-label>
             <input matInput required formControlName="fullname">
             <mat-error *ngIf="editClientForm.controls.fullname.hasError('required')">
               {{"labels.inputs.Client name" | translate}} {{"labels.commons.is" | translate}} <strong>{{"labels.commons.required" | translate}}</strong>
@@ -72,6 +68,15 @@
             </mat-error>
           </mat-form-field>
 
+          <mat-divider></mat-divider>
+
+          <mat-form-field fxFlex="48%" (click)="dateOfBirthDatePicker.open()">
+            <mat-label>{{ 'labels.inputs.' + getDateLabel(legalFormId, ['Date of Birth', 'Incorporation Date']) | translate }}</mat-label>
+            <input matInput [max]="maxDate" [matDatepicker]="dateOfBirthDatePicker" formControlName="dateOfBirth">
+            <mat-datepicker-toggle matSuffix [for]="dateOfBirthDatePicker"></mat-datepicker-toggle>
+            <mat-datepicker #dateOfBirthDatePicker></mat-datepicker>
+          </mat-form-field>
+
           <mat-form-field *ngIf="legalFormId === 1" fxFlex="48%">
             <mat-label>{{"labels.inputs.Gender" | translate}}</mat-label>
             <mat-select formControlName="genderId">
@@ -81,11 +86,13 @@
             </mat-select>
           </mat-form-field>
 
-          <mat-form-field fxFlex="48%" (click)="dateOfBirthDatePicker.open()">
-            <mat-label>{{ legalFormId === 1 ? 'Date of Birth' : 'Incorporation Date' }}</mat-label>
-            <input matInput [max]="maxDate" [matDatepicker]="dateOfBirthDatePicker" formControlName="dateOfBirth">
-            <mat-datepicker-toggle matSuffix [for]="dateOfBirthDatePicker"></mat-datepicker-toggle>
-            <mat-datepicker #dateOfBirthDatePicker></mat-datepicker>
+          <mat-form-field fxFlex="48%">
+            <mat-label>{{"labels.inputs.Staff" | translate}}</mat-label>
+            <mat-select formControlName="staffId">
+              <mat-option *ngFor="let staff of staffOptions" [value]="staff.id">
+                {{ staff.displayName }}
+              </mat-option>
+            </mat-select>
           </mat-form-field>
 
           <div fxFlex="100%" fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column" formGroupName="clientNonPersonDetails"
@@ -127,11 +134,6 @@
             </mat-form-field>
           </div>
 
-          <mat-form-field fxFlex="48%">
-            <mat-label>{{"labels.inputs.External Id" | translate}}</mat-label>
-            <input matInput formControlName="externalId">
-          </mat-form-field>
-
           <mat-checkbox *ngIf="legalFormId === 1" fxFlex="48%" labelPosition="before" formControlName="isStaff" class="margin-v">
             {{"labels.inputs.Is staff" | translate}}?
           </mat-checkbox>

diff --git a/src/app/clients/edit-client/edit-client.component.ts b/src/app/clients/edit-client/edit-client.component.ts
@@ -158,6 +158,10 @@ export class EditClientComponent implements OnInit {
     });
   }
 
+  getDateLabel(legalFormId: number, values: string[]): string {
+    return legalFormId === 1 ? values[0] : values[1];
+  }
+
   /**
    * Submits the edit client form.
    */

diff --git a/src/app/loans/loans-view/transactions-tab/transactions-tab.component.ts b/src/app/loans/loans-view/transactions-tab/transactions-tab.component.ts
@@ -21,9 +21,7 @@ import { LoanTransactionType } from 'app/loans/models/loan-transaction-type.mode
 export class TransactionsTabComponent implements OnInit {
 
   /** Loan Details Data */
-  transactions: any;
-  /** Temporary Transaction Data */
-  tempTransaction: any;
+  transactionsData: LoanTransaction[] = [];
   /** Form control to handle accural parameter */
   hideAccrualsParam: UntypedFormControl;
   hideReversedParam: UntypedFormControl;
@@ -51,8 +49,7 @@ export class TransactionsTabComponent implements OnInit {
     private translateService: TranslateService,
     private settingsService: SettingsService) {
     this.route.parent.parent.data.subscribe((data: { loanDetailsData: any }) => {
-      this.transactions = data.loanDetailsData.transactions;
-      this.tempTransaction = data.loanDetailsData.transactions;
+      this.transactionsData = data.loanDetailsData.transactions;
       this.status = data.loanDetailsData.status.value;
     });
     this.loanId = this.route.parent.parent.snapshot.params['loanId'];
@@ -61,24 +58,16 @@ export class TransactionsTabComponent implements OnInit {
   ngOnInit() {
     this.hideAccrualsParam = new UntypedFormControl(false);
     this.hideReversedParam = new UntypedFormControl(false);
-    this.setLoanTransactions(this.transactions);
+    this.setLoanTransactions();
   }
 
-  setLoanTransactions(transactions: any) {
-    this.transactions = transactions;
-    this.transactions.forEach((element: any) => {
+  setLoanTransactions() {
+    this.transactionsData.forEach((element: any) => {
       element.date = this.dateUtils.parseDate(element.date);
     });
-    this.dataSource = new MatTableDataSource(this.transactions);
+    this.dataSource = new MatTableDataSource(this.transactionsData);
     this.dataSource.paginator = this.paginator;
     this.dataSource.sort = this.sort;
-    if (this.tempTransaction) {
-      this.tempTransaction.forEach((element: LoanTransaction) => {
-        if (this.isAccrual(element.type)) {
-          this.tempTransaction = this.removeItem(this.tempTransaction, element);
-        }
-      });
-    }
   }
 
   /**
@@ -93,11 +82,24 @@ export class TransactionsTabComponent implements OnInit {
   }
 
   hideAccruals() {
-    if (!this.hideAccrualsParam.value) {
-      this.dataSource = new MatTableDataSource(this.tempTransaction);
-    } else {
-      this.dataSource = new MatTableDataSource(this.transactions);
+    this.filterTransactions(this.hideReversedParam.value, !this.hideAccrualsParam.value);
+  }
+
+  hideReversed() {
+    this.filterTransactions(!this.hideReversedParam.value, this.hideAccrualsParam.value);
+  }
+
+  filterTransactions(hideReversed: boolean, hideAccrual: boolean): void {
+    let transactions: LoanTransaction[] = this.transactionsData;
+
+    if (hideAccrual || hideReversed) {
+      transactions = this.transactionsData.filter((t: LoanTransaction) => {
+        return (!(hideReversed && t.manuallyReversed) && !(hideAccrual && t.type.accrual));
+      });
     }
+    this.dataSource = new MatTableDataSource(transactions);
+    this.dataSource.paginator = this.paginator;
+    this.dataSource.sort = this.sort;
   }
 
   applyFilter(filterValue: string = '') {
@@ -275,25 +277,11 @@ export class TransactionsTabComponent implements OnInit {
       .then(() => this.router.navigate([url]));
   }
 
-  hideReversed() {
-    let transactions: LoanTransaction[] = this.transactions;
-    if (!this.hideReversedParam.value) {
-      transactions = [];
-      this.transactions.forEach((t: LoanTransaction) => {
-        if (!t.manuallyReversed) {
-          transactions.push(t);
-        }
-      });
-    }
-    this.dataSource = new MatTableDataSource(transactions);
-    this.dataSource.paginator = this.paginator;
-    this.dataSource.sort = this.sort;
-  }
-
   displaySubMenu(transaction: LoanTransaction): boolean {
     if (this.isReAgoeOrReAmortize(transaction.type) && transaction.manuallyReversed) {
       return false;
     }
     return true;
   }
+
 }
-Original file line number
+Diff line change
@@ Expand Up @@
         });
       }
+      getDateLabel(legalFormId: number, values: string[]): string {
+        return legalFormId === 1 ? values[0] : values[1];
+      }
       /**
        * Client General Details
        */
@@ Expand Down @@