Add force refresh to new user form

This commit is contained in:
Deng, Qian 2018-01-30 20:42:39 +08:00
parent 11288ccc0c
commit 32793e2859
2 changed files with 58 additions and 42 deletions

View File

@ -10,7 +10,8 @@
<span class="tooltip-content">
{{usernameTooltip | translate}}
</span>
</label><span class="spinner spinner-inline spinner-pos" [hidden]='isChecking("username")'></span>
</label>
<span class="spinner spinner-inline spinner-pos" [hidden]='isChecking("username")'></span>
</div>
<div class="form-group form-group-override">
<label for="email" class="required form-group-label-override">{{'PROFILE.EMAIL' | translate}}</label>

View File

@ -18,7 +18,8 @@ import {
Output,
EventEmitter,
Input,
OnInit
OnInit,
ChangeDetectorRef,
} from '@angular/core';
import { NgForm } from '@angular/forms';
@ -33,33 +34,29 @@ import { SessionService } from '../../shared/session.service';
})
export class NewUserFormComponent implements AfterViewChecked, OnInit {
newUser: User = new User();
@Input() isSelfRegistration: boolean = false;
newUserFormRef: NgForm;
@ViewChild("newUserFrom") newUserForm: NgForm;
@Input() isSelfRegistration = false;
// Notify the form value changes
@Output() valueChange = new EventEmitter<boolean>();
@ViewChild("newUserFrom") newUserForm: NgForm;
newUser: User = new User();
newUserFormRef: NgForm;
confirmedPwd: string;
timerHandler: any;
validationStateMap: any = {};
mailAlreadyChecked: any = {};
userNameAlreadyChecked: any = {};
emailTooltip = 'TOOLTIP.EMAIL';
usernameTooltip = 'TOOLTIP.USER_NAME';
formValueChanged = false;
constructor(private session: SessionService) { }
checkOnGoing: any = {};
constructor(private session: SessionService,
private ref: ChangeDetectorRef) { }
ngOnInit() {
this.resetState();
}
validationStateMap: any = {};
mailAlreadyChecked: any = {};
userNameAlreadyChecked: any = {};
emailTooltip: string = 'TOOLTIP.EMAIL';
usernameTooltip: string = 'TOOLTIP.USER_NAME';
formValueChanged: boolean = false;
checkOnGoing: any = {};
resetState(): void {
this.mailAlreadyChecked = {};
this.userNameAlreadyChecked = {};
@ -84,6 +81,20 @@ export class NewUserFormComponent implements AfterViewChecked, OnInit {
return !this.checkOnGoing[key];
}
forceRefreshView(duration: number): void {
// Reset timer
if (this.timerHandler) {
clearInterval(this.timerHandler);
}
this.timerHandler = setInterval(() => this.ref.markForCheck(), 100);
setTimeout(() => {
if (this.timerHandler) {
clearInterval(this.timerHandler);
this.timerHandler = null;
}
}, duration);
}
getValidationState(key: string): boolean {
return !this.validationStateMap[key];
}
@ -117,10 +128,12 @@ export class NewUserFormComponent implements AfterViewChecked, OnInit {
this.userNameAlreadyChecked[this.newUser.username.trim()] = {
result: res
}; // Tag it checked
this.forceRefreshView(2000);
})
.catch(error => {
this.checkOnGoing[key] = false;
this.validationStateMap[key] = false;// Not valid @ backend
this.forceRefreshView(2000);
});
return;
@ -148,10 +161,12 @@ export class NewUserFormComponent implements AfterViewChecked, OnInit {
this.mailAlreadyChecked[this.newUser.email.trim()] = {
result: res
}; // Tag it checked
this.forceRefreshView(2000);
})
.catch(error => {
this.checkOnGoing[key] = false;
this.validationStateMap[key] = false;// Not valid @ backend
this.forceRefreshView(2000);
});
return;
}