99 lines
2.8 KiB
TypeScript
99 lines
2.8 KiB
TypeScript
import {Component, Inject} from '@angular/core';
|
|
import {Observable, startWith} from "rxjs";
|
|
import {FormControl} from "@angular/forms";
|
|
import {HttpClient} from "@angular/common/http";
|
|
import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
|
|
import {ToastrService} from "ngx-toastr";
|
|
import {map} from "rxjs/operators";
|
|
|
|
@Component({
|
|
selector: 'app-add-clients-to-pxe',
|
|
templateUrl: './add-clients-to-pxe.component.html',
|
|
styleUrl: './add-clients-to-pxe.component.css'
|
|
})
|
|
export class AddClientsToPxeComponent {
|
|
baseUrl: string = import.meta.env.NG_APP_BASE_API_URL;
|
|
clients: any[] = [];
|
|
selectedClients: any[] = [];
|
|
loading: boolean = true;
|
|
filters: { [key: string]: string } = {};
|
|
filteredClients!: Observable<any[]>;
|
|
clientControl = new FormControl();
|
|
|
|
constructor(
|
|
private http: HttpClient,
|
|
public dialogRef: MatDialogRef<AddClientsToPxeComponent>,
|
|
private toastService: ToastrService,
|
|
@Inject(MAT_DIALOG_DATA) public data: { subnetUuid: string, subnetName: string }
|
|
) {}
|
|
|
|
ngOnInit(): void {
|
|
this.loading = true;
|
|
|
|
this.loadClients();
|
|
|
|
this.filteredClients = this.clientControl.valueChanges.pipe(
|
|
startWith(''),
|
|
map(value => (typeof value === 'string' ? value : value?.name)),
|
|
map(name => (name ? this._filterClients(name) : this.clients.slice()))
|
|
);
|
|
}
|
|
|
|
loadClients() {
|
|
this.http.get<any>( `${this.baseUrl}/clients?&page=1&itemsPerPage=10000&exists[template]=false`).subscribe(
|
|
response => {
|
|
this.clients = response['hydra:member'];
|
|
this.loading = false;
|
|
},
|
|
error => {
|
|
console.error('Error fetching parent units:', error);
|
|
this.loading = false;
|
|
}
|
|
);
|
|
}
|
|
|
|
save() {
|
|
const postData = {
|
|
clients: this.selectedClients.map(client => client['@id'])
|
|
};
|
|
|
|
this.http.post(`${this.baseUrl}/pxe-templates/${this.data.subnetUuid}/add-clients`, postData).subscribe(
|
|
response => {
|
|
this.toastService.success('Clientes asignados correctamente');
|
|
},
|
|
error => {
|
|
this.toastService.error(error.error['hydra:description']);
|
|
}
|
|
);
|
|
|
|
this.dialogRef.close(this.selectedClients);
|
|
}
|
|
|
|
close() {
|
|
this.dialogRef.close();
|
|
}
|
|
|
|
removeClient(client: any) {
|
|
const index = this.selectedClients.indexOf(client);
|
|
if (index >= 0) {
|
|
this.selectedClients.splice(index, 1);
|
|
}
|
|
}
|
|
|
|
private _filterClients(name: string): any[] {
|
|
const filterValue = name.toLowerCase();
|
|
return this.clients.filter(client => client.name.toLowerCase().includes(filterValue));
|
|
}
|
|
|
|
displayFnClient(client: any): string {
|
|
return client && client.name ? client.name : '';
|
|
}
|
|
|
|
onOptionClientSelected(client: any) {
|
|
if (!this.selectedClients.includes(client)) {
|
|
this.selectedClients.push(client);
|
|
}
|
|
this.clientControl.setValue('');
|
|
}
|
|
}
|