diff options
author | 2020-08-11 17:09:19 -0400 | |
---|---|---|
committer | 2020-08-11 17:09:29 -0400 | |
commit | b2b4c24300ae6c929ee1996b23b1277fc66498cf (patch) | |
tree | acd786174fab52e70b227e8b5b94588008a0f77e /portal-FE-common/src/app/layout | |
parent | 560c13ca93cafcc163c5c139bc1324212c2dd54f (diff) |
Internationalization code
Issue-ID: PORTAL-975
Change-Id: I4d4e25b883f36ee6ee1e16d98e75773636b1ee5b
Signed-off-by: Sri Balaji Marripud <sri.balaji.marripud@att.com>
Diffstat (limited to 'portal-FE-common/src/app/layout')
10 files changed, 121 insertions, 54 deletions
diff --git a/portal-FE-common/src/app/layout/components/header/header.component.html b/portal-FE-common/src/app/layout/components/header/header.component.html index 97f4a260..865ce076 100644 --- a/portal-FE-common/src/app/layout/components/header/header.component.html +++ b/portal-FE-common/src/app/layout/components/header/header.component.html @@ -119,6 +119,14 @@ <br> </div> </div> +<div class = "language-dropdown"> + <span class="dropdown-item-name"> {{ 'Language' }}: </span> + <select #langSelect (change)="setLanguage(langSelect.value)"> + <option *ngFor="let lang of languages" [value]="lang.languageId" [selected]="lang.selected"> + {{ lang.languageAlias }} + </option> + </select> +</div> <hr> <div id="reg-logout-div" > <button type="button" class="btn btn-primary" (click)="allAppsLogout()"> diff --git a/portal-FE-common/src/app/layout/components/header/header.component.scss b/portal-FE-common/src/app/layout/components/header/header.component.scss index 65a4be04..0d14531d 100644 --- a/portal-FE-common/src/app/layout/components/header/header.component.scss +++ b/portal-FE-common/src/app/layout/components/header/header.component.scss @@ -81,4 +81,7 @@ $topnav-background-color: #222; .header-menu-display { width: 250px; } + .language-dropdown { + padding: 0.25rem 1.5rem; + } } diff --git a/portal-FE-common/src/app/layout/components/header/header.component.ts b/portal-FE-common/src/app/layout/components/header/header.component.ts index 429587d9..74f6fb3a 100644 --- a/portal-FE-common/src/app/layout/components/header/header.component.ts +++ b/portal-FE-common/src/app/layout/components/header/header.component.ts @@ -35,7 +35,7 @@ * * */ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, Output, EventEmitter } from '@angular/core'; import { Router, NavigationEnd } from '@angular/router'; import { UserProfileService, MenusService } from 'src/app/shared/services'; import { CookieService } from 'ngx-cookie-service'; @@ -60,6 +60,10 @@ export class HeaderComponent implements OnInit { brandName: string; brandLogoImagePath: string; isSystemUser: boolean = false; + languages: string[] = []; + result: any; + + @Output() languageEvent = new EventEmitter(); constructor(public router: Router, private userProfileService: UserProfileService, private menusService: MenusService, private cookieService: CookieService) { @@ -87,6 +91,20 @@ export class HeaderComponent implements OnInit { if(this.api.brandLogoImagePath != ''){ this.brandLogoImagePath = this.api.brandLogoImagePath; } + + this.menusService.getAllLanguages().subscribe(data =>{ + this.result = data; + for(let lang of this.result.languageList ){ + this.languages.push(lang); + } + + this.menusService.getCurrentLang(this.loginSnippetUserid).subscribe(data=>{ + this.result = data; + this.languages.map((obj:any)=>{ + obj.selected = obj.languageId == parseInt(this.result.languageId); + }) ; + }); + }); } getUserInformation() { @@ -196,4 +214,12 @@ export class HeaderComponent implements OnInit { onLoggedout() { localStorage.removeItem('isLoggedin'); } + + setLanguage(langId : string){ + + this.menusService.setLanguage(langId, this.loginSnippetUserid).subscribe(data =>{ + console.log("Language Applied :", data); + this.languageEvent.emit(langId); + }); + } } diff --git a/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.ts b/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.ts index 1c689e16..1723f69b 100644 --- a/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.ts +++ b/portal-FE-common/src/app/layout/components/sidebar/sidebar.component.ts @@ -35,7 +35,7 @@ * * */ -import { Component, Output, EventEmitter, OnInit, Input } from '@angular/core'; +import { Component, Output, EventEmitter, OnInit, Input, OnChanges } from '@angular/core'; import { Router, NavigationEnd } from '@angular/router'; import { SidebarService } from '../../../shared/services/index' @@ -57,6 +57,9 @@ export class SidebarComponent implements OnInit { menuData: Array<object> = []; page: any; + languageFinal : string; + @Input() langFromTab:string; + @Output() collapsedEvent = new EventEmitter<boolean>(); constructor(public router: Router, public sidebarService: SidebarService) { @@ -71,64 +74,74 @@ export class SidebarComponent implements OnInit { }); } - ngOnInit() { + ngOnChanges() { + this.changeLang(this.langFromTab); + } + + changeLang(lang){ + this.menuData=[]; this.isActive = false; this.collapsed = false; + this.languageFinal=lang; this.showMenu = ''; this.pushRightClass = 'push-right'; this.sidebarService.getLeftMenu() - .subscribe(data => { - this.result = data; - if (this.result.data && this.result.data2) { - this.leftParentData = JSON.parse(this.result.data); - this.leftChildData = JSON.parse(this.result.data2); + .subscribe(data => { + this.result = data; + if (this.result.data && this.result.data2) { + this.leftParentData = JSON.parse(this.result.data); + this.leftChildData = JSON.parse(this.result.data2); + } else { + this.labelName = this.result.label; + this.leftParentData = this.result.navItems; + this.showOnlyParentMenu = true; + } + + for (var i = 0; i < this.leftParentData.length; i++) { + var parentItem = { + name: null, + imageSrc: null, + href: null, + menuItems: [], + state: null + } + if (this.showOnlyParentMenu) { + parentItem.name = this.leftParentData[i].name; + parentItem.imageSrc = this.leftParentData[i].imageSrc; + parentItem.state = '/'+this.leftParentData[i].state; } else { - this.labelName = this.result.label; - this.leftParentData = this.result.navItems; - this.showOnlyParentMenu = true; + parentItem.name = this.leftParentData[i].label; + parentItem.imageSrc = this.leftParentData[i].imageSrc; } + // Add link to items with no subitems + if (!this.showOnlyParentMenu) { + if (this.leftChildData[i].length == 0) + parentItem.href = this.leftParentData[i].action; - for (var i = 0; i < this.leftParentData.length; i++) { - var parentItem = { - name: null, - imageSrc: null, - href: null, - menuItems: [], - state: null - } - if (this.showOnlyParentMenu) { - parentItem.name = this.leftParentData[i].name; - parentItem.imageSrc = this.leftParentData[i].imageSrc; - parentItem.state = '/'+this.leftParentData[i].state; - } else { - parentItem.name = this.leftParentData[i].label; - parentItem.imageSrc = this.leftParentData[i].imageSrc; - } - // Add link to items with no subitems - if (!this.showOnlyParentMenu) { - if (this.leftChildData[i].length == 0) - parentItem.href = this.leftParentData[i].action; - - for (var j = 0; j < this.leftChildData[i].length; j++) { - - var childItem = { - name: null, - href: null - }; - if (this.leftChildData[i][j].label != null && this.leftChildData[i][j].label.length > 0) { - - childItem.name = this.leftChildData[i][j].label; - childItem.href = this.leftChildData[i][j].action; - parentItem.menuItems.push(childItem); - } + for (var j = 0; j < this.leftChildData[i].length; j++) { + + var childItem = { + name: null, + href: null + }; + if (this.leftChildData[i][j].label != null && this.leftChildData[i][j].label.length > 0) { + + childItem.name = this.leftChildData[i][j].label; + childItem.href = this.leftChildData[i][j].action; + parentItem.menuItems.push(childItem); } } - this.menuData.push(parentItem); } + this.menuData.push(parentItem); + } - }); + }); + } + ngOnInit() { + this.changeLang(""); } + eventCalled() { this.isActive = !this.isActive; } diff --git a/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.html b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.html index db0b6afd..a12a8df5 100644 --- a/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.html +++ b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.html @@ -68,7 +68,7 @@ <div style="display: flex; flex-direction:column; overflow-y: scroll; height: calc(100vh - 100px)"> <div style="display: flex; flex-direction:row;"> - <app-sidebar (collapsedEvent)="receiveCollapsed($event)"></app-sidebar> + <app-sidebar (collapsedEvent)="receiveCollapsed($event)" [langFromTab]="inputedLanguage"></app-sidebar> <app-userbar></app-userbar> <div class="container" [ngStyle]="setStyle()"> <router-outlet></router-outlet> diff --git a/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.spec.ts b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.spec.ts index 066d73ff..37a7e912 100644 --- a/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.spec.ts +++ b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.spec.ts @@ -40,7 +40,7 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing'; import { TabbarComponent } from './tabbar.component'; import { NgMaterialModule } from 'src/app/ng-material-module'; -import { Component } from '@angular/core'; +import { Component, Input } from '@angular/core'; import { ElipsisPipe } from 'src/app/shared/pipes/elipsis/elipsis.pipe'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { HttpClientTestingModule} from '@angular/common/http/testing'; @@ -69,7 +69,7 @@ describe('TabbarComponent', () => { }); @Component({selector: 'app-sidebar', template: ''}) -class AppSideBarStubComponent {} +class AppSideBarStubComponent {@Input() langFromTab:string;} @Component({selector: 'router-outlet', template: ''}) class RouterOutletStubComponent { } diff --git a/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.ts b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.ts index 86f76595..f44b4ef3 100644 --- a/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.ts +++ b/portal-FE-common/src/app/layout/components/tabbar/tabbar.component.ts @@ -35,7 +35,7 @@ * * */ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, Input, OnChanges } from '@angular/core'; import { FormControl } from '@angular/forms'; import { DomSanitizer } from '@angular/platform-browser'; import { Tab } from './tab'; @@ -54,6 +54,10 @@ export class TabbarComponent implements OnInit { mainTab = 'Home'; selected = new FormControl(0); collapedSideBar: boolean; + inputedLanguage: string; + + @Input() language:string; + constructor(private sanitizer: DomSanitizer, private addTabFuntionService: AddTabFunctionService, private auditLogService: AuditLogService) { @@ -68,6 +72,13 @@ export class TabbarComponent implements OnInit { }) } + + ngOnChanges() { + this.changeLang(this.language); + } + changeLang(lang){ + this.inputedLanguage=lang; + } addTab(selectAfterAdding: boolean, label: string, url: string) { const tab = new Tab(label); diff --git a/portal-FE-common/src/app/layout/layout.component.html b/portal-FE-common/src/app/layout/layout.component.html index fa7ada03..4c2bb4d0 100644 --- a/portal-FE-common/src/app/layout/layout.component.html +++ b/portal-FE-common/src/app/layout/layout.component.html @@ -36,8 +36,8 @@ --> - <app-header></app-header> - <app-tabbar></app-tabbar> + <app-header (languageEvent)="setLanguage($event)"></app-header> + <app-tabbar [language]="language"></app-tabbar> diff --git a/portal-FE-common/src/app/layout/layout.component.spec.ts b/portal-FE-common/src/app/layout/layout.component.spec.ts index 3074c297..91b43c2a 100644 --- a/portal-FE-common/src/app/layout/layout.component.spec.ts +++ b/portal-FE-common/src/app/layout/layout.component.spec.ts @@ -38,7 +38,7 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing'; import { LayoutComponent } from './layout.component'; -import { Component } from '@angular/core'; +import { Component, Input } from '@angular/core'; describe('LayoutComponent', () => { let component: LayoutComponent; @@ -65,4 +65,4 @@ describe('LayoutComponent', () => { class AppheaderStubComponent {} @Component({selector: 'app-tabbar', template: ''}) -class AppTabBarStubComponent { }
\ No newline at end of file +class AppTabBarStubComponent { @Input() language: string; }
\ No newline at end of file diff --git a/portal-FE-common/src/app/layout/layout.component.ts b/portal-FE-common/src/app/layout/layout.component.ts index b512988d..d74f84d7 100644 --- a/portal-FE-common/src/app/layout/layout.component.ts +++ b/portal-FE-common/src/app/layout/layout.component.ts @@ -45,6 +45,8 @@ import { Component, OnInit } from '@angular/core'; export class LayoutComponent implements OnInit { collapedSideBar: boolean; + language: string; + constructor() {} @@ -53,4 +55,8 @@ export class LayoutComponent implements OnInit { receiveCollapsed($event) { this.collapedSideBar = $event; } + + setLanguage(lang) { + this.language= lang; + } } |