107 lines
5.0 KiB
HTML
107 lines
5.0 KiB
HTML
<h2 mat-dialog-title class="dialog-title">{{ editing ? ('editTask' | translate) : ('createTask' | translate) }}</h2>
|
|
|
|
<form [formGroup]="taskForm" class="task-form">
|
|
<mat-dialog-content>
|
|
|
|
<h3 class="section-title">Información</h3>
|
|
<mat-divider></mat-divider>
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>Información</mat-label>
|
|
<textarea matInput formControlName="notes" placeholder="Ingresa tus notas aquí"></textarea>
|
|
</mat-form-field>
|
|
|
|
<h3 class="section-title">{{ 'informationSectionTitle' | translate }}</h3>
|
|
<mat-divider></mat-divider>
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>{{ 'informationLabel' | translate }}</mat-label>
|
|
<textarea matInput formControlName="notes" placeholder="{{ 'notesPlaceholder' | translate }}"></textarea>
|
|
</mat-form-field>
|
|
|
|
<h3 class="section-title">{{ 'commandSelectionSectionTitle' | translate }}</h3>
|
|
<mat-divider></mat-divider>
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>{{ 'selectCommandsLabel' | translate }}</mat-label>
|
|
<mat-select formControlName="commandGroup" (selectionChange)="onCommandGroupChange()">
|
|
<mat-option *ngFor="let group of availableCommandGroups" [value]="group.uuid">
|
|
{{ group.name }}
|
|
</mat-option>
|
|
</mat-select>
|
|
<mat-error *ngIf="taskForm.get('commandGroup')?.invalid">{{ 'requiredFieldError' | translate }}</mat-error>
|
|
</mat-form-field>
|
|
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>{{ 'selectIndividualCommandsLabel' | translate }}</mat-label>
|
|
<mat-select formControlName="extraCommands" multiple>
|
|
<mat-option *ngFor="let command of availableIndividualCommands" [value]="command.uuid">
|
|
{{ command.name }}
|
|
</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
|
|
<h3 class="section-title">{{ 'executionDateTimeSectionTitle' | translate }}</h3>
|
|
<mat-divider></mat-divider>
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>{{ 'executionDateLabel' | translate }}</mat-label>
|
|
<input matInput [matDatepicker]="picker" formControlName="date" placeholder="{{ 'selectDatePlaceholder' | translate }}">
|
|
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
|
|
<mat-datepicker #picker></mat-datepicker>
|
|
<mat-error *ngIf="taskForm.get('date')?.invalid">{{ 'requiredFieldError' | translate }}</mat-error>
|
|
</mat-form-field>
|
|
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>{{ 'executionTimeLabel' | translate }}</mat-label>
|
|
<input matInput type="time" formControlName="time" placeholder="{{ 'selectTimePlaceholder' | translate }}">
|
|
<mat-error *ngIf="taskForm.get('time')?.invalid">{{ 'requiredFieldError' | translate }}</mat-error>
|
|
</mat-form-field>
|
|
|
|
<h3 class="section-title">{{ 'destinationSelectionSectionTitle' | translate }}</h3>
|
|
<mat-divider></mat-divider>
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>{{ 'selectOrganizationalUnitLabel' | translate }}</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">{{ 'requiredFieldError' | translate }}</mat-error>
|
|
</mat-form-field>
|
|
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>{{ 'selectClassroomLabel' | translate }}</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>{{ 'selectClientsLabel' | translate }}</mat-label>
|
|
<mat-select formControlName="selectedClients" multiple>
|
|
<mat-option (click)="toggleSelectAll()" [selected]="areAllSelected()">
|
|
{{ 'selectAllClients' | translate }}
|
|
</mat-option>
|
|
<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>
|
|
</mat-dialog-content>
|
|
</form>
|
|
|
|
<div class="button-container">
|
|
<button class="submit-button" (click)="saveTask()">{{ 'buttonSave' | translate }}</button>
|
|
</div>
|