2019-11-29 16:08:24 +09:00

158 lines
4.2 KiB
TypeScript

import { Component, OnInit, OnDestroy } from '@angular/core';
import { Store, select } from '@ngrx/store';
import { Company } from '@ucap-webmessenger/api-external';
import * as AppStore from '@app/store';
import * as AuthenticationStore from '@app/store/account/authentication';
import * as CompanyStore from '@app/store/setting/company';
import { Observable, Subscription } from 'rxjs';
import { Router } from '@angular/router';
import { tap, map } from 'rxjs/operators';
import {
DialogService,
AlertDialogComponent,
AlertDialogData,
AlertDialogResult
} from '@ucap-webmessenger/ui';
import { StringUtil } from '@ucap-webmessenger/core';
@Component({
selector: 'app-page-account-login',
templateUrl: './login.page.component.html',
styleUrls: ['./login.page.component.scss']
})
export class LoginPageComponent implements OnInit, OnDestroy {
companyList$: Observable<Company[]>;
loginFailureCount: Subscription;
defatulLoginBtnText: string;
loginBtnText: string;
loginBtnEnable: boolean;
timeChecker: any;
defatulWaitingTime: number;
waitingTime: number;
constructor(
private store: Store<any>,
private router: Router,
private dialogService: DialogService
) {}
ngOnInit(): void {
this.defatulLoginBtnText = 'LOGIN';
this.defatulWaitingTime = 5 * 60; // sec
this.store.dispatch(
CompanyStore.companyList({
companyGroupCode: 'LG'
})
);
this.companyList$ = this.store.pipe(
select(AppStore.SettingSelector.CompanySelector.companyList)
);
this.loginFailureCount = this.store
.pipe(
select(AppStore.AccountSelector.AuthenticationSelector.loginFailCount),
map(count => {
if (count > 0) {
if (count < 5) {
this.dialogService.open<
AlertDialogComponent,
AlertDialogData,
AlertDialogResult
>(AlertDialogComponent, {
width: '360px',
data: {
title: '로그인',
html: `아이디 또는 패스워드가<br/>일치하지 않습니다.`
}
});
}
if (count === 5) {
this.dialogService.open<
AlertDialogComponent,
AlertDialogData,
AlertDialogResult
>(AlertDialogComponent, {
width: '360px',
data: {
title: '로그인',
html: `비밀번호 오류 횟수 초과입니다.<br/>비밀번호를 확인하신 후<br/>잠시 후 다시 시작해 주세요.`
}
});
this.timeChecker = setInterval(() => this.getCheckTime(), 1000);
}
return;
} else {
if (!!this.timeChecker) {
clearInterval(this.timeChecker);
}
this.waitingTime = this.defatulWaitingTime;
this.loginBtnText = this.defatulLoginBtnText;
this.loginBtnEnable = true;
}
})
)
.subscribe();
}
ngOnDestroy(): void {
if (!!this.loginFailureCount) {
this.loginFailureCount.unsubscribe();
}
}
getCheckTime() {
if (this.waitingTime <= 0) {
// reset.
if (!!this.timeChecker) {
clearInterval(this.timeChecker);
}
this.waitingTime = this.defatulWaitingTime;
this.loginBtnText = this.defatulLoginBtnText;
this.loginBtnEnable = true;
} else {
// wait.
this.waitingTime = this.waitingTime - 1;
this.loginBtnText = `${StringUtil.zeroFill(
Math.floor(this.waitingTime / 60),
2
)}:${StringUtil.zeroFill(this.waitingTime % 60, 2)}`;
this.loginBtnEnable = false;
}
}
onLogin(value: {
companyCode: string;
loginId: string;
loginPw: string;
rememberMe: boolean;
notValid: () => void;
}) {
this.store.dispatch(
AuthenticationStore.webLogin({
loginInfo: {
companyCode: value.companyCode,
companyGroupType: 'C',
loginId: value.loginId,
loginPw: value.loginPw
},
rememberMe: value.rememberMe
})
);
}
onClickTemplate() {
this.router.navigate(['/template']);
}
}