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

develop
Manuel Aranda Rosales 2025-04-30 13:16:18 +02:00
parent bf100943a0
commit 83ab784c48
9 changed files with 103 additions and 79 deletions

View File

@ -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 {
@ -131,4 +134,4 @@ mat-dialog-content {
.submit-button {
margin: 1rem;
}
}

View File

@ -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>

View File

@ -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;
}
@ -107,4 +115,18 @@ table {
width: 100%;
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;
}

View File

@ -23,10 +23,12 @@
</div>
</div>
<div class="section-header">
<h2 class="title" i18n="@@adminImagesTitle">Discos/Particiones</h2>
<div class="table-header-container">
<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">
@ -63,4 +65,7 @@
</div>
</div>
</div>
</mat-dialog-content>
</mat-dialog-content>
<mat-dialog-actions class="action-container">
<button class="ordinary-button" (click)="onNoClick()">{{ 'closeButton' | translate }}</button>
</mat-dialog-actions>

View File

@ -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',
@ -115,7 +120,7 @@ export class ClientDetailsComponent {
console.error('No se recibieron datos del cliente.');
}
}
loadClient = (uuid: string) => {
this.http.get<any>(`${this.baseUrl}${uuid}`).subscribe({
next: data => {
@ -225,42 +230,8 @@ export class ClientDetailsComponent {
});
}
loadCommands(): void {
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();
}
onNoClick(): void {
this.dialog.closeAll();
}
rebootClient(): void {

View File

@ -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>

View File

@ -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
});

View File

@ -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-label>OgLive</mat-label>
<mat-select formControlName="ogLive" (selectionChange)="onOgLiveChange($event)">
<mat-option *ngFor="let oglive of ogLives" [value]="oglive['@id']">
{{ oglive.name }}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field class="form-field">
<mat-label>OgLive</mat-label>
<mat-select formControlName="ogLive" (selectionChange)="onOgLiveChange($event)">
<mat-option *ngFor="let oglive of ogLives" [value]="oglive['@id']">
{{ oglive.name }}
</mat-option>
</mat-select>
</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)">

View File

@ -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,