refs #1641. Implement debounced client filtering in groups component
testing/ogGui-multibranch/pipeline/head This commit looks good Details

pull/13/head
Lucas Lara García 2025-03-05 15:45:23 +01:00
parent 5907404f77
commit c568d5a8e7
1 changed files with 19 additions and 12 deletions

View File

@ -1,5 +1,5 @@
import { Component, OnInit, OnDestroy, ViewChild } from '@angular/core';
import {HttpClient, HttpParams} from '@angular/common/http';
import { HttpClient, HttpParams } from '@angular/common/http';
import { Router } from '@angular/router';
import { MatDialog } from '@angular/material/dialog';
import { MatBottomSheet } from '@angular/material/bottom-sheet';
@ -21,6 +21,8 @@ import { MatPaginator, PageEvent } from '@angular/material/paginator';
import { CreateMultipleClientComponent } from "./shared/clients/create-multiple-client/create-multiple-client.component";
import { SelectionModel } from "@angular/cdk/collections";
import { ManageClientComponent } from "./shared/clients/manage-client/manage-client.component";
import { debounceTime } from 'rxjs/operators';
import { Subject } from 'rxjs';
enum NodeType {
OrganizationalUnit = 'organizational-unit',
@ -65,17 +67,18 @@ export class GroupsComponent implements OnInit, OnDestroy {
private originalTreeData: TreeNode[] = [];
arrayClients: any[] = [];
filters: { [key: string]: string } = {};
private clientFilterSubject = new Subject<string>();
protected status = [
{value: 'off', name: 'Apagado'},
{value: 'initializing', name: 'Inicializando'},
{value: 'og-live', name: 'Og Live'},
{value: 'linux', name: 'Linux'},
{value: 'linux-session', name: 'Linux Session'},
{value: 'windows', name: 'Windows'},
{value: 'windows-session', name: 'Windows Session'},
{value: 'busy', name: 'Ocupado'},
{value: 'mac', name: 'Mac'},
{ value: 'off', name: 'Apagado' },
{ value: 'initializing', name: 'Inicializando' },
{ value: 'og-live', name: 'Og Live' },
{ value: 'linux', name: 'Linux' },
{ value: 'linux-session', name: 'Linux Session' },
{ value: 'windows', name: 'Windows' },
{ value: 'windows-session', name: 'Windows Session' },
{ value: 'busy', name: 'Ocupado' },
{ value: 'mac', name: 'Mac' },
];
displayedColumns: string[] = ['select', 'status', 'ip', 'name', 'oglive', 'subnet', 'pxeTemplate', 'actions'];
@ -144,6 +147,11 @@ export class GroupsComponent implements OnInit, OnDestroy {
this.updateClientStatus(data['@id'], data.status);
}
}
this.clientFilterSubject.pipe(debounceTime(500)).subscribe(searchTerm => {
this.filters['query'] = searchTerm;
this.filterClients(searchTerm);
});
}
private updateClientStatus(clientUuid: string, newStatus: string): void {
@ -638,8 +646,7 @@ export class GroupsComponent implements OnInit, OnDestroy {
onClientFilterInput(event: Event): void {
const input = event.target as HTMLInputElement;
const searchTerm = input?.value || '';
this.filters['query'] = searchTerm;
this.filterClients(searchTerm);
this.clientFilterSubject.next(searchTerm);
}
onClientFilterStatusInput(event: Event): void {