Merge with main changes

pull/4/head
Alvaro Puente Mella 2024-06-17 13:20:51 +02:00
commit 5a107b0885
5 changed files with 49 additions and 27 deletions

View File

@ -1,7 +1,7 @@
<div class="sidebar" [class.visible]="isVisible"> <div class="sidebar" [class.visible]="isVisible">
<div class="sidebar-content"> <div class="sidebar-content">
<h4>Bienvenido {{username}}</h4> <h4>Bienvenido {{username}}</h4>
<button mat-flat-button color="primary" (click)="editUser(username)">Editar usuario</button> <button mat-flat-button color="primary" (click)="editUser('username')">Editar usuario</button>
<button mat-flat-button color="accent" routerLink="/admin" *ngIf="isSuperAdmin">Admin</button> <button mat-flat-button color="accent" routerLink="/admin" *ngIf="isSuperAdmin">Admin</button>
</div> </div>
</div> </div>

View File

@ -12,17 +12,18 @@ import { ChangePasswordModalComponent } from '../../pages/admin/users/users/chan
export class SidebarComponent { export class SidebarComponent {
@Input() isVisible: boolean = false; @Input() isVisible: boolean = false;
isSuperAdmin: boolean = false; isSuperAdmin: boolean = false;
username: string = localStorage.getItem('username') ?? ''; username: string = "";
decodedToken: any = "";
constructor(public dialog: MatDialog) {} constructor(public dialog: MatDialog) {}
ngOnInit(): void { ngOnInit(): void {
const token = localStorage.getItem('loginToken'); const token = localStorage.getItem('loginToken');
if (token) { if (token) {
try { try {
const decodedToken: any = jwtDecode(token); this.decodedToken = jwtDecode(token);
console.log('Decoded JWT:', decodedToken); console.log('Decoded token:', this.decodedToken);
this.isSuperAdmin = decodedToken.roles.includes('ROLE_SUPER_ADMIN'); this.isSuperAdmin = this.decodedToken.roles.includes('ROLE_SUPER_ADMIN');
this.username = this.decodedToken.username;
} catch (error) { } catch (error) {
console.error('Error decoding JWT:', error); console.error('Error decoding JWT:', error);
} }
@ -32,10 +33,10 @@ export class SidebarComponent {
editUser(user: any) { editUser(user: any) {
// Implementar la lógica de edición // Implementar la lógica de edición
const dialogRef = this.dialog.open(ChangePasswordModalComponent, { const dialogRef = this.dialog.open(ChangePasswordModalComponent, {
data: { user: user } data: { user: this.decodedToken.username, uuid: this.decodedToken.uuid },
}); });
dialogRef.componentInstance.userEdited.subscribe(() => { /* dialogRef.componentInstance.userEdited.subscribe(() => {
console.log("User edited successfully!") console.log("User edited successfully!")
}); }); */
} }
} }

View File

@ -1,10 +1,15 @@
.user-form .form-field { .user-form .form-field {
display: block; display: block;
margin-bottom: 10px; /* Puedes ajustar el valor para cambiar la separación */ margin-bottom: 10px;
} }
.checkbox-group label { .checkbox-group label {
display: block; display: block;
margin-bottom: 8px; /* Ajusta este valor según necesites */ margin-bottom: 8px;
}
.error-message {
color: red;
margin-top: 10px;
} }

View File

@ -6,13 +6,21 @@
<input matInput formControlName="username"> <input matInput formControlName="username">
</mat-form-field> </mat-form-field>
<mat-form-field class="form-field"> <mat-form-field class="form-field">
<mat-label>Contraseña</mat-label> <mat-label>Nueva contraseña</mat-label>
<input matInput formControlName="password" type="password"> <input matInput formControlName="password" type="password">
</mat-form-field> </mat-form-field>
<mat-form-field class="form-field"> <mat-form-field class="form-field">
<mat-label>Repite la contraseña</mat-label> <mat-label>Repite la contraseña</mat-label>
<input matInput formControlName="confirmPassword" type="password"> <input matInput formControlName="confirmPassword" type="password">
</mat-form-field> </mat-form-field>
@if (passwordMismatch) {
<div class="error-message">Las contraseñas no coinciden</div>
}
@if (updateError) {
<div class="error-message">Error, inténtelo de nuevo</div>
}
</form> </form>
</div> </div>
<div mat-dialog-actions> <div mat-dialog-actions>

View File

@ -1,6 +1,7 @@
import { Component, EventEmitter, Inject, OnInit, Output } from '@angular/core'; import { Component, EventEmitter, Inject, Output } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from '@angular/forms'; import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { EditUserModalComponent } from '../edit-user-modal/edit-user-modal.component';
import { UserService } from '../users.service'; import { UserService } from '../users.service';
@Component({ @Component({
@ -8,25 +9,28 @@ import { UserService } from '../users.service';
templateUrl: './change-password-modal.component.html', templateUrl: './change-password-modal.component.html',
styleUrl: './change-password-modal.component.css' styleUrl: './change-password-modal.component.css'
}) })
export class ChangePasswordModalComponent {
export class ChangePasswordModalComponent implements OnInit {
@Output() userEdited = new EventEmitter<void>(); @Output() userEdited = new EventEmitter<void>();
userForm: FormGroup; userForm: FormGroup;
passwordMismatch: boolean = false;
updateError: boolean = false;
constructor( constructor(
public dialogRef: MatDialogRef<ChangePasswordModalComponent>, public dialogRef: MatDialogRef<EditUserModalComponent>,
@Inject(MAT_DIALOG_DATA) public data: any, @Inject(MAT_DIALOG_DATA) public data: any,
private fb: FormBuilder, private fb: FormBuilder,
private userService: UserService private userService: UserService
) { ) {
this.userForm = this.fb.group({ this.userForm = this.fb.group({
username: [this.data.user, Validators.required], username: [this.data.user, Validators.required],
password: [''], password: ['', Validators.required],
confirmPassword: [''] confirmPassword: ['', Validators.required]
}, { validators: this.passwordMatchValidator }); }, { validators: this.passwordMatchValidator });
} }
ngOnInit(): void {} ngOnInit(): void {
console.log('Data:', this.data);
}
onNoClick(): void { onNoClick(): void {
this.dialogRef.close(); this.dialogRef.close();
@ -34,15 +38,18 @@ export class ChangePasswordModalComponent implements OnInit {
onSubmit(): void { onSubmit(): void {
if (this.userForm.valid) { if (this.userForm.valid) {
this.passwordMismatch = false;
this.updateError = false;
const userPayload = { const userPayload = {
username: this.userForm.value.username, username: this.userForm.value.username,
allowedOrganizationalUnits: this.data.user.allowedOrganizationalUnits, allowedOrganizationalUnits: [],
password: this.userForm.value.password, password: this.userForm.value.password,
enabled: true, enabled: true,
userGroups: this.data.user.userGroups userGroups: []
}; };
console.log("THIS IS THE USER PAYLOAD: ", userPayload);
this.userService.updateUser(this.data.user.uuid, userPayload).subscribe( this.userService.updateUser(this.data.uuid, userPayload).subscribe(
response => { response => {
console.log('User updated successfully:', response); console.log('User updated successfully:', response);
this.userEdited.emit(); this.userEdited.emit();
@ -50,12 +57,13 @@ export class ChangePasswordModalComponent implements OnInit {
}, },
error => { error => {
console.error('Error updating user:', error); console.error('Error updating user:', error);
// Agregar alguna lógica para manejar el error en la interfaz de usuario this.updateError = true;
} }
); );
} else { } else {
console.error('Form is invalid'); console.error('Form is invalid');
// Agregar alguna lógica para manejar el error en la interfaz de usuario this.passwordMismatch = this.userForm.hasError('mismatch');
this.updateError = true;
} }
} }