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

Style du login

Browse Source
This commit is contained in:
Sébastien André
2020-03-14 22:19:33 +01:00
parent e7a3d2c23f
commit 0e3fdd8f54
8 changed files with 121 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,26 +1,22 @@
<div class="col-md-6 offset-md-3 mt-5">
<div class="alert alert-info">
Username: test<br />
Password: test
</div>
<div class="card">
<h4 class="card-header">Angular 8 Basic Auth Login Example</h4>
<h4 class="card-header">Login to the Skydive log</h4>
<div class="card-body">
<form [formGroup]="loginForm" (ngSubmit)="onSubmit()">
<form [formGroup]="loginForm" (ngSubmit)="onLoginSubmit()">
<div class="form-group">
<label for="username">Username</label>
<input type="text" formControlName="username" class="form-control"
[ngClass]="{ 'is-invalid': submitted && f.username.errors }" />
<div *ngIf="submitted && f.username.errors" class="invalid-feedback">
<div *ngIf="f.username.errors.required">Username is required</div>
[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>
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" formControlName="password" class="form-control"
[ngClass]="{ 'is-invalid': submitted && f.password.errors }" />
<div *ngIf="submitted && f.password.errors" class="invalid-feedback">
<div *ngIf="f.password.errors.required">Password is required</div>
[ngClass]="{ 'is-invalid': submitted && loginCtrls.password.errors }" />
<div *ngIf="submitted && loginCtrls.password.errors" class="invalid-feedback">
<div *ngIf="loginCtrls.password.errors.required">Password is required</div>
</div>
</div>
<button [disabled]="loading" class="btn btn-primary">
@@ -29,6 +25,30 @@
</button>
<div *ngIf="error" class="alert alert-danger mt-3 mb-0">{{error}}</div>
</form>
<form [formGroup]="createForm" (ngSubmit)="onCreateSubmit()">
<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>
</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>
</div>
<button [disabled]="loading" class="btn btn-primary">
<span *ngIf="loading" class="spinner-border spinner-border-sm mr-1"></span>
Create user and login
</button>
<div *ngIf="error" class="alert alert-danger mt-3 mb-0">{{error}}</div>
</form>
</div>
</div>
</div>