Personal Info UI
This commit is contained in:
saravanakumarkandasami
parent
84668c77e5
commit
723a7f6a41
@ -1,120 +1,124 @@
|
||||
<form *ngIf="loadDataStatus" [formGroup]="_personalForm" (submit)="submitPersonalForm(_personalForm.value)">
|
||||
|
||||
<!-- start main applicant details -->
|
||||
|
||||
<mat-card-content>
|
||||
<!-- start main applicant details -->
|
||||
|
||||
<div fxLayout="row wrap">
|
||||
|
||||
<div fxFlex="50" class="text-xs-left">
|
||||
|
||||
<mat-card>
|
||||
<mat-card-title>Main Applicant</mat-card-title>
|
||||
<mat-card-content>
|
||||
<div [formArrayName]="'mainItem'" *ngFor="let mainDetails of pdMainapplicant.controls; let i = index;">
|
||||
<div [formGroup]="mainDetails">
|
||||
|
||||
<mat-form-field style="width: 100%">
|
||||
<input matInput placeholder="Name" formControlName="name_ans" type="text" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
|
||||
<input matInput placeholder="Age" formControlName="age_ans" type="text" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
|
||||
<input matInput placeholder="Entity" formControlName="entity_ans" type="text" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
|
||||
<mat-select placeholder="Educational Qualification" formControlName="qualification_ans" required>
|
||||
<mat-option *ngFor="let education of qualifications" [value]="education" >
|
||||
{{education}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
<mat-select placeholder="Earning Status" formControlName="earning_ans" required>
|
||||
<mat-option *ngFor="let earning of earningStatus" [value]="earning" >
|
||||
{{earning}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<!-- end main applicant details -->
|
||||
|
||||
<!-- start co applicant form details -->
|
||||
<div fxFlex="50" class="text-xs-left" [formArrayName]="'coItem'" *ngFor="let coDetails of pdCoapplicant.controls; let i = index;">
|
||||
|
||||
<mat-card>
|
||||
<mat-card-title>Co Applicant</mat-card-title>
|
||||
<mat-card-content>
|
||||
<div >
|
||||
<div [formGroup]="coDetails">
|
||||
<mat-form-field style="width: 100%">
|
||||
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> -->
|
||||
<input matInput placeholder="Name" formControlName="name_ans" type="text" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> -->
|
||||
|
||||
<input matInput placeholder="Age" formControlName="age_ans" type="text" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> -->
|
||||
|
||||
<input matInput placeholder="Entity" formControlName="entity_ans" type="text" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> -->
|
||||
|
||||
<mat-select placeholder="Educational Qualification" formControlName="qualification_ans" required>
|
||||
<mat-option *ngFor="let education of qualifications" [value]="education" >
|
||||
{{education}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> -->
|
||||
<mat-select placeholder="Earning Status" formControlName="earning_ans" required>
|
||||
<mat-option *ngFor="let earning of earningStatus" [value]="earning" >
|
||||
{{earning}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
<div fxFlex="50" class="text-xs-left">
|
||||
|
||||
<mat-card>
|
||||
<mat-card-title>Main Applicant</mat-card-title>
|
||||
<mat-card-content>
|
||||
<div [formArrayName]="'mainItem'" *ngFor="let mainDetails of pdMainapplicant.controls; let i = index;">
|
||||
<div [formGroup]="mainDetails">
|
||||
|
||||
<mat-form-field style="width: 100%">
|
||||
<input matInput placeholder="Name" formControlName="name_ans" type="text" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> -->
|
||||
<mat-select placeholder="Relationship" formControlName="relation_ans" required>
|
||||
<mat-option *ngFor="let rel of relationShipList" [value]="rel.relationship_id" >
|
||||
{{rel.name}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</mat-card-content>
|
||||
|
||||
</mat-card>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- end co applicant form details -->
|
||||
<mat-card-actions align="end">
|
||||
<input matInput placeholder="Age" formControlName="age_ans" type="text" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
|
||||
<input matInput placeholder="Entity" formControlName="entity_ans" type="text" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
|
||||
<mat-select placeholder="Educational Qualification" formControlName="qualification_ans" required>
|
||||
<mat-option *ngFor="let education of qualifications" [value]="education" >
|
||||
{{education}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
<mat-select placeholder="Earning Status" formControlName="earning_ans" required>
|
||||
<mat-option *ngFor="let earning of earningStatus" [value]="earning" >
|
||||
{{earning}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<!-- end main applicant details -->
|
||||
|
||||
<!-- start co applicant form details -->
|
||||
<div fxFlex="50" class="text-xs-left" [formArrayName]="'coItem'" *ngFor="let coDetails of pdCoapplicant.controls; let i = index;">
|
||||
|
||||
<mat-card>
|
||||
<mat-card-title>Co Applicant</mat-card-title>
|
||||
<mat-card-content>
|
||||
<div >
|
||||
<div [formGroup]="coDetails">
|
||||
<mat-form-field style="width: 100%">
|
||||
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> -->
|
||||
<input matInput placeholder="Name" formControlName="name_ans" type="text" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> -->
|
||||
|
||||
<input matInput placeholder="Age" formControlName="age_ans" type="text" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> -->
|
||||
|
||||
<input matInput placeholder="Entity" formControlName="entity_ans" type="text" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> -->
|
||||
|
||||
<mat-select placeholder="Educational Qualification" formControlName="qualification_ans" required>
|
||||
<mat-option *ngFor="let education of qualifications" [value]="education" >
|
||||
{{education}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> -->
|
||||
<mat-select placeholder="Earning Status" formControlName="earning_ans" required>
|
||||
<mat-option *ngFor="let earning of earningStatus" [value]="earning" >
|
||||
{{earning}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field style="width: 100%">
|
||||
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> -->
|
||||
<mat-select placeholder="Relationship" formControlName="relation_ans" required>
|
||||
<mat-option *ngFor="let rel of relationShipList" [value]="rel.relationship_id" >
|
||||
{{rel.name}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</mat-card-content>
|
||||
|
||||
</mat-card>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- end co applicant form details -->
|
||||
</mat-card-content>
|
||||
|
||||
<mat-card-actions>
|
||||
<div fxFlexOffset="90" fxFlex="10" style="text-align:left;">
|
||||
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="submit" matTooltip="Save" matTooltipPosition="above" [disabled]="!_personalForm.valid "><mat-icon>save</mat-icon></button>
|
||||
|
||||
</div>
|
||||
</mat-card-actions>
|
||||
|
||||
</form>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user