Enhancement in loan and savings account views (#1690)

Co-authored-by: Jose Alberto Hernandez <alberto@MacBook-Pro.local>

src/app/clients/client-stepper/client-family-members-step/client-family-member-dialog/client-family-member-dialog.component.ts

@@ -17,7 +17,6 @@ import { Dates } from 'app/core/utils/dates';
 })
 export class ClientFamilyMemberDialogComponent implements OnInit {
 
-  
   /** Maximum Due Date allowed. */
   maxDate = new Date();
 

src/app/clients/clients-view/custom-dialogs/view-signature-dialog/view-signature-dialog.component.ts

@@ -34,7 +34,6 @@ export class ViewSignatureDialogComponent implements OnInit {
     const signature = this.data.documents.find((document: any) => document.name === 'clientSignature') || {};
     this.signatureId = signature.id;
     this.clientId = this.data.id;
-    console.log(this.clientId);
   }
 
   ngOnInit() {

src/app/clients/clients-view/family-members-tab/add-family-member/add-family-member.component.ts

@@ -18,7 +18,6 @@ import { Dates } from 'app/core/utils/dates';
 })
 export class AddFamilyMemberComponent implements OnInit {
 
- 
   /** Maximum Due Date allowed. */
   maxDate = new Date();
   /** Minimum age allowed is 0. */

src/app/loans/common-resolvers/glim-loan-template.resolver.ts

@@ -23,7 +23,7 @@ export class GLIMLoanTemplateResolver implements Resolve<Object> {
      * @returns {Observable<any>}
      */
     resolve(route: ActivatedRouteSnapshot): Observable<any> {
-        const groupId = route.parent.parent.paramMap.get('groupId');
+        const groupId = route.paramMap.get('groupId');
         return this.loansService.getGLIMLoanAccountTemplate(groupId);
     }
 }

src/app/loans/common-resolvers/loan-action-button.resolver.ts

@@ -24,7 +24,7 @@ export class LoanActionButtonResolver implements Resolve<Object> {
    * @returns {Observable<any>}
    */
   resolve(route: ActivatedRouteSnapshot): Observable<any> {
-    const loanId = route.parent.paramMap.get('loanId');
+    const loanId = route.paramMap.get('loanId') || route.parent.paramMap.get('loanId');
     const loanActionButton = route.paramMap.get('action');
     if (loanActionButton === 'Assign Loan Officer' || loanActionButton === 'Change Loan Officer') {
       return this.loansService.getLoanTemplate(loanId);

src/app/loans/common-resolvers/loan-datatable.resolver.ts

@@ -24,9 +24,9 @@ export class LoanDatatableResolver implements Resolve<Object> {
      * @returns {Observable<any>}
      */
     resolve(route: ActivatedRouteSnapshot): Observable<any> {
-        const loanId = route.parent.parent.paramMap.get('loanId');
+      const loanId = route.paramMap.get('loanId') || route.parent.paramMap.get('loanId');
-        const datatableName = route.paramMap.get('datatableName');
+      const datatableName = route.paramMap.get('datatableName');
-        return this.loansService.getLoanDatatable(loanId, datatableName);
+      return this.loansService.getLoanDatatable(loanId, datatableName);
     }
 
 }

src/app/loans/common-resolvers/loan-delinquency-tags.resolver.ts

@@ -24,8 +24,8 @@ export class LoanDelinquencyTagsResolver implements Resolve<Object> {
      * @returns {Observable<any>}
      */
     resolve(route: ActivatedRouteSnapshot): Observable<any> {
-        const loanId = route.paramMap.get('loanId') || route.parent.paramMap.get('loanId') || route.parent.parent.paramMap.get('loanId');
+      const loanId = route.paramMap.get('loanId') || route.parent.paramMap.get('loanId');
-        return this.loansService.getDelinquencyTags(loanId);
+      return this.loansService.getDelinquencyTags(loanId);
     }
 
 }

src/app/loans/common-resolvers/loan-details-charges.resolver.ts

@@ -24,7 +24,7 @@ export class LoanDetailsChargesResolver implements Resolve<Object> {
      * @returns {Observable<any>}
      */
     resolve(route: ActivatedRouteSnapshot): Observable<any> {
-        const loanId = route.parent.parent.paramMap.get('loanId');
+        const loanId = route.paramMap.get('loanId');
         return this.loansService.getLoanAccountAssociationDetails(loanId);
     }
 

src/app/loans/common-resolvers/loan-details.resolver.ts

@@ -24,8 +24,8 @@ export class LoanDetailsResolver implements Resolve<Object> {
      * @returns {Observable<any>}
      */
     resolve(route: ActivatedRouteSnapshot): Observable<any> {
-        const loanId = route.paramMap.get('loanId') || route.parent.paramMap.get('loanId') || route.parent.parent.paramMap.get('loanId');
+      const loanId = route.paramMap.get('loanId') || route.parent.paramMap.get('loanId');
-        return this.loansService.getLoanAccountAssociationDetails(loanId);
+      return this.loansService.getLoanAccountAssociationDetails(loanId);
     }
 
 }

src/app/loans/common-resolvers/loan-documents.resolver.ts

@@ -24,8 +24,8 @@ export class LoanDocumentsResolver implements Resolve<Object> {
      * @returns {Observable<any>}
      */
     resolve(route: ActivatedRouteSnapshot): Observable<any> {
-        const loanId = route.parent.paramMap.get('loanId');
+      const loanId = route.paramMap.get('loanId') || route.parent.paramMap.get('loanId');
-        return this.loansService.getLoanDocuments(loanId);
+      return this.loansService.getLoanDocuments(loanId);
     }
 
 }

src/app/loans/common-resolvers/loan-notes.resolver.ts

@@ -24,8 +24,8 @@ export class LoanNotesResolver implements Resolve<Object> {
      * @returns {Observable<any>}
      */
     resolve(route: ActivatedRouteSnapshot): Observable<any> {
-        const loanId = route.parent.paramMap.get('loanId');
+      const loanId = route.paramMap.get('loanId') || route.parent.paramMap.get('loanId');
-        return this.loansService.getLoanNotes(loanId);
+      return this.loansService.getLoanNotes(loanId);
     }
 
 }

src/app/loans/common-resolvers/loan-reschedules.resolver.ts

@@ -22,8 +22,8 @@ export class LoanReschedulesResolver implements Resolve<boolean> {
      * @returns {Observable<any>}
      */
     resolve(route: ActivatedRouteSnapshot): Observable<any> {
-        const loanId = route.parent.paramMap.get('loanId');
+      const loanId = route.paramMap.get('loanId') || route.parent.paramMap.get('loanId');
-        return this.loansService.loanRescheduleRequests(loanId);
+      return this.loansService.loanRescheduleRequests(loanId);
     }
 
 }

src/app/loans/common-resolvers/loans-account-and-template.resolver.ts

@@ -23,7 +23,7 @@ export class LoansAccountAndTemplateResolver implements Resolve<Object> {
      * @returns {Observable<any>}
      */
     resolve(route: ActivatedRouteSnapshot): Observable<any> {
-        const loanId = route.parent.paramMap.get('loanId');
+      const loanId = route.paramMap.get('loanId') || route.parent.paramMap.get('loanId');
-        return this.loansService.getLoansAccountAndTemplateResource(loanId);
+      return this.loansService.getLoansAccountAndTemplateResource(loanId);
     }
 }

src/app/loans/common-resolvers/loans-account-charge.resolver.ts

@@ -25,9 +25,9 @@ export class LoansAccountChargeResolver implements Resolve<Object> {
      * @returns {Observable<any>}
      */
     resolve(route: ActivatedRouteSnapshot): Observable<any> {
-        const loanAccountId = route.parent.parent.paramMap.get('loanId');
+      const loanId = route.paramMap.get('loanId');
-        const chargeId = route.paramMap.get('id');
+      const chargeId = route.paramMap.get('id');
-        return this.loansService.getLoansAccountCharge(loanAccountId, chargeId);
+      return this.loansService.getLoansAccountCharge(loanId, chargeId);
     }
 
 }

src/app/loans/common-resolvers/loans-account-transaction-template.resolver.ts

@@ -25,9 +25,9 @@ export class LoansAccountTransactionTemplateResolver implements Resolve<Object>
    * @returns {Observable<any>}
    */
   resolve(route: ActivatedRouteSnapshot): Observable<any> {
-    const loanAccountId = route.parent.parent.parent.paramMap.get('loanId');
+    const loanId = route.paramMap.get('loanId');
     const transactionId = route.paramMap.get('id');
-    return this.loansService.getLoansAccountTransactionTemplate(loanAccountId, transactionId);
+    return this.loansService.getLoansAccountTransactionTemplate(loanId, transactionId);
   }
 
 }

src/app/loans/common-resolvers/loans-account-transaction.resolver.ts

@@ -25,9 +25,9 @@ export class LoansAccountTransactionResolver implements Resolve<Object> {
    * @returns {Observable<any>}
    */
   resolve(route: ActivatedRouteSnapshot): Observable<any> {
-    const loanAccountId = route.parent.parent.parent.paramMap.get('loanId');
+    const loanId = route.paramMap.get('loanId');
     const transactionId = route.paramMap.get('id');
-    return this.loansService.getLoansAccountTransaction(loanAccountId, transactionId);
+    return this.loansService.getLoansAccountTransaction(loanId, transactionId);
   }
 
 }

src/app/loans/edit-loans-account/edit-loans-account.component.ts

@@ -48,7 +48,7 @@ export class EditLoansAccountComponent implements OnInit {
     this.route.data.subscribe((data: { loansAccountAndTemplate: any }) => {
       this.loansAccountAndTemplate = data.loansAccountAndTemplate;
     });
-    this.loanId = this.route.parent.snapshot.params['loanId'];
+    this.loanId = this.route.snapshot.params['loanId'];
   }
 
   ngOnInit() {

src/app/loans/loans-routing.module.ts

@@ -55,6 +55,7 @@ import { LoanDelinquencyTagsResolver } from './common-resolvers/loan-delinquency
 import { LoanDelinquencyTagsTabComponent } from './loans-view/loan-delinquency-tags-tab/loan-delinquency-tags-tab.component';
 import { LoanReschedulesResolver } from './common-resolvers/loan-reschedules.resolver';
 import { RescheduleLoanTabComponent } from './loans-view/reschedule-loan-tab/reschedule-loan-tab.component';
+import { AdjustLoanChargeComponent } from './loans-view/loan-account-actions/adjust-loan-charge/adjust-loan-charge.component';
 
 /** Loans Route. */
 const routes: Routes = [
@@ -73,246 +74,253 @@ const routes: Routes = [
       {
         path: ':loanId',
         data: { title: extract('Loan View'), routeParamBreadcrumb: 'loanId' },
+        component: LoansViewComponent,
+        resolve: {
+          loanDetailsData: LoanDetailsResolver,
+          loanDatatables: LoanDatatablesResolver
+        },
         children: [
           {
             path: '',
-            component: LoansViewComponent,
+            redirectTo: 'general',
+            pathMatch: 'full'
+          },
+          {
+            path: 'general',
+            component: GeneralTabComponent,
+            data: { title: extract('General'), breadcrumb: 'General', routeParamBreadcrumb: false },
             resolve: {
               loanDetailsData: LoanDetailsResolver,
               loanDatatables: LoanDatatablesResolver
             },
-            children: [
+          },
-              {
+          {
-                path: '',
+            path: 'accountdetail',
-                redirectTo: 'general',
+            component: AccountDetailsComponent,
-                pathMatch: 'full'
+            data: { title: extract('Account Detail'), breadcrumb: 'Account Detail', routeParamBreadcrumb: false }
-              },
+          },
-              {
+          {
-                path: 'general',
+            path: 'original-schedule',
-                component: GeneralTabComponent,
+            component: OriginalScheduleTabComponent,
-                data: { title: extract('General'), breadcrumb: 'General', routeParamBreadcrumb: false }
+            data: { title: extract('Original Schedule'), breadcrumb: 'Original Schedule', routeParamBreadcrumb: false },
-              },
+          },
-              {
+          {
-                path: 'accountdetail',
+            path: 'repayment-schedule',
-                component: AccountDetailsComponent,
+            component: RepaymentScheduleTabComponent,
-                data: { title: extract('Account Detail'), breadcrumb: 'Account Detail', routeParamBreadcrumb: false }
+            data: { title: extract('Repayment Schedule'), breadcrumb: 'Repayment Schedule', routeParamBreadcrumb: false },
-              },
-              {
-                path: 'original-schedule',
-                component: OriginalScheduleTabComponent,
-                data: { title: extract('Original Schedule'), breadcrumb: 'Original Schedule', routeParamBreadcrumb: false },
-              },
-              {
-                path: 'repayment-schedule',
-                component: RepaymentScheduleTabComponent,
-                data: { title: extract('Repayment Schedule'), breadcrumb: 'Repayment Schedule', routeParamBreadcrumb: false },
-              },
-              {
-                path: 'transactions',
-                data: { title: extract('Loans Account Transactions'), breadcrumb: 'Transactions', routeParamBreadcrumb: false },
-                children: [
-                  {
-                    path: '',
-                    component: TransactionsTabComponent
-
-                  },
-                  {
-                    path: 'export',
-                    component: ExportTransactionsComponent
-                  }
-                ]
-              },
-              {
-                path: 'delinquencytags',
-                data: { title: extract('Loans Delinquency Tags'), breadcrumb: 'Delinquency Tags', routeParamBreadcrumb: false },
-                resolve: {
-                  loanDelinquencyTagsData: LoanDelinquencyTagsResolver
-                },
-                children: [
-                  {
-                    path: '',
-                    component: LoanDelinquencyTagsTabComponent
-                  },
-                ]
-              },
-              {
-                path: 'loan-reschedules',
-                data: {},
-                resolve: {
-                  loanRescheduleData: LoanReschedulesResolver
-                },
-                children: [
-                  {
-                    path: '',
-                    component: RescheduleLoanTabComponent
-                  }
-                ]
-              },
-              {
-                path: 'loan-collateral',
-                component: LoanCollateralTabComponent,
-                data: { title: extract('Loan Collateral Details'), breadcrumb: 'Loan Collateral Details', routeParamBreadcrumb: false },
-              },
-              {
-                path: 'loan-tranche-details',
-                component: LoanTrancheDetailsComponent,
-                data: { title: extract('Loan Tranche Details'), breadcrumb: 'Loan Tranche Details', routeParamBreadcrumb: false },
-              },
-              {
-                path: 'overdue-charges',
-                component: OverdueChargesTabComponent,
-                data: { title: extract('Overdue Charges'), breadcrumb: 'Overdue Charges', routeParamBreadcrumb: false }
-              },
-              {
-                path: 'floating-interest-rates',
-                component: FloatingInterestRatesComponent,
-                data: { title: extract('Floating Interest Rates'), breadcrumb: 'Floating Interest Rates', routeParamBreadcrumb: false },
-              },
-              {
-                path: 'charges',
-                data: { title: extract('Loans Account Charges'), breadcrumb: 'Charges', routeParamBreadcrumb: false },
-                component: ChargesTabComponent,
-              },
-              {
-                path: 'loan-documents',
-                component: LoanDocumentsTabComponent,
-                data: { title: extract('Loan Documents'), breadcrumb: 'Loan Documents', routeParamBreadcrumb: false },
-                resolve: {
-                  loanDocuments: LoanDocumentsResolver
-                },
-              },
-              {
-                path: 'notes',
-                component: NotesTabComponent,
-                data: { title: extract('Notes'), breadcrumb: 'Notes', routeParamBreadcrumb: false },
-                resolve: {
-                  loanNotes: LoanNotesResolver
-                },
-              },
-              {
-                path: 'standing-instruction',
-                component: StandingInstructionsTabComponent,
-                data: { title: extract('Standing Instructions'), breadcrumb: 'Standing Instructions', routeParamBreadcrumb: false }
-              },
-              {
-                path: 'datatables',
-                children: [{
-                  path: ':datatableName',
-                  component: DatatableTabComponent,
-                  data: { title: extract('Data Table View'), routeParamBreadcrumb: 'datatableName' },
-                  resolve: {
-                    loanDatatable: LoanDatatableResolver
-                  }
-                }]
-              },
-            ],
           },
           {
             path: 'transactions',
             data: { title: extract('Loans Account Transactions'), breadcrumb: 'Transactions', routeParamBreadcrumb: false },
+            children: [
+              {
+                path: '',
+                component: TransactionsTabComponent
+
+              },
+              {
+                path: 'export',
+                component: ExportTransactionsComponent
+              }
+            ]
+          },
+          {
+            path: 'delinquencytags',
+            data: { title: extract('Loans Delinquency Tags'), breadcrumb: 'Delinquency Tags', routeParamBreadcrumb: false },
             resolve: {
-              loanDetailsAssociationData: LoanDetailsResolver
+              loanDelinquencyTagsData: LoanDelinquencyTagsResolver
             },
             children: [
               {
                 path: '',
-                redirectTo: '../transactions', pathMatch: 'prefix'
+                component: LoanDelinquencyTagsTabComponent
               },
+            ]
+          },
+          {
+            path: 'loan-reschedules',
+            data: {},
+            resolve: {
+              loanRescheduleData: LoanReschedulesResolver
+            },
+            children: [
               {
-                path: ':id',
+                path: '',
-                data: { routeParamBreadcrumb: 'id' },
+                component: RescheduleLoanTabComponent
-                children: [
-                  {
-                    path: '',
-                    component: ViewTransactionComponent,
-                    resolve: {
-                      loansAccountTransaction: LoansAccountTransactionResolver
-                    }
-                  },
-                  {
-                    path: 'edit',
-                    component: EditTransactionComponent,
-                    data: { breadcrumb: 'Edit', routeParamBreadcrumb: false },
-                    resolve: {
-                      loansAccountTransactionTemplate: LoansAccountTransactionTemplateResolver
-                    }
-                  },
-                  {
-                    path: 'reciept',
-                    component: ViewRecieptComponent,
-                    data: { breadcrumb: 'Reciept', routeParamBreadcrumb: false },
-                    resolve: {
-                      loansTransactionReciept: LoansTransactionRecieptResolver
-                    }
-                  }
-                ]
               }
             ]
           },
+          {
+            path: 'loan-collateral',
+            component: LoanCollateralTabComponent,
+            data: { title: extract('Loan Collateral Details'), breadcrumb: 'Loan Collateral Details', routeParamBreadcrumb: false },
+          },
+          {
+            path: 'loan-tranche-details',
+            component: LoanTrancheDetailsComponent,
+            data: { title: extract('Loan Tranche Details'), breadcrumb: 'Loan Tranche Details', routeParamBreadcrumb: false },
+          },
+          {
+            path: 'overdue-charges',
+            component: OverdueChargesTabComponent,
+            data: { title: extract('Overdue Charges'), breadcrumb: 'Overdue Charges', routeParamBreadcrumb: false }
+          },
+          {
+            path: 'floating-interest-rates',
+            component: FloatingInterestRatesComponent,
+            data: { title: extract('Floating Interest Rates'), breadcrumb: 'Floating Interest Rates', routeParamBreadcrumb: false },
+          },
           {
             path: 'charges',
             data: { title: extract('Loans Account Charges'), breadcrumb: 'Charges', routeParamBreadcrumb: false },
-            children: [
+            component: ChargesTabComponent,
-              {
+          },
-                path: '',
+          {
-                redirectTo: '../charges', pathMatch: 'prefix'
+            path: 'loan-documents',
-              },
+            component: LoanDocumentsTabComponent,
-              {
+            data: { title: extract('Loan Documents'), breadcrumb: 'Loan Documents', routeParamBreadcrumb: false },
-                path: ':id',
+            resolve: {
-                data: { routeParamBreadcrumb: 'id' },
+              loanDocuments: LoanDocumentsResolver
-                component: ViewChargeComponent,
+            },
-                resolve: {
+          },
-                  loansAccountCharge: LoansAccountChargeResolver,
+          {
-                  loanDetailsData: LoanDetailsResolver
+            path: 'notes',
-                }
+            component: NotesTabComponent,
+            data: { title: extract('Notes'), breadcrumb: 'Notes', routeParamBreadcrumb: false },
+            resolve: {
+              loanNotes: LoanNotesResolver
+            },
+          },
+          {
+            path: 'standing-instruction',
+            component: StandingInstructionsTabComponent,
+            data: { title: extract('Standing Instructions'), breadcrumb: 'Standing Instructions', routeParamBreadcrumb: false }
+          },
+          {
+            path: 'datatables',
+            children: [{
+              path: ':datatableName',
+              component: DatatableTabComponent,
+              data: { title: extract('Data Table View'), routeParamBreadcrumb: 'datatableName' },
+              resolve: {
+                loanDatatable: LoanDatatableResolver
               }
-            ]
+            }]
           },
+        ],
+      },
+      {
+        path: ':loanId/transactions/:id',
+        data: { title: extract('Loans Account Transactions'), breadcrumb: 'Transactions', routeParamBreadcrumb: false },
+        resolve: {
+          loanDetailsAssociationData: LoanDetailsResolver
+        },
+        children: [
           {
-            path: 'actions/:action',
+            path: '',
-            component: LoanAccountActionsComponent,
+            data: { routeParamBreadcrumb: 'id' },
-            data: { title: extract('Loan Account Actions'), breadcrumb: 'action', routeParamBreadcrumb: 'action' },
+            component: ViewTransactionComponent,
             resolve: {
-              actionButtonData: LoanActionButtonResolver
+              loansAccountTransaction: LoansAccountTransactionResolver
             }
           },
           {
-            path: 'transfer-funds',
+            path: 'edit',
-            loadChildren: () => import('../account-transfers/account-transfers.module').then(m => m.AccountTransfersModule)
+            component: EditTransactionComponent,
-          },
+            data: { breadcrumb: 'Edit', routeParamBreadcrumb: false },
-          {
-            path: 'edit-loans-account',
-            data: { title: extract('Modify Loans Account'), breadcrumb: 'Modify Loans Account', routeParamBreadcrumb: 'Edit' },
-            component: EditLoansAccountComponent,
             resolve: {
-              loansAccountAndTemplate: LoansAccountAndTemplateResolver
+              loansAccountTransactionTemplate: LoansAccountTransactionTemplateResolver
             }
           },
+          {
+            path: 'reciept',
+            component: ViewRecieptComponent,
+            data: { breadcrumb: 'Reciept', routeParamBreadcrumb: false },
+            resolve: {
+              loansTransactionReciept: LoansTransactionRecieptResolver
+            }
+          }
         ]
       },
       {
-        path: 'glim-account',
+        path: ':loanId/edit-loans-account',
+        data: { title: extract('Modify Loans Account'), breadcrumb: 'Modify Loans Account', routeParamBreadcrumb: 'Edit' },
+        component: EditLoansAccountComponent,
+        resolve: {
+          loansAccountAndTemplate: LoansAccountAndTemplateResolver
+        }
+      },
+      {
+        path: ':loanId/charges',
+        data: { title: extract('Loans Account Charges'), breadcrumb: 'Charges', routeParamBreadcrumb: false },
         children: [
           {
-            path: 'create',
+            path: '',
-            data: { title: extract('Create GLIM Application'), breadcrumb: 'Create GLIM Application' },
+            redirectTo: '../charges', pathMatch: 'prefix'
-            component: CreateGlimAccountComponent,
-            resolve: {
-              loansAccountTemplate: GLIMLoanTemplateResolver,
-              gsimData: GSIMAccountsResolver,
-              groupsData: GroupViewResolver,
-            },
           },
           {
-            path: ':glimId',
+            path: ':id',
-            data: { title: extract('GSIM Account View'), routeParamBreadcrumb: 'savingAccountId' },
+            data: { routeParamBreadcrumb: 'id' },
-            component: GlimAccountComponent,
+            component: ViewChargeComponent,
             resolve: {
-              glimData: GLIMViewResolver,
+              loansAccountCharge: LoansAccountChargeResolver,
-              groupsData: GroupAccountsResolver
+              loanDetailsData: LoanDetailsResolver
-            },
+            }
+          },
+          {
+            path: ':id/adjustment',
+            data: { routeParamBreadcrumb: 'id', breadcrumb: 'Adjustment' },
+            component: AdjustLoanChargeComponent,
+            resolve: {
+              loansAccountCharge: LoansAccountChargeResolver,
+              loanDetailsData: LoanDetailsResolver
+            }
           }
         ]
+      },
+      {
+        path: ':loanId/actions/:action',
+        component: LoanAccountActionsComponent,
+        data: { title: extract('Loan Account Actions'), breadcrumb: 'action', routeParamBreadcrumb: 'action' },
+        resolve: {
+          actionButtonData: LoanActionButtonResolver
+        }
+      },
+      {
+        path: 'transfer-funds',
+        loadChildren: () => import('../account-transfers/account-transfers.module').then(m => m.AccountTransfersModule)
+      },
+      {
+        path: 'edit-loans-account',
+        data: { title: extract('Modify Loans Account'), breadcrumb: 'Modify Loans Account', routeParamBreadcrumb: 'Edit' },
+        component: EditLoansAccountComponent,
+        resolve: {
+          loansAccountAndTemplate: LoansAccountAndTemplateResolver
+        }
+      },
+    ]
+  },
+  {
+    path: 'glim-account',
+    children: [
+      {
+        path: 'create',
+        data: { title: extract('Create GLIM Application'), breadcrumb: 'Create GLIM Application' },
+        component: CreateGlimAccountComponent,
+        resolve: {
+          loansAccountTemplate: GLIMLoanTemplateResolver,
+          gsimData: GSIMAccountsResolver,
+          groupsData: GroupViewResolver,
+        },
+      },
+      {
+        path: ':glimId',
+        data: { title: extract('GSIM Account View'), routeParamBreadcrumb: 'savingAccountId' },
+        component: GlimAccountComponent,
+        resolve: {
+          glimData: GLIMViewResolver,
+          groupsData: GroupAccountsResolver
+        },
       }
     ]
   }

src/app/loans/loans-view/charges-tab/charges-tab.component.html

@@ -1,83 +1,93 @@
 <div class="tab-container">
 
-    <table mat-table [dataSource]="dataSource" matSort>
+  <table mat-table [dataSource]="dataSource" matSort>
 
-      <ng-container matColumnDef="name">
+    <ng-container matColumnDef="name">
-        <th mat-header-cell *matHeaderCellDef mat-sort-header> Name </th>
+      <th mat-header-cell *matHeaderCellDef mat-sort-header> Name </th>
-        <td mat-cell *matCellDef="let charge"> {{ charge.name }} </td>
+      <td mat-cell *matCellDef="let charge"> {{ charge.name }} </td>
-      </ng-container>
+    </ng-container>
 
-      <ng-container matColumnDef="feepenalty">
+    <ng-container matColumnDef="feepenalty">
-        <th mat-header-cell *matHeaderCellDef mat-sort-header> Fee/Penalty </th>
+      <th mat-header-cell *matHeaderCellDef mat-sort-header> Fee/Penalty </th>
-        <td mat-cell *matCellDef="let charge">
+      <td mat-cell *matCellDef="let charge">
-          <span *ngIf="charge.penalty">Penalty</span>
+        <span *ngIf="charge.penalty">Penalty</span>
-          <span *ngIf="!charge.penalty">Fee</span>
+        <span *ngIf="!charge.penalty">Fee</span>
-        </td>
+      </td>
-      </ng-container>
+    </ng-container>
 
-      <ng-container matColumnDef="paymentdueat">
+    <ng-container matColumnDef="paymentdueat">
-        <th mat-header-cell *matHeaderCellDef mat-sort-header> Payment due at </th>
+      <th mat-header-cell *matHeaderCellDef mat-sort-header> Payment due at </th>
-        <td mat-cell *matCellDef="let charge"> {{ charge.chargeTimeType.value }} </td>
+      <td mat-cell *matCellDef="let charge"> {{ charge.chargeTimeType.value }} </td>
-      </ng-container>
+    </ng-container>
 
-      <ng-container matColumnDef="dueDate">
+    <ng-container matColumnDef="dueDate">
-        <th mat-header-cell *matHeaderCellDef mat-sort-header> Due as of </th>
+      <th mat-header-cell *matHeaderCellDef mat-sort-header> Due as of </th>
-        <td mat-cell *matCellDef="let charge"> {{ charge.dueDate | dateFormat }} </td>
+      <td mat-cell *matCellDef="let charge"> {{ charge.dueDate | dateFormat }} </td>
-      </ng-container>
+    </ng-container>
 
-      <ng-container matColumnDef="calculationtype">
+    <ng-container matColumnDef="calculationtype">
-        <th mat-header-cell *matHeaderCellDef mat-sort-header> Calculation Type </th>
+      <th mat-header-cell *matHeaderCellDef mat-sort-header> Calculation Type </th>
-        <td mat-cell *matCellDef="let charge"> {{ charge.chargeCalculationType.value }} </td>
+      <td mat-cell *matCellDef="let charge"> {{ charge.chargeCalculationType.value }} </td>
-      </ng-container>
+    </ng-container>
 
-      <ng-container matColumnDef="due">
+    <ng-container matColumnDef="due">
-        <th mat-header-cell class="r-amount" *matHeaderCellDef mat-sort-header> Due </th>
+      <th mat-header-cell class="r-amount" *matHeaderCellDef mat-sort-header> Due </th>
-        <td mat-cell class="r-amount" *matCellDef="let charge"> {{ charge.currency.displaySymbol }} {{ charge.amount| number }} </td>
+      <td mat-cell class="r-amount" *matCellDef="let charge"> {{ charge.currency.displaySymbol }} {{ charge.amount|
-      </ng-container>
+        number }} </td>
+    </ng-container>
 
-      <ng-container matColumnDef="paid">
+    <ng-container matColumnDef="paid">
-        <th mat-header-cell class="r-amount" *matHeaderCellDef mat-sort-header> Paid </th>
+      <th mat-header-cell class="r-amount" *matHeaderCellDef mat-sort-header> Paid </th>
-        <td mat-cell class="r-amount" *matCellDef="let charge"> {{ charge.currency.displaySymbol }}{{ charge.amountPaid| number }} </td>
+      <td mat-cell class="r-amount" *matCellDef="let charge"> {{ charge.currency.displaySymbol }}{{ charge.amountPaid|
-      </ng-container>
+        number }} </td>
+    </ng-container>
 
-      <ng-container matColumnDef="waived">
+    <ng-container matColumnDef="waived">
-        <th mat-header-cell class="r-amount" *matHeaderCellDef mat-sort-header> Waived </th>
+      <th mat-header-cell class="r-amount" *matHeaderCellDef mat-sort-header> Waived </th>
-        <td mat-cell class="r-amount" *matCellDef="let charge"> {{ charge.currency.displaySymbol }}{{ charge.amountWaived| number }} </td>
+      <td mat-cell class="r-amount" *matCellDef="let charge"> {{ charge.currency.displaySymbol }}{{ charge.amountWaived|
-      </ng-container>
+        number }} </td>
+    </ng-container>
 
-      <ng-container matColumnDef="outstanding">
+    <ng-container matColumnDef="outstanding">
-        <th mat-header-cell class="r-amount" *matHeaderCellDef mat-sort-header> Outstanding </th>
+      <th mat-header-cell class="r-amount" *matHeaderCellDef mat-sort-header> Outstanding </th>
-        <td mat-cell class="r-amount" *matCellDef="let charge"> {{ charge.currency.displaySymbol }}{{ charge.amountOutstanding| number }} </td>
+      <td mat-cell class="r-amount" *matCellDef="let charge"> {{ charge.currency.displaySymbol }}{{
-      </ng-container>
+        charge.amountOutstanding| number }} </td>
+    </ng-container>
 
-      <ng-container matColumnDef="actions">
+    <ng-container matColumnDef="actions">
-        <th mat-header-cell class="center" *matHeaderCellDef mat-sort-header> Actions </th>
+      <th mat-header-cell class="center" *matHeaderCellDef mat-sort-header> Actions </th>
-        <td mat-cell class="center" *matCellDef="let charge">
+      <td mat-cell class="center" *matCellDef="let charge">
-          <span *ngIf="status === 'Submitted and pending approval'">
+        <span *ngIf="status === 'Submitted and pending approval'">
-            <button class="account-action-button" mat-raised-button color="primary" matTooltip="Edit Charge"
+          <button class="account-action-button" mat-raised-button color="primary" matTooltip="Edit Charge"
-              (click)="routeEdit($event); editCharge(charge)">
+            (click)="routeEdit($event); editCharge(charge)">
-              <i class="fa fa-pencil"></i>
+            <i class="fa fa-pencil"></i>
-            </button>
+          </button>
-            <button class="account-action-button" mat-raised-button color="warn" matTooltip="Delete Charge"
+          <button class="account-action-button" mat-raised-button color="warn" matTooltip="Delete Charge"
-              (click)="routeEdit($event); deleteCharge(charge.id)">
+            (click)="routeEdit($event); deleteCharge(charge.id)">
-              <i class="fa fa-trash"></i>
+            <i class="fa fa-trash"></i>
-            </button>
+          </button>
-          </span>
+        </span>
-            <button class="account-action-button" mat-raised-button color="primary" matTooltip="Pay Charge" *ngIf="charge.chargePayable && !charge.paid && status=='Active'"
+        <button class="account-action-button" mat-raised-button color="accent" matTooltip="Adjust Charge"
-               (click)="routeEdit($event); payCharge(charge.id)">
+          *ngIf="!charge.paid && status=='Active'"
-              <i class="fa fa-dollar"></i>
+          (click)="routeEdit($event); adjustCharge(charge.id)">
-            </button>
+          <i class="fa fa-pencil"></i>
-            <button class="account-action-button" mat-raised-button color="primary" matTooltip="Waive Charge" *ngIf="!charge.actionFlag"
+        </button>
-              (click)="routeEdit($event); waiveCharge(charge.id)">
+        <button class="account-action-button" mat-raised-button color="primary" matTooltip="Pay Charge"
-              <i class="fa fa-flag"></i>
+          *ngIf="charge.chargePayable && !charge.paid && status=='Active'"
-            </button>
+          (click)="routeEdit($event); payCharge(charge.id)">
-        </td>
+          <i class="fa fa-dollar"></i>
-      </ng-container>
+        </button>
+        <button class="account-action-button" mat-raised-button color="primary" matTooltip="Waive Charge"
+          *ngIf="!charge.actionFlag" (click)="routeEdit($event); waiveCharge(charge.id)">
+          <i class="fa fa-flag"></i>
+        </button>
+      </td>
+    </ng-container>
 
-      <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
-      <tr mat-row *matRowDef="let row; columns: displayedColumns;" class="select-row" [routerLink]="[row.id]"></tr>
+    <tr mat-row *matRowDef="let row; columns: displayedColumns;" class="select-row" [routerLink]="[row.id]"></tr>
-    </table>
+  </table>
 
-    <mat-paginator [pageSizeOptions]="[10, 25, 50, 100]" showFirstLastButtons></mat-paginator>
+  <mat-paginator [pageSizeOptions]="[10, 25, 50, 100]" showFirstLastButtons></mat-paginator>
 
 </div>

src/app/loans/loans-view/charges-tab/charges-tab.component.ts

@@ -60,7 +60,6 @@ export class ChargesTabComponent implements OnInit {
     });
   }
 
-
   ngOnInit() {
     this.chargesData = this.loanDetails.charges;
     this.status = this.loanDetails.status.value;
@@ -78,6 +77,14 @@ export class ChargesTabComponent implements OnInit {
     this.dataSource.sort = this.sort;
   }
 
+  /**
+   * Asjust the Loan charge.
+   * @param {any} chargeId Charge Id
+   */
+  adjustCharge(chargeId: string) {
+    this.router.navigate([`${chargeId}/adjustment`], { relativeTo: this.route });
+  }
+
   /**
    * Pays the charge.
    * @param {any} chargeId Charge Id

src/app/loans/loans-view/loan-account-actions/add-collateral/add-collateral.component.ts

@@ -58,7 +58,7 @@ export class AddCollateralComponent implements OnInit {
     this.collateralForm.patchValue({
       'collateralTypeId': collateralTypeId
     });
-    const loanId = this.route.parent.snapshot.params['loanId'];
+    const loanId = this.route.snapshot.params['loanId'];
     const collateralForm = this.collateralForm.value;
     collateralForm.locale = 'en';
     this.loanService.createLoanCollateral(loanId, collateralForm).subscribe((response: any) => {

src/app/loans/loans-view/loan-account-actions/add-loan-charge/add-loan-charge.component.ts

@@ -60,7 +60,7 @@ export class AddLoanChargeComponent implements OnInit {
     this.route.data.subscribe((data: { actionButtonData: any }) => {
       this.loanChargeOptions = data.actionButtonData.chargeOptions;
     });
-    this.loanId = this.route.parent.snapshot.params['loanId'];
+    this.loanId = this.route.snapshot.params['loanId'];
   }
 
   /**

src/app/loans/loans-view/loan-account-actions/adjust-loan-charge/adjust-loan-charge.component.html

@@ -0,0 +1,91 @@
+<div class="container mat-elevation-z8">
+
+  <mat-card>
+
+    <form [formGroup]="adjustLoanChargeForm" (ngSubmit)="submit()">
+
+      <mat-card-content>
+
+        <div fxLayout="column">
+
+          <mat-form-field appearance="fill">
+            <mat-label>Amount</mat-label>
+            <span matTextSuffix class="m-l-10">{{ loanDetailsData.currency.code }}</span>
+            <span fxFlex="auto"></span>
+            <input type="number" matInput required class="right-input" formControlName="amount">
+            <mat-error *ngIf="adjustLoanChargeForm.controls.amount.hasError('required')">
+              Amount <strong>is required</strong>
+            </mat-error>
+          </mat-form-field>
+
+          <mat-form-field>
+            <mat-label>External Id</mat-label>
+            <input matInput formControlName="externalId">
+          </mat-form-field>
+
+          <mat-form-field>
+            <mat-label>Payment Type</mat-label>
+            <mat-select formControlName="paymentTypeId">
+              <mat-option *ngFor="let paymentType of paymentTypes" [value]="paymentType.id">
+                {{ paymentType.name }}
+              </mat-option>
+            </mat-select>
+          </mat-form-field>
+
+          <div fxFlexFill>
+            <span fxFlex="75%" class="expandcollapsebutton m-l-10 m-t-40" (click)="addPaymentDetails()">
+              <mat-slide-toggle>
+                <div [className]="showPaymentDetails ? 'enabled' : 'disabled'">
+                  <span class="m-l-10">Show Payment Details</span>
+                </div>
+              </mat-slide-toggle>
+            </span>
+          </div>
+
+          <ng-container *ngIf="showPaymentDetails">
+            <mat-form-field>
+              <mat-label> Account #</mat-label>
+              <input matInput formControlName="accountNumber">
+            </mat-form-field>
+
+            <mat-form-field>
+              <mat-label>Cheque #</mat-label>
+              <input matInput formControlName="checkNumber">
+            </mat-form-field>
+
+            <mat-form-field>
+              <mat-label>Routing Code</mat-label>
+              <input matInput formControlName="routingCode">
+            </mat-form-field>
+
+            <mat-form-field>
+              <mat-label>Reciept #</mat-label>
+              <input matInput formControlName="receiptNumber">
+            </mat-form-field>
+
+            <mat-form-field>
+              <mat-label>Bank #</mat-label>
+              <input matInput formControlName="bankNumber">
+            </mat-form-field>
+          </ng-container>
+
+          <mat-form-field>
+            <mat-label>Note</mat-label>
+            <textarea matInput formControlName="note" cdkTextareaAutosize cdkAutosizeMinRows="2"></textarea>
+          </mat-form-field>
+
+        </div>
+
+        <mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
+          <button type="button" mat-raised-button [routerLink]="['../..']">Cancel</button>
+          <button mat-raised-button color="primary" [disabled]="!adjustLoanChargeForm.valid"
+            *mifosxHasPermission="'ADJUSTMENT_LOANCHARGE'">Submit</button>
+        </mat-card-actions>
+
+      </mat-card-content>
+
+    </form>
+
+  </mat-card>
+
+</div>

src/app/loans/loans-view/loan-account-actions/adjust-loan-charge/adjust-loan-charge.component.scss

@@ -0,0 +1,15 @@
+.expandcollapsebutton {
+  margin-top: -7px;
+}
+
+.container {
+  max-width: 37rem;
+}
+
+.right-input {
+text-align: right;
+}
+
+.right-label {
+padding-right: 25px !important;
+}

src/app/loans/loans-view/loan-account-actions/adjust-loan-charge/adjust-loan-charge.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AdjustLoanChargeComponent } from './adjust-loan-charge.component';
+
+describe('AdjustLoanChargeComponent', () => {
+  let component: AdjustLoanChargeComponent;
+  let fixture: ComponentFixture<AdjustLoanChargeComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ AdjustLoanChargeComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AdjustLoanChargeComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/loans/loans-view/loan-account-actions/adjust-loan-charge/adjust-loan-charge.component.ts

@@ -0,0 +1,116 @@
+import { Component, OnInit } from '@angular/core';
+import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
+import { ActivatedRoute, Router } from '@angular/router';
+import { LoansService } from 'app/loans/loans.service';
+import { OrganizationService } from 'app/organization/organization.service';
+import { SettingsService } from 'app/settings/settings.service';
+
+@Component({
+  selector: 'mifosx-adjust-loan-charge',
+  templateUrl: './adjust-loan-charge.component.html',
+  styleUrls: ['./adjust-loan-charge.component.scss']
+})
+export class AdjustLoanChargeComponent implements OnInit {
+  /** Loan Id */
+  loanId: string;
+  chargeId: string;
+
+  /** Payment Type Options */
+  paymentTypes: any = [];
+  chargeData: any = [];
+  loanDetailsData: any = [];
+
+  /** Show payment details */
+  showPaymentDetails = false;
+  /** Minimum Date allowed. */
+  minDate = new Date(2000, 0, 1);
+  /** Maximum Date allowed. */
+  maxDate = new Date();
+  /** Repayment Loan Form */
+  adjustLoanChargeForm: FormGroup;
+
+  /**
+   * @param {FormBuilder} formBuilder Form Builder.
+   * @param {LoansService} loanService Loan Service.
+   * @param {ActivatedRoute} route Activated Route.
+   * @param {Router} router Router for navigation.
+   * @param {SettingsService} settingsService Settings Service
+   */
+  constructor(private formBuilder: FormBuilder,
+    private loanService: LoansService,
+    private route: ActivatedRoute,
+    private router: Router,
+    private settingsService: SettingsService,
+    private organizationService: OrganizationService) {
+      this.loanId = this.route.snapshot.params['loanId'];
+      this.chargeId = this.route.snapshot.params['id'];
+      this.route.data.subscribe((data: { loansAccountCharge: any, loanDetailsData: any }) => {
+        this.chargeData = data.loansAccountCharge;
+        this.loanDetailsData = data.loanDetailsData;
+      });
+    }
+
+  /**
+   * Creates the repayment loan form
+   * and initialize with the required values
+   */
+  ngOnInit() {
+    this.maxDate = this.settingsService.maxAllowedDate;
+    this.createAdjustLoanChargeForm();
+    this.setRepaymentLoanDetails();
+  }
+
+  /**
+   * Creates the create close form.
+   */
+  createAdjustLoanChargeForm() {
+    this.adjustLoanChargeForm = this.formBuilder.group({
+      'amount': [this.chargeData.amount, Validators.required],
+      'externalId': '',
+      'paymentTypeId': '',
+      'note': ''
+    });
+  }
+
+  setRepaymentLoanDetails() {
+    this.organizationService.getPaymentTypes().subscribe((paymentTypes: any) => {
+      this.paymentTypes = paymentTypes;
+    });
+  }
+
+  /**
+   * Add payment detail fields to the UI.
+   */
+  addPaymentDetails() {
+    this.showPaymentDetails = !this.showPaymentDetails;
+    if (this.showPaymentDetails) {
+      this.adjustLoanChargeForm.addControl('accountNumber', new FormControl(''));
+      this.adjustLoanChargeForm.addControl('checkNumber', new FormControl(''));
+      this.adjustLoanChargeForm.addControl('routingCode', new FormControl(''));
+      this.adjustLoanChargeForm.addControl('receiptNumber', new FormControl(''));
+      this.adjustLoanChargeForm.addControl('bankNumber', new FormControl(''));
+    } else {
+      this.adjustLoanChargeForm.removeControl('accountNumber');
+      this.adjustLoanChargeForm.removeControl('checkNumber');
+      this.adjustLoanChargeForm.removeControl('routingCode');
+      this.adjustLoanChargeForm.removeControl('receiptNumber');
+      this.adjustLoanChargeForm.removeControl('bankNumber');
+    }
+  }
+
+  /** Submits the repayment form */
+  submit() {
+    const adjustLoanChargeFormData = this.adjustLoanChargeForm.value;
+    const locale = this.settingsService.language.code;
+    const data = {
+      ...adjustLoanChargeFormData,
+      locale
+    };
+    const command = 'adjustment';
+    this.loanService.executeLoansAccountChargesCommand(this.loanId, command, data, this.chargeId)
+      .subscribe((response: any) => {
+        this.router.navigate(['../..'], { relativeTo: this.route });
+    });
+  }
+
+}

src/app/loans/loans-view/loan-account-actions/approve-loan/approve-loan.component.ts

@@ -47,7 +47,7 @@ export class ApproveLoanComponent implements OnInit {
     this.route.data.subscribe((data: { actionButtonData: any }) => {
       this.loanData = data.actionButtonData;
     });
-    this.loanId = this.route.parent.snapshot.params['loanId'];
+    this.loanId = this.route.snapshot.params['loanId'];
   }
 
   ngOnInit() {

src/app/loans/loans-view/loan-account-actions/assign-loan-officer/assign-loan-officer.component.ts

@@ -38,7 +38,7 @@ export class AssignLoanOfficerComponent implements OnInit {
     private router: Router,
     private dateUtils: Dates,
     private settingsService: SettingsService) {
-      this.loanId = this.route.parent.snapshot.params['loanId'];
+      this.loanId = this.route.snapshot.params['loanId'];
     }
 
   /**

src/app/loans/loans-view/loan-account-actions/close-as-rescheduled/close-as-rescheduled.component.ts

@@ -38,7 +38,7 @@ export class CloseAsRescheduledComponent implements OnInit {
     private router: Router,
     private dateUtils: Dates,
     private settingsService: SettingsService) {
-      this.loanId = this.route.parent.snapshot.params['loanId'];
+      this.loanId = this.route.snapshot.params['loanId'];
     }
 
   /**

src/app/loans/loans-view/loan-account-actions/create-guarantor/create-guarantor.component.ts

@@ -51,7 +51,7 @@ export class CreateGuarantorComponent implements OnInit, AfterViewInit {
     private dateUtils: Dates,
     private clientsService: ClientsService,
     private settingsService: SettingsService) {
-    this.loanId = this.route.parent.snapshot.params['loanId'];
+    this.loanId = this.route.snapshot.params['loanId'];
   }
 
   ngOnInit() {

src/app/loans/loans-view/loan-account-actions/disburse-to-savings-account/disburse-to-savings-account.component.ts

@@ -72,7 +72,7 @@ export class DisburseToSavingsAccountComponent implements OnInit {
       dateFormat,
       locale
     };
-    const loanId = this.route.parent.snapshot.params['loanId'];
+    const loanId = this.route.snapshot.params['loanId'];
     this.loanService.loanActionButtons(loanId, 'disbursetosavings', data).subscribe((response: any) => {
       this.router.navigate(['../../general'], { relativeTo: this.route });
     });

src/app/loans/loans-view/loan-account-actions/disburse/disburse.component.ts

@@ -45,7 +45,7 @@ export class DisburseComponent implements OnInit {
     private router: Router,
     private dateUtils: Dates,
     private settingsService: SettingsService) {
-    this.loanId = this.route.parent.snapshot.params['loanId'];
+    this.loanId = this.route.snapshot.params['loanId'];
   }
 
 

src/app/loans/loans-view/loan-account-actions/edit-repayment-schedule/edit-repayment-schedule.component.ts

@@ -42,7 +42,7 @@ export class EditRepaymentScheduleComponent implements OnInit {
     private dialog: MatDialog,
     private dateUtils: Dates,
     private settingsService: SettingsService) {
-    this.loanId = this.route.parent.snapshot.params['loanId'];
+    this.loanId = this.route.snapshot.params['loanId'];
     this.getRepaymentSchedule();
   }
 

src/app/loans/loans-view/loan-account-actions/foreclosure/foreclosure.component.ts

@@ -36,7 +36,7 @@ export class ForeclosureComponent implements OnInit {
     private router: Router,
     private dateUtils: Dates,
     private settingsService: SettingsService) {
-      this.loanId = this.route.parent.snapshot.params['loanId'];
+      this.loanId = this.route.snapshot.params['loanId'];
     }
 
   ngOnInit() {

src/app/loans/loans-view/loan-account-actions/loan-credit-balance-refund/loan-credit-balance-refund.component.ts

@@ -35,7 +35,7 @@ export class LoanCreditBalanceRefundComponent implements OnInit {
     private router: Router,
     private dateUtils: Dates,
     private settingsService: SettingsService) {
-      this.loanId = this.route.parent.snapshot.params['loanId'];
+      this.loanId = this.route.snapshot.params['loanId'];
     }
 
   /**

src/app/loans/loans-view/loan-account-actions/loan-reschedule/loan-reschedule.component.ts

@@ -42,7 +42,7 @@ export class LoanRescheduleComponent implements OnInit {
     private router: Router,
     private dateUtils: Dates,
     private settingsService: SettingsService) {
-      this.loanId = this.route.parent.snapshot.params['loanId'];
+      this.loanId = this.route.snapshot.params['loanId'];
     }
 
   ngOnInit() {

src/app/loans/loans-view/loan-account-actions/loan-screen-reports/loan-screen-reports.component.ts

@@ -43,7 +43,7 @@ export class LoanScreenReportsComponent implements OnInit {
     private route: ActivatedRoute,
     private sanitizer: DomSanitizer,
     private renderer: Renderer2) {
-    this.loanId = this.route.parent.snapshot.params['loanId'];
+    this.loanId = this.route.snapshot.params['loanId'];
   }
 
   /**

src/app/loans/loans-view/loan-account-actions/loans-account-close/loans-account-close.component.ts

@@ -39,7 +39,7 @@ export class LoansAccountCloseComponent implements OnInit {
     private router: Router,
     private dateUtils: Dates,
     private settingsService: SettingsService) {
-      this.loanId = this.route.parent.snapshot.params['loanId'];
+      this.loanId = this.route.snapshot.params['loanId'];
     }
 
   /**

src/app/loans/loans-view/loan-account-actions/make-repayment/make-repayment.component.ts

@@ -45,7 +45,7 @@ export class MakeRepaymentComponent implements OnInit {
     private router: Router,
     private dateUtils: Dates,
     private settingsService: SettingsService) {
-      this.loanId = this.route.parent.snapshot.params['loanId'];
+      this.loanId = this.route.snapshot.params['loanId'];
     }
 
   /**
@@ -63,7 +63,7 @@ export class MakeRepaymentComponent implements OnInit {
    */
   createRepaymentLoanForm() {
     this.repaymentLoanForm = this.formBuilder.group({
-      'transactionDate': [new Date(), Validators.required],
+      'transactionDate': [this.settingsService.businessDate, Validators.required],
       'transactionAmount': ['', Validators.required],
       'externalId': '',
       'paymentTypeId': '',
@@ -83,7 +83,6 @@ export class MakeRepaymentComponent implements OnInit {
    */
   addPaymentDetails() {
     this.showPaymentDetails = !this.showPaymentDetails;
-    console.log(this.showPaymentDetails);
     if (this.showPaymentDetails) {
       this.repaymentLoanForm.addControl('accountNumber', new FormControl(''));
       this.repaymentLoanForm.addControl('checkNumber', new FormControl(''));

src/app/loans/loans-view/loan-account-actions/prepay-loan/prepay-loan.component.ts

@@ -52,7 +52,7 @@ export class PrepayLoanComponent implements OnInit {
     private router: Router,
     private dateUtils: Dates,
     private settingsService: SettingsService) {
-      this.loanId = this.route.parent.snapshot.params['loanId'];
+      this.loanId = this.route.snapshot.params['loanId'];
     }
 
   /**

src/app/loans/loans-view/loan-account-actions/recovery-repayment/recovery-repayment.component.ts

@@ -45,7 +45,7 @@ export class RecoveryRepaymentComponent implements OnInit {
     private router: Router,
     private dateUtils: Dates,
     private settingsService: SettingsService) {
-    this.loanId = this.route.parent.snapshot.params['loanId'];
+    this.loanId = this.route.snapshot.params['loanId'];
   }
 
   /**

src/app/loans/loans-view/loan-account-actions/reject-loan/reject-loan.component.ts

@@ -40,7 +40,7 @@ export class RejectLoanComponent implements OnInit {
               private loanService: LoansService,
               private dateUtils: Dates,
               private settingsService: SettingsService ) {
-    this.loanId = this.route.parent.snapshot.params['loanId'];
+    this.loanId = this.route.snapshot.params['loanId'];
   }
 
   ngOnInit() {

src/app/loans/loans-view/loan-account-actions/undo-approval/undo-approval.component.ts

@@ -36,7 +36,7 @@ export class UndoApprovalComponent implements OnInit {
    * Submits undo approval form.
    */
   submit() {
-    const loanId = this.route.parent.snapshot.params['loanId'];
+    const loanId = this.route.snapshot.params['loanId'];
     this.loanService.loanActionButtons(loanId, 'undoapproval', { 'note': this.note.value }).subscribe((response: any) => {
       this.router.navigate(['../../general'], {relativeTo: this.route});
     });

src/app/loans/loans-view/loan-account-actions/undo-disbursal/undo-disbursal.component.ts

@@ -33,7 +33,7 @@ export class UndoDisbursalComponent implements OnInit {
               private loansService: LoansService,
               private router: Router,
               private route: ActivatedRoute) {
-    this.loanId = this.route.parent.snapshot.params['loanId'];
+    this.loanId = this.route.snapshot.params['loanId'];
   }
 
   /**

src/app/loans/loans-view/loan-account-actions/view-guarantors/view-guarantors.component.ts

@@ -37,7 +37,7 @@ export class ViewGuarantorsComponent implements OnInit {
               public loansService: LoansService,
               private route: ActivatedRoute,
               private router: Router) {
-    this.loanId = this.route.parent.snapshot.params['loanId'];
+    this.loanId = this.route.snapshot.params['loanId'];
   }
 
   ngOnInit() {

src/app/loans/loans-view/loan-account-actions/waive-interest/waive-interest.component.ts

@@ -73,7 +73,7 @@ export class WaiveInterestComponent implements OnInit {
       dateFormat,
       locale
     };
-    const loanId = this.route.parent.snapshot.params['loanId'];
+    const loanId = this.route.snapshot.params['loanId'];
     this.loanService.submitLoanActionButton(loanId, data, 'waiveinterest').subscribe((response: any) => {
       this.router.navigate(['../../general'], {relativeTo: this.route});
     });

src/app/loans/loans-view/loan-account-actions/withdrawn-by-client/withdrawn-by-client.component.ts

@@ -41,7 +41,7 @@ export class WithdrawnByClientComponent implements OnInit {
     private router: Router,
     private dateUtils: Dates,
     private settingsService: SettingsService) {
-    this.loanId = this.route.parent.snapshot.params['loanId'];
+    this.loanId = this.route.snapshot.params['loanId'];
   }
 
   /**

src/app/loans/loans-view/loan-account-actions/write-off-page/write-off-page.component.ts

@@ -76,7 +76,7 @@ export class WriteOffPageComponent implements OnInit {
       dateFormat,
       locale
     };
-    const loanId = this.route.parent.snapshot.params['loanId'];
+    const loanId = this.route.snapshot.params['loanId'];
     delete data.amount;
     this.loanService.submitLoanActionButton(loanId, data, 'writeoff').subscribe((response: any) => {
       this.router.navigate(['../../general'], {relativeTo: this.route});

src/app/loans/loans-view/loan-documents-tab/loan-documents-tab.component.ts

@@ -30,7 +30,7 @@ export class LoanDocumentsTabComponent implements OnInit {
   constructor(private route: ActivatedRoute,
     private loansService: LoansService,
     private settingsService: SettingsService) {
-      this.entityId = this.route.parent.snapshot.params['loanId'];
+      this.entityId = this.route.snapshot.params['loanId'];
 
     this.route.data.subscribe((data: { loanDocuments: any }) => {
       this.getLoanDocumentsData(data.loanDocuments);

src/app/loans/loans-view/notes-tab/notes-tab.component.ts

@@ -23,7 +23,7 @@ export class NotesTabComponent implements OnInit {
     private authenticationService: AuthenticationService) {
     const savedCredentials = this.authenticationService.getCredentials();
     this.username = savedCredentials.username;
-    this.entityId = this.route.parent.snapshot.params['loanId'];
+    this.entityId = this.route.snapshot.params['loanId'];
     this.route.data.subscribe((data: { loanNotes: any }) => {
       this.entityNotes = data.loanNotes;
     });

src/app/loans/loans-view/transactions-tab/transactions-tab.component.ts

@@ -91,9 +91,10 @@ export class TransactionsTabComponent implements OnInit {
    * MERCHANT_ISSUED_REFUND:21
    * PAYOUT_REFUND:22
    * GOODWILL_CREDIT:23
+   * CHARGE_ADJUSTMENT:26
    */
   showTransactions(transactionsData: any) {
-    if ([1, 2, 4, 9, 20, 21, 22, 23].includes(transactionsData.type.id)) {
+    if ([1, 2, 4, 9, 20, 21, 22, 23, 26].includes(transactionsData.type.id)) {
       this.router.navigate([transactionsData.id], { relativeTo: this.route });
     }
   }

src/app/loans/loans-view/transactions/edit-transaction/edit-transaction.component.html

@@ -39,11 +39,14 @@
           </mat-select>
         </mat-form-field>
 
-        <div fxLayoutGap="5px" fxLayout="row" fxLayout.xs="column">
+        <div fxFlexFill>
-          <mat-label fxFlexAlign="center">Show Payment Details</mat-label>
+          <span fxFlex="75%" class="expandcollapsebutton m-l-10 m-t-40" (click)="addPaymentDetails()">
-          <button type="button" mat-mini-fab color="primary" (click)="addPaymentDetails()">
+            <mat-slide-toggle>
-            <fa-icon [icon]="!addPaymentDetailsFlag ? 'plus-circle' : 'minus-circle'" size="lg"></fa-icon>
+              <div [className]="showPaymentDetails ? 'enabled' : 'disabled'">
-          </button>
+                <span class="m-l-10">Show Payment Details</span>
+              </div>
+            </mat-slide-toggle>
+          </span>
         </div>
 
         <mat-form-field *ngIf="editTransactionForm.controls['accountNumber']">

src/app/loans/loans-view/transactions/edit-transaction/edit-transaction.component.ts

@@ -33,7 +33,7 @@ export class EditTransactionComponent implements OnInit {
     position: number
   }[];
   /** Flag to enable payment details fields. */
-  addPaymentDetailsFlag: Boolean = false;
+  showPaymentDetails: Boolean = false;
   /** loan account's Id */
   loanAccountId: string;
   /** Transaction Template */
@@ -58,7 +58,7 @@ export class EditTransactionComponent implements OnInit {
       this.transactionTemplateData = data.loansAccountTransactionTemplate;
       this.paymentTypeOptions = this.transactionTemplateData.paymentTypeOptions;
     });
-    this.loanAccountId = this.route.parent.parent.parent.snapshot.params['loanId'];
+    this.loanAccountId = this.route.snapshot.params['loanId'];
   }
 
   /**
@@ -91,8 +91,8 @@ export class EditTransactionComponent implements OnInit {
    * Method to add payment detail fields to the UI.
    */
   addPaymentDetails() {
-    this.addPaymentDetailsFlag = !this.addPaymentDetailsFlag;
+    this.showPaymentDetails = !this.showPaymentDetails;
-    if (this.addPaymentDetailsFlag) {
+    if (this.showPaymentDetails) {
       this.editTransactionForm.addControl('accountNumber', new FormControl(''));
       this.editTransactionForm.addControl('checkNumber', new FormControl(''));
       this.editTransactionForm.addControl('routingCode', new FormControl(''));

src/app/loans/loans-view/transactions/view-transaction/view-transaction.component.ts

@@ -119,7 +119,7 @@ export class ViewTransactionComponent implements OnInit {
    * Undo the loans transaction
    */
   undoTransaction() {
-    const accountId = this.route.parent.parent.parent.snapshot.params['loanId'];
+    const accountId = this.route.snapshot.params['loanId'];
     const undoTransactionAccountDialogRef = this.dialog.open(ConfirmationDialogComponent, {
       data: { heading: 'Undo Transaction', dialogContext: `Are you sure you want undo the transaction ${this.transactionData.id}` }
     });
@@ -141,7 +141,7 @@ export class ViewTransactionComponent implements OnInit {
   }
 
   chargebackTransaction() {
-    const accountId = this.route.parent.parent.parent.snapshot.params['loanId'];
+    const accountId = this.route.snapshot.params['loanId'];
     const formfields: FormfieldBase[] = [
       new SelectBase({
         controlName: 'paymentTypeId',

src/app/loans/loans-view/view-charge/view-charge.component.html

@@ -11,11 +11,19 @@
     </button>
   </span>
   <span *ngIf="allowWaive">
-    <button mat-raised-button color="primary" *mifosxHasPermission="'WAIVE_SAVINGSACCOUNTCHARGE'" (click)="waiveCharge()">
+    <button mat-raised-button color="primary" *mifosxHasPermission="'WAIVE_SAVINGSACCOUNTCHARGE'"
+      (click)="waiveCharge()">
       <fa-icon icon="flag" class="m-r-10"></fa-icon>
       Waive
     </button>
   </span>
+  <span>
+    <button mat-raised-button color="accent" *mifosxHasPermission="'ADJUSTMENT_LOANCHARGE'"
+      (click)="adjustmentCharge()">
+      <fa-icon icon="pen" class="m-r-10"></fa-icon>
+      Adjustment
+    </button>
+  </span>
 </div>
 
 <div *ngIf="loansAccountData.status.value === 'Submitted and pending approval'" fxLayout="row" fxLayoutAlign="end"

src/app/loans/loans-view/view-charge/view-charge.component.ts

@@ -178,6 +178,10 @@ export class ViewChargeComponent {
     return this.chargeData.paid ? 'paid' : 'not-paid';
   }
 
+  adjustmentCharge(): void {
+    this.router.navigate(['adjustment'], { relativeTo: this.route});
+  }
+
   /**
    * Refetches data fot the component
    * TODO: Replace by a custom reload component instead of hard-coded back-routing.

src/app/loans/loans.module.ts

@@ -73,6 +73,7 @@ import { EditRepaymentScheduleComponent } from './loans-view/loan-account-action
 import { DisburseToSavingsAccountComponent } from './loans-view/loan-account-actions/disburse-to-savings-account/disburse-to-savings-account.component';
 import { LoansAccountDatatableStepComponent } from './loans-account-stepper/loans-account-datatable-step/loans-account-datatable-step.component';
 import { RescheduleLoanTabComponent } from './loans-view/reschedule-loan-tab/reschedule-loan-tab.component';
+import { AdjustLoanChargeComponent } from './loans-view/loan-account-actions/adjust-loan-charge/adjust-loan-charge.component';
 
 /**
  * Loans Module
@@ -144,7 +145,8 @@ import { RescheduleLoanTabComponent } from './loans-view/reschedule-loan-tab/res
     EditRepaymentScheduleComponent,
     DisburseToSavingsAccountComponent,
     LoansAccountDatatableStepComponent,
-    RescheduleLoanTabComponent
+    RescheduleLoanTabComponent,
+    AdjustLoanChargeComponent
   ],
   providers: [ ],
 })

src/app/products/products-routing.module.ts

@@ -215,7 +215,7 @@ const routes: Routes = [
               component: CreateSavingProductComponent,
               data: { title: extract('Create Saving Product'), breadcrumb: 'Create' },
               resolve: {
-                savingProductDatatables: SavingProductDatatablesResolver
+                savingProductsTemplate: SavingProductsTemplateResolver
               }
             },
             {

src/app/savings/saving-account-actions/activate-savings-account/activate-savings-account.component.ts

@@ -41,7 +41,7 @@ export class ActivateSavingsAccountComponent implements OnInit {
               private route: ActivatedRoute,
               private router: Router,
               private settingsService: SettingsService) {
-    this.accountId = this.route.parent.snapshot.params['savingAccountId'];
+    this.accountId = this.route.snapshot.params['savingAccountId'];
   }
 
   /**

src/app/savings/saving-account-actions/add-charge-savings-account/add-charge-savings-account.component.ts

@@ -49,7 +49,7 @@ export class AddChargeSavingsAccountComponent implements OnInit {
     this.route.data.subscribe((data: { savingsAccountActionData: any }) => {
       this.savingsChargeOptions = data.savingsAccountActionData.chargeOptions;
     });
-    this.savingAccountId = this.route.parent.snapshot.params['savingAccountId'];
+    this.savingAccountId = this.route.snapshot.params['savingAccountId'];
   }
 
   /**

src/app/savings/saving-account-actions/apply-annual-fees-savings-account/apply-annual-fees-savings-account.component.ts

@@ -45,7 +45,7 @@ export class ApplyAnnualFeesSavingsAccountComponent implements OnInit {
               private route: ActivatedRoute,
               private router: Router,
               private settingsService: SettingsService) {
-    this.accountId = this.route.parent.snapshot.params['savingAccountId'];
+    this.accountId = this.route.snapshot.params['savingAccountId'];
     this.route.data.subscribe((data: { savingsAccountActionData: any }) => {
       this.savingsAccountData = data.savingsAccountActionData;
     });

src/app/savings/saving-account-actions/approve-savings-account/approve-savings-account.component.ts

@@ -41,7 +41,7 @@ export class ApproveSavingsAccountComponent implements OnInit {
               private route: ActivatedRoute,
               private router: Router,
               private settingsService: SettingsService) {
-    this.accountId = this.route.parent.snapshot.params['savingAccountId'];
+    this.accountId = this.route.snapshot.params['savingAccountId'];
   }
 
   /**

src/app/savings/saving-account-actions/close-savings-account/close-savings-account.component.ts

@@ -51,7 +51,7 @@ export class CloseSavingsAccountComponent implements OnInit {
       this.paymentTypeOptions = data.savingsAccountActionData[0].paymentTypeOptions;
       this.transactionAmount = data.savingsAccountActionData[1].summary.accountBalance;
     });
-    this.accountId = this.route.parent.snapshot.params['savingAccountId'];
+    this.accountId = this.route.snapshot.params['savingAccountId'];
   }
 
   /**

src/app/savings/saving-account-actions/manage-savings-account/manage-savings-account.component.ts

@@ -49,7 +49,7 @@ export class ManageSavingsAccountComponent implements OnInit {
     private settingsService: SettingsService) {
     this.transactionCommand = this.route.snapshot.params['name'].toLowerCase().replaceAll(' ', '');
     this.transactionType[this.transactionCommand] = true;
-    this.savingAccountId = this.route.parent.snapshot.params['savingAccountId'];
+    this.savingAccountId = this.route.snapshot.params['savingAccountId'];
   }
 
   /**

src/app/savings/saving-account-actions/post-interest-as-on-savings-account/post-interest-as-on-savings-account.component.ts

@@ -41,7 +41,7 @@ export class PostInterestAsOnSavingsAccountComponent implements OnInit {
               private route: ActivatedRoute,
               private router: Router,
               private settingsService: SettingsService) {
-    this.accountId = this.route.parent.snapshot.params['savingAccountId'];
+    this.accountId = this.route.snapshot.params['savingAccountId'];
   }
 
   /**

src/app/savings/saving-account-actions/reject-savings-account/reject-savings-account.component.ts

@@ -41,7 +41,7 @@ export class RejectSavingsAccountComponent implements OnInit {
               private route: ActivatedRoute,
               private router: Router,
               private settingsService: SettingsService) {
-    this.accountId = this.route.parent.snapshot.params['savingAccountId'];
+    this.accountId = this.route.snapshot.params['savingAccountId'];
   }
 
   /**

src/app/savings/saving-account-actions/saving-account-actions.component.html

@@ -7,7 +7,7 @@
 <mifosx-savings-account-unassign-staff *ngIf="actions['Unassign Staff']"></mifosx-savings-account-unassign-staff>
 <mifosx-withdraw-by-client-savings-account *ngIf="actions['Withdraw By Client']"></mifosx-withdraw-by-client-savings-account>
 <mifosx-add-charge-savings-account *ngIf="actions['Add Charge']"></mifosx-add-charge-savings-account>
-<mifosx-savings-transactions *ngIf="actions['Withdrawal'] || actions['Deposit']"></mifosx-savings-transactions>
+<mifosx-savings-transactions [currencyCode]="currencyCode" *ngIf="actions['Withdrawal'] || actions['Deposit']"></mifosx-savings-transactions>
 <mifosx-close-savings-account *ngIf="actions['Close']"></mifosx-close-savings-account>
 <mifosx-apply-annual-fees-savings-account *ngIf="actions['Apply Annual Fees']"></mifosx-apply-annual-fees-savings-account>
 <mifosx-manage-savings-account *ngIf="actions['Hold Amount'] || actions['Block Account']"></mifosx-manage-savings-account>

src/app/savings/saving-account-actions/saving-account-actions.component.ts

@@ -49,10 +49,15 @@ export class SavingAccountActionsComponent {
     'Unblock Account': false
   };
 
+  currencyCode: string;
+
   /**
    * @param {ActivatedRoute} route Activated Route
    */
   constructor(private route: ActivatedRoute) {
+    this.route.data.subscribe((data: { savingsAccountActionData: any }) => {
+      this.currencyCode = data.savingsAccountActionData.currency.code;
+    });
     const name = this.route.snapshot.params['name'];
     this.actions[name] = true;
   }

src/app/savings/saving-account-actions/savings-account-assign-staff/savings-account-assign-staff.component.ts

@@ -45,7 +45,7 @@ export class SavingsAccountAssignStaffComponent implements OnInit {
               private route: ActivatedRoute,
               private router: Router,
               private settingsService: SettingsService) {
-    this.accountId = this.route.parent.snapshot.params['savingAccountId'];
+    this.accountId = this.route.snapshot.params['savingAccountId'];
     this.route.data.subscribe((data: { savingsAccountActionData: any }) => {
       this.savingsAccountData = data.savingsAccountActionData;
     });

src/app/savings/saving-account-actions/savings-account-transactions/savings-account-transactions.component.html

@@ -20,9 +20,11 @@
           </mat-error>
         </mat-form-field>
 
-        <mat-form-field>
+        <mat-form-field appearance="fill">
           <mat-label>Transaction Amount</mat-label>
-          <input type="number" formControlName="transactionAmount" required matInput />
+          <span matTextSuffix class="m-l-10">{{ currencyCode }}</span>
+          <span fxFlex="auto"></span>
+          <input type="number" class="right-input" formControlName="transactionAmount" required matInput />
           <mat-error *ngIf="savingAccountTransactionForm.controls.transactionAmount.hasError('required')">
             Transaction Amount is <strong>required</strong>
           </mat-error>
@@ -30,7 +32,7 @@
 
         <mat-form-field>
           <mat-label>Payment Type</mat-label>
-          <mat-select formControlName="paymentTypeId">
+          <mat-select required formControlName="paymentTypeId">
             <mat-option *ngFor="let paymentType of paymentTypeOptions" [value]="paymentType.id">
               {{ paymentType.name }}
             </mat-option>

src/app/savings/saving-account-actions/savings-account-transactions/savings-account-transactions.component.scss

@@ -1,3 +1,15 @@
+.expandcollapsebutton {
+  margin-top: -7px;
+}
+
 .container {
-  width: 37rem;
+  max-width: 37rem;
+}
+
+.right-input {
+text-align: right;
+}
+
+.right-label {
+padding-right: 25px !important;
 }

src/app/savings/saving-account-actions/savings-account-transactions/savings-account-transactions.component.ts

@@ -1,5 +1,5 @@
 /** Angular Imports */
-import { Component, OnInit } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators, FormControl } from '@angular/forms';
 import { Router, ActivatedRoute } from '@angular/router';
 
@@ -18,6 +18,8 @@ import { Dates } from 'app/core/utils/dates';
 })
 export class SavingsAccountTransactionsComponent implements OnInit {
 
+  @Input() currencyCode: string;
+
   /** Minimum Due Date allowed. */
   minDate = new Date(2000, 0, 1);
   /** Maximum Due Date allowed. */
@@ -61,7 +63,7 @@ export class SavingsAccountTransactionsComponent implements OnInit {
     });
     this.transactionCommand = this.route.snapshot.params['name'].toLowerCase();
     this.transactionType[this.transactionCommand] = true;
-    this.savingAccountId = this.route.parent.snapshot.params['savingAccountId'];
+    this.savingAccountId = this.route.snapshot.params['savingAccountId'];
   }
 
   /**
@@ -77,8 +79,8 @@ export class SavingsAccountTransactionsComponent implements OnInit {
    */
   createSavingAccountTransactionForm() {
     this.savingAccountTransactionForm = this.formBuilder.group({
-      'transactionDate': ['', Validators.required],
+      'transactionDate': [this.settingsService.businessDate, Validators.required],
-      'transactionAmount': ['', Validators.required],
+      'transactionAmount': [0, Validators.required],
       'paymentTypeId': [''],
       'note': ['']
     });
@@ -89,7 +91,6 @@ export class SavingsAccountTransactionsComponent implements OnInit {
    */
   addPaymentDetails() {
     this.addPaymentDetailsFlag = !this.addPaymentDetailsFlag;
-    /*
     if (this.addPaymentDetailsFlag) {
       this.savingAccountTransactionForm.addControl('accountNumber', new FormControl(''));
       this.savingAccountTransactionForm.addControl('checkNumber', new FormControl(''));
@@ -103,8 +104,6 @@ export class SavingsAccountTransactionsComponent implements OnInit {
       this.savingAccountTransactionForm.removeControl('receiptNumber');
       this.savingAccountTransactionForm.removeControl('bankNumber');
     }
-
-    */
   }
 
   /**

src/app/savings/saving-account-actions/savings-account-unassign-staff/savings-account-unassign-staff.component.ts

@@ -41,7 +41,7 @@ export class SavingsAccountUnassignStaffComponent implements OnInit {
               private route: ActivatedRoute,
               private router: Router,
               private settingsService: SettingsService) {
-    this.accountId = this.route.parent.snapshot.params['savingAccountId'];
+    this.accountId = this.route.snapshot.params['savingAccountId'];
   }
 
   /**

src/app/savings/saving-account-actions/undo-approval-savings-account/undo-approval-savings-account.component.ts

@@ -31,7 +31,7 @@ export class UndoApprovalSavingsAccountComponent implements OnInit {
               private savingsService: SavingsService,
               private route: ActivatedRoute,
               private router: Router) {
-    this.accountId = this.route.parent.snapshot.params['savingAccountId'];
+    this.accountId = this.route.snapshot.params['savingAccountId'];
   }
 
   /**

src/app/savings/saving-account-actions/withdraw-by-client-savings-account/withdraw-by-client-savings-account.component.ts

@@ -41,7 +41,7 @@ export class WithdrawByClientSavingsAccountComponent implements OnInit {
               private route: ActivatedRoute,
               private router: Router,
               private settingsService: SettingsService) {
-    this.accountId = this.route.parent.snapshot.params['savingAccountId'];
+    this.accountId = this.route.snapshot.params['savingAccountId'];
   }
 
   /**

src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.html

@@ -38,11 +38,6 @@
     <span fxFlex="60%">{{ savingsAccountTermsForm.get('decimal').value }}</span>
   </div>
 
-  <div fxFlexFill>
-    <span fxFlex="40%">Currency in multiples of</span>
-    <span fxFlex="60%">{{ savingsAccountTermsForm.get('currencyMultiple').value }}</span>
-  </div>
-
   <div fxFlexFill>
     <span fxFlex="40%">Nominal Annual Interest Rate:</span>
     <span fxFlex="60%">{{ savingsAccount.nominalAnnualInterestRate }}</span>

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

@@ -12,11 +12,6 @@
       <input type="number" matInput formControlName="decimal">
     </mat-form-field>
 
-    <mat-form-field fxFlex="48%">
-      <mat-label>Currency in multiples of</mat-label>
-      <input type="number" matInput formControlName="currencyMultiple" >
-    </mat-form-field>
-
     <mat-form-field fxFlex="48%">
       <mat-label>Nominal Annual Interest Rate</mat-label>
       <input type="number" matInput formControlName="nominalAnnualInterestRate" required>

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

@@ -50,7 +50,6 @@ export class SavingsAccountTermsStepComponent implements OnChanges, OnInit {
       this.savingsAccountTermsForm.patchValue({
         'currencyCode': this.savingsAccountProductTemplate.currency.code,
         'decimal': this.savingsAccountProductTemplate.currency.decimalPlaces,
-        'currencyMultiple': this.savingsAccountProductTemplate.currency.inMultiplesOf,
         'minBalanceForInterestCalculation': this.savingsAccountProductTemplate.minBalanceForInterestCalculation,
         'nominalAnnualInterestRate': this.savingsAccountProductTemplate.nominalAnnualInterestRate,
         'interestCompoundingPeriodType': this.savingsAccountProductTemplate.interestCompoundingPeriodType.id,
@@ -99,7 +98,6 @@ export class SavingsAccountTermsStepComponent implements OnChanges, OnInit {
       'decimal': [{value: '',  disabled: true}],
       'nominalAnnualInterestRate': ['', Validators.required],
       'interestCompoundingPeriodType': ['', Validators.required],
-      'currencyMultiple': [{value: '', disabled: true}],
       'interestPostingPeriodType': ['', Validators.required],
       'interestCalculationType': ['', Validators.required],
       'interestCalculationDaysInYearType': ['', Validators.required],
@@ -146,7 +144,10 @@ export class SavingsAccountTermsStepComponent implements OnChanges, OnInit {
    * Returns savings account terms form value.
    */
   get savingsAccountTerms() {
-    return this.savingsAccountTermsForm.getRawValue();
+    const payload = this.savingsAccountTermsForm.getRawValue();
+    delete payload.currencyCode;
+    delete payload.decimal;
+    return payload;
   }
 
 }

src/app/savings/savings-account-view/charges-tab/charges-tab.component.ts

@@ -135,7 +135,7 @@ export class ChargesTabComponent implements OnInit {
           dateFormat,
           locale
         };
-        this.savingsService.executeSavingsAccountChargesCommand(this.savingsAccountData.id, 'pay', dataObject, chargeId)
+        this.savingsService.executeSavingsAccountChargesCommand(this.savingsAccountData.id, 'paycharge', dataObject, chargeId)
           .subscribe(() => {
             this.reload();
           });

src/app/savings/savings-account-view/notes-tab/notes-tab.component.ts

@@ -19,7 +19,7 @@ export class NotesTabComponent implements OnInit {
     private authenticationService: AuthenticationService) {
     const savedCredentials = this.authenticationService.getCredentials();
     this.username = savedCredentials.username;
-    this.entityId = this.route.parent.snapshot.params['savingAccountId'];
+    this.entityId = this.route.snapshot.params['savingAccountId'];
     this.route.data.subscribe((data: { savingAccountNotes: any }) => {
       this.entityNotes = data.savingAccountNotes;
     });

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

@@ -75,7 +75,7 @@
     <div class="savings-account-tables" fxLayout="row" fxLayoutGap="2%">
 
       <div fxFlex="49%"
-        *ngIf="!savingsAccountData.status.rejected && !savingsAccountData.status.submittedAndPendingApproval; else alternateSummary">
+        *ngIf="isActive; else alternateSummary">
         <h4 class="table-headers">Account Summary</h4>
         <table>
           <tbody>
@@ -301,7 +301,7 @@
 
     </div>
 
-    <nav mat-tab-nav-bar class="navigation-tabs">
+    <nav mat-tab-nav-bar class="navigation-tabs" *ngIf="isActive">
       <a mat-tab-link [routerLink]="['./transactions']" routerLinkActive #transactions="routerLinkActive"
         [active]="transactions.isActive">
         Transactions

src/app/savings/savings-account-view/savings-account-view.component.ts

@@ -33,6 +33,8 @@ export class SavingsAccountViewComponent implements OnInit {
   /** Entity Type */
   entityType: string;
 
+  isActive = false;
+
   /**
    * Fetches savings account data from `resolve`
    * @param {ActivatedRoute} route Activated Route
@@ -65,6 +67,7 @@ export class SavingsAccountViewComponent implements OnInit {
    */
   setConditionalButtons() {
     const status = this.savingsAccountData.status.value;
+    this.isActive = (status === 'Active');
     const subStatus = this.savingsAccountData.subStatus;
     this.buttonConfig = new SavingsButtonsConfiguration(status, subStatus);
     if (this.savingsAccountData.clientId) {

src/app/savings/savings-account-view/savings-documents-tab/savings-documents-tab.component.ts

@@ -30,7 +30,7 @@ export class SavingsDocumentsTabComponent implements OnInit {
     this.route.data.subscribe((data: { savingsDocuments: any }) => {
       this.setSavingsDocumentsData(data.savingsDocuments);
     });
-    this.entityId = this.route.parent.snapshot.params['savingAccountId'];
+    this.entityId = this.route.snapshot.params['savingAccountId'];
   }
 
   ngOnInit() {

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

@@ -1,16 +1,16 @@
 <div class="tab-container mat-typography">
 
-  <div fxLayout="row" fxLayoutAlign="start">
+  <div class="mat-elevation-z1 m-b-25" [hidden]="!accountWithTransactions">
-    <div class="m-b-10">
-      <h3>All Transactions</h3>
-    </div>
-    <div class="action-button m-b-20" fxLayout="row" fxLayoutGap="20px" *ngIf="checkStatus()">
-      <button mat-raised-button color="primary" [routerLink]="['/accounting', 'journal-entries']">View Journal Entries</button>
-      <button mat-raised-button color="primary" [routerLink]="['export']">Export</button>
-    </div>
-  </div>
 
-  <div class="mat-elevation-z1 m-b-25">
+    <div fxLayout="row" fxLayoutAlign="start">
+      <div class="m-b-10">
+        <h3>All Transactions</h3>
+      </div>
+      <div class="action-button m-b-20" fxLayout="row" fxLayoutGap="20px" *ngIf="checkStatus()">
+        <button mat-raised-button color="primary" [routerLink]="['/accounting', 'journal-entries']">View Journal Entries</button>
+        <button mat-raised-button color="primary" [routerLink]="['export']">Export</button>
+      </div>
+    </div>
 
     <table mat-table [dataSource]="dataSource" matSort>
 
@@ -62,4 +62,10 @@
 
   </div>
 
+  <div class="alert" [hidden]="accountWithTransactions">
+    <div class="message">
+      <i class="fa fa-exclamation-circle alert-check"></i>
+      No transaction was found
+    </div>
+  </div>
 </div>

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

@@ -20,12 +20,14 @@ export class TransactionsTabComponent implements OnInit {
   /** Transactions Data */
   transactionsData: any;
   /** Columns to be displayed in transactions table. */
-  displayedColumns: string[] = ['id', 'transactionDate', 'transactionType', 'debit', 'credit', 'balance', 'viewReciept'];
+  displayedColumns: string[] = ['id', 'date', 'transactionType', 'debit', 'credit', 'balance', 'viewReciept'];
   /** Data source for transactions table. */
   dataSource: MatTableDataSource<any>;
   @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
   @ViewChild(MatSort, { static: true }) sort: MatSort;
 
+  accountWithTransactions = false;
+
   /**
    * Retrieves savings account data from `resolve`.
    * @param {ActivatedRoute} route Activated Route.
@@ -40,6 +42,7 @@ export class TransactionsTabComponent implements OnInit {
 
   ngOnInit() {
     this.dataSource = new MatTableDataSource(this.transactionsData);
+    this.accountWithTransactions = (this.transactionsData.length > 0);
     this.dataSource.paginator = this.paginator;
     this.dataSource.sort = this.sort;
   }

src/app/savings/savings-account-view/transactions/edit-transaction/edit-transaction.component.html

@@ -34,11 +34,14 @@
           </mat-select>
         </mat-form-field>
 
-        <div fxLayoutGap="5px" fxLayout="row" fxLayout.xs="column">
+        <div fxFlexFill>
-          <mat-label fxFlexAlign="center">Show Payment Details</mat-label>
+          <span fxFlex="75%" class="expandcollapsebutton m-l-10 m-t-40" (click)="addPaymentDetails()">
-          <button type="button" mat-mini-fab color="primary" (click)="addPaymentDetails()">
+            <mat-slide-toggle>
-            <fa-icon [icon]="!addPaymentDetailsFlag ? 'plus-circle' : 'minus-circle'" size="lg"></fa-icon>
+              <div [className]="showPaymentDetails ? 'enabled' : 'disabled'">
-          </button>
+                <span class="m-l-10">Show Payment Details</span>
+              </div>
+            </mat-slide-toggle>
+          </span>
         </div>
 
         <mat-form-field *ngIf="editTransactionForm.controls['accountNumber']">
@@ -72,10 +75,9 @@
         </mat-card-actions>
 
       </mat-card-content>
-      
+
     </form>
 
   </mat-card>
 
 </div>
-  

src/app/savings/savings-account-view/transactions/edit-transaction/edit-transaction.component.ts

@@ -33,7 +33,7 @@ export class EditTransactionComponent implements OnInit {
     position: number
   }[];
   /** Flag to enable payment details fields. */
-  addPaymentDetailsFlag: Boolean = false;
+  showPaymentDetails: Boolean = false;
   /** saving account's Id */
   savingAccountId: string;
   /** Transaction Template */
@@ -58,7 +58,7 @@ export class EditTransactionComponent implements OnInit {
       this.transactionTemplateData = data.savingsAccountTransactionTemplate;
       this.paymentTypeOptions = this.transactionTemplateData.paymentTypeOptions;
     });
-    this.savingAccountId = this.route.parent.snapshot.params['savingAccountId'];
+    this.savingAccountId = this.route.snapshot.params['savingAccountId'];
   }
 
   /**
@@ -89,8 +89,8 @@ export class EditTransactionComponent implements OnInit {
    * Method to add payment detail fields to the UI.
    */
   addPaymentDetails() {
-    this.addPaymentDetailsFlag = !this.addPaymentDetailsFlag;
+    this.showPaymentDetails = !this.showPaymentDetails;
-    if (this.addPaymentDetailsFlag) {
+    if (this.showPaymentDetails) {
       this.editTransactionForm.addControl('accountNumber', new FormControl(''));
       this.editTransactionForm.addControl('checkNumber', new FormControl(''));
       this.editTransactionForm.addControl('routingCode', new FormControl(''));

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

@@ -50,14 +50,6 @@
           {{ transactionData.date | dateFormat }}
         </div>
 
-        <div fxFlex="50%" class="mat-body-strong">
-          Amount
-        </div>
-
-        <div fxFlex="50%">
-          {{ transactionData.currency.displaySymbol }} {{ transactionData.amount | number }} ({{ transactionData.currency.code }})
-        </div>
-
         <div fxFlex="50%" class="mat-body-strong">
           Currency
         </div>
@@ -66,6 +58,14 @@
           {{ transactionData.currency.name }}
         </div>
 
+        <div fxFlex="50%" class="mat-body-strong">
+          Amount
+        </div>
+
+        <div fxFlex="50%">
+          {{ transactionData.amount | currency }} {{ transactionData.currency.code }}
+        </div>
+
         <div fxFlex="50%" class="mat-body-strong">
           Note
         </div>

src/app/savings/savings-account-view/transactions/view-transaction/view-transaction.component.ts

@@ -44,7 +44,7 @@ export class ViewTransactionComponent {
               public dialog: MatDialog,
               private settingsService: SettingsService) {
     this.route.data.subscribe((data: { savingsAccountTransaction: any }) => {
-      this.accountId = this.route.parent.snapshot.params['savingAccountId'];
+      this.accountId = this.route.snapshot.params['savingAccountId'];
       this.transactionData = data.savingsAccountTransaction;
     });
   }

src/app/savings/savings-account-view/view-charge/view-charge.component.html

@@ -91,7 +91,7 @@
         </div>
 
         <div fxFlex="50%">
-          {{ chargeData.amount }}
+          {{ chargeData.amount | number }}
         </div>
 
         <div fxFlex="50%" class="mat-body-strong">
@@ -99,7 +99,7 @@
         </div>
 
         <div fxFlex="50%">
-          {{ chargeData.amountPaid }}
+          {{ chargeData.amountPaid | number }}
         </div>
 
         <div fxFlex="50%" class="mat-body-strong">
@@ -107,7 +107,7 @@
         </div>
 
         <div fxFlex="50%">
-          {{ chargeData.amountWaived }}
+          {{ chargeData.amountWaived | number }}
         </div>
 
         <div fxFlex="50%" class="mat-body-strong">
@@ -115,11 +115,14 @@
         </div>
 
         <div fxFlex="50%">
-          {{ chargeData.amountOutstanding }}
+          {{ chargeData.amountOutstanding | number }}
         </div>
 
       </div>
 
+      <div fxLayout="row" fxLayoutAlign="center" fxLayoutGap="2%" fxLayout.lt-md="column">
+        <button type="button" mat-raised-button color="primary" [routerLink]="['../']">{{ 'Back' | translate }}</button>
+      </div>
     </mat-card-content>
 
   </mat-card>

src/app/savings/savings-routing.module.ts

@@ -59,82 +59,16 @@ const routes: Routes = [
       {
         path: ':savingAccountId',
         data: { title: extract('Saving Account View'), routeParamBreadcrumb: 'savingAccountId' },
+        component: SavingsAccountViewComponent,
+        resolve: {
+          savingsAccountData: SavingsAccountViewResolver,
+          savingsDatatables: SavingsDatatablesResolver
+        },
         children: [
           {
             path: '',
-            component: SavingsAccountViewComponent,
+            redirectTo: 'transactions',
-            resolve: {
+            pathMatch: 'full'
-              savingsAccountData: SavingsAccountViewResolver,
-              savingsDatatables: SavingsDatatablesResolver
-            },
-            children: [
-              {
-                path: '',
-                redirectTo: 'transactions',
-                pathMatch: 'full'
-              },
-              {
-                path: 'transactions',
-                data: { title: extract('Savings Account Transactions'), breadcrumb: 'Transactions', routeParamBreadcrumb: false },
-                children: [
-                  {
-                    path: '',
-                    component: TransactionsTabComponent
-                  },
-                  {
-                    path: 'export',
-                    component: ExportTransactionsComponent
-                  }
-                ]
-              },
-              {
-                path: 'charges',
-                component: ChargesTabComponent,
-                data: { title: extract('Savings Account Charges'), breadcrumb: 'Charges', routeParamBreadcrumb: false }
-              },
-              {
-                path: 'standing-instructions',
-                component: StandingInstructionsTabComponent,
-                data: { title: extract('Savings Account SIH'), breadcrumb: 'Standing Instructions', routeParamBreadcrumb: false }
-              },
-              {
-                path: 'notes',
-                component: NotesTabComponent,
-                data: { title: extract('Savings Account Notes'), breadcrumb: 'Notes', routeParamBreadcrumb: false },
-                resolve: {
-                  savingAccountNotes: SavingNotesResolver
-                }
-              },
-              {
-                path: 'documents',
-                component: SavingsDocumentsTabComponent,
-                data: { title: extract('Savings Account Documents'), breadcrumb: 'Documents', routeParamBreadcrumb: false },
-                resolve: {
-                  savingsDocuments: SavingDocumentsResolver
-                }
-              },
-              {
-                path: 'datatables',
-                children: [
-                  {
-                    path: ':datatableName',
-                    component: DatatableTabsComponent,
-                    data: { title: extract('View Data Table'), routeParamBreadcrumb: 'datatableName' },
-                    resolve: {
-                      savingsDatatable: SavingsDatatableResolver
-                    }
-                  }
-                ]
-              }
-            ]
-          },
-          {
-            path: 'edit',
-            data: { title: extract('Edit Savings Account'), breadcrumb: 'Edit', routeParamBreadcrumb: false },
-            component: EditSavingsAccountComponent,
-            resolve: {
-              savingsAccountAndTemplate: SavingsAccountAndTemplateResolver
-            }
           },
           {
             path: 'transactions',
@@ -142,102 +76,129 @@ const routes: Routes = [
             children: [
               {
                 path: '',
-                redirectTo: '../transactions', pathMatch: 'prefix'
+                component: TransactionsTabComponent
               },
               {
-                path: 'account-transfers',
+                path: 'export',
-                loadChildren: () => import('../account-transfers/account-transfers.module').then(m => m.AccountTransfersModule)
+                component: ExportTransactionsComponent
-              },
-              {
-                path: ':id',
-                data: { routeParamBreadcrumb: 'id' },
-                children: [
-                  {
-                    path: '',
-                    component: ViewTransactionComponent,
-                    resolve: {
-                      savingsAccountTransaction: SavingsAccountTransactionResolver
-                    }
-                  },
-                  {
-                    path: 'edit',
-                    component: EditTransactionComponent,
-                    data: { breadcrumb: 'Edit', routeParamBreadcrumb: false },
-                    resolve: {
-                      savingsAccountTransactionTemplate: SavingsAccountTransactionTemplateResolver
-                    }
-                  },
-                  {
-                    path: 'reciept',
-                    component: ViewRecieptComponent,
-                    data: { breadcrumb: 'Reciept', routeParamBreadcrumb: false },
-                    resolve: {
-                      savingsTransactionReciept: SavingsTransactionRecieptResolver
-                    }
-                  }
-                ]
               }
             ]
           },
           {
             path: 'charges',
-            data: { title: extract('Savings Account Charges'), breadcrumb: 'Charges', routeParamBreadcrumb: false },
+            component: ChargesTabComponent,
-            children: [
+            data: { title: extract('Savings Account Charges'), breadcrumb: 'Charges', routeParamBreadcrumb: false }
-              {
-                path: '',
-                redirectTo: '../charges', pathMatch: 'prefix'
-              },
-              {
-                path: ':id',
-                data: { routeParamBreadcrumb: 'id' },
-                component: ViewChargeComponent,
-                resolve: {
-                  savingsAccountData: SavingsAccountViewResolver,
-                  savingsAccountCharge: SavingsAccountChargeResolver
-                }
-              }
-            ]
           },
           {
-            path: 'actions/:name',
+            path: 'standing-instructions',
-            data: { title: extract('Savings Account Actions'), breadcrumb: 'Savings Account Actions', routeParamBreadcrumb: 'name' },
+            component: StandingInstructionsTabComponent,
-            component: SavingAccountActionsComponent,
+            data: { title: extract('Savings Account SIH'), breadcrumb: 'Standing Instructions', routeParamBreadcrumb: false }
+          },
+          {
+            path: 'notes',
+            component: NotesTabComponent,
+            data: { title: extract('Savings Account Notes'), breadcrumb: 'Notes', routeParamBreadcrumb: false },
             resolve: {
-              savingsAccountActionData: SavingsAccountActionsResolver
+              savingAccountNotes: SavingNotesResolver
             }
           },
           {
             path: 'documents',
+            component: SavingsDocumentsTabComponent,
             data: { title: extract('Savings Account Documents'), breadcrumb: 'Documents', routeParamBreadcrumb: false },
-            children: [
+            resolve: {
-              {
+              savingsDocuments: SavingDocumentsResolver
-                path: '',
+            }
-                redirectTo: '../documents', pathMatch: 'prefix'
-              },
-            ]
           },
           {
-            path: 'notes',
+            path: 'datatables',
-            data: { title: extract('Savings Account Notes'), breadcrumb: 'Notes', routeParamBreadcrumb: false },
             children: [
               {
-                path: '',
+                path: ':datatableName',
-                redirectTo: '../notes', pathMatch: 'prefix'
+                component: DatatableTabsComponent,
-              },
+                data: { title: extract('View Data Table'), routeParamBreadcrumb: 'datatableName' },
+                resolve: {
+                  savingsDatatable: SavingsDatatableResolver
+                }
+              }
             ]
-          },
-          {
-            path: 'transfer-funds',
-            loadChildren: () => import('../account-transfers/account-transfers.module').then(m => m.AccountTransfersModule)
           }
         ]
       },
+      {
+        path: ':savingAccountId/edit',
+        data: { title: extract('Edit Savings Account'), breadcrumb: 'Edit', routeParamBreadcrumb: false },
+        component: EditSavingsAccountComponent,
+        resolve: {
+          savingsAccountAndTemplate: SavingsAccountAndTemplateResolver
+        }
+      },
+      {
+        path: ':savingAccountId/transactions/:id',
+        data: { title: extract('Savings Account Transactions'), breadcrumb: 'Transactions', routeParamBreadcrumb: false },
+        children: [
+          {
+            path: '',
+            component: ViewTransactionComponent,
+            resolve: {
+              savingsAccountTransaction: SavingsAccountTransactionResolver
+            }
+          },
+          {
+            path: 'edit',
+            component: EditTransactionComponent,
+            data: { breadcrumb: 'Edit', routeParamBreadcrumb: false },
+            resolve: {
+              savingsAccountTransactionTemplate: SavingsAccountTransactionTemplateResolver
+            }
+          },
+          {
+            path: 'reciept',
+            component: ViewRecieptComponent,
+            data: { breadcrumb: 'Reciept', routeParamBreadcrumb: false },
+            resolve: {
+              savingsTransactionReciept: SavingsTransactionRecieptResolver
+            }
+          }
+        ]
+      },
+      {
+        path: ':savingAccountId/charges',
+        data: { title: extract('Savings Account Charges'), breadcrumb: 'Charges', routeParamBreadcrumb: false },
+        children: [
+          {
+            path: '',
+            redirectTo: '../charges', pathMatch: 'prefix'
+          },
+          {
+            path: ':id',
+            data: { routeParamBreadcrumb: 'id' },
+            component: ViewChargeComponent,
+            resolve: {
+              savingsAccountData: SavingsAccountViewResolver,
+              savingsAccountCharge: SavingsAccountChargeResolver
+            }
+          }
+        ]
+      },
+      {
+        path: ':savingAccountId/actions/:name',
+        data: { title: extract('Savings Account Actions'), breadcrumb: 'Savings Account Actions', routeParamBreadcrumb: 'name' },
+        component: SavingAccountActionsComponent,
+        resolve: {
+          savingsAccountActionData: SavingsAccountActionsResolver
+        }
+      },
+      {
+        path: 'transfer-funds',
+        loadChildren: () => import('../account-transfers/account-transfers.module').then(m => m.AccountTransfersModule)
+      },
       {
         path: 'gsim-account',
         children: [
           {
             path: 'create',
-            data: { title: extract('Create GSIM Application'), breadcrumb: 'Create GSIM Application'},
+            data: { title: extract('Create GSIM Application'), breadcrumb: 'Create GSIM Application' },
             component: CreateGsimAccountComponent,
             resolve: {
               groupsData: GroupViewResolver,
@@ -246,7 +207,7 @@ const routes: Routes = [
           },
           {
             path: ':savingAccountId',
-            data: { title: extract('GSIM Account View'), routeParamBreadcrumb: 'savingAccountId'},
+            data: { title: extract('GSIM Account View'), routeParamBreadcrumb: 'savingAccountId' },
             children: [
               {
                 path: '',
@@ -269,17 +230,17 @@ const routes: Routes = [
   exports: [RouterModule],
   declarations: [],
   providers: [SavingsAccountViewResolver,
-              SavingsDatatablesResolver,
+    SavingsDatatablesResolver,
-              SavingsDatatableResolver,
+    SavingsDatatableResolver,
-              SavingsAccountTemplateResolver,
+    SavingsAccountTemplateResolver,
-              SavingsAccountAndTemplateResolver,
+    SavingsAccountAndTemplateResolver,
-              SavingsAccountTransactionResolver,
+    SavingsAccountTransactionResolver,
-              SavingsAccountChargeResolver,
+    SavingsAccountChargeResolver,
-              SavingsAccountActionsResolver,
+    SavingsAccountActionsResolver,
-              SavingsTransactionRecieptResolver,
+    SavingsTransactionRecieptResolver,
-              SavingsAccountTransactionTemplateResolver,
+    SavingsAccountTransactionTemplateResolver,
-              GSIMAccountsResolver,
+    GSIMAccountsResolver,
-              GroupAccountsResolver,
+    GroupAccountsResolver,
-              GSIMViewResolver]
+    GSIMViewResolver]
 })
-export class SavingsRoutingModule {}
+export class SavingsRoutingModule { }