family details changed to other family details : kdk
This commit is contained in:
parent
805039c78f
commit
61884e4b92
@ -1,11 +1,12 @@
|
||||
<form class="address" [formGroup]="familyForm">
|
||||
<h2 mat-dialog-title class="paragraph_change">
|
||||
<div fxFlex="70" align="left" style="padding: 10px !important;">
|
||||
{{pageTitle}}
|
||||
</div>
|
||||
<div fxFlex="30" align="end" style="padding: 10px !important;">
|
||||
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Close" matTooltipPosition="right" mat-dialog-close><mat-icon>close</mat-icon></button>
|
||||
</div>
|
||||
<div fxFlex="70" align="left" style="padding: 10px !important;">
|
||||
{{pageTitle}}
|
||||
</div>
|
||||
<div fxFlex="30" align="end" style="padding: 10px !important;">
|
||||
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Close" matTooltipPosition="right"
|
||||
mat-dialog-close><mat-icon>close</mat-icon></button>
|
||||
</div>
|
||||
</h2>
|
||||
|
||||
<mat-dialog-content>
|
||||
@ -18,57 +19,172 @@
|
||||
<!-- <mat-card-title>Address Details</mat-card-title> -->
|
||||
<mat-card-content>
|
||||
|
||||
<mat-form-field>
|
||||
<!--<mat-form-field>
|
||||
<input matInput placeholder="Number Of Family Members" formControlName="members" required>
|
||||
</mat-form-field>
|
||||
<mat-card>
|
||||
</mat-form-field>-->
|
||||
<div>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Select a person" formControlName="selected_person" required>
|
||||
<mat-option value="{{person.id}}" *ngFor="let person of selectPerson">
|
||||
{{person.name}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div>
|
||||
<h5>Residence Details</h5>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Place" formControlName="residence_place" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="City" formControlName="residence_city" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="State" formControlName="residence_state" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Pin" formControlName="residence_pin" required>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Number of yrs" formControlName="residence_No_of_years" type="number" required>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Ownership" formControlName="residence_ownership" required>
|
||||
<mat-option value="{{ownerShip.id}}" *ngFor="let ownerShip of ownerShipData">
|
||||
{{ownerShip.name}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field *ngIf="familyForm.get('residence_ownership').value == 4">
|
||||
<input matInput placeholder="Please specify" formControlName="ownershipOther">
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field *ngIf="familyForm.get('residence_ownership').value == 3">
|
||||
<input matInput placeholder="Rent Amount" formControlName="rent">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Number of Family Members" formControlName="total_number_of_family_members" (focusout)="getNumberOfFamilyMemberDetails()"
|
||||
type="number" max='20' min='1'>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div formArrayName="family_members_details">
|
||||
<div *ngFor="let item of familyForm.controls.family_members_details['controls']; let i=index" [formGroupName]="i">
|
||||
<mat-card>
|
||||
<div>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Name" formControlName="family_member_name" required>
|
||||
</mat-form-field>
|
||||
<!--<mat-form-field>
|
||||
<input matInput placeholder="Relationship" formControlName="family_member_relationship" required>
|
||||
</mat-form-field>-->
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Relationship" formControlName="family_member_relationship" required>
|
||||
<mat-option value="{{relation.relationship_id}}" *ngFor="let relation of relationData">
|
||||
{{relation.name}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Age" formControlName="family_member_age" required>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Earning Status" formControlName="family_member_earning_status" required>
|
||||
<mat-option value="{{earnings.id}}" *ngFor="let earnings of earningStatus">
|
||||
{{earnings.type}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div *ngIf="item.get('family_member_earning_status').value == 1">
|
||||
<!--<pre>{{ customerSegData | json}}</pre>-->
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Segment" formControlName="earning_segment" required>
|
||||
<mat-option value="{{segment.customer_segment_id}}" *ngFor="let segment of customerSegData">
|
||||
{{segment.name}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Income Per Month" formControlName="earning_gross_income_per_month" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Name of the Employer/Business" formControlName="earning_name_of_the_employer_or_business" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="No. of years in Employer/Business" formControlName="earning_number_of_years_in_employment_or_business"
|
||||
required>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div *ngIf="item.get('family_member_earning_status').value == 2">
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Occupation" formControlName="non_earning_occupation" required>
|
||||
<mat-option value="{{occupation.occupation_non_earning_member_id}}" *ngFor="let occupation of occupationData">
|
||||
{{occupation.name}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field *ngIf="item.get('non_earning_occupation').value==9">
|
||||
<input matInput placeholder="Specify Others" formControlName="non_earning_if_others" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field *ngIf="item.get('non_earning_occupation').value==3">
|
||||
<input matInput placeholder="Retired From" formControlName="non_earning_if_retired_from" type="date" required>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</mat-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--<mat-card>
|
||||
<mat-card-header>
|
||||
<p>Earning Members
|
||||
</p>
|
||||
</mat-card-header>
|
||||
<div formArrayName="earningMembers">
|
||||
<div *ngFor="let item of familyForm.controls.earningMembers['controls']; let i=index"
|
||||
[formGroupName]="i">
|
||||
<div *ngFor="let item of familyForm.controls.earningMembers['controls']; let i=index" [formGroupName]="i">
|
||||
<mat-card-content class="matcards">
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Name"
|
||||
formControlName="earning_member_name" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Age" (keypress)="keyPress($event)"
|
||||
formControlName="earning_member_age" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Name" formControlName="earning_member_name" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Age" (keypress)="keyPress($event)" formControlName="earning_member_age" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Relation" formControlName="relation" required>
|
||||
<mat-option value="{{relations.relationship_id}}"
|
||||
*ngFor="let relations of relationData">
|
||||
<mat-option value="{{relations.relationship_id}}" *ngFor="let relations of relationData">
|
||||
{{relations.name}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Segment" formControlName="segment" required>
|
||||
<mat-option value="{{cusSeg.customer_segment_id}}"
|
||||
*ngFor="let cusSeg of customerSegData">
|
||||
{{cusSeg.name}}
|
||||
</mat-option>
|
||||
<mat-option value="{{cusSeg.customer_segment_id}}" *ngFor="let cusSeg of customerSegData">
|
||||
{{cusSeg.name}}
|
||||
</mat-option>
|
||||
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Income / Revenue"
|
||||
formControlName="income" required>
|
||||
<input matInput placeholder="Income / Revenue" formControlName="income" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Name of Employer / Business"
|
||||
formControlName="employer_name" required>
|
||||
<input matInput placeholder="Name of Employer / Business" formControlName="employer_name" required>
|
||||
</mat-form-field>
|
||||
<button type="button" mat-raised-button mat-icon-button *ngIf="i==0" color="primary"
|
||||
matTooltip="Add More Earning Members" matTooltipPosition="above" (click)="addearningMembers()">
|
||||
<button type="button" mat-raised-button mat-icon-button *ngIf="i==0" color="primary" matTooltip="Add More Earning Members"
|
||||
matTooltipPosition="above" (click)="addearningMembers()">
|
||||
<mat-icon>add</mat-icon>
|
||||
</button>
|
||||
<button type="button" mat-raised-button mat-icon-button
|
||||
matTooltip="Delete" matTooltipPosition="above" (click)="deleteEarningMembers(i)" *ngIf="i>0">
|
||||
<button type="button" mat-raised-button mat-icon-button matTooltip="Delete" matTooltipPosition="above" (click)="deleteEarningMembers(i)"
|
||||
*ngIf="i>0">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</mat-card-content>
|
||||
@ -81,217 +197,180 @@
|
||||
</p>
|
||||
</mat-card-header>
|
||||
<div formArrayName="nonEarningMembers">
|
||||
<div *ngFor="let members of familyForm.controls.nonEarningMembers['controls']; let i=index"
|
||||
[formGroupName]="i">
|
||||
<div *ngFor="let members of familyForm.controls.nonEarningMembers['controls']; let i=index" [formGroupName]="i">
|
||||
<mat-card-content class="matcard">
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Name"
|
||||
formControlName="non_earning_member_name" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Age" (keypress)="keyPress($event)"
|
||||
formControlName="non_earning_member_age" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Relation"
|
||||
formControlName="relationship" required>
|
||||
<mat-option value="{{relation.relationship_id}}"
|
||||
*ngFor="let relation of relationData">
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Name" formControlName="non_earning_member_name" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Age" (keypress)="keyPress($event)" formControlName="non_earning_member_age" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Relation" formControlName="relationship" required>
|
||||
<mat-option value="{{relation.relationship_id}}" *ngFor="let relation of relationData">
|
||||
{{relation.name}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Occupation"
|
||||
formControlName="occupation" required>
|
||||
<mat-option value="{{occupation.occupation_non_earning_member_id}}"
|
||||
*ngFor="let occupation of occupationData">{{occupation.name}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Occupation" formControlName="occupation" required>
|
||||
<mat-option value="{{occupation.occupation_non_earning_member_id}}" *ngFor="let occupation of occupationData">{{occupation.name}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field *ngIf="members['controls'].occupation.value==3">
|
||||
<input matInput placeholder="Retired From"
|
||||
formControlName="retired">
|
||||
<input matInput placeholder="Retired From" formControlName="retired">
|
||||
</mat-form-field>
|
||||
<mat-form-field *ngIf="members['controls'].occupation.value==9">
|
||||
<input matInput placeholder="Specify Others Occupation"
|
||||
formControlName="others_occupation">
|
||||
</mat-form-field>
|
||||
<button type="button" mat-raised-button mat-icon-button (click)="addMembers()" color="primary"
|
||||
matTooltip="Add More Non Earning Members" matTooltipPosition="above" *ngIf="i==0">
|
||||
<input matInput placeholder="Specify Others Occupation" formControlName="others_occupation">
|
||||
</mat-form-field>
|
||||
<button type="button" mat-raised-button mat-icon-button (click)="addMembers()" color="primary" matTooltip="Add More Non Earning Members"
|
||||
matTooltipPosition="above" *ngIf="i==0">
|
||||
<mat-icon>add</mat-icon>
|
||||
</button>
|
||||
<button type="button" mat-raised-button mat-icon-button (click)="deleteMembers(i)"
|
||||
matTooltip="Delete" matTooltipPosition="above" *ngIf="i>0">
|
||||
<button type="button" mat-raised-button mat-icon-button (click)="deleteMembers(i)" matTooltip="Delete" matTooltipPosition="above"
|
||||
*ngIf="i>0">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</mat-card-content>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card>
|
||||
<mat-card>
|
||||
<mat-card-header>
|
||||
<p>Residence </p>
|
||||
</mat-card-header>
|
||||
<mat-card-content class="matcard">
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Residence Address"
|
||||
formControlName="residence" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Number of yrs" formControlName="years" required>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Ownership" formControlName="ownership" required>
|
||||
<mat-option value="{{ownerShip.id}}"
|
||||
*ngFor="let ownerShip of ownerShipData">
|
||||
{{ownerShip.name}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field *ngIf="ownership.value ==4">
|
||||
<input matInput placeholder="Please specify" formControlName="ownershipOther">
|
||||
</mat-form-field>
|
||||
<mat-form-field *ngIf="ownership.value ==3">
|
||||
<input matInput placeholder="Rent Amount"
|
||||
formControlName="rent">
|
||||
</mat-form-field>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</mat-card>-->
|
||||
|
||||
|
||||
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
</mat-tab>
|
||||
</ng-template>
|
||||
</mat-tab>
|
||||
|
||||
<mat-tab label="Docs">
|
||||
<ng-template matTabContent>
|
||||
<div fxLayout="row wrap">
|
||||
<div fxFlex="25" class="m-gap p-gap">
|
||||
<div class="p-list-main mb-2">
|
||||
<div class="p-list">
|
||||
<mat-tab label="Docs">
|
||||
<ng-template matTabContent>
|
||||
<div fxLayout="row wrap">
|
||||
<div fxFlex="25" class="m-gap p-gap">
|
||||
<div class="p-list-main mb-2">
|
||||
<div class="p-list">
|
||||
|
||||
<div class="top"><img src="./../../../../../../../assets/images/face2.jpg" alt=""/></div>
|
||||
<div class="bottom">
|
||||
<div class="left">
|
||||
<div class="details">
|
||||
<small>Nivi SKM</small>
|
||||
<!-- <p>{{docs.pd_document_name}}</p> -->
|
||||
</div>
|
||||
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div fxFlex="25" class="m-gap p-gap">
|
||||
<div class="p-list-main mb-2">
|
||||
<div class="p-list">
|
||||
<div class="top"><img src="./../../../../../../../assets/images/face2.jpg" alt="" /></div>
|
||||
<div class="bottom">
|
||||
<div class="left">
|
||||
<div class="details">
|
||||
<small>Nivi SKM</small>
|
||||
<!-- <p>{{docs.pd_document_name}}</p> -->
|
||||
</div>
|
||||
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div fxFlex="25" class="m-gap p-gap">
|
||||
<div class="p-list-main mb-2">
|
||||
<div class="p-list">
|
||||
|
||||
<div class="top"><img src="./../../../../../../../assets/images/face1.jpg" alt=""/></div>
|
||||
<div class="bottom">
|
||||
<div class="left">
|
||||
<div class="details">
|
||||
<small>Nivi SKM</small>
|
||||
<!-- <p>{{docs.pd_document_name}}</p> -->
|
||||
</div>
|
||||
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div fxFlex="25" class="m-gap p-gap">
|
||||
<div class="p-list-main mb-2">
|
||||
<div class="p-list">
|
||||
<div class="top"><img src="./../../../../../../../assets/images/face1.jpg" alt="" /></div>
|
||||
<div class="bottom">
|
||||
<div class="left">
|
||||
<div class="details">
|
||||
<small>Nivi SKM</small>
|
||||
<!-- <p>{{docs.pd_document_name}}</p> -->
|
||||
</div>
|
||||
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div fxFlex="25" class="m-gap p-gap">
|
||||
<div class="p-list-main mb-2">
|
||||
<div class="p-list">
|
||||
|
||||
<div class="top"><img src="./../../../../../../../assets/images/face1.jpg" alt=""/></div>
|
||||
<div class="bottom">
|
||||
<div class="left">
|
||||
<div class="details">
|
||||
<small>Nivi SKM</small>
|
||||
<!-- <p>{{docs.pd_document_name}}</p> -->
|
||||
</div>
|
||||
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div fxFlex="25" class="m-gap p-gap">
|
||||
<div class="p-list-main mb-2">
|
||||
<div class="p-list">
|
||||
<div class="top"><img src="./../../../../../../../assets/images/face1.jpg" alt="" /></div>
|
||||
<div class="bottom">
|
||||
<div class="left">
|
||||
<div class="details">
|
||||
<small>Nivi SKM</small>
|
||||
<!-- <p>{{docs.pd_document_name}}</p> -->
|
||||
</div>
|
||||
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div fxFlex="25" class="m-gap p-gap">
|
||||
<div class="p-list-main mb-2">
|
||||
<div class="p-list">
|
||||
|
||||
<div class="top"><img src="./../../../../../../../assets/images/face1.jpg" alt=""/></div>
|
||||
<div class="bottom">
|
||||
<div class="left">
|
||||
<div class="details">
|
||||
<small>Nivi SKM</small>
|
||||
<!-- <p>{{docs.pd_document_name}}</p> -->
|
||||
</div>
|
||||
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div fxFlex="25" class="m-gap p-gap">
|
||||
<div class="p-list-main mb-2">
|
||||
<div class="p-list">
|
||||
<div class="top"><img src="./../../../../../../../assets/images/face1.jpg" alt="" /></div>
|
||||
<div class="bottom">
|
||||
<div class="left">
|
||||
<div class="details">
|
||||
<small>Nivi SKM</small>
|
||||
<!-- <p>{{docs.pd_document_name}}</p> -->
|
||||
</div>
|
||||
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div fxFlex="25" class="m-gap p-gap">
|
||||
<div class="p-list-main mb-2">
|
||||
<div class="p-list">
|
||||
|
||||
<div class="top"><img src="./../../../../../../../assets/images/face1.jpg" alt=""/></div>
|
||||
<div class="bottom">
|
||||
<div class="left">
|
||||
<div class="details">
|
||||
<small>Nivi SKM</small>
|
||||
<!-- <p>{{docs.pd_document_name}}</p> -->
|
||||
</div>
|
||||
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div fxFlex="25" class="m-gap p-gap">
|
||||
<div class="p-list-main mb-2">
|
||||
<div class="p-list">
|
||||
<div class="top"><img src="./../../../../../../../assets/images/face1.jpg" alt="" /></div>
|
||||
<div class="bottom">
|
||||
<div class="left">
|
||||
<div class="details">
|
||||
<small>Nivi SKM</small>
|
||||
<!-- <p>{{docs.pd_document_name}}</p> -->
|
||||
</div>
|
||||
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div fxFlex="25" class="m-gap p-gap">
|
||||
<div class="p-list-main mb-2">
|
||||
<div class="p-list">
|
||||
|
||||
<div class="top"><img src="./../../../../../../../assets/images/face1.jpg" alt=""/></div>
|
||||
<div class="bottom">
|
||||
<div class="left">
|
||||
<div class="details">
|
||||
<small>Nivi SKM</small>
|
||||
<!-- <p>{{docs.pd_document_name}}</p> -->
|
||||
</div>
|
||||
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="top"><img src="./../../../../../../../assets/images/face1.jpg" alt="" /></div>
|
||||
<div class="bottom">
|
||||
<div class="left">
|
||||
<div class="details">
|
||||
<small>Nivi SKM</small>
|
||||
<!-- <p>{{docs.pd_document_name}}</p> -->
|
||||
</div>
|
||||
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</ng-template>
|
||||
</mat-tab>
|
||||
</ng-template>
|
||||
</mat-tab>
|
||||
|
||||
</mat-tab-group>
|
||||
</mat-tab-group>
|
||||
|
||||
</mat-dialog-content>
|
||||
<mat-dialog-actions>
|
||||
<div fxFlex="60" class="pb-0 text-sm-left" align="left">
|
||||
<mat-form-field appearance="outline" style="width: 100%">
|
||||
<mat-label>Remarks</mat-label>
|
||||
<textarea matInput placeholder="Remarks" formControlName="family_details_form_remark"></textarea>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div fxFlex="40" align="end">
|
||||
<div fxFlex="60" class="pb-0 text-sm-left" align="left">
|
||||
<mat-form-field appearance="outline" style="width: 100%">
|
||||
<mat-label>Remarks</mat-label>
|
||||
<textarea matInput placeholder="Remarks" formControlName="family_details_form_remark"></textarea>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div fxFlex="40" align="end">
|
||||
<!-- <button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="submit" matTooltip="Save" matTooltipPosition="above"><mat-icon>save</mat-icon></button> -->
|
||||
<button type="submit" mat-raised-button mat-icon-button type="submit" matTooltip="Submit" matTooltipPosition="above" (click)="submitFamily()"><mat-icon>save</mat-icon></button>
|
||||
<button type="submit" mat-raised-button mat-icon-button type="submit" matTooltip="Submit" matTooltipPosition="above" (click)="submitFamily()"><mat-icon>save</mat-icon></button>
|
||||
</div>
|
||||
</mat-dialog-actions>
|
||||
|
||||
@ -311,7 +390,7 @@
|
||||
<mat-card-content>
|
||||
<p>Family Details</p>
|
||||
<form class="address" [formGroup]="familyForm"> -->
|
||||
<!-- <mat-form-field>
|
||||
<!-- <mat-form-field>
|
||||
<mat-select placeholder="Person Met" formControlName="person" required>
|
||||
<mat-option *ngFor="let personMet of personMetData" [value]="personMet.person_met_id">
|
||||
{{personMet.person_met_name}}
|
||||
@ -321,7 +400,7 @@
|
||||
<mat-form-field *ngIf="person.value ==8">
|
||||
<input matInput placeholder="Enter the relationship" formControlName="personOther">
|
||||
</mat-form-field> -->
|
||||
<!-- <mat-form-field>
|
||||
<!-- <mat-form-field>
|
||||
<input matInput placeholder="Number Of Family Members" formControlName="members" required>
|
||||
</mat-form-field>
|
||||
<mat-card>
|
||||
|
||||
@ -34,18 +34,24 @@ export class FamilyDetailsComponent implements OnInit {
|
||||
pdid : string;
|
||||
form_id : number;
|
||||
|
||||
public currentLoanForm: FormGroup;
|
||||
private notifier: NotifierService;
|
||||
public familyForm: FormGroup;
|
||||
|
||||
// public person: AbstractControl;
|
||||
// public personOther: AbstractControl;
|
||||
public members: AbstractControl;
|
||||
public residence: AbstractControl;
|
||||
public years: AbstractControl;
|
||||
public ownership: AbstractControl;
|
||||
public ownershipOther: AbstractControl;
|
||||
public rent: AbstractControl;
|
||||
selectPerson = [{
|
||||
name : 'person 1',
|
||||
id : 111
|
||||
}, {
|
||||
name : 'person 2',
|
||||
id : 222
|
||||
}];
|
||||
|
||||
earningStatus = [{
|
||||
type: 'Earning',
|
||||
id: 1
|
||||
}, {
|
||||
type: 'Non Earning',
|
||||
id: 2
|
||||
}]
|
||||
|
||||
relationData: any = [];
|
||||
occupationData: any = [];
|
||||
@ -68,7 +74,7 @@ export class FamilyDetailsComponent implements OnInit {
|
||||
this.getMasterDetails('OCCUPATIONMEMBERS',2);
|
||||
//this.getMasterDetails('PERSONSMET',3);
|
||||
this.getMasterDetails('RESIDENCEOWNERSHIP',4);
|
||||
this.getMasterDetails('CUSTOMERSEGMENT',5)
|
||||
this.getMasterDetails('CUSTOMERSEGMENT',5);
|
||||
this.initFamilyForm();
|
||||
let params: any = {};
|
||||
params.pd_id = this.pdid;
|
||||
@ -77,131 +83,118 @@ export class FamilyDetailsComponent implements OnInit {
|
||||
const control = <FormArray>this.familyForm.controls['nonEarningMembers'];
|
||||
const value = <FormArray>this.familyForm.controls['earningMembers'];
|
||||
if (data.status == 200) {
|
||||
var result = Object.keys(data.records.non_earning_members).map(function (key) {
|
||||
return data.records.non_earning_members[key];
|
||||
});
|
||||
var earning = Object.keys(data.records.earning_members).map(function (key) {
|
||||
return data.records.earning_members[key];
|
||||
});
|
||||
// this.familyForm.controls.person.setValue(data.records.person_met);
|
||||
// if (data.records.person_met_other) {
|
||||
// this.familyForm.controls.personOther.setValue(data.records.person_met_other);
|
||||
// }
|
||||
this.familyForm.controls.members.setValue(data.records.family_members);
|
||||
this.familyForm.controls.years.setValue(data.records.no_of_years);
|
||||
this.familyForm.controls.ownership.setValue(data.records.ownership);
|
||||
this.familyForm.controls.selected_person.setValue(data.records.selected_person);
|
||||
this.familyForm.controls.residence_place.setValue(data.records.residence_place);
|
||||
this.familyForm.controls.residence_city.setValue(data.records.residence_city);
|
||||
this.familyForm.controls.residence_state.setValue(data.records.residence_state);
|
||||
this.familyForm.controls.residence_pin.setValue(data.records.residence_pin);
|
||||
this.familyForm.controls.residence_No_of_years.setValue(data.records.residence_No_of_years);
|
||||
this.familyForm.controls.residence_ownership.setValue(data.records.residence_ownership);
|
||||
this.familyForm.controls.ownershipOther.setValue(data.records.ownershipOther);
|
||||
this.familyForm.controls.rent.setValue(data.records.rent);
|
||||
this.familyForm.controls.total_number_of_family_members.setValue(data.records.total_number_of_family_members);
|
||||
this.familyForm.controls.family_details_form_remark.setValue(data.records.family_details_form_remark);
|
||||
|
||||
if (data.records.ownership_others) {
|
||||
this.familyForm.controls.ownershipOther.setValue(data.records.ownership_others);
|
||||
}
|
||||
this.familyForm.controls.rent.setValue(data.records.what_rent);
|
||||
if (result.length == 0) {
|
||||
control.push(this.createNonMembers());
|
||||
} else {
|
||||
result.forEach(datas => {
|
||||
control.push(this.createNonMembers());
|
||||
});
|
||||
this.familyForm.controls.nonEarningMembers.setValue(result);
|
||||
}
|
||||
if (earning.length == 0) {
|
||||
value.push(this.createMembers());
|
||||
} else {
|
||||
earning.forEach(datas => {
|
||||
value.push(this.createMembers());
|
||||
});
|
||||
this.familyForm.controls.earningMembers.setValue(earning);
|
||||
}
|
||||
this.familyForm.controls.residence.setValue(data.records.residence);
|
||||
this.generateFamilyMembersDetailsGetData(data.records.family_members_details);
|
||||
} else {
|
||||
value.push(this.createMembers());
|
||||
control.push(this.createNonMembers());
|
||||
// value.push(this.createMembers());
|
||||
// control.push(this.createNonMembers());
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
initgenerateFamilyMembersDetailsGet(val): FormGroup {
|
||||
return this.fb.group({
|
||||
family_member_name : [val.family_member_name, Validators.compose([])],
|
||||
family_member_relationship : [val.family_member_relationship, Validators.compose([])],
|
||||
family_member_age : [val.family_member_age, Validators.compose([])],
|
||||
family_member_earning_status : [val.family_member_earning_status, Validators.compose([])],
|
||||
earning_segment: [val.earning_segment, Validators.compose([])],
|
||||
earning_gross_income_per_month: [val.earning_gross_income_per_month, Validators.compose([])],
|
||||
earning_name_of_the_employer_or_business: [val.earning_name_of_the_employer_or_business, Validators.compose([])],
|
||||
earning_number_of_years_in_employment_or_business: [val.earning_number_of_years_in_employment_or_business, Validators.compose([])],
|
||||
non_earning_occupation: [val.non_earning_occupation, Validators.compose([])],
|
||||
non_earning_if_others: [val.non_earning_if_others, Validators.compose([])],
|
||||
non_earning_if_retired_from: [val.non_earning_if_retired_from, Validators.compose([])],
|
||||
})
|
||||
}
|
||||
|
||||
generateFamilyMembersDetailsGetData(data) {
|
||||
var result = Object.keys(data).map(function (key) {
|
||||
return data[key];
|
||||
});
|
||||
if (result.length > 0) {
|
||||
for (let val of result) {
|
||||
const control = <FormArray>this.familyForm.controls['family_members_details'];
|
||||
control.push(this.initgenerateFamilyMembersDetailsGet(val));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
onSearchChange(e):void {
|
||||
e.preventDefault();
|
||||
}
|
||||
public initFamilyForm(): void {
|
||||
this.familyForm = this.fb.group({
|
||||
// person: ['', Validators.compose([Validators.required])],
|
||||
selected_person: ['', Validators.compose([Validators.required])],
|
||||
// personOther: [''],
|
||||
members: ['', Validators.compose([Validators.required])],
|
||||
residence: ['', Validators.compose([Validators.required])],
|
||||
years: ['', Validators.compose([Validators.required])],
|
||||
ownership: ['', Validators.compose([Validators.required])],
|
||||
// members: ['', Validators.compose([Validators.required])],
|
||||
residence_place: ['', Validators.compose([])],
|
||||
residence_city: ['', Validators.compose([])],
|
||||
residence_state: ['', Validators.compose([])],
|
||||
residence_pin: ['', Validators.compose([])],
|
||||
residence_No_of_years: ['', Validators.compose([])],
|
||||
residence_ownership: ['', Validators.compose([])],
|
||||
ownershipOther: [''],
|
||||
rent: [''],
|
||||
earningMembers: this.fb.array([]),
|
||||
nonEarningMembers: this.fb.array([]),
|
||||
|
||||
total_number_of_family_members: ['', Validators.compose([Validators.min(1), Validators.max(20)])],
|
||||
|
||||
family_members_details: this.fb.array([]),
|
||||
// earningMembers: this.fb.array([]),
|
||||
// nonEarningMembers: this.fb.array([]),
|
||||
family_details_form_remark: ['']
|
||||
});
|
||||
// this.person = this.familyForm.controls['person'];
|
||||
// this.personOther = this.familyForm.controls['personOther'];
|
||||
this.members = this.familyForm.controls['members'];
|
||||
this.residence = this.familyForm.controls['residence'];
|
||||
this.years = this.familyForm.controls['years'];
|
||||
this.ownership = this.familyForm.controls['ownership'];
|
||||
this.ownershipOther = this.familyForm.controls['ownershipOther'];
|
||||
this.rent = this.familyForm.controls['rent'];
|
||||
}
|
||||
createMembers(): FormGroup {
|
||||
return this.fb.group({
|
||||
earning_member_name : ['', Validators.compose([Validators.required])],
|
||||
earning_member_age : ['', Validators.compose([Validators.required])],
|
||||
relation: ['', Validators.compose([Validators.required])],
|
||||
segment: ['', Validators.compose([Validators.required])],
|
||||
income: ['', Validators.compose([Validators.required])],
|
||||
employer_name: ['', Validators.compose([Validators.required])],
|
||||
});
|
||||
}
|
||||
createNonMembers(): FormGroup {
|
||||
return this.fb.group({
|
||||
non_earning_member_name : ['', Validators.compose([Validators.required])],
|
||||
non_earning_member_age : ['', Validators.compose([Validators.required])],
|
||||
relationship: ['', Validators.compose([Validators.required])],
|
||||
occupation: ['', Validators.compose([Validators.required])],
|
||||
retired: [''],
|
||||
others_occupation : ['']
|
||||
});
|
||||
}
|
||||
|
||||
addearningMembers() {
|
||||
|
||||
const control = <FormArray>this.familyForm.controls['earningMembers'];
|
||||
//this.earnMemberArrCount = control.length;
|
||||
getNumberOfFamilyMemberDetails(){
|
||||
// alert(this.familyForm.controls.total_number_of_family_members.valid);
|
||||
if(this.familyForm.controls.total_number_of_family_members.valid){
|
||||
let totalMem = this.familyForm.get('total_number_of_family_members').value;
|
||||
const control = <FormArray>this.familyForm.controls.family_members_details;
|
||||
if(totalMem > control.length) {
|
||||
let len = totalMem - control.length;
|
||||
for(let i = 0; i < len; i++){
|
||||
control.push(this.generateFamilyMembersDetailsGet());
|
||||
}
|
||||
} else if (totalMem < control.length) {
|
||||
// control.controls.slice(0, totalMem);
|
||||
control.controls = [];
|
||||
for(let i = 0; i < totalMem; i++){
|
||||
control.push(this.generateFamilyMembersDetailsGet());
|
||||
}
|
||||
}
|
||||
} else {
|
||||
|
||||
if(control.length == this.familyForm.controls['members'].value)
|
||||
{
|
||||
|
||||
}else{
|
||||
control.push(this.createMembers());
|
||||
//console.log('Add earn member',this.familyForm.controls['members'].value);
|
||||
}
|
||||
|
||||
// console.log(this.earnMemberArrCount);
|
||||
// console.log(this.nonEarnMemberArrCount);
|
||||
}
|
||||
addMembers() {
|
||||
const control = <FormArray>this.familyForm.controls['nonEarningMembers'];
|
||||
this.count++;
|
||||
// this.nonEarnMemberArrCount = control.length;
|
||||
// console.log(this.earnMemberArrCount);
|
||||
// console.log(this.nonEarnMemberArrCount);
|
||||
// if(control.length == this.familyForm.controls['members'].value)
|
||||
// {
|
||||
|
||||
// }else{
|
||||
// control.push(this.createNonMembers());
|
||||
// }
|
||||
generateFamilyMembersDetailsGet(): FormGroup {
|
||||
return this.fb.group({
|
||||
family_member_name : ['', Validators.compose([])],
|
||||
family_member_relationship : ['', Validators.compose([])],
|
||||
family_member_age : ['', Validators.compose([])],
|
||||
family_member_earning_status : ['', Validators.compose([])],
|
||||
earning_segment: ['', Validators.compose([])],
|
||||
earning_gross_income_per_month: ['', Validators.compose([])],
|
||||
earning_name_of_the_employer_or_business: ['', Validators.compose([])],
|
||||
earning_number_of_years_in_employment_or_business: ['', Validators.compose([])],
|
||||
non_earning_occupation: ['', Validators.compose([])],
|
||||
non_earning_if_others: ['', Validators.compose([])],
|
||||
non_earning_if_retired_from: ['', Validators.compose([])],
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
deleteEarningMembers(index) {
|
||||
const control = <FormArray>this.familyForm.controls['earningMembers'];
|
||||
control.removeAt(index);
|
||||
}
|
||||
deleteMembers(index) {
|
||||
const control = <FormArray>this.familyForm.controls['nonEarningMembers'];
|
||||
control.removeAt(index);
|
||||
}
|
||||
// get all master details
|
||||
getMasterDetails(table:string,type:number){
|
||||
this._pd.getAllMasterDatas(table).subscribe(
|
||||
@ -231,43 +224,10 @@ export class FamilyDetailsComponent implements OnInit {
|
||||
if (!this.familyForm.valid) {
|
||||
return;
|
||||
}
|
||||
let records: any = {};
|
||||
records.no_of_years = this.years.value;
|
||||
if (this.ownership.value == 4) {
|
||||
records.ownership_others = this.ownershipOther.value;
|
||||
}
|
||||
records.ownership = this.ownership.value;
|
||||
records.residence = this.residence.value;
|
||||
if (this.ownership.value == 3) {
|
||||
records.what_rent = this.rent.value;
|
||||
}
|
||||
// if (this.person.value == 8) {
|
||||
// records.person_met_other = this.personOther.value;
|
||||
// }
|
||||
//records.person_met = this.person.value;
|
||||
records.family_members = this.members.value;
|
||||
records.earning_members = this.familyForm.controls['earningMembers'].value;
|
||||
// filter re conditions
|
||||
let non_earning_members_filter = this.familyForm.controls['nonEarningMembers'].value.map(function(obj) {
|
||||
|
||||
console.log(obj.occupation);
|
||||
if(obj.occupation==3){
|
||||
return obj;
|
||||
}
|
||||
else{
|
||||
obj.retired='';
|
||||
return obj;
|
||||
}
|
||||
if(obj.occupation==9){
|
||||
return obj;
|
||||
}
|
||||
else{
|
||||
obj.others_occupation='';
|
||||
return obj;
|
||||
}
|
||||
});
|
||||
records.non_earning_members = non_earning_members_filter;
|
||||
records.family_details_form_remark = this.familyForm.controls['family_details_form_remark'].value;
|
||||
var records = this.familyForm.value;
|
||||
//To Remove The "Null" With Key also
|
||||
Object.keys(records).forEach((key) => (records[key] == null) && delete records[key]);
|
||||
// records.other_family_details = answerFormValues;
|
||||
records.pdid = this.pdid;
|
||||
records.formid = '6';
|
||||
// records.fk_createdby = '251';
|
||||
@ -277,25 +237,25 @@ export class FamilyDetailsComponent implements OnInit {
|
||||
this.notifier.notify('warning', 'Something Wents Wrong Try Again.!');
|
||||
});
|
||||
}
|
||||
validateAllFormFields(formGroup: FormGroup) {
|
||||
Object.keys(formGroup.controls).forEach(field => {
|
||||
const control = formGroup.get(field);
|
||||
if (control instanceof FormControl) {
|
||||
control.markAsTouched({onlySelf: true});
|
||||
} else if (control instanceof FormGroup) {
|
||||
this.validateAllFormFields(control);
|
||||
}
|
||||
});
|
||||
}
|
||||
// validateAllFormFields(formGroup: FormGroup) {
|
||||
// Object.keys(formGroup.controls).forEach(field => {
|
||||
// const control = formGroup.get(field);
|
||||
// if (control instanceof FormControl) {
|
||||
// control.markAsTouched({onlySelf: true});
|
||||
// } else if (control instanceof FormGroup) {
|
||||
// this.validateAllFormFields(control);
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
|
||||
/** On Key Press Event For Age */
|
||||
keyPress(event: any) {
|
||||
const pattern = /[0-9]/;
|
||||
// /** On Key Press Event For Age */
|
||||
// keyPress(event: any) {
|
||||
// const pattern = /[0-9]/;
|
||||
|
||||
let inputChar = String.fromCharCode(event.charCode);
|
||||
if (event.keyCode != 8 && !pattern.test(inputChar)) {
|
||||
event.preventDefault();
|
||||
}
|
||||
}
|
||||
// let inputChar = String.fromCharCode(event.charCode);
|
||||
// if (event.keyCode != 8 && !pattern.test(inputChar)) {
|
||||
// event.preventDefault();
|
||||
// }
|
||||
// }
|
||||
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user