admin/cmc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

145. Login template - final (#18)

Browse Source
This commit is contained in:
Art
2021-09-17 21:48:35 +03:00
parent c0cbe7fa5a
commit efad81dda5
3 changed files with 20 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
support-portal-frontend/src/app/app.module.ts
View File

@ -12,6 +12,7 @@ import {LoginComponent} from './component/login/login.component';
import {RegisterComponent} from './component/register/register.component'; import {RegisterComponent} from './component/register/register.component';
import {UserComponent} from './component/user/user.component'; import {UserComponent} from './component/user/user.component';
import {AppRoutingModule} from './app-routing.module'; import {AppRoutingModule} from './app-routing.module';
import {FormsModule} from "@angular/forms";
@NgModule({ @NgModule({
declarations: [ declarations: [
@ -24,7 +25,8 @@ import {AppRoutingModule} from './app-routing.module';
BrowserModule, BrowserModule,
HttpClientModule, HttpClientModule,
NotificationModule, NotificationModule,
AppRoutingModule AppRoutingModule,
FormsModule
], ],
providers: [AuthenticationGuard, AuthenticationService, UserService, providers: [AuthenticationGuard, AuthenticationService, UserService,
{provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true} {provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true}

24
support-portal-frontend/src/app/component/login/login.component.html
View File

@ -7,33 +7,37 @@
</div> </div>
</div> </div>
<div class="d-flex justify-content-center form_container"> <div class="d-flex justify-content-center form_container">
<form> <form #loginForm="ngForm" (ngSubmit)="onLogin(loginForm.value)">
<div class="input-group mb-3"> <div class="input-group mb-3">
<div class="input-group-append"> <div class="input-group-append">
<span class="input-group-text"><i class="fas fa-user"></i></span> <span class="input-group-text"><i class="fas fa-user"></i></span>
</div> </div>
<input type="text" class="form-control" name="username" placeholder="Username" required> <input type="text" class="form-control" name="username" placeholder="Username"
ngModel #usernameInput="ngModel" required>
</div> </div>
<span class="help-block" style="color:red;">Please enter a username</span> <span class="help-block" style="color:red;" *ngIf="usernameInput.invalid && usernameInput.touched">
Please enter a username</span>
<div class="input-group mb-2"> <div class="input-group mb-2">
<div class="input-group-append"> <div class="input-group-append">
<span class="input-group-text"><i class="fas fa-key"></i></span> <span class="input-group-text"><i class="fas fa-key"></i></span>
</div> </div>
<input type="password" class="form-control" name="password" placeholder="Password" required> <input type="password" class="form-control" name="password" placeholder="Password"
ngModel #passwordInput="ngModel" required>
</div> </div>
<span class="help-block" style="color:red;">Please enter a password.</span> <span class="help-block" style="color:red;" *ngIf="passwordInput.invalid && passwordInput.touched"
>Please enter a password.</span>
<div class="d-flex justify-content-center mt-3 login_container"> <div class="d-flex justify-content-center mt-3 login_container">
<button type="submit" name="button" class="btn login_btn"> <button type="submit" name="button" class="btn login_btn">
<i class="fas fa-spinner fa-spin"></i>&nbsp;&nbsp; <i class="fas fa-spinner fa-spin" *ngIf="showLoading"></i>&nbsp;&nbsp;
<span>Loading...</span> <span *ngIf="showLoading">Loading...</span>
<span>Login</span> <span *ngIf="!showLoading">Login</span>
</button> </button>
</div> </div>
</form> </form>
</div> </div>
<div class="mt-4"> <div class="mt-4">
<div class="d-flex justify-content-center links"> <div class="d-flex justify-content-center links">
Don't have an account? <a class="ml-2" style="color: #2C3E50;">Sign Up</a> Don't have an account? <a class="ml-2" style="color: #2C3E50;">Sign Up</a>
</div> </div>
</div> </div>
</div> </div>

6
support-portal-frontend/src/app/service/authentication.service.ts
View File

@ -1,6 +1,6 @@
import {Injectable} from '@angular/core'; import {Injectable} from '@angular/core';
import {environment} from "../../environments/environment"; import {environment} from "../../environments/environment";
import {HttpClient, HttpErrorResponse, HttpResponse} from "@angular/common/http"; import {HttpClient, HttpResponse} from "@angular/common/http";
import {UserLogin} from "../dto/user-login"; import {UserLogin} from "../dto/user-login";
import {Observable} from "rxjs"; import {Observable} from "rxjs";
import {User} from "../model/user"; import {User} from "../model/user";
@ -30,9 +30,9 @@ export class AuthenticationService {
(`${this.host}/user/login`, userDto, {observe: 'response'}); (`${this.host}/user/login`, userDto, {observe: 'response'});
} }
public register(user: User): Observable<User | HttpErrorResponse> { public register(user: User): Observable<User> {
return this.httpClient return this.httpClient
.post<User | HttpErrorResponse>(`${this.host}/user/register`, user); .post<User>(`${this.host}/user/register`, user);
} }
public logout(): void { public logout(): void {