Login added and added api code
This commit is contained in:
parent
c13dfc54fd
commit
b6ab962f36
4 changed files with 65 additions and 13 deletions
|
@ -7,13 +7,14 @@
|
|||
<div class="card-block">
|
||||
<h1>Login</h1>
|
||||
<p class="text-muted">Sign In to your account</p>
|
||||
<form [formGroup]="signin" (ngSubmit)="onSubmit()">
|
||||
<div class="input-group mb-3">
|
||||
<span class="input-group-addon"><i class="icon-user"></i></span>
|
||||
<input type="text" class="form-control" placeholder="Username">
|
||||
<span class="input-group-addon">@</span>
|
||||
<input type="text" class="form-control" placeholder="Email">
|
||||
</div>
|
||||
<div class="input-group mb-4">
|
||||
<span class="input-group-addon"><i class="icon-lock"></i></span>
|
||||
<input type="password" class="form-control" placeholder="Password">
|
||||
<input type="password" class="form-control" formControlName="password" placeholder="Password">
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
|
@ -23,6 +24,7 @@
|
|||
<button type="button" class="btn btn-link px-0">Forgot password?</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card card-inverse card-primary py-5 d-md-down-none" style="width:44%">
|
||||
|
|
|
@ -1,10 +1,49 @@
|
|||
import { Component } from '@angular/core';
|
||||
import { Validators, FormBuilder, FormGroup } from '@angular/forms';
|
||||
import { Http, Response } from '@angular/http';
|
||||
import { ApiService } from '../providers/api-service';
|
||||
import 'rxjs/add/operator/map';
|
||||
|
||||
@Component({
|
||||
templateUrl: 'login.component.html'
|
||||
templateUrl: 'login.component.html',
|
||||
providers: [ApiService]
|
||||
})
|
||||
export class LoginComponent {
|
||||
signin: FormGroup;
|
||||
ageRanges: Object[];
|
||||
|
||||
constructor(
|
||||
private http: Http,
|
||||
private formBuilder: FormBuilder,
|
||||
private api: ApiService
|
||||
) {
|
||||
this.api.getAgeRanges()
|
||||
.subscribe(
|
||||
result => {
|
||||
console.log(result);
|
||||
this.ageRanges = result.ages;
|
||||
}
|
||||
);
|
||||
this.signin = this.formBuilder.group({
|
||||
email: ['', [Validators.required]],
|
||||
password: ['', [Validators.required]],
|
||||
});
|
||||
}
|
||||
|
||||
onSubmit() {
|
||||
console.log(this.signin.value);
|
||||
|
||||
this.peopleService
|
||||
.register(this.signin.value)
|
||||
.subscribe(
|
||||
result => {
|
||||
console.log( logged in! );
|
||||
},
|
||||
error => {
|
||||
console.log( error._body );
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
constructor() { }
|
||||
|
||||
}
|
||||
}
|
|
@ -9,27 +9,27 @@
|
|||
<p class="text-muted">Create your account</p>
|
||||
<div class="input-group mb-3">
|
||||
<span class="input-group-addon"><i class="icon-key"></i></span>
|
||||
<input type="text" class="form-control" placeholder="Token">
|
||||
<input type="text" class="form-control" formControlName="token" placeholder="Token">
|
||||
</div>
|
||||
|
||||
<div class="input-group mb-3">
|
||||
<span class="input-group-addon"><i class="icon-user"></i></span>
|
||||
<input type="text" class="form-control" placeholder="Username">
|
||||
<input type="text" class="form-control" formControlName="full_name" placeholder="Username">
|
||||
</div>
|
||||
|
||||
<div class="input-group mb-3">
|
||||
<span class="input-group-addon"><i class="icon-user"></i></span>
|
||||
<input type="text" class="form-control" placeholder="Full Name">
|
||||
<input type="text" class="form-control" formControlName="display_name" placeholder="Full Name">
|
||||
</div>
|
||||
|
||||
<div class="input-group mb-3">
|
||||
<span class="input-group-addon">@</span>
|
||||
<input type="text" class="form-control" placeholder="Email">
|
||||
<input type="text" class="form-control" formControlName="email" placeholder="Email">
|
||||
</div>
|
||||
|
||||
<div class="input-group mb-3">
|
||||
<span class="input-group-addon"><i class="icon-user"></i></span>
|
||||
<input type="text" class="form-control" placeholder="Postcode">
|
||||
<input type="text" class="form-control" formControlName="postcode" placeholder="Postcode">
|
||||
</div>
|
||||
|
||||
<div class="input-group mb-3">
|
||||
|
@ -41,12 +41,12 @@
|
|||
|
||||
<div class="input-group mb-3">
|
||||
<span class="input-group-addon"><i class="icon-lock"></i></span>
|
||||
<input type="password" class="form-control" placeholder="Password">
|
||||
<input type="password" class="form-control" formControlName="password" placeholder="Password">
|
||||
</div>
|
||||
|
||||
<div class="input-group mb-4">
|
||||
<span class="input-group-addon"><i class="icon-lock"></i></span>
|
||||
<input type="password" class="form-control" placeholder="Repeat password">
|
||||
<input type="password" class="form-control" formControlName="password" placeholder="Repeat password">
|
||||
</div>
|
||||
|
||||
<button type="button" class="btn btn-block btn-success">Create Account</button>
|
||||
|
|
|
@ -37,6 +37,17 @@ export class RegisterComponent {
|
|||
|
||||
onSubmit() {
|
||||
console.log(this.signup.value);
|
||||
|
||||
this.peopleService
|
||||
.register(this.signup.value)
|
||||
.subscribe(
|
||||
result => {
|
||||
console.log( registered! );
|
||||
},
|
||||
error => {
|
||||
console.log( error._body );
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
|
|
Reference in a new issue