diff --git a/client/src/app/users/user-login-form/user-login-form.component.html b/client/src/app/users/user-login-form/user-login-form.component.html index 0df1f07d864ecd0c6172b5fa0a3762fad6d49887..eef16a753d7e6b413b223860361a29d1eb1a647a 100644 --- a/client/src/app/users/user-login-form/user-login-form.component.html +++ b/client/src/app/users/user-login-form/user-login-form.component.html @@ -1 +1,11 @@ -<p>user-login-form works!</p> +<div class="loginForm"> + <h3>Login</h3> + + <app-text-input [(inputModel)]="username" label="Brukernavn" (blur)="checkForm()"></app-text-input> + + <app-text-input [(inputModel)]="password" label="Passord" (blur)="checkForm()"></app-text-input> + + <p>{{statusMessage}}</p> + + <app-button (click)="loginUser()" text="Login"></app-button> +</div> diff --git a/client/src/app/users/user-login-form/user-login-form.component.ts b/client/src/app/users/user-login-form/user-login-form.component.ts index 11765575e887e7fea94cc0cf18095a747e51ff98..24057cbcefc53d9e5f0bb169537f82d8515b8006 100644 --- a/client/src/app/users/user-login-form/user-login-form.component.ts +++ b/client/src/app/users/user-login-form/user-login-form.component.ts @@ -1,4 +1,7 @@ import { Component, OnInit } from '@angular/core'; +import { Router } from '@angular/router'; +import { User } from 'src/app/models/user.model'; +import { UserService } from '../user.service'; @Component({ selector: 'app-user-login-form', @@ -6,10 +9,57 @@ import { Component, OnInit } from '@angular/core'; styleUrls: ['./user-login-form.component.scss'] }) export class UserLoginFormComponent implements OnInit { + username: string = ""; + password: string = ""; - constructor() { } + statusMessage: string = ""; + + constructor(private userService: UserService, private router: Router) { } ngOnInit(): void { } + /** + * Validates form. + */ + checkForm(): boolean { + if (this.username == "") { + this.setStatusMessage("Brukernavn kan ikke være tom"); + return false; + } + else if (this.password == "") { + this.setStatusMessage("Passordet kan ikke være tom"); + return false; + } + + this.setStatusMessage(""); + return true; + } + + /** + * Login the user if it is valid. + */ + loginUser() { + if (this.checkForm()) { + const request = { + username: this.username, + password: this.password, + }; + + // Adds user to database and changes page afterwards + this.userService.login(request).then(status => { + console.log("User login: " + JSON.stringify(status)); + this.router.navigateByUrl("/"); + }).catch(error => { + console.log("Error adding user: " + error); + }); + } + } + + /** + * Sets a status message. + */ + setStatusMessage(message: string) { + this.statusMessage = message; + } } diff --git a/client/src/app/users/user-registration-form/user-registration-form.component.ts b/client/src/app/users/user-registration-form/user-registration-form.component.ts index 277492015956e6cd3f8732364b576c9d8ca3fd6f..ac3c25c7e7db69b2af0f6e03dd380725d905ea76 100644 --- a/client/src/app/users/user-registration-form/user-registration-form.component.ts +++ b/client/src/app/users/user-registration-form/user-registration-form.component.ts @@ -54,7 +54,7 @@ export class UserRegistrationFormComponent implements OnInit { // Adds user to database and changes page afterwards this.userService.addUser(newUser).then(status => { - console.log("User was added: " + status); + console.log("User was added: " + JSON.stringify(status)); this.router.navigateByUrl("/"); }).catch(error => { console.log("Error adding user: " + error); diff --git a/client/src/app/users/user.service.ts b/client/src/app/users/user.service.ts index 2767961e04590e1ed0077c0037a9b9fdf8f62038..d5ad7a411b883902213d92f91576deec7b9ea75f 100644 --- a/client/src/app/users/user.service.ts +++ b/client/src/app/users/user.service.ts @@ -2,15 +2,44 @@ import { HttpClient } from '@angular/common/http'; import { Injectable } from '@angular/core'; import { User } from '../models/user.model'; +interface IUserLogin { + username: string; + password: string; +} + @Injectable({ providedIn: 'root' }) export class UserService { - userUrl = "api/user/" + loginUrl = "api/user/login" constructor(private http: HttpClient) { } + /** + * Get request of user from database on login request. + */ + login(body: IUserLogin): Promise<string> { + return new Promise<string>( + (resolve, reject) => { + this.login_user(body).subscribe((data: any) => { + try { + resolve(data.data); + } catch (err: any) { + reject(err); + } + }, + (err: any) => { + console.log(err.message); + reject(err); + }); + } + ); + } + + private login_user(body: IUserLogin) { + return this.http.post(this.loginUrl, body); + } /** * Adds user to database. */ @@ -19,7 +48,7 @@ export class UserService { (resolve, reject) => { this.add_user(user).subscribe((data: any) => { try { - resolve(data.status); + resolve(data.data); } catch (err: any) { reject(err); } diff --git a/server/src/controllers/userController/index.ts b/server/src/controllers/userController/index.ts index 8bc393a47ed75a0864a3ffda17be3450aba44f67..f45e65b84e04f91af4dc713afb020471ef2d36ef 100644 --- a/server/src/controllers/userController/index.ts +++ b/server/src/controllers/userController/index.ts @@ -27,24 +27,35 @@ router.route('/').post(async (request: Request, response: Response) => { // Get all users `/api/user/` router.route('/').get(async (_: Request, response: Response) => { try { - const input = "SELECT * FROM user;" + const input = "SELECT userId, username, email, create_time FROM user;" response.status(200).json(await query(input,"")); } catch (error) { response.status(400).send("Bad Request"); } }); -// Get post with id `/api/user/:id` +// Get user with id `/api/user/:id` router.route('/:userId').get(async (request: Request, response: Response) => { const userId = request.params.userId; try { - const input = `SELECT * FROM user WHERE userId=?;` + const input = `SELECT userId, username, email, create_time FROM user WHERE userId=?;` response.status(200).json(await query(input,[userId])); } catch (error) { response.status(400).send("Bad Request"); } }); +// Get user with username and password `/api/user/` +router.route('/login').post(async (request: Request, response: Response) => { + const {username, password} = request.body; + try { + const input = "SELECT userId, username, email, create_time FROM user WHERE username=? AND password=?;" + response.status(200).json(await query(input,[username, password])); + } catch (error) { + response.status(400).send("Bad Request"); + } +}); + /* ============================= UPDATE ============================= */ // Update user from id `/api/user/:id` router.route('/:userId').put(async (request: Request, response: Response) => {