instances-query.component.html

<p-dialog [(visible)]="showSaveProcedureInstanceQueryModal" (onHide)="hideSaveProcedureInstanceQueryModal()"
    (onShow)="prePopulateFields()" [modal]="true" [style]="{width: '60vw'}" [baseZIndex]="10000" [draggable]="false"
    [resizable]="false">
    <ng-template pTemplate="header">
        <div class="p-d-flex p-flex-column p-flex-md-row p-jc-md-between table-header" style="font-size: 1.5rem">
            {{ getProcedureInstanceQueryModalHeaderLabel() }}
        </div>
    </ng-template>
    <ng-template pTemplate="body">
        <form [formGroup]='newProcedureInstanceQueryForm'>
            <span class="p-float-label">
                <input id="float-input-name" type="text" pInputText formControlName="name">
                <label for="float-input-name">{{ 'Name *' | translate }}</label>
            </span>
            <small *ngIf="!newProcedureInstanceQueryForm.get('name').valid" class="p-invalid">
                {{ 'Name field is required' | translate }}
            </small>
            <span class="p-float-label">
                <input id="float-input-description" type="textarea" pInputText formControlName="description">
                <label for="float-input-description">{{ 'Description' | translate }}</label>
            </span>
        </form>
    </ng-template>
    <ng-template pTemplate="footer">
        <p-button [disabled]="!newProcedureInstanceQueryForm.get('name').valid" icon="pi pi-check"
            (onClick)="addProcedureInstanceQuery()" styleClass="p-button-text"
            [label]="getProcedureInstanceQueryModalSubmissionLabel()"></p-button>
    </ng-template>
</p-dialog>