From 8c311c354ce27074d31bfd623f55b3588de53065 Mon Sep 17 00:00:00 2001 From: apuente Date: Wed, 9 Oct 2024 10:29:56 +0200 Subject: [PATCH] Fix double click event in advanced search component and add partition assistant component --- ogWebconsole/src/app/app-routing.module.ts | 64 ++++++++------- ogWebconsole/src/app/app.module.ts | 8 +- .../partition-assistant.component.css | 79 +++++++++++++++++++ .../partition-assistant.component.html | 20 +++++ .../partition-assistant.component.ts | 55 +++++++++++++ .../advanced-search.component.html | 2 +- .../advanced-search.component.ts | 18 ++++- .../client-main-view.component.css | 0 .../client-main-view.component.html | 1 + .../client-main-view.component.spec.ts | 23 ++++++ .../client-main-view.component.ts | 10 +++ .../acctions-modal.component.ts | 33 +++++--- .../create-pxe-boot-file.component.ts | 4 - 13 files changed, 269 insertions(+), 48 deletions(-) create mode 100644 ogWebconsole/src/app/components/commands/commands-modals/partition-assistant/partition-assistant.component.css create mode 100644 ogWebconsole/src/app/components/commands/commands-modals/partition-assistant/partition-assistant.component.html create mode 100644 ogWebconsole/src/app/components/commands/commands-modals/partition-assistant/partition-assistant.component.ts create mode 100644 ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.css create mode 100644 ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.html create mode 100644 ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.spec.ts create mode 100644 ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.ts diff --git a/ogWebconsole/src/app/app-routing.module.ts b/ogWebconsole/src/app/app-routing.module.ts index 5665fc6..d4dc8ac 100644 --- a/ogWebconsole/src/app/app-routing.module.ts +++ b/ogWebconsole/src/app/app-routing.module.ts @@ -20,38 +20,42 @@ import { CommandsComponent } from './components/commands/main-commands/commands. import { CommandsGroupsComponent } from './components/commands/commands-groups/commands-groups.component'; import { CommandsTaskComponent } from './components/commands/commands-task/commands-task.component'; import { TaskLogsComponent } from './components/commands/commands-task/task-logs/task-logs.component'; +import { PartitionAssistantComponent } from './components/commands/commands-modals/partition-assistant/partition-assistant.component'; +import { ClientMainViewComponent } from './components/groups/components/client-main-view/client-main-view.component'; const routes: Routes = [ { path: '', redirectTo: 'auth/login', pathMatch: 'full' }, -{ - path: '', - component: MainLayoutComponent, - children: [ - { path: 'dashboard', component: DashboardComponent }, - { path: 'admin', component: AdminComponent }, - { path: 'users', component: UsersComponent }, - { path: 'user-groups', component: RolesComponent }, - { path: 'groups', component: GroupsComponent }, - { path: 'images', component: ImagesComponent }, - { path: 'pxe', component: PxeComponent }, - { path: 'pxe-boot-file', component: PxeBootFilesComponent }, - { path: 'ogboot-status', component: OgbootStatusComponent }, - { path: 'dhcp', component: OgdhcpComponent }, - { path: 'dhcp-subnets', component: OgDhcpSubnetsComponent }, - { path: 'commands', component: CommandsComponent }, - { path: 'commands-groups', component: CommandsGroupsComponent }, - { path: 'commands-task', component: CommandsTaskComponent }, - { path: 'commands-logs', component: TaskLogsComponent }, - { path: 'calendars', component: CalendarComponent }, - ], -}, -{ - path: 'auth', - component: AuthLayoutComponent, - children: [ - { path: 'login', component: LoginComponent }, - ], -}, -{ path: '**', component: PageNotFoundComponent }, + { + path: '', + component: MainLayoutComponent, + children: [ + { path: 'dashboard', component: DashboardComponent }, + { path: 'admin', component: AdminComponent }, + { path: 'users', component: UsersComponent }, + { path: 'user-groups', component: RolesComponent }, + { path: 'groups', component: GroupsComponent }, + { path: 'images', component: ImagesComponent }, + { path: 'pxe', component: PxeComponent }, + { path: 'pxe-boot-file', component: PxeBootFilesComponent }, + { path: 'ogboot-status', component: OgbootStatusComponent }, + { path: 'dhcp', component: OgdhcpComponent }, + { path: 'dhcp-subnets', component: OgDhcpSubnetsComponent }, + { path: 'commands', component: CommandsComponent }, + { path: 'commands-groups', component: CommandsGroupsComponent }, + { path: 'commands-task', component: CommandsTaskComponent }, + { path: 'commands-logs', component: TaskLogsComponent }, + { path: 'calendars', component: CalendarComponent }, + { path: 'partitionAssistant', component: PartitionAssistantComponent}, + { path: 'client/:id', component: ClientMainViewComponent }, + ], + }, + { + path: 'auth', + component: AuthLayoutComponent, + children: [ + { path: 'login', component: LoginComponent }, + ], + }, + { path: '**', component: PageNotFoundComponent }, ]; @NgModule({ diff --git a/ogWebconsole/src/app/app.module.ts b/ogWebconsole/src/app/app.module.ts index 9b60f72..5921ac8 100644 --- a/ogWebconsole/src/app/app.module.ts +++ b/ogWebconsole/src/app/app.module.ts @@ -100,6 +100,9 @@ import { ClientTabViewComponent } from './components/groups/components/client-ta import { AdvancedSearchComponent } from './components/groups/components/advanced-search/advanced-search.component'; import { TaskLogsComponent } from './components/commands/commands-task/task-logs/task-logs.component'; import { OrganizationalUnitTabViewComponent } from './components/groups/components/organizational-unit-tab-view/organizational-unit-tab-view.component'; +import { PartitionAssistantComponent } from './components/commands/commands-modals/partition-assistant/partition-assistant.component'; +import { ClientMainViewComponent } from './components/groups/components/client-main-view/client-main-view.component'; +import {MatSliderModule} from '@angular/material/slider'; @NgModule({ declarations: [ AppComponent, @@ -156,7 +159,9 @@ import { OrganizationalUnitTabViewComponent } from './components/groups/componen ClientTabViewComponent, AdvancedSearchComponent, TaskLogsComponent, - OrganizationalUnitTabViewComponent + OrganizationalUnitTabViewComponent, + PartitionAssistantComponent, + ClientMainViewComponent ], bootstrap: [AppComponent], imports: [BrowserModule, @@ -184,6 +189,7 @@ import { OrganizationalUnitTabViewComponent } from './components/groups/componen NgxChartsModule, MatDatepickerModule, MatNativeDateModule, + MatSliderModule, ToastrModule.forRoot( { timeOut: 5000, diff --git a/ogWebconsole/src/app/components/commands/commands-modals/partition-assistant/partition-assistant.component.css b/ogWebconsole/src/app/components/commands/commands-modals/partition-assistant/partition-assistant.component.css new file mode 100644 index 0000000..62cf420 --- /dev/null +++ b/ogWebconsole/src/app/components/commands/commands-modals/partition-assistant/partition-assistant.component.css @@ -0,0 +1,79 @@ +.title { + font-size: 24px; + } + + .calendar-button-row { + display: flex; + justify-content: flex-start; + margin-top: 16px; + } + + .divider { + margin: 20px 0; + } + + .lists-container { + padding: 16px; + } + + .imagesLists-container { + flex: 1; + } + + .card.unidad-card { + height: 100%; + box-sizing: border-box; + } + + table { + width: 100%; + margin-top: 50px; + } + + .search-container { + display: flex; + justify-content: space-between; + align-items: center; + width: 100%; + padding: 0 5px; + box-sizing: border-box; + } + + .search-string { + flex: 2; + padding: 5px; + } + + .search-boolean { + flex: 1; + padding: 5px; + } + + .header-container { + display: flex; + justify-content: space-between; + align-items: center; + padding: 10px; + } + + .mat-elevation-z8 { + box-shadow: 0px 0px 0px rgba(0,0,0,0.2); + } + + .paginator-container { + display: flex; + justify-content: end; + margin-bottom: 30px; + } + + .mat-chip-readonly-true { + background-color: #4CAF50 !important; + color: white !important; + } + + .mat-chip-readonly-false { + background-color: #F44336 !important; + color: white !important; + } + + \ No newline at end of file diff --git a/ogWebconsole/src/app/components/commands/commands-modals/partition-assistant/partition-assistant.component.html b/ogWebconsole/src/app/components/commands/commands-modals/partition-assistant/partition-assistant.component.html new file mode 100644 index 0000000..9c0d04d --- /dev/null +++ b/ogWebconsole/src/app/components/commands/commands-modals/partition-assistant/partition-assistant.component.html @@ -0,0 +1,20 @@ +
+

Asistente de particionado

+
+ + +
+ + Cliente: {{clientInfo.name}} + Tipo: {{clientInfo.type}} + +

IP: {{clientInfo.ip}}

+

MAC: {{clientInfo.mac}}

+

Número de serie: {{clientInfo.serialNumber}}

+

Interfaz de red: {{clientInfo.netiface}}

+

Driver de red: {{clientInfo.netDriver}}

+ + +
+ + \ No newline at end of file diff --git a/ogWebconsole/src/app/components/commands/commands-modals/partition-assistant/partition-assistant.component.ts b/ogWebconsole/src/app/components/commands/commands-modals/partition-assistant/partition-assistant.component.ts new file mode 100644 index 0000000..a9889ae --- /dev/null +++ b/ogWebconsole/src/app/components/commands/commands-modals/partition-assistant/partition-assistant.component.ts @@ -0,0 +1,55 @@ +import { HttpClient } from '@angular/common/http'; +import { Component, Inject } from '@angular/core'; +import { MAT_DIALOG_DATA, MatDialog } from '@angular/material/dialog'; +import { ToastrService } from 'ngx-toastr'; +import { DataService } from '../../main-commands/data.service'; + +interface ClientInfo { + name: string; + type: string; + ip: string; + mac: string; + serialNumber: string; + netiface: string; + netDriver: string; +} + +@Component({ + selector: 'app-partition-assistant', + templateUrl: './partition-assistant.component.html', + styleUrl: './partition-assistant.component.css' +}) +export class PartitionAssistantComponent { + baseUrl: string = import.meta.env.NG_APP_BASE_API_URL; + client: string[] = []; + + clientInfo: ClientInfo | undefined; + + constructor( + private dataService: DataService, + public dialog: MatDialog, + private toastService: ToastrService, + private http: HttpClient, + @Inject(MAT_DIALOG_DATA) public data: { clients: string[] , command?: any } + ) { + console.log('clients', data.clients[0]); + } + + ngOnInit(): void { + this.getClientInfo(this.data.clients[0]); + } + + getClientInfo(uuid: string): void { + this.http.get(`${this.baseUrl}/clients/${uuid}`) + .subscribe( + (response: ClientInfo) => { + this.clientInfo = response; + }, + error => { + console.error('Error fetching client info:', error); + } + ); + } + +} + diff --git a/ogWebconsole/src/app/components/groups/components/advanced-search/advanced-search.component.html b/ogWebconsole/src/app/components/groups/components/advanced-search/advanced-search.component.html index 944582c..b192713 100644 --- a/ogWebconsole/src/app/components/groups/components/advanced-search/advanced-search.component.html +++ b/ogWebconsole/src/app/components/groups/components/advanced-search/advanced-search.component.html @@ -99,7 +99,7 @@ - + diff --git a/ogWebconsole/src/app/components/groups/components/advanced-search/advanced-search.component.ts b/ogWebconsole/src/app/components/groups/components/advanced-search/advanced-search.component.ts index 469f9f0..1a5a00a 100644 --- a/ogWebconsole/src/app/components/groups/components/advanced-search/advanced-search.component.ts +++ b/ogWebconsole/src/app/components/groups/components/advanced-search/advanced-search.component.ts @@ -19,6 +19,7 @@ import { SaveFiltersDialogComponent } from '../../shared/save-filters-dialog/sav import { AcctionsModalComponent } from '../../shared/acctions-modal/acctions-modal.component'; import {MatTableDataSource} from "@angular/material/table"; import {DatePipe} from "@angular/common"; +import { Router } from '@angular/router'; @Component({ @@ -62,7 +63,8 @@ export class AdvancedSearchComponent { public dialog: MatDialog, private toastService: ToastrService, private _bottomSheet: MatBottomSheet, - private http: HttpClient + private http: HttpClient, + private router: Router ) {} ngOnInit(): void { @@ -406,9 +408,21 @@ export class AdvancedSearchComponent { } - sendActions() { const dialogRef = this.dialog.open(AcctionsModalComponent, { data: { selectedElements: this.selectedElements }, width: '700px'}); } + + + onDobleClick(event: MouseEvent, data: any, type: string): void { + console.log('Doble click en:', data); + + if (type === 'client') { + this.router.navigate(['client', data]); + } + else { + console.error('ADD VIEW FOR OU'); + } + } + } diff --git a/ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.css b/ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.css new file mode 100644 index 0000000..e69de29 diff --git a/ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.html b/ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.html new file mode 100644 index 0000000..0301b02 --- /dev/null +++ b/ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.html @@ -0,0 +1 @@ +

client-main-view works!

diff --git a/ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.spec.ts b/ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.spec.ts new file mode 100644 index 0000000..9b91bce --- /dev/null +++ b/ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.spec.ts @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ClientMainViewComponent } from './client-main-view.component'; + +describe('ClientMainViewComponent', () => { + let component: ClientMainViewComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ClientMainViewComponent] + }) + .compileComponents(); + + fixture = TestBed.createComponent(ClientMainViewComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.ts b/ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.ts new file mode 100644 index 0000000..9d1162b --- /dev/null +++ b/ogWebconsole/src/app/components/groups/components/client-main-view/client-main-view.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'app-client-main-view', + templateUrl: './client-main-view.component.html', + styleUrl: './client-main-view.component.css' +}) +export class ClientMainViewComponent { + +} diff --git a/ogWebconsole/src/app/components/groups/shared/acctions-modal/acctions-modal.component.ts b/ogWebconsole/src/app/components/groups/shared/acctions-modal/acctions-modal.component.ts index 0c865bb..eea7cd4 100644 --- a/ogWebconsole/src/app/components/groups/shared/acctions-modal/acctions-modal.component.ts +++ b/ogWebconsole/src/app/components/groups/shared/acctions-modal/acctions-modal.component.ts @@ -5,6 +5,8 @@ import { ToastrService } from 'ngx-toastr'; import { CreatePxeBootFileComponent } from '../../../ogboot/pxe-boot-files/create-pxeBootFile/create-pxe-boot-file/create-pxe-boot-file.component'; import { HttpClient } from '@angular/common/http'; import { CommandDetailComponent } from '../../../commands/main-commands/detail-command/command-detail.component'; +import { RouterLink } from '@angular/router'; +import { PartitionAssistantComponent } from '../../../commands/commands-modals/partition-assistant/partition-assistant.component'; @Component({ selector: 'app-acctions-modal', templateUrl: './acctions-modal.component.html', @@ -53,22 +55,33 @@ export class AcctionsModalComponent { } onCommandClick(command: any): void { + + const payload = { clients: this.selectedElements.map((uuid: any) => `/clients/${uuid}`) }; const apiUrl = `${this.baseUrl}/commands/${command.uuid}/execute`; +console.log(this.selectedElements.length) +if (command.uuid === '01924d28-5880-734f-9187-f6b0f6c0c8d7' && this.selectedElements.length == 1) { + const dialogRef = this.dialog.open(PartitionAssistantComponent, { data: { clients: this.selectedElements }, width: '150%', height: '100%' }); +} +if (command.uuid === '01924d28-5880-734f-9187-f6b0f6c0c8d7' && this.selectedElements.length != 1) { + this.toastService.error('Please select only one client to execute this command'); +} +else{ + this.http.post(apiUrl, payload).subscribe({ + next: () => { + console.log('Command executed successfully'); + this.loadCommands(); + this.toastService.success('Command executed successfully'); + }, + error: (error) => { + console.error('Error executing command:', error); + } + }); +} -this.http.post(apiUrl, payload).subscribe({ - next: () => { - console.log('Command executed successfully'); - this.loadCommands(); - this.toastService.success('Command executed successfully'); - }, - error: (error) => { - console.error('Error executing command:', error); - } -}); } chunkArray(arr: any[], chunkSize: number): any[] { diff --git a/ogWebconsole/src/app/components/ogboot/pxe-boot-files/create-pxeBootFile/create-pxe-boot-file/create-pxe-boot-file.component.ts b/ogWebconsole/src/app/components/ogboot/pxe-boot-files/create-pxeBootFile/create-pxe-boot-file/create-pxe-boot-file.component.ts index be0efe0..89e90e6 100644 --- a/ogWebconsole/src/app/components/ogboot/pxe-boot-files/create-pxeBootFile/create-pxe-boot-file/create-pxe-boot-file.component.ts +++ b/ogWebconsole/src/app/components/ogboot/pxe-boot-files/create-pxeBootFile/create-pxe-boot-file/create-pxe-boot-file.component.ts @@ -27,8 +27,6 @@ export class CreatePxeBootFileComponent implements OnInit { this.selectedElements = this.data.clients; this.clientes = this.selectedElements.map((client: { uuid: any }) => `/clients/${client.uuid}`); this.loadPxeTemplates(); - - // Configura el modo de edición si se proporciona bootFile if (this.data.bootFile) { this.isEditMode = true; this.selectedPxeTemplate = this.data.bootFile.template.uuid; @@ -60,7 +58,6 @@ export class CreatePxeBootFileComponent implements OnInit { }; if (this.isEditMode && this.data.bootFile) { - // Edit mode: Actualizar boot file existente this.http.put(`${this.baseUrl}/pxe-boot-files/${this.data.bootFile.uuid}`, payload) .subscribe({ next: response => { @@ -72,7 +69,6 @@ export class CreatePxeBootFileComponent implements OnInit { } }); } else { - // Create mode: Crear nuevo boot file this.http.post(`${this.baseUrl}/pxe-boot-files`, payload) .subscribe({ next: response => {