arreglo validaciones en password perfil

src/main/webapp/app/account/settings/settings.component.html

@@ -293,10 +293,21 @@
       name="passwordForm"
       role="form"
       novalidate
-      (ngSubmit)="save()"
+      (ngSubmit)="savePassword()"
       [formGroup]="passwordForm"
     >
+      <div *ngIf="success" class="alert alert-success alert-dismissible fade show" role="alert">
+        Sus contraseña fue actualizada de manera exitosa
+        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
+          <span aria-hidden="true">&times;</span>
+        </button>
+      </div>
+
       <div class="row mb-3 pb-3" style="border-bottom: 1px solid #e7ebf3">
+        <div class="alert alert-danger" *ngIf="doNotMatch" jhiTranslate="global.messages.error.dontmatch">
+          The password and its confirmation do not match!
+        </div>
+
         <div class="form-group w-100">
           <label class="form-control-label" for="field_password">Contraseña actual</label>
           <input
@@ -323,6 +334,22 @@
             >
               This field is required.
             </small>
+
+            <small
+              class="form-text text-danger"
+              *ngIf="passwordForm.get('password')?.errors?.minlength"
+              jhiTranslate="global.messages.validate.newpassword.minlength"
+            >
+              Your password is required to be at least 4 characters.
+            </small>
+
+            <small
+              class="form-text text-danger"
+              *ngIf="passwordForm.get('password')?.errors?.maxlength"
+              jhiTranslate="global.messages.validate.newpassword.maxlength"
+            >
+              Your password cannot be longer than 50 characters.
+            </small>
           </div>
         </div>
       </div>
@@ -353,6 +380,22 @@
             >
               This field is required.
             </small>
+
+            <small
+              class="form-text text-danger"
+              *ngIf="passwordForm.get('passwordNew')?.errors?.minlength"
+              jhiTranslate="global.messages.validate.newpassword.minlength"
+            >
+              Your password is required to be at least 4 characters.
+            </small>
+
+            <small
+              class="form-text text-danger"
+              *ngIf="passwordForm.get('passwordNew')?.errors?.maxlength"
+              jhiTranslate="global.messages.validate.newpassword.maxlength"
+            >
+              Your password cannot be longer than 50 characters.
+            </small>
           </div>
         </div>
       </div>
@@ -384,6 +427,21 @@
             >
               This field is required.
             </small>
+            <small
+              class="form-text text-danger"
+              *ngIf="passwordForm.get('passwordNewConfirm')?.errors?.minlength"
+              jhiTranslate="global.messages.validate.newpassword.minlength"
+            >
+              Your password is required to be at least 4 characters.
+            </small>
+
+            <small
+              class="form-text text-danger"
+              *ngIf="passwordForm.get('passwordNewConfirm')?.errors?.maxlength"
+              jhiTranslate="global.messages.validate.newpassword.maxlength"
+            >
+              Your password cannot be longer than 50 characters.
+            </small>
           </div>
         </div>
       </div>

src/main/webapp/app/account/settings/settings.component.ts

@@ -16,6 +16,7 @@ import { UsuarioExtraService } from 'app/entities/usuario-extra/service/usuario-
 import { AccountService } from 'app/core/auth/account.service';
 import { LocalStorageService } from 'ngx-webstorage';
 import { EMAIL_ALREADY_USED_TYPE, LOGIN_ALREADY_USED_TYPE } from '../../config/error.constants';
+import { PasswordService } from '../password/password.service';
 
 @Component({
   selector: 'jhi-settings',
@@ -25,6 +26,7 @@ export class SettingsComponent implements OnInit {
   isSaving = false;
   success = false;
   error = false;
+  doNotMatch = false;
   usersSharedCollection: IUser[] = [];
   plantillasSharedCollection: IPlantilla[] = [];
 
@@ -44,9 +46,9 @@ export class SettingsComponent implements OnInit {
 
   //form de la contraseña
   passwordForm = this.fb.group({
-    password: [null, [Validators.required]],
+    password: [null, [Validators.required], Validators.minLength(8), Validators.maxLength(50)],
-    passwordNew: [null, [Validators.required]],
+    passwordNew: [null, [Validators.required], Validators.minLength(8), Validators.maxLength(50)],
-    passwordNewConfirm: [null, [Validators.required]],
+    passwordNewConfirm: [null, [Validators.required, Validators.minLength(8), Validators.maxLength(50)]],
   });
 
   usuarioExtra: UsuarioExtra | null = null;
@@ -89,7 +91,8 @@ export class SettingsComponent implements OnInit {
     protected activatedRoute: ActivatedRoute,
     protected fb: FormBuilder,
     protected accountService: AccountService,
-    private localStorageService: LocalStorageService
+    private localStorageService: LocalStorageService,
+    protected passwordService: PasswordService
   ) {}
 
   ngOnInit(): void {
@@ -131,6 +134,20 @@ export class SettingsComponent implements OnInit {
     console.log(usuarioExtra.fechaNacimiento);
 
     this.subscribeToSaveResponse(this.usuarioExtraService.update(usuarioExtra));
+
+    window.location.reload();
+  }
+
+  savePassword(): void {
+    const password = this.passwordForm.get(['password'])!.value;
+    if (password !== this.passwordForm.get(['passwordNew'])!.value) {
+      this.doNotMatch = true;
+    } else {
+      this.passwordService.save(this.passwordForm.get(['passwordNew'])!.value, password).subscribe(
+        () => (this.success = true),
+        () => (this.error = true)
+      );
+    }
   }
 
   trackUserById(index: number, item: IUser): number {
@@ -237,8 +254,6 @@ export class SettingsComponent implements OnInit {
     };
   }
 
-  protected CreateFormPassword();
-
   selectIcon(event: MouseEvent): void {
     if (event.target instanceof Element) {
       document.querySelectorAll('.active').forEach(e => e.classList.remove('active'));