<h3>{{ action.name }}</h3>
<div [formGroup]="formGroup" class='container' fxLayout='row' fxLayoutGap='1em'>
    <div fxFlex="4 1 0" fxLayout='column' class='fields' *ngIf='action.formFields.length>0'>
        <ng-container *ngFor="let field of action.formFields">
            <mat-form-field *ngIf="field.type == 'string'" fxFlex>
                <mat-label [innerHTML]='field.name'></mat-label>
                <input matInput
                    [formControlName]="field.name"
                    required>
            </mat-form-field>
            <mat-form-field *ngIf="field.type == 'number'" fxFlex>
                <mat-label [innerHTML]='field.name'></mat-label>
                <input matInput
                    [formControlName]="field.name"
                    required
                    type="number">
            </mat-form-field>
            <mat-form-field *ngIf="field.type == 'date'" fxFlex>
                <mat-label [innerHTML]='field.name'></mat-label>
                <input matInput
                    [formControlName]="field.name"
                    [matDatepicker]="picker"
                    required>
                <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
                <mat-datepicker #picker></mat-datepicker>
            </mat-form-field>
            <mat-form-field *ngIf="field.type == 'time'" fxFlex>
                <mat-label [innerHTML]='field.name'></mat-label>
                <input matInput
                    [formControlName]="field.name"
                    type="time"
                    required>
            </mat-form-field>
            <mat-checkbox *ngIf="field.type == 'checkbox'" matInput fxFlex
                [formControlName]="field.name">
                {{ field.name }}
            </mat-checkbox>
        </ng-container>
    </div>
    <button mat-raised-button fxFlex='1 1 0' class='button'
        (click)="execute()"
        [disabled]='!formGroup.valid'
        color='secondary'>
        <mat-icon>{{ action.icon }}</mat-icon>
        Execute
    </button>
</div>