From 9b5fafbc9e48519e43b57dcf0f6af8f28081cfa0 Mon Sep 17 00:00:00 2001 From: apuente Date: Wed, 29 May 2024 14:29:58 +0200 Subject: [PATCH] Pagina usuarios modales usuarios --- ogWebconsole/src/app/app.module.ts | 14 ++- .../app/components/login/login.component.ts | 2 +- .../admin/users/users/users.component.html | 2 +- .../admin/users/users/users.component.ts | 26 +++++- .../pages/admin/users/users/users.service.ts | 88 ++----------------- .../src/app/services/custom.interceptor.ts | 30 ++++--- 6 files changed, 62 insertions(+), 100 deletions(-) diff --git a/ogWebconsole/src/app/app.module.ts b/ogWebconsole/src/app/app.module.ts index 5b21193..38a7391 100644 --- a/ogWebconsole/src/app/app.module.ts +++ b/ogWebconsole/src/app/app.module.ts @@ -25,6 +25,10 @@ import { MatListModule } from '@angular/material/list'; import { UsersComponent } from './components/pages/admin/users/users/users.component'; import { RolesComponent } from './components/pages/admin/roles/roles/roles.component'; import {MatTableModule} from '@angular/material/table'; +import {MatDialogModule} from '@angular/material/dialog'; +import { DeleteUserModalComponent } from './components/pages/admin/users/users/delete-user-modal/delete-user-modal.component'; +import { AddUserModalComponent } from './components/pages/admin/users/users/add-user-modal/add-user-modal.component'; + @NgModule({ declarations: [ AppComponent, @@ -36,9 +40,12 @@ import {MatTableModule} from '@angular/material/table'; AdminComponent, MainLayoutComponent, UsersComponent, - RolesComponent + RolesComponent, + DeleteUserModalComponent, + AddUserModalComponent ], - bootstrap: [AppComponent], imports: [BrowserModule, + bootstrap: [AppComponent], + imports: [BrowserModule, AppRoutingModule, FormsModule, MatToolbarModule, @@ -51,7 +58,8 @@ import {MatTableModule} from '@angular/material/table'; MatFormFieldModule, MatInputModule, MatListModule, - MatTableModule], + MatTableModule, + MatDialogModule], providers: [ { provide: HTTP_INTERCEPTORS, diff --git a/ogWebconsole/src/app/components/login/login.component.ts b/ogWebconsole/src/app/components/login/login.component.ts index d0ebd22..41af25a 100644 --- a/ogWebconsole/src/app/components/login/login.component.ts +++ b/ogWebconsole/src/app/components/login/login.component.ts @@ -47,7 +47,7 @@ export class LoginComponent { this.errorMessage = 'Ha ocurrido un error. Por favor, inténtelo de nuevo.'; //BYPASS TO DASHBOARD - this.router.navigateByUrl('/dashboard'); + /* this.router.navigateByUrl('/dashboard'); */ } } }); diff --git a/ogWebconsole/src/app/components/pages/admin/users/users/users.component.html b/ogWebconsole/src/app/components/pages/admin/users/users/users.component.html index e614822..dc3bb9f 100644 --- a/ogWebconsole/src/app/components/pages/admin/users/users/users.component.html +++ b/ogWebconsole/src/app/components/pages/admin/users/users/users.component.html @@ -1,6 +1,6 @@

Gestión de usuarios

- +
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 7d8ccc5..f08407a 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 @@ -2,6 +2,9 @@ import { Component, OnInit } from '@angular/core'; import { UserService } from './users.service'; import { MatTableDataSource } from '@angular/material/table'; +import { DeleteUserModalComponent } from './delete-user-modal/delete-user-modal.component'; +import { MatDialog } from '@angular/material/dialog'; +import { AddUserModalComponent } from './add-user-modal/add-user-modal.component'; @Component({ selector: 'app-users', @@ -34,7 +37,7 @@ export class UsersComponent implements OnInit { ]; displayedColumns = [...this.columns.map(column => column.columnDef), 'actions']; - constructor(private userService: UserService) {} + constructor(private userService: UserService, public dialog: MatDialog) {} ngOnInit() { this.userService.getUsers().subscribe(response => { @@ -42,13 +45,30 @@ 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) + } + }); + } + editUser(user: any) { // Implementar la lógica de edición console.log('Editar usuario:', user); } deleteUser(user: any) { - // Implementar la lógica de eliminación - console.log('Eliminar usuario:', user); + const dialogRef = this.dialog.open(DeleteUserModalComponent, { + data: user + }); + + dialogRef.afterClosed().subscribe(result => { + if (result) { + // Handle the result here (e.g., refresh the list of users) + } + }); } } diff --git a/ogWebconsole/src/app/components/pages/admin/users/users/users.service.ts b/ogWebconsole/src/app/components/pages/admin/users/users/users.service.ts index a152ae0..af4a472 100644 --- a/ogWebconsole/src/app/components/pages/admin/users/users/users.service.ts +++ b/ogWebconsole/src/app/components/pages/admin/users/users/users.service.ts @@ -1,94 +1,18 @@ -// user.service.ts import { Injectable } from '@angular/core'; -import { HttpClient } from '@angular/common/http'; -import { Observable, of } from 'rxjs'; +import { HttpClient, HttpHeaders } from '@angular/common/http'; +import { Observable } from 'rxjs'; @Injectable({ providedIn: 'root' }) export class UserService { + private userApiUrl = 'http://127.0.0.1:8080/api/users'; + constructor(private http: HttpClient) { } - // Método para simular la llamada a la API getUsers(): Observable { - // Datos simulados - const mockResponse = { - "hydra:member": [ - { - "@context": "/contexts/User", - "@id": "/users/1", - "@type": "User", - "username": "jdoe", - "roles": [ - "ROLE_USER", - "ROLE_ADMIN" - ], - "enabled": true, - "allowedOrganizationalUnits": [ - "IT", - "HR" - ], - "createAt": "2024-05-28T20:15:50.913Z", - "createBy": "admin", - "uuid": "3fa85f64-5717-4562-b3fc-2c963f66afa6", - "id": 1 - }, - { - "@context": "/contexts/User", - "@id": "/users/2", - "@type": "User", - "username": "asmith", - "roles": [ - "ROLE_USER" - ], - "enabled": false, - "allowedOrganizationalUnits": [ - "Finance" - ], - "createAt": "2024-05-27T15:10:30.913Z", - "createBy": "admin", - "uuid": "4a86f74e-5717-4562-b3fc-2c963f66afa6", - "id": 2 - } - ], - "hydra:totalItems": 2, - "hydra:view": { - "@id": "/users?page=1", - "type": "PartialCollectionView", - "hydra:first": "/users?page=1", - "hydra:last": "/users?page=1", - "hydra:previous": null, - "hydra:next": null - }, - "hydra:search": { - "@type": "hydra:IriTemplate", - "hydra:template": "/users{?username,roles,enabled}", - "hydra:variableRepresentation": "BasicRepresentation", - "hydra:mapping": [ - { - "@type": "IriTemplateMapping", - "variable": "username", - "property": "username", - "required": false - }, - { - "@type": "IriTemplateMapping", - "variable": "roles", - "property": "roles", - "required": false - }, - { - "@type": "IriTemplateMapping", - "variable": "enabled", - "property": "enabled", - "required": false - } - ] - } - }; - - // Retornar los datos simulados como observable - return of(mockResponse); + return this.http.get(this.userApiUrl+'?page=1&itemsPerPage=30'); } } + diff --git a/ogWebconsole/src/app/services/custom.interceptor.ts b/ogWebconsole/src/app/services/custom.interceptor.ts index 7e02094..87f2f35 100644 --- a/ogWebconsole/src/app/services/custom.interceptor.ts +++ b/ogWebconsole/src/app/services/custom.interceptor.ts @@ -1,18 +1,28 @@ import { Injectable } from '@angular/core'; -import { HttpInterceptorFn, HttpRequest, HttpHandler, HttpEvent, HttpInterceptor } from '@angular/common/http'; +import { HttpInterceptor, HttpRequest, HttpHandler, HttpEvent } from '@angular/common/http'; import { Observable } from 'rxjs'; -import { Token } from '@angular/compiler'; -export class CustomInterceptor implements HttpInterceptor{ - constructor(){} +@Injectable() +export class CustomInterceptor implements HttpInterceptor { + constructor() { } + intercept(req: HttpRequest, next: HttpHandler): Observable> { - const token = localStorage.getItem('loginToken'); - const newCloneRequest = req.clone({ - setHeaders:{ - Authorization: `${token}` - } - }) + let newCloneRequest; + + if (req.url.includes('login')) { + newCloneRequest = req.clone({ + setHeaders: { + Authorization: `${token}` + } + }); + } else { + newCloneRequest = req.clone({ + setHeaders: { + Authorization: `Bearer ${token}` + } + }); + } return next.handle(newCloneRequest); }