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

refs #901 Refactor create-task to select all clients

oggui/calendar
Alvaro Puente Mella 2024-10-07 15:21:15 +02:00
parent 05f7dd603d
commit 6385f4b267
2 changed files with 61 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

68
ogWebconsole/src/app/components/commands/commands-task/create-task/create-task.component.html
View File

@ -64,41 +64,45 @@
</div> </div>
</mat-step> </mat-step>
<!-- Paso 4: Selecciona Unidad Organizacional, Aula y Clientes --> <!-- Paso 4: Selecciona Unidad Organizacional, Aula y Clientes -->
<mat-step label="Selecciona Unidad Organizacional, Aula y Clientes"> <mat-step label="Selecciona Unidad Organizacional, Aula y Clientes">
<mat-form-field appearance="fill" class="full-width"> <mat-form-field appearance="fill" class="full-width">
<mat-label>Selecciona Unidad Organizacional</mat-label> <mat-label>Selecciona Unidad Organizacional</mat-label>
<mat-select formControlName="organizationalUnit" (selectionChange)="onOrganizationalUnitChange()"> <mat-select formControlName="organizationalUnit" (selectionChange)="onOrganizationalUnitChange()">
<mat-option *ngFor="let unit of availableOrganizationalUnits" [value]="unit['@id']"> <mat-option *ngFor="let unit of availableOrganizationalUnits" [value]="unit['@id']">
{{ unit.name }} {{ unit.name }}
</mat-option> </mat-option>
</mat-select> </mat-select>
<mat-error *ngIf="taskForm.get('organizationalUnit')?.invalid">Este campo es obligatorio</mat-error> <mat-error *ngIf="taskForm.get('organizationalUnit')?.invalid">Este campo es obligatorio</mat-error>
</mat-form-field> </mat-form-field>
<mat-form-field appearance="fill" class="full-width"> <mat-form-field appearance="fill" class="full-width">
<mat-label>Selecciona aula</mat-label> <mat-label>Selecciona aula</mat-label>
<mat-select formControlName="selectedChild" (selectionChange)="onChildChange()"> <mat-select formControlName="selectedChild" (selectionChange)="onChildChange()">
<mat-option *ngFor="let child of selectedUnitChildren" [value]="child['@id']"> <mat-option *ngFor="let child of selectedUnitChildren" [value]="child['@id']">
{{ child.name }} {{ child.name }}
</mat-option> </mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field appearance="fill" class="full-width"> <mat-form-field appearance="fill" class="full-width">
<mat-label>Selecciona Clientes</mat-label> <mat-label>Selecciona Clientes</mat-label>
<mat-select formControlName="selectedClients" multiple> <mat-select formControlName="selectedClients" multiple>
<mat-option *ngFor="let client of selectedClients" [value]="client.uuid"> <mat-option (click)="toggleSelectAll()" [selected]="areAllSelected()">
{{ client.name }} ({{ client.ip }}) Seleccionar todos
</mat-option> </mat-option>
</mat-select> <mat-option *ngFor="let client of selectedClients" [value]="client.uuid">
</mat-form-field> {{ client.name }} ({{ client.ip }})
</mat-option>
</mat-select>
</mat-form-field>
<div class="button-container">
<button mat-button matStepperPrevious>Atrás</button>
<button mat-raised-button color="primary" (click)="saveTask()">Guardar</button>
</div>
</mat-step>
<div class="button-container">
<button mat-button matStepperPrevious>Atrás</button>
<button mat-raised-button color="primary" (click)="saveTask()">Guardar</button>
</div>
</mat-step>
</mat-horizontal-stepper> </mat-horizontal-stepper>
</mat-dialog-content> </mat-dialog-content>
</form> </form>

34
ogWebconsole/src/app/components/commands/commands-task/create-task/create-task.component.ts
View File

@ -20,6 +20,7 @@ export class CreateTaskComponent implements OnInit {
availableOrganizationalUnits: any[] = []; availableOrganizationalUnits: any[] = [];
selectedUnitChildren: any[] = []; selectedUnitChildren: any[] = [];
selectedClients: any[] = []; selectedClients: any[] = [];
selectedClientIds: Set<string> = new Set();
constructor( constructor(
private fb: FormBuilder, private fb: FormBuilder,
@ -124,6 +125,7 @@ export class CreateTaskComponent implements OnInit {
(data) => { (data) => {
this.selectedClients = data.clients; this.selectedClients = data.clients;
this.taskForm.patchValue({ selectedClients: [] }); this.taskForm.patchValue({ selectedClients: [] });
this.selectedClientIds.clear();
}, },
(error) => { (error) => {
this.toastr.error('Error al cargar los detalles del aula seleccionada'); this.toastr.error('Error al cargar los detalles del aula seleccionada');
@ -131,6 +133,20 @@ export class CreateTaskComponent implements OnInit {
); );
} }
toggleSelectAll() {
const allSelected = this.areAllSelected();
if (allSelected) {
this.selectedClientIds.clear();
} else {
this.selectedClients.forEach(client => this.selectedClientIds.add(client.uuid));
}
this.taskForm.get('selectedClients')!.setValue(Array.from(this.selectedClientIds));
}
areAllSelected(): boolean {
return this.selectedClients.length > 0 && this.selectedClients.every(client => this.selectedClientIds.has(client.uuid));
}
saveTask(): void { saveTask(): void {
if (this.taskForm.invalid) { if (this.taskForm.invalid) {
this.toastr.error('Por favor, rellene todos los campos obligatorios'); this.toastr.error('Por favor, rellene todos los campos obligatorios');
@ -143,16 +159,16 @@ export class CreateTaskComponent implements OnInit {
? formData.extraCommands.map((id: any) => `/commands/${id}`) ? formData.extraCommands.map((id: any) => `/commands/${id}`)
: null; : null;
const payload: any = { const payload: any = {
commandGroups: formData.commandGroup ? [`/command-groups/${formData.commandGroup}`] : null, commandGroups: formData.commandGroup ? [`/command-groups/${formData.commandGroup}`] : null,
dateTime: dateTime, dateTime: dateTime,
notes: formData.notes || '', notes: formData.notes || '',
clients: this.selectedClients.map((client: any) => client['@id']), clients: Array.from(this.selectedClientIds).map((uuid: string) => `/clients/${uuid}`),
}; };
if (selectedCommands) { if (selectedCommands) {
payload.commands = selectedCommands; payload.commands = selectedCommands;
} }
if (this.editing) { if (this.editing) {
const taskId = this.data.task.uuid; const taskId = this.data.task.uuid;