opengnsys
/
oggui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Groups edit and delete

pull/4/head
Alvaro Puente Mella 2024-06-21 01:05:03 +02:00
parent 3d77c179ba
commit ff983176c9
4 changed files with 72 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
ogWebconsole/src/app/components/groups/groups.component.css
View File

@ -24,3 +24,24 @@ button {
.selected-item {
background-color: #e0e0e0;
}
.actions {
margin-left: auto;
}
.actions mat-icon {
cursor: pointer;
margin-left: 48px;
color: #757575;
}
.actions mat-icon:hover {
color: #212121;
}
.elements-card{
margin: 10px;
width: 800px;
background-color: #fafafa;
}

25
ogWebconsole/src/app/components/groups/groups.component.html
View File

@ -5,7 +5,7 @@
<mat-divider></mat-divider>
<h2>Grupos</h2>
<div class="groupLists-container">
<mat-card>
<mat-card >
<mat-card-title>Unidad organizativa</mat-card-title>
<mat-card-content>
<mat-list role="list">
@ -15,20 +15,35 @@
<div>
<mat-icon>apartment</mat-icon>
{{ unidad.nombre }}
</div>
</div>
</mat-list-item>
</mat-list>
</mat-card-content>
</mat-card>
<mat-card *ngIf="children.length > 0">
<mat-card class="finder-card" *ngIf="children.length > 0">
<mat-card-title>{{ breadcrumb.join(' > ') }}</mat-card-title>
<mat-card-content>
<mat-list role="list">
<mat-list-item *ngFor="let child of children"
(click)="onSelectChild(child)"
[ngClass]="{'clickable-item': true}">
{{ child.name || child.nombre }}
<div>
<span (click)="onSelectChild(child)">
<ng-container [ngSwitch]="getIcon(child['type'])">
<mat-icon *ngSwitchCase="'apartment'">apartment</mat-icon>
<svg *ngSwitchCase="'classrooms-group-icon'" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368"><path d="M120-120v-80h80v-640h400v40h160v600h80v80H680v-600h-80v600H120Zm160-640v560-560Zm160 320q17 0 28.5-11.5T480-480q0-17-11.5-28.5T440-520q-17 0-28.5 11.5T400-480q0 17 11.5 28.5T440-440ZM280-200h240v-560H280v560Z"/></svg>
<svg *ngSwitchCase="'classroom-icon'" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368"><path d="M120-120v-80h80v-640h400v40h160v600h80v80H680v-600h-80v600H120Zm160-640v560-560Zm160 320q17 0 28.5-11.5T480-480q0-17-11.5-28.5T440-520q-17 0-28.5 11.5T400-480q0 17 11.5 28.5T440-440ZM280-200h240v-560H280v560Z"/></svg>
<svg *ngSwitchCase="'client-icon'" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368"><path d="M40-120v-80h880v80H40Zm120-120q-33 0-56.5-23.5T80-320v-440q0-33 23.5-56.5T160-840h640q33 0 56.5 23.5T880-760v440q0 33-23.5 56.5T800-240H160Zm0-80h640v-440H160v440Zm0 0v-440 440Z"/></svg>
<svg *ngSwitchCase="'clients-group-icon'" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368"><path d="M120-80v-280h120v-160h200v-80H320v-280h320v280H520v80h200v160h120v280H520v-280h120v-80H320v80h120v280H120Zm280-600h160v-120H400v120ZM200-160h160v-120H200v120Zm400 0h160v-120H600v120ZM480-680ZM360-280Zm240 0Z"/></svg>
</ng-container>
{{ child.name || child.nombre }}
</span>
<span class="actions">
<mat-icon class="edit-icon" (click)="onEditClick(child.type, child.uuid)">edit</mat-icon>
<mat-icon class="delete-icon" (click)="onDeleteClick(child.uuid)">delete</mat-icon>
</span>
</div>
</mat-list-item>
</mat-list>
</mat-card-content>

33
ogWebconsole/src/app/components/groups/groups.component.ts
View File

@ -27,17 +27,17 @@ export class GroupsComponent implements OnInit {
onSelectUnidad(unidad: UnidadOrganizativa): void {
this.selectedUnidad = unidad;
this.breadcrumb = [unidad.nombre];
this.loadChildrenAndClients(unidad.uuid);
this.loadChildrenAndClients(unidad.uuid, unidad.id);
}
onSelectChild(child: any): void {
if (child.uuid && child.id) {
this.breadcrumb.push(child.name || child.nombre);
this.loadChildrenAndClients(child.uuid);
this.loadChildrenAndClients(child.uuid, child.id);
}
}
loadChildrenAndClients(uuid: string): void {
loadChildrenAndClients(uuid: string, id: number): void {
this.dataService.getChildren(uuid).subscribe(
childrenData => {
this.dataService.getClients(uuid).subscribe(
@ -60,4 +60,31 @@ export class GroupsComponent implements OnInit {
addOU(): void {
this.dialog.open(CreateOrganizationalUnitComponent);
}
getIcon(type: string): string {
switch(type) {
case 'organizational-unit':
return 'apartment';
case 'classroom-group':
return 'classrooms-group-icon';
case 'classroom':
return 'classroom-icon';
case 'client':
return 'client-icon';
case 'clients-group':
return 'clients-group-icon';
default:
return '';
}
}
onDeleteClick(uuid: string): void {
console.log('UUID del elemento a eliminar:', uuid);
// Aquí puedes agregar lógica adicional para eliminar el elemento si es necesario
}
onEditClick(uuid: string): void {
console.log('UUID del elemento a editar:', uuid);
// Aquí puedes agregar lógica adicional para editar el elemento si es necesario
}
}

1
ogWebconsole/src/app/components/groups/model.ts
View File

@ -14,3 +14,4 @@ export interface UnidadOrganizativa {
uuid: string;
aulas: Aula[];
}