Commit 8b474d9d authored by Jie Yuan's avatar Jie Yuan

add login comp

parent b6119211
.example-form {
min-width: 150px;
max-width: 500px;
width: 100%;
}
.example-full-width {
width: 100%;
}
.card-container.card {
max-width: 20%;
padding: 40px 40px;
margin:0 auto;
vertical-align:middle;
}
.example-button-row button,
.example-button-row a {
float: left;
width: 200px;
text-align: center;
}
.b2accessbutton {
float: left;
width: 200px;
text-align: center;
}
.textp{
text-align: left;
}
img {
width: 80%;
}
.dps-div {
float: left;
width: 500px;
text-align: center;
}
\ No newline at end of file
<div >
<div class="card card-container">
<div>
<img src="assets/logoSideBar.png" alt="Banner Image" class="logoSideBarImg"/>
</div>
<div>
<p>Service Version Monitoring Framework for ESOC-hub.</p>
<p>&nbsp;</p>
</div>
<div>
<form class="example-form" #form="ngForm" (ngSubmit)="login(form)" ngNativeValidate>
<mat-form-field class="example-full-width" >
<input matInput placeholder="Email/Username" type="text" [(ngModel)]="username" name="username" required autofocus>
</mat-form-field>
<mat-form-field class="example-full-width" >
<input matInput placeholder="Password" type="Password" [(ngModel)]="password" name="password" required autofocus>
</mat-form-field>
<div class="example-button-row">
<button mat-raised-button> Sign In</button>
</div>
</form>
</div>
<p>&nbsp;</p>
<p>&nbsp;</p>
<mat-divider></mat-divider>
<p class="textp">Or sign in with</p>
<div class="example-button-row">
<button mat-raised-button (click)="onLoginWithB2Access()"> EUDAT B2ACCESS</button>
</div>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<div class="dps-div">
<a href='https://eosc-hub.eu'> About EOSC-hub </a>
<a>&nbsp;&nbsp;&nbsp;</a>
<a href='https://eudat.eu' >About EUDAT</a>
<a>&nbsp;&nbsp;&nbsp;</a>
<a href='/dps' > Data Privacy Statement</a>
</div>
</div>
</div>
<router-outlet></router-outlet>
\ No newline at end of file
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { LoginComponent } from './login.component';
describe('LoginComponent', () => {
let component: LoginComponent;
let fixture: ComponentFixture<LoginComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ LoginComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(LoginComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import { Component, OnInit } from '@angular/core';
import { NgForm } from '@angular/forms';
import {Router, ActivatedRoute} from '@angular/router';
import {AuthService} from '../auth.service';
import { Route } from '@angular/compiler/src/core';
@Component({
selector: 'app-login',
templateUrl: './login.component.html',
styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {
username: string;
password: string;
constructor(private authService: AuthService, public router: Router, public route: ActivatedRoute) {
this.username = "";
this.password = "";
}
ngOnInit() {
}
onLoginWithB2Access(){
console.log("B2access clicked");
this.authService.aaiRedirect();
}
login(form: NgForm){
if (form.valid) {
this.authService.credentialAuthenticate(this.username, this.password);
/** this.authService.login()
.then(logStatus => {
this.authService.isAuthenticated()
.then(
(data) => {
this.router.navigate(['dashboard'])
.then(sucess => {
})
.catch();
}
);
})
.catch(error => {
});
*/
}
this.username = '';
this.password = '';
}
public dpsClick() {
this.router.navigate(['/dps'], { relativeTo: this.route });
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment