add loading info to register and login

This commit is contained in:
rubikscraft 2022-09-04 14:43:19 +02:00
parent 27b5fdeae1
commit f602e71520
No known key found for this signature in database
GPG key ID: 1463EBE9200A5CD4
4 changed files with 26 additions and 4 deletions

View file

@ -40,8 +40,14 @@
</div> </div>
<div class="col-12 py-2"> <div class="col-12 py-2">
<button mat-raised-button color="accent" class="mx-2" type="submit"> <button
LOGIN mat-raised-button
color="accent"
class="mx-2"
type="submit"
[disabled]="loading"
>
{{ loading ? 'LOADING...' : 'LOGIN' }}
</button> </button>
<button <button
*ngIf="showRegister" *ngIf="showRegister"

View file

@ -19,6 +19,7 @@ export class LoginComponent implements OnInit {
private readonly logger = new Logger(LoginComponent.name); private readonly logger = new Logger(LoginComponent.name);
public showRegister = false; public showRegister = false;
public loading = false;
public readonly model = new LoginControl(); public readonly model = new LoginControl();
@ -52,7 +53,10 @@ export class LoginComponent implements OnInit {
return; return;
} }
this.loading = true;
const user = await this.userService.login(data.username, data.password); const user = await this.userService.login(data.username, data.password);
this.loading = false;
if (HasFailed(user)) { if (HasFailed(user)) {
this.logger.error(user.getReason()); this.logger.error(user.getReason());
this.utilService.showSnackBar( this.utilService.showSnackBar(

View file

@ -66,8 +66,14 @@
> >
LOGIN LOGIN
</button> </button>
<button mat-flat-button color="accent" class="mx-2" type="submit"> <button
REGISTER mat-flat-button
color="accent"
class="mx-2"
type="submit"
[disabled]="loading"
>
{{ loading ? 'LOADING...' : 'REGISTER' }}
</button> </button>
</div> </div>
</form> </form>

View file

@ -19,6 +19,7 @@ export class RegisterComponent implements OnInit {
private readonly logger = new Logger(RegisterComponent.name); private readonly logger = new Logger(RegisterComponent.name);
public showLogin = false; public showLogin = false;
public loading = false;
public readonly model = new RegisterControl(); public readonly model = new RegisterControl();
@ -52,8 +53,11 @@ export class RegisterComponent implements OnInit {
return; return;
} }
this.loading = true;
const user = await this.userService.register(data.username, data.password); const user = await this.userService.register(data.username, data.password);
if (HasFailed(user)) { if (HasFailed(user)) {
this.loading = false;
this.logger.error(user.getReason()); this.logger.error(user.getReason());
this.utilService.showSnackBar( this.utilService.showSnackBar(
'Register failed, please try again', 'Register failed, please try again',
@ -86,6 +90,8 @@ export class RegisterComponent implements OnInit {
); );
} }
this.loading = false;
this.router.navigate(['/']); this.router.navigate(['/']);
} }