Fixed Deposit account view update (#1881)

Co-authored-by: Jose Alberto Hernandez <alberto@blue-daemon.local>

src/app/navigation/center-navigation/center-navigation.component.html

@@ -12,11 +12,11 @@
       </mat-card-title>
       <mat-card-subtitle>
         <p>
-          {{"labels.inputs.Account No"  |translate}}:
+          {{"labels.inputs.Account No" | translate }}:
           <mifosx-account-number accountNo="{{centerData.accountNo}}"></mifosx-account-number>
         </p>
         <p *ngIf="centerData.externalId">
-          {{"labels.inputs.External Id"  |translate}}:
+          {{"labels.inputs.External Id" | translate }}:
           <mifosx-external-identifier externalId="{{centerData.externalId}}"></mifosx-external-identifier>
         </p>
       </mat-card-subtitle>
@@ -31,7 +31,7 @@
       <div fxLayout="row wrap" class="content">
 
         <div fxFlex="50%" class="mat-body-strong">
-          {{"labels.inputs.Activation Date"  |translate}}
+          {{"labels.inputs.Activation Date" | translate }}
         </div>
 
         <div fxFlex="50%">
@@ -39,7 +39,7 @@
         </div>
 
         <div fxFlex="50%" class="mat-body-strong">
-          {{"labels.inputs.Associated Officer"  |translate}}
+          {{"labels.inputs.Associated Officer" | translate }}
         </div>
 
         <div fxFlex="50%">
@@ -47,7 +47,7 @@
         </div>
 
         <div fxFlex="50%" class="mat-body-strong" *ngIf="centerSummaryData">
-          {{"labels.inputs.Number of Active Clients"  |translate}}
+          {{"labels.inputs.Number of Active Clients" | translate }}
         </div>
 
         <div fxFlex="50%" *ngIf="centerSummaryData">
@@ -55,7 +55,7 @@
         </div>
 
         <div fxFlex="50%" class="mat-body-strong" *ngIf="centerSummaryData">
-          {{"labels.inputs.Number of Active Client Loans"  |translate}}
+          {{"labels.inputs.Number of Active Client Loans" | translate }}
         </div>
 
         <div fxFlex="50%" *ngIf="centerSummaryData">
@@ -63,7 +63,7 @@
         </div>
 
         <div fxFlex="50%" class="mat-body-strong" *ngIf="centerSummaryData">
-          {{"labels.inputs.Number of Active Client Borrowers"  |translate}}
+          {{"labels.inputs.Number of Active Client Borrowers" | translate }}
         </div>
 
         <div fxFlex="50%" *ngIf="centerSummaryData">
@@ -71,7 +71,7 @@
         </div>
 
         <div fxFlex="50%" class="mat-body-strong" *ngIf="centerSummaryData">
-          {{"labels.inputs.Number of Active Overdue Group Loans"  |translate}}
+          {{"labels.inputs.Number of Active Overdue Group Loans" | translate }}
         </div>
 
         <div fxFlex="50%" *ngIf="centerSummaryData">
@@ -79,7 +79,7 @@
         </div>
 
         <div fxFlex="50%" class="mat-body-strong" *ngIf="centerSummaryData">
-          {{"labels.inputs.Number of Active Overdue Client Loans"  |translate}}
+          {{"labels.inputs.Number of Active Overdue Client Loans" | translate }}
         </div>
 
         <div fxFlex="50%" *ngIf="centerSummaryData">
@@ -87,7 +87,7 @@
         </div>
 
         <div fxFlex="50%" class="mat-body-strong" *ngIf="centerData.collectionMeetingCalendar && centerData.collectionMeetingCalendar.nextTenRecurringDates[0]">
-          {{"labels.inputs.Next Meeting Date"  |translate}}
+          {{"labels.inputs.Next Meeting Date" | translate }}
         </div>
 
         <div fxFlex="50%" *ngIf="centerData.collectionMeetingCalendar && centerData.collectionMeetingCalendar.nextTenRecurringDates[0]">
@@ -95,7 +95,7 @@
         </div>
 
         <div fxFlex="50%" class="mat-body-strong" *ngIf="centerData.collectionMeetingCalendar && centerData.collectionMeetingCalendar.humanReadable">
-          {{"labels.inputs.Meeting Frequency"  |translate}}
+          {{"labels.inputs.Meeting Frequency" | translate }}
         </div>
 
         <div fxFlex="50%" *ngIf="centerData.collectionMeetingCalendar && centerData.collectionMeetingCalendar.humanReadable">
@@ -103,7 +103,7 @@
         </div>
 
         <div fxFlex="50%" class="mat-body-strong">
-          {{"labels.inputs.Number of Groups"  |translate}}
+          {{"labels.inputs.Number of Groups" | translate }}
         </div>
 
         <div fxFlex="50%">

src/app/navigation/client-navigation/client-navigation.component.html

@@ -4,7 +4,7 @@
     <div class="mat-typography">
       <mat-card-title>
         <h2>
-          {{ clientData.displayName }} 
+          {{ clientData.displayName }}
           <span [className]="clientData.status.code | statusLookup">
             <fa-icon matTooltip="{{ clientData.status.value }}" matTooltipPosition="right" icon="circle" size="lg"></fa-icon>
           </span>
@@ -12,11 +12,11 @@
       </mat-card-title>
       <mat-card-subtitle>
         <p>
-          {{"labels.inputs.Account No"  |translate}}: {{ clientData.accountNo }} {{ clientData.externalId ? '| External ID: ' + clientData.externalId : '' }}
+          {{"labels.inputs.Account No" | translate }}: {{ clientData.accountNo }} {{ clientData.externalId ? '| External ID: ' + clientData.externalId : '' }}
         </p>
       </mat-card-subtitle>
     </div>
-  </mat-card-title-group>      
+  </mat-card-title-group>
 </mat-card-header>
 
 <mat-card-content>
@@ -27,7 +27,7 @@
       <div fxLayout="row wrap" class="content">
 
         <div fxFlex="50%" class="mat-body-strong" *ngIf="clientData.firstName">
-          {{"labels.inputs.First Name"  |translate}}
+          {{"labels.inputs.First Name" | translate }}
         </div>
 
         <div fxFlex="50%" *ngIf="clientData.firstName">
@@ -35,7 +35,7 @@
         </div>
 
         <div fxFlex="50%" class="mat-body-strong" *ngIf="clientData.middleName">
-          {{"labels.inputs.Middle Name"  |translate}}
+          {{"labels.inputs.Middle Name" | translate }}
         </div>
 
         <div fxFlex="50%" *ngIf="clientData.middleName">
@@ -43,15 +43,15 @@
         </div>
 
         <div fxFlex="50%" class="mat-body-strong" *ngIf="clientData.lastName">
-          {{"labels.inputs.Last Name"  |translate}}
+          {{"labels.inputs.Last Name" | translate }}
         </div>
 
         <div fxFlex="50%" *ngIf="clientData.lastName">
           {{ clientData.lastName }}
         </div>
-        
+
         <div fxFlex="50%" class="mat-body-strong" *ngIf="clientData.dateOfBirth">
-          {{"labels.inputs.Date of Birth"  |translate}}
+          {{"labels.inputs.Date of Birth" | translate }}
         </div>
 
         <div fxFlex="50%" *ngIf="clientData.dateOfBirth">
@@ -59,7 +59,7 @@
         </div>
 
         <div fxFlex="50%" class="mat-body-strong" *ngIf="clientData.mobileNo">
-          {{"labels.inputs.Mobile Number"  |translate}}
+          {{"labels.inputs.Mobile Number" | translate }}
         </div>
 
         <div fxFlex="50%" *ngIf="clientData.mobileNo">
@@ -67,7 +67,7 @@
         </div>
 
         <div fxFlex="50%" class="mat-body-strong">
-          {{"labels.inputs.Activation Date"  |translate}}
+          {{"labels.inputs.Activation Date" | translate }}
         </div>
 
         <div fxFlex="50%">
@@ -75,7 +75,7 @@
         </div>
 
         <div fxFlex="50%" class="mat-body-strong" *ngIf="clientData.officeName">
-          {{"labels.inputs.Associated Office"  |translate}}
+          {{"labels.inputs.Associated Office" | translate }}
         </div>
 
         <div fxFlex="50%" *ngIf="clientData.officeName">
@@ -83,7 +83,7 @@
         </div>
 
         <div fxFlex="50%" class="mat-body-strong" *ngIf="clientData.staffName">
-          {{"labels.inputs.Associated Staff"  |translate}}
+          {{"labels.inputs.Associated Staff" | translate }}
         </div>
 
         <div fxFlex="50%" *ngIf="clientData.staffName">

src/app/navigation/group-navigation/group-navigation.component.html

@@ -4,7 +4,7 @@
     <div class="mat-typography">
       <mat-card-title>
         <h2>
-          {{ groupData.name }} 
+          {{ groupData.name }}
           <span [className]="groupData.status.code | statusLookup">
             <fa-icon matTooltip="{{ groupData.status.value }}" matTooltipPosition="right" icon="circle" size="lg"></fa-icon>
           </span>
@@ -12,11 +12,11 @@
       </mat-card-title>
       <mat-card-subtitle>
         <p>
-          {{"labels.inputs.Account No"  |translate}}: {{ groupData.accountNo }} {{ groupData.externalId ? '| External ID: ' + groupData.externalId : '' }}
+          {{"labels.inputs.Account No" | translate }}: {{ groupData.accountNo }} {{ groupData.externalId ? '| External ID: ' + groupData.externalId : '' }}
         </p>
       </mat-card-subtitle>
     </div>
-  </mat-card-title-group>      
+  </mat-card-title-group>
 </mat-card-header>
 
 <mat-card-content>
@@ -25,49 +25,49 @@
         <div fxLayout="row wrap" class="content">
 
           <div fxFlex="50%" class="mat-body-strong">
-            {{"labels.inputs.Activation Date"  |translate}}
+            {{"labels.inputs.Activation Date" | translate }}
           </div>
-  
+
           <div fxFlex="50%">
             {{ groupData.activationDate  | dateFormat }}
           </div>
 
           <div fxFlex="50%" class="mat-body-strong">
-            {{"labels.inputs.Associated Officer"  |translate}}
+            {{"labels.inputs.Associated Officer" | translate }}
           </div>
-  
+
           <div fxFlex="50%">
             {{ groupData.staffName }}
           </div>
 
           <div fxFlex="50%" class="mat-body-strong" *ngIf="groupData.centerName">
-            {{"labels.inputs.Associated Center"  |translate}}
+            {{"labels.inputs.Associated Center" | translate }}
           </div>
-  
+
           <div fxFlex="50%" *ngIf="groupData.centerName">
             {{ groupData.centerName }}
           </div>
 
           <div fxFlex="50%" class="mat-body-strong" *ngIf="groupData.collectionMeetingCalendar && groupData.collectionMeetingCalendar.nextTenRecurringDates[0]">
-            {{"labels.inputs.Next Meeting Date"  |translate}}
+            {{"labels.inputs.Next Meeting Date" | translate }}
           </div>
-  
+
           <div fxFlex="50%" *ngIf="groupData.collectionMeetingCalendar && groupData.collectionMeetingCalendar.nextTenRecurringDates[0]">
             {{ groupData.collectionMeetingCalendar.nextTenRecurringDates[0]  | dateFormat }}
           </div>
 
           <div fxFlex="50%" class="mat-body-strong" *ngIf="groupData.collectionMeetingCalendar && groupData.collectionMeetingCalendar.humanReadable">
-            {{"labels.inputs.Meeting Frequency"  |translate}}
+            {{"labels.inputs.Meeting Frequency" | translate }}
           </div>
-  
+
           <div fxFlex="50%" *ngIf="groupData.collectionMeetingCalendar && groupData.collectionMeetingCalendar.humanReadable">
             {{ groupData.collectionMeetingCalendar.humanReadable }}
           </div>
 
           <div fxFlex="50%" class="mat-body-strong">
-            {{"labels.inputs.Number of Clients"  |translate}}
+            {{"labels.inputs.Number of Clients" | translate }}
           </div>
-  
+
           <div fxFlex="50%">
             {{ clientData ? clientData.length : '' }}
           </div>

src/app/navigation/loan-account-table/loan-account-table.component.html

@@ -5,34 +5,34 @@
   </mat-form-field>
   <button mat-raised-button color="primary" (click)="toggleClosed()">
     {{ showClosed ? 'View Active' : 'View Closed' }}
-  </button>  
+  </button>
 </div>
 
 <table mat-table [dataSource]="dataSource" matSort>
 
   <ng-container matColumnDef="accountNo">
-    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Account Number"  |translate}} </th>
+    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Account Number" | translate }} </th>
     <td mat-cell *matCellDef="let loanAccount">{{ loanAccount.accountNo }}</td>
   </ng-container>
 
   <ng-container matColumnDef="productName">
-    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Loan Account"  |translate}} </th>
+    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Loan Account" | translate }} </th>
     <td mat-cell *matCellDef="let loanAccount">{{ loanAccount.productName }}</td>
   </ng-container>
 
   <ng-container matColumnDef="Type">
-    <th mat-header-cell *matHeaderCellDef> {{"labels.inputs.Type"  |translate}} </th>
+    <th mat-header-cell *matHeaderCellDef> {{"labels.inputs.Type" | translate }} </th>
     <td mat-cell *matCellDef="let loanAccount">
       <fa-icon matTooltip="{{ loanAccount.loanType.value }}" matTooltipPosition="right" [icon]="(loanAccount.loanType.code === 'accountType.individual') ? 'user' : 'users'" size="lg"></fa-icon>
     </td>
   </ng-container>
 
   <ng-container matColumnDef="Status">
-    <th mat-header-cell *matHeaderCellDef> {{"labels.inputs.Status"  |translate}} </th>
+    <th mat-header-cell *matHeaderCellDef> {{"labels.inputs.Status" | translate }} </th>
     <td mat-cell *matCellDef="let loanAccount">
       <span [className]="loanAccount.inArrears?'status-active-overdue' : (loanAccount.status.code | statusLookup)">
         <fa-icon matTooltip="{{ loanAccount.status.value }}" matTooltipPosition="right" icon="circle" size="md"></fa-icon>
-      </span>  
+      </span>
     </td>
   </ng-container>
 

src/app/navigation/member-groups/member-groups.component.html

@@ -8,12 +8,12 @@
 <table mat-table [dataSource]="dataSource" matSort>
 
   <ng-container matColumnDef="accountNo">
-    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Account Number"  |translate}} </th>
+    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Account Number" | translate }} </th>
     <td mat-cell *matCellDef="let memberGroup"> {{ memberGroup.accountNo }} </td>
   </ng-container>
 
   <ng-container matColumnDef="name">
-    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Group Name"  |translate}} </th>
+    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Group Name" | translate }} </th>
     <td mat-cell *matCellDef="let memberGroup"> {{ memberGroup.name }} </td>
   </ng-container>
 

src/app/navigation/navigation.component.html

@@ -9,7 +9,7 @@
         <mat-card-content fxLayout="column">
 
           <mat-form-field *ngIf="!(officeData === undefined || officeData === null)">
-            <mat-label>{{"labels.inputs.Office"  |translate}}</mat-label>
+            <mat-label>{{"labels.inputs.Office" | translate }}</mat-label>
             <mat-select [formControl]="officeSelector">
               <mat-option *ngFor="let office of officeData" [value]="office.id">
                 {{ office.name }}
@@ -51,11 +51,11 @@
                 {{ client.displayName }}
               </mat-option>
             </mat-select>
-          </mat-form-field>  
+          </mat-form-field>
 
         </mat-card-content>
-          
-      </mat-card>  
+
+      </mat-card>
 
     </div>
 
@@ -66,7 +66,7 @@
         <ng-container *ngIf="selectedItem.itemType === 'office'">
           <mifosx-office-navigation [officeData]="selectedItem" [employeeData]="employeeData"></mifosx-office-navigation>
         </ng-container>
-  
+
         <ng-container *ngIf="selectedItem.itemType === 'employee'">
           <mifosx-staff-navigation [employeeData]="selectedItem" [centerData]="centerData"></mifosx-staff-navigation>
         </ng-container>
@@ -74,16 +74,16 @@
         <ng-container *ngIf="selectedItem.itemType === 'center'">
           <mifosx-center-navigation [centerData]="selectedItem" [groupData]="groupData" [centerAccountsData]='selectedItemAccounts' [centerSummaryData]='selectedItemSummary'></mifosx-center-navigation>
         </ng-container>
-  
+
         <ng-container *ngIf="selectedItem.itemType === 'group'">
           <mifosx-group-navigation [groupData]="selectedItem" [clientData]="clientData" [groupAccountsData]='selectedItemAccounts'></mifosx-group-navigation>
         </ng-container>
-    
+
         <ng-container *ngIf="selectedItem.itemType === 'client'">
           <mifosx-client-navigation [clientData]="selectedItem" [clientAccountsData]='selectedItemAccounts'></mifosx-client-navigation>
         </ng-container>
-  
-      </mat-card>  
+
+      </mat-card>
 
     </div>
 

src/app/navigation/office-navigation/office-navigation.component.html

@@ -9,7 +9,7 @@
       </mat-card-title>
       <mat-card-subtitle>
         <p *ngIf="officeData.externalId">
-          {{"labels.inputs.External Id"  |translate}}:<mifosx-external-identifier externalId="{{officeData.externalId}}"></mifosx-external-identifier>
+          {{"labels.inputs.External Id" | translate }}:<mifosx-external-identifier externalId="{{officeData.externalId}}"></mifosx-external-identifier>
         </p>
       </mat-card-subtitle>
     </div>
@@ -20,7 +20,7 @@
   <div fxLayout="row wrap" class="content">
 
     <div fxFlex="50%" class="mat-body-strong">
-      {{"labels.inputs.Opened On"  |translate}}
+      {{"labels.inputs.Opened On" | translate }}
     </div>
 
     <div fxFlex="50%">
@@ -28,7 +28,7 @@
     </div>
 
     <div fxFlex="50%" class="mat-body-strong" *ngIf="officeData.parentName">
-      {{"labels.inputs.Parent officeData"  |translate}}
+      {{"labels.inputs.Parent officeData" | translate }}
     </div>
 
     <div fxFlex="50%" *ngIf="officeData.parentName">
@@ -36,7 +36,7 @@
     </div>
 
     <div fxFlex="50%" class="mat-body-strong">
-      {{"labels.inputs.Number of Staff"  |translate}}
+      {{"labels.inputs.Number of Staff" | translate }}
     </div>
 
     <div fxFlex="50%">

src/app/navigation/savings-account-table/savings-account-table.component.html

@@ -5,32 +5,32 @@
   </mat-form-field>
   <button mat-raised-button color="primary" (click)="toggleClosed()">
     {{ showClosed ? 'View Active' : 'View Closed' }}
-  </button>  
+  </button>
 </div>
 
 <table mat-table [dataSource]="dataSource" matSort>
 
   <ng-container matColumnDef="accountNo">
-    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Account Number"  |translate}} </th>
+    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Account Number" | translate }} </th>
     <td mat-cell *matCellDef="let savingsAccount">{{ savingsAccount.accountNo }}</td>
   </ng-container>
 
   <ng-container matColumnDef="productName">
-    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Savings Account"  |translate}} </th>
+    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Savings Account" | translate }} </th>
     <td mat-cell *matCellDef="let savingsAccount">{{ savingsAccount.productName }}</td>
   </ng-container>
 
   <ng-container matColumnDef="accountBalance">
-    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Balance"  |translate}} </th>
+    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Balance" | translate }} </th>
     <td mat-cell *matCellDef="let savingsAccount">{{ savingsAccount.accountBalance }}</td>
   </ng-container>
 
   <ng-container matColumnDef="Status">
-    <th mat-header-cell *matHeaderCellDef> {{"labels.inputs.Status"  |translate}} </th>
+    <th mat-header-cell *matHeaderCellDef> {{"labels.inputs.Status" | translate }} </th>
     <td mat-cell *matCellDef="let savingsAccount">
       <span [className]="savingsAccount.status.code | statusLookup">
         <fa-icon matTooltip="{{ savingsAccount.status.value }}" matTooltipPosition="right" icon="circle" size="md"></fa-icon>
-      </span>  
+      </span>
     </td>
   </ng-container>
 

src/app/navigation/share-account-table/share-account-table.component.html

@@ -5,32 +5,32 @@
   </mat-form-field>
   <button mat-raised-button color="primary" (click)="toggleClosed()">
     {{ showClosed ? 'View Active' : 'View Closed' }}
-  </button>  
+  </button>
 </div>
 
 <table mat-table [dataSource]="dataSource" matSort>
 
   <ng-container matColumnDef="accountNo">
-    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Account Number"  |translate}} </th>
+    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Account Number" | translate }} </th>
     <td mat-cell *matCellDef="let shareAccount">{{ shareAccount.accountNo }}</td>
   </ng-container>
 
   <ng-container matColumnDef="productName">
-    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Share Account"  |translate}} </th>
+    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Share Account" | translate }} </th>
     <td mat-cell *matCellDef="let shareAccount">{{ shareAccount.productName }}</td>
   </ng-container>
 
   <ng-container matColumnDef="totalApprovedShares">
-    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Approved Shares"  |translate}} </th>
+    <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Approved Shares" | translate }} </th>
     <td mat-cell *matCellDef="let savingsAccount">{{ savingsAccount.totalApprovedShares }}</td>
   </ng-container>
 
   <ng-container matColumnDef="Status">
-    <th mat-header-cell *matHeaderCellDef> {{"labels.inputs.Status"  |translate}} </th>
+    <th mat-header-cell *matHeaderCellDef> {{"labels.inputs.Status" | translate }} </th>
     <td mat-cell *matCellDef="let shareAccount">
       <span [className]="shareAccount.status.code | statusLookup">
         <fa-icon matTooltip="{{ shareAccount.status.value }}" matTooltipPosition="right" icon="circle" size="md"></fa-icon>
-      </span>  
+      </span>
     </td>
   </ng-container>
 

src/app/navigation/staff-navigation/staff-navigation.component.html

@@ -4,26 +4,26 @@
     <div class="mat-typography">
       <mat-card-title>
         <h2>
-          {{ employeeData.displayName }} 
+          {{ employeeData.displayName }}
           <span [className]="employeeData.isActive === true ? 'true' : 'false'">
             <fa-icon matTooltip="{{ employeeData.isActive === true ? 'Active' : 'Inactive' }}" matTooltipPosition="right" icon="circle" size="lg"></fa-icon>
-          </span>        
+          </span>
         </h2>
       </mat-card-title>
       <mat-card-subtitle>
         <p>
-          {{"labels.inputs.Associated Office"  |translate}}: {{ employeeData.officeName }}
+          {{"labels.inputs.Associated Office" | translate }}: {{ employeeData.officeName }}
         </p>
       </mat-card-subtitle>
     </div>
-  </mat-card-title-group> 
+  </mat-card-title-group>
 </mat-card-header>
 
 <mat-card-content>
   <div fxLayout="row wrap" class="content">
 
     <div fxFlex="50%" class="mat-body-strong">
-      {{"labels.inputs.Joined On"  |translate}}
+      {{"labels.inputs.Joined On" | translate }}
     </div>
 
     <div fxFlex="50%">
@@ -31,15 +31,15 @@
     </div>
 
     <div fxFlex="50%" class="mat-body-strong">
-      {{"labels.inputs.Loan Officer"  |translate}}
+      {{"labels.inputs.Loan Officer" | translate }}
     </div>
 
     <div fxFlex="50%">
-      {{ employeeData.isLoanOfficer ? 'Yes' : 'No' }}
+      {{ employeeData.isLoanOfficer | yesNo }}
     </div>
 
     <div fxFlex="50%" class="mat-body-strong" *ngIf="employeeData.mobileNo">
-      {{"labels.inputs.Mobile Number"  |translate}}
+      {{"labels.inputs.Mobile Number" | translate }}
     </div>
 
     <div fxFlex="50%" *ngIf="employeeData.mobileNo">
@@ -47,7 +47,7 @@
     </div>
 
     <div fxFlex="50%" class="mat-body-strong">
-      {{"labels.inputs.Number of Centers"  |translate}}
+      {{"labels.inputs.Number of Centers" | translate }}
     </div>
 
     <div fxFlex="50%">