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

Groups edit and delete ou

pull/4/head
Alvaro Puente Mella 2024-06-21 01:15:54 +02:00
parent ff983176c9
commit b14605f248
2 changed files with 37 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -5,39 +5,56 @@
<mat-divider></mat-divider> <mat-divider></mat-divider>
<h2>Grupos</h2> <h2>Grupos</h2>
<div class="groupLists-container"> <div class="groupLists-container">
<mat-card > <mat-card>
<mat-card-title>Unidad organizativa</mat-card-title> <mat-card-title>Unidad organizativa</mat-card-title>
<mat-card-content> <mat-card-content>
<mat-list role="list"> <mat-list role="list">
<mat-list-item *ngFor="let unidad of unidadesOrganizativas" <mat-list-item *ngFor="let unidad of unidadesOrganizativas" (click)="onSelectUnidad(unidad)"
(click)="onSelectUnidad(unidad)"
[ngClass]="{'selected-item': unidad === selectedUnidad, 'clickable-item': true}"> [ngClass]="{'selected-item': unidad === selectedUnidad, 'clickable-item': true}">
<div> <span>
<mat-icon>apartment</mat-icon> <mat-icon>apartment</mat-icon>
{{ unidad.nombre }} {{ unidad.nombre }}
</div> </span>
<span class="actions">
<mat-icon class="edit-icon" (click)="onEditClick(unidad, unidad.uuid)">edit</mat-icon>
<mat-icon class="delete-icon" (click)="onDeleteClick(unidad.uuid)">delete</mat-icon>
</span>
</mat-list-item> </mat-list-item>
</mat-list> </mat-list>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>
<mat-card class="finder-card" *ngIf="children.length > 0"> <mat-card class="elements-card" *ngIf="children.length > 0">
<mat-card-title>{{ breadcrumb.join(' > ') }}</mat-card-title> <mat-card-title>{{ breadcrumb.join(' > ') }}</mat-card-title>
<mat-card-content> <mat-card-content>
<mat-list role="list"> <mat-list role="list">
<mat-list-item *ngFor="let child of children" <mat-list-item *ngFor="let child of children" [ngClass]="{'clickable-item': true}">
[ngClass]="{'clickable-item': true}">
<div> <div>
<span (click)="onSelectChild(child)"> <span (click)="onSelectChild(child)">
<ng-container [ngSwitch]="getIcon(child['type'])"> <ng-container [ngSwitch]="getIcon(child['type'])">
<mat-icon *ngSwitchCase="'apartment'">apartment</mat-icon> <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="'classrooms-group-icon'" xmlns="http://www.w3.org/2000/svg" height="24px"
<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> viewBox="0 -960 960 960" width="24px" fill="#5f6368">
<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> <path
<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> 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" />
</ng-container> </svg>
{{ child.name || child.nombre }} <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>
<span class="actions"> <span class="actions">
<mat-icon class="edit-icon" (click)="onEditClick(child.type, child.uuid)">edit</mat-icon> <mat-icon class="edit-icon" (click)="onEditClick(child.type, child.uuid)">edit</mat-icon>

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

@ -83,7 +83,8 @@ export class GroupsComponent implements OnInit {
// Aquí puedes agregar lógica adicional para eliminar el elemento si es necesario // Aquí puedes agregar lógica adicional para eliminar el elemento si es necesario
} }
onEditClick(uuid: string): void { onEditClick(type: any, uuid: string): void {
console.log('Tipo del elemento a editar:', type);
console.log('UUID del elemento a editar:', uuid); console.log('UUID del elemento a editar:', uuid);
// Aquí puedes agregar lógica adicional para editar el elemento si es necesario // Aquí puedes agregar lógica adicional para editar el elemento si es necesario
} }