Files
cbsnexora/src/app/deposits/recurring-deposits/recurring-deposits-account-stepper/recurring-deposits-account-details-step/recurring-deposits-account-details-step.component.html
T

56 lines
2.4 KiB
HTML

<form [formGroup]="recurringDepositAccountDetailsForm">
<div fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column">
<mat-form-field fxFlex="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 fxFlex="48%" (click)="submittedOnDatePicker.open()" *ngIf="isProductSelected">
<mat-label>{{"labels.inputs.Submitted On" | translate }}</mat-label>
<input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="submittedOnDatePicker"
formControlName="submittedOnDate" 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 fxFlex="48%" *ngIf="isProductSelected">
<mat-label>{{"labels.inputs.Field Officer" | translate }}</mat-label>
<mat-select formControlName="fieldOfficerId">
<mat-option *ngFor="let officer of fieldOfficerData" [value]="officer.id">
{{ officer.displayName }}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field fxFlex="48%" *ngIf="isProductSelected">
<mat-label>{{"labels.inputs.External id" | translate}}</mat-label>
<input matInput formControlName="externalId" matTooltip="{{ 'tooltips.Provides an external id' | translate}}">
</mat-form-field>
</div>
<div fxLayout="row" class="margin-t" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="2%">
<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>
{{"labels.buttons.Next" | translate }}
<fa-icon icon="arrow-right" class="m-l-10"></fa-icon>
</button>
</div>
</form>