refs #1505. Refactor Groups component to use arrayClients for filtering
testing/ogGui-multibranch/pipeline/head There was a failure building this commit Details

pull/16/head
Lucas Lara García 2025-02-12 14:10:00 +01:00
parent bada1762aa
commit c8c1bdd0bd
2 changed files with 50 additions and 62 deletions

View File

@ -187,17 +187,12 @@
<div *ngIf="hasClients; else noClientsTemplate"> <div *ngIf="hasClients; else noClientsTemplate">
<!-- Cards view --> <!-- Cards view -->
<div class="clients-grid" *ngIf="currentView === 'card'"> <div class="clients-grid" *ngIf="currentView === 'card'">
<div *ngFor="let client of selectedClients.data" class="client-item"> <div *ngFor="let client of arrayClients" class="client-item">
<div class="client-card"> <div class="client-card">
<mat-checkbox (click)="$event.stopPropagation()" <mat-checkbox (click)="$event.stopPropagation()" (change)="toggleRow(client)"
(change)="toggleRow(client)" [checked]="selection.isSelected(client)" [disabled]="client.status === 'busy'">
[checked]="selection.isSelected(client)"
[disabled]="client.status === 'busy'"
>
</mat-checkbox> </mat-checkbox>
<img <img [src]="'assets/images/ordenador_' + client.status + '.png'" alt="Client Icon"
[src]="'assets/images/ordenador_' + client.status + '.png'"
alt="Client Icon"
class="client-image" /> class="client-image" />
<div class="client-details"> <div class="client-details">
@ -205,24 +200,17 @@
<span class="client-ip">{{ client.ip }}</span> <span class="client-ip">{{ client.ip }}</span>
<span class="client-ip">{{ client.mac }}</span> <span class="client-ip">{{ client.mac }}</span>
<div class="action-icons"> <div class="action-icons">
<button <button *ngIf="(!syncStatus || syncingClientId !== client.uuid)" mat-icon-button color="primary"
*ngIf="(!syncStatus || syncingClientId !== client.uuid)"
mat-icon-button color="primary"
(click)="getStatus(client, selectedNode)"> (click)="getStatus(client, selectedNode)">
<mat-icon>sync</mat-icon> <mat-icon>sync</mat-icon>
</button> </button>
<button <button *ngIf="syncStatus && syncingClientId === client.uuid" mat-icon-button color="primary">
*ngIf="syncStatus && syncingClientId === client.uuid"
mat-icon-button color="primary">
<mat-spinner diameter="24"></mat-spinner> <mat-spinner diameter="24"></mat-spinner>
</button> </button>
<app-execute-command <app-execute-command [clientData]="[client]" [buttonType]="'icon'"
[clientData]="[client]" [icon]="'terminal'"></app-execute-command>
[buttonType]="'icon'"
[icon]="'terminal'"
></app-execute-command>
<button mat-icon-button [matMenuTriggerFor]="clientMenu" color="primary"> <button mat-icon-button [matMenuTriggerFor]="clientMenu" color="primary">
<mat-icon>more_vert</mat-icon> <mat-icon>more_vert</mat-icon>

View File

@ -125,6 +125,8 @@ export class GroupsComponent implements OnInit, OnDestroy {
client.mac?.toLowerCase().includes(lowerTerm) client.mac?.toLowerCase().includes(lowerTerm)
); );
}; };
this.arrayClients = this.selectedClients.data;
} }
@ -308,6 +310,7 @@ export class GroupsComponent implements OnInit, OnDestroy {
this.http.get<any>(`${this.baseUrl}/clients?organizationalUnit.id=${node.id}`).subscribe({ this.http.get<any>(`${this.baseUrl}/clients?organizationalUnit.id=${node.id}`).subscribe({
next: (response) => { next: (response) => {
this.selectedClients.data = response['hydra:member']; this.selectedClients.data = response['hydra:member'];
this.arrayClients = this.selectedClients.data;
this.hasClients = node.hasClients ?? false; this.hasClients = node.hasClients ?? false;
this.isLoadingClients = false; this.isLoadingClients = false;
this.initialLoading = false; this.initialLoading = false;
@ -400,16 +403,12 @@ export class GroupsComponent implements OnInit, OnDestroy {
onDeleteClick(event: MouseEvent, entity: TreeNode | Client | null): void { onDeleteClick(event: MouseEvent, entity: TreeNode | Client | null): void {
console.log('Entity to delete:', entity);
event.stopPropagation(); event.stopPropagation();
if (!entity) return; if (!entity) return;
const uuid = entity['@id'] ? this.extractUuid(entity['@id']) : null; const uuid = entity['@id'] ? this.extractUuid(entity['@id']) : null;
const type = entity.hasOwnProperty('mac') ? NodeType.Client : NodeType.OrganizationalUnit; const type = entity.hasOwnProperty('mac') ? NodeType.Client : NodeType.OrganizationalUnit;
console.log('UUID:', uuid);
console.log('Type:', type);
if (!uuid) return; if (!uuid) return;
const dialogRef = this.dialog.open(DeleteModalComponent, { const dialogRef = this.dialog.open(DeleteModalComponent, {
@ -596,6 +595,7 @@ export class GroupsComponent implements OnInit, OnDestroy {
filterClients(searchTerm: string): void { filterClients(searchTerm: string): void {
this.searchTerm = searchTerm.trim().toLowerCase(); this.searchTerm = searchTerm.trim().toLowerCase();
this.selectedClients.filter = this.searchTerm; this.selectedClients.filter = this.searchTerm;
this.arrayClients = this.selectedClients.filteredData;
} }