127 lines
5.1 KiB
HTML
127 lines
5.1 KiB
HTML
<h2 mat-dialog-title class="dialog-title">
|
|
{{ editing ? ('editTask' | translate) : ('createTask' | translate) }}
|
|
</h2>
|
|
|
|
<mat-dialog-content class="dialog-content">
|
|
<mat-spinner class="loading-spinner" *ngIf="loading"></mat-spinner>
|
|
|
|
<div class="task-form" *ngIf="!loading">
|
|
<mat-button-toggle-group *ngIf="data?.source === 'assistant'" [(ngModel)]="taskMode" class="task-mode-selection" name="taskMode" appearance="standard">
|
|
<mat-button-toggle value="create">
|
|
<mat-icon>add_task</mat-icon>
|
|
Crear tarea
|
|
</mat-button-toggle>
|
|
<mat-button-toggle value="add">
|
|
<mat-icon>playlist_add</mat-icon>
|
|
Introducir en tarea existente
|
|
</mat-button-toggle>
|
|
</mat-button-toggle-group>
|
|
</div>
|
|
|
|
<div *ngIf="taskMode === 'add'" class="select-task">
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>Seleccione una tarea</mat-label>
|
|
<mat-select [(ngModel)]="selectedExistingTask" name="existingTask">
|
|
<mat-option *ngFor="let task of existingTasks" [value]="task">{{ task.name }}</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>Orden de ejecución</mat-label>
|
|
<input
|
|
matInput
|
|
type="number"
|
|
[(ngModel)]="executionOrder"
|
|
name="executionOrder"
|
|
min="1"
|
|
placeholder="Introduce el orden"
|
|
>
|
|
</mat-form-field>
|
|
</div>
|
|
|
|
<form *ngIf="taskMode === 'create' && taskForm && !loading" [formGroup]="taskForm" class="task-form">
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>{{ 'nameLabel' | translate }}</mat-label>
|
|
<input matInput formControlName="name" placeholder="{{ 'nameLabel' | translate }}">
|
|
<mat-error *ngIf="taskForm.get('name')?.invalid">{{ 'requiredFieldError' | translate }}</mat-error>
|
|
</mat-form-field>
|
|
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>{{ 'notesLabel' | translate }}</mat-label>
|
|
<textarea matInput formControlName="notes" placeholder="{{ 'notesPlaceholder' | translate }}"></textarea>
|
|
</mat-form-field>
|
|
|
|
<mat-checkbox *ngIf="!editing" formControlName="scheduleAfterCreate" class="schedule-checkbox">
|
|
¿Quieres programar la tarea al finalizar su creación?
|
|
</mat-checkbox>
|
|
|
|
<mat-divider style="margin: 15px 0;"></mat-divider>
|
|
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>Ámbito</mat-label>
|
|
<mat-select formControlName="scope" (selectionChange)="onScopeChange($event.value)"
|
|
[disabled]="data?.clients && data.clients.length >= 1">
|
|
<mat-option value="organizational-unit">Unidad Organizativa</mat-option>
|
|
<mat-option value="classrooms-group">Grupo de aulas</mat-option>
|
|
<mat-option value="classroom">Aulas</mat-option>
|
|
<mat-option value="clients-group">Grupos de clientes</mat-option>
|
|
<mat-option value="clients">Clientes</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
|
|
<mat-form-field *ngIf="taskForm.get('scope')?.value !== 'clients'" appearance="fill" class="full-width">
|
|
<mat-label>{{ 'organizationalUnitLabel' | translate }}</mat-label>
|
|
<mat-select formControlName="organizationalUnit">
|
|
<mat-option *ngFor="let unit of availableOrganizationalUnits" [value]="unit['@id']">
|
|
<div class="unit-name">{{ unit.name }}</div>
|
|
<div style="font-size: smaller; color: gray;">{{ unit.path }}</div>
|
|
</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
|
|
<div *ngIf="taskForm.get('scope')?.value === 'clients'" class="clients-selection">
|
|
<h4>Clientes seleccionados</h4>
|
|
|
|
<div *ngIf="data?.selectedClients && data.selectedClients.length > 0" class="pre-selected-info">
|
|
<mat-icon>info</mat-icon>
|
|
<span>Los clientes han sido pre-seleccionados desde el componente de despliegue de imágenes.</span>
|
|
</div>
|
|
|
|
<div class="clients-list">
|
|
<div class="clients-grid">
|
|
<mat-card
|
|
*ngFor="let client of clients"
|
|
class="client-card"
|
|
[class.pre-selected]="isClientPreSelected(client)"
|
|
>
|
|
<mat-card-content>
|
|
<div class="client-info">
|
|
<div class="client-name">{{ client.name || client.hostname }}</div>
|
|
<div class="client-details">
|
|
<span class="client-ip">{{ client.ip }}</span>
|
|
<span class="client-status" [class]="'status-' + client.status">
|
|
{{ client.status }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<mat-icon class="selected-icon">
|
|
check_circle
|
|
</mat-icon>
|
|
</mat-card-content>
|
|
</mat-card>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</mat-dialog-content>
|
|
|
|
<mat-dialog-actions class="action-container">
|
|
<button class="ordinary-button" (click)="close()">{{ 'buttonCancel' | translate }}</button>
|
|
<button
|
|
class="submit-button"
|
|
(click)="taskMode === 'create' ? saveTask() : addToExistingTask()"
|
|
>
|
|
{{ 'buttonSave' | translate }}
|
|
</button>
|
|
</mat-dialog-actions>
|