join/src/app/components/login/forgot-pw/forgot-pw.component.html
2024-05-20 17:35:00 +02:00

72 lines
2.1 KiB
HTML

<section>
<app-header [signUpBtn]="true"></app-header>
<form
id="form"
#taskForm="ngForm"
(ngSubmit)="onSubmit(taskForm)"
onsubmit="return false"
>
<div class="content">
<div class="header">
<app-btn-back></app-btn-back>
<div class="headline">{{ "forgotPW.forgot" | translate }}</div>
<div class="spacer"></div>
</div>
<div class="line">
<img src="./../../../assets/img/login/blue-line.svg" alt="" />
</div>
<div class="input-fields">
<input
type="mail"
id="mail"
name="mail"
#mail="ngModel"
placeholder="{{ 'forgotPW.email' | translate }}"
class="custom-input"
autocomplete="email"
[(ngModel)]="pwResetData.mail"
required
/>
@if(!pwResetData.mail) {
<img
class="custom-img"
src="./../../../assets/img/login/mail.svg"
alt=""
/>
} @else {
<img class="custom-img" alt="" />
}
<div class="error-msg">
@if(!mail.valid && mail.touched &&
!checkIfUserEmailIsValid(pwResetData.mail.toLowerCase())) {
<p>{{ "register.errorMail0" | translate }}</p>
} @else { @if (mail.touched &&
!checkIfUserEmailIsValid(pwResetData.mail.toLowerCase())) {
<p>{{ "register.errorMail1" | translate }}</p>
} @else {
@if(existEmailonServer(pwResetData.mail.toLowerCase()).length !== 1 &&
mail.touched) {
<p>{{ "register.errorMail3" | translate }}</p>
} } }
</div>
</div>
<div class="notice">
<p>{{ "forgotPW.notice" | translate }}</p>
</div>
<div class="form-buttons">
<app-form-btn
[class]="'btn-login'"
[type]="'submit'"
[value]="'forgotPW.sendMail' | translate"
[disabled]="
mail.invalid ||
!pwResetData.mail ||
sharedService.isBtnDisabled ||
!checkIfUserEmailIsValid(pwResetData.mail)
"
></app-form-btn>
</div>
</div>
</form>
<app-footer></app-footer>
</section>