From fdf8659eea9d34f23175ca8c01400ace8798f5e8 Mon Sep 17 00:00:00 2001 From: apuente Date: Wed, 29 May 2024 17:18:22 +0200 Subject: [PATCH] Pagina usuarios modales delete --- .../add-user-modal.component.css | 10 +++++ .../add-user-modal.component.html | 23 +++++++++- .../add-user-modal.component.ts | 43 ++++++++++++++++--- .../delete-user-modal.component.html | 2 +- .../delete-user-modal.component.ts | 28 ++++++++++-- .../admin/users/users/users.component.ts | 14 +++--- 6 files changed, 101 insertions(+), 19 deletions(-) diff --git a/ogWebconsole/src/app/components/pages/admin/users/users/add-user-modal/add-user-modal.component.css b/ogWebconsole/src/app/components/pages/admin/users/users/add-user-modal/add-user-modal.component.css index e69de29..6916e95 100644 --- a/ogWebconsole/src/app/components/pages/admin/users/users/add-user-modal/add-user-modal.component.css +++ b/ogWebconsole/src/app/components/pages/admin/users/users/add-user-modal/add-user-modal.component.css @@ -0,0 +1,10 @@ +.user-form .form-field { + display: block; + margin-bottom: 10px; /* Puedes ajustar el valor para cambiar la separación */ + } + + .checkbox-group label { + display: block; + margin-bottom: 8px; /* Ajusta este valor según necesites */ + } + \ No newline at end of file diff --git a/ogWebconsole/src/app/components/pages/admin/users/users/add-user-modal/add-user-modal.component.html b/ogWebconsole/src/app/components/pages/admin/users/users/add-user-modal/add-user-modal.component.html index 7f26618..4e11caa 100644 --- a/ogWebconsole/src/app/components/pages/admin/users/users/add-user-modal/add-user-modal.component.html +++ b/ogWebconsole/src/app/components/pages/admin/users/users/add-user-modal/add-user-modal.component.html @@ -1,10 +1,29 @@

Añadir Usuario

-
- + + Nombre de usuario + + Contraseña + + +

Roles:

+
+ + + + +
diff --git a/ogWebconsole/src/app/components/pages/admin/users/users/add-user-modal/add-user-modal.component.ts b/ogWebconsole/src/app/components/pages/admin/users/users/add-user-modal/add-user-modal.component.ts index 627cd62..62d8bc5 100644 --- a/ogWebconsole/src/app/components/pages/admin/users/users/add-user-modal/add-user-modal.component.ts +++ b/ogWebconsole/src/app/components/pages/admin/users/users/add-user-modal/add-user-modal.component.ts @@ -1,32 +1,63 @@ -import { Component, Inject } from '@angular/core'; +import { Component, EventEmitter, Inject, Output } from '@angular/core'; import { FormBuilder, FormGroup, Validators } from '@angular/forms'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; +import { HttpClient, HttpHeaders } from '@angular/common/http'; @Component({ selector: 'app-add-user-modal', templateUrl: './add-user-modal.component.html', - styleUrl: './add-user-modal.component.css' + styleUrls: ['./add-user-modal.component.css'] }) export class AddUserModalComponent { + @Output() userAdded = new EventEmitter(); userForm: FormGroup; constructor( public dialogRef: MatDialogRef, @Inject(MAT_DIALOG_DATA) public data: any, - private fb: FormBuilder + private fb: FormBuilder, + private http: HttpClient ) { this.userForm = this.fb.group({ - username: ['', Validators.required] + username: ['', Validators.required], + password: ['', Validators.required], + ROLE_SUPER_ADMIN: [false], + ROLE_ORGANIZATIONAL_UNIT_ADMIN: [false], + ROLE_ORGANIZATIONAL_UNIT_OPERATOR: [false], + ROLE_USER: [false] }); } - + onNoClick(): void { this.dialogRef.close(); } onSubmit(): void { if (this.userForm.valid) { - this.dialogRef.close(this.userForm.value); + const apiUrl = 'http://127.0.0.1:8080/api/users'; + const token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJpYXQiOjE3MTY5OTI4OTgsImV4cCI6MTcxNjk5NjQ5OCwicm9sZXMiOlsiUk9MRV9VU0VSIl0sInVzZXJuYW1lIjoib2dhZG1pbiJ9.dtEsBpYvEbkLLHTfMVvCdK5IMTUJWU7JoE8GIibeA3ltAdS1n-YgOeCplxRJMl5CmktNHeS7mE40u-RGb9ly7zifctK8N7z0uv8Q70nFsq3DBqUDVONusXzdSKABAq7_WIhBPfQBJpG0uzlPMEL9sfch9lvNWOX0k7dE2aLa54ucBrGaR-9p1HEFlQIzlWXkqjmzTDq6PoaRAATUZQXnh95rf8w57O07NylC1SXUfaWGJwdBhTNCfEuSsnhE5fOrBiga2oAOqHM7JgMb4lKDx4TNqrY1YZi0pSvJeD6r7j-ELeSVHgaPzdJeQTFUt0T87ca-GFqjBfUKu-z76c5bBg'; + const headers = new HttpHeaders({ + 'Content-Type': 'application/ld+json', + 'Authorization': `Bearer ${token}` + }); + + const userPayload = { + username: this.userForm.value.username, + password: this.userForm.value.password, + enabled: true, + }; + + this.http.post(apiUrl, userPayload, { headers: headers }).subscribe( + response => { + console.log('User added successfully:', response); + this.userAdded.emit(); + this.dialogRef.close(this.userForm.value); + }, + error => { + console.error('Error adding user:', error); + // Agregar alguna lógica para manejar el error en la interfaz de usuario + } + ); } } } diff --git a/ogWebconsole/src/app/components/pages/admin/users/users/delete-user-modal/delete-user-modal.component.html b/ogWebconsole/src/app/components/pages/admin/users/users/delete-user-modal/delete-user-modal.component.html index 743b1db..80b17ef 100644 --- a/ogWebconsole/src/app/components/pages/admin/users/users/delete-user-modal/delete-user-modal.component.html +++ b/ogWebconsole/src/app/components/pages/admin/users/users/delete-user-modal/delete-user-modal.component.html @@ -4,5 +4,5 @@
- +
diff --git a/ogWebconsole/src/app/components/pages/admin/users/users/delete-user-modal/delete-user-modal.component.ts b/ogWebconsole/src/app/components/pages/admin/users/users/delete-user-modal/delete-user-modal.component.ts index 3db10fe..578086d 100644 --- a/ogWebconsole/src/app/components/pages/admin/users/users/delete-user-modal/delete-user-modal.component.ts +++ b/ogWebconsole/src/app/components/pages/admin/users/users/delete-user-modal/delete-user-modal.component.ts @@ -1,4 +1,5 @@ -import { Component, Inject } from '@angular/core'; +import { HttpClient, HttpHeaders } from '@angular/common/http'; +import { Component, EventEmitter, Inject, Output } from '@angular/core'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; @Component({ @@ -7,15 +8,34 @@ import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; styleUrl: './delete-user-modal.component.css' }) export class DeleteUserModalComponent { - + @Output() userDeleted = new EventEmitter(); constructor( public dialogRef: MatDialogRef, - @Inject(MAT_DIALOG_DATA) public data: any + @Inject(MAT_DIALOG_DATA) public data: any, + private http: HttpClient ) {} onNoClick(): void { this.dialogRef.close(); } - // INSERTAR EL DELETE Y EN EL CLICK LLAMAR A ESTE METODO + onYesClick(): void { + const apiUrl = `http://127.0.0.1:8080/api/users/${this.data.uuid}`; + const token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJpYXQiOjE3MTY5OTI4OTgsImV4cCI6MTcxNjk5NjQ5OCwicm9sZXMiOlsiUk9MRV9VU0VSIl0sInVzZXJuYW1lIjoib2dhZG1pbiJ9.dtEsBpYvEbkLLHTfMVvCdK5IMTUJWU7JoE8GIibeA3ltAdS1n-YgOeCplxRJMl5CmktNHeS7mE40u-RGb9ly7zifctK8N7z0uv8Q70nFsq3DBqUDVONusXzdSKABAq7_WIhBPfQBJpG0uzlPMEL9sfch9lvNWOX0k7dE2aLa54ucBrGaR-9p1HEFlQIzlWXkqjmzTDq6PoaRAATUZQXnh95rf8w57O07NylC1SXUfaWGJwdBhTNCfEuSsnhE5fOrBiga2oAOqHM7JgMb4lKDx4TNqrY1YZi0pSvJeD6r7j-ELeSVHgaPzdJeQTFUt0T87ca-GFqjBfUKu-z76c5bBg'; + const headers = new HttpHeaders({ + 'Content-Type': 'application/ld+json' + }); + + this.http.delete(apiUrl, { headers: headers }).subscribe( + () => { + console.log('User deleted successfully'); + this.userDeleted.emit(); + this.dialogRef.close(true); + }, + ( error: any) => { + console.error('Error deleting user:', error); + // Agregar alguna lógica para manejar el error en la interfaz de usuario + } + ); + } } diff --git a/ogWebconsole/src/app/components/pages/admin/users/users/users.component.ts b/ogWebconsole/src/app/components/pages/admin/users/users/users.component.ts index f08407a..4e9dc83 100644 --- a/ogWebconsole/src/app/components/pages/admin/users/users/users.component.ts +++ b/ogWebconsole/src/app/components/pages/admin/users/users/users.component.ts @@ -1,4 +1,3 @@ -// users.component.ts import { Component, OnInit } from '@angular/core'; import { UserService } from './users.service'; import { MatTableDataSource } from '@angular/material/table'; @@ -40,6 +39,10 @@ export class UsersComponent implements OnInit { constructor(private userService: UserService, public dialog: MatDialog) {} ngOnInit() { + this.loadUsers(); + } + + loadUsers() { this.userService.getUsers().subscribe(response => { this.dataSource.data = response['hydra:member']; }); @@ -48,11 +51,10 @@ export class UsersComponent implements OnInit { addUser() { const dialogRef = this.dialog.open(AddUserModalComponent); - dialogRef.afterClosed().subscribe(result => { - if (result) { - // Handle the result here (e.g., refresh the list of users) - } + dialogRef.componentInstance.userAdded.subscribe(() => { + this.loadUsers(); }); + } editUser(user: any) { @@ -67,7 +69,7 @@ export class UsersComponent implements OnInit { dialogRef.afterClosed().subscribe(result => { if (result) { - // Handle the result here (e.g., refresh the list of users) + this.loadUsers(); } }); }