fix: make all the configuration wizards work (#2267)

Correct labels in the context of the wizards, make no wizard terminates
prematurely, make modal windows appear well positioned.

Fixes: WEB-11

src/app/organization/currencies/manage-currencies/manage-currencies.component.html

@@ -67,16 +67,16 @@
   </p>
   <div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
     <button mat-raised-button color="warn" (click)="popover.close(); configurationWizardService.closeConfigWizard()">
-      {{"labels.buttons.Close' | translate }}
+      {{ 'labels.buttons.Close' | translate }}
     </button>
     <button mat-raised-button color="primary" (click)="popover.close()">
-      {{"labels.buttons.Add Currency' | translate }}
+      {{ 'labels.buttons.Add Currency' | translate }}
     </button>
     <button mat-raised-button color="primary" (click)="popover.close(); previousStep()">
-      {{"labels.buttons.Back' | translate }}
+      {{ 'labels.buttons.Back' | translate }}
     </button>
     <button mat-raised-button color="primary" (click)="popover.close(); nextStep()">
-      {{"labels.buttons.Next' | translate }}
+      {{ 'labels.buttons.Next' | translate }}
     </button>
   </div>
 </ng-template>

src/app/organization/manage-funds/manage-funds.component.html

@@ -1,5 +1,5 @@
 <div class="container m-b-20" fxLayout="row" fxLayoutAlign="end" fxLayoutGap="20px">
-  <div #buttonCreateCharge class="in-block">
+  <div #fundFormRef class="in-block">
     <button mat-raised-button color="primary" [routerLink]="['create']" *mifosxHasPermission="'CREATE_FUND'">
       <fa-icon icon="plus" class="m-r-10"></fa-icon>
       {{ 'labels.buttons.Create Fund' | translate }}

src/app/organization/offices/create-office/create-office.component.html

@@ -65,7 +65,7 @@
 <ng-template #templateCreateOfficeForm let-popover="popover">
   <h2>{{ 'labels.heading.Create Office' | translate }}</h2>
   <p class="mw400">
-    {{ 'labels.text.Filling Details' | translate }}:
+    {{ 'labels.text.Filling Details' | translate }}
     <a href="https://mifosforge.jira.com/wiki/spaces/docs/pages/67141727/Manage+Offices" target="_blank">{{
       'labels.inputs.Manage Offices' | translate
     }}</a>
@@ -81,7 +81,7 @@
       {{ 'labels.buttons.Back' | translate }}
     </button>
     <button mat-raised-button color="primary" (click)="popover.close(); nextStep()">
-      {{ 'labels.buttons.Next Step' | translate }}
+      {{ 'labels.buttons.Next' | translate }}
     </button>
   </div>
 </ng-template>

src/app/organization/offices/offices.component.html

@@ -1,5 +1,5 @@
 <div class="container m-b-20" fxLayout="row" fxLayoutAlign="end" fxLayoutGap="20px">
-  <mat-button-toggle-group [formControl]="viewGroup">
+  <mat-button-toggle-group #buttonTreeView [formControl]="viewGroup">
     <mat-button-toggle value="listView">
       <fa-icon icon="list"></fa-icon>
     </mat-button-toggle>
@@ -29,7 +29,7 @@
 </div>
 
 <div class="container" [hidden]="viewGroup.value !== 'listView'">
-  <div fxLayout="row" fxLayoutGap="20px">
+  <div #filter fxLayout="row" fxLayoutGap="20px">
     <mat-form-field fxFlex>
       <mat-label>{{ 'Filter' | translate }}</mat-label>
       <input matInput (keyup)="applyFilter($event.target.value)" />
@@ -37,7 +37,7 @@
   </div>
 
   <!-- List View -->
-  <div class="mat-elevation-z8">
+  <div #tableOffices class="mat-elevation-z8">
     <table mat-table [dataSource]="dataSource" matSort>
       <ng-container matColumnDef="name">
         <th mat-header-cell *matHeaderCellDef mat-sort-header>{{ ' Office Name ' | translate }}</th>

src/app/organization/working-days/working-days.component.html

@@ -66,7 +66,7 @@
       {{ 'labels.buttons.Back' | translate }}
     </button>
     <button mat-raised-button color="primary" (click)="popover.close(); nextStep()">
-      {{ 'labels.buttons.Next Step' | translate }}
+      {{ 'labels.buttons.Next' | translate }}
     </button>
   </div>
 </ng-template>