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

View File

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

View File

@ -20,6 +20,7 @@ export class CreateTaskComponent implements OnInit {
availableOrganizationalUnits: any[] = [];
selectedUnitChildren: any[] = [];
selectedClients: any[] = [];
selectedClientIds: Set<string> = new Set();
constructor(
private fb: FormBuilder,
@ -124,6 +125,7 @@ export class CreateTaskComponent implements OnInit {
(data) => {
this.selectedClients = data.clients;
this.taskForm.patchValue({ selectedClients: [] });
this.selectedClientIds.clear();
},
(error) => {
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 {
if (this.taskForm.invalid) {
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}`)
: null;
const payload: any = {
commandGroups: formData.commandGroup ? [`/command-groups/${formData.commandGroup}`] : null,
dateTime: dateTime,
notes: formData.notes || '',
clients: this.selectedClients.map((client: any) => client['@id']),
};
const payload: any = {
commandGroups: formData.commandGroup ? [`/command-groups/${formData.commandGroup}`] : null,
dateTime: dateTime,
notes: formData.notes || '',
clients: Array.from(this.selectedClientIds).map((uuid: string) => `/clients/${uuid}`),
};
if (selectedCommands) {
payload.commands = selectedCommands;
}
if (selectedCommands) {
payload.commands = selectedCommands;
}
if (this.editing) {
const taskId = this.data.task.uuid;