refs #1922. Show new fields in clients table. Fixed wrong details

ogWebconsole/src/app/components/groups/shared/classroom-view/classroom-view.component.css

@@ -21,21 +21,24 @@ mat-card {
 }
 
 .client-image {
-  width: 100%;
+  display: flex;
+  justify-content: center;
+  width: 70%;
   height: auto;
+  margin: 0 auto;
 }
 
 .proyector-image {
   width: auto;
-  height: 100px;
+  height: 80px;
 }
 
 .client-info {
+  display: grid;
   text-align: center;
-  margin-top: 5px;
-  font-size: medium;
   color: gray;
   align-items: center;
+  font-size: small;
 }
 
 .client-name {

ogWebconsole/src/app/components/groups/shared/classroom-view/classroom-view.component.html

@@ -12,7 +12,9 @@
               <img mat-card-image src="assets/images/client.png" alt="{{ 'clientAlt' | translate }}" class="client-image"/>
             </div>
             <div class="client-info">
-              <span>{{ client.name }}</span>
+              <span><strong>{{ client.name }}</strong></span>
+              <span>{{ client.ip }}</span>
+              <span>{{ client.mac }}</span>
             </div>
           </mat-card>
         </div>

ogWebconsole/src/app/components/groups/shared/client-details/client-details.component.css

@@ -62,7 +62,8 @@
 }
 
 .table-container {
-  flex: 1 1 500px;
+  flex: 5;
+  display: flex;
   overflow-x: auto;
 }
 
@@ -70,7 +71,7 @@
   display: flex;
   flex-wrap: wrap;
   gap: 24px;
-  flex: 1 1 300px;
+  flex: 2;
   justify-content: flex-start;
 }
 
@@ -85,6 +86,13 @@ table {
   box-shadow: none;
 }
 
+.table-header-container {
+  display: flex;
+  align-items: center;
+  padding: 10px;
+  gap: 20px;
+}
+
 .charts-container.single-disk {
   justify-content: center;
 }
@@ -108,3 +116,17 @@ table {
   height: 160px;
   margin-bottom: 12px;
 }
+
+.action-container {
+  display: flex;
+  justify-content: flex-end;
+  gap: 1em;
+  padding: 1.5em;
+}
+
+.client-container {
+  display: flex;
+  flex-direction: column;
+  gap: 1em;
+  margin-bottom: 40px;
+}

ogWebconsole/src/app/components/groups/shared/client-details/client-details.component.html

@@ -23,10 +23,12 @@
       </div>
     </div>
 
-    <div class="section-header">
+    <div class="table-header-container">
-      <h2 class="title" i18n="@@adminImagesTitle">Discos/Particiones</h2>
+      <h2 i18n="@@adminImagesTitle">Discos/Particiones</h2>
+      <mat-chip> {{ clientData.firmwareType }}</mat-chip>
     </div>
 
+
     <div class="disk-container">
       <div class="disk-layout">
         <div class="table-container">
@@ -64,3 +66,6 @@
     </div>
   </div>
 </mat-dialog-content>
+<mat-dialog-actions class="action-container">
+  <button class="ordinary-button" (click)="onNoClick()">{{ 'closeButton' | translate }}</button>
+</mat-dialog-actions>

ogWebconsole/src/app/components/groups/shared/client-details/client-details.component.ts

@@ -64,6 +64,11 @@ export class ClientDetailsComponent {
       header: 'Particion',
       cell: (partition: any) => `${partition.partitionNumber}`
     },
+    {
+      columnDef: 'partitionCode',
+      header: 'Tipo de partición',
+      cell: (partition: any) => `${partition.partitionCode}`
+    },
     {
       columnDef: 'description',
       header: 'Sistema de ficheros',
@@ -225,42 +230,8 @@ export class ClientDetailsComponent {
     });
   }
 
-
+  onNoClick(): void {
-  loadCommands(): void {
+    this.dialog.closeAll();
-    this.http.get<any>(`${this.baseUrl}/commands?`).subscribe({
-      next: data => {
-        this.commands = data['hydra:member'];
-      },
-      error: error => {
-        console.error('Error al obtener las particiones:', error);
-      }
-    });
-  }
-
-  onCommandSelect(action: any): void {
-    if (action === 'partition') {
-      this.openPartitionAssistant();
-    }
-
-    if (action === 'create-image') {
-      this.openCreateImageAssistant();
-    }
-
-    if (action === 'deploy-image') {
-      this.openDeployImageAssistant();
-    }
-
-    if (action === 'reboot') {
-      this.rebootClient();
-    }
-
-    if (action === 'power-off') {
-      this.powerOffClient();
-    }
-
-    if (action === 'power-on') {
-      this.powerOnClient();
-    }
   }
 
   rebootClient(): void {

ogWebconsole/src/app/components/groups/shared/clients/manage-client/manage-client.component.html

@@ -67,7 +67,7 @@
 
             <mat-form-field class="form-field">
                 <mat-label>{{ 'templateLabel' | translate }}</mat-label>
-                <mat-select formControlName="template">
+                <mat-select formControlName="pxeTemplate">
                     <mat-option *ngFor="let template of templates" [value]="template['@id']">
                         {{ template.name }}
                     </mat-option>

ogWebconsole/src/app/components/groups/shared/clients/manage-client/manage-client.component.ts

@@ -86,7 +86,7 @@ export class ManageClientComponent implements OnInit {
       netDriver: null,
       mac: ['', Validators.pattern(/^([0-9A-Fa-f]{2}:){5}[0-9A-Fa-f]{2}$/)],
       ip: ['', Validators.required],
-      template: [null],
+      pxeTemplate: [null],
       hardwareProfile: [null],
       ogLive: [null],
       repository: [null],
@@ -110,7 +110,8 @@ export class ManageClientComponent implements OnInit {
             repository: unit.networkSettings?.repository?.['@id'],
             hardwareProfile: unit.networkSettings?.hardwareProfile?.['@id'],
             ogLive: unit.networkSettings?.ogLive?.['@id'],
-            menu: unit.networkSettings?.menu?.['@id']
+            menu: unit.networkSettings?.menu?.['@id'],
+            pxeTemplate: unit.networkSettings?.pxeTemplate?.['@id'],
           }));
 
           const initialUnitId = this.clientForm.get('organizationalUnit')?.value;
@@ -229,6 +230,7 @@ export class ManageClientComponent implements OnInit {
         ogLive: selectedUnit.ogLive || null,
         menu: selectedUnit.menu || null,
         netiface: selectedUnit.netiface || null,
+        pxeTemplate: selectedUnit.pxeTemplate || null
       });
     }
   }
@@ -250,7 +252,7 @@ export class ManageClientComponent implements OnInit {
             organizationalUnit: data.organizationalUnit ? data.organizationalUnit['@id'] : null,
             repository: data.repository ? data.repository['@id'] : null,
             ogLive: data.ogLive ? data.ogLive['@id'] : null,
-            template: data.template ? data.template['@id'] : null,
+            pxeTemplate: data.pxeTemplate ? data.pxeTemplate['@id'] : null,
             menu: data.menu ? data.menu['@id'] : null,
             maintenance: data.maintenance
           });

ogWebconsole/src/app/components/groups/shared/organizational-units/manage-organizational-unit/manage-organizational-unit.component.html

@@ -18,7 +18,7 @@
                 <input matInput formControlName="name" required>
             </mat-form-field>
             <mat-form-field class="form-field" appearance="fill">
-                <mat-label>Padre</mat-label>
+                <mat-label>Unidad organizativa superior</mat-label>
                 <mat-select formControlName="parent" (selectionChange)="onParentChange($event)">
                     <mat-select-trigger>
                         {{ getSelectedParentName() }}
@@ -72,14 +72,22 @@
         <!-- Paso 3: Configuración de Red -->
         <span *ngIf="!loading" class="step-title">Configuración de Red</span>
         <form *ngIf="networkSettingsFormGroup && !loading" [formGroup]="networkSettingsFormGroup" class="grid-form">
-            <mat-form-field class="form-field">
+          <mat-form-field class="form-field">
-                <mat-label>OgLive</mat-label>
+              <mat-label>OgLive</mat-label>
-                <mat-select formControlName="ogLive" (selectionChange)="onOgLiveChange($event)">
+              <mat-select formControlName="ogLive" (selectionChange)="onOgLiveChange($event)">
-                    <mat-option *ngFor="let oglive of ogLives" [value]="oglive['@id']">
+                  <mat-option *ngFor="let oglive of ogLives" [value]="oglive['@id']">
-                        {{ oglive.name }}
+                      {{ oglive.name }}
-                    </mat-option>
+                  </mat-option>
-                </mat-select>
+              </mat-select>
-            </mat-form-field>
+          </mat-form-field>
+          <mat-form-field class="form-field">
+            <mat-label>Plantilla PXE</mat-label>
+            <mat-select formControlName="pxeTemplate" (selectionChange)="onPxeTemplateChange($event)">
+              <mat-option *ngFor="let template of pxeTemplates" [value]="template['@id']">
+                {{ template.name }}
+              </mat-option>
+            </mat-select>
+          </mat-form-field>
             <mat-form-field class="form-field">
                 <mat-label>Repositorio</mat-label>
                 <mat-select formControlName="repository" (selectionChange)="onRepositoryChange($event)">

ogWebconsole/src/app/components/groups/shared/organizational-units/manage-organizational-unit/manage-organizational-unit.component.ts

@@ -30,6 +30,7 @@ export class ManageOrganizationalUnitComponent implements OnInit {
   isEditMode: boolean;
   currentCalendar: any = [];
   ogLives: any[] = [];
+  pxeTemplates: any[] = [];
   menus: any[] = [];
   repositories: any[] = [];
   parentUnitsWithPaths: { id: string, name: string, path: string }[] = [];
@@ -77,6 +78,7 @@ export class ManageOrganizationalUnitComponent implements OnInit {
     this.networkSettingsFormGroup = this._formBuilder.group({
       ogLive: [null],
       repository: [null],
+      pxeTemplate: [null],
       proxy: [null],
       dns: [null],
       netmask: [null],
@@ -111,6 +113,7 @@ export class ManageOrganizationalUnitComponent implements OnInit {
       this.loadOgLives(),
       this.loadRepositories(),
       this.loadMenus(),
+      this.loadPxeTemplates()
     ];
 
     Promise.all(observables).then(() => {
@@ -144,6 +147,7 @@ export class ManageOrganizationalUnitComponent implements OnInit {
             repository: unit.networkSettings?.repository?.['@id'],
             hardwareProfile: unit.networkSettings?.hardwareProfile?.['@id'],
             ogLive: unit.networkSettings?.ogLive?.['@id'],
+            pxeTemplate: unit.networkSettings?.pxeTemplate?.['@id'],
             menu: unit.networkSettings?.menu?.['@id'],
             mcastIp: unit.networkSettings?.mcastIp,
             mcastSpeed: unit.networkSettings?.mcastSpeed,
@@ -183,6 +187,7 @@ export class ManageOrganizationalUnitComponent implements OnInit {
         repository: selectedUnit.repository || null,
         hardwareProfile: selectedUnit.hardwareProfile || null,
         ogLive: selectedUnit.ogLive || null,
+        pxeTemplate: selectedUnit.pxeTemplate || null,
         menu: selectedUnit.menu || null,
         mcastIp: selectedUnit.mcastIp || null,
         mcastSpeed: selectedUnit.mcastSpeed || null,
@@ -219,6 +224,23 @@ export class ManageOrganizationalUnitComponent implements OnInit {
     });
   }
 
+  loadPxeTemplates(): Promise<void> {
+    return new Promise((resolve, reject) => {
+      const url = `${this.baseUrl}/pxe-templates?page=1&itemsPerPage=10000`;
+
+      this.http.get<any>(url).subscribe(
+          response => {
+          this.pxeTemplates = response['hydra:member'];
+          resolve();
+          },
+          error => {
+          console.error('Error fetching pxe templates:', error);
+          reject(error);
+          }
+      );
+    });
+  }
+
   loadOgLives(): Promise<void> {
     return new Promise((resolve, reject) => {
       const url = `${this.baseUrl}/og-lives?page=1&itemsPerPage=30`;
@@ -287,22 +309,6 @@ export class ManageOrganizationalUnitComponent implements OnInit {
     });
   }
 
-  loadCurrentCalendar(uuid: string): void {
-    this.loading = true;
-    const apiUrl = `${this.baseUrl}/remote-calendars/${uuid}`;
-    this.http.get<any>(apiUrl).subscribe(
-      response => {
-        this.currentCalendar = response;
-        this.loading = false;
-      },
-      error => {
-        console.error('Error loading current calendar', error);
-        this.toastService.error('Error loading current calendar');
-        this.loading = false;
-      }
-    );
-  }
-
   onCalendarChange(event: any) {
     this.generalFormGroup.value.remoteCalendar = event.value;
   }
@@ -315,6 +321,10 @@ export class ManageOrganizationalUnitComponent implements OnInit {
     this.networkSettingsFormGroup.value.repository = event.value;
   }
 
+  onPxeTemplateChange(event: any) {
+    this.networkSettingsFormGroup.value.pxeTemplate = event.value;
+  }
+
   loadData(uuid: string): Promise<void> {
     return new Promise((resolve, reject) => {
       const url = `${this.baseUrl}/organizational-units/${uuid}`;
@@ -347,7 +357,8 @@ export class ManageOrganizationalUnitComponent implements OnInit {
             menu: data.networkSettings?.menu ? data.networkSettings.menu['@id'] : null,
             hardwareProfile: data.networkSettings?.hardwareProfile ? data.networkSettings.hardwareProfile['@id'] : null,
             ogLive: data.networkSettings?.ogLive ? data.networkSettings.ogLive['@id'] : null,
-            repository: data.networkSettings?.repository ? data.networkSettings.repository['@id'] : null
+            repository: data.networkSettings?.repository ? data.networkSettings.repository['@id'] : null,
+            pxeTemplate: data.networkSettings?.pxeTemplate ? data.networkSettings.pxeTemplate['@id'] : null
           });
           this.classroomInfoFormGroup.patchValue({
             location: data.location,