81 lines
4.7 KiB
HTML
81 lines
4.7 KiB
HTML
<section class="login-wrapper">
|
|
<div class="login-form-wrapper register-form-wrapper">
|
|
<div class="login-form">
|
|
<form [formGroup]="loginForm">
|
|
<h1>sh-edraft.de</h1>
|
|
<div class="input-field">
|
|
<input type="text" pInputText formControlName="firstName" placeholder="Vorname"
|
|
autocomplete="given-name">
|
|
<div *ngIf="submitted" class="invalid-feedback">
|
|
<div
|
|
*ngIf="loginForm.controls.firstName.errors && loginForm.controls.firstName.errors.required || authUserAtrErrors.firstName.required">
|
|
Vorname wird benötigt</div>
|
|
<div *ngIf="authUserAtrErrors.firstName.wrongData">Vorname ist ungültig</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="input-field">
|
|
<input type="text" pInputText formControlName="lastName" placeholder="Nachname"
|
|
autocomplete="family-name">
|
|
<div *ngIf="submitted" class="invalid-feedback">
|
|
<div
|
|
*ngIf="loginForm.controls.lastName.errors && loginForm.controls.lastName.errors.required || authUserAtrErrors.lastName.required">
|
|
Nachname wird benötigt</div>
|
|
<div *ngIf="authUserAtrErrors.lastName.wrongData">Nachname ist ungültig</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="input-field">
|
|
<input type="email" pInputText formControlName="email" placeholder="E-Mail"
|
|
[ngClass]="{ 'invalid-feedback-input': submitted && (authUserAtrErrors.email.wrongData || loginForm.controls.email.errors && loginForm.controls.email.errors.required || authUserAtrErrors.email.required)}"
|
|
autocomplete="username email">
|
|
<div *ngIf="submitted" class="invalid-feedback">
|
|
<div
|
|
*ngIf="loginForm.controls.email.errors && loginForm.controls.email.errors.required || authUserAtrErrors.email.required">
|
|
E-Mail wird benötigt</div>
|
|
<div *ngIf="authUserAtrErrors.email.wrongData">Benutzer existiert bereits</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="input-field">
|
|
<input type="email" pInputText formControlName="emailRepeat" placeholder="E-Mail wiederholen"
|
|
[ngClass]="{ 'invalid-feedback-input': submitted && repeatErrors.email}">
|
|
<div *ngIf="submitted" class="invalid-feedback">
|
|
<div *ngIf="repeatErrors.email">Die E-Mails stimmen nicht überein</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="input-field">
|
|
<p-password type="password" formControlName="password" placeholder="Passwort"
|
|
ngClass="{ 'invalid-feedback': submitted && loginForm.controls.password.errors && loginForm.controls.password.errors.required || authUserAtrErrors.password.required}"
|
|
autocomplete="new-password" [toggleMask]="true" [feedback]="false"></p-password>
|
|
<div *ngIf="submitted" class="invalid-feedback">
|
|
<div
|
|
*ngIf="loginForm.controls.password.errors && loginForm.controls.password.errors.required || authUserAtrErrors.password.required">
|
|
Password wird benötigt</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="input-field">
|
|
<p-password type="password" formControlName="passwordRepeat"
|
|
placeholder="Passwort wiederholen"
|
|
[ngClass]="{ 'invalid-feedback-input': submitted && repeatErrors.password}" [toggleMask]="true" [feedback]="false"></p-password>
|
|
<div *ngIf="submitted" class="invalid-feedback">
|
|
<div *ngIf="repeatErrors.password">Die Passwörter stimmen nicht überein</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="login-form-submit">
|
|
<button pButton label="Registrieren" class="btn login-form-submit-btn" (click)="register()"
|
|
[disabled]="loginForm.invalid"></button>
|
|
</div>
|
|
|
|
<div class="login-form-sub-button-wrapper">
|
|
<div class="login-form-sub-btn-wrapper">
|
|
<button pButton label="Einloggen" class="btn login-form-sub-btn" (click)="login()"></button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</section> |