import { Vue, Component , namespace } from 'nuxt-property-decorator';
|
import { AxiosError } from 'axios';
|
import { getImgOfVerification, logInToConsultant, getVerificationStatus } from '~/assets/ts/api/consultant';
|
import { Role } from '~/assets/ts/models/enum/role.enum';
|
import ErrorMessageBox from '~/assets/ts/errorService';
|
|
const roleStorage = namespace('localStorage');
|
@Component({
|
layout: 'home'
|
})
|
export default class ConsultantLogin extends Vue {
|
@roleStorage.Mutation storageIdToken!: (token: string) => void;
|
@roleStorage.Mutation storageRole!: (role: string) => void;
|
@roleStorage.Mutation storageConsultantId!:(id:string) => void;
|
isRememberUserName = false;
|
isShowPassword = false;
|
imgSrc = '';
|
verificationCode='';
|
consultantDto = {
|
username: '',
|
password: '',
|
}
|
|
get isAlreadyDone():boolean{
|
return !!(this.verificationCode && this.consultantDto.username && this.consultantDto.password);
|
}
|
|
mounted() {
|
this.getInitUserName();
|
this.regenerateImgOfVerification();
|
};
|
|
private getInitUserName(): void {
|
const username = localStorage.getItem('consultantUserName')
|
if (username) {
|
this.consultantDto.username = username;
|
this.isRememberUserName = true;
|
}
|
}
|
|
public regenerateImgOfVerification(): void {
|
getImgOfVerification().then( imgOfBase64 =>
|
this.imgSrc = imgOfBase64
|
);
|
};
|
|
public isRememberChange():void{
|
this.isRememberUserName = !this.isRememberUserName;
|
this.storeUserName();
|
}
|
|
public sendInfo():void{
|
this.isAlreadyDone ? this.verify() : ErrorMessageBox('請確認帳號、密碼以及驗證碼是否填寫完畢');
|
}
|
|
private verify():void{
|
getVerificationStatus(this.verificationCode).then( verifySuccess => {
|
if(verifySuccess.data){
|
this.loginWithConsultant()
|
}else{
|
this.clearValue();
|
this.regenerateImgOfVerification();
|
ErrorMessageBox('驗證碼輸入錯誤');
|
}
|
});
|
}
|
|
private loginWithConsultant(): void {
|
logInToConsultant(this.consultantDto).then(res => {
|
this.storageIdToken(res.data.id_token);
|
this.storageRole(Role.ADMIN);
|
this.storageConsultantId(this.consultantDto.username)
|
this.storeUserName();
|
this.$router.push('/myAppointmentList/appointmentList');
|
}).catch((error:AxiosError)=>{
|
this.checkHttpErrorStatus(error);
|
});
|
}
|
private checkHttpErrorStatus(error:any):void{
|
this.clearValue();
|
this.regenerateImgOfVerification();
|
switch (error.response.status) {
|
case 401:
|
const errorMsg = error.response.data.detail;
|
ErrorMessageBox(errorMsg);
|
break;
|
|
default:
|
ErrorMessageBox('',error);
|
break;
|
}
|
}
|
|
private storeUserName(): void {
|
localStorage.setItem('consultantUserName', this.isRememberUserName ? this.consultantDto.username : '');
|
};
|
|
private clearValue():void{
|
if (!this.isRememberUserName) this.consultantDto.username='';
|
this.consultantDto.password = '';
|
this.verificationCode = '';
|
}
|
};
|
