fixing login page.

This commit is contained in:
Jason Kulatunga 2022-09-12 17:07:38 -04:00
parent d67650eaf1
commit b5e12c0374
5 changed files with 50 additions and 22 deletions

View File

@ -5,21 +5,42 @@
<h2>Welcome back!</h2>
<h4>Please sign in to continue</h4>
<form>
<form (ngSubmit)="signinSubmit()" #userForm="ngForm">
<div class="form-group">
<label>Email</label>
<input type="text" class="form-control" placeholder="Enter your email" value="demo@bootstrapdash.com">
<input [(ngModel)]="existingUser.username" name="username" #username="ngModel" required minlength="2" type="text" class="form-control" placeholder="Enter your email">
<div *ngIf="username.invalid && (username.dirty || username.touched)" class="alert alert-danger">
<div *ngIf="username.errors?.['required']">
Email is required.
</div>
<div *ngIf="username.errors?.['minlength']">
Email must be at least 4 characters long.
</div>
<div *ngIf="username.errors?.['email']">
Email is not a valid email address.
</div>
</div>
</div><!-- form-group -->
<div class="form-group">
<label>Password</label>
<input type="password" class="form-control" placeholder="Enter your password" value="thisisademo">
<input [(ngModel)]="existingUser.password" name="password" #password="ngModel" required minlength="8" type="password" class="form-control" placeholder="Enter your password">
<div *ngIf="password.invalid && (password.dirty || password.touched)" class="alert alert-danger">
<div *ngIf="password.errors?.['required']">
Password is required.
</div>
<div *ngIf="password.errors?.['minlength']">
Password must be at least 8 characters long.
</div>
</div>
</div><!-- form-group -->
<a class="btn btn-az-primary btn-block" routerLink="/">Sign In</a>
<button [disabled]="!userForm.form.valid" type="submit" class="btn btn-az-primary btn-block">Sign In</button>
</form>
</div><!-- az-signin-header -->
<div class="az-signin-footer">
<p><a href="">Forgot password?</a></p>
<p>Don't have an account? <a routerLink="/general-pages/signup">Create an Account</a></p>
<p>Don't have an account? <a routerLink="/auth/signup">Create an Account</a></p>
</div><!-- az-signin-footer -->
</div><!-- az-card-signin -->
</div><!-- az-signin-wrapper -->

View File

@ -1,4 +1,7 @@
import { Component, OnInit } from '@angular/core';
import {User} from '../../models/fasten/user';
import {FastenApiService} from '../../services/fasten-api.service';
import {Router} from '@angular/router';
@Component({
selector: 'app-auth-signin',
@ -6,10 +9,21 @@ import { Component, OnInit } from '@angular/core';
styleUrls: ['./auth-signin.component.scss']
})
export class AuthSigninComponent implements OnInit {
submitted: boolean = false
existingUser: User = new User()
constructor() { }
constructor(private fastenApi: FastenApiService, private router: Router) { }
ngOnInit(): void {
}
signinSubmit(){
this.submitted = true;
this.fastenApi.signin(this.existingUser.username, this.existingUser.password).subscribe((tokenResp: any) => {
console.log(tokenResp);
this.router.navigateByUrl('/dashboard');
})
}
}

View File

@ -7,8 +7,6 @@
<p>We are excited to launch our new company and product Azia. After being featured in too many magazines to mention and having created an online stir, we know that BootstrapDash is going to be big. We also hope to win Startup Fictional Business of the Year this year.</p>
<p>Browse our site and see for yourself why you need Azia.</p>
<a routerLink="/" class="btn btn-outline-indigo">Learn More</a>
{{ newUser | json }}
</div>
</div><!-- az-column-signup-left -->
<div class="az-column-signup">
@ -58,7 +56,7 @@
Password is required.
</div>
<div *ngIf="password.errors?.['minlength']">
Name must be at least 8 characters long.
Password must be at least 8 characters long.
</div>
</div>
</div><!-- form-group -->
@ -66,7 +64,7 @@
</form>
</div><!-- az-signup-header -->
<div class="az-signup-footer">
<p>Already have an account? <a routerLink="auth/signin">Sign In</a></p>
<p>Already have an account? <a routerLink="/auth/signin">Sign In</a></p>
</div><!-- az-signin-footer -->
</div><!-- az-column-signup -->
</div><!-- az-signup-wrapper -->

View File

@ -26,7 +26,6 @@ export class AuthSignupComponent implements OnInit {
this.router.navigateByUrl('/dashboard');
})
}
}

View File

@ -46,23 +46,19 @@ export class FastenApiService {
}
signin(email: string, pass: string) {
const headers = {
headers: new HttpHeaders({ 'Content-Type': 'application/json', 'Cache-Control': 'no-cache' })
};
signin(username: string, pass: string): Observable<any> {
const data = {
email: email,
username: username,
password: pass
};
this._httpClient.post<any>(`${this.getBasePath()}/api/auth/signin`, data, headers).subscribe(
(res: any) => {
localStorage.setItem(this.AUTH_TOKEN_KEY, res.token);
this.router.navigateByUrl('/dashboard');
return this._httpClient.post<any>(`${this.getBasePath()}/api/auth/signin`, data).pipe(
map((res: any) => {
localStorage.setItem(this.AUTH_TOKEN_KEY, res.data);
return res.data
}
);
));
}