sandre/SkydiveLogs
0
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Ajout de style

Browse Source
This commit is contained in:
Sébastien André
2020-03-26 15:03:40 +01:00
parent 50785a4914
commit 9d0c5fbfb1
7 changed files with 81 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
Front/skydivelogs-app/src/app/app.component.html
View File

@@ -1,15 +1,23 @@
<div>
<header *ngIf="this.show()">
<svg (click)="toggleMenu()" class="hamburger__icon" viewBox="31.5 30 49.9 32">
<rect id="Rectangle_9" width="49.9" height="4" class="hamburger__icon__fill" data-name="Rectangle 9" rx="2"
transform="translate(31.5 58)"></rect>
<rect id="Rectangle_10" width="49.9" height="4" class="hamburger__icon__fill" data-name="Rectangle 10" rx="2"
transform="translate(31.5 44)"></rect>
<rect id="Rectangle_11" width="49.9" height="4" class="hamburger__icon__fill" data-name="Rectangle 11" rx="2"
transform="translate(31.5 30)"></rect>
</svg>
<h2 style="display: inline;">{{ title }}</h2>
<div style="display: flex; flex-wrap: nowrap; flex-direction: row; align-items: baseline;">
<div>
<svg (click)="toggleMenu()" class="hamburger__icon" viewBox="31.5 30 49.9 32">
<rect id="Rectangle_9" width="49.9" height="4" class="hamburger__icon__fill" data-name="Rectangle 9" rx="2"
transform="translate(31.5 58)"></rect>
<rect id="Rectangle_10" width="49.9" height="4" class="hamburger__icon__fill" data-name="Rectangle 10" rx="2"
transform="translate(31.5 44)"></rect>
<rect id="Rectangle_11" width="49.9" height="4" class="hamburger__icon__fill" data-name="Rectangle 11" rx="2"
transform="translate(31.5 30)"></rect>
</svg>
<h2>{{ title }}</h2>
</div>
<div style="text-align: right;">
<h2 *ngIf="currentUser">{{ this.currentUser.firstName }}
{{ this.currentUser.lastName }}</h2>
<a *ngIf="currentUser" (click)="logout()" style="cursor: pointer;">Logout</a>
</div>
</div>
<nav class="navigation" [ngClass]="{'side-menu-active': showMenu}">
<ul>
@@ -27,7 +35,6 @@
gears</a></li>
<li><a routerLink="/newjump" routerLinkActive="active" (click)="toggleMenu()" skipLocationChange>Add a new
jump</a></li>
<li *ngIf="currentUser"><a class="nav-item nav-link" (click)="logout()">Logout</a></li>
</ul>
</nav>
</header>

6
Front/skydivelogs-app/src/app/app.component.ts
View File

@@ -12,9 +12,9 @@ import { ServiceComm } from "../services/service-comm.service";
styleUrls: ["./app.component.css"]
})
export class AppComponent implements OnInit {
title = "app";
showMenu = false;
currentUser: User;
public title = "app";
public showMenu = false;
public currentUser: User;
constructor(
private router: Router,

40
Front/skydivelogs-app/src/app/create-user/create-user.component.html
View File

@@ -2,47 +2,47 @@
<div class="form-group">
<label for="firstname">Firstname</label>
<input type="text" formControlName="firstname" class="form-control"
[ngClass]="{ 'is-invalid': submitted && createCtrls.firstname.errors }" />
<div *ngIf="submitted && createCtrls.firstname.errors" class="invalid-feedback">
<div *ngIf="createCtrls.firstname.errors.required">Firstname is required</div>
<div *ngIf="createCtrls.firstname.errors.minlength">Firstname must have min 3 characters</div>
[ngClass]="{ 'is-invalid': submitted && formCtrls.firstname.errors }" />
<div *ngIf="submitted && formCtrls.firstname.errors" class="invalid-feedback">
<div *ngIf="formCtrls.firstname.errors.required">Firstname is required</div>
<div *ngIf="formCtrls.firstname.errors.minlength">Firstname must have min 3 characters</div>
</div>
</div>
<div class="form-group">
<label for="lastname">Lastname</label>
<input type="text" formControlName="lastname" class="form-control"
[ngClass]="{ 'is-invalid': submitted && createCtrls.lastname.errors }" />
<div *ngIf="submitted && createCtrls.lastname.errors" class="invalid-feedback">
<div *ngIf="createCtrls.lastname.errors.required">Lastname is required</div>
<div *ngIf="createCtrls.lastname.errors.minlength">Lastname must have min 3 characters</div>
[ngClass]="{ 'is-invalid': submitted && formCtrls.lastname.errors }" />
<div *ngIf="submitted && formCtrls.lastname.errors" class="invalid-feedback">
<div *ngIf="formCtrls.lastname.errors.required">Lastname is required</div>
<div *ngIf="formCtrls.lastname.errors.minlength">Lastname must have min 3 characters</div>
</div>
</div>
<div class="form-group">
<label for="email">E-mail</label>
<input type="text" formControlName="email" class="form-control"
[ngClass]="{ 'is-invalid': submitted && createCtrls.email.errors }" />
<div *ngIf="submitted && createCtrls.email.errors" class="invalid-feedback">
<div *ngIf="createCtrls.email.errors.required">E-mail is required</div>
<div *ngIf="createCtrls.email.errors.email">It's not a e-mail</div>
[ngClass]="{ 'is-invalid': submitted && formCtrls.email.errors }" />
<div *ngIf="submitted && formCtrls.email.errors" class="invalid-feedback">
<div *ngIf="formCtrls.email.errors.required">E-mail is required</div>
<div *ngIf="formCtrls.email.errors.email">It's not a e-mail</div>
</div>
</div>
<div class="form-group">
<label for="username">Username</label>
<input type="text" formControlName="username" class="form-control"
[ngClass]="{ 'is-invalid': submitted && createCtrls.username.errors }" />
<div *ngIf="submitted && createCtrls.username.errors" class="invalid-feedback">
<div *ngIf="createCtrls.username.errors.required">Username is required</div>
<div *ngIf="createCtrls.username.errors.minlength">Username must have min 3 characters</div>
[ngClass]="{ 'is-invalid': submitted && formCtrls.username.errors }" />
<div *ngIf="submitted && formCtrls.username.errors" class="invalid-feedback">
<div *ngIf="formCtrls.username.errors.required">Username is required</div>
<div *ngIf="formCtrls.username.errors.minlength">Username must have min 3 characters</div>
</div>
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" formControlName="password" class="form-control"
[ngClass]="{ 'is-invalid': submitted && createCtrls.password.errors }" />
<div *ngIf="submitted && createCtrls.password.errors" class="invalid-feedback">
<div *ngIf="createCtrls.password.errors.required">Password is required</div>
<div *ngIf="createCtrls.password.errors.pattern">The pattern of the password ([A-Za-z0-9_-]
[ngClass]="{ 'is-invalid': submitted && formCtrls.password.errors }" />
<div *ngIf="submitted && formCtrls.password.errors" class="invalid-feedback">
<div *ngIf="formCtrls.password.errors.required">Password is required</div>
<div *ngIf="formCtrls.password.errors.pattern">The pattern of the password ([A-Za-z0-9_-]
{{ '{' }}8,15{{ '}' }})</div>
</div>
</div>

35
Front/skydivelogs-app/src/app/create-user/create-user.component.ts
View File

@@ -32,22 +32,25 @@ export class CreateUserComponent implements OnInit {
}
ngOnInit() {
this.createForm = this.formBuilder.group({
username: ["", [Validators.required, Validators.minLength(3)]],
password: [
"",
[Validators.required, Validators.pattern("^[A-Za-z0-9_-]{8,15}$")]
],
firstname: ["", [Validators.required, Validators.minLength(3)]],
lastname: ["", [Validators.required, Validators.minLength(3)]],
email: ["", [Validators.required, Validators.email]]
});
this.createForm = this.formBuilder.group(
{
username: ["", [Validators.required, Validators.minLength(3)]],
password: [
"",
[Validators.required, Validators.pattern("^[A-Za-z0-9_-]{8,15}$")]
],
firstname: ["", [Validators.required, Validators.minLength(3)]],
lastname: ["", [Validators.required, Validators.minLength(3)]],
email: ["", [Validators.required, Validators.email]]
},
{ updateOn: "submit" }
);
// get return url from route parameters or default to '/'
this.returnUrl = this.route.snapshot.queryParams["returnUrl"] || "/";
}
get createCtrls() {
get formCtrls() {
return this.createForm.controls;
}
@@ -62,11 +65,11 @@ export class CreateUserComponent implements OnInit {
}
let createUser = new User();
createUser.login = this.createCtrls.username.value;
createUser.password = this.createCtrls.password.value;
createUser.firstName = this.createCtrls.firstname.value;
createUser.lastName = this.createCtrls.lastname.value;
createUser.email = this.createCtrls.email.value;
createUser.login = this.formCtrls.username.value;
createUser.password = this.formCtrls.password.value;
createUser.firstName = this.formCtrls.firstname.value;
createUser.lastName = this.formCtrls.lastname.value;
createUser.email = this.formCtrls.email.value;
this.authenticationService
.create(createUser)

14
Front/skydivelogs-app/src/app/default/default.component.ts
View File

@@ -1,15 +1,15 @@
import { Component, OnInit } from '@angular/core';
import { Component, OnInit } from "@angular/core";
import { ServiceComm } from "../../services/service-comm.service";
@Component({
selector: 'app-default',
templateUrl: './default.component.html',
styleUrls: ['./default.component.css']
selector: "app-default",
templateUrl: "./default.component.html",
styleUrls: ["./default.component.css"]
})
export class DefaultComponent implements OnInit {
constructor() { }
constructor(private serviceComm: ServiceComm) {}
ngOnInit() {
this.serviceComm.UpdatedComponentTitle("Home");
}
}

16
Front/skydivelogs-app/src/app/login-user/login-user.component.html
View File

@@ -2,19 +2,19 @@
<div class="form-group">
<label for="username">Username</label>
<input type="text" formControlName="username" class="form-control"
[ngClass]="{ 'is-invalid': submitted && loginCtrls.username.errors }" />
<div *ngIf="submitted && loginCtrls.username.errors" class="invalid-feedback">
<div *ngIf="loginCtrls.username.errors.required">Username is required</div>
<div *ngIf="createCtrls.username.errors.minlength">Username must have min 3 characters</div>
[ngClass]="{ 'is-invalid': submitted && formCtrls.username.errors }" />
<div *ngIf="submitted && formCtrls.username.errors" class="invalid-feedback">
<div *ngIf="formCtrls.username.errors.required">Username is required</div>
<div *ngIf="formCtrls.username.errors.minlength">Username must have min 3 characters</div>
</div>
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" formControlName="password" class="form-control"
[ngClass]="{ 'is-invalid': submitted && loginCtrls.password.errors }" />
<div *ngIf="submitted && loginCtrls.password.errors" class="invalid-feedback">
<div *ngIf="createCtrls.password.errors.required">Password is required</div>
<div *ngIf="createCtrls.password.errors.pattern">The pattern of the password ([A-Za-z0-9_-]
[ngClass]="{ 'is-invalid': submitted && formCtrls.password.errors }" />
<div *ngIf="submitted && formCtrls.password.errors" class="invalid-feedback">
<div *ngIf="formCtrls.password.errors.required">Password is required</div>
<div *ngIf="formCtrls.password.errors.pattern">The pattern of the password ([A-Za-z0-9_-]
{{ '{' }}8,15{{ '}' }})</div>
</div>
</div>

10
Front/skydivelogs-app/src/app/login-user/login-user.component.ts
View File

@@ -36,17 +36,19 @@ export class LoginUserComponent implements OnInit {
username: ["", [Validators.required, Validators.minLength(3)]],
password: [
"",
[Validators.required, Validators.pattern("^[A-Za-z0-9_-]{8,15}$")]
[
Validators.required /*, Validators.pattern("^[A-Za-z0-9_-]{8,15}$")*/
]
]
},
{ updateOn: "blur" }
{ updateOn: "submit" }
);
// get return url from route parameters or default to '/'
this.returnUrl = this.route.snapshot.queryParams["returnUrl"] || "/";
}
get loginCtrls() {
get formCtrls() {
return this.loginForm.controls;
}
@@ -60,7 +62,7 @@ export class LoginUserComponent implements OnInit {
this.loading = true;
this.authenticationService
.login(this.loginCtrls.username.value, this.loginCtrls.password.value)
.login(this.formCtrls.username.value, this.formCtrls.password.value)
.pipe(first())
.subscribe(
data => {