68 lines
2.8 KiB
HTML
68 lines
2.8 KiB
HTML
<h2 mat-dialog-title>{{ softwareProfileId ? 'Editar' : 'Crear' }} perfil de software</h2>
|
|
|
|
<mat-dialog-content class="form-container">
|
|
<mat-tab-group>
|
|
<mat-tab label="Formulario">
|
|
<form [formGroup]="formGroup" (ngSubmit)="onSubmit()" class="form-group">
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>Descripción</mat-label>
|
|
<input matInput formControlName="description" placeholder="Descripción del comando" required>
|
|
</mat-form-field>
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>Comentarios</mat-label>
|
|
<input matInput formControlName="comments" placeholder="Comentarios del comando">
|
|
</mat-form-field>
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>Seleccionar unidad organizativa</mat-label>
|
|
<mat-select formControlName="organizationalUnit" required>
|
|
<mat-option *ngFor="let ou of organizationalUnits" [value]="ou['@id']">
|
|
{{ ou.name }}
|
|
</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<mat-label>Seleccionar sistema operativo</mat-label>
|
|
<mat-select formControlName="operativeSystem">
|
|
<mat-option *ngFor="let op of operativeSystems" [value]="op['@id']">
|
|
{{ op.name }}
|
|
</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
</form>
|
|
</mat-tab>
|
|
|
|
<mat-tab label="Seleccionar Software">
|
|
<div class="form-group">
|
|
<mat-form-field appearance="fill" class="full-width">
|
|
<input type="text" matInput [formControl]="softwareControl" [matAutocomplete]="clientAuto"
|
|
placeholder="Seleccione software para añadir">
|
|
|
|
<mat-autocomplete #clientAuto="matAutocomplete" [displayWith]="displayFnClient"
|
|
(optionSelected)="onOptionClientSelected($event.option.value)">
|
|
|
|
<mat-option *ngFor="let software of filteredSoftware | async" [value]="software">
|
|
{{ software.name }}
|
|
</mat-option>
|
|
</mat-autocomplete>
|
|
</mat-form-field>
|
|
|
|
<div class="software-list">
|
|
<mat-list>
|
|
<mat-list-item *ngFor="let software of softwareCollection">
|
|
{{ software.name }}
|
|
<button mat-icon-button (click)="removeSoftware(software)">
|
|
<mat-icon>delete</mat-icon>
|
|
</button>
|
|
</mat-list-item>
|
|
</mat-list>
|
|
</div>
|
|
</div>
|
|
</mat-tab>
|
|
</mat-tab-group>
|
|
</mat-dialog-content>
|
|
|
|
<mat-dialog-actions class="action-container">
|
|
<button class="ordinary-button" (click)="onCancel($event)">Cancelar</button>
|
|
<button class="submit-button" (click)="onSubmit()" cdkFocusInitial>Guardar</button>
|
|
</mat-dialog-actions>
|