82 lines
4.0 KiB
HTML
82 lines
4.0 KiB
HTML
<div class="option" [class.mobile]="breakpoint() == 'mobile'">
|
|
<ng-template [(tuiDialog)]="changePasswordDialogOpen"
|
|
[tuiDialogOptions]="{label: ('chat.userSettingsDialog.security.changePasswordDialog.'+ (changePasswordRemoveMode() ? 'labelRemove' : serviceManager.currentSession()!.userData.passwordSet ? 'label' : 'labelSet'))|translate}">
|
|
<p>{{"chat.userSettingsDialog.security.changePasswordDialog.warn"|translate}}</p>
|
|
<form [formGroup]="changeEmailForm" style="display: flex; flex-direction: column; gap: 10px">
|
|
@if (serviceManager.currentSession()!.userData.passwordSet) {
|
|
<tui-textfield iconStart="@tui.key">
|
|
<label
|
|
tuiLabel>{{ "chat.userSettingsDialog.security.changePasswordDialog.currentPassword"|translate }}</label>
|
|
<input formControlName="currentPassword" tuiInput type="password">
|
|
</tui-textfield>
|
|
|
|
@if (changeEmailForm.controls['currentPassword'].dirty) {
|
|
@if (changeEmailForm.controls['currentPassword'].hasError("required")) {
|
|
<tui-error
|
|
[error]="'chat.userSettingsDialog.security.changePasswordDialog.errors.currentPasswordRequired'|translate"></tui-error>
|
|
}
|
|
|
|
@if (changeEmailForm.controls['currentPassword'].hasError("incorrect")) {
|
|
<tui-error
|
|
[error]="'chat.userSettingsDialog.security.changePasswordDialog.errors.incorrectPassword'|translate"></tui-error>
|
|
}
|
|
}
|
|
}
|
|
|
|
@if (!changePasswordRemoveMode()) {
|
|
<tui-textfield iconStart="@tui.badge-plus">
|
|
<label tuiLabel>{{ "chat.userSettingsDialog.security.changePasswordDialog.newPassword"|translate }}</label>
|
|
<input formControlName="newPassword" tuiInput type="password">
|
|
</tui-textfield>
|
|
|
|
<tui-textfield iconStart="@tui.badge-plus">
|
|
<label
|
|
tuiLabel>{{ "chat.userSettingsDialog.security.changePasswordDialog.newPasswordRepeat"|translate }}</label>
|
|
<input formControlName="newPasswordRepeat" tuiInput type="password">
|
|
</tui-textfield>
|
|
}
|
|
</form>
|
|
|
|
<footer>
|
|
<button tuiButton iconStart="@tui.check" [loading]="changePasswordPending()"
|
|
[disabled]="changeEmailForm.invalid || changePasswordPending()"
|
|
(click)="changePassword(changeEmailForm.controls['currentPassword'].value, changeEmailForm.controls['newPassword'].value)">
|
|
{{ ('chat.userSettingsDialog.security.changePasswordDialog.' + (changePasswordRemoveMode() ? 'labelRemove' : serviceManager.currentSession()!.userData.passwordSet ? 'label' : 'labelSet'))|translate }}
|
|
</button>
|
|
</footer>
|
|
</ng-template>
|
|
|
|
<header>
|
|
<tui-icon icon="@tui.key"/>
|
|
<span>{{ "chat.userSettingsDialog.security.password"|translate }}</span>
|
|
|
|
@if (serviceManager.currentSession()!.userData.passwordSet) {
|
|
<div tuiBadge appearance="positive"
|
|
iconStart="@tui.check">{{ 'chat.userSettingsDialog.security.set'|translate }}
|
|
</div>
|
|
} @else {
|
|
<div tuiBadge appearance="negative"
|
|
iconStart="@tui.x">{{ 'chat.userSettingsDialog.security.notSet'|translate }}
|
|
</div>
|
|
}
|
|
</header>
|
|
|
|
<main>
|
|
<button tuiButton appearance="outline" (click)="openChangePasswordDialog(false)"
|
|
[iconStart]="serviceManager.currentSession()!.userData.passwordSet ? '@tui.pencil' : '@tui.plus'">
|
|
@if (serviceManager.currentSession()!.userData.passwordSet) {
|
|
{{ "chat.userSettingsDialog.security.changePassword"|translate }}
|
|
} @else {
|
|
{{ "chat.userSettingsDialog.security.setPassword"|translate }}
|
|
}
|
|
</button>
|
|
|
|
@if (serviceManager.currentSession()!.userData.passwordSet) {
|
|
<button tuiButton appearance="outline" tuiAppearanceMode="invalid" iconStart="@tui.x" [disabled]="!serviceManager.currentSession()!.userData.phoneSet && !serviceManager.currentSession()!.userData.emailSet"
|
|
style="color: var(--tui-text-negative)" (click)="openChangePasswordDialog(true)">
|
|
{{ "chat.userSettingsDialog.security.removePassword"|translate }}
|
|
</button>
|
|
}
|
|
</main>
|
|
</div>
|