Merge branch 'amal' into 'master'

package-lock.json

@@ -759,6 +759,22 @@
         }
       }
     },
+    "@ngx-translate/core": {
+      "version": "11.0.1",
+      "resolved": "https://registry.npmjs.org/@ngx-translate/core/-/core-11.0.1.tgz",
+      "integrity": "sha512-nBCa1ZD9fAUY/3eskP3Lql2fNg8OMrYIej1/5GRsfcutx9tG/5fZLCv9m6UCw1aS+u4uK/vXjv1ctG/FdMvaWg==",
+      "requires": {
+        "tslib": "^1.9.0"
+      }
+    },
+    "@ngx-translate/http-loader": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@ngx-translate/http-loader/-/http-loader-4.0.0.tgz",
+      "integrity": "sha512-x8LumqydWD7eX9yQTAVeoCM9gFUIGVTUjZqbxdAUavAA3qVnk9wCQux7iHLPXpydl8vyQmLoPQR+fFU+DUDOMA==",
+      "requires": {
+        "tslib": "^1.9.0"
+      }
+    },
     "@schematics/angular": {
       "version": "7.1.4",
       "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-7.1.4.tgz",
@@ -3738,8 +3754,7 @@
         "ansi-regex": {
           "version": "2.1.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "aproba": {
           "version": "1.2.0",
@@ -3760,14 +3775,12 @@
         "balanced-match": {
           "version": "1.0.0",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "brace-expansion": {
           "version": "1.1.11",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "balanced-match": "^1.0.0",
             "concat-map": "0.0.1"
@@ -3782,20 +3795,17 @@
         "code-point-at": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "concat-map": {
           "version": "0.0.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "console-control-strings": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "core-util-is": {
           "version": "1.0.2",
@@ -3912,8 +3922,7 @@
         "inherits": {
           "version": "2.0.3",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "ini": {
           "version": "1.3.5",
@@ -3925,7 +3934,6 @@
           "version": "1.0.0",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "number-is-nan": "^1.0.0"
           }
@@ -3940,7 +3948,6 @@
           "version": "3.0.4",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "brace-expansion": "^1.1.7"
           }
@@ -3948,14 +3955,12 @@
         "minimist": {
           "version": "0.0.8",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "minipass": {
           "version": "2.3.5",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "safe-buffer": "^5.1.2",
             "yallist": "^3.0.0"
@@ -3974,7 +3979,6 @@
           "version": "0.5.1",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "minimist": "0.0.8"
           }
@@ -4055,8 +4059,7 @@
         "number-is-nan": {
           "version": "1.0.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "object-assign": {
           "version": "4.1.1",
@@ -4068,7 +4071,6 @@
           "version": "1.4.0",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "wrappy": "1"
           }
@@ -4154,8 +4156,7 @@
         "safe-buffer": {
           "version": "5.1.2",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "safer-buffer": {
           "version": "2.1.2",
@@ -4191,7 +4192,6 @@
           "version": "1.0.2",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "code-point-at": "^1.0.0",
             "is-fullwidth-code-point": "^1.0.0",
@@ -4211,7 +4211,6 @@
           "version": "3.0.1",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "ansi-regex": "^2.0.0"
           }
@@ -4255,14 +4254,12 @@
         "wrappy": {
           "version": "1.0.2",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "yallist": {
           "version": "3.0.3",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         }
       }
     },

package.json

@@ -19,6 +19,8 @@
     "@angular/platform-browser": "~7.1.0",
     "@angular/platform-browser-dynamic": "~7.1.0",
     "@angular/router": "~7.1.0",
+    "@ngx-translate/core": "^11.0.1",
+    "@ngx-translate/http-loader": "^4.0.0",
     "bootstrap": "^4.3.1",
     "core-js": "^2.5.4",
     "jquery": "^3.3.1",

src/app/app-routing.module.ts

 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 
-import { InvalidComponent } from './';
 
 const routes: Routes = [
   { 

src/app/app.component.ts

 import { Component } from '@angular/core';
+import {TranslateService} from '@ngx-translate/core';
+import { SubjectService } from './providers/subject.service';
+import { WebService } from './providers/web.service';
+import * as $ from 'jquery';
 
 @Component({
   selector: 'app-root',
@@ -7,4 +11,41 @@ import { Component } from '@angular/core';
 })
 export class AppComponent {
   title = 'forex';
+  lang =  'en';
+  constructor(translate: TranslateService, public subjectService: SubjectService, public service: WebService){
+
+    this.subjectService.getLangData().subscribe(langData => {
+      console.log(langData);
+      this.lang = this.service.getLocalStorageItem('lang');
+      console.log(this.lang);
+      if (this.lang) {
+        translate.setDefaultLang(this.lang);
+        translate.use(this.lang);
+      }
+    });
+
+
+    const lang  = this.service.getLocalStorageItem('lang');
+    console.log(lang);
+
+    if(lang !== undefined){
+      this.lang = lang;
+    }
+
+    if(this.lang === 'ar') {
+      $('body').addClass('ar');
+    } else {
+      $('body').removeClass('ar');
+    }
+
+    translate.setDefaultLang(this.lang);
+
+    // the lang to use, if the lang isn't available, it will use the current loader to get them
+
+    translate.use(this.lang);
+
+    // the lang to use, if the lang isn't available, it will use the current loader to get them
+
+
+  }
 }

src/app/app.module.ts

@@ -2,8 +2,10 @@ import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
-import { HttpClientModule } from '@angular/common/http';
+import { HttpClientModule,HttpClient } from '@angular/common/http';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { TranslateModule, TranslateLoader} from '@ngx-translate/core';
+import {TranslateHttpLoader} from '@ngx-translate/http-loader';
 
 
 /* CUSTOM-MODULES */
@@ -21,7 +23,9 @@ import { AuthGuard } from './providers/auth.guard';
 import { WebService } from './providers/web.service';
 
 
-
+export function HttpLoaderFactory(http: HttpClient) {
+  return new TranslateHttpLoader(http, './assets/i18n/', '.json');
+}
 
 
 
@@ -38,7 +42,14 @@ import { WebService } from './providers/web.service';
     ReactiveFormsModule,
     FormsModule,
     HttpClientModule,
-    StartModule
+    StartModule,
+    TranslateModule.forRoot({
+      loader: {
+        provide: TranslateLoader,
+        useFactory: HttpLoaderFactory,
+        deps: [HttpClient]
+      }
+    })
   ],
   providers: [AuthGuard, AuthService, WebService],
   bootstrap: [AppComponent]

src/app/checker/addforex/addforex.component.html

@@ -5,38 +5,39 @@
 <header class="provider_header">
   <div class="row">
     <div class="col-md-6">
-      <h4>Forex Delivery Service Provider</h4>
+      <h4> {{'addforex.Forex Delivery Service Provider' | translate}}</h4>
     </div>
     <div class="col-md-6 textRight relative">
         <button class="logout" (click)="goToPage('checker/home')">
             <img src="assets/images/asset_home.png">
-          Home</button>
+            {{'addforex.Home' | translate}}
+          </button>
         <button class="logout" (click)="logout()">
             <img src="assets/images/asset_logout.png">
-          Logout</button>
+            {{'addforex.Logout' | translate}}</button>
         <img src="assets/images/asset_logo1.png">
-        <span (click)="goToPage('delivery/changepin')">Change PIN</span>
+        <span (click)="goToPage('delivery/changepin')"> {{'addforex.Change PIN' | translate}}</span>
     </div>
   </div>
 </header>
 <section>
   <div class="provider_content">
     
-    <h3>Add Delivery Provider</h3>
+    <h3> {{'addforex.Add Delivery Provider' | translate}}</h3>
     <div class="provider_inner_content">
           <div class="alert alert-success alert-dismissible" *ngIf="success">
             <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-            <strong>Success!</strong> Provider created successfully.
+            <strong>{{'addforex.Success!' | translate}}</strong>  {{'addforex.Provider created successfully' | translate}}
           </div>
           <div class="alert alert-danger alert-dismissible" *ngIf="error">
               <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-              <strong>Warning!</strong> {{responseError}}
+              <strong>{{'addforex.Warning!' | translate}}</strong> {{responseError}}
           </div>
       <form [formGroup]="providerForm" (ngSubmit)="regProcess()" autocomplete="off">
         <div class="row">
           <div class="col">
             <div class="provider_data_content">
-                <p>Provider Name</p>
+                <p> {{'addforex.Provider Name' | translate}}</p>
                 <input class="provider_input" placeholder="" type="text" formControlName="name">
             </div>
               <div class="s_error" *ngIf="!providerForm.controls['name'].valid && providerSubmit">
@@ -45,7 +46,7 @@
           </div>
           <div class="col">
               <div class="provider_data_content">
-                  <p>Pin</p>
+                  <p> {{'addforex.Pin' | translate}}</p>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
@@ -56,7 +57,7 @@
           </div>
           <div class="col">
               <div class="provider_data_content">
-                  <p>Confirm Pin</p>
+                  <p> {{'addforex.Confirm Pin' | translate}}</p>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
@@ -69,7 +70,7 @@
         <div class="row">
             <div class="col">
               <div class="provider_data_content">
-                  <p>Location</p>
+                  <p> {{'addforex.Location' | translate}}</p>
                   <input class="provider_input" placeholder="" type="text" formControlName="location">
               </div>
               <div class="s_error" *ngIf="!providerForm.controls['location'].valid && providerSubmit">
@@ -78,7 +79,7 @@
             </div>
             <div class="col">
                 <div class="provider_data_content">
-                    <p>CR ID</p>
+                    <p> {{'addforex.CR ID' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text" formControlName="cr_id">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['cr_id'].valid && providerSubmit">
@@ -87,7 +88,7 @@
             </div>
             <div class="col">
                 <div class="provider_data_content">
-                    <p>CR Manager</p>
+                    <p>  {{'addforex.CR Manager' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text"  formControlName="cr_manager">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['cr_manager'].valid && providerSubmit">
@@ -100,7 +101,7 @@
             <div class="row">
                 <div class="col">
                   <div class="provider_data_content">
-                      <p>Contact Name</p>
+                      <p> {{'addforex.Contact Name' | translate}}</p>
                       <input class="provider_input" placeholder="" type="text" formControlName="contact">
                   </div>
                   <div class="s_error" *ngIf="!providerForm.controls['contact'].valid">
@@ -112,7 +113,7 @@
                 </div>
                 <div class="col">
                     <div class="provider_data_content">
-                        <p>Phone</p>
+                        <p> {{'addforex.Phone' | translate}}</p>
                         <input class="provider_input" placeholder="" type="number" formControlName="phone">
                     </div>
                     <div class="s_error" *ngIf="!providerForm.controls['phone'].valid && providerForm.controls['phone'].touched">
@@ -129,7 +130,7 @@
                 </div>
                 <div class="col">
                     <div class="provider_data_content">
-                        <p>Email id</p>
+                        <p> {{'addforex.Email id' | translate}}</p>
                         <input class="provider_input" placeholder="" type="mail" formControlName="email_id">
                     </div>
                     <div class="s_error" *ngIf="!providerForm.controls['email_id'].valid && providerForm.controls['email_id'].touched">
@@ -145,11 +146,11 @@
               <div class="row">
                   <div class="col">
                     <div class="provider_data_content">
-                        <p>Status</p>
+                        <p> {{'addforex.Status' | translate}}</p>
                         <select class="provider_input" formControlName="online_status">
-                          <option disabled hidden>Status</option>
-                          <option value="1">Online</option>
-                          <option value="0">Offline</option>
+                          <option disabled hidden>{{'addforex.Status' | translate}}</option>
+                          <option value="1">{{'addforex.Online' | translate}}</option>
+                          <option value="0">{{'addforex.Offline' | translate}}</option>
                         </select>
                     </div>
                     <div class="s_error" *ngIf="!providerForm.controls['online_status'].valid && providerSubmit">
@@ -159,9 +160,9 @@
 
                   <div class="col">
                       <div class="provider_data_content">
-                          <p>Delivery Provider</p>
+                          <p> {{'addforex.Delivery Provider' | translate}}</p>
                           <select class="provider_input" formControlName="deli_provider_id">
-                            <option disabled hidden>Status</option>
+                            <option disabled hidden> {{'addforex.Status' | translate}}</option>
                             <option *ngFor="let provider of providerList" [value]="provider.id">{{provider.name}}</option>
                           </select>
                       </div>
@@ -185,8 +186,8 @@
             <div class="row">
               <div class="col">
                 <div class="add_provider_btn_bay">
-                  <button class="save_btn floatRight">Save</button>
-                  <button class="cancel_btn floatRight" (click)="cancelClick()">Cancel</button>
+                  <button class="save_btn floatRight"> {{'addforex.Save' | translate}}</button>
+                  <button class="cancel_btn floatRight" (click)="cancelClick()"> {{'addforex.Cancel' | translate}}</button>
                   <div class="clear"></div>
                 </div>
               </div>

src/app/checker/addprovider/addprovider.component.html

@@ -5,38 +5,39 @@
 <header class="provider_header">
   <div class="row">
     <div class="col-md-6">
-      <h4>Forex Delivery Service Provider</h4>
+      <h4> {{'addprovider.Forex Delivery Service Provider' | translate}}</h4>
     </div>
     <div class="col-md-6 textRight relative">
         <button class="logout" (click)="goToPage('checker/home')">
           <img src="assets/images/asset_home.png">
-        Home</button>
+        
+        {{'addprovider.Home' | translate}}</button>
         <button class="logout" (click)="logout()">
             <img src="assets/images/asset_logout.png">
-          Logout</button>
+            {{'addprovider.Logout' | translate}}</button>
         <img src="assets/images/asset_logo1.png">
-        <span (click)="goToPage('delivery/changepin')">Change PIN</span>
+        <span (click)="goToPage('delivery/changepin')"> {{'addprovider.Change PIN' | translate}}</span>
     </div>
   </div>
 </header>
 <section>
   <div class="provider_content">
     
-    <h3>Add Delivery Provider</h3>
+    <h3> {{'addprovider.Add Delivery Provider' | translate}}</h3>
     <div class="provider_inner_content">
           <div class="alert alert-success alert-dismissible" *ngIf="success">
             <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-            <strong>Success!</strong> Provider created successfully.
+            <strong> {{'addprovider.Success! ' | translate}}</strong>  {{'addprovider.Provider created successfully.' | translate}}
           </div>
           <div class="alert alert-danger alert-dismissible" *ngIf="error">
               <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-              <strong>Warning!</strong> {{responseError}}
+              <strong> {{'addprovider.Warning! ' | translate}}</strong> {{responseError}}
           </div>
       <form [formGroup]="providerForm" (ngSubmit)="regProcess()" autocomplete="off">
         <div class="row">
           <div class="col">
             <div class="provider_data_content">
-                <p>Provider Name</p>
+                <p> {{'addprovider.Provider Name' | translate}}</p>
                 <input class="provider_input" placeholder="" type="text" formControlName="name">
             </div>
               <div class="s_error" *ngIf="!providerForm.controls['name'].valid && providerSubmit">
@@ -45,7 +46,7 @@
           </div>
           <div class="col">
               <div class="provider_data_content">
-                  <p>Pin</p>
+                  <p>  {{'addprovider.Pin' | translate}}</p>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
@@ -56,7 +57,7 @@
           </div>
           <div class="col">
               <div class="provider_data_content">
-                  <p>Confirm Pin</p>
+                  <p>  {{'addprovider.Confirm Pin' | translate}}</p>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
@@ -69,7 +70,7 @@
         <div class="row">
             <div class="col">
               <div class="provider_data_content">
-                  <p>Location</p>
+                  <p>  {{'addprovider.Location' | translate}}</p>
                   <input class="provider_input" placeholder="" type="text" formControlName="location">
               </div>
               <div class="s_error" *ngIf="!providerForm.controls['location'].valid && providerSubmit">
@@ -78,7 +79,7 @@
             </div>
             <div class="col">
                 <div class="provider_data_content">
-                    <p>CR ID</p>
+                    <p>  {{'addprovider.CR ID' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text" formControlName="cr_id">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['cr_id'].valid && providerSubmit">
@@ -87,7 +88,7 @@
             </div>
             <div class="col">
                 <div class="provider_data_content">
-                    <p>CR Manager</p>
+                    <p>  {{'addprovider.CR Manager' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text"  formControlName="cr_manager">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['cr_manager'].valid && providerSubmit">
@@ -98,7 +99,7 @@
           <div class="row">
               <div class="col">
                 <div class="provider_data_content">
-                    <p>Contact Name</p>
+                    <p> {{'addprovider.Contact Name' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text" formControlName="contact">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['contact'].valid">
@@ -110,7 +111,7 @@
               </div>
               <div class="col">
                   <div class="provider_data_content">
-                      <p>Phone</p>
+                      <p> {{'addprovider.Phone' | translate}}</p>
                       <input class="provider_input" placeholder="" type="number" formControlName="phone">
                   </div>
                   <div class="s_error" *ngIf="!providerForm.controls['phone'].valid && providerForm.controls['phone'].touched">
@@ -127,7 +128,7 @@
               </div>
               <div class="col">
                   <div class="provider_data_content">
-                      <p>Email id</p>
+                      <p> {{'addprovider.Email id' | translate}}</p>
                       <input class="provider_input" placeholder="" type="mail" formControlName="email_id">
                   </div>
                   <div class="s_error" *ngIf="!providerForm.controls['email_id'].valid && providerForm.controls['email_id'].touched">
@@ -150,8 +151,8 @@
             <div class="row">
               <div class="col">
                 <div class="add_provider_btn_bay">
-                  <button class="save_btn floatRight">Save</button>
-                  <button class="cancel_btn floatRight" (click)="cancelClick()">Cancel</button>
+                  <button class="save_btn floatRight"> {{'addprovider.Save' | translate}}</button>
+                  <button class="cancel_btn floatRight" (click)="cancelClick()"> {{'addprovider.Cancel' | translate}}</button>
                   <div class="clear"></div>
                 </div>
               </div>

src/app/checker/changepin/changepin.component.html

@@ -4,12 +4,12 @@
           <div class="login_inner">
              <img src="assets/images/asset_logo.png">
              <hr>
-             <h6>Change PIN</h6>
+             <h6> {{'changepin.Change PIN' | translate}}</h6>
              <div class="login_inner_content">
                
                 <br>
                 <div class="login_row">
-                    <p>Old PIN</p>
+                    <p> {{'changepin.Old PIN' | translate}}</p>
                     <div class="login_pin">
                       <input class="log_pin" type="password" maxlength="1" #old1  (keyup)="processKeyUp($event, old2)">
                       <input class="log_pin" type="password" maxlength="1" #old2 (keydown.backspace)="processBack($event, old1)" (keyup)="processKeyUp($event, old3)">
@@ -23,7 +23,7 @@
                      </div>
                  </div>
                  <div class="login_row">
-                    <p>New PIN</p>
+                    <p>{{'changepin.New PIN' | translate}}</p>
                     <div class="login_pin">
                       <input class="log_pin" type="password" maxlength="1" #new1 (keyup)="processKeyUp($event, new2)">
                       <input class="log_pin" type="password" maxlength="1" #new2 (keydown.backspace)="processBack($event, new1)" (keyup)="processKeyUp($event, new3)">
@@ -37,7 +37,7 @@
                      <div class="s_validation">{{error_msg.password}} </div>
                   </div>
                  <div class="login_row">
-                    <p>Confirm PIN</p>
+                    <p> {{'changepin.Confirm PIN' | translate}}</p>
                     <div class="login_pin">
                       <input class="log_pin" type="password" maxlength="1" #conf1  (keyup)="processKeyUp($event, conf2)">
                       <input class="log_pin" type="password" maxlength="1" #conf2 (keydown.backspace)="processBack($event, conf1)" (keyup)="processKeyUp($event, conf3)">
@@ -58,19 +58,19 @@
        </div>
        <div class="alert alert-danger alert-dismissible" *ngIf="resetError">
             <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-            <strong>Warning!</strong> {{resetMsg}}
+            <strong>{{'changepin.Warning!' | translate}} </strong> {{resetMsg}}
         </div>
        <div class="alert alert-success alert-dismissible" *ngIf="!resetError && !error && loginSubmit">
             <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-            <strong>Success!</strong> Password Updated Successfully
+            <strong> {{'changepin.Success!' | translate}}</strong>  {{'changepin.Password Updated Successfully' | translate}}
           </div>
        <div class="login_btn_bay">
           <div class="row">
               <div class="col-md-6">
-                  <button class="cancel_btn" (click)="cancelClick()">Cancel</button>
+                  <button class="cancel_btn" (click)="cancelClick()"> {{'changepin.Cancel' | translate}}</button>
               </div>
               <div class="col-md-6">
-                <button class="login_btn" (click)="saveClick()">Save</button>
+                <button class="login_btn" (click)="saveClick()"> {{'changepin.Save' | translate}}</button>
               </div>
            </div>
        </div>

src/app/checker/checker.module.ts

@@ -2,6 +2,7 @@ import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { moduleRouting } from './checker.routing';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { TranslateModule} from '@ngx-translate/core';
 
 //IMPORTED-PAGE-COMPONENTS
 
@@ -25,7 +26,8 @@ import { CurrencyListComponent } from './currency-list/currency-list.component';
     CommonModule,
     moduleRouting,
     FormsModule,
-    ReactiveFormsModule
+    ReactiveFormsModule,
+    TranslateModule
   ]
 })
 export class CheckerModule { }

src/app/checker/currency-add/currency-add.component.html

@@ -5,38 +5,38 @@
 <header class="provider_header">
   <div class="row">
     <div class="col-md-6">
-      <h4>Currency Management</h4>
+      <h4> {{'currencyadd.Currency Management' | translate}}</h4>
     </div>
     <div class="col-md-6 textRight relative">
         <button class="logout" (click)="goToPage('checker/home')">
           <img src="assets/images/asset_home.png">
-        Home</button>
+         {{'currencyadd.Home' | translate}}</button>
         <button class="logout" (click)="logout()">
             <img src="assets/images/asset_logout.png">
-          Logout</button>
+           {{'currencyadd.Logout' | translate}}</button>
         <img src="assets/images/asset_logo1.png">
-        <span (click)="goToPage('delivery/changepin')">Change PIN</span>
+        <span (click)="goToPage('delivery/changepin')"> {{'currencyadd.Change PIN' | translate}}</span>
     </div>
   </div>
 </header>
 <section>
   <div class="provider_content">
     
-    <h3>Add Currency</h3>
+    <h3> {{'currencyadd.Add Currency' | translate}}</h3>
     <div class="provider_inner_content">
           <div class="alert alert-success alert-dismissible" *ngIf="success">
             <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-            <strong>Success!</strong> Currency added successfully.
+            <strong> {{'currencyadd.Success!' | translate}}</strong>  {{'currencyadd.Currency added successfully.' | translate}}
           </div>
           <div class="alert alert-danger alert-dismissible" *ngIf="error">
               <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-              <strong>Warning!</strong> {{responseError}}
+              <strong> {{'currencyadd.Warning!' | translate}}</strong> {{responseError}}
           </div>
       <form [formGroup]="currencyForm" (ngSubmit)="currencyProcess()" autocomplete="off">        
         <div class="row">
             <div class="col">
               <div class="provider_data_content">
-                  <p>Name</p>
+                  <p> {{'currencyadd.Name' | translate}}</p>
                   <input class="provider_input" placeholder="" type="text" formControlName="name">
               </div>
               <div class="s_error" *ngIf="!currencyForm.controls['name'].valid && currencySubmit">
@@ -45,7 +45,7 @@
             </div>
             <div class="col">
                 <div class="provider_data_content">
-                    <p>Symbol</p>
+                    <p> {{'currencyadd.Symbol' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text" formControlName="symbol">
                 </div>
                 <div class="s_error" *ngIf="!currencyForm.controls['symbol'].valid && currencySubmit">
@@ -54,7 +54,7 @@
             </div>
             <div class="col">
                 <div class="provider_data_content">
-                    <p>Flag</p>
+                    <p> {{'currencyadd.Flag' | translate}}</p>
                    
                 
                         <input class="borderNone" placeholder="" type="file"  formControlName="flag" (change)="onFileChange($event)">
@@ -69,7 +69,7 @@
           <div class="row">
               <div class="col">
                 <div class="provider_data_content">
-                    <p>Rate</p>
+                    <p> {{'currencyadd.Rate' | translate}}</p>
                     <input class="provider_input" placeholder="" type="number" formControlName="rate">
                 </div>
                 <div class="s_error" *ngIf="!currencyForm.controls['rate'].valid && currencySubmit">
@@ -79,7 +79,7 @@
 
               <div class="col">
                   <div class="provider_data_content">
-                      <p>Forex Amount Start From</p>
+                      <p> {{'currencyadd.Forex Amount Start From' | translate}}</p>
                       <input class="provider_input" placeholder="" type="number" formControlName="start_from">
                   </div>
                   <div class="s_error" *ngIf="!currencyForm.controls['start_from'].valid && currencySubmit">
@@ -99,8 +99,8 @@
             <div class="row">
               <div class="col">
                 <div class="add_provider_btn_bay">
-                  <button class="save_btn floatRight">Save</button>
-                  <button class="cancel_btn floatRight" (click)="cancelClick()">Cancel</button>
+                  <button class="save_btn floatRight"> {{'currencyadd.Save' | translate}}</button>
+                  <button class="cancel_btn floatRight" (click)="cancelClick()"> {{'currencyadd.Cancel' | translate}}</button>
                   <div class="clear"></div>
                 </div>
               </div>

src/app/checker/currency-edit/currency-edit.component.html

@@ -5,38 +5,38 @@
 <header class="provider_header">
   <div class="row">
     <div class="col-md-6">
-      <h4>Currency Management</h4>
+      <h4>{{'currencyedit.Currency Management' | translate}}</h4>
     </div>
     <div class="col-md-6 textRight relative">
         <button class="logout" (click)="goToPage('checker/home')">
           <img src="assets/images/asset_home.png">
-        Home</button>
+         {{'currencyedit.Home' | translate}}</button>
         <button class="logout" (click)="logout()">
             <img src="assets/images/asset_logout.png">
-          Logout</button>
+           {{'currencyedit.Logout' | translate}}</button>
         <img src="assets/images/asset_logo1.png">
-        <span (click)="goToPage('delivery/changepin')">Change PIN</span>
+        <span (click)="goToPage('delivery/changepin')">{{'currencyedit.Change PIN' | translate}}</span>
     </div>
   </div>
 </header>
 <section>
   <div class="provider_content">
     
-    <h3>Edit Currency</h3>
+    <h3> {{'currencyedit.Edit Currency' | translate}}</h3>
     <div class="provider_inner_content">
           <div class="alert alert-success alert-dismissible" *ngIf="success">
             <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-            <strong>Success!</strong> Currency added successfully.
+            <strong> {{'currencyedit.Success!' | translate}}</strong> {{'currencyedit.Currency added successfully.' | translate}}
           </div>
           <div class="alert alert-danger alert-dismissible" *ngIf="error">
               <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-              <strong>Warning!</strong> {{responseError}}
+              <strong> {{'currencyedit.Warning!' | translate}}</strong> {{responseError}}
           </div>
       <form [formGroup]="currencyForm" (ngSubmit)="currencyProcess()" autocomplete="off">        
         <div class="row">
             <div class="col">
               <div class="provider_data_content">
-                  <p>Name</p>
+                  <p> {{'currencyedit.Name' | translate}}</p>
                   <input class="provider_input" placeholder="" type="text" formControlName="name">
               </div>
               <div class="s_error" *ngIf="!currencyForm.controls['name'].valid && currencySubmit">
@@ -45,7 +45,7 @@
             </div>
             <div class="col">
                 <div class="provider_data_content">
-                    <p>Symbol</p>
+                    <p> {{'currencyedit.Symbol' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text" formControlName="symbol">
                 </div>
                 <div class="s_error" *ngIf="!currencyForm.controls['symbol'].valid && currencySubmit">
@@ -55,10 +55,10 @@
             <div class="col">
               
                 <div class="provider_data_content">
-                    <p>Flag</p>
+                    <p> {{'currencyedit.Flag' | translate}}</p>
                     <img [src]="getImage()" *ngIf="image_url" />
                     <div class="provider_choose_btn">
-                      Choose Flag
+                       {{'currencyedit.Choose Flag' | translate}}
                       <input class="" placeholder="" type="file"  formControlName="flag" (change)="onFileChange($event)">
                     </div>
                 </div>
@@ -70,7 +70,7 @@
           <div class="row">
               <div class="col">
                 <div class="provider_data_content">
-                    <p>Rate</p>
+                    <p> {{'currencyedit.Rate' | translate}}</p>
                     <input class="provider_input" placeholder="" type="number" formControlName="rate">
                 </div>
                 <div class="s_error" *ngIf="!currencyForm.controls['rate'].valid && currencySubmit">
@@ -80,7 +80,7 @@
 
               <div class="col">
                   <div class="provider_data_content">
-                      <p>Forex Amount Start From</p>
+                      <p> {{'currencyedit.Forex Amount Start From' | translate}}</p>
                       <input class="provider_input" placeholder="" type="number" formControlName="start_from">
                   </div>
                   <div class="s_error" *ngIf="!currencyForm.controls['start_from'].valid && currencySubmit">
@@ -100,8 +100,8 @@
             <div class="row">
               <div class="col">
                 <div class="add_provider_btn_bay">
-                  <button class="save_btn floatRight">Save</button>
-                  <button class="cancel_btn floatRight" (click)="cancelClick()">Cancel</button>
+                  <button class="save_btn floatRight"> {{'currencyedit.Save' | translate}}</button>
+                  <button class="cancel_btn floatRight" (click)="cancelClick()"> {{'currencyedit.Cancel' | translate}}</button>
                   <div class="clear"></div>
                 </div>
               </div>

src/app/checker/currency-list/currency-list.component.html

@@ -4,40 +4,40 @@
 <header class="provider_header">
     <div class="row">
       <div class="col-md-6">
-        <h4>Manage Currency</h4>
+        <h4> {{'currencylist.Manage Currency' | translate}}</h4>
       </div>
       <div class="col-md-6 textRight relative">
           <button class="logout" (click)="goToPage('checker/home')">
             <img src="assets/images/asset_home.png">
-          Home</button>
+           {{'currencylist.Home' | translate}}</button>
           <button class="logout" (click)="logout()">
               <img src="assets/images/asset_logout.png">
-            Logout</button>
+             {{'currencylist.Logout' | translate}}</button>
           <img src="assets/images/asset_logo1.png">
-          <span (click)="goToPage('checker/changepin')">Change PIN</span>
+          <span (click)="goToPage('checker/changepin')"> {{'currencylist.Change PIN' | translate}}</span>
       </div>
     </div>
   </header>
 <section>
     <div class="provider_content">
-      <h3>Currency List</h3>
+      <h3> {{'currencylist.Currency List' | translate}}</h3>
       <div class="provider_inner_content">
           <div class="table-responsive">   
               <div class="alert alert-danger alert-dismissible" *ngIf="error">
                   <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-                  <strong>Warning!</strong> {{responseMsg}}
+                  <strong> {{'currencylist.Warning!' | translate}}</strong> {{responseMsg}}
               </div>
               <div class="alert alert-success alert-dismissible" *ngIf="success">
                   <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-                  <strong>Success!</strong> Currency removed successfully
+                  <strong> {{'currencylist.Success!' | translate}}</strong> {{'currencylist.Currency removed successfully ' | translate}}
                 </div>      
               <table class="table">
                 <thead>
                   <tr>
-                    <th>Name</th>
-                    <th>Symbol</th>
-                    <th>Rate</th>
-                    <th>Forex Start from</th>
+                    <th> {{'currencylist.Name' | translate}}</th>
+                    <th> {{'currencylist.Symbol' | translate}}</th>
+                    <th> {{'currencylist.Rate' | translate}}</th>
+                    <th> {{'currencylist.Forex Start from' | translate}}</th>
                     <th class="textRight">
                       <button class="add" (click)="goToPage('checker/currency_add')">+</button>
                     </th>

src/app/checker/currency-list/currency-list.component.ts

@@ -12,7 +12,7 @@ import { ValidationService } from './../../providers/validation.service';
 export class CurrencyListComponent implements OnInit {
   currencyList: any[];
   fname: any;
-  lang =  'ar';
+  lang =  'en';
   responseMsg: any;
   error: boolean;
   success: boolean;

src/app/checker/editforex/editforex.component.html

@@ -4,43 +4,43 @@
 <header class="provider_header">
     <div class="row">
       <div class="col-md-6">
-        <h4>Forex Provider</h4>
+        <h4>  {{'editforex.Forex Provider' | translate}}</h4>
       </div>
       <div class="col-md-6 textRight relative">
           <button class="logout" (click)="goToPage('checker/home')">
             <img src="assets/images/asset_home.png">
-          Home</button>
+            {{'editforex.Home' | translate}}</button>
           <button class="logout" (click)="logout()">
               <img src="assets/images/asset_logout.png">
-            Logout</button>
+              {{'editforex.Logout' | translate}}</button>
           <img src="assets/images/asset_logo1.png">
-          <span (click)="goToPage('checker/changepin')">Change PIN</span>
+          <span (click)="goToPage('checker/changepin')"> {{'editforex.Change PIN' | translate}}</span>
       </div>
     </div>
   </header>
 <section>
     <div class="provider_content">
-      <h3>Edit Forex Provider</h3>
+      <h3>  {{'editforex.Edit Forex Provider' | translate}}</h3>
       <div class="provider_inner_content">
           <div class="alert alert-success alert-dismissible" *ngIf="success">
               <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-              <strong>Success!</strong> Provider updated successfully.
+              <strong> {{'editforex.Success! ' | translate}}</strong>   {{'editforex.Provider updated successfully.' | translate}}
             </div>
             <div class="alert alert-danger alert-dismissible" *ngIf="error">
                 <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-                <strong>Warning!</strong> {{responseMsg}}
+                <strong> {{'editforex.Warning! ' | translate}}</strong> {{responseMsg}}
             </div>
         <form [formGroup]="providerForm" (ngSubmit)="editProcess()" autocomplete="off">
         <div class="row">
           <div class="col">
             <div class="provider_data_content" *ngIf="provider">
-                <p>Provider Name</p>
+                <p>  {{'editforex.Provider Name' | translate}}</p>
                 <input class="provider_input" placeholder="" type="text" disabled [value]="provider.name">
             </div>
           </div>
           <div class="col">
               <div class="provider_data_content">
-                  <p>Location</p>
+                  <p>  {{'editforex.Location' | translate}}</p>
                   <input class="provider_input" placeholder="" type="text" formControlName="location">
               </div>
               <div class="s_error" *ngIf="!providerForm.controls['location'].valid && providerSubmit">
@@ -50,7 +50,7 @@
           
           <div class="col">
               <div class="provider_data_content" *ngIf="provider">
-                  <p>CR ID</p>
+                  <p>  {{'editforex.CR ID' | translate}}</p>
                   <input class="provider_input" placeholder="" type="text" disabled [value]="provider.cr_id">
               </div>
           </div>
@@ -58,7 +58,7 @@
         <div class="row">
             <div class="col">
                 <div class="provider_data_content">
-                    <p>CR Manager</p>
+                    <p>{{'editforex.CR Manager' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text"  formControlName="cr_manager">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['cr_manager'].valid && providerSubmit">
@@ -67,7 +67,7 @@
             </div>
             <div class="col">
                 <div class="provider_data_content">
-                    <p>Contact Name</p>
+                    <p>  {{'editforex.Contact Name' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text" formControlName="contact">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['contact'].valid">
@@ -79,7 +79,7 @@
               </div>
               <div class="col">
                   <div class="provider_data_content">
-                      <p>Phone</p>
+                      <p>  {{'editforex.Phone' | translate}}</p>
                       <input class="provider_input" placeholder="" type="number" formControlName="phone">
                   </div>
                   <div class="s_error" *ngIf="!providerForm.controls['phone'].valid && providerForm.controls['phone'].touched">
@@ -98,7 +98,7 @@
           <div class="row">
               <div class="col">
                   <div class="provider_data_content">
-                      <p>Email id</p>
+                      <p>  {{'editforex.Email id' | translate}}</p>
                       <input class="provider_input" placeholder="" type="mail" formControlName="email_id">
                   </div>
                   <div class="s_error" *ngIf="!providerForm.controls['email_id'].valid && providerForm.controls['email_id'].touched">
@@ -111,10 +111,10 @@
               </div>
                   <div class="col">
                     <div class="provider_data_content">
-                        <p>Status</p>
+                        <p>  {{'editforex.Status' | translate}}</p>
                         <select class="provider_input" formControlName="online_status">
-                          <option value="1">Online</option>
-                          <option value="0">Offline</option>
+                          <option value="1">  {{'editforex.Online' | translate}}</option>
+                          <option value="0">  {{'editforex.Offline' | translate}}</option>
                         </select>
                     </div>
                     <div class="s_error" *ngIf="!providerForm.controls['online_status'].valid && providerSubmit">
@@ -124,7 +124,7 @@
 
                   <div class="col">
                       <div class="provider_data_content">
-                          <p>Delivery Provider</p>
+                          <p>  {{'editforex.Delivery Provider' | translate}}</p>
                           <select class="provider_input" formControlName="deli_provider_id">
                             <option *ngFor="let provider of providerList" [value]="provider.id">{{provider.name}}</option>
                           </select>
@@ -143,8 +143,8 @@
             <div class="row">
               <div class="col">
                 <div class="add_provider_btn_bay">
-                  <button class="save_btn floatRight">Save</button>
-                  <button class="cancel_btn floatRight" (click)="cancelClick()">Cancel</button>
+                  <button class="save_btn floatRight">  {{'editforex.Save' | translate}}</button>
+                  <button class="cancel_btn floatRight" (click)="cancelClick()">  {{'editforex.Cancel' | translate}}</button>
                   <div class="clear"></div>
                 </div>
               </div>

src/app/checker/editprovider/editprovider.component.html

@@ -4,43 +4,43 @@
 <header class="provider_header">
     <div class="row">
       <div class="col-md-6">
-        <h4>Forex Delivery Service Provider</h4>
+        <h4> {{'editprovider.Forex Delivery Service Provider ' | translate}}</h4>
       </div>
       <div class="col-md-6 textRight relative">
           <button class="logout" (click)="goToPage('checker/home')">
             <img src="assets/images/asset_home.png">
-          Home</button>
+            {{'editprovider.Home' | translate}}</button>
             <button class="logout" (click)="logout()">
                     <img src="assets/images/asset_logout.png">
-                  Logout</button>
+                    {{'editprovider.Logout' | translate}}</button>
           <img src="assets/images/asset_logo1.png">
-          <span (click)="goToPage('checker/changepin')">Change PIN</span>
+          <span (click)="goToPage('checker/changepin')">  {{'editprovider.Change PIN' | translate}}</span>
       </div>
     </div>
   </header>
 <section>
     <div class="provider_content">
-      <h3>Edit Delivery Service Provider</h3>
+      <h3> {{'editprovider.Edit Delivery Service Provider' | translate}}</h3>
       <div class="provider_inner_content">
           <div class="alert alert-success alert-dismissible" *ngIf="success">
               <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-              <strong>Success!</strong> Provider updated successfully.
+              <strong>  {{'editprovider.Success!' | translate}}</strong>   {{'editprovider.Provider updated successfully.' | translate}}
             </div>
             <div class="alert alert-danger alert-dismissible" *ngIf="error">
                 <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-                <strong>Warning!</strong> {{responseMsg}}
+                <strong> {{'editprovider.Warning!' | translate}}</strong> {{responseMsg}}
             </div>
         <form [formGroup]="providerForm" (ngSubmit)="editProcess()" autocomplete="off">
         <div class="row">
           <div class="col">
             <div class="provider_data_content" *ngIf="provider">
-                <p>Provider Name</p>
+                <p> {{'editprovider.Provider Name ' | translate}}</p>
                 <input class="provider_input" placeholder="" type="text" disabled [value]="provider.name">
             </div>
           </div>
           <div class="col">
               <div class="provider_data_content">
-                  <p>Location</p>
+                  <p>  {{'editprovider.Location' | translate}}</p>
                   <input class="provider_input" placeholder="" type="text" formControlName="location">
               </div>
               <div class="s_error" *ngIf="!providerForm.controls['location'].valid && providerSubmit">
@@ -50,7 +50,7 @@
           
           <div class="col">
               <div class="provider_data_content" *ngIf="provider">
-                  <p>CR ID</p>
+                  <p>  {{'editprovider.CR ID' | translate}}</p>
                   <input class="provider_input" placeholder="" type="text" disabled [value]="provider.cr_id">
               </div>
           </div>
@@ -58,7 +58,7 @@
         <div class="row">
             <div class="col">
                 <div class="provider_data_content">
-                    <p>CR Manager</p>
+                    <p>  {{'editprovider.CR Manager' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text"  formControlName="cr_manager">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['cr_manager'].valid && providerSubmit">
@@ -67,7 +67,7 @@
             </div>
             <div class="col">
                 <div class="provider_data_content">
-                    <p>Contact Name</p>
+                    <p>  {{'editprovider.Contact Name' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text" formControlName="contact">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['contact'].valid">
@@ -79,7 +79,7 @@
               </div>
               <div class="col">
                   <div class="provider_data_content">
-                      <p>Phone</p>
+                      <p>  {{'editprovider.Phone' | translate}}</p>
                       <input class="provider_input" placeholder="" type="number" formControlName="phone">
                   </div>
                   <div class="s_error" *ngIf="!providerForm.controls['phone'].valid && providerForm.controls['phone'].touched">
@@ -98,7 +98,7 @@
           <div class="row">
               <div class="col">
                   <div class="provider_data_content">
-                      <p>Email id</p>
+                      <p>  {{'editprovider.Email id' | translate}}</p>
                       <input class="provider_input" placeholder="" type="mail" formControlName="email_id">
                   </div>
                   <div class="s_error" *ngIf="!providerForm.controls['email_id'].valid && providerForm.controls['email_id'].touched">
@@ -129,8 +129,8 @@
             <div class="row">
               <div class="col">
                 <div class="add_provider_btn_bay">
-                  <button class="save_btn floatRight">Save</button>
-                  <button class="cancel_btn floatRight" (click)="cancelClick()">Cancel</button>
+                  <button class="save_btn floatRight">  {{'editprovider.Save' | translate}}</button>
+                  <button class="cancel_btn floatRight" (click)="cancelClick()">  {{'editprovider.Cancel' | translate}}</button>
                   <div class="clear"></div>
                 </div>
               </div>

src/app/checker/forexprovider/forexprovider.component.html

@@ -4,43 +4,43 @@
 <header class="provider_header">
     <div class="row">
       <div class="col-md-6">
-        <h4>Forex Provider</h4>
+        <h4>{{'forexprovider.Forex Provider' | translate}}</h4>
       </div>
       <div class="col-md-6 textRight relative">
           <button class="logout" (click)="goToPage('checker/home')">
             <img src="assets/images/asset_home.png">
-          Home</button>
+           {{'forexprovider.Home' | translate}}</button>
           <button class="logout" (click)="logout()">
               <img src="assets/images/asset_logout.png">
-            Logout</button>
+             {{'forexprovider.Logout' | translate}}</button>
           <img src="assets/images/asset_logo1.png">
-          <span (click)="goToPage('checker/changepin')">Change PIN</span>
+          <span (click)="goToPage('checker/changepin')"> {{'forexprovider.Change PIN' | translate}}</span>
       </div>
     </div>
   </header>
 <section>
     <div class="provider_content">
-      <h3>Manage Forex Provider</h3>
+      <h3>{{'forexprovider.Manage Forex Provider' | translate}}</h3>
       <div class="provider_inner_content">
           <div class="table-responsive">   
               <div class="alert alert-danger alert-dismissible" *ngIf="error">
                   <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-                  <strong>Warning!</strong> {{responseMsg}}
+                  <strong> {{'forexprovider.Warning!' | translate}}</strong> {{responseMsg}}
               </div>
               <div class="alert alert-success alert-dismissible" *ngIf="success">
                   <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-                  <strong>Success!</strong> Forex provider removed successfully
+                  <strong> {{'forexprovider.Success!' | translate}}</strong>  {{'forexprovider.Forex provider removed successfully' | translate}}
                 </div>      
               <table class="table">
                 <thead>
                   <tr>
-                    <th>Provider Name</th>
-                    <th>Location</th>
-                    <th>CR Manager</th>
-                    <th>CR ID</th>
-                    <th>Contact Name</th>
-                    <th>Phone</th>
-                    <th>Email ID</th>
+                    <th> {{'forexprovider.Provider Name' | translate}}</th>
+                    <th> {{'forexprovider.Location' | translate}}</th>
+                    <th> {{'forexprovider.CR Manager' | translate}}</th>
+                    <th> {{'forexprovider.CR ID' | translate}}</th>
+                    <th> {{'forexprovider.Contact Name' | translate}}</th>
+                    <th> {{'forexprovider.Phone' | translate}}</th>
+                    <th> {{'forexprovider.Email ID' | translate}}</th>
                     <th class="textRight">
                       <button class="add" (click)="goToPage('checker/provider_forex')">+</button>
                     </th>

src/app/checker/forexprovider/forexprovider.component.ts

@@ -11,7 +11,7 @@ import { ValidationService } from './../../providers/validation.service';
 export class ForexproviderComponent implements OnInit {
   providerList: any[];
   fname: any;
-  lang =  'ar';
+  lang =  'en';
   responseMsg: any;
   error: boolean;
   success: boolean;

src/app/checker/home/home.component.html

 <header class="provider_header">
   <div class="row">
     <div class="col-md-6">
-      <h4>Forex Delivery Service Provider</h4>
+      <h4>{{'home.Forex Delivery Service Provider' | translate}}</h4>
     </div>
     <div class="col-md-6 textRight relative">
         <button class="logout" (click)="goToPage('checker/currency_list')">
             <img src="assets/images/asset_currency.png">
-          Currency</button>
+          {{'home.Currency' | translate}}</button>
         <button class="logout" (click)="logout()">
             <img src="assets/images/asset_logout.png">
-          Logout</button>
+           {{'home.Logout' | translate}}</button>
         <img src="assets/images/asset_logo1.png">
     </div>
   </div>
@@ -20,13 +20,13 @@
       <div class="col-md-6">
         <div class="forex_inner" (click)="clickForex()">
             <img src="assets/images/asset_forex.png">
-            <h5>Manage Forex Provider</h5>
+            <h5>{{'home.Manage Forex Provider' | translate}}</h5>
         </div>
       </div>
       <div class="col-md-6">
           <div class="forex_inner" (click)="clickDelivery()">
               <img src="assets/images/asset_manage.png">
-              <h5>Manage Delivery Provider</h5>
+              <h5> {{'home.Manage Delivery Provider' | translate}}</h5>
           </div>
       </div>
     </div>

src/app/checker/manageprovider/manageprovider.component.html

@@ -4,43 +4,43 @@
 <header class="provider_header">
     <div class="row">
       <div class="col-md-6">
-        <h4>Forex Delivery Service Provider</h4>
+        <h4>  {{'manageprovider.Forex Delivery Service Provider' | translate}}</h4>
       </div>
       <div class="col-md-6 textRight relative">
           <button class="logout" (click)="goToPage('checker/home')">
             <img src="assets/images/asset_home.png">
-          Home</button>
+           {{'manageprovider.Home' | translate}}</button>
           <button class="logout" (click)="logout()">
               <img src="assets/images/asset_logout.png">
-            Logout</button>
+             {{'manageprovider.Logout' | translate}}</button>
           <img src="assets/images/asset_logo1.png">
-          <span (click)="goToPage('checker/changepin')">Change PIN</span>
+          <span (click)="goToPage('checker/changepin')"> {{'manageprovider.Change PIN' | translate}}</span>
       </div>
     </div>
   </header>
 <section>
     <div class="provider_content">
-      <h3>Manage Delivery Service Provider</h3>
+      <h3> {{'manageprovider.Manage Delivery Service Provider' | translate}}</h3>
       <div class="provider_inner_content">
           <div class="table-responsive">   
               <div class="alert alert-danger alert-dismissible" *ngIf="error">
                   <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-                  <strong>Warning!</strong> {{responseMsg}}
+                  <strong> {{'manageprovider.Warning!' | translate}}</strong> {{responseMsg}}
               </div>
               <div class="alert alert-success alert-dismissible" *ngIf="success">
                   <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-                  <strong>Success!</strong> Delivery provider removed successfully
+                  <strong> {{'manageprovider.Success!' | translate}}</strong>{{'manageprovider.Delivery provider removed successfully' | translate}}
                 </div>      
               <table class="table">
                 <thead>
                   <tr>
-                    <th>Provider Name</th>
-                    <th>Location</th>
-                    <th>CR Manager</th>
-                    <th>CR ID</th>
-                    <th>Contact Name</th>
-                    <th>Phone</th>
-                    <th>Email ID</th>
+                    <th>{{'manageprovider.Provider Name' | translate}}</th>
+                    <th> {{'manageprovider.Location' | translate}}</th>
+                    <th> {{'manageprovider.CR Manager' | translate}}</th>
+                    <th> {{'manageprovider.CR ID' | translate}}</th>
+                    <th> {{'manageprovider.Contact Name' | translate}}</th>
+                    <th> {{'manageprovider.Phone' | translate}}</th>
+                    <th> {{'manageprovider.Email ID' | translate}}</th>
                     <th class="textRight">
                       <button class="add" (click)="goToPage('checker/provider_delivery')">+</button>
                     </th>

src/app/checker/manageprovider/manageprovider.component.ts

@@ -11,7 +11,7 @@ import { ValidationService } from './../../providers/validation.service';
 export class ManageproviderComponent implements OnInit {
   providerList: any[];
   fname: any;
-  lang =  'ar';
+  lang =  'en';
   responseMsg: any;
   error: boolean;
   success: boolean;

src/app/delivery/add-driver/add-driver.component.html

@@ -5,38 +5,38 @@
 <header class="provider_header">
   <div class="row">
     <div class="col-md-6">
-      <h4>Driver Management</h4>
+      <h4> {{'adddriver.Driver Management' | translate}}</h4>
     </div>
     <div class="col-md-6 textRight relative">
         <button class="logout" (click)="goToPage('delivery')">
             <img src="assets/images/asset_home.png">
-          Home</button>
+           {{'adddriver.Home' | translate}}</button>
         <button class="logout" (click)="logout()">
             <img src="assets/images/asset_logout.png">
-          Logout</button>
+           {{'adddriver.Logout' | translate}}</button>
         <img src="assets/images/asset_logo1.png">
-        <span (click)="goToPage('delivery/changepin')">Change PIN</span>
+        <span (click)="goToPage('delivery/changepin')"> {{'adddriver.Change PIN' | translate}}</span>
     </div>
   </div>
 </header>
 <section>
   <div class="provider_content">
     
-    <h3>Edit Driver</h3>
+    <h3> {{'adddriver.Edit Driver' | translate}}</h3>
     <div class="provider_inner_content">
           <div class="alert alert-success alert-dismissible" *ngIf="success">
             <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-            <strong>Success!</strong> Provider created successfully.
+            <strong> {{'adddriver.Success!' | translate}}</strong>  {{'adddriver.Provider created successfully.' | translate}}
           </div>
           <div class="alert alert-danger alert-dismissible" *ngIf="error">
               <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-              <strong>Warning!</strong> {{responseError}}
+              <strong>{{'adddriver.Warning! ' | translate}}</strong> {{responseError}}
           </div>
       <form [formGroup]="providerForm" (ngSubmit)="regProcess()" autocomplete="off">
         <div class="row">
           <div class="col">
             <div class="provider_data_content">
-                <p>Provider Name</p>
+                <p> {{'adddriver.Provider Name' | translate}}</p>
                 <input class="provider_input" placeholder="" type="text" formControlName="name">
             </div>
               <div class="s_error" *ngIf="!providerForm.controls['name'].valid && providerSubmit">
@@ -45,7 +45,7 @@
           </div>
           <div class="col">
               <div class="provider_data_content">
-                  <p>Pin</p>
+                  <p>{{'adddriver.Pin' | translate}}</p>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
@@ -56,7 +56,7 @@
           </div>
           <div class="col">
               <div class="provider_data_content">
-                  <p>Confirm Pin</p>
+                  <p> {{'adddriver.Confirm Pin' | translate}}</p>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
                   <input class="provider_pin" placeholder="" type="password" maxlength="1" value="0" readonly>
@@ -69,7 +69,7 @@
         <div class="row">
             <div class="col">
               <div class="provider_data_content">
-                  <p>Location</p>
+                  <p> {{'adddriver.Location' | translate}}</p>
                   <input class="provider_input" placeholder="" type="text" formControlName="location">
               </div>
               <div class="s_error" *ngIf="!providerForm.controls['location'].valid && providerSubmit">
@@ -78,7 +78,7 @@
             </div>
             <div class="col">
                 <div class="provider_data_content">
-                    <p>National ID</p>
+                    <p> {{'adddriver.National ID' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text" formControlName="cr_id">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['cr_id'].valid && providerSubmit">
@@ -87,7 +87,7 @@
             </div>
             <div class="col">
                 <div class="provider_data_content">
-                    <p>Manager ID</p>
+                    <p> {{'adddriver.Manager ID' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text"  formControlName="cr_manager">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['cr_manager'].valid && providerSubmit">
@@ -109,7 +109,7 @@
                 </div> -->
                 <div class="col">
                     <div class="provider_data_content">
-                        <p>Phone</p>
+                        <p> {{'adddriver.Phone' | translate}}</p>
                         <input class="provider_input" placeholder="" type="number" formControlName="phone">
                     </div>
                     <div class="s_error" *ngIf="!providerForm.controls['phone'].valid && providerForm.controls['phone'].touched">
@@ -126,7 +126,7 @@
                 </div>
                 <div class="col">
                     <div class="provider_data_content">
-                        <p>Email id</p>
+                        <p> {{'adddriver.Email id' | translate}}</p>
                         <input class="provider_input" placeholder="" type="mail" formControlName="email_id">
                     </div>
                     <div class="s_error" *ngIf="!providerForm.controls['email_id'].valid && providerForm.controls['email_id'].touched">
@@ -183,8 +183,8 @@
             <div class="row">
               <div class="col">
                 <div class="add_provider_btn_bay">
-                  <button class="save_btn floatRight">Save</button>
-                  <button class="cancel_btn floatRight" (click)="cancelClick()">Cancel</button>
+                  <button class="save_btn floatRight"> {{'adddriver.Save' | translate}}</button>
+                  <button class="cancel_btn floatRight" (click)="cancelClick()"> {{'adddriver.Cancel' | translate}}</button>
                   <div class="clear"></div>
                 </div>
               </div>

src/app/delivery/changepin/changepin.component.html

@@ -4,12 +4,12 @@
           <div class="login_inner">
              <img src="assets/images/asset_logo.png">
              <hr>
-             <h6>Change PIN</h6>
+             <h6> {{'changepin.Change PIN' | translate}}</h6>
              <div class="login_inner_content">
                
                 <br>
                 <div class="login_row">
-                    <p>Old PIN</p>
+                    <p>{{'changepin.Old PIN' | translate}}</p>
                     <div class="login_pin">
                       <input class="log_pin" type="password" maxlength="1" #old1  (keyup)="processKeyUp($event, old2)">
                       <input class="log_pin" type="password" maxlength="1" #old2 (keydown.backspace)="processBack($event, old1)" (keyup)="processKeyUp($event, old3)">
@@ -23,7 +23,7 @@
                      </div>
                  </div>
                  <div class="login_row">
-                    <p>New PIN</p>
+                    <p>{{'changepin.New PIN' | translate}}</p>
                     <div class="login_pin">
                       <input class="log_pin" type="password" maxlength="1" #new1 (keyup)="processKeyUp($event, new2)">
                       <input class="log_pin" type="password" maxlength="1" #new2 (keydown.backspace)="processBack($event, new1)" (keyup)="processKeyUp($event, new3)">
@@ -37,7 +37,7 @@
                      <div class="s_validation">{{error_msg.password}} </div>
                   </div>
                  <div class="login_row">
-                    <p>Confirm PIN</p>
+                    <p> {{'changepin.Confirm PIN' | translate}}</p>
                     <div class="login_pin">
                       <input class="log_pin" type="password" maxlength="1" #conf1  (keyup)="processKeyUp($event, conf2)">
                       <input class="log_pin" type="password" maxlength="1" #conf2 (keydown.backspace)="processBack($event, conf1)" (keyup)="processKeyUp($event, conf3)">
@@ -58,21 +58,21 @@
        </div>
        <div class="alert alert-danger alert-dismissible" *ngIf="resetError">
             <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-            <strong>Warning!</strong> {{resetMsg}}
+            <strong> {{'changepin.Warning!' | translate}}</strong> {{resetMsg}}
         </div>
 
        <div class="alert alert-success alert-dismissible" *ngIf="!resetError && !error && loginSubmit">
             <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-            <strong>Success!</strong> Password Updated Successfully
+            <strong> {{'changepin.Success!' | translate}}</strong> Password Updated Successfully {{'changepin.Save' | translate}}
           </div>
        <!-- <div *ngIf="!resetError && !error && loginSubmit" class="s_validation">Passwod Updated Successfully</div> -->
        <div class="login_btn_bay">
           <div class="row">
               <div class="col-md-6">
-                  <button class="cancel_btn" (click)="cancelClick()">Cancel</button>
+                  <button class="cancel_btn" (click)="cancelClick()"> {{'changepin.Cancel' | translate}}</button>
               </div>
               <div class="col-md-6">
-                <button class="login_btn" (click)="saveClick()">Save</button>
+                <button class="login_btn" (click)="saveClick()">{{'changepin.Save' | translate}}</button>
               </div>
            </div>
        </div>

src/app/delivery/delivery.module.ts

@@ -2,6 +2,7 @@ import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { moduleRouting } from './delivery.routing';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { TranslateModule} from '@ngx-translate/core';
 
 /* CUSTOM-COMPONENTS */
 
@@ -20,7 +21,8 @@ import { EditDriverComponent } from './edit-driver/edit-driver.component';
     CommonModule,
     moduleRouting,
     FormsModule,
-    ReactiveFormsModule
+    ReactiveFormsModule,
+    TranslateModule
   ]
 })
 export class DeliveryModule { }

src/app/delivery/edit-driver/edit-driver.component.html

@@ -4,43 +4,43 @@
 <header class="provider_header">
     <div class="row">
       <div class="col-md-6">
-        <h4>Forex Delivery Driver</h4>
+        <h4> {{'editdriver.Forex Delivery Driver' | translate}}</h4>
       </div>
       <div class="col-md-6 textRight relative">
           <button class="logout" (click)="goToPage('delivery')">
               <img src="assets/images/asset_home.png">
-            Home</button>
+             {{'editdriver.Home' | translate}}</button>
             <button class="logout" (click)="logout()">
                     <img src="assets/images/asset_logout.png">
-                  Logout</button>
+                   {{'editdriver.Logout' | translate}}</button>
           <img src="assets/images/asset_logo1.png">
-          <span (click)="goToPage('checker/changepin')">Change PIN</span>
+          <span (click)="goToPage('checker/changepin')"> {{'editdriver.Change PIN' | translate}}</span>
       </div>
     </div>
   </header>
 <section>
     <div class="provider_content">
-      <h3>Edit Forex Delivery Driver</h3>
+      <h3> {{'editdriver.Edit Forex Delivery Driver' | translate}}</h3>
       <div class="provider_inner_content">
           <div class="alert alert-success alert-dismissible" *ngIf="success">
               <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-              <strong>Success!</strong> Forex Delivery Driver updated successfully.
+              <strong> {{'editdriver.Success!' | translate}}</strong>  {{'editdriver.Forex Delivery Driver updated successfully.' | translate}}
             </div>
             <div class="alert alert-danger alert-dismissible" *ngIf="error">
                 <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-                <strong>Warning!</strong> {{responseMsg}}
+                <strong> {{'editdriver.Warning!' | translate}}</strong> {{responseMsg}}
             </div>
         <form [formGroup]="providerForm" (ngSubmit)="editProcess()" autocomplete="off">
         <div class="row">
           <div class="col">
             <div class="provider_data_content" *ngIf="provider">
-                <p>Provider Name</p>
+                <p> {{'editdriver.Provider Name' | translate}}</p>
                 <input class="provider_input" placeholder="" type="text" disabled [value]="provider.name">
             </div>
           </div>
           <div class="col">
               <div class="provider_data_content">
-                  <p>Location</p>
+                  <p>{{'editdriver.Location' | translate}}</p>
                   <input class="provider_input" placeholder="" type="text" formControlName="location">
               </div>
               <div class="s_error" *ngIf="!providerForm.controls['location'].valid && providerSubmit">
@@ -50,7 +50,7 @@
           
           <div class="col">
               <div class="provider_data_content" *ngIf="provider">
-                  <p>National ID</p>
+                  <p> {{'editdriver.National ID' | translate}}</p>
                   <input class="provider_input" placeholder="" type="text" disabled [value]="provider.cr_id">
               </div>
           </div>
@@ -58,7 +58,7 @@
         <div class="row">
             <div class="col">
                 <div class="provider_data_content">
-                    <p>Manager ID</p>
+                    <p> {{'editdriver.Manager ID' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text"  formControlName="cr_manager">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['cr_manager'].valid && providerSubmit">
@@ -67,7 +67,7 @@
             </div>
               <div class="col">
                   <div class="provider_data_content">
-                      <p>Phone</p>
+                      <p> {{'editdriver.Phone' | translate}}</p>
                       <input class="provider_input" placeholder="" type="number" formControlName="phone">
                   </div>
                   <div class="s_error" *ngIf="!providerForm.controls['phone'].valid && providerForm.controls['phone'].touched">
@@ -84,7 +84,7 @@
               </div>
               <div class="col">
                   <div class="provider_data_content">
-                      <p>Email id</p>
+                      <p> {{'editdriver.Email id' | translate}}</p>
                       <input class="provider_input" placeholder="" type="mail" formControlName="email_id">
                   </div>
                   <div class="s_error" *ngIf="!providerForm.controls['email_id'].valid && providerForm.controls['email_id'].touched">
@@ -100,8 +100,8 @@
             <div class="row">
               <div class="col">
                 <div class="add_provider_btn_bay">
-                  <button class="save_btn floatRight">Save</button>
-                  <button class="cancel_btn floatRight" (click)="cancelClick()">Cancel</button>
+                  <button class="save_btn floatRight"> {{'editdriver.Save' | translate}}</button>
+                  <button class="cancel_btn floatRight" (click)="cancelClick()"> {{'editdriver.Cancel' | translate}}</button>
                   <div class="clear"></div>
                 </div>
               </div>

src/app/delivery/editprovider/editprovider.component.html

@@ -4,43 +4,43 @@
 <header class="provider_header">
     <div class="row">
       <div class="col-md-6">
-        <h4>Forex Delivery Service Provider</h4>
+        <h4> {{'editprovider.Forex Delivery Service Provider' | translate}}</h4>
       </div>
       <div class="col-md-6 textRight relative">
           <button class="logout" (click)="goToPage('delivery')">
               <img src="assets/images/asset_home.png">
-            Home</button>
+              {{'editprovider.Home' | translate}}</button>
           <button class="logout" (click)="logout()">
               <img src="assets/images/asset_logout.png">
-            Logout</button>
+              {{'editprovider.Logout' | translate}}</button>
           <img src="assets/images/asset_logo1.png">
-          <span (click)="goToPage('forex/changepin')">Change PIN</span>
+          <span (click)="goToPage('forex/changepin')">  {{'editprovider.Change PIN' | translate}}</span>
       </div>
     </div>
   </header>
 <section>
     <div class="provider_content">
-      <h3>Edit Delivery Service Provider</h3>
+      <h3> {{'editprovider.Edit Delivery Service Provider' | translate}}</h3>
       <div class="provider_inner_content">
           <div class="alert alert-success alert-dismissible" *ngIf="success">
               <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-              <strong>Success!</strong> Provider updated successfully.
+              <strong>  {{'editprovider.Success!' | translate}}</strong>  {{'editprovider.Provider updated successfully. ' | translate}}
             </div>
             <div class="alert alert-danger alert-dismissible" *ngIf="error">
                 <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-                <strong>Warning!</strong> {{responseMsg}}
+                <strong>  {{'editprovider.Warning!' | translate}}</strong> {{responseMsg}}
             </div>
         <form [formGroup]="providerForm" (ngSubmit)="editProcess()" autocomplete="off">
         <div class="row">
           <div class="col">
             <div class="provider_data_content" *ngIf="provider">
-                <p>Provider Name</p>
+                <p>  {{'editprovider.Provider Name' | translate}}</p>
                 <input class="provider_input" placeholder="" type="text" disabled [value]="provider.name">
             </div>
           </div>
           <div class="col">
               <div class="provider_data_content">
-                  <p>Location</p>
+                  <p> {{'editprovider.Location' | translate}}</p>
                   <input class="provider_input" placeholder="" type="text" formControlName="location">
               </div>
               <div class="s_error" *ngIf="!providerForm.controls['location'].valid && providerSubmit">
@@ -50,7 +50,7 @@
           
           <div class="col">
               <div class="provider_data_content" *ngIf="provider">
-                  <p>CR ID</p>
+                  <p> {{'editprovider.CR ID' | translate}}</p>
                   <input class="provider_input" placeholder="" type="text" disabled [value]="provider.cr_id">
               </div>
           </div>
@@ -58,7 +58,7 @@
         <div class="row">
             <div class="col">
                 <div class="provider_data_content">
-                    <p>CR Manager</p>
+                    <p>  {{'editprovider.CR Manager' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text"  formControlName="cr_manager">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['cr_manager'].valid && providerSubmit">
@@ -67,7 +67,7 @@
             </div>
             <div class="col">
                 <div class="provider_data_content">
-                    <p>Contact Name</p>
+                    <p> {{'editprovider.Contact Name' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text" formControlName="contact">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['contact'].valid">
@@ -80,7 +80,7 @@
               </div>
               <div class="col">
                   <div class="provider_data_content">
-                      <p>Phone</p>
+                      <p>  {{'editprovider.Phone' | translate}}</p>
                       <input class="provider_input" placeholder="" type="number" formControlName="phone">
                   </div>
                   <div class="s_error" *ngIf="!providerForm.controls['phone'].valid && providerForm.controls['phone'].touched">
@@ -99,7 +99,7 @@
           <div class="row">
               <div class="col">
                   <div class="provider_data_content">
-                      <p>Email id</p>
+                      <p>  {{'editprovider.Email id' | translate}}</p>
                       <input class="provider_input" placeholder="" type="mail" formControlName="email_id">
                   </div>
                   <div class="s_error" *ngIf="!providerForm.controls['email_id'].valid && providerForm.controls['email_id'].touched">
@@ -126,8 +126,8 @@
             <div class="row">
               <div class="col">
                 <div class="add_provider_btn_bay">
-                  <button class="save_btn floatRight">Save</button>
-                  <button class="cancel_btn floatRight" (click)="cancelClick()">Cancel</button>
+                  <button class="save_btn floatRight">  {{'editprovider.Save' | translate}}</button>
+                  <button class="cancel_btn floatRight" (click)="cancelClick()">  {{'editprovider.Cancel' | translate}}</button>
                   <div class="clear"></div>
                 </div>
               </div>

src/app/delivery/index/index.component.html

 <div class="delivery_provider_content">
-        
     <router-outlet></router-outlet> 
 </div>

src/app/delivery/list-driver/list-driver.component.html

@@ -4,42 +4,42 @@
 <header class="provider_header">
     <div class="row">
       <div class="col-md-6">
-        <h4>Driver Management</h4>
+        <h4> {{'listdriver.Driver Management' | translate}}</h4>
       </div>
       <div class="col-md-6 textRight relative">
           <button class="logout" (click)="goToPage('delivery')">
             <img src="assets/images/asset_home.png">
-          Home</button>
+           {{'listdriver.Home' | translate}}</button>
           <button class="logout" (click)="logout()">
               <img src="assets/images/asset_logout.png">
-            Logout</button>
+             {{'listdriver.Logout' | translate}}</button>
           <img src="assets/images/asset_logo1.png">
-          <span (click)="goToPage('checker/changepin')">Change PIN</span>
+          <span (click)="goToPage('checker/changepin')"> {{'listdriver.Change PIN' | translate}}</span>
       </div>
     </div>
   </header>
 <section>
     <div class="provider_content">
-      <h3>Driver List</h3>
+      <h3> {{'listdriver.Driver List' | translate}}</h3>
       <div class="provider_inner_content">
           <div class="table-responsive">   
               <div class="alert alert-danger alert-dismissible" *ngIf="error">
                   <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-                  <strong>Warning!</strong> {{responseMsg}}
+                  <strong> {{'listdriver.Warning!' | translate}}</strong> {{responseMsg}}
               </div>
               <div class="alert alert-success alert-dismissible" *ngIf="success">
                   <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-                  <strong>Success!</strong> Forex provider removed successfully
+                  <strong> {{'listdriver.Success!' | translate}}</strong>  {{'listdriver.Forex provider removed successfully' | translate}}
                 </div>      
               <table class="table">
                 <thead>
                   <tr>
-                    <th>Provider Name</th>
-                    <th>Location</th>
-                    <th>Manager ID</th>
-                    <th>National ID</th>
-                    <th>Phone</th>
-                    <th>Email ID</th>
+                    <th> {{'listdriver.Provider Name' | translate}}</th>
+                    <th> {{'listdriver.Location' | translate}}</th>
+                    <th> {{'listdriver.Manager ID' | translate}}</th>
+                    <th> {{'listdriver.National ID' | translate}}</th>
+                    <th> {{'listdriver.Phone' | translate}}</th>
+                    <th> {{'listdriver.Email ID' | translate}}</th>
                     <th class="textRight">
                       <button class="add" (click)="goToPage('delivery/driveradd')">+</button>
                     </th>

src/app/delivery/list-driver/list-driver.component.ts

@@ -11,7 +11,7 @@ import { ValidationService } from './../../providers/validation.service';
 export class ListDriverComponent implements OnInit {
   providerList: any[];
   fname: any;
-  lang =  'ar';
+  lang =  'en';
   responseMsg: any;
   error: boolean;
   success: boolean;

src/app/delivery/transaction/transaction.component.html

@@ -4,48 +4,48 @@
 <header class="provider_header">
     <div class="row">
       <div class="col-md-6">
-        <h4>Forex Transaction List</h4>
+        <h4> {{'transaction.Forex Transaction List' | translate}}</h4>
       </div>
       <div class="col-md-6 textRight relative">
           <button class="logout" (click)="goToPage('delivery/driverlist')">
             <img src="assets/images/asset_driver.png">
-          Driver Management</button>
+           {{'transaction.Driver Management' | translate}}</button>
           <button class="logout" (click)="goToPage('delivery/editprovider')">
             <img src="assets/images/asset_settings.png">
-          Settings</button>
+           {{'transaction.Settings' | translate}}</button>
           <button class="logout" (click)="logout()">
               <img src="assets/images/asset_logout.png">
-            Logout</button>
+             {{'transaction.Logout' | translate}}</button>
           <img src="assets/images/asset_logo1.png">
-          <span (click)="goToPage('delivery/changepin')">Change PIN</span>
+          <span (click)="goToPage('delivery/changepin')"> {{'transaction.Change PIN' | translate}}</span>
       </div>
     </div>
   </header>
 <section>
     <div class="provider_content">
-      <h3>Manage Transaction</h3>
+      <h3> {{'transaction.Manage Transaction' | translate}}</h3>
       <div class="provider_inner_content">
           <div class="alert alert-danger alert-dismissible" *ngIf="error">
               <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-              <strong>Warning!</strong> {{responseMsg}}
+              <strong> {{'transaction.Warning!' | translate}}</strong> {{responseMsg}}
           </div>
           <div class="alert alert-success alert-dismissible" *ngIf="success">
               <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-              <strong>Success!</strong> Forex provider removed successfully
+              <strong> {{'transaction.Success!' | translate}}</strong>  {{'transaction.Forex provider removed successfully' | translate}}
             </div> 
           <div class="table-responsive">          
               <table class="table">
                 <thead>
                   <tr>
-                    <th>User Info</th>
-                    <th>Phone</th>
-                    <th>Location</th>
-                    <th>Currency</th>
-                    <th>Amount</th>
-                    <th>Forex Amount</th>
-                    <th>Date</th>
-                    <th>Driver</th>
-                    <th>Status</th>
+                    <th> {{'transaction.User Info' | translate}}</th>
+                    <th> {{'transaction.Phone' | translate}}</th>
+                    <th> {{'transaction.Location' | translate}}</th>
+                    <th> {{'transaction.Currency' | translate}}</th>
+                    <th> {{'transaction.Amount' | translate}}</th>
+                    <th>{{'transaction.Forex Amount' | translate}}</th>
+                    <th> {{'transaction.Date' | translate}}</th>
+                    <th> {{'transaction.Driver' | translate}}</th>
+                    <th> {{'transaction.Status' | translate}}</th>
                     <th class="textRight"></th>
                   </tr>
                 </thead>
@@ -83,39 +83,39 @@
           <div class="forex_modal_wrapper">
               <div class="alert alert-danger alert-dismissible" *ngIf="assignError">
                   <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-                  <strong>Warning!</strong> Assign Driver failed
+                  <strong>{{'transaction.Warning! ' | translate}}</strong> {{'transaction. Assign Driver failed' | translate}}
               </div>
             <div class="forex_modal_header">
-                <h5 class="floatLeft">Assign Driver</h5>
+                <h5 class="floatLeft"> {{'transaction.Assign Driver' | translate}}</h5>
                 <button type="button" class="close floatRight" data-dismiss="modal">&times;</button>
                 <div class="clear"></div>
             </div> 
             <div class="forex_inner_wrapper" *ngIf="selectedData">
               <div class="row">
-                    <div class="col"><p>User</p></div>
+                    <div class="col"><p> {{'transaction.User' | translate}}</p></div>
                     <div class="col"><p>{{getCustomer(selectedData.user_info,'name') | titlecase}}</p></div>
               </div>
               <div class="row">
-                  <div class="col"><p>Location</p></div>
+                  <div class="col"><p> {{'transaction.Location' | translate}}</p></div>
                   <div class="col"><p>{{getCustomer(selectedData.user_info,'location')}}</p></div>
                 </div>
                 <div class="row">
-                        <div class="col"><p>Amount</p></div>
+                        <div class="col"><p> {{'transaction.Amount' | translate}}</p></div>
                         <div class="col"><p>{{selectedData.symbol + selectedData.convert_price}}</p></div>
                     </div>
                 <div class="row" *ngIf="driverList">
                     <div class="col-md-12">
-                      <p>Driver</p>
+                      <p> {{'transaction.Driver' | translate}}</p>
                       <select class="provider_input" (change)="selectDriver($event.target.value)">
-                          <option disabled hidden>Assign Driver</option>
+                          <option disabled hidden> {{'transaction.Assign Driver' | translate}}</option>
                           <option *ngFor="let provider of driverList" [value]="provider.id">{{provider.name}}</option>
                         </select>
                     </div>
                 </div>
             </div>
             <div class="forex_modal_footer_btn_bay textRight">
-              <button class="okay_btn" (click)="driverAssign()" [disabled]="driverStatus" data-dismiss="modal">Assign</button>
-              <button class="cancel_btn" data-dismiss="modal">Cancel</button>
+              <button class="okay_btn" (click)="driverAssign()" [disabled]="driverStatus" data-dismiss="modal"> {{'transaction.Assign' | translate}}</button>
+              <button class="cancel_btn" data-dismiss="modal"> {{'transaction.Cancel' | translate}}</button>
             </div>
           </div>
         </div>

src/app/delivery/transaction/transaction.component.ts

@@ -11,7 +11,7 @@ import { ValidationService } from './../../providers/validation.service';
 export class TransactionComponent implements OnInit {
   transactionList: any[];
   fname: any;
-  lang =  'ar';
+  lang =  'en';
   responseMsg: any;
   error: boolean;
   success: boolean;

src/app/forex/currency/currency.component.html

@@ -4,36 +4,36 @@
 <header class="provider_header">
   <div class="row">
     <div class="col-md-6">
-      <h4>Forex Currency Rate</h4>
+      <h4>{{'currency.Forex Currency Rate' | translate}}</h4>
     </div>
     <div class="col-md-6 textRight relative">
         <button class="logout" (click)="goToPage('forex')">
             <img src="assets/images/asset_home.png">
-          Home</button>
+          {{'currency.Home' | translate}}</button>
         <button class="logout" (click)="logout()">
             <img src="assets/images/asset_logout.png">
-          Logout</button>
+          {{'currency.Logout' | translate}}</button>
         <img src="assets/images/asset_logo1.png">
     </div>
   </div>
 </header>
 <section>
   <div class="provider_content">
-    <h3>Currency & Rates</h3>
+    <h3>{{'currency.Currency & Rates' | translate}}</h3>
     <div class="provider_inner_content">
         <div class="alert alert-danger alert-dismissible" *ngIf="error">
             <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-            <strong>Warning!</strong> {{responseMsg}}
+            <strong>{{'currency.Warning' | translate}}!</strong> {{responseMsg}}
         </div>
         <div class="alert alert-success alert-dismissible" *ngIf="success">
             <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-            <strong>Success!</strong> Currency assigned successfully
+            <strong>{{'currency.Success' | translate}}!</strong>{{'currency.Currency assigned successfully' | translate}} 
           </div> 
       <div class="row">
         <div class="col-md-6">
           <div class="row">
             <div class="col-md-12">
-                <p>Currency</p>
+                <p>{{'currency.Currency' | translate}}</p>
             </div>
           </div>
           <div class="row">
@@ -45,8 +45,8 @@
                     </div>
               </div>
               <div class="col-md-4 textCenter">
-                <button class="add_btn" (click)="currency_push()">Add<img src="assets/images/right.png"></button><br>
-                <button class="add_btn" (click)="currency_pop()"><img src="assets/images/left.png">Remove</button>
+                <button class="add_btn" (click)="currency_push()">{{'currency.Add' | translate}}<img src="assets/images/right.png"></button><br>
+                <button class="add_btn" (click)="currency_pop()"><img src="assets/images/left.png">{{'currency.Remove' | translate}}</button>
               </div>
               <div class="col-md-4">
                   <div class="currency_div">
@@ -62,7 +62,7 @@
             <form [formGroup]="currencyForm" novalidate (ngSubmit)="currency_assign()">
             <div class="row">
                 <div class="col-md-12">
-                    <p>Rates</p>
+                    <p>{{'currency.Save' | translate}}Rates</p>
                 </div>
               </div>
               
@@ -95,8 +95,8 @@
       <div class="row" *ngIf="selectedList.length > 0">
         <div class="col">
           <div class="add_provider_btn_bay textCenter">
-            <button class="save_btn ">Save</button>
-            <button class="cancel_btn" (click)="cancelClick()" type="button">Cancel</button>
+            <button class="save_btn ">{{'currency.Save' | translate}}</button>
+            <button class="cancel_btn" (click)="cancelClick()" type="button">{{'currency.Cancel' | translate}}</button>
             <div class="clear"></div>
           </div>
         </div>

src/app/forex/currency/currency.component.ts

@@ -14,7 +14,7 @@ export class CurrencyComponent implements OnInit {
   currencyList: any[];
   avaliableList: any[];
   fname: any;
-  lang =  'ar';
+  lang =  'en';
   responseMsg: any;
   error: boolean;
   success: boolean;

src/app/forex/editprovider/editprovider.component.html

@@ -4,43 +4,43 @@
 <header class="provider_header">
     <div class="row">
       <div class="col-md-6">
-        <h4>Forex Provider</h4>
+        <h4>{{'editprovider.Forex Provider' | translate}}</h4>
       </div>
       <div class="col-md-6 textRight relative">
           <button class="logout" (click)="goToPage('forex')">
               <img src="assets/images/asset_home.png">
-            Home</button>
+            {{'editprovider.Home' | translate}}</button>
           <button class="logout" (click)="logout()">
               <img src="assets/images/asset_logout.png">
-            Logout</button>
+            {{'editprovider.Logout' | translate}}</button>
           <img src="assets/images/asset_logo1.png">
-          <span (click)="goToPage('forex/changepin')">Change PIN</span>
+          <span (click)="goToPage('forex/changepin')">{{'editprovider.Change PIN' | translate}}</span>
       </div>
     </div>
   </header>
 <section>
     <div class="provider_content">
-      <h3>Edit Forex Provider</h3>
+      <h3>{{'editprovider.Edit Forex Provider' | translate}}</h3>
       <div class="provider_inner_content">
           <div class="alert alert-success alert-dismissible" *ngIf="success">
               <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-              <strong>Success!</strong> Provider updated successfully.
+              <strong>{{'editprovider.Success' | translate}}!</strong> {{'editprovider.Provider updated successfully' | translate}}.
             </div>
             <div class="alert alert-danger alert-dismissible" *ngIf="error">
                 <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-                <strong>Warning!</strong> {{responseMsg}}
+                <strong>{{'editprovider.Warning' | translate}}!</strong> {{responseMsg}}
             </div>
         <form [formGroup]="providerForm" (ngSubmit)="editProcess()" autocomplete="off">
         <div class="row">
           <div class="col">
             <div class="provider_data_content" *ngIf="provider">
-                <p>Provider Name</p>
+                <p>{{'editprovider.Provider Name' | translate}}</p>
                 <input class="provider_input" placeholder="" type="text" disabled [value]="provider.name">
             </div>
           </div>
           <div class="col">
               <div class="provider_data_content">
-                  <p>Location</p>
+                  <p>{{'editprovider.Location' | translate}}</p>
                   <input class="provider_input" placeholder="" type="text" formControlName="location">
               </div>
               <div class="s_error" *ngIf="!providerForm.controls['location'].valid && providerSubmit">
@@ -50,7 +50,7 @@
           
           <div class="col">
               <div class="provider_data_content" *ngIf="provider">
-                  <p>CR ID</p>
+                  <p>{{'editprovider.CR ID' | translate}}</p>
                   <input class="provider_input" placeholder="" type="text" disabled [value]="provider.cr_id">
               </div>
           </div>
@@ -58,7 +58,7 @@
         <div class="row">
             <div class="col">
                 <div class="provider_data_content">
-                    <p>CR Manager</p>
+                    <p>{{'editprovider.CR Manager' | translate}}</p>
                     <input class="provider_input" placeholder="" type="text"  formControlName="cr_manager">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['cr_manager'].valid && providerSubmit">
@@ -67,7 +67,7 @@
             </div>
             <div class="col">
                 <div class="provider_data_content">
-                    <p>Contact Name</p>
+                    <p>{{'editprovider.Contact Name' | translate}} </p>
                     <input class="provider_input" placeholder="" type="text" formControlName="contact">
                 </div>
                 <div class="s_error" *ngIf="!providerForm.controls['contact'].valid">
@@ -79,7 +79,7 @@
               </div>
               <div class="col">
                   <div class="provider_data_content">
-                      <p>Phone</p>
+                      <p>{{'editprovider.Phone' | translate}}</p>
                       <input class="provider_input" placeholder="" type="number" formControlName="phone">
                   </div>
                   <div class="s_error" *ngIf="!providerForm.controls['phone'].valid && providerForm.controls['phone'].touched">
@@ -98,7 +98,7 @@
           <div class="row">
               <div class="col">
                   <div class="provider_data_content">
-                      <p>Email id</p>
+                      <p>{{'editprovider.Email id' | translate}}</p>
                       <input class="provider_input" placeholder="" type="mail" formControlName="email_id">
                   </div>
                   <div class="s_error" *ngIf="!providerForm.controls['email_id'].valid && providerForm.controls['email_id'].touched">
@@ -111,10 +111,10 @@
               </div>
                   <div class="col">
                     <div class="provider_data_content">
-                        <p>Status</p>
+                        <p>{{'editprovider.Status' | translate}}</p>
                         <select class="provider_input" formControlName="online_status">
-                          <option value="1">Online</option>
-                          <option value="0">Offline</option>
+                          <option value="1">{{'editprovider.Online' | translate}}</option>
+                          <option value="0">{{'editprovider.Offline' | translate}}</option>
                         </select>
                     </div>
                     <div class="s_error" *ngIf="!providerForm.controls['online_status'].valid && providerSubmit">
@@ -124,7 +124,7 @@
 
                   <div class="col">
                       <div class="provider_data_content">
-                          <p>Delivery Provider</p>
+                          <p>{{'editprovider.Delivery Provider' | translate}}</p>
                           <select class="provider_input" formControlName="deli_provider_id">
                             <option *ngFor="let provider of providerList" [value]="provider.id">{{provider.name}}</option>
                           </select>
@@ -143,8 +143,8 @@
             <div class="row">
               <div class="col">
                 <div class="add_provider_btn_bay">
-                  <button class="save_btn floatRight">Save</button>
-                  <button class="cancel_btn floatRight" (click)="cancelClick()">Cancel</button>
+                  <button class="save_btn floatRight">{{'editprovider.Save' | translate}}</button>
+                  <button class="cancel_btn floatRight" (click)="cancelClick()">{{'editprovider.Cancel' | translate}}</button>
                   <div class="clear"></div>
                 </div>
               </div>

src/app/forex/editprovider/editprovider.component.ts

@@ -12,7 +12,7 @@ import { FormControl, FormGroup, FormBuilder, Validators, ValidationErrors } fro
 export class EditproviderComponent implements OnInit {
   provider: any;
   funcName: any;
-  lang =  'ar';
+  lang =  'en';
   responseMsg: any;
   error: boolean;
   success: boolean;

src/app/forex/forex.module.ts

@@ -2,6 +2,8 @@ import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { moduleRouting } from './forex.routing';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { TranslateModule} from '@ngx-translate/core';
+
 
 // IMPORTED-PAGE-COMPONENTS
 
@@ -19,7 +21,8 @@ import { CurrencyComponent } from './currency/currency.component';
     CommonModule,
     moduleRouting,
     FormsModule,
-    ReactiveFormsModule
+    ReactiveFormsModule,
+    TranslateModule
   ]
 })
 export class ForexModule { }

src/app/forex/transaction/transaction.component.html

@@ -4,47 +4,47 @@
 <header class="provider_header">
     <div class="row">
       <div class="col-md-6">
-        <h4>Forex Transaction List</h4>
+        <h4>{{'transaction.Forex Transaction List' | translate}}</h4>
       </div>
       <div class="col-md-6 textRight relative">
           <button class="logout" (click)="goToPage('forex/currency')">
             <img src="assets/images/asset_currency.png">
-          Currency</button>
+          {{'transaction.Currency' | translate}}</button>
           <button class="logout" (click)="goToPage('forex/editprovider')">
             <img src="assets/images/asset_settings.png">
-          Settings</button>
+          {{'transaction.Settings' | translate}}</button>
           <button class="logout" (click)="logout()">
               <img src="assets/images/asset_logout.png">
-            Logout</button>
+            {{'transaction.Logout' | translate}}</button>
           <img src="assets/images/asset_logo1.png">
-          <span (click)="goToPage('forex/changepin')">Change PIN</span>
+          <span (click)="goToPage('forex/changepin')">{{'transaction.Change PIN' | translate}}</span>
       </div>
     </div>
   </header>
 <section>
     <div class="provider_content">
-      <h3>Manage Transaction</h3>
+      <h3>{{'transaction.Manage Transaction' | translate}}</h3>
       <div class="provider_inner_content">
           <div class="alert alert-danger alert-dismissible" *ngIf="error">
               <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-              <strong>Warning!</strong> {{responseMsg}}
+              <strong>{{'transaction.Warning' | translate}}!</strong> {{responseMsg}}
           </div>
           <div class="alert alert-success alert-dismissible" *ngIf="success">
               <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
-              <strong>Success!</strong> Forex provider removed successfully
+              <strong>{{'transaction.Success' | translate}}!</strong> {{'transaction.Forex provider removed successfully' | translate}}
             </div> 
           <div class="table-responsive">          
               <table class="table">
                 <thead>
                   <tr>
-                    <th>User Info</th>
-                    <th>Phone</th>
-                    <th>Location</th>
-                    <th>Currency</th>
-                    <th>Amount</th>
-                    <th>Forex Amount</th>
-                    <th>Driver</th>
-                    <th>Status</th>
+                    <th>{{'transaction.User Info' | translate}}</th>
+                    <th>{{'transaction.Phone' | translate}}</th>
+                    <th>{{'transaction.Location' | translate}}</th>
+                    <th>{{'transaction.Currency' | translate}}</th>
+                    <th>{{'transaction.Amount' | translate}}</th>
+                    <th>{{'transaction.Forex Amount' | translate}}</th>
+                    <th>{{'transaction.Driver' | translate}}</th>
+                    <th>{{'transaction.Status' | translate}}</th>
                   </tr>
                 </thead>
                 <tbody *ngIf="transactionList">

src/app/forex/transaction/transaction.component.ts

@@ -11,7 +11,7 @@ import { ValidationService } from './../../providers/validation.service';
 export class TransactionComponent implements OnInit {
   transactionList: any[];
   fname: any;
-  lang =  'ar';
+  lang =  'en';
   responseMsg: any;
   error: boolean;
   success: boolean;

src/app/providers/subject.service.ts

@@ -8,11 +8,20 @@ import { BehaviorSubject } from 'rxjs/BehaviorSubject';
 export class SubjectService {
   private loginDetails = new BehaviorSubject<any>(null);
   private isLoggined = new BehaviorSubject<any>(null);
+  private isLang = new BehaviorSubject<any>(null);
 
   sendLoginData(loginData: any) {
     this.loginDetails.next(loginData);
   }
 
+  changeLang(langData: any) {
+    this.isLang.next(langData);
+  }
+
+  getLangData(): Observable<any> {
+    return this.isLang.asObservable();
+  }
+
   getLoginData(): Observable<any> {
     return this.loginDetails.asObservable();
   }

src/app/start/forgot/forgot.component.html

@@ -4,17 +4,17 @@
           <div class="login_inner">
              <img src="assets/images/asset_logo.png">
              <hr>
-             <h6>Forgot your PIN</h6>
+             <h6>
+                  {{'forgot.Forgot your PIN' | translate}}
+             </h6>
              <div class="login_inner_content">
                 
                 <br>
                <div class="login_row">
-                  <input class="" placeholder="Email Address">
+                  <input class="" placeholder=" {{'forgot.Email Address' | translate}}">
                </div>
                <div class="login_row">
-              
-                        <button class="login_btn" (click)="goToPage('start/newpin')">SEND ME THE LINK</button>
-               
+                  <button class="login_btn" (click)="goToPage('start/newpin')">{{'forgot.SEND ME THE LINK' | translate}}</button>
                </div>
              </div>
           </div>

src/app/start/invalid/invalid.component.html

@@ -3,9 +3,14 @@
      <div class="row">
         <div class="login_inner">
            <img src="assets/images/asset_logo.png">
-           <hr>
            <div class="login_inner_content">
-             Page not found. <span (click)="back_fun()" style="color: blue;cursor: pointer;">Back</span>
+              <div class="invalid_content">
+                  <img src="assets/images/asset_denied.png"><br>
+                  {{'invalid.Access Denied' | translate}} <span (click)="back_fun()"> <strong>
+                        {{'invalid.Go Back' | translate}}
+                  </strong> </span>
+              </div> 
+            
            </div>
         </div>
      </div>

src/app/start/invalid/invalid.component.scss

@@ -91,3 +91,12 @@
         padding-right: 10px;
     }
 }
+
+.invalid_content{
+    font-size: 30px;
+    color: #1a5c7c;
+    strong{
+        color: #cd3d3d;
+        cursor: pointer;
+    }
+}
\ No newline at end of file

src/app/start/login/login.component.html

@@ -6,7 +6,7 @@
              <hr>
              <div class="login_inner_content">
                <div class="login_row">
-                  <input type="email" class="" placeholder="Email Address" pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$" required #email_id="ngModel" id="email_id" [(ngModel)]="model.email_id">
+                  <input type="email" class="" placeholder="{{'login.Email Address' | translate}}" pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$" required #email_id="ngModel" id="email_id" [(ngModel)]="model.email_id">
                   <div class="md-errors-spacer" [hidden]="email_id.valid || email_id.untouched">
                      <div class="s_error" *ngIf="email_id.errors && email_id.errors.required">
                         <div class="s_validation">{{error_msg.required}} </div>
@@ -20,7 +20,8 @@
                   </div>
                </div>
                <div class="login_row">
-                  <p>Enter Your 6-Digit PIN</p>
+
+                  <p>{{'login.Enter Your 6-Digit PIN' | translate}}</p>
                   <div class="login_pin">
                     <input class="log_pin" type="password" maxlength="1" #focus1 (keyup)="processKeyUp($event, focus2)">
                     <input class="log_pin" type="password" maxlength="1"  #focus2 (keydown.backspace)="processBack($event, focus1)" (keyup)="processKeyUp($event, focus3)">
@@ -35,20 +36,20 @@
                </div>
                <div *ngIf="loginError" class="s_validation">{{loginMsg}}</div>
                <div class="login_row">
-                        <button class="login_btn" (click)="loginClick()">Login</button>
+                        <button class="login_btn" (click)="loginClick()">{{'login.Login' | translate}}</button>
                </div>
                <div class="login_row">
-                  <h6 (click)="goToPage('start/forgot')">Forgot Password</h6>
+                  <h6 (click)="goToPage('start/forgot')">{{'login.Forgot Password' | translate}}</h6>
                </div>
-               <!-- <div class="login_row">
-                     <p class="textCenter" style="text-align:center !important;">Choose Language</p>
+              <div class="login_row">
+                     <p class="textCenter" style="text-align:center !important;">{{'login.Choose Language' | translate}}</p>
                      <br>
                    
-                     <select id="translation" class="translation" (change)="changeLang($event.target.value)">
-                           <option value="0">English</option>
+                     <select id="translation" class="translation" #language (change)="changeLang($event.target.value)">
+                           <option value="0" selected>English</option>
                            <option value="1">Arabic</option>
                          </select>
-               </div> -->
+               </div> 
              </div>
           </div>
        </div>

src/app/start/login/login.component.scss

@@ -4,9 +4,9 @@
         text-align: center;
         width:100%;
         padding-top:5%;
-
         img{
-            margin-bottom: 40px;
+            margin-bottom:30px;
+            width: 180px;
         }
         hr{
            border:5px solid #f69d1b; 
@@ -18,7 +18,7 @@
             width:325px;
             margin: 0 auto;
             .login_row{
-                margin-bottom: 40px;
+                margin-bottom:30px;
                 input{
                     width:100%;
                     height:50px;
@@ -45,7 +45,7 @@
                     width:100%;
                     text-align: left;
                     padding-top: 15px;
-                    padding-bottom: 10%;
+                    padding-bottom:5%;
                     .log_pin{
                         border:1px solid #d8d8d8;
                         display: inline-block;

src/app/start/login/login.component.ts

@@ -3,8 +3,8 @@ import { Router, ActivatedRoute } from '@angular/router';
 import { ValidationService } from './../../providers/validation.service';
 import { SubjectService } from './../../providers/subject.service';
 import { WebService } from './../../providers/web.service';
-
 import * as $ from 'jquery';
+
 @Component({
   selector: 'app-login',
   templateUrl: './login.component.html',
@@ -20,6 +20,7 @@ export class LoginComponent implements OnInit {
   @ViewChild('focus4') focus4: ElementRef;
   @ViewChild('focus5') focus5: ElementRef;
   @ViewChild('focus6') focus6: ElementRef;
+  @ViewChild('language') language: ElementRef;
   error_msg: any[];
   lang =  'en';
   model: any;
@@ -30,14 +31,19 @@ export class LoginComponent implements OnInit {
   loginError: boolean;
   loginMsg: any;
   loginDetails: any;
+  val = 0;
+  
 
   constructor(
     private router: Router,
     private route: ActivatedRoute,
     public vs: ValidationService,
     public service: WebService,
-    public subjectService: SubjectService
+    public subjectService: SubjectService,
   ) {
+    //this.language.nativeElement.value = this.service.getLocalStorageItem('lang');
+    
+    this.lang = this.service.getLocalStorageItem('lang');
     this.error_msg = this.vs.errorList[this.lang];
     console.log(this.error_msg);
     this.passwordErr = false;
@@ -58,6 +64,7 @@ export class LoginComponent implements OnInit {
       }
     });
 
+
     /* this.subjectService.getisLoggined().subscribe(isLoggined => {
       console.log(isLoggined);
       if (isLoggined != null) {
@@ -70,6 +77,7 @@ export class LoginComponent implements OnInit {
 
   ngOnInit() {
     this.model = {'email_id': '', 'password': ''};
+    this.language.nativeElement.value = this.lang === 'ar'?1:0;
   }
 
   goToPage(path: any, data = null) {
@@ -90,13 +98,7 @@ export class LoginComponent implements OnInit {
   }
 
 
-  changeLang(val: string) {
-    /*if (val === '1') {
-      $('body').addClass('ar');
-    } else {
-      $('body').removeClass('ar');
-    }*/
-  }
+
 
   processBack (e: any, el: any) {
     console.log(e);
@@ -163,4 +165,17 @@ export class LoginComponent implements OnInit {
     });
   }
 
+  changeLang(val: string) {
+    if (val === '1') {
+      $('body').addClass('ar');
+      this.lang = 'ar';
+      this.service.setLocalStorageItem('lang', 'ar');
+    } else {
+      $('body').removeClass('ar');
+      this.lang = 'en';
+      this.service.setLocalStorageItem('lang', 'en');
+    }
+    this.subjectService.changeLang(val);
+  }
+
 }

src/app/start/newpin/newpin.component.html

@@ -4,12 +4,12 @@
           <div class="login_inner">
              <img src="assets/images/asset_logo.png">
              <hr>
-             <h6>New PIN</h6>
+             <h6>{{'newpin.New PIN' | translate}}</h6>
              <div class="login_inner_content">
                
                 <br>
                 <div class="login_row">
-                    <p>New PIN</p>
+                    <p>{{'newpin.New PIN' | translate}}</p>
                     <div class="login_pin">
                       <input class="log_pin" type="password" maxlength="1" value="0">
                       <input class="log_pin" type="password" maxlength="1" value="0">
@@ -26,7 +26,7 @@
                     </div>
                  </div>
                  <div class="login_row">
-                    <p>Confirm PIN</p>
+                    <p> {{'newpin.Confirm PIN' | translate}}</p>
                     <div class="login_pin">
                       <input class="log_pin" type="password" maxlength="1" value="0">
                       <input class="log_pin" type="password" maxlength="1" value="0">
@@ -48,10 +48,10 @@
        <div class="login_btn_bay">
           <div class="row">
               <div class="col-md-6">
-                  <button class="cancel_btn" (click)="goToPage('start/forgot')">Cancel</button>
+                  <button class="cancel_btn" (click)="goToPage('start/forgot')">{{'newpin.Cancel' | translate}}</button>
               </div>
               <div class="col-md-6">
-                <button class="login_btn" (click)="goToPage('start/login')">Save</button>
+                <button class="login_btn" (click)="goToPage('start/login')"> {{'newpin.Save' | translate}}</button>
               </div>
            </div>
        </div>

src/app/start/start.module.ts

@@ -7,6 +7,7 @@ import { moduleRouting } from './start.routing';
 import { NewpinComponent } from './newpin/newpin.component';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { InvalidComponent } from './invalid/invalid.component';
+import { TranslateModule} from '@ngx-translate/core';
 
 @NgModule({
   declarations: [IndexComponent, LoginComponent, ForgotComponent, NewpinComponent, InvalidComponent],
@@ -15,6 +16,7 @@ import { InvalidComponent } from './invalid/invalid.component';
     moduleRouting,
     ReactiveFormsModule,
     FormsModule,
+    TranslateModule
   ]
 })
 export class StartModule { }

src/assets/i18n/ar.json

+{
+    "login":{
+        "Enter Your 6-Digit PIN": "أدخل رقم التعريف الشخصي المكون من 6 أرقام",
+        "Email Address": "عنوان بريد الكتروني",
+        "Login": "تسجيل الدخول",
+        "Forgot Password": "هل نسيت كلمة المرور",
+        "Choose Language" : "اختر اللغة"
+    },
+    "forgot":{
+        "Forgot your PIN": "نسيت رقم التعريف الشخصي",
+        "Email Address": "عنوان بريد الكتروني",
+        "SEND ME THE LINK": "ترسل لي الرابط"
+    },
+    "invalid":{
+        "Access Denied": "تم الرفض",
+        "Go Back": "عد"
+    },
+    "newpin":{
+        "New PIN": "دبوس جديد",
+        "Confirm PIN": "تأكيد PIN",
+        "Cancel": "إلغاء",
+        "Save": "حفظ"
+    },
+    "addforex":{
+        "Forex Delivery Service Provider" :"فوركس مزود خدمة التوصيل",
+        "Change PIN":"تغيير رقم التعريف الشخصي",
+        "Home" : "الصفحة الرئيسية",
+        "Logout":"الخروج",
+        "Add Delivery Provider":"إضافة مزود التسليم",
+        "Success!":"نجاح",
+        "Provider created successfully":"تم إنشاء مزود بنجاح",
+        "Warning":"تحذير",
+        "Provider Name":"اسم المزود",
+        "Pin":"دبوس",
+        "Confirm Pin":"تأكيد PIN",
+        "Location":"موقعك",
+        "CR ID":"رقم السجل التجاري",
+        "CR Manager":"مدير CR",
+        "Contact Name":"اسم جهة الاتصال",
+        "Phone":"هاتف",
+        "Email id":"عنوان الايميل",
+        "Status":"الحالة",
+        "Delivery Provider":"مزود التسليم",
+        "Save":"حفظ",
+        "Cancel":"إلغاء"
+    },
+    "addprovider":{
+        "Forex Delivery Service Provider":"فوركس مزود خدمة التوصيل",
+        "Home":"الصفحة الرئيسية",
+        "Logout":"الخروج",
+        "Change PIN":"تغيير رقم التعريف الشخصي",
+        "Add Delivery Provider":"إضافة مزود التسليم",
+        "Success!":"نجاح",
+        "Provider created successfully":"تم إنشاء مزود بنجاح",
+        "Warning!":"تحذير",
+        "Provider Name":"اسم المزود",
+        "Pin":"دبوس",
+        "Confirm Pin":"تأكيد PIN",
+        "Location":"موقعك",
+        "CR ID":"رقم السجل التجاري",
+        "CR Manager":"مدير CR",
+        "Contact Name":"اسم جهة الاتصال",
+        "Phone":"هاتف",
+        "Email id":"عنوان الايميل",
+        "Save":"حفظ",
+        "Cancel":"إلغاء"
+    },
+    "changepin":{
+        "Change PIN":"تغيير رقم التعريف الشخصي",
+        "Old PIN":"رقم التعريف الشخصي القديم",
+        "New PIN":"دبوس جديد",
+        "Confirm PIN":"تأكيد PIN",
+        "Warning!":"تحذير",
+        "Success!":"نجاح",
+        "Password Updated Successfully":"تم تحديث كلمة السر بنجاح",
+        "Cancel":"إلغاء",
+        "Save":"حفظ"
+    },
+    "currencyadd":{
+        "Currency Management":"إدارة العملات",
+        "Home":"الصفحة الرئيسية",
+        "Logout":"الخروج",
+        "Change PIN":"تغيير رقم التعريف الشخصي",
+        "Add Currency":"أضف عملةy",
+        "Success!":"نجاح",
+        "Currency added successfully":"تمت إضافة العملة بنجاح",
+        "Warning!":"تحذير",
+        "Name":"اسم",
+        "Symbol":"رمز",
+        "Flag":"علم",
+        "Rate":"معدل",
+        "Forex Amount Start From":"مبلغ الفوركس يبدأ من",
+        "Cancel":"إلغاء",
+        "Save":"حفظ"
+    },
+    "currencyedit":{
+        "Currency Management":"إدارة العملات",
+        "Home":"الصفحة الرئيسية",
+        "Logout":"الخروج",
+        "Change PIN":"تغيير رقم التعريف الشخصي",
+        "Edit Currency":"تحرير العملة",
+        "Success!":"نجاح",
+        "Currency added successfully":"تمت إضافة العملة بنجاح",
+        "Warning!":"تحذير",
+        "Name":"اسم",
+        "Symbol":"رمز",
+        "Flag":"علم",
+        "Choose Flag":"اختيار العلم",
+        "Rate":"معدل",
+        "Forex Amount Start From":"مبلغ الفوركس يبدأ من",
+        "Cancel":"إلغاء",
+        "Save":"حفظ"
+    },
+    "currencylist":{
+        "Manage Currency":"إدارة العملة",
+        "Home" :"الصفحة الرئيسية",
+        "Logout":"الخروج",
+        "Change PIN":"تغيير رقم التعريف الشخصي",
+        "Currency List":"Currency List",
+        "Warning!":"تحذير",
+        "Success!":"نجاح",
+        "Currency removed successfully":"تمت إزالة العملة بنجاح",
+        "Name":"اسم",
+        "Symbol":"رمز",
+        "Forex Start from":"فوركس تبدأ من",
+        "Rate":"معدل"
+    },
+    "editforex":{
+        "Manage Currency":"إدارة العملة",
+        "Forex Provider":"مزود فوركس",
+        "Home":"الصفحة الرئيسية",
+        "Logout":"الخروج",
+        "Change PIN":"تغيير رقم التعريف الشخصي",
+        "Edit Forex Provider":"تحرير مزود الفوركس",
+        "Warning!":"تحذير",
+        "Success!":"نجاح",
+        "editforex.Provider updated successfully.":"تم تحديث المزود بنجاح.",
+        "Provider Name":"اسم المزود",
+        "Location":"موقعك",
+        "CR ID":"رقم السجل التجاري",
+        "CR Manager":"مدير CR",
+        "Contact Name":"اسم جهة الاتصال",
+        "Phone":"هاتف",
+        "Email id":"عنوان الايميل",
+        "Status":"الحالة",
+        "Online":"عبر الانترنت",
+        "Offline":"غير متصل على الانترنت",
+        "Delivery Provider":"مزود التسليم",
+        "Save":"حفظ",
+        "Cancel":"إلغاء"
+    },
+    "editprovider":{
+        "Forex Delivery Service Provider":"فوركس مزود خدمة التوصيل",
+        "Edit Forex Provider":"تحرير مزود الفوركس",
+        "Home":"الصفحة الرئيسية",
+        "Logout":"الخروج",
+        "Change PIN":"تغيير رقم التعريف الشخصي",
+        "Edit Delivery Service Provider":"تحرير مزود خدمة التسليم",
+        "Warning!":"تحذير",
+        "Success!":"نجاح",
+        "Provider updated successfully.":"تم تحديث المزود بنجاح.",
+        "Provider Name":"اسم المزود",
+        "Location":"موقعك",
+        "CR ID":"رقم السجل التجاري",
+        "CR Manager":"مدير CR",
+        "Contact Name":"اسم جهة الاتصال",
+        "Phone":"هاتف",
+        "Email id":"عنوان الايميل",
+        "Save":"حفظ",
+        "Cancel":"إلغاء",
+        "Forex Provider":"مزود فوركس",
+        "Status":"الحالة",
+        "Delivery Provider":"مزود التسليم"
+    },
+    "forexprovider":{
+        "Forex Provider":"مزود فوركس",
+        "Home":"الصفحة الرئيسية",
+        "Logout":"الخروج",
+        "Change PIN":"تغيير رقم التعريف الشخصي",
+        "Manage Forex Provider":"إدارة مزود الفوركس",
+        "Warning!":"تحذير",
+        "Success!":"نجاح",
+        "Forex provider removed successfully":"تمت إزالة مزود الفوركس بنجاح",
+        "Provider Name":"اسم المزود",
+        "Location":"موقعك",
+        "CR Manager":"مدير CR",
+        "CR ID":"رقم السجل التجاري",
+        "Contact Name":"اسم جهة الاتصال",
+        "Phone":"هاتف",
+        "Email ID":"عنوان الايميل"
+    },
+    "home":{
+        "Forex Delivery Service Provider":"فوركس مزود خدمة التوصيل",
+        "Currency":"Currency",
+        "Logout":"الخروج",
+        "Manage Forex Provider":"إدارة مزود الفوركس",
+        "Manage Delivery Provider":"إدارة مزود التسليم"
+    },
+    "manageprovider":{
+        "Forex Delivery Service Provider":"فوركس مزود خدمة التوصيل",
+        "Home":"الصفحة الرئيسية",
+        "Logout":"الخروج",
+        "Change PIN":"تغيير رقم التعريف الشخصي",
+        "Manage Forex Provider":"إدارة مزود الفوركس",
+        "Manage Delivery Service Provider":"إدارة مزود خدمة التوصيل",
+        "Delivery provider removed successfully":"تمت إزالة مزود التسليم بنجاح",
+        "Warning!":"تحذير",
+        "Success!":"نجاح",
+        "Provider Name":"اسم المزود",
+        "Location":"موقعك",
+        "CR Manager":"مدير CR",
+        "CR ID":"رقم السجل التجاري",
+        "Contact Name":"اسم جهة الاتصال",
+        "Phone":"هاتف",
+        "Email ID":"عنوان الايميل"
+    },
+    "adddriver":{
+        "Driver Management":"إدارة السائقين",
+        "Home":"الصفحة الرئيسية",
+        "Logout":"الخروج",
+        "Change PIN":"تغيير رقم التعريف الشخصي",
+        "Edit Driver":"تحرير سائق",
+        "Warning!":"تحذير",
+        "Success!":"نجاح",
+        "Provider created successfully.":"تم إنشاء مزود بنجاح",
+        "Provider Name":"اسم المزود",
+        "Pin":"دبوس",
+        "Location":"موقعك",
+        "National ID":"الهوية الوطنية",
+        "Manager ID":"معرف المدير",
+        "Phone":"هاتف",
+        "Email id":"عنوان الايميل",
+        "Save":"حفظ",
+        "Cancel":"إلغاء",
+        "Confirm Pin":"تأكيد PIN"
+    },
+    "editdriver":{
+        "Forex Delivery Driver":"سائق تسليم فوركس",
+        "Home":"الصفحة الرئيسية",
+        "Logout":"الخروج",
+        "Change PIN":"تغيير رقم التعريف الشخصي",
+        "Edit Forex Delivery Driver":"تحرير سائق تسليم فوركس",
+        "Warning!":"تحذير",
+        "Success!":"نجاح",
+        "Forex Delivery Driver updated successfully":"تم تحديث برنامج Forex Delivery Driver بنجاح",
+        "Provider Name":"اسم المزود",
+        "Location":"موقعك",
+        "National ID":"الهوية الوطنية",
+        "Manager ID":"معرف المدير",
+        "Phone":"هاتف",
+        "Email id":"عنوان الايميل",
+        "Save":"حفظ",
+        "Cancel":"إلغاء"
+    },
+    "listdriver":{
+        "Driver Management":"إدارة السائقين",
+        "Driver List":"Driver List",
+        "Home":"الصفحة الرئيسية",
+        "Logout":"الخروج",
+        "Change PIN":"تغيير رقم التعريف الشخصي",
+        "Forex provider removed successfully":"تمت إزالة مزود الفوركس بنجاح",
+        "Warning!":"تحذير",
+        "Success!":"نجاح",
+        "Provider Name":"اسم المزود",
+        "Location":"موقعك",
+        "National ID":"الهوية الوطنية",
+        "Manager ID":"معرف المدير",
+        "Phone":"هاتف",
+        "Email ID":"عنوان الايميل"
+    },
+    "currency":{
+        "Forex Currency Rate":"سعر صرف العملات الأجنبية",
+        "Home":"الصفحة الرئيسية",
+        "Logout":"الخروج",
+        "Currency & Rates":"أسعار العملات",
+        "Warning":"تحذير",
+        "Success":"نجاح",
+        "Currency assigned successfully":"تم تعيين العملة بنجاح",
+        "Currency":"دقة",
+        "Add":"إضافة",
+        "Remove":"إزالة",
+        "Rates":"معدلات",
+        "Save":"حفظ",
+        "Cancel":"إلغاء"
+    },
+
+    "transaction":{
+        "Forex Transaction List":"قائمة معاملات فوركس",
+        "Driver Management":"إدارة السائقين",
+        "Currency":"دقة",
+        "Settings":"الإعدادات",
+        "Logout":"الخروج",
+        "Date":"تاريخ",
+        "Change PIN":"تغيير رقم التعريف الشخصي",
+        "Manage Transaction":"إدارة المعاملات",
+        "Warning":"تحذير",
+        "Success":"نجاح",
+        "Forex provider removed successfully":"تمت إزالة مزود الفوركس بنجاح",
+        "User Info":"معلومات المستخدم",
+        "Phone":"هاتف",
+        "Location":"موقعك",
+        "Amount":"كمية",
+        "Forex Amount":"مبلغ الفوركس",
+        "Driver":"سائق",
+        "Status":"الحالة",
+        "Assign Driver":"تعيين سائق",
+        "User":"المستعمل",
+        "Assign":"تعيين",
+        "Cancel":"إلغاء"
+    }
+     
+}

src/assets/i18n/en.json

+{
+    "login":{
+        "Enter Your 6-Digit PIN": "Enter Your 6-Digit PIN",
+        "Email Address": "Email Address",
+        "Login": "Login",
+        "Forgot Password": "Forgot Password",
+        "Choose Language" : "Choose Language"
+    },
+    "forgot":{
+        "Forgot your PIN": "Forgot your PIN",
+        "Email Address": "Email Address",
+        "SEND ME THE LINK": "SEND ME THE LINK"
+    },
+    "invalid":{
+        "Access Denied": "Access Denied",
+        "Go Back": "Go Back"
+    },
+    "newpin":{
+        "New PIN": "New PIN",
+        "Confirm PIN": "Confirm PIN",
+        "Cancel": "Cancel",
+        "Save": "Save"
+    },
+    "addforex":{
+        "Forex Delivery Service Provider" :"Forex Delivery Service Provider",
+        "Change PIN":"Change PIN",
+        "Home" : "Home",
+        "Logout":"Logout",
+        "Add Delivery Provider":"Add Delivery Provider",
+        "Success!":"Success",
+        "Provider created successfully":"Provider created successfully",
+        "Warning":"Warning",
+        "Provider Name":"Provider Name",
+        "Pin":"Pin",
+        "Confirm Pin":"Confirm Pin",
+        "Location":"Location",
+        "CR ID":"CR ID",
+        "CR Manager":"CR Manager",
+        "Contact Name":"Contact Name",
+        "Phone":"Phone",
+        "Email id":"Email id",
+        "Status":"Status",
+        "Delivery Provider":"Delivery Provider",
+        "Save":"Save",
+        "Cancel":"Cancel"
+    },
+    "addprovider":{
+        "Forex Delivery Service Provider":"Forex Delivery Service Provider",
+        "Home":"Home",
+        "Logout":"Logout",
+        "Change PIN":"Change PIN",
+        "Add Delivery Provider":"Add Delivery Provider",
+        "Success!":"Success",
+        "Provider created successfully":"Provider created successfully",
+        "Warning!":"Warning!",
+        "Provider Name":"Provider Name",
+        "Pin":"Pin",
+        "Confirm Pin":"Confirm Pin",
+        "Location":"Location",
+        "CR ID":"CR ID",
+        "CR Manager":"CR Manager",
+        "Contact Name":"Contact Name",
+        "Phone":"Phone",
+        "Email id":"Email id",
+        "Save":"Save",
+        "Cancel":"Cancel"
+    },
+    "changepin":{
+        "Change PIN":"Change PIN",
+        "Old PIN":"Old PIN",
+        "New PIN":"New PIN",
+        "Confirm PIN":"Confirm PIN",
+        "Warning!":"Warning!",
+        "Success!":"Success!",
+        "Password Updated Successfully":"Password Updated Successfully",
+        "Cancel":"Cancel",
+        "Save":"Save"
+    },
+    "currencyadd":{
+        "Currency Management":"Currency Management",
+        "Home":"Home",
+        "Logout":"Logout",
+        "Change PIN":"Change PIN",
+        "Add Currency":"Add Currency",
+        "Success!":"Success!",
+        "Currency added successfully":"Currency added successfully",
+        "Warning!":"Warning!",
+        "Name":"Name",
+        "Symbol":"Symbol",
+        "Flag":"Flag",
+        "Rate":"Rate",
+        "Forex Amount Start From":"Forex Amount Start From",
+        "Cancel":"Cancel",
+        "Save":"Save"
+    },
+    "currencyedit":{
+        "Currency Management":"Currency Management",
+        "Home":"Home",
+        "Logout":"Logout",
+        "Change PIN":"Change PIN",
+        "Edit Currency":"Edit Currency",
+        "Success!":"Success!",
+        "Currency added successfully":"Currency added successfully",
+        "Warning!":"Warning!",
+        "Name":"Name",
+        "Symbol":"Symbol",
+        "Flag":"Flag",
+        "Choose Flag":"Choose Flag",
+        "Rate":"Rate",
+        "Forex Amount Start From":"Forex Amount Start From",
+        "Cancel":"Cancel",
+        "Save":"Save"
+    },
+    "currencylist":{
+        "Manage Currency":"Manage Currency",
+        "Home" :"Home",
+        "Logout":"Logout",
+        "Change PIN":"Change PIN",
+        "Currency List":"Currency List",
+        "Warning!":"Warning!",
+        "Success!":"Success!",
+        "Currency removed successfully":"Currency removed successfully",
+        "Name":"Name",
+        "Symbol":"Symbol",
+        "Forex Start from":"Forex Start from",
+        "Rate":"Rate"
+    },
+    "editforex":{
+        "Manage Currency":"Manage Currency",
+        "Forex Provider":"Forex Provider",
+        "Home":"Home",
+        "Logout":"Logout",
+        "Change PIN":"Change PIN",
+        "Edit Forex Provider":"Edit Forex Provider",
+        "Warning!":"Warning!",
+        "Success!":"Success!",
+        "editforex.Provider updated successfully.":"editforex.Provider updated successfully.",
+        "Provider Name":"Provider Name",
+        "Location":"Location",
+        "CR ID":"CR ID",
+        "CR Manager":"CR Manager",
+        "Contact Name":"Contact Name",
+        "Phone":"Phone",
+        "Email id":"Email id",
+        "Status":"Status",
+        "Online":"Online",
+        "Offline":"Offline",
+        "Delivery Provider":"Delivery Provider",
+        "Save":"Save",
+        "Cancel":"Cancel"
+    },
+    "editprovider":{
+        "Forex Delivery Service Provider":"Forex Delivery Service Provider",
+        "Edit Forex Provider":"Edit Forex Provider",
+        "Home":"Home",
+        "Logout":"Logout",
+        "Change PIN":"Change PIN",
+        "Edit Delivery Service Provider":"Edit Delivery Service Provider",
+        "Warning!":"Warning!",
+        "Success!":"Success!",
+        "Provider updated successfully.":"Provider updated successfully.",
+        "Provider Name":"Provider Name",
+        "Location":"Location",
+        "CR ID":"CR ID",
+        "CR Manager":"CR Manager",
+        "Contact Name":"Contact Name",
+        "Phone":"Phone",
+        "Email id":"Email id",
+        "Save":"Save",
+        "Cancel":"Cancel",
+        "Forex Provider":"Forex Provider",
+        "Status":"Status",
+        "Delivery Provider":"Delivery Provider"
+    },
+    "forexprovider":{
+        "Forex Provider":"Forex Provider",
+        "Home":"Home",
+        "Logout":"Logout",
+        "Change PIN":"Change PIN",
+        "Manage Forex Provider":"Manage Forex Provider",
+        "Warning!":"Warning!",
+        "Success!":"Success!",
+        "Forex provider removed successfully":"Forex provider removed successfully",
+        "Provider Name":"Provider Name",
+        "Location":"Location",
+        "CR Manager":"CR Manager",
+        "CR ID":"CR ID",
+        "Contact Name":"Contact Name",
+        "Phone":"Phone",
+        "Email ID":"Email ID"
+    },
+    "home":{
+        "Forex Delivery Service Provider":"Forex Delivery Service Provider",
+        "Currency":"Currency",
+        "Logout":"Logout",
+        "Manage Forex Provider":"Manage Forex Provider",
+        "Manage Delivery Provider":"Manage Delivery Provider"
+    },
+    "manageprovider":{
+        "Forex Delivery Service Provider":"Forex Delivery Service Provider",
+        "Home":"Home",
+        "Logout":"Logout",
+        "Change PIN":"Change PIN",
+        "Manage Forex Provider":"Manage Forex Provider",
+        "Manage Delivery Service Provider":"Manage Delivery Service Provider",
+        "Delivery provider removed successfully":"Delivery provider removed successfully",
+        "Warning!":"Warning!",
+        "Success!":"Success!",
+        "Provider Name":"Provider Name",
+        "Location":"Location",
+        "CR Manager":"CR Manager",
+        "CR ID":"CR ID",
+        "Contact Name":"Contact Name",
+        "Phone":"Phone",
+        "Email ID":"Email ID"
+    },
+    "adddriver":{
+        "Driver Management":"Driver Management",
+        "Home":"Home",
+        "Logout":"Logout",
+        "Change PIN":"Change PIN",
+        "Edit Driver":"Edit Driver",
+        "Warning!":"Warning!",
+        "Success!":"Success!",
+        "Provider created successfully.":"Provider created successfully.",
+        "Provider Name":"Provider Name",
+        "Pin":"Pin",
+        "Location":"Location",
+        "National ID":"National ID",
+        "Manager ID":"Manager ID",
+        "Phone":"Phone",
+        "Email id":"Email id",
+        "Save":"Save",
+        "Cancel":"Cancel",
+        "Confirm Pin":"Confirm Pin"
+    },
+    "editdriver":{
+        "Forex Delivery Driver":"Forex Delivery Driver",
+        "Home":"Home",
+        "Logout":"Logout",
+        "Change PIN":"Change PIN",
+        "Edit Forex Delivery Driver":"Edit Forex Delivery Driver",
+        "Warning!":"Warning!",
+        "Success!":"Success!",
+        "Forex Delivery Driver updated successfully":"Forex Delivery Driver updated successfully",
+        "Provider Name":"Provider Name",
+        "Location":"Location",
+        "National ID":"National ID",
+        "Manager ID":"Manager ID",
+        "Phone":"Phone",
+        "Email id":"Email id",
+        "Save":"Save",
+        "Cancel":"Cancel"
+    },
+    "listdriver":{
+        "Driver Management":"Driver Management",
+        "Driver List":"Driver List",
+        "Home":"Home",
+        "Logout":"Logout",
+        "Change PIN":"Change PIN",
+        "Forex provider removed successfully":"Forex provider removed successfully",
+        "Warning!":"Warning!",
+        "Success!":"Success!",
+        "Provider Name":"Provider Name",
+        "Location":"Location",
+        "National ID":"National ID",
+        "Manager ID":"Manager ID",
+        "Phone":"Phone",
+        "Email ID":"Email ID"
+    },
+    "currency":{
+        "Forex Currency Rate":"Forex Currency Rate",
+        "Home":"Home",
+        "Logout":"Logout",
+        "Currency & Rates":"Currency & Rates",
+        "Warning":"Warning",
+        "Success":"Success",
+        "Currency assigned successfully":"Currency assigned successfully",
+        "Currency":"Currency",
+        "Add":"Add",
+        "Remove":"Remove",
+        "Rates":"Rates",
+        "Save":"Save",
+        "Cancel":"Cancel"
+    },
+
+    "transaction":{
+        "Forex Transaction List":"Forex Transaction List",
+        "Driver Management":"Driver Management",
+        "Currency":"Currency",
+        "Settings":"Settings",
+        "Logout":"Logout",
+        "Date":"Date",
+        "Change PIN":"Change PIN",
+        "Manage Transaction":"Manage Transaction",
+        "Warning":"Warning",
+        "Success":"Success",
+        "Forex provider removed successfully":"Forex provider removed successfully",
+        "User Info":"User Info",
+        "Phone":"Phone",
+        "Location":"Location",
+        "Amount":"Amount",
+        "Forex Amount":"Forex Amount",
+        "Driver":"Driver",
+        "Status":"Status",
+        "Assign Driver":"Assign Driver",
+        "User":"User",
+        "Assign":"Assign",
+        "Cancel":"Cancel"
+    }
+     
+}

src/assets/styles/translation.scss

-/*.ar{
+.ar{
     .floatLeft{
         float: right !important;
     }
@@ -84,5 +84,5 @@
            
         }
     }
-}*/
+}
 

src/index.html

@@ -8,7 +8,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <link rel="icon" type="image/x-icon" href="favicon.ico">
 </head>
-<body class="ar">
+<body class="">
   <app-root></app-root>
 </body>
 </html>