79 lines
2.2 KiB
HTML
79 lines
2.2 KiB
HTML
<h1 mat-dialog-title>Hi </h1>
|
|
<form [formGroup]="signUpForm">
|
|
<div mat-dialog-content>
|
|
<p>User name</p>
|
|
<mat-form-field class="fillField">
|
|
<input matInput
|
|
formControlName="username"
|
|
[(ngModel)]="data.username"
|
|
minlength="3"
|
|
>
|
|
</mat-form-field>
|
|
<p>Email</p>
|
|
<mat-form-field class="fillField">
|
|
<mat-label>Email</mat-label>
|
|
<input matInput type="email"
|
|
formControlName="email"
|
|
|
|
placeholder="Ex. pat@example.com"
|
|
[(ngModel)]="data.email"
|
|
(blur)="updateErrorMessage()"
|
|
required
|
|
>
|
|
@if (emailFormControl.invalid) {
|
|
<mat-error>{{errorMessage()}}</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<p>Password</p>
|
|
<mat-form-field class="fillField">
|
|
<mat-label>Enter your password</mat-label>
|
|
<input matInput
|
|
|
|
formControlName = "password"
|
|
[type]="hide() ? 'password' : 'text'"
|
|
[(ngModel)]="data.password"
|
|
minlength="6"
|
|
required
|
|
/>
|
|
<button
|
|
mat-icon-button
|
|
matSuffix
|
|
(click)="clickEvent($event)"
|
|
[attr.aria-label]="'Hide password'"
|
|
[attr.aria-pressed]="hide()"
|
|
>
|
|
<mat-icon>{{hide() ? 'visibility_off' : 'visibility'}}</mat-icon>
|
|
</button>
|
|
</mat-form-field>
|
|
<p>Confirm password</p>
|
|
<mat-form-field class="fillField">
|
|
<mat-label>Confirm your password</mat-label>
|
|
<input matInput
|
|
|
|
formControlName = "confirmPassword"
|
|
[type]="hide() ? 'password' : 'text'"
|
|
[(ngModel)]="data.confirmPassword"
|
|
/>
|
|
@if (signUpForm.get("confirmPassword")?.value !== signUpForm.get("password")?.value) {
|
|
<mat-error>Passwords do not match</mat-error>
|
|
}
|
|
<button
|
|
mat-icon-button
|
|
matSuffix
|
|
(click)="clickEvent($event)"
|
|
[attr.aria-label]="'Hide password'"
|
|
[attr.aria-pressed]="hide()"
|
|
>
|
|
<mat-icon>{{hide() ? 'visibility_off' : 'visibility'}}</mat-icon>
|
|
</button>
|
|
</mat-form-field>
|
|
</div>
|
|
|
|
<div mat-dialog-actions>
|
|
<button mat-button (click)="login()">Login</button>
|
|
<span class="menu-spacer"></span>
|
|
<button mat-button mat-dialog-close (click)="onNoClick()">No Thanks</button>
|
|
<button mat-button cdkFocusInitial (click)="signup()">Ok</button>
|
|
</div>
|
|
</form>
|