Forms UI
This commit is contained in:
saravanakumarkandasami
parent
2c15ad0cb5
commit
dbd7bb71f3
@ -1,4 +1,6 @@
|
||||
<p>Address</p>
|
||||
<mat-card style="min-height: 550px;">
|
||||
<mat-card-content>
|
||||
<p>Address Details</p>
|
||||
<form class="address" [formGroup]="addressForm">
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Address" formControlName="address">
|
||||
@ -16,7 +18,7 @@
|
||||
<mat-option value="Other">Other (PD officer to fill)</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Locality" formControlName="locality">
|
||||
<mat-option value="CommercialOffice">Commercial (Office type) Area
|
||||
@ -57,7 +59,7 @@
|
||||
</mat-form-field>
|
||||
<mat-card>
|
||||
<mat-card-header>
|
||||
<p>Neighbour hood
|
||||
<p>Neighbourhood
|
||||
<p>
|
||||
</mat-card-header>
|
||||
<div formArrayName="neighbourhood">
|
||||
@ -86,22 +88,29 @@
|
||||
<mat-option value="dont_know">Dont Know</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<button type="button" mat-raised-button mat-icon-button *ngIf="i==0"
|
||||
<button type="button" matTooltip="Add More Neighbour Details" matTooltipPosition="above" mat-raised-button mat-icon-button *ngIf="i==0"
|
||||
(click)="addNeighbour($event)"
|
||||
style="float: right;">
|
||||
<mat-icon>add</mat-icon>
|
||||
</button>
|
||||
<button type="button" mat-raised-button mat-icon-button *ngIf="i>0"
|
||||
(click)="removeNeighbour(i)"
|
||||
<button type="button" matTooltip="Delete" matTooltipPosition="above" mat-raised-button mat-icon-button *ngIf="i>0"
|
||||
(click)="removeNeighbour(i)"
|
||||
style="float: right;">
|
||||
<mat-icon>close</mat-icon>
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
|
||||
|
||||
</mat-card-content>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</mat-card>
|
||||
<button mat-raised-button type="submit" class="button" (click)="onSubmit()">Submit
|
||||
</button>
|
||||
<div style="text-align: right;">
|
||||
<button mat-raised-button mat-icon-button type="submit" matTooltip="Submit" matTooltipPosition="above" (click)="onSubmit()"><mat-icon>save</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
<notifier-container></notifier-container>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
|
||||
@ -1,235 +1,252 @@
|
||||
<!--<pre> {{ m_group | json}}</pre>-->
|
||||
<mat-card style="padding: 12px;">
|
||||
<form *ngIf="apiLoadFinish && loadDetails" [formGroup]="_assetsQuesFrom" (submit)="onSubmit()" novalidate>
|
||||
<div fxLayout="row" fxLayoutAlign="start none">
|
||||
<div formArrayName="assets_details" fxFill>
|
||||
<div *ngFor="let sup of _assetsQuesFrom.controls.assets_details['controls']; let i=index">
|
||||
<mat-card>
|
||||
<div [formGroupName]="i">
|
||||
<div fxLayout="row wrap" fxLayoutGap="12px" fxLayoutAlign="start none">
|
||||
<div>
|
||||
<mat-form-field>
|
||||
<mat-select (selectionChange)="selectedAssetsType($event, i)" placeholder="Select Assets Type" formControlName="assets_mode">
|
||||
<mat-option *ngFor="let asset of m_assets_type" [value]="asset.id">{{ asset.name }}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<!--Desction Dynamic details: START-->
|
||||
<div formArrayName="details" class="example-full-width">
|
||||
<!--Property-->
|
||||
<div *ngIf="sup.get('assets_mode').value == 1 ">
|
||||
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Select Property" formControlName="property_type">
|
||||
<mat-option *ngFor="let prop of m_propertyType" [value]="prop.id">{{ prop.name }}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--Four Wheeler-->
|
||||
<div *ngIf="sup.get('assets_mode').value == 2">
|
||||
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div>
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Manufacturer, Model" formControlName="manufacturer_model">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--Two Wheeler-->
|
||||
<div *ngIf="sup.get('assets_mode').value == 3">
|
||||
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div>
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Manufacturer, Model" formControlName="manufacturer_model">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--jwell details-->
|
||||
<div *ngIf="sup.get('assets_mode').value == 4">
|
||||
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div>
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Description" formControlName="jwell_description">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--Consumer Durable-->
|
||||
<div *ngIf="sup.get('assets_mode').value == 5">
|
||||
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div>
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Description" formControlName="consumer_durable_description">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--Insurance-->
|
||||
<div *ngIf="sup.get('assets_mode').value == 6">
|
||||
<div fxFill>
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div fxFlex="33">
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Type" formControlName="insurance_type">
|
||||
<mat-option *ngFor="let ins_type of m_insuranceType" [value]="ins_type.id">{{ ins_type.name }}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Premium Paid" formControlName="premium_paid">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div fxFlex="33">
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Frequency" formControlName="frequency_mode">
|
||||
<mat-option *ngFor="let freqn of m_freqOfPurchase" [value]="freqn.id">{{ freqn.name }}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Sum Assured" formControlName="sum_assured">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Members Covered" formControlName="members_coverd">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--Investments-->
|
||||
<div *ngIf="sup.get('assets_mode').value == 7">
|
||||
<div>
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div fxFlex="33">
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Type" formControlName="investments_type">
|
||||
<mat-option *ngFor="let ins_type of m_investmentType" [value]="ins_type.id">{{ ins_type.name }}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Amount of Investment" formControlName="amount_of_invest">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Bank Name" formControlName="bank_name">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--other assets-->
|
||||
<div *ngIf="sup.get('assets_mode').value == 8">
|
||||
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div>
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Description of the Assets" formControlName="any_other_assets">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--Desction Dynamic details : END -->
|
||||
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Approximate Market Value" formControlName="approximate_market_value">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Name of the Owner" formControlName="name_of_the_owner">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Year of Purchase and Approximate month" formControlName="year_of_purchase">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div fxFlex="33">
|
||||
<mat-checkbox formControlName="emi" [ngModel]="sup.get('emi').value === '1' ? true : false"
|
||||
(ngModelChange)="sup.get('emi').value = $event ? '1' : '0'">EMI</mat-checkbox>
|
||||
</div>
|
||||
<div *ngIf="sup.get('emi').value === '1'" fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="EMI Paid" formControlName="emi_paid">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div *ngIf="sup.get('emi').value === '1'" fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Elapsed Tenure" formControlName="elapsed_tenure">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div *ngIf="sup.get('emi').value === '1'" fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Balance Tenure" formControlName="balance_tenure">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div fxLayout="row" fxLayoutGap="12px" fxLayoutAlign="start none">
|
||||
<div fxFlex="20">
|
||||
<span *ngIf="_assetsQuesFrom.controls.assets_details.controls.length > 1" (click)="removeLanguage(i)">
|
||||
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
|
||||
</span>
|
||||
</div>
|
||||
<mat-card style="min-height: 550px;" >
|
||||
<mat-card-content>
|
||||
<p>Assets Details</p>
|
||||
<form *ngIf="apiLoadFinish && loadDetails" [formGroup]="_assetsQuesFrom" (submit)="onSubmit()" novalidate>
|
||||
<div fxLayout="row" fxLayoutAlign="start none">
|
||||
<div formArrayName="assets_details" fxFill>
|
||||
<div *ngFor="let sup of _assetsQuesFrom.controls.assets_details['controls']; let i=index">
|
||||
<mat-card>
|
||||
<mat-card-content>
|
||||
<div [formGroupName]="i">
|
||||
<div fxLayout="row wrap" fxLayoutGap="5px" fxLayoutAlign="start none">
|
||||
<div>
|
||||
<mat-form-field>
|
||||
<mat-select (selectionChange)="selectedAssetsType($event, i)" placeholder="Assets Type" formControlName="assets_mode">
|
||||
<mat-option *ngFor="let asset of m_assets_type" [value]="asset.id">{{ asset.name }}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<!--Desction Dynamic details: START-->
|
||||
<div formArrayName="details" class="example-full-width">
|
||||
<!--Property-->
|
||||
<div *ngIf="sup.get('assets_mode').value == 1 ">
|
||||
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Select Property" formControlName="property_type">
|
||||
<mat-option *ngFor="let prop of m_propertyType" [value]="prop.id">{{ prop.name }}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--Four Wheeler-->
|
||||
<div *ngIf="sup.get('assets_mode').value == 2">
|
||||
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div>
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Manufacturer, Model" formControlName="manufacturer_model">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--Two Wheeler-->
|
||||
<div *ngIf="sup.get('assets_mode').value == 3">
|
||||
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div>
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Manufacturer, Model" formControlName="manufacturer_model">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--jwell details
|
||||
<div *ngIf="sup.get('assets_mode').value == 4">
|
||||
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div>
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Description" formControlName="jwell_description">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>-->
|
||||
<!--Consumer Durable-->
|
||||
<div *ngIf="sup.get('assets_mode').value == 5">
|
||||
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div>
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Description" formControlName="consumer_durable_description">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--Insurance-->
|
||||
<div *ngIf="sup.get('assets_mode').value == 6">
|
||||
<div fxFill>
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div fxFlex="33">
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Type" formControlName="insurance_type">
|
||||
<mat-option *ngFor="let ins_type of m_insuranceType" [value]="ins_type.id">{{ ins_type.name }}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Premium Paid" formControlName="premium_paid">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div fxFlex="33">
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Frequency" formControlName="frequency_mode">
|
||||
<mat-option *ngFor="let freqn of m_freqOfPurchase" [value]="freqn.id">{{ freqn.name }}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Sum Assured" formControlName="sum_assured">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Members Covered" formControlName="members_coverd">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--Investments-->
|
||||
<div *ngIf="sup.get('assets_mode').value == 7">
|
||||
<div>
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div fxFlex="33">
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Type" formControlName="investments_type">
|
||||
<mat-option *ngFor="let ins_type of m_investmentType" [value]="ins_type.id">{{ ins_type.name }}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Amount of Investment" formControlName="amount_of_invest">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Bank Name" formControlName="bank_name">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--other assets-->
|
||||
<div *ngIf="sup.get('assets_mode').value == 8">
|
||||
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
|
||||
<div [formGroupName]="s">
|
||||
<div>
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Description of the Assets" formControlName="any_other_assets">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--Desction Dynamic details : END -->
|
||||
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div *ngIf="sup.get('assets_mode').value == 1 || sup.get('assets_mode').value == 4">
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Approximate Market Value" formControlName="approximate_market_value">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="sup.get('assets_mode').value == 1 || sup.get('assets_mode').value == 2 || sup.get('assets_mode').value == 3 || sup.get('assets_mode').value == 4 || sup.get('assets_mode').value == 5">
|
||||
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Name of the Owner" formControlName="name_of_the_owner">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="sup.get('assets_mode').value == 1 || sup.get('assets_mode').value == 2 || sup.get('assets_mode').value == 3 || sup.get('assets_mode').value == 5">
|
||||
<div fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Year and month of purchase" formControlName="year_of_purchase">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="sup.get('assets_mode').value == 1 || sup.get('assets_mode').value == 2 || sup.get('assets_mode').value == 3 || sup.get('assets_mode').value == 4 || sup.get('assets_mode').value == 5">
|
||||
|
||||
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
|
||||
<div fxFlex="33">
|
||||
<mat-checkbox formControlName="emi" [ngModel]="sup.get('emi').value === '1' ? true : false"
|
||||
(ngModelChange)="sup.get('emi').value = $event ? '1' : '0'">Is there a loan?</mat-checkbox>
|
||||
</div>
|
||||
<div *ngIf="sup.get('emi').value === '1'" fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="EMI Paid" formControlName="emi_paid">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div *ngIf="sup.get('emi').value === '1'" fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Elapsed Tenure in months" formControlName="elapsed_tenure">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div *ngIf="sup.get('emi').value === '1'" fxFlex="33">
|
||||
<mat-form-field class="ml-xs example-full-width">
|
||||
<input matInput placeholder="Balance Tenure in months" formControlName="balance_tenure">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div fxLayout="row" fxLayoutGap="12px" fxLayoutAlign="start none">
|
||||
<div fxFlex="20">
|
||||
<span *ngIf="_assetsQuesFrom.controls.assets_details.controls.length > 1" (click)="removeLanguage(i)">
|
||||
|
||||
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</div>
|
||||
<button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Answer" matTooltipPosition="above"
|
||||
class="mr-1 mb-1 hover-icon" (click)="addSupplierDetails($event); false"><mat-icon>add</mat-icon></button>
|
||||
</div>
|
||||
</mat-card>
|
||||
</div>
|
||||
<button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Answer" matTooltipPosition="above"
|
||||
class="mr-1 mb-1 hover-icon" (click)="addSupplierDetails($event); false"><mat-icon>add</mat-icon></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" style="text-align:right;">
|
||||
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Reset" matTooltipPosition="above" (click)="onReset(); false"><mat-icon>settings_backup_restore</mat-icon></button>
|
||||
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Save" matTooltipPosition="above" type="submit"><mat-icon>save</mat-icon></button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="row" style="text-align:right;">
|
||||
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Reset" matTooltipPosition="above" (click)="onReset(); false"><mat-icon>settings_backup_restore</mat-icon></button>
|
||||
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Save" matTooltipPosition="above" type="submit"><mat-icon>save</mat-icon></button>
|
||||
</div>
|
||||
</form>
|
||||
</mat-card-content>
|
||||
|
||||
</mat-card>
|
||||
@ -1,66 +1,76 @@
|
||||
<form [formGroup]="bankingForm" class="bankForm">
|
||||
<div formArrayName="itemRows">
|
||||
<mat-accordion
|
||||
*ngFor="let itemrow of bankingForm.controls.itemRows['controls']; let i=index"
|
||||
[formGroupName]="i">
|
||||
<mat-expansion-panel class="banlFields" [expanded]="step == i">
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
<h4>{{i+1}} Banking details<span *ngIf="i==0" style="float: right;">
|
||||
<mat-icon (click)="addBankdetails(i)">add</mat-icon>
|
||||
</span>
|
||||
<span *ngIf="i > 0">
|
||||
<mat-icon (click)="deleteBankdetails(i)">delete</mat-icon>
|
||||
</span></h4>
|
||||
</mat-panel-title>
|
||||
</mat-expansion-panel-header>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Applicant Name"
|
||||
formControlName="applicant_name">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Bank Name" formControlName="bank_name">
|
||||
</mat-form-field>
|
||||
<mat-card style="min-height: 550px;">
|
||||
<mat-card-content>
|
||||
<p>Banking Information</p>
|
||||
<form [formGroup]="bankingForm" class="bankForm">
|
||||
<div formArrayName="itemRows">
|
||||
<mat-accordion
|
||||
*ngFor="let itemrow of bankingForm.controls.itemRows['controls']; let i=index"
|
||||
[formGroupName]="i">
|
||||
<mat-expansion-panel class="banlFields" [expanded]="step == i">
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
<p>{{i+1}} , Banking Details
|
||||
</p>
|
||||
</mat-panel-title>
|
||||
</mat-expansion-panel-header>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Applicant Name"
|
||||
formControlName="applicant_name">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Bank Name" formControlName="bank_name">
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Account Type"
|
||||
formControlName="account_type">
|
||||
<mat-option value="Savings">Savings</mat-option>
|
||||
<mat-option value="Current">Current</mat-option>
|
||||
<mat-option value="OD">OD</mat-option>
|
||||
<mat-option value="CC">CC</mat-option>
|
||||
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Salary Credited in this account"
|
||||
formControlName="salary">
|
||||
<mat-option value="Yes">Yes</mat-option>
|
||||
<mat-option value="No">No</mat-option>
|
||||
<mat-option value="NA">NA</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Limit in case of OD / CC account"
|
||||
formControlName="limit">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Is this the main business account"
|
||||
formControlName="is_main">
|
||||
<mat-option value="Yes">Yes</mat-option>
|
||||
<mat-option value="No">No</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Approximate Vintage"
|
||||
formControlName="vintage">
|
||||
</mat-form-field>
|
||||
<button *ngIf="i > 0" mat-raised-button mat-icon-button matTooltip="Delete" matTooltipPosition="above" (click)="deleteBankdetails(i)">
|
||||
<mat-icon >delete</mat-icon>
|
||||
</button>
|
||||
</mat-expansion-panel>
|
||||
|
||||
</mat-accordion>
|
||||
</div>
|
||||
<div style="text-align: right;" class="pt-1">
|
||||
<button class="mr-1 mb-1" color="primary" mat-raised-button mat-icon-button matTooltip="Add More Bank Details" matTooltipPosition="above" (click)="addBankdetails(i)">
|
||||
<mat-icon >add</mat-icon>
|
||||
</button>
|
||||
<button class="mr-1 mb-1" type="submit" mat-raised-button mat-icon-button type="submit" matTooltip="Submit" matTooltipPosition="above" (click)="bankSubmit()"><mat-icon>save</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
<notifier-container></notifier-container>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Account Type"
|
||||
formControlName="account_type">
|
||||
<mat-option value="Savings">Savings</mat-option>
|
||||
<mat-option value="Current">Current</mat-option>
|
||||
<mat-option value="OD">OD</mat-option>
|
||||
<mat-option value="CC">CC</mat-option>
|
||||
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Salary Credited in this account"
|
||||
formControlName="salary">
|
||||
<mat-option value="Yes">Yes</mat-option>
|
||||
<mat-option value="No">No</mat-option>
|
||||
<mat-option value="NA">NA</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Limit in case of OD / CC account"
|
||||
formControlName="limit">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Is this the main business account"
|
||||
formControlName="is_main">
|
||||
<mat-option value="Yes">Yes</mat-option>
|
||||
<mat-option value="No">No</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Approximate Vintage"
|
||||
formControlName="vintage">
|
||||
</mat-form-field>
|
||||
</mat-expansion-panel>
|
||||
|
||||
</mat-accordion>
|
||||
</div>
|
||||
<button mat-raised-button class="button" (click)="bankSubmit()">Submit
|
||||
</button>
|
||||
</form>
|
||||
<notifier-container></notifier-container>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
.banlFields mat-form-field {
|
||||
width: 100%;
|
||||
//width: 100%;
|
||||
margin: 0 2%;
|
||||
}
|
||||
.bankForm .button {
|
||||
|
||||
@ -1,49 +1,58 @@
|
||||
<p>Current Loan Details</p>
|
||||
<form [formGroup]="currentLoanForm" class="address">
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Do you have any other existing Loan"
|
||||
formControlName="existing_loan">
|
||||
<mat-option value="Yes">Yes</mat-option>
|
||||
<mat-option value="No">No</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-card *ngIf="currentLoanForm.controls.existing_loan.value == 'Yes'">
|
||||
<mat-card-header>
|
||||
<p>Loan Details<p>
|
||||
</mat-card-header>
|
||||
<div formArrayName="loan_details">
|
||||
<div *ngFor="let details of currentLoanForm.get('loan_details').controls; let i=index"
|
||||
[formGroupName]="i">
|
||||
<mat-card-content class="matcard">
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Loan Amount" formControlName="loan_amount">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="EMI" formControlName="emi">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Loan Type" formControlName="loan_type">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Lender" formControlName="lender">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Original Tenure" formControlName="original_tenure">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Current Balance Tenure" formControlName="current_balance_tenure">
|
||||
</mat-form-field>
|
||||
<button type="button" mat-raised-button mat-icon-button (click)="addLoanDetails()"
|
||||
*ngIf="i==0">
|
||||
<mat-icon>add</mat-icon>
|
||||
</button>
|
||||
<button type="button" mat-raised-button mat-icon-button (click)="deleteLoanDetails(i)"
|
||||
*ngIf="i>0">
|
||||
<mat-icon>close</mat-icon>
|
||||
</button>
|
||||
</mat-card-content>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card>
|
||||
<button mat-raised-button type="submit" class="button" (click)="submitCurrentloan()"></button>
|
||||
</form>
|
||||
<mat-card style="min-height: 550px;">
|
||||
<mat-card-content>
|
||||
<p>Current Loan Details</p>
|
||||
<form [formGroup]="currentLoanForm" class="address">
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Do you have any other existing loan"
|
||||
formControlName="existing_loan">
|
||||
<mat-option value="Yes">Yes</mat-option>
|
||||
<mat-option value="No">No</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-card *ngIf="currentLoanForm.controls.existing_loan.value == 'Yes'">
|
||||
<mat-card-header>
|
||||
<p>Loan Details<p>
|
||||
</mat-card-header>
|
||||
<div formArrayName="loan_details">
|
||||
<div *ngFor="let details of currentLoanForm.get('loan_details').controls; let i=index"
|
||||
[formGroupName]="i">
|
||||
<mat-card-content class="matcard">
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Loan Amount" formControlName="loan_amount">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="EMI" formControlName="emi">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Loan Type" formControlName="loan_type">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Lender" formControlName="lender">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Original Tenure" formControlName="original_tenure">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Current Balance Tenure" formControlName="current_balance_tenure">
|
||||
</mat-form-field>
|
||||
<button type="button" mat-raised-button mat-icon-button matTooltip="Add More Loan Details" matTooltipPosition="above" (click)="addLoanDetails()"
|
||||
*ngIf="i==0">
|
||||
<mat-icon>add</mat-icon>
|
||||
</button>
|
||||
<button type="button" mat-raised-button mat-icon-button matTooltip="Delete" matTooltipPosition="above" (click)="deleteLoanDetails(i)"
|
||||
*ngIf="i>0">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</mat-card-content>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card>
|
||||
<div style="text-align: right;">
|
||||
<button type="submit" mat-raised-button mat-icon-button type="submit" matTooltip="Submit" matTooltipPosition="above" (click)="submitCurrentloan()"><mat-icon>save</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
|
||||
@ -1,4 +1,6 @@
|
||||
<p>Family</p>
|
||||
<mat-card style="min-height: 550px;">
|
||||
<mat-card-content>
|
||||
<p>Family Details</p>
|
||||
<form class="address" [formGroup]="familyForm">
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Person Met" formControlName="person">
|
||||
@ -52,7 +54,7 @@
|
||||
</button>
|
||||
<button type="button" mat-raised-button mat-icon-button
|
||||
(click)="deleteEarningMembers(i)" *ngIf="i>0">
|
||||
<mat-icon>close</mat-icon>
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</mat-card-content>
|
||||
</div>
|
||||
@ -94,7 +96,7 @@
|
||||
</button>
|
||||
<button type="button" mat-raised-button mat-icon-button (click)="deleteMembers(i)"
|
||||
*ngIf="i>0">
|
||||
<mat-icon>close</mat-icon>
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</mat-card-content>
|
||||
</div>
|
||||
@ -125,11 +127,17 @@
|
||||
<input matInput placeholder="Please specify" formControlName="ownershipOther">
|
||||
</mat-form-field>
|
||||
<mat-form-field *ngIf="ownership.value =='Rented'">
|
||||
<input matInput placeholder="what rent"
|
||||
<input matInput placeholder="Rent Amount"
|
||||
formControlName="rent">
|
||||
</mat-form-field>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
<button mat-raised-button class="button" (click)="submitFamily()">Submit</button>
|
||||
</form>
|
||||
<div style="text-align: right;">
|
||||
<button type="submit" mat-raised-button mat-icon-button type="submit" matTooltip="Submit" matTooltipPosition="above" (click)="submitFamily()"><mat-icon>save</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
<notifier-container></notifier-container>
|
||||
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
@ -43,7 +43,8 @@ export class FamilyDetailsComponent implements OnInit {
|
||||
public ownershipOther: AbstractControl;
|
||||
public rent: AbstractControl;
|
||||
filteredStates: any = [
|
||||
'Co-Applicant 1 to x',
|
||||
'Main Applicant',
|
||||
'Co-Applicant ',
|
||||
'Accountant',
|
||||
'Manager',
|
||||
'Relative of the applicant',
|
||||
|
||||
@ -1,47 +1,56 @@
|
||||
<form [formGroup]="otherIncomeForm" class="address">
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Other Income"
|
||||
formControlName="other_income">
|
||||
<mat-option value="Yes">Yes</mat-option>
|
||||
<mat-option value="No">No</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-card *ngIf="otherIncomeForm.controls.other_income.value == 'Yes'">
|
||||
<mat-card-header>
|
||||
<p>Loan Details<p>
|
||||
</mat-card-header>
|
||||
<div formArrayName="income_details">
|
||||
<div *ngFor="let details of otherIncomeForm.get('income_details').controls; let i=index"
|
||||
[formGroupName]="i">
|
||||
<mat-card-content class="matcard">
|
||||
<mat-card style="min-height: 550px;">
|
||||
<mat-card-content>
|
||||
<p>Other Income Details</p>
|
||||
<form [formGroup]="otherIncomeForm" class="address">
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Source"
|
||||
formControlName="source">
|
||||
<mat-option value="rental_income">Rental Income</mat-option>
|
||||
<mat-option value="interest_income">Interest Income</mat-option>
|
||||
<mat-option value="agricultural_income">Agricultural Income</mat-option>
|
||||
<mat-option value="dividend_income">Dividend Income and Others</mat-option>
|
||||
<mat-select placeholder="Other Income"
|
||||
formControlName="other_income">
|
||||
<mat-option value="Yes">Yes</mat-option>
|
||||
<mat-option value="No">No</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Amount" formControlName="amount">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Frequency" formControlName="frequency">
|
||||
<mat-option value="{{frq.frequency_id}}" *ngFor="let frq of frequencyData">{{frq.name}}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<button type="button" mat-raised-button mat-icon-button (click)="addIncomeDetails()"
|
||||
*ngIf="i==0">
|
||||
<mat-icon>add</mat-icon>
|
||||
</button>
|
||||
<button type="button" mat-raised-button mat-icon-button (click)="deleteIncomeDetails(i)"
|
||||
*ngIf="i>0">
|
||||
<mat-icon>close</mat-icon>
|
||||
</button>
|
||||
</mat-card-content>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card>
|
||||
<button mat-raised-button type="submit" class="button" (click)="submitCurrentDetails()"></button>
|
||||
</form>
|
||||
<mat-card *ngIf="otherIncomeForm.controls.other_income.value == 'Yes'">
|
||||
<mat-card-header>
|
||||
<p>Income Details<p>
|
||||
</mat-card-header>
|
||||
<div formArrayName="income_details">
|
||||
<div *ngFor="let details of otherIncomeForm.get('income_details').controls; let i=index"
|
||||
[formGroupName]="i">
|
||||
<mat-card-content class="matcard">
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Source"
|
||||
formControlName="source">
|
||||
<mat-option value="rental_income">Rental Income</mat-option>
|
||||
<mat-option value="interest_income">Interest Income</mat-option>
|
||||
<mat-option value="agricultural_income">Agricultural Income</mat-option>
|
||||
<mat-option value="dividend_income">Dividend Income</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Amount" formControlName="amount">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Frequency" formControlName="frequency">
|
||||
<mat-option value="{{frq.frequency_id}}" *ngFor="let frq of frequencyData">{{frq.name}}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<button type="button" matTooltip="Add More Income Details" matTooltipPosition="above" mat-raised-button mat-icon-button (click)="addIncomeDetails()"
|
||||
*ngIf="i==0">
|
||||
<mat-icon>add</mat-icon>
|
||||
</button>
|
||||
<button type="button" matTooltip="Delete" matTooltipPosition="above" mat-raised-button mat-icon-button (click)="deleteIncomeDetails(i)"
|
||||
*ngIf="i>0">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</mat-card-content>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card>
|
||||
<div style="text-align: right;">
|
||||
<button type="submit" mat-raised-button mat-icon-button type="submit" matTooltip="Submit" matTooltipPosition="above" (click)="submitCurrentDetails()"><mat-icon>save</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
|
||||
@ -72,7 +72,7 @@
|
||||
<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>
|
||||
<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> -->
|
||||
|
||||
Loading…
Reference in New Issue
Block a user