111 lines
3.0 KiB
TypeScript
111 lines
3.0 KiB
TypeScript
import { Component, effect, EventEmitter, Input, Output, signal } from '@angular/core';
|
|
import { SortState, TableColumn, DataTable } from '@shared/components/data-table/data-table';
|
|
import { ListParams, SortDir } from '@shared/paging/paging';
|
|
import { Agent } from 'src/app/core/interfaces/agent';
|
|
import { TpeDevice } from 'src/app/core/interfaces/tpe';
|
|
import { TpeService } from 'src/app/core/services/tpe';
|
|
import { Paginator } from "@shared/components/paginator/paginator";
|
|
|
|
@Component({
|
|
selector: 'app-tpe-select',
|
|
imports: [DataTable, Paginator],
|
|
templateUrl: './tpe-select.html',
|
|
styleUrl: './tpe-select.css',
|
|
})
|
|
export class TpeSelect {
|
|
@Input() agent?: Agent; // Agent pour filtrer les TPE assignés
|
|
@Input() selected: string[] = []; // Ids de TPE à cocher par défaut
|
|
|
|
@Output() selectionChange = new EventEmitter<string[]>(); // TPE sélectionnés
|
|
|
|
tpes = signal<TpeDevice[]>([]);
|
|
total = signal(0);
|
|
loading = signal<boolean>(true);
|
|
selectedIds = signal<Set<string>>(new Set());
|
|
page = signal(0);
|
|
perPage = signal(10);
|
|
search = signal('');
|
|
sort = signal<SortState>({ key: 'id', dir: 'asc' });
|
|
|
|
|
|
|
|
columns:TableColumn<TpeDevice>[] = [
|
|
{
|
|
key: 'numeroSerie',
|
|
label: "Numero de serie"
|
|
},
|
|
{
|
|
key: 'versionLogicielle',
|
|
label: "Version du logiciel"
|
|
},
|
|
{
|
|
key: 'modeleAppareil',
|
|
label: "Model"
|
|
},
|
|
{
|
|
key: 'systemeExploitation',
|
|
label: 'Système d\'exploitation'
|
|
},
|
|
{
|
|
key: 'versionOs',
|
|
label: 'Version Os'
|
|
}
|
|
]
|
|
|
|
constructor(private tpeService: TpeService) {
|
|
effect(()=>{
|
|
const params = {
|
|
page: this.page(),
|
|
size: this.perPage(),
|
|
sortKey: this.sort().key,
|
|
sortDir: this.sort().dir as SortDir,
|
|
}
|
|
this.loadTpes(params);
|
|
})
|
|
}
|
|
|
|
ngOnInit() {
|
|
// Initialiser les TPE sélectionnés si fournis
|
|
this.selectedIds.set(new Set(this.selected));
|
|
|
|
|
|
}
|
|
|
|
private loadTpes(params:ListParams) {
|
|
this.loading.set(true);
|
|
this.tpeService.list(params).subscribe({
|
|
next: (res) => {
|
|
// Filtrer : TPE non assignés ou déjà assignés à cet agent
|
|
// console.log(res.content);
|
|
// const available = res.content.filter(
|
|
// (t) =>
|
|
// !t.agentConnecteId || t.agentConnecteId === this.agent?.id
|
|
// );
|
|
this.tpes.set(res.content);
|
|
this.total.set(res.pageable.total);
|
|
this.loading.set(false);
|
|
},
|
|
error: (err) => {
|
|
console.error(err);
|
|
this.loading.set(false);
|
|
},
|
|
});
|
|
}
|
|
|
|
toggleTpe(tpe: TpeDevice) {
|
|
const current = new Set(this.selectedIds());
|
|
if (current.has(tpe.id)) {
|
|
current.delete(tpe.id);
|
|
} else {
|
|
current.add(tpe.id);
|
|
}
|
|
this.selectedIds.set(current);
|
|
this.selectionChange.emit(Array.from(current));
|
|
}
|
|
|
|
isChecked(tpe: TpeDevice) {
|
|
return this.selectedIds().has(String(tpe.id));
|
|
}
|
|
|
|
}
|