From da5666528de84788671b39156de1382c6f27c853 Mon Sep 17 00:00:00 2001
From: crupest <crupest@outlook.com>
Date: Mon, 4 Mar 2019 20:41:17 +0800
Subject: ...

---
 .../src/app/user-dialog/user-dialog.component.css  |  5 ++++
 .../src/app/user-dialog/user-dialog.component.html | 11 +++++++-
 .../src/app/user-dialog/user-dialog.component.ts   | 32 +++++++++++++++++++---
 .../ClientApp/src/app/user-dialog/user.service.ts  |  2 +-
 4 files changed, 44 insertions(+), 6 deletions(-)

(limited to 'Timeline/ClientApp/src/app/user-dialog')

diff --git a/Timeline/ClientApp/src/app/user-dialog/user-dialog.component.css b/Timeline/ClientApp/src/app/user-dialog/user-dialog.component.css
index e69de29b..c21d71b1 100644
--- a/Timeline/ClientApp/src/app/user-dialog/user-dialog.component.css
+++ b/Timeline/ClientApp/src/app/user-dialog/user-dialog.component.css
@@ -0,0 +1,5 @@
+.progress-container {
+  display: flex;
+  justify-content: center;
+  align-content: center;
+}
diff --git a/Timeline/ClientApp/src/app/user-dialog/user-dialog.component.html b/Timeline/ClientApp/src/app/user-dialog/user-dialog.component.html
index 2c5d1879..5d3829c7 100644
--- a/Timeline/ClientApp/src/app/user-dialog/user-dialog.component.html
+++ b/Timeline/ClientApp/src/app/user-dialog/user-dialog.component.html
@@ -1,3 +1,12 @@
 <div [ngSwitch]="state">
-  <app-user-login *ngSwitchCase="'login'"></app-user-login>
+  <div *ngSwitchCase="'loading'" class="progress-container">
+    <mat-progress-spinner mode="indeterminate" diameter="50"></mat-progress-spinner>
+  </div>
+  <div *ngSwitchCase="'login'">
+    <p *ngIf="loginMessage" class="mat-body">{{ loginMessage }}</p>
+    <app-user-login (login)="login($event)"></app-user-login>
+  </div>
+  <div *ngSwitchCase="'success'">
+    <p class="mat-body">You have been login as {{ userInfo.username }}.</p>
+  </div>
 </div>
diff --git a/Timeline/ClientApp/src/app/user-dialog/user-dialog.component.ts b/Timeline/ClientApp/src/app/user-dialog/user-dialog.component.ts
index 1d9536c8..6fe5b6d9 100644
--- a/Timeline/ClientApp/src/app/user-dialog/user-dialog.component.ts
+++ b/Timeline/ClientApp/src/app/user-dialog/user-dialog.component.ts
@@ -1,4 +1,6 @@
 import { Component, OnInit } from '@angular/core';
+import { UserService, UserInfo } from './user.service';
+import { LoginEvent } from '../user-login/user-login.component';
 
 @Component({
   selector: 'app-user-dialog',
@@ -7,14 +9,36 @@ import { Component, OnInit } from '@angular/core';
 })
 export class UserDialogComponent implements OnInit {
 
-  constructor() { }
+  constructor(private userService: UserService) { }
 
-  state: 'login' | 'success' = 'login';
+  state: 'loading' | 'login' | 'success' = 'loading';
+
+  loginMessage: string;
+
+  userInfo: UserInfo;
 
   ngOnInit() {
+    this.userService.validateUserLoginState().subscribe(result => {
+      if (result.state === 'success') {
+        this.userInfo = result.userInfo;
+        this.state = 'success';
+      } else {
+        if (result.state === 'invalid') {
+          this.loginMessage = 'Your login is no longer valid';
+        } else {
+          this.loginMessage = 'You haven\'t logged in.';
+        }
+        this.state = 'login';
+      }
+    });
   }
 
-  login() {
-
+  login(event: LoginEvent) {
+    this.userService.tryLogin(event.username, event.password).subscribe(result => {
+      this.userInfo = result;
+      this.state = 'success';
+    }, (error: Error) => {
+      this.loginMessage = error.message;
+    });
   }
 }
diff --git a/Timeline/ClientApp/src/app/user-dialog/user.service.ts b/Timeline/ClientApp/src/app/user-dialog/user.service.ts
index 1afebc91..b0a6eb15 100644
--- a/Timeline/ClientApp/src/app/user-dialog/user.service.ts
+++ b/Timeline/ClientApp/src/app/user-dialog/user.service.ts
@@ -46,7 +46,7 @@ export class AlreadyLoginException extends Error {
 
 export class BadCredentialsException extends Error {
   constructor(username: string = null , password: string = null) {
-    super(`Username[${username}] or password[${password}] is wrong.`);
+    super(`Username or password is wrong.`);
   }
 }
 
-- 
cgit v1.2.3