118 lines
3.9 KiB
TypeScript
118 lines
3.9 KiB
TypeScript
import { Component, OnInit } from '@angular/core';
|
|
import { DataService } from './data.service';
|
|
import { UnidadOrganizativa } from './model';
|
|
import { MatDialog } from '@angular/material/dialog';
|
|
import { CreateOrganizationalUnitComponent } from './organizational-units/create-organizational-unit/create-organizational-unit.component';
|
|
import { DeleteModalComponent } from './delete-modal/delete-modal.component';
|
|
import { CreateClientComponent } from './clients/create-client/create-client.component';
|
|
import { EditOrganizationalUnitComponent } from './organizational-units/edit-organizational-unit/edit-organizational-unit.component';
|
|
import { EditClientComponent } from './clients/edit-client/edit-client.component';
|
|
|
|
@Component({
|
|
selector: 'app-groups',
|
|
templateUrl: './groups.component.html',
|
|
styleUrls: ['./groups.component.css']
|
|
})
|
|
export class GroupsComponent implements OnInit {
|
|
unidadesOrganizativas: UnidadOrganizativa[] = [];
|
|
selectedUnidad: UnidadOrganizativa | null = null;
|
|
selectedDetail: any | null = null;
|
|
children: any[] = [];
|
|
breadcrumb: string[] = [];
|
|
|
|
constructor(private dataService: DataService, public dialog: MatDialog) {}
|
|
|
|
ngOnInit(): void {
|
|
this.fetchUnidadesOrganizativas();
|
|
}
|
|
|
|
fetchUnidadesOrganizativas(): void {
|
|
this.dataService.getUnidadesOrganizativas().subscribe(
|
|
data => this.unidadesOrganizativas = data,
|
|
error => console.error('Error fetching unidades organizativas', error)
|
|
);
|
|
}
|
|
|
|
onSelectUnidad(unidad: UnidadOrganizativa): void {
|
|
this.selectedUnidad = unidad;
|
|
this.selectedDetail = unidad;
|
|
this.breadcrumb = [unidad.nombre];
|
|
this.loadChildrenAndClients(unidad.uuid);
|
|
}
|
|
|
|
onSelectChild(child: any): void {
|
|
this.selectedDetail = child;
|
|
if (child.type !== 'client' && child.uuid) {
|
|
this.breadcrumb.push(child.name || child.nombre);
|
|
this.loadChildrenAndClients(child.uuid);
|
|
}
|
|
}
|
|
|
|
loadChildrenAndClients(uuid: string): void {
|
|
this.dataService.getChildren(uuid).subscribe(
|
|
childrenData => {
|
|
this.dataService.getClients(uuid).subscribe(
|
|
clientsData => {
|
|
this.children = [...childrenData, ...clientsData];
|
|
if (this.children.length === 0) {
|
|
this.breadcrumb.pop();
|
|
}
|
|
},
|
|
error => {
|
|
console.error('Error fetching clients', error);
|
|
this.children = [];
|
|
}
|
|
);
|
|
},
|
|
error => {
|
|
console.error('Error fetching children', error);
|
|
this.children = [];
|
|
}
|
|
);
|
|
}
|
|
|
|
addOU(): void {
|
|
this.dialog.open(CreateOrganizationalUnitComponent).afterClosed().subscribe(() => {
|
|
this.fetchUnidadesOrganizativas();
|
|
});
|
|
}
|
|
|
|
addClient(): void {
|
|
this.dialog.open(CreateClientComponent).afterClosed().subscribe(() => {
|
|
this.fetchUnidadesOrganizativas();
|
|
});
|
|
}
|
|
|
|
getIcon(type: string): string {
|
|
const iconMap: { [key: string]: string } = {
|
|
'organizational-unit': 'apartment',
|
|
'classroom-group': 'classrooms-group-icon',
|
|
'classroom': 'classroom-icon',
|
|
'client': 'client-icon',
|
|
'clients-group': 'clients-group-icon'
|
|
};
|
|
return iconMap[type] || '';
|
|
}
|
|
|
|
onDeleteClick(uuid: string, name: string, type: string, event: MouseEvent): void {
|
|
event.stopPropagation();
|
|
this.dialog.open(DeleteModalComponent, { width: '250px', data: { name } }).afterClosed().subscribe(result => {
|
|
if (result) {
|
|
this.dataService.deleteElement(uuid, type).subscribe(
|
|
() => {
|
|
this.loadChildrenAndClients(this.selectedUnidad?.uuid || '');
|
|
this.fetchUnidadesOrganizativas();
|
|
},
|
|
error => console.error('Error deleting element', error)
|
|
);
|
|
}
|
|
});
|
|
}
|
|
|
|
onEditClick(type: string, uuid: string, event: MouseEvent): void {
|
|
event.stopPropagation();
|
|
const dialogComponent = type === 'client' ? EditClientComponent : EditOrganizationalUnitComponent;
|
|
this.dialog.open(dialogComponent as any); // Usando type assertion aquí
|
|
}
|
|
}
|