|
| 1 | +import { Component, OnInit, Injector, ViewChild, ElementRef, AfterViewInit } from '@angular/core'; |
| 2 | +import { appModuleAnimation } from '@shared/animations/routerTransition'; |
| 3 | +import { AppComponentBase } from '@shared/app-component-base'; |
| 4 | +import { ChangePasswordDto, UserServiceProxy } from '@shared/service-proxies/service-proxies'; |
| 5 | +import { Router } from '@angular/router'; |
| 6 | +import { FormGroup, FormControl, Validators, AbstractControl, ValidationErrors, FormGroupDirective, NgForm } from '@angular/forms'; |
| 7 | +import { finalize } from 'rxjs/operators'; |
| 8 | +import { ErrorStateMatcher } from '@angular/material'; |
| 9 | + |
| 10 | +export class FormGroupErrorStateMatcher implements ErrorStateMatcher { |
| 11 | + constructor(private formGroup: FormGroup) { } |
| 12 | + |
| 13 | + public isErrorState(control: FormControl | null, form: FormGroupDirective | NgForm | null): boolean { |
| 14 | + return control && control.dirty && control.touched && this.formGroup && this.formGroup.errors && this.formGroup.errors.areEqual; |
| 15 | + } |
| 16 | +} |
| 17 | + |
| 18 | +@Component({ |
| 19 | + animations: [appModuleAnimation()], |
| 20 | + templateUrl: './change-password.component.html' |
| 21 | +}) |
| 22 | +export class ChangePasswordComponent extends AppComponentBase implements OnInit { |
| 23 | + public parentFormGroup: FormGroup; |
| 24 | + public passwordsFormGroup: FormGroup; |
| 25 | + public isLoading: boolean; |
| 26 | + public equalMatcher: FormGroupErrorStateMatcher; |
| 27 | + |
| 28 | + private static areEqual(c: AbstractControl): ValidationErrors | null { |
| 29 | + const keys: string[] = Object.keys(c.value); |
| 30 | + for (const i in keys) { |
| 31 | + if (i !== '0' && c.value[keys[+i - 1]] !== c.value[keys[i]]) { |
| 32 | + return { areEqual: true }; |
| 33 | + } |
| 34 | + } |
| 35 | + } |
| 36 | + |
| 37 | + public constructor( |
| 38 | + injector: Injector, |
| 39 | + private userServiceProxy: UserServiceProxy, |
| 40 | + private router: Router |
| 41 | + ) { |
| 42 | + super(injector); |
| 43 | + } |
| 44 | + |
| 45 | + public ngOnInit() { |
| 46 | + this.isLoading = true; |
| 47 | + |
| 48 | + this.passwordsFormGroup = new FormGroup({ |
| 49 | + 'newPassword': new FormControl('', [ |
| 50 | + Validators.required, |
| 51 | + Validators.pattern('(?=^.{8,}$)(?=.*\\d)(?=.*[a-z])(?=.*[A-Z])(?!.*\\s)[0-9a-zA-Z!@#$%^&*()]*$') ]), |
| 52 | + 'repeatNewPassword': new FormControl('', [ Validators.required ]) |
| 53 | + }, ChangePasswordComponent.areEqual); |
| 54 | + |
| 55 | + this.parentFormGroup = new FormGroup({ |
| 56 | + 'currentPassword': new FormControl('', [ Validators.required ]), |
| 57 | + 'passwords': this.passwordsFormGroup |
| 58 | + }); |
| 59 | + |
| 60 | + this.equalMatcher = new FormGroupErrorStateMatcher(this.passwordsFormGroup); |
| 61 | + |
| 62 | + this.doneLoading(); |
| 63 | + } |
| 64 | + |
| 65 | + public updatePassword(formValue: any) { |
| 66 | + const changePasswordDto = new ChangePasswordDto(); |
| 67 | + changePasswordDto.currentPassword = formValue.currentPassword; |
| 68 | + changePasswordDto.newPassword = formValue.passwords.newPassword; |
| 69 | + |
| 70 | + this.isLoading = true; |
| 71 | + this.userServiceProxy.changePassword(changePasswordDto) |
| 72 | + .pipe( |
| 73 | + finalize(() => { |
| 74 | + this.doneLoading(); |
| 75 | + }) |
| 76 | + ) |
| 77 | + .subscribe(success => { |
| 78 | + if (success) { |
| 79 | + abp.message.success('Password changed successfully', 'Success'); |
| 80 | + this.router.navigate(['/']); |
| 81 | + } |
| 82 | + }); |
| 83 | + } |
| 84 | + |
| 85 | + private doneLoading(): void { |
| 86 | + this.isLoading = false; |
| 87 | + } |
| 88 | +} |
0 commit comments