From 6385f4b2676610eb1bc587b63c94bd254f7d53ba Mon Sep 17 00:00:00 2001
From: apuente <apuente@qindel.com>
Date: Mon, 7 Oct 2024 15:21:15 +0200
Subject: [PATCH 1/3] refs #901 Refactor create-task to select all clients

---
 .../create-task/create-task.component.html    | 68 ++++++++++---------
 .../create-task/create-task.component.ts      | 34 +++++++---
 2 files changed, 61 insertions(+), 41 deletions(-)

diff --git a/ogWebconsole/src/app/components/commands/commands-task/create-task/create-task.component.html b/ogWebconsole/src/app/components/commands/commands-task/create-task/create-task.component.html
index fc2838a..8b88d6b 100644
--- a/ogWebconsole/src/app/components/commands/commands-task/create-task/create-task.component.html
+++ b/ogWebconsole/src/app/components/commands/commands-task/create-task/create-task.component.html
@@ -64,41 +64,45 @@
         </div>
       </mat-step>
 
-      <!-- Paso 4: Selecciona Unidad Organizacional, Aula y Clientes -->
-      <mat-step label="Selecciona Unidad Organizacional, Aula y Clientes">
-        <mat-form-field appearance="fill" class="full-width">
-          <mat-label>Selecciona Unidad Organizacional</mat-label>
-          <mat-select formControlName="organizationalUnit" (selectionChange)="onOrganizationalUnitChange()">
-            <mat-option *ngFor="let unit of availableOrganizationalUnits" [value]="unit['@id']">
-              {{ unit.name }}
-            </mat-option>
-          </mat-select>
-          <mat-error *ngIf="taskForm.get('organizationalUnit')?.invalid">Este campo es obligatorio</mat-error>
-        </mat-form-field>
+     <!-- Paso 4: Selecciona Unidad Organizacional, Aula y Clientes -->
+<mat-step label="Selecciona Unidad Organizacional, Aula y Clientes">
+  <mat-form-field appearance="fill" class="full-width">
+    <mat-label>Selecciona Unidad Organizacional</mat-label>
+    <mat-select formControlName="organizationalUnit" (selectionChange)="onOrganizationalUnitChange()">
+      <mat-option *ngFor="let unit of availableOrganizationalUnits" [value]="unit['@id']">
+        {{ unit.name }}
+      </mat-option>
+    </mat-select>
+    <mat-error *ngIf="taskForm.get('organizationalUnit')?.invalid">Este campo es obligatorio</mat-error>
+  </mat-form-field>
 
-        <mat-form-field appearance="fill" class="full-width">
-          <mat-label>Selecciona aula</mat-label>
-          <mat-select formControlName="selectedChild" (selectionChange)="onChildChange()">
-            <mat-option *ngFor="let child of selectedUnitChildren" [value]="child['@id']">
-              {{ child.name }}
-            </mat-option>
-          </mat-select>
-        </mat-form-field>
+  <mat-form-field appearance="fill" class="full-width">
+    <mat-label>Selecciona aula</mat-label>
+    <mat-select formControlName="selectedChild" (selectionChange)="onChildChange()">
+      <mat-option *ngFor="let child of selectedUnitChildren" [value]="child['@id']">
+        {{ child.name }}
+      </mat-option>
+    </mat-select>
+  </mat-form-field>
 
-        <mat-form-field appearance="fill" class="full-width">
-          <mat-label>Selecciona Clientes</mat-label>
-          <mat-select formControlName="selectedClients" multiple>
-            <mat-option *ngFor="let client of selectedClients" [value]="client.uuid">
-              {{ client.name }} ({{ client.ip }})
-            </mat-option>
-          </mat-select>
-        </mat-form-field>
+  <mat-form-field appearance="fill" class="full-width">
+    <mat-label>Selecciona Clientes</mat-label>
+    <mat-select formControlName="selectedClients" multiple>
+      <mat-option (click)="toggleSelectAll()" [selected]="areAllSelected()">
+        Seleccionar todos
+      </mat-option>
+      <mat-option *ngFor="let client of selectedClients" [value]="client.uuid">
+        {{ client.name }} ({{ client.ip }})
+      </mat-option>
+    </mat-select>
+  </mat-form-field>
+
+  <div class="button-container">
+    <button mat-button matStepperPrevious>Atrás</button>
+    <button mat-raised-button color="primary" (click)="saveTask()">Guardar</button>
+  </div>
+</mat-step>
 
-        <div class="button-container">
-          <button mat-button matStepperPrevious>Atrás</button>
-          <button mat-raised-button color="primary" (click)="saveTask()">Guardar</button>
-        </div>
-      </mat-step>
     </mat-horizontal-stepper>
   </mat-dialog-content>
 </form>
diff --git a/ogWebconsole/src/app/components/commands/commands-task/create-task/create-task.component.ts b/ogWebconsole/src/app/components/commands/commands-task/create-task/create-task.component.ts
index d4b0307..4b06e85 100644
--- a/ogWebconsole/src/app/components/commands/commands-task/create-task/create-task.component.ts
+++ b/ogWebconsole/src/app/components/commands/commands-task/create-task/create-task.component.ts
@@ -20,6 +20,7 @@ export class CreateTaskComponent implements OnInit {
   availableOrganizationalUnits: any[] = [];
   selectedUnitChildren: any[] = [];
   selectedClients: any[] = [];
+  selectedClientIds: Set<string> = new Set();
 
   constructor(
     private fb: FormBuilder,
@@ -124,6 +125,7 @@ export class CreateTaskComponent implements OnInit {
       (data) => {
         this.selectedClients = data.clients;
         this.taskForm.patchValue({ selectedClients: [] });
+        this.selectedClientIds.clear(); 
       },
       (error) => {
         this.toastr.error('Error al cargar los detalles del aula seleccionada');
@@ -131,6 +133,20 @@ export class CreateTaskComponent implements OnInit {
     );
   }
 
+  toggleSelectAll() {
+    const allSelected = this.areAllSelected();
+    if (allSelected) {
+      this.selectedClientIds.clear(); 
+    } else {
+      this.selectedClients.forEach(client => this.selectedClientIds.add(client.uuid)); 
+    }
+    this.taskForm.get('selectedClients')!.setValue(Array.from(this.selectedClientIds));
+  }
+
+  areAllSelected(): boolean {
+    return this.selectedClients.length > 0 && this.selectedClients.every(client => this.selectedClientIds.has(client.uuid));
+  }
+
   saveTask(): void {
     if (this.taskForm.invalid) {
       this.toastr.error('Por favor, rellene todos los campos obligatorios');
@@ -143,16 +159,16 @@ export class CreateTaskComponent implements OnInit {
     ? formData.extraCommands.map((id: any) => `/commands/${id}`)
     : null;
 
-  const payload: any = {
-    commandGroups: formData.commandGroup ? [`/command-groups/${formData.commandGroup}`] : null,
-    dateTime: dateTime,
-    notes: formData.notes || '',
-    clients: this.selectedClients.map((client: any) => client['@id']),
-  };
+    const payload: any = {
+      commandGroups: formData.commandGroup ? [`/command-groups/${formData.commandGroup}`] : null,
+      dateTime: dateTime,
+      notes: formData.notes || '',
+      clients: Array.from(this.selectedClientIds).map((uuid: string) => `/clients/${uuid}`), 
+    };
 
-  if (selectedCommands) {
-    payload.commands = selectedCommands;
-  }
+    if (selectedCommands) {
+      payload.commands = selectedCommands;
+    }
 
     if (this.editing) {
       const taskId = this.data.task.uuid;

From 8c311c354ce27074d31bfd623f55b3588de53065 Mon Sep 17 00:00:00 2001
From: apuente <apuente@qindel.com>
Date: Wed, 9 Oct 2024 10:29:56 +0200
Subject: [PATCH 2/3] 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 @@
+<div class="header-container">
+    <h2 class="title">Asistente de particionado</h2>
+</div>
+<mat-divider class="divider"></mat-divider>
+
+<div class="client" *ngIf="clientInfo && clientInfo.name">
+    <mat-card class="result-card">
+        <mat-card-title>Cliente: {{clientInfo.name}}</mat-card-title>
+        <mat-card-subtitle>Tipo: {{clientInfo.type}}</mat-card-subtitle>
+        <mat-card-content>
+            <p><strong>IP:</strong> {{clientInfo.ip}}</p>
+            <p><strong>MAC:</strong> {{clientInfo.mac}}</p>
+            <p><strong>Número de serie:</strong> {{clientInfo.serialNumber}}</p>
+            <p><strong>Interfaz de red:</strong> {{clientInfo.netiface}}</p>
+            <p><strong>Driver de red:</strong> {{clientInfo.netDriver}}</p>
+        </mat-card-content>
+    </mat-card>
+</div>
+
+  
\ 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<ClientInfo>(`${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 @@
           <ng-container *ngIf="filteredResults && filteredResults.length > 0; else noResults">
             <mat-grid-list cols="4" rowHeight="1:1">
               <mat-grid-tile *ngFor="let result of filteredResults">
-                <mat-card class="result-card">
+                <mat-card class="result-card" (dblclick)="onDobleClick($event, result.uuid, result.type)">
                   <mat-checkbox
                     [checked]="isSelected(result.name)"
                     (change)="onCheckboxChange($event, result.name, result.uuid)">
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 @@
+<p>client-main-view works!</p>
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<ClientMainViewComponent>;
+
+  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 => {

From 58337c378cb85f516c990834fc8c2c7a55f7b0c0 Mon Sep 17 00:00:00 2001
From: apuente <apuente@qindel.com>
Date: Fri, 11 Oct 2024 12:44:43 +0200
Subject: [PATCH 3/3] Update client-main-view component and .env file

---
 ogWebconsole/.env                             |   3 +-
 .../client-main-view.component.css            | 128 ++++++++++++++++++
 .../client-main-view.component.html           |  68 +++++++++-
 .../client-main-view.component.ts             |  30 +++-
 4 files changed, 224 insertions(+), 5 deletions(-)

diff --git a/ogWebconsole/.env b/ogWebconsole/.env
index 454cc0f..3e0dde5 100644
--- a/ogWebconsole/.env
+++ b/ogWebconsole/.env
@@ -1,2 +1 @@
-#NG_APP_BASE_API_URL=http://127.0.0.1:8090
-NG_APP_BASE_API_URL=http://127.0.0.1:8080
+NG_APP_BASE_API_URL=http://127.0.0.1:8001
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
index e69de29..6cd9cae 100644
--- 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
@@ -0,0 +1,128 @@
+/* Global Container */
+.container {
+    width: 100%;
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: 40px;
+    background-color: #f4f6f9;
+    font-family: 'Arial', sans-serif;
+    color: #333;
+  }
+  
+  /* Header - Title and Icon */
+  .client-header {
+    display: flex;
+    align-items: center;
+    margin-bottom: 40px;
+    background-color: #fff;
+    padding: 20px;
+    border-radius: 12px;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+  }
+  
+  .client-icon {
+    flex-shrink: 0; /* Prevent shrinking of the icon */
+    margin-right: 20px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-width: 120px; /* Ensure the icon has enough space */
+    min-height: 120px;
+  }
+  
+  .icon-pc {
+    font-size: 100px;
+    color: #3b82f6;
+  }
+  
+  .client-title h1 {
+    font-size: 2rem;
+    margin-bottom: 10px;
+  }
+  
+  .client-title p {
+    margin: 2px 0;
+    font-size: 1rem;
+    color: #666;
+  }
+  
+  /* Information Section */
+  .client-info {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 40px;
+  }
+  
+  .info-section {
+    background-color: #fff;
+    padding: 20px;
+    border-radius: 12px;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+  }
+  
+  .info-section h2 {
+    font-size: 1.4rem;
+    margin-bottom: 10px;
+    color: #0056b3;
+  }
+  
+  .info-section p {
+    font-size: 1rem;
+    margin: 5px 0;
+  }
+  
+  /* Disk Usage Section */
+  .disk-usage {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+  }
+  
+  .chart-container {
+    width: 150px;
+    height: 150px;
+    margin-bottom: 10px;
+  }
+  
+  .circular-chart {
+    display: block;
+    margin: 0 auto;
+    max-width: 100%;
+    max-height: 150px;
+  }
+  
+  .circle-bg {
+    fill: none;
+    stroke: #eee;
+    stroke-width: 3.8;
+  }
+  
+  .circle {
+    fill: none;
+    stroke-width: 3.8;
+    stroke: #00bfa5;
+    stroke-linecap: round;
+    animation: progress 1s ease-out forwards;
+  }
+  
+  .percentage {
+    fill: #333;
+    font-size: 0.5rem;
+    text-anchor: middle;
+  }
+  
+  /* Footer */
+  .client-footer {
+    margin-top: 40px;
+    text-align: center;
+    font-size: 1rem;
+    color: #555;
+  }
+  
+  @keyframes progress {
+    0% {
+      stroke-dasharray: 0, 100;
+    }
+  }
+  
\ No newline at end of file
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
index 0301b02..b3ef2de 100644
--- 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
@@ -1 +1,67 @@
-<p>client-main-view works!</p>
+<div class="container">
+    <div class="client-header">
+      <div class="client-icon">
+        <mat-icon class="icon-pc">computer</mat-icon>
+      </div>
+      <div class="client-title">
+        <h1>{{ clientData?.name }}</h1>
+        <p><strong>UUID:</strong> {{ clientData?.uuid }}</p>
+        <p><strong>IP Address:</strong> {{ clientData?.ip }}</p>
+      </div>
+    </div>
+  
+    <div class="client-info">
+      <!-- General Information -->
+      <div class="info-section">
+        <h2>General Information</h2>
+        <p><strong>Type:</strong> {{ clientData?.type }}</p>
+        <p><strong>MAC Address:</strong> {{ clientData?.mac }}</p>
+        <p><strong>Serial Number:</strong> {{ clientData?.serialNumber }}</p>
+      </div>
+  
+      <!-- Disk Space Usage -->
+      <div class="info-section">
+        <h2>Disk Space</h2>
+        <div class="disk-usage">
+          <div class="chart-container">
+            <svg viewBox="0 0 36 36" class="circular-chart green">
+              <path class="circle-bg"
+                d="M18 2.0845
+                   a 15.9155 15.9155 0 0 1 0 31.831
+                   a 15.9155 15.9155 0 0 1 0 -31.831" />
+              <path class="circle"
+                stroke-dasharray="75, 100"
+                d="M18 2.0845
+                   a 15.9155 15.9155 0 0 1 0 31.831
+                   a 15.9155 15.9155 0 0 1 0 -31.831" />
+              <text x="18" y="20.35" class="percentage">75%</text>
+            </svg>
+          </div>
+          <p>Used: 75% (375GB)</p>
+          <p>Total: 500GB</p>
+        </div>
+      </div>
+  
+      <!-- Organizational Unit -->
+      <div class="info-section">
+        <h2>Organizational Unit</h2>
+        <p><strong>Name:</strong> {{ clientData?.organizationalUnit?.name }}</p>
+        <p><strong>Type:</strong> {{ clientData?.organizationalUnit?.type }}</p>
+      </div>
+  
+      <!-- Network Settings -->
+      <div class="info-section">
+        <h2>Network Settings</h2>
+        <p><strong>Next Server:</strong> {{ clientData?.organizationalUnit?.networkSettings?.nextServer }}</p>
+        <p><strong>Boot File Name:</strong> {{ clientData?.organizationalUnit?.networkSettings?.bootFileName }}</p>
+        <p><strong>DNS:</strong> {{ clientData?.organizationalUnit?.networkSettings?.dns }}</p>
+        <p><strong>Router:</strong> {{ clientData?.organizationalUnit?.networkSettings?.router }}</p>
+      </div>
+    </div>
+  
+    <div class="client-footer">
+      <p><strong>Created At:</strong> {{ clientData?.createdAt | date }}</p>
+      <p><strong>Created By:</strong> {{ clientData?.createdBy }}</p>
+    </div>
+  </div>
+  
\ No newline at end of file
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
index 9d1162b..e779de1 100644
--- 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
@@ -1,10 +1,36 @@
-import { Component } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
 
 @Component({
   selector: 'app-client-main-view',
   templateUrl: './client-main-view.component.html',
   styleUrl: './client-main-view.component.css'
 })
-export class ClientMainViewComponent {
+export class ClientMainViewComponent implements OnInit {
+  baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
+  clientUuid: string;
+  clientData: any;
 
+  constructor(private http: HttpClient) {
+    const url = window.location.href;
+    const segments = url.split('/');
+    this.clientUuid = segments[segments.length - 1];
+  }
+
+  ngOnInit() {
+    this.loadClientData();
+  }
+
+  loadClientData() {
+    this.http.get(`${this.baseUrl}/clients/${this.clientUuid}`).subscribe(
+      data => {
+        this.clientData = data;
+      },
+      error => {
+        console.error('Error loading client data:', error);
+      }
+    );
+  }
+
+  
 }