Tips component - Language module added

src/app/tips/tips.component.html

@@ -1,17 +1,17 @@
 <mat-card>
 	<mat-card-title class="scan-header">
-		Enter tip:
+		{{ vE.tipsEnterTip }}:
 	</mat-card-title>
 	<mat-card-content>
 		<br>
 		<div align="center" class="card-contents">
 			<table cellspacing="0">
 				<tr>
-					<th align="center">Subtotal</th>
+					<th align="center"> {{ vE.tipsSubtotal }}</th>
 					<th align="center"></th>
-					<th align="center">Tip</th>
+					<th align="center">{{ vE.tipsTip }}</th>
 					<th align="center"></th>
-					<th align="center">Total</th>
+					<th align="center">{{ vE.tipsTotal }}</th>
 				</tr>
 				<tr>
 					<td align="center">{{orderTotal | currency}}</td>
@@ -31,10 +31,10 @@
 	</mat-card-content>
 	<mat-card-actions class="card-buttons">
 		<button mat-raised-button (click)="close()">
-			<mat-icon class="icon">close</mat-icon>No Tip
+			<mat-icon class="icon">close</mat-icon>{{ vE.tipsNoTipBtn }}
 		</button>
 		<button mat-raised-button color="primary" (click)="confirm()">
-			<mat-icon class="icon">done</mat-icon>Done
+			<mat-icon class="icon">done</mat-icon>{{ vE.tipsDoneBtn }}
 		</button>
 	</mat-card-actions>
 </mat-card>

src/app/tips/tips.component.ts

@@ -1,6 +1,9 @@
 import { Inject, Component, OnInit } from '@angular/core';
 import { MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';
 
+import { LanguageService } from '../language.service';
+import { LanguageData } from '../language.model';
+
 @Component({
   selector: 'app-tips',
   templateUrl: './tips.component.html',
@@ -12,7 +15,21 @@ export class TipsComponent implements OnInit{
 	value:number = 0.15;
 	flag:boolean = true;
 
+	// -------------------------------------
+	//
+	// Language Support
+	//
+	vE = {
+			tipsEnterTip : '',
+			tipsSubtotal : '',
+			tipsTip : '',
+			tipsTotal : '',
+			tipsNoTipBtn : '',
+			tipsDoneBtn : ''
+	}	
+
 	constructor(
+		private languageService : LanguageService,
 		private dialogRef: MatDialogRef<TipsComponent>,
 		@Inject(MAT_DIALOG_DATA) public data: {amt: number, flag: boolean}) {
 		this.orderTotal = data.amt;
@@ -26,6 +43,7 @@ export class TipsComponent implements OnInit{
 		if(!this.flag){
 			this.dialogRef.close(0);
 		}
+		this.chgUILanguage();
 	}
 
 	formatPercent(v: number) {
@@ -39,4 +57,25 @@ export class TipsComponent implements OnInit{
 	confirm() {
 		this.dialogRef.close(this.orderTotal * this.value);
 	}
+
+  chgUILanguage(){
+      console.log('TIPS.chgUILanguage Called ');
+      this.languageService.getViewElements('tips').subscribe(
+        		response => { 
+              console.log('Received >> ', response );
+              console.log('Language Code : ', response.language);
+              console.log('Component Name : ',response.component);
+              console.log('Language data : ',response.data);
+ 
+							this.vE.tipsEnterTip = response.data.tips_enter_tip;
+							this.vE.tipsSubtotal = response.data.tips_subtotal;
+							this.vE.tipsTip = response.data.tips_tip;
+							this.vE.tipsTotal = response.data.tips_total;
+							this.vE.tipsNoTipBtn = response.data.tips_notip_btn;
+							this.vE.tipsDoneBtn = response.data.tips_done_btn;
+          	},
+              error  => { console.log('Error >> ',error); }
+        );
+  }  
+
 }