123 lines
4.8 KiB
HTML
123 lines
4.8 KiB
HTML
<h1>Создание администратора</h1>
|
||
<hr/>
|
||
<p class="mat-body-2 secondary">
|
||
На этой странице вы можете создать учетную запись администратора.
|
||
</p>
|
||
<p class="mat-body-2 secondary">
|
||
Заполните необходимые поля, такие как имя пользователя, адрес электронной почты и пароль, чтобы создать учетную запись
|
||
с правами администратора для управления приложением.
|
||
</p>
|
||
|
||
<form [formGroup]="createAdminForm">
|
||
<p>
|
||
Ведите данные для создания аккаунта администратора:
|
||
</p>
|
||
<div style="display:flex; flex-direction: column;">
|
||
<mat-form-field color="accent">
|
||
<mat-label>Имя пользователя</mat-label>
|
||
<input matInput
|
||
matTooltip='Укажите имя пользователя используя латинские буквы и цифры без пробелов'
|
||
required
|
||
formControlName="user">
|
||
|
||
@if (createAdminForm.get('user')?.hasError('required')) {
|
||
<mat-error>
|
||
Имя пользователя является <i>обязательным</i>
|
||
</mat-error>
|
||
}
|
||
|
||
@if (createAdminForm.get('user')?.hasError('pattern')) {
|
||
<mat-error>
|
||
Имя пользователя должен содержать латинские символы и цифры и быть не менее 4 символов
|
||
</mat-error>
|
||
}
|
||
</mat-form-field>
|
||
|
||
<mat-form-field color="accent">
|
||
<mat-label>Email</mat-label>
|
||
<input matInput
|
||
matTooltip="Укажите email администратора"
|
||
required
|
||
formControlName="email">
|
||
|
||
@if (createAdminForm.get('email')?.hasError('required')) {
|
||
<mat-error>
|
||
Email является <i>обязательным</i>
|
||
</mat-error>
|
||
}
|
||
|
||
@if (createAdminForm.get('email')?.hasError('email')) {
|
||
<mat-error>
|
||
Введите корректный Email адрес
|
||
</mat-error>
|
||
}
|
||
</mat-form-field>
|
||
|
||
<mat-form-field color="accent" style="margin-bottom: 20px">
|
||
<mat-label>Пароль</mat-label>
|
||
<input matInput
|
||
matTooltip="Укажите пароль"
|
||
formControlName="password"
|
||
required
|
||
[type]="hidePass ? 'password' : 'text'">
|
||
|
||
<button mat-icon-button matSuffix (click)="togglePassword($event)" [attr.aria-label]="'Hide password'"
|
||
[attr.aria-pressed]="hidePass">
|
||
<mat-icon>{{ hidePass ? 'visibility_off' : 'visibility' }}</mat-icon>
|
||
</button>
|
||
|
||
@if (createAdminForm.get('password')?.hasError('required')) {
|
||
<mat-error>
|
||
Пароль является <i>обязательным</i>
|
||
</mat-error>
|
||
}
|
||
|
||
@if (createAdminForm.get('password')?.hasError('minlength')) {
|
||
<mat-error>
|
||
Пароль должен быть не менее {{ policy.minimumLength }} символов
|
||
</mat-error>
|
||
}
|
||
|
||
@if (createAdminForm.get('password')?.hasError('pattern')) {
|
||
<mat-error>
|
||
Пароль должен содержать:
|
||
@if (policy.requireLettersDifferentCase) {
|
||
* Латинские символы разных регистров
|
||
} @else if (policy.requireLetter) {
|
||
* Один латинский символ
|
||
} @else if (policy.requireDigit) {
|
||
* Одну цифру
|
||
}
|
||
@if (policy.requireSpecialCharacter) {
|
||
* специальный символ
|
||
}
|
||
</mat-error>
|
||
}
|
||
</mat-form-field>
|
||
|
||
<mat-form-field color="accent">
|
||
<mat-label>Повторите пароль</mat-label>
|
||
<input matInput
|
||
matTooltip="Укажите пароль, который был указан ранее"
|
||
formControlName="retype"
|
||
required
|
||
[type]="hideRetypePass ? 'password' : 'text'"
|
||
onpaste="return false;">
|
||
|
||
<button mat-icon-button matSuffix (click)="toggleRetypePassword($event)" [attr.aria-label]="'Hide password'"
|
||
[attr.aria-pressed]="hideRetypePass">
|
||
<mat-icon>{{ hideRetypePass ? 'visibility_off' : 'visibility' }}</mat-icon>
|
||
</button>
|
||
|
||
@if (createAdminForm.get('retype')?.hasError('passwordsMismatch')) {
|
||
<mat-error>
|
||
Пароли не совпадают
|
||
</mat-error>
|
||
}
|
||
</mat-form-field>
|
||
|
||
<OAuthProviders [canUnlink]="true" [activeProvidersId]="activatedProviders" (oAuthUpdateProviders)="updateProviders()"
|
||
[message]="'Или можете получить часть данных от сторонних сервисов'"/>
|
||
</div>
|
||
</form>
|