57 lines
2.1 KiB
HTML
57 lines
2.1 KiB
HTML
<form [formGroup]="sharesAccountDetailsForm">
|
|
<div class="layout-row-wrap gap-2px responsive-column">
|
|
<mat-form-field class="flex-48">
|
|
<mat-label>{{ 'labels.inputs.Product Name' | translate }}</mat-label>
|
|
<mat-select formControlName="productId" required>
|
|
<mat-option *ngFor="let product of productData" [value]="product.id">
|
|
{{ product.name }}
|
|
</mat-option>
|
|
</mat-select>
|
|
<mat-error>
|
|
{{ 'labels.inputs.Product Name' | translate }} {{ 'labels.commons.is' | translate }}
|
|
<strong>{{ 'labels.commons.required' | translate }}</strong>
|
|
</mat-error>
|
|
</mat-form-field>
|
|
|
|
<mat-form-field class="flex-48" (click)="submittedOnDatePicker.open()">
|
|
<mat-label>{{ 'labels.inputs.Submitted On' | translate }}</mat-label>
|
|
<input
|
|
matInput
|
|
[min]="minDate"
|
|
[max]="maxDate"
|
|
[matDatepicker]="submittedOnDatePicker"
|
|
formControlName="submittedDate"
|
|
required
|
|
/>
|
|
<mat-datepicker-toggle matSuffix [for]="submittedOnDatePicker"></mat-datepicker-toggle>
|
|
<mat-datepicker #submittedOnDatePicker></mat-datepicker>
|
|
<mat-error>
|
|
{{ 'labels.inputs.Submission Date' | translate }} {{ 'labels.commons.is' | translate }}
|
|
<strong>{{ 'labels.commons.required' | translate }}</strong>
|
|
</mat-error>
|
|
</mat-form-field>
|
|
|
|
<mat-form-field class="flex-48">
|
|
<mat-label>{{ 'labels.inputs.External ID' | translate }}</mat-label>
|
|
<input matInput formControlName="externalId" />
|
|
</mat-form-field>
|
|
</div>
|
|
|
|
<div class="layout-row align-center gap-2percent margin-t responsive-column">
|
|
<button mat-raised-button matStepperPrevious disabled>
|
|
<fa-icon icon="arrow-left" class="m-r-10"></fa-icon>
|
|
{{ 'labels.buttons.Previous' | translate }}
|
|
</button>
|
|
<button
|
|
mat-raised-button
|
|
matStepperNext
|
|
[disabled]="
|
|
!(sharesAccountDetailsForm.get('productId')?.value && sharesAccountDetailsForm.get('submittedDate')?.value)
|
|
"
|
|
>
|
|
{{ 'labels.buttons.Next' | translate }}
|
|
<fa-icon icon="arrow-right" class="m-l-10"></fa-icon>
|
|
</button>
|
|
</div>
|
|
</form>
|