| import { Component,OnDestroy, OnInit } from '@angular/core'; |
| import { FormGroup, FormBuilder, Validators } from '@angular/forms'; |
| import {Router } from '@angular/router' |
| import { Subscription, Observable } from 'rxjs'; |
| import { TdLoadingService, LoadingType } from '@covalent/core'; |
| import { Store } from '@ngrx/store'; |
| import { ITdLoadingConfig } from '@covalent/core'; |
| import { LOGIN } from '../store/security/security.actions'; |
| import { MatSelectChange } from '@angular/material'; |
| import * as fromRoot from '../store'; |
| import { TranslateService } from '@ngx-translate/core'; |
| import {FormsModule, ReactiveFormsModule} from '@angular/forms'; |
| import {TRANSLATE_STORAGE_KEY} from '../common/i18n/translate'; |
| |
| @Component({ |
| selector: 'app-login', |
| templateUrl: './login.component.html', |
| styleUrls: ['./login.component.scss'], |
| |
| }) |
| export class LoginComponent implements OnInit { |
| private loadingSubscription: Subscription; |
| |
| currentLanguage: string; |
| |
| languageOptions: any[] = [ |
| {id: 'en', label: 'Welcome to fims'}, |
| {id: 'es', label: 'Bienvenido a fims'} |
| ]; |
| |
| hide= true; |
| form: FormGroup; |
| |
| error$: Observable<string>; |
| |
| constructor(private _loadingService: TdLoadingService, private translate: TranslateService, private formBuilder: FormBuilder, |
| private store: Store<fromRoot.State>) { |
| } |
| |
| ngOnInit() { |
| this.currentLanguage = this.translate.currentLang || this.translate.getDefaultLang(); |
| |
| const options: ITdLoadingConfig = { |
| name: 'login', |
| type: LoadingType.Circular, |
| }; |
| |
| this._loadingService.create(options); |
| |
| this.form = this.formBuilder.group({ |
| tenant: ['', Validators.required], |
| username: ['', Validators.required], |
| password: ['', Validators.required] |
| }); |
| |
| this.error$ = this.store.select(fromRoot.getAuthenticationError) |
| .filter(error => !!error) |
| .do(() => this.form.get('password').setValue('')) |
| .map(error => 'Sorry, that login did not work.'); |
| |
| this.loadingSubscription = this.store.select(fromRoot.getAuthenticationLoading).subscribe(loading => { |
| if (loading) { |
| this._loadingService.register('login'); |
| } else { |
| this._loadingService.resolve('login'); |
| } |
| }); |
| } |
| |
| ngOnDestroy(): void { |
| this.loadingSubscription.unsubscribe(); |
| } |
| |
| login(): void { |
| const tenant = this.form.get('tenant').value; |
| const username = this.form.get('username').value; |
| const password = this.form.get('password').value; |
| |
| this.store.dispatch({ |
| type: LOGIN, payload: { |
| username, |
| password, |
| tenant |
| } |
| }); |
| } |
| |
| selectLanguage(selectChange: MatSelectChange): void { |
| sessionStorage.setItem(TRANSLATE_STORAGE_KEY, selectChange.value); |
| location.reload(); |
| } |
| } |