55 lines
2.6 KiB
HTML
55 lines
2.6 KiB
HTML
<div class="col-md-6 offset-md-3 mt-5">
|
|
<div class="card">
|
|
<h4 class="card-header">Login to the Skydive log</h4>
|
|
<div class="card-body">
|
|
<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 && 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 && 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">
|
|
<span *ngIf="loading" class="spinner-border spinner-border-sm mr-1"></span>
|
|
Login
|
|
</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>
|