Sineedge/sparqsineedge
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' of https://bitbucket.org/sriramv18/sparqsineedge

Browse Source
This commit is contained in:
venbatechnologies@gmail.com 2018-12-05 18:10:31 +05:30
commit 4ad50910c9
56 changed files with 6749 additions and 2623 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
ng6-seed/src/app/dashboard/dashboard.component.html
View File

@ -80,7 +80,9 @@
<div *ngIf="total3 != 0" class="donut-inner"><span>Tele - {{total3}}</span></div> <div *ngIf="total3 != 0" class="donut-inner"><span>Tele - {{total3}}</span></div>
</div> </div>
</div> </div>
<div fxLayout="row" class="pt-3" *ngIf="total3 != 0 && total2 != 0 && total1 != 0">
<div fxLayout="row" class="pt-3">
<div fxFlex.gt-sm="100" fxFlex="100" style="text-align:center"> <div fxFlex.gt-sm="100" fxFlex="100" style="text-align:center">
<ul class="lengend-list"> <ul class="lengend-list">
<li class="lengend-element"><span class="oval" style="background-color:#c1c1c1"> &nbsp;&nbsp;&nbsp;&nbsp; </span>&nbsp; Draft</li> <li class="lengend-element"><span class="oval" style="background-color:#c1c1c1"> &nbsp;&nbsp;&nbsp;&nbsp; </span>&nbsp; Draft</li>

475
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/address/address.component.html
View File

@ -1,169 +1,322 @@
<!-- <form [formGroup]="_personalForm" (submit)="submitPersonalForm(_personalForm.value)" novalidate> -->
<mat-card style="min-height: 550px;">
<mat-card-content>
<p>PD Address Details</p>
<form class="address" [formGroup]="addressForm"> <form class="address" [formGroup]="addressForm">
<mat-form-field>
<input matInput placeholder="Address" formControlName="address" required>
</mat-form-field>
<mat-form-field> <h2 mat-dialog-title class="paragraph_change">
<mat-select placeholder="Address Type" formControlName="address_type" required> <div fxFlex="70" align="left">
<mat-option value="{{m_addressType.address_type_id}}" {{pageTitle}}
*ngFor="let m_addressType of addressData">{{m_addressType.address_type}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls['address_type'].value == 12">
<input matInput placeholder="Address Type Others" formControlName="address_type_others">
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Locality" formControlName="locality" required>
<mat-option value="{{m_locality.locality_id}}"
*ngFor="let m_locality of localityData">{{m_locality.locality_name}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls.locality.value == 'Others'">
<input matInput placeholder="Specify Locality"
formControlName="locality_others">
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Approach to PD Location" formControlName="pd_location" required>
<mat-option value="{{data.pd_location_approach_id}}"
*ngFor="let data of locationdata">{{data.description}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Comment on Locality" formControlName="comment_locality" required>
<mat-option value="{{data.comments_on_locality_id}}"
*ngFor="let data of commentData">{{data.rating}}
</mat-option>
</mat-select>
</mat-form-field>
<!-- Don't Remove To replace atlast of the PD Completion and creating new form (Customer Behaviour 221118 review doc : s.no 3.e )
<mat-form-field>
<mat-select placeholder="Customer Behaviour"
formControlName="customer_behaviour" required>
<mat-option value="{{data.customer_behaviour_id}}"
*ngFor="let data of customerData">{{data.description}}
</mat-option>
</mat-select>
</mat-form-field>--(Customer Behaviour)-->
<mat-form-field>
<mat-select placeholder="Ownership" formControlName="address_ownership">
<mat-option value="{{ownerShip.id}}"
*ngFor="let ownerShip of ownerShipData">
{{ownerShip.name}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Is there any business activity is being run?"
formControlName="bussiness_activity" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls['bussiness_activity'].value == 'yes'">
<mat-select placeholder="Bussiness Type" formControlName="bussiness_address_type">
<mat-option value="{{m_addressType.address_type_id}}"
*ngFor="let m_addressType of addressData">{{m_addressType.address_type}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls['bussiness_address_type'].value == 12">
<input matInput placeholder="Bussiness Address Type Others" formControlName="bussiness_address_type_others">
</mat-form-field>
<!--- Don't Remove To replace atlast of the PD Completion and creating new form (Neighbourhood check) --
<mat-card>
<mat-card-header>
<p>Neighbourhood</p>
</mat-card-header>
<div formArrayName="neighbourhood">
<div *ngFor="let item of addressForm.controls.neighbourhood['controls']; let i=index" >
<mat-card-content class="matcard" [formGroup]="item">
<div>
<mat-form-field>
<input matInput placeholder="Neighbour Name"
formControlName="name" required>
</mat-form-field>
</div>
<div>
<mat-form-field>
<mat-select placeholder="Do you know"
formControlName="do_you_know" required>
<mat-option value="{{m_neighbourStatus}}"
*ngFor="let m_neighbourStatus of neighbourStatusData">{{m_neighbourStatus}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Is the applicant owner"
formControlName="is_owner" required>
<mat-option value="{{m_applicantOwner}}"
*ngFor="let m_applicantOwner of applicantOwnerData">{{m_applicantOwner}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<!-- <mat-form-field>
<input matInput placeholder="How long do you know the applicant"
formControlName="how_long">
</mat-form-field> ->-
<div>
<label>How long do you know the applicant?</label>
<br>
<mat-form-field>
<input matInput type="number" placeholder="Year" formControlName="how_long_year" required min='0'>
</mat-form-field>
<mat-form-field>
<input matInput type="number" placeholder="Month" formControlName="how_long_month" required min='0' max='12'>
</mat-form-field>
</div>
<button type="button" matTooltip="Add More Neighbour Details" class="mr-1 mb-1 hover-icon" matTooltipPosition="above" mat-raised-button mat-icon-button *ngIf="i==0"
(click)="addNeighbour($event)"
color="primary" style="float: right;">
<mat-icon>add</mat-icon>
</button>
<button type="button" matTooltip="Delete" class="mr-1 mb-1 hover-icon" matTooltipPosition="above" mat-raised-button mat-icon-button *ngIf="i>0"
(click)="removeNeighbour(i)"
style="float: right;">
<mat-icon>delete</mat-icon>
</button>
</mat-card-content>
</div> </div>
<div fxFlex="30" align="end">
<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>
<mat-tab-group>
<mat-tab label="Questions">
<ng-template matTabContent>
<div fxLayout="row wrap">
<div fxFlex="100">
<mat-card>
<!-- <mat-card-title>Address Details</mat-card-title> -->
<mat-card-content>
<mat-form-field>
<!-- <input matInput placeholder="Name" formControlName="name_ans" type="text" required> -->
<input matInput placeholder="Address" formControlName="address" required>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Address Type" formControlName="address_type" required>
<mat-option value="{{m_addressType.address_type_id}}"
*ngFor="let m_addressType of addressData">{{m_addressType.address_type}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls['address_type'].value == 12">
<input matInput placeholder="Address Type Others" formControlName="address_type_others">
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Locality" formControlName="locality" required>
<mat-option value="{{m_locality.locality_id}}"
*ngFor="let m_locality of localityData">{{m_locality.locality_name}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls.locality.value == 'Others'">
<input matInput placeholder="Specify Locality"
formControlName="locality_others">
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Approach to PD Location" formControlName="pd_location" required>
<mat-option value="{{data.pd_location_approach_id}}"
*ngFor="let data of locationdata">{{data.description}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Comment on Locality" formControlName="comment_locality" required>
<mat-option value="{{data.comments_on_locality_id}}"
*ngFor="let data of commentData">{{data.rating}}
</mat-option>
</mat-select>
</mat-form-field>
<!-- Don't Remove To replace atlast of the PD Completion and creating new form (Customer Behaviour 221118 review doc : s.no 3.e )
<mat-form-field>
<mat-select placeholder="Customer Behaviour"
formControlName="customer_behaviour" required>
<mat-option value="{{data.customer_behaviour_id}}"
*ngFor="let data of customerData">{{data.description}}
</mat-option>
</mat-select>
</mat-form-field>--(Customer Behaviour)-->
<mat-form-field>
<mat-select placeholder="Ownership" formControlName="address_ownership">
<mat-option value="{{ownerShip.id}}"
*ngFor="let ownerShip of ownerShipData">
{{ownerShip.name}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls['address_ownership'].value == 4 ">
<input matInput placeholder="Specify Other Ownership" formControlName="other_ownership">
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Is there any business activity is being run?"
formControlName="bussiness_activity" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls['bussiness_activity'].value == 'yes'">
<mat-select placeholder="Bussiness Type" formControlName="bussiness_address_type">
<mat-option value="{{m_addressType.address_type_id}}"
*ngFor="let m_addressType of addressData">{{m_addressType.address_type}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls['bussiness_address_type'].value == 12">
<input matInput placeholder="Bussiness Address Type Others" formControlName="bussiness_address_type_others">
</mat-form-field>
<!--- Don't Remove To replace atlast of the PD Completion and creating new form (Neighbourhood check) --
<mat-card>
<mat-card-header>
<p>Neighbourhood</p>
</mat-card-header>
<div formArrayName="neighbourhood">
<div *ngFor="let item of addressForm.controls.neighbourhood['controls']; let i=index" >
<mat-card-content class="matcard" [formGroup]="item">
<div>
<mat-form-field>
<input matInput placeholder="Neighbour Name"
formControlName="name" required>
</mat-form-field>
</div>
<div>
<mat-form-field>
<mat-select placeholder="Do you know"
formControlName="do_you_know" required>
<mat-option value="{{m_neighbourStatus}}"
*ngFor="let m_neighbourStatus of neighbourStatusData">{{m_neighbourStatus}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Is the applicant owner"
formControlName="is_owner" required>
<mat-option value="{{m_applicantOwner}}"
*ngFor="let m_applicantOwner of applicantOwnerData">{{m_applicantOwner}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<!-- <mat-form-field>
<input matInput placeholder="How long do you know the applicant"
formControlName="how_long">
</mat-form-field> ->-
<div>
<label>How long do you know the applicant?</label>
<br>
<mat-form-field>
<input matInput type="number" placeholder="Year" formControlName="how_long_year" required min='0'>
</mat-form-field>
<mat-form-field>
<input matInput type="number" placeholder="Month" formControlName="how_long_month" required min='0' max='12'>
</mat-form-field>
</div>
<button type="button" matTooltip="Add More Neighbour Details" class="mr-1 mb-1 hover-icon" matTooltipPosition="above" mat-raised-button mat-icon-button *ngIf="i==0"
(click)="addNeighbour($event)"
color="primary" style="float: right;">
<mat-icon>add</mat-icon>
</button>
<button type="button" matTooltip="Delete" class="mr-1 mb-1 hover-icon" matTooltipPosition="above" mat-raised-button mat-icon-button *ngIf="i>0"
(click)="removeNeighbour(i)"
style="float: right;">
<mat-icon>delete</mat-icon>
</button>
</mat-card-content>
</div>
</div>
</mat-card>
End of Neighbourhood Check-->
</mat-card-content>
</mat-card>
</div>
</div>
</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">
<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>
</ng-template>
</mat-tab>
</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="address_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 mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Save" matTooltipPosition="above" type="submit" (click)="onSubmit()"><mat-icon>save</mat-icon></button>
</div> </div>
</mat-card> </mat-dialog-actions>
End of Neighbourhood Check-->
<div fxLayout="row">
<div fxFlex="60" class="pb-0 text-sm-left">
<mat-form-field appearance="outline" style="width: 100%">
<mat-label>Remarks</mat-label>
<textarea matInput placeholder="Remarks" formControlName="address_form_remark"></textarea>
</mat-form-field>
</div>
</div>
<div class="row" style="text-align:right;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Save" matTooltipPosition="above" type="submit" (click)="onSubmit()"><mat-icon>save</mat-icon></button>
</div>
</form> </form>
<notifier-container></notifier-container>
</mat-card-content>
</mat-card>

116
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/address/address.component.scss
View File

@ -1,19 +1,103 @@
.address { .paragraph_change {
display: flex; color: #e00201 !important;
padding: 0 2%;
flex-direction: column;
} }
.mat-card-content {
background-color: white;
}
.mat-card-actions {
background-color: white;
}
.address > * { mat-form-field {
width: 100%; margin: 0 2%;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
} }
.matcard mat-form-field {
margin: 0 2%; // .address {
width:40%; // display: flex;
} // padding: 0 2%;
.address .button { // flex-direction: column;
float: right; // }
width: 10px;
background: #62B013; // .address > * {
color: white; // width: 100%;
} // }
// .matcard mat-form-field {
// margin: 0 2%;
// width:40%;
// }
// .address .button {
// float: right;
// width: 10px;
// background: #62B013;
// color: white;
// }

42
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/address/address.component.ts
View File

@ -1,13 +1,11 @@
import { import {
Component, Component,OnInit,
OnInit, Inject, Output,
Inject,
Input, ElementRef Input, ElementRef
} from '@angular/core'; } from '@angular/core';
import { import {
FormBuilder, FormBuilder, FormGroup,
FormGroup,
Validators, Validators,
FormArray, FormControl, AbstractControl, FormArray, FormControl, AbstractControl,
} from '@angular/forms'; } from '@angular/forms';
@ -28,9 +26,17 @@ import {ActivatedRoute, Router} from "@angular/router";
templateUrl: './address.component.html', templateUrl: './address.component.html',
styleUrls: ['./address.component.scss'] styleUrls: ['./address.component.scss']
}) })
export class AddressComponent implements OnInit {
@Input() pdid: number;
export class AddressComponent implements OnInit {
pageTitle: string ="PD Address Details";
//@Input() pdid: number;
pdid : number;
form_id: number;
loadDataStatus: boolean=true;
locationdata: any = []; locationdata: any = [];
commentData: any = []; commentData: any = [];
//customerData: any = []; 221118 review doc s.no 3.e //customerData: any = []; 221118 review doc s.no 3.e
@ -44,25 +50,31 @@ export class AddressComponent implements OnInit {
public currentLoanForm: FormGroup; public currentLoanForm: FormGroup;
private notifier: NotifierService; private notifier: NotifierService;
public addressForm: FormGroup; public addressForm: FormGroup;
public address: AbstractControl; public address: AbstractControl;
public addressType: AbstractControl; public addressType: AbstractControl;
public locality: AbstractControl; public locality: AbstractControl;
public pdLocation: AbstractControl; public pdLocation: AbstractControl;
public commentlocality: AbstractControl; public commentlocality: AbstractControl;
public customerBehaviour: AbstractControl; public customerBehaviour: AbstractControl;
public ownership: AbstractControl; public ownership: AbstractControl;
public other_ownership: AbstractControl;
public bussinessActivity: AbstractControl; public bussinessActivity: AbstractControl;
//constructor(notifier: NotifierService,private _fb: FormBuilder,private _pd: PdTrigerService , ) {
constructor(private el: ElementRef, notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute, constructor(private el: ElementRef, notifier: NotifierService,
private fb: FormBuilder,
private route: ActivatedRoute,
private router: Router, private router: Router,
private _pd: PdTrigerService) { private _pd: PdTrigerService,
@Inject(MAT_DIALOG_DATA) public pd_all_details: any)
{
this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.form_id = 5;
this.notifier = notifier; this.notifier = notifier;
} }
ngOnInit() { ngOnInit() {
console.clear(); console.clear();
this.getMasterDetails('PDLOCATIONAPPROACH',1); this.getMasterDetails('PDLOCATIONAPPROACH',1);
this.getMasterDetails('COMMENTSONLOCALITY',2); this.getMasterDetails('COMMENTSONLOCALITY',2);
//this.getMasterDetails('CUSTOMERBEHAVIOUR',3);review doc s.no 3.e //this.getMasterDetails('CUSTOMERBEHAVIOUR',3);review doc s.no 3.e
@ -91,6 +103,7 @@ export class AddressComponent implements OnInit {
this.addressForm.controls.locality.setValue(data.records.locality); this.addressForm.controls.locality.setValue(data.records.locality);
this.addressForm.controls.address_form_remark.setValue(data.records.address_form_remark); this.addressForm.controls.address_form_remark.setValue(data.records.address_form_remark);
this.addressForm.controls.address_ownership.setValue(data.records.address_ownership); this.addressForm.controls.address_ownership.setValue(data.records.address_ownership);
this.addressForm.controls.other_ownership.setValue(data.records.other_ownership);
this.addressForm.controls.bussiness_activity.setValue(data.records.bussiness_activity); this.addressForm.controls.bussiness_activity.setValue(data.records.bussiness_activity);
if(data.records.bussiness_activity == 'yes') { if(data.records.bussiness_activity == 'yes') {
this.addressForm.controls.bussiness_address_type.setValue(data.records.bussiness_address_type); this.addressForm.controls.bussiness_address_type.setValue(data.records.bussiness_address_type);
@ -127,6 +140,7 @@ export class AddressComponent implements OnInit {
//neighbourhood: this.fb.array([]), //neighbourhood: this.fb.array([]),
address_form_remark:[''], address_form_remark:[''],
address_ownership:[''], address_ownership:[''],
other_ownership:[''],
bussiness_activity:[''], bussiness_activity:[''],
bussiness_address_type:[''], bussiness_address_type:[''],
bussiness_address_type_others: [''] bussiness_address_type_others: ['']
@ -138,6 +152,7 @@ export class AddressComponent implements OnInit {
this.commentlocality = this.addressForm.controls['comment_locality']; this.commentlocality = this.addressForm.controls['comment_locality'];
//this.customerBehaviour = this.addressForm.controls['customer_behaviour']; //this.customerBehaviour = this.addressForm.controls['customer_behaviour'];
this.ownership = this.addressForm.controls['address_ownership']; this.ownership = this.addressForm.controls['address_ownership'];
this.other_ownership = this.addressForm.controls['other_ownership'];
this.bussinessActivity = this.addressForm.controls['bussiness_activity']; this.bussinessActivity = this.addressForm.controls['bussiness_activity'];
// this.bussiessAddressType = this.addressForm.controls['bussiness_address_type']; // this.bussiessAddressType = this.addressForm.controls['bussiness_address_type'];
} }
@ -207,6 +222,7 @@ export class AddressComponent implements OnInit {
//records.neighbourhood = this.addressForm.controls.neighbourhood.value; //records.neighbourhood = this.addressForm.controls.neighbourhood.value;
records.address_form_remark = this.addressForm.controls.address_form_remark.value; records.address_form_remark = this.addressForm.controls.address_form_remark.value;
records.address_ownership = this.ownership.value; records.address_ownership = this.ownership.value;
records.other_ownership = this.other_ownership.value;
records.bussiness_activity = this.bussinessActivity.value; records.bussiness_activity = this.bussinessActivity.value;
if (this.bussinessActivity.value == 'yes') { if (this.bussinessActivity.value == 'yes') {
records.bussiness_address_type = this.addressForm.controls.bussiness_address_type.value; records.bussiness_address_type = this.addressForm.controls.bussiness_address_type.value;

705
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/assessed-income/assessed-income.component.html
View File

@ -1,309 +1,408 @@
<form [formGroup]="_assessedIncomeFormFrom"> <form [formGroup]="_assessedIncomeFormFrom">
<!-- house hold expenses start-->
<!-- hide table based start --> <h2 mat-dialog-title class="paragraph_change">
<!-- <mat-card> <div fxFlex="70" align="left">
<mat-card-content *ngFor="let tbl of salesMonthWiseTable; let tableIndex=index"> {{pageTitle}}
<table> </div>
<caption>{{tbl.salesItem}}</caption> <div fxFlex="30" align="end">
<thead> <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>
<tr>
<th *ngFor="let tblHeader of tbl.headerElement; let tableHeaderIndex=index"> </div>
{{tblHeader.header}} </h2>
</th>
</tr> <mat-dialog-content>
</thead>
<tbody>
<tr> <mat-tab-group>
<td *ngFor="let tblBody of tbl.bodyElements;"> <mat-tab label="Questions">
<table> <ng-template matTabContent>
<tbody> <div fxLayout="row wrap">
<tr *ngFor="let tblBodyTr of tblBody.bodyElement;"> <div fxFlex="100">
<td>{{tblBodyTr.sales_date | date: 'dd-MM-yyyy'}}</td>
<td>{{tblBodyTr.sales_value}}</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="2">{{tblBody.bodyElementTotal}}</td>
</tr>
</tfoot>
</table>
</td>
</tr>
</tbody>
<tfoot>
<tr *ngFor="let parentTabFooter of tbl.parentTableFooter">
<td colspan="parentTabFooter.cols_span_length">{{parentTabFooter.message}}</td>
<td>{{parentTabFooter.value}}</td>
</tr>
</tfoot> <mat-card>
<mat-card-content>
</table> <mat-form-field>
</mat-card-content> <input matInput placeholder="Sales Declared By Customer" formControlName="sales_declared_by_customer">
</mat-card> --> </mat-form-field>
<!-- hide table based end --> <mat-accordion multi="false">
<mat-expansion-panel>
<mat-card> <mat-expansion-panel-header>
<mat-card-content> <mat-panel-title>
<mat-form-field> <small class="expan_table_header">Sales Calculate Item Wise</small>
<input matInput placeholder="Sales Declared By Customer" formControlName="sales_declared_by_customer"> </mat-panel-title>
</mat-form-field> <mat-panel-description class="subtitle_message">
<mat-accordion multi="false"> {{salesCaluatedItem.length}} &nbsp;Items
<mat-expansion-panel> </mat-panel-description>
<mat-expansion-panel-header> </mat-expansion-panel-header>
<mat-panel-title> <ng-template matExpansionPanelContent>
<small class="expan_table_header">Sales Calculate Item Wise</small> <div class="example-container mat-elevation-z8">
</mat-panel-title> <table mat-table [dataSource]="salesCaluatedItem">
<mat-panel-description class="subtitle_message"> <!-- Item Column -->
{{salesCaluatedItem.length}} &nbsp;Items <ng-container matColumnDef="Item">
</mat-panel-description> <th mat-header-cell *matHeaderCellDef>Item</th>
</mat-expansion-panel-header> <td mat-cell *matCellDef="let salesItem">{{salesItem.sales_item}} </td>
<ng-template matExpansionPanelContent> </ng-container>
<div class="example-container mat-elevation-z8"> <!-- Qty/Uom Column-->
<table mat-table [dataSource]="salesCaluatedItem"> <ng-container matColumnDef="Qty/UOM">
<!-- Item Column --> <th mat-header-cell *matHeaderCellDef>Qty/UOM</th>
<ng-container matColumnDef="Item"> <td mat-cell *matCellDef="let salesItem">{{salesItem.sales_qty }}/{{salesItem.uom_name }} </td>
<th mat-header-cell *matHeaderCellDef>Item</th> </ng-container>
<td mat-cell *matCellDef="let salesItem">{{salesItem.sales_item}} </td> <!-- Rate/Unit Column-->
</ng-container> <ng-container matColumnDef="Rate/Unit">
<!-- Qty/Uom Column--> <th mat-header-cell *matHeaderCellDef>Rate/Unit</th>
<ng-container matColumnDef="Qty/UOM"> <td mat-cell *matCellDef="let salesItem"> {{salesItem.rate_per_unit }} </td>
<th mat-header-cell *matHeaderCellDef>Qty/UOM</th> </ng-container>
<td mat-cell *matCellDef="let salesItem">{{salesItem.sales_qty }}/{{salesItem.uom_name }} </td> <!-- Frequency Name Column -->
</ng-container>
<!-- Rate/Unit Column--> <ng-container matColumnDef="Frequency">
<ng-container matColumnDef="Rate/Unit"> <th mat-header-cell *matHeaderCellDef>Frequency</th>
<th mat-header-cell *matHeaderCellDef>Rate/Unit</th> <td mat-cell *matCellDef="let salesItem"> {{salesItem.frequency_name}} </td>
<td mat-cell *matCellDef="let salesItem"> {{salesItem.rate_per_unit }} </td> </ng-container>
</ng-container> <!-- Annual Sale Value Column-->
<!-- Frequency Name Column --> <ng-container matColumnDef="Annual Sale Value">
<th mat-header-cell *matHeaderCellDef>Annual Sale Value</th>
<ng-container matColumnDef="Frequency"> <td mat-cell *matCellDef="let salesItem"> {{salesItem.annual_sale_value}} </td>
<th mat-header-cell *matHeaderCellDef>Frequency</th> </ng-container>
<td mat-cell *matCellDef="let salesItem"> {{salesItem.frequency_name}} </td>
</ng-container> <tr mat-header-row *matHeaderRowDef="salesCaluatedItemColumns; sticky: true"></tr>
<!-- Annual Sale Value Column--> <tr mat-row *matRowDef="let row; columns: salesCaluatedItemColumns;"></tr>
<ng-container matColumnDef="Annual Sale Value"> </table>
<th mat-header-cell *matHeaderCellDef>Annual Sale Value</th> </div>
<td mat-cell *matCellDef="let salesItem"> {{salesItem.annual_sale_value}} </td> </ng-template>
</ng-container> </mat-expansion-panel>
<mat-expansion-panel>
<tr mat-header-row *matHeaderRowDef="salesCaluatedItemColumns; sticky: true"></tr> <mat-expansion-panel-header>
<tr mat-row *matRowDef="let row; columns: salesCaluatedItemColumns;"></tr> <mat-panel-title>
</table> <small class="expan_table_header">Sales Calculate Month Wise</small>
</div> </mat-panel-title>
</ng-template> <mat-panel-description class="subtitle_message">
</mat-expansion-panel> {{salesMonthWiseExpandedItems.length}} &nbsp;Items
<mat-expansion-panel> </mat-panel-description>
<mat-expansion-panel-header> </mat-expansion-panel-header>
<mat-panel-title> <ng-template matExpansionPanelContent>
<small class="expan_table_header">Sales Calculate Month Wise</small> <!-- <mat-accordion multi="true">
</mat-panel-title> <mat-expansion-panel *ngFor="let expandDetails of salesMonthWiseExpandedItems">
<mat-panel-description class="subtitle_message"> <mat-expansion-panel-header>
{{salesMonthWiseExpandedItems.length}} &nbsp;Items <mat-panel-title>
</mat-panel-description> <small class="expan_table_header">{{expandDetails.salesItem}}</small>
</mat-expansion-panel-header> </mat-panel-title>
<ng-template matExpansionPanelContent> </mat-expansion-panel-header>
<!-- <mat-accordion multi="true"> <ng-template matExpansionPanelContent>
<mat-expansion-panel *ngFor="let expandDetails of salesMonthWiseExpandedItems">
<mat-expansion-panel-header>
<mat-panel-title> </ng-template>
<small class="expan_table_header">{{expandDetails.salesItem}}</small>
</mat-panel-title> <mat-action-row *ngFor="let footer of expandDetails.footerMessage">
</mat-expansion-panel-header> <div fxFlex="50" >
<ng-template matExpansionPanelContent> <small class="expan_footer">{{footer.month_message}}</small>
</div>
<div fxFlex="50" >
</ng-template> <small class="expan_footer">{{footer.year_message}}</small>
</div>
<mat-action-row *ngFor="let footer of expandDetails.footerMessage"> </mat-action-row>
<div fxFlex="50" > </mat-expansion-panel>
<small class="expan_footer">{{footer.month_message}}</small> </mat-accordion> -->
</div> <mat-card *ngFor="let expandDetails of salesMonthWiseExpandedItems">
<div fxFlex="50" > <mat-card-header>
<small class="expan_footer">{{footer.year_message}}</small> <mat-card-title><small class="expan_table_header">{{expandDetails.salesItem}}</small></mat-card-title>
</div> <mat-card-subtitle class="subtitle_message" *ngFor="let footer of expandDetails.footerMessage">
</mat-action-row> <div fxFlex="100">
</mat-expansion-panel> {{footer.month_message}} &nbsp;&nbsp;{{footer.year_message}}
</mat-accordion> --> </div>
<mat-card *ngFor="let expandDetails of salesMonthWiseExpandedItems">
<mat-card-header> </mat-card-subtitle>
<mat-card-title><small class="expan_table_header">{{expandDetails.salesItem}}</small></mat-card-title> </mat-card-header>
<mat-card-subtitle class="subtitle_message" *ngFor="let footer of expandDetails.footerMessage"> <mat-divider></mat-divider>
<div fxFlex="100"> <mat-card-content style="display: flex;margin-top: -20px;">
{{footer.month_message}} &nbsp;&nbsp;{{footer.year_message}} <!-- <div fxLayout="row wrap">
</div> </div> -->
<div fxFlex="50" *ngFor="let eachItem of expandDetails.expandElements" class="m-gap p-gap">
<h4 align="center" class="h4_font">{{eachItem.header}}</h4>
<table mat-table [dataSource]="eachItem.value" class="mat-elevation-z8">
<ng-container matColumnDef="Date">
<th mat-header-cell *matHeaderCellDef>Date</th>
<td mat-cell *matCellDef="let itemValue">{{itemValue.sales_date | date: 'dd-MM-yyyy'}} </td>
<td mat-footer-cell *matFooterCellDef> Total </td>
</ng-container>
<!-- Value Column-->
<ng-container matColumnDef="Amount">
<th mat-header-cell *matHeaderCellDef>Amount</th>
<td mat-cell *matCellDef="let itemValue">{{itemValue.sales_value}}</td>
<td mat-footer-cell *matFooterCellDef> {{getTotalCost(eachItem.value)}} </td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="salesMonthItemColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: salesMonthItemColumns;"></tr>
<tr mat-footer-row *matFooterRowDef="salesMonthItemColumns; sticky: true"></tr>
</table>
</div>
</mat-card-content>
</mat-card>
</mat-card-subtitle> </ng-template>
</mat-card-header> </mat-expansion-panel>
<mat-divider></mat-divider>
<mat-card-content style="display: flex;margin-top: -20px;"> <mat-expansion-panel>
<!-- <div fxLayout="row wrap"> <mat-expansion-panel-header>
</div> --> <mat-panel-title>
<div fxFlex="50" *ngFor="let eachItem of expandDetails.expandElements" class="m-gap p-gap"> <small class="expan_table_header">Purchase Details</small>
</mat-panel-title>
<h4 align="center" class="h4_font">{{eachItem.header}}</h4> <mat-panel-description class="subtitle_message">
<table mat-table [dataSource]="eachItem.value" class="mat-elevation-z8"> {{purchaseDetails.length}} &nbsp;Items
<ng-container matColumnDef="Date"> </mat-panel-description>
<th mat-header-cell *matHeaderCellDef>Date</th> </mat-expansion-panel-header>
<td mat-cell *matCellDef="let itemValue">{{itemValue.sales_date | date: 'dd-MM-yyyy'}} </td> <ng-template matExpansionPanelContent>
<td mat-footer-cell *matFooterCellDef> Total </td> <div class="example-container mat-elevation-z8">
</ng-container> <table mat-table [dataSource]="purchaseDetails">
<!-- Value Column--> <!-- Item Column -->
<ng-container matColumnDef="Amount"> <ng-container matColumnDef="Item">
<th mat-header-cell *matHeaderCellDef>Amount</th> <th mat-header-cell *matHeaderCellDef>Item</th>
<td mat-cell *matCellDef="let itemValue">{{itemValue.sales_value}}</td> <td mat-cell *matCellDef="let purchaseItem">{{purchaseItem.purchase_item}} </td>
<td mat-footer-cell *matFooterCellDef> {{getTotalCost(eachItem.value)}} </td> </ng-container>
</ng-container> <!-- Qty/Uom Column-->
<ng-container matColumnDef="Qty/UOM">
<tr mat-header-row *matHeaderRowDef="salesMonthItemColumns; sticky: true"></tr> <th mat-header-cell *matHeaderCellDef>Qty/UOM</th>
<tr mat-row *matRowDef="let row; columns: salesMonthItemColumns;"></tr> <td mat-cell *matCellDef="let purchaseItem">{{purchaseItem.purchase_qty }}/{{purchaseItem.uom_name }} </td>
<tr mat-footer-row *matFooterRowDef="salesMonthItemColumns; sticky: true"></tr> </ng-container>
</table> <!-- Rate/Unit Column-->
</div> <ng-container matColumnDef="Rate/Unit">
<th mat-header-cell *matHeaderCellDef>Rate/Unit</th>
</mat-card-content> <td mat-cell *matCellDef="let purchaseItem"> {{purchaseItem.rate_per_unit }} </td>
</ng-container>
</mat-card> <!-- Frequency Name Column -->
<ng-container matColumnDef="Frequency">
<th mat-header-cell *matHeaderCellDef>Frequency</th>
<td mat-cell *matCellDef="let purchaseItem"> {{purchaseItem.frequency_name}} </td>
</ng-container>
<!-- Annual Sale Value Column-->
<ng-container matColumnDef="Annual Purchase Value">
<th mat-header-cell *matHeaderCellDef>Annual Purchase Value</th>
<td mat-cell *matCellDef="let purchaseItem"> {{purchaseItem.annual_purchase_value}} </td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="purchaseDetailsColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: purchaseDetailsColumns;"></tr>
</table>
</div>
</ng-template>
</mat-expansion-panel>
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title>
<small class="expan_table_header">Business Expenses</small>
</mat-panel-title>
<mat-panel-description class="subtitle_message">
{{businessExpenses.length}} &nbsp;Items
</mat-panel-description>
</mat-expansion-panel-header>
<ng-template matExpansionPanelContent>
<div class="example-container mat-elevation-z8">
<table mat-table [dataSource]="businessExpenses">
<!-- Expense Item Column -->
<ng-container matColumnDef="Item">
<th mat-header-cell *matHeaderCellDef>Item</th>
<td mat-cell *matCellDef="let businessEx"> {{businessEx.expense_item}} </td>
</ng-container>
<!-- Expense Value Column-->
<ng-container matColumnDef="Value">
<th mat-header-cell *matHeaderCellDef>Value</th>
<td mat-cell *matCellDef="let businessEx"> {{businessEx.expense_value }} </td>
</ng-container>
<!-- Frequency Name Column -->
<ng-container matColumnDef="Frequency">
<th mat-header-cell *matHeaderCellDef>Frequency</th>
<td mat-cell *matCellDef="let businessEx"> {{businessEx.frequency_name}} </td>
</ng-container>
<!-- Annual Expenses Value Column-->
<ng-container matColumnDef="Annual Expenses Value">
<th mat-header-cell *matHeaderCellDef>Annual Expenses Value</th>
<td mat-cell *matCellDef="let businessEx"> {{businessEx.annual_expenses_value}} </td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="businessExpensesColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: businessExpensesColumns;"></tr>
</table>
</div>
</ng-template>
</mat-expansion-panel>
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title>
<small class="expan_table_header">House Hold Expenses</small>
</mat-panel-title>
<mat-panel-description class="subtitle_message">
{{houseHoldExpenses.length}} &nbsp;Items
</mat-panel-description>
</mat-expansion-panel-header>
<ng-template matExpansionPanelContent>
<div class="example-container mat-elevation-z8">
<table mat-table [dataSource]="houseHoldExpenses">
<!-- Item Column -->
<ng-container matColumnDef="Item">
<th mat-header-cell *matHeaderCellDef>Item</th>
<td mat-cell *matCellDef="let householdItem">{{householdItem.expense_item}} </td>
</ng-container>
<!-- Value Column-->
<ng-container matColumnDef="Value">
<th mat-header-cell *matHeaderCellDef>Value</th>
<td mat-cell *matCellDef="let householdItem">{{householdItem.expense_value }}</td>
</ng-container>
<!-- Frequency Name Column -->
<ng-container matColumnDef="Frequency">
<th mat-header-cell *matHeaderCellDef>Frequency</th>
<td mat-cell *matCellDef="let householdItem"> {{householdItem.frequency_name}} </td>
</ng-container>
<!-- Annual Expense Value Column-->
<ng-container matColumnDef="Annual Expenses Value">
<th mat-header-cell *matHeaderCellDef>Annual Expenses Value</th>
<td mat-cell *matCellDef="let householdItem"> {{householdItem.annual_expense_value}} </td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="houseHoldExpensesColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: houseHoldExpensesColumns;"></tr>
</table>
</div>
</ng-template>
</mat-expansion-panel>
</mat-accordion>
</mat-card-content>
</mat-card>
</div>
</div>
</ng-template> </ng-template>
</mat-expansion-panel> </mat-tab>
<mat-tab label="Docs">
<mat-expansion-panel> <ng-template matTabContent>
<mat-expansion-panel-header> <div fxLayout="row wrap">
<mat-panel-title> <div fxFlex="25" class="m-gap p-gap">
<small class="expan_table_header">Purchase Details</small> <div class="p-list-main mb-2">
</mat-panel-title> <div class="p-list">
<mat-panel-description class="subtitle_message">
{{purchaseDetails.length}} &nbsp;Items <div class="top"><img src="./../../../../../../../assets/images/face2.jpg" alt=""/></div>
</mat-panel-description> <div class="bottom">
</mat-expansion-panel-header> <div class="left">
<ng-template matExpansionPanelContent> <div class="details">
<div class="example-container mat-elevation-z8"> <small>Nivi SKM</small>
<table mat-table [dataSource]="purchaseDetails"> <!-- <p>{{docs.pd_document_name}}</p> -->
<!-- Item Column --> </div>
<ng-container matColumnDef="Item"> <!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
<th mat-header-cell *matHeaderCellDef>Item</th> </div>
<td mat-cell *matCellDef="let purchaseItem">{{purchaseItem.purchase_item}} </td> </div>
</ng-container> </div>
<!-- Qty/Uom Column--> </div>
<ng-container matColumnDef="Qty/UOM"> </div>
<th mat-header-cell *matHeaderCellDef>Qty/UOM</th> <div fxFlex="25" class="m-gap p-gap">
<td mat-cell *matCellDef="let purchaseItem">{{purchaseItem.purchase_qty }}/{{purchaseItem.uom_name }} </td> <div class="p-list-main mb-2">
</ng-container> <div class="p-list">
<!-- Rate/Unit Column-->
<ng-container matColumnDef="Rate/Unit"> <div class="top"><img src="./../../../../../../../assets/images/face1.jpg" alt=""/></div>
<th mat-header-cell *matHeaderCellDef>Rate/Unit</th> <div class="bottom">
<td mat-cell *matCellDef="let purchaseItem"> {{purchaseItem.rate_per_unit }} </td> <div class="left">
</ng-container> <div class="details">
<!-- Frequency Name Column --> <small>Nivi SKM</small>
<!-- <p>{{docs.pd_document_name}}</p> -->
<ng-container matColumnDef="Frequency"> </div>
<th mat-header-cell *matHeaderCellDef>Frequency</th> <!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
<td mat-cell *matCellDef="let purchaseItem"> {{purchaseItem.frequency_name}} </td> </div>
</ng-container> </div>
<!-- Annual Sale Value Column--> </div>
<ng-container matColumnDef="Annual Purchase Value"> </div>
<th mat-header-cell *matHeaderCellDef>Annual Purchase Value</th> </div>
<td mat-cell *matCellDef="let purchaseItem"> {{purchaseItem.annual_purchase_value}} </td> <div fxFlex="25" class="m-gap p-gap">
</ng-container> <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">
<tr mat-header-row *matHeaderRowDef="purchaseDetailsColumns; sticky: true"></tr> <div class="top"><img src="./../../../../../../../assets/images/face1.jpg" alt=""/></div>
<tr mat-row *matRowDef="let row; columns: purchaseDetailsColumns;"></tr> <div class="bottom">
</table> <div class="left">
</div> <div class="details">
</ng-template> <small>Nivi SKM</small>
</mat-expansion-panel> <!-- <p>{{docs.pd_document_name}}</p> -->
<mat-expansion-panel> </div>
<mat-expansion-panel-header> <!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
<mat-panel-title> </div>
<small class="expan_table_header">Business Expenses</small> </div>
</mat-panel-title> </div>
<mat-panel-description class="subtitle_message"> </div>
{{businessExpenses.length}} &nbsp;Items </div>
</mat-panel-description> <div fxFlex="25" class="m-gap p-gap">
</mat-expansion-panel-header> <div class="p-list-main mb-2">
<ng-template matExpansionPanelContent> <div class="p-list">
<div class="example-container mat-elevation-z8">
<table mat-table [dataSource]="businessExpenses"> <div class="top"><img src="./../../../../../../../assets/images/face1.jpg" alt=""/></div>
<!-- Expense Item Column --> <div class="bottom">
<ng-container matColumnDef="Item"> <div class="left">
<th mat-header-cell *matHeaderCellDef>Item</th> <div class="details">
<td mat-cell *matCellDef="let businessEx"> {{businessEx.expense_item}} </td> <small>Nivi SKM</small>
</ng-container> <!-- <p>{{docs.pd_document_name}}</p> -->
</div>
<!-- Expense Value Column--> <!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
<ng-container matColumnDef="Value"> </div>
<th mat-header-cell *matHeaderCellDef>Value</th> </div>
<td mat-cell *matCellDef="let businessEx"> {{businessEx.expense_value }} </td> </div>
</ng-container> </div>
<!-- Frequency Name Column --> </div>
<ng-container matColumnDef="Frequency">
<th mat-header-cell *matHeaderCellDef>Frequency</th> </div>
<td mat-cell *matCellDef="let businessEx"> {{businessEx.frequency_name}} </td>
</ng-container> </ng-template>
<!-- Annual Expenses Value Column--> </mat-tab>
<ng-container matColumnDef="Annual Expenses Value">
<th mat-header-cell *matHeaderCellDef>Annual Expenses Value</th> </mat-tab-group>
<td mat-cell *matCellDef="let businessEx"> {{businessEx.annual_expenses_value}} </td>
</ng-container> </mat-dialog-content>
<mat-dialog-actions>
<tr mat-header-row *matHeaderRowDef="businessExpensesColumns; sticky: true"></tr> <!-- <div fxFlex="60" class="pb-0 text-sm-left" align="left">
<tr mat-row *matRowDef="let row; columns: businessExpensesColumns;"></tr> <mat-form-field appearance="outline" style="width: 100%">
</table> <mat-label>Remarks</mat-label>
</div> <textarea matInput placeholder="Remarks" formControlName="personal_info_form_remark" required></textarea>
</ng-template> </mat-form-field>
</mat-expansion-panel> </div>
<mat-expansion-panel> <div fxFlex="40" align="end">
<mat-expansion-panel-header> <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>
<mat-panel-title> </div> -->
<small class="expan_table_header">House Hold Expenses</small> </mat-dialog-actions>
</mat-panel-title>
<mat-panel-description class="subtitle_message">
{{houseHoldExpenses.length}} &nbsp;Items
</mat-panel-description>
</mat-expansion-panel-header>
<ng-template matExpansionPanelContent>
<div class="example-container mat-elevation-z8">
<table mat-table [dataSource]="houseHoldExpenses">
<!-- Item Column -->
<ng-container matColumnDef="Item">
<th mat-header-cell *matHeaderCellDef>Item</th>
<td mat-cell *matCellDef="let householdItem">{{householdItem.expense_item}} </td>
</ng-container>
<!-- Value Column-->
<ng-container matColumnDef="Value">
<th mat-header-cell *matHeaderCellDef>Value</th>
<td mat-cell *matCellDef="let householdItem">{{householdItem.expense_value }}</td>
</ng-container>
<!-- Frequency Name Column -->
<ng-container matColumnDef="Frequency">
<th mat-header-cell *matHeaderCellDef>Frequency</th>
<td mat-cell *matCellDef="let householdItem"> {{householdItem.frequency_name}} </td>
</ng-container>
<!-- Annual Expense Value Column-->
<ng-container matColumnDef="Annual Expenses Value">
<th mat-header-cell *matHeaderCellDef>Annual Expenses Value</th>
<td mat-cell *matCellDef="let householdItem"> {{householdItem.annual_expense_value}} </td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="houseHoldExpensesColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: houseHoldExpensesColumns;"></tr>
</table>
</div>
</ng-template>
</mat-expansion-panel>
</mat-accordion>
</mat-card-content>
</mat-card>
</form> </form>
<notifier-container></notifier-container>

86
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/assessed-income/assessed-income.component.scss
View File

@ -33,6 +33,92 @@ tr.mat-footer-row {
color:#e00201 !important; color:#e00201 !important;
} }
.paragraph_change {
color: #e00201 !important;
}
.mat-card-content {
background-color: white;
}
.mat-card-actions {
background-color: white;
}
mat-form-field {
margin: 0 2%;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
}
// table, th, td { // table, th, td {
// border: 1px solid rgba(0, 0, 0, 0.12); // border: 1px solid rgba(0, 0, 0, 0.12);
// border-collapse: collapse; // border-collapse: collapse;

21
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/assessed-income/assessed-income.component.ts
View File

@ -1,6 +1,11 @@
import {Component,OnInit,Inject,Input, ViewChild } from '@angular/core'; import {Component,OnInit,Inject,Input, ViewChild } from '@angular/core';
import {FormBuilder,FormGroup,Validators,FormArray, FormControl,} from '@angular/forms'; import {FormBuilder,FormGroup,Validators,FormArray, FormControl,} from '@angular/forms';
import { NotifierService } from 'angular-notifier'; import { NotifierService } from 'angular-notifier';
import {
MatDialog,
MatDialogRef,
MAT_DIALOG_DATA
} from '@angular/material';
/** Service */ /** Service */
import { PdTrigerService } from '../../../../../pd-service/pd-triger.service'; import { PdTrigerService } from '../../../../../pd-service/pd-triger.service';
import { ActivatedRoute, Router } from "@angular/router"; import { ActivatedRoute, Router } from "@angular/router";
@ -13,8 +18,11 @@ import { ActivatedRoute, Router } from "@angular/router";
export class AssessedIncomeComponent implements OnInit { export class AssessedIncomeComponent implements OnInit {
public _assessedIncomeFormFrom: FormGroup; public _assessedIncomeFormFrom: FormGroup;
private notifier: NotifierService; private notifier: NotifierService;
@Input() pdid: number; pageTitle: string ="Assessed Income Details";
@Input() form_id: number; // @Input() pdid: number;
// @Input() form_id: number;
pdid: number;
form_id: number;
salesCaluatedItemColumns: string[] = ['Item', 'Qty/UOM','Rate/Unit','Frequency','Annual Sale Value']; salesCaluatedItemColumns: string[] = ['Item', 'Qty/UOM','Rate/Unit','Frequency','Annual Sale Value'];
public salesCaluatedItem:any= []; public salesCaluatedItem:any= [];
salesItemMonthWiseColumns: string[] = ['Item', 'Value','Frequency','Annual Expenses Value']; salesItemMonthWiseColumns: string[] = ['Item', 'Value','Frequency','Annual Expenses Value'];
@ -39,9 +47,12 @@ salesMonthWiseExpandedItems: any=[]
constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute, constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute,
private router: Router, private router: Router,
private _pd: PdTrigerService) { private _pd: PdTrigerService,
@Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
} this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.notifier = notifier;
this.form_id = 16;
}
ngOnInit() { ngOnInit() {

167
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/assets-info/assets-info.component.html
View File

@ -1,9 +1,26 @@
<!--<pre> {{ m_group | json}}</pre>--> <form *ngIf="apiLoadFinish && loadDetails" [formGroup]="_assetsQuesFrom" (submit)="onSubmit()" novalidate>
<h2 mat-dialog-title class="paragraph_change">
<div fxFlex="70" align="left">
{{pageTitle}}
</div>
<div fxFlex="30" align="end">
<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>
<mat-tab-group>
<mat-tab label="Questions">
<ng-template matTabContent>
<div fxLayout="row wrap">
<div fxFlex="100">
<mat-card style="min-height: 550px;"> <mat-card style="min-height: 550px;">
<mat-card-content> <mat-card-content>
<p>Assets Details</p>
<form *ngIf="apiLoadFinish && loadDetails" [formGroup]="_assetsQuesFrom" (submit)="onSubmit()" novalidate>
<div fxLayout="row" fxLayoutAlign="start none"> <div fxLayout="row" fxLayoutAlign="start none">
<div formArrayName="assets_details" fxFill> <div formArrayName="assets_details" fxFill>
<div *ngFor="let sup of _assetsQuesFrom.controls.assets_details['controls']; let i=index"> <div *ngFor="let sup of _assetsQuesFrom.controls.assets_details['controls']; let i=index">
@ -272,24 +289,146 @@
</div> </div>
</div> </div>
</div> </div>
<div fxLayout="row">
<div fxFlex="60" class="pb-0 text-sm-left">
<mat-form-field appearance="outline" style="width: 100%">
<mat-label>Remarks</mat-label>
<textarea matInput placeholder="Remarks" formControlName="assets_form_remark"></textarea>
</mat-form-field>
</div>
</div>
<div class="row" style="text-align:right;"> <div class="row" style="text-align:right;">
<button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Asset Details" matTooltipPosition="above" <button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Asset Details" matTooltipPosition="above"
class="mr-1 mb-1 hover-icon" (click)="addSupplierDetails($event); false"><mat-icon>add</mat-icon></button> class="mr-1 mb-1 hover-icon" (click)="addSupplierDetails($event); false"><mat-icon>add</mat-icon></button>
<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="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> </div>
</form>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>
</div>
</div>
</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">
<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>
</ng-template>
</mat-tab>
</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="assets_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" matTooltip="Save" matTooltipPosition="above" type="submit"><mat-icon>save</mat-icon></button>
</div>
</mat-dialog-actions>
</form>

83
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/assets-info/assets-info.component.scss
View File

@ -0,0 +1,83 @@
.paragraph_change {
color: #e00201 !important;
}
.mat-card-content {
background-color: white;
}
.mat-card-actions {
background-color: white;
}
mat-form-field {
margin: 0 2%;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
}

17
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/assets-info/assets-info.component.ts
View File

@ -28,9 +28,10 @@ import { PdTrigerService } from '../../../../../pd-service/pd-triger.service';
styleUrls: ['./assets-info.component.scss'] styleUrls: ['./assets-info.component.scss']
}) })
export class AssetsInfoComponent implements OnInit { export class AssetsInfoComponent implements OnInit {
pageTitle: string ="Assets Details";
@Input() pdid: number; //@Input() pdid: number;
pdid:string;
public _assetsQuesFrom: FormGroup; public _assetsQuesFrom: FormGroup;
public submitted = false; public submitted = false;
public m_assets_type = []; public m_assets_type = [];
@ -163,9 +164,13 @@ public m_investmentType = [];
constructor( constructor(
notifier: NotifierService, notifier: NotifierService,
private _formBuilder: FormBuilder, private _formBuilder: FormBuilder,
private pdTrigerService: PdTrigerService) { private pdTrigerService: PdTrigerService,
this.notifier = notifier; @Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
} this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.notifier = notifier;
}
ngOnInit() { ngOnInit() {

169
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/banking-details/banking-details.component.html
View File

@ -67,10 +67,20 @@
<!--</form>--> <!--</form>-->
<!--</mat-card>--> <!--</mat-card>-->
<!--=======--> <!--=======-->
<mat-card style="min-height: 550px;"> <form [formGroup]="bankingForm" class="bankForm">
<mat-card-content> <h2 mat-dialog-title class="paragraph_change">
<p>Banking Information</p> <div fxFlex="70" align="left">{{pageTitle}}</div>
<form [formGroup]="bankingForm" class="bankForm"> <div fxFlex="30" align="end">
<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>
<mat-tab-group>
<mat-tab label="Questions">
<mat-card>
<mat-card-content>
<div formArrayName="itemRows" autocomplete="off"> <div formArrayName="itemRows" autocomplete="off">
<mat-accordion <mat-accordion
*ngFor="let itemrow of bankingForm.controls.itemRows['controls']; let i=index" *ngFor="let itemrow of bankingForm.controls.itemRows['controls']; let i=index"
@ -175,24 +185,139 @@
</button></div> </button></div>
</mat-accordion> </mat-accordion>
</div> </div>
<div fxLayout="row" class="pt-1">
<div fxFlex="60" class="pb-0 text-sm-left">
<mat-form-field appearance="outline" style="width: 100%">
<mat-label>Remarks</mat-label>
<textarea matInput placeholder="Remarks" formControlName="banking_form_remark" required></textarea>
</mat-form-field>
</div>
</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 Banking Details" matTooltipPosition="above" (click)="addBankdetails(i)">
<mat-icon >add</mat-icon>
</button> -->
<button class="mr-1 mb-1 hover-icon" 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-content>
</mat-card> </mat-card>
</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">
<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>
</ng-template>
</mat-tab>
</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="banking_form_remark" required></textarea>
</mat-form-field>
</div>
<div fxFlex="40" align="end">
<button class="mr-1 mb-1 hover-icon" type="submit" mat-raised-button mat-icon-button type="submit" matTooltip="Submit" matTooltipPosition="above" (click)="bankSubmit()"><mat-icon>save</mat-icon>
</button>
</div>
</mat-dialog-actions>
</form>
<notifier-container></notifier-container>

87
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/banking-details/banking-details.component.scss
View File

@ -7,4 +7,89 @@
width: 10px; width: 10px;
background: #62B013; background: #62B013;
color: white; color: white;
} }
.paragraph_change {
color: #e00201 !important;
}
.mat-card-content {
background-color: white;
}
.mat-card-actions {
background-color: white;
}
mat-form-field {
margin: 0 2%;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
}

29
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/banking-details/banking-details.component.ts
View File

@ -28,8 +28,8 @@ import {ActivatedRoute, Router} from "@angular/router";
styleUrls: ['./banking-details.component.scss'] styleUrls: ['./banking-details.component.scss']
}) })
export class BankingDetailsComponent implements OnInit { export class BankingDetailsComponent implements OnInit {
@Input() pdid: number; pdid: number;
@Input() pd_all_details:any; pageTitle: string ="Banking Information";
public bankingForm: FormGroup; public bankingForm: FormGroup;
step: number; step: number;
private notifier: NotifierService; private notifier: NotifierService;
@ -40,22 +40,29 @@ export class BankingDetailsComponent implements OnInit {
constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute, constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute,
private router: Router, private router: Router,
private _pd: PdTrigerService) { private _pd: PdTrigerService,
this.notifier = notifier; @Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.pd_cus_segment = this.pd_all_details.pdmaster_details.customer_segment_abbr.toUpperCase();
this.pd_cus_segment = this.pd_cus_segment.substring(0,3);
this.applicants = this.pd_all_details.pdapplicants_detials;
this.notifier = notifier;
}
}
ngOnInit() { ngOnInit() {
this.step = 0; this.step = 0;
this.initBankingForm(); this.initBankingForm();
this.getM_AccountType(); this.getM_AccountType();
this.getM_BTLenderList(); this.getM_BTLenderList();
this.pd_cus_segment = this.pd_all_details.pdmaster_details.customer_segment_abbr.toUpperCase(); // this.pd_cus_segment = this.pd_all_details.pdmaster_details.customer_segment_abbr.toUpperCase();
// console.log("(0,3): " + this.pd_cus_segment.substring(0,3)); // // console.log("(0,3): " + this.pd_cus_segment.substring(0,3));
// console.log(this.pd_all_details.pdmaster_details); // // console.log(this.pd_all_details.pdmaster_details);
// console.log(this.pd_cus_segment); // // console.log(this.pd_cus_segment);
this.pd_cus_segment = this.pd_cus_segment.substring(0,3); // this.pd_cus_segment = this.pd_cus_segment.substring(0,3);
this.applicants = this.pd_all_details.pdapplicants_detials; // this.applicants = this.pd_all_details.pdapplicants_detials;
let params: any = {}; let params: any = {};
params.pd_id = this.pdid; params.pd_id = this.pdid;
params.pd_form_id = '7'; params.pd_form_id = '7';

883
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/business-info/business-info.component.html
View File

@ -1,378 +1,519 @@
<mat-card style="padding: 12px;">
<p>Business Details</p>
<form [formGroup]="businessForm" class="address"> <form [formGroup]="businessForm" class="address">
<mat-form-field>
<input matInput placeholder="Name of Business / Profession" formControlName="profession_name" required>
</mat-form-field>
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field>
<input matInput type="number" placeholder="Business Experience in Year" formControlName="business_years" required min='0'>
</mat-form-field>
<mat-form-field>
<input matInput type="number" placeholder="Business Experience in Month" formControlName="business_month" required min='0' max='12'>
</mat-form-field>
</div>
<mat-form-field>
<mat-select placeholder="Industry"
formControlName="industry" required>
<mat-option value="{{list.industry_classification_id}}" *ngFor="let list of industryData">{{list.name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Type of Activity"
formControlName="type_of_activity" requried>
<mat-option value="{{type.type_of_activity_id}}" *ngFor="let type of activityData">{{type.name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="businessForm.controls['type_of_activity'].value == 5">
<input matInput placeholder="Specify Other Activity"
formControlName="other_activity_type">
</mat-form-field>
<mat-form-field>
<!-- <input matInput placeholder="Seasonality" formControlName="seasonality" required> -->
<mat-select placeholder="Is the business Seasonal?"
formControlName="seasonality" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="businessForm.controls['seasonality'].value == 'yes'">
<input matInput placeholder="How many months in a year does the business run?" formControlName="month_of_business_run">
</mat-form-field>
<mat-form-field *ngIf="businessForm.controls['seasonality'].value == 'yes'"> <h2 mat-dialog-title class="paragraph_change">
<mat-select multiple placeholder="What is the peak period of business ? " <div fxFlex="70" align="left">{{pageTitle}}</div>
formControlName="peak_period_of_business" required> <div fxFlex="30" align="end">
<mat-option value="1">January</mat-option> <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>
<mat-option value="2">February</mat-option>
<mat-option value="3">March</mat-option> </div>
<mat-option value="4">April</mat-option> </h2>
<mat-option value="5">May</mat-option>
<mat-option value="6">June</mat-option> <mat-dialog-content>
<mat-option value="7">July</mat-option>
<mat-option value="8">August</mat-option> <mat-tab-group>
<mat-option value="9">September</mat-option>
<mat-option value="10">October</mat-option>
<mat-option value="11">November</mat-option>
<mat-option value="12">December</mat-option>
</mat-select> <mat-tab label="Questions">
</mat-form-field> <ng-template matTabContent>
<div fxLayout="row wrap">
<div fxFlex="100">
<mat-card style="padding: 12px;">
<!--<mat-card> <mat-form-field>
<mat-card-header> <input matInput placeholder="Name of Business / Profession" formControlName="profession_name" required>
<p>Designation </mat-form-field>
</p>
</mat-card-header> <div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<div formArrayName="designation"> <mat-form-field>
<div *ngFor="let members of businessForm.controls.designation['controls']; let i=index" <input matInput type="number" placeholder="Business Experience in Year" formControlName="business_years" required min='0'>
[formGroupName]="i"> </mat-form-field>
<mat-card-content class="card"> <mat-form-field>
<mat-form-field> <input matInput type="number" placeholder="Business Experience in Month" formControlName="business_month" required min='0' max='12'>
<input matInput placeholder="Name" formControlName="sec_name" required> </mat-form-field>
</mat-form-field> </div>
<mat-form-field>
<input matInput placeholder="Designation" formControlName="sec_designation" required> <mat-form-field>
</mat-form-field> <mat-select placeholder="Industry"
<button type="button" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button (click)="addDesignation()" formControlName="industry" required>
matTooltip="Add More Designation" matTooltipPosition="above" color="primary" *ngIf="i==0"> <mat-option value="{{list.industry_classification_id}}" *ngFor="let list of industryData">{{list.name}}</mat-option>
<mat-icon>add</mat-icon> </mat-select>
</button> </mat-form-field>
<button type="button" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button (click)="deleteDesignation(i)" <mat-form-field>
matTooltip="Delete" matTooltipPosition="above" *ngIf="i>0"> <mat-select placeholder="Type of Activity"
<mat-icon>delete</mat-icon> formControlName="type_of_activity" requried>
</button> <mat-option value="{{type.type_of_activity_id}}" *ngFor="let type of activityData">{{type.name}}</mat-option>
</mat-card-content> </mat-select>
</div> </mat-form-field>
</div> <mat-form-field *ngIf="businessForm.controls['type_of_activity'].value == 5">
</mat-card>--> <input matInput placeholder="Specify Other Activity"
<mat-form-field> formControlName="other_activity_type">
<mat-select placeholder="Who started the business / professions" </mat-form-field>
formControlName="who_started" required> <mat-form-field>
<mat-option value="applicant">Started by Applicants</mat-option> <!-- <input matInput placeholder="Seasonality" formControlName="seasonality" required> -->
<mat-option value="family_business">Family Business</mat-option> <mat-select placeholder="Is the business Seasonal?"
<mat-option value="others">Others</mat-option> formControlName="seasonality" required>
</mat-select> <mat-option value="yes">Yes</mat-option>
</mat-form-field> <mat-option value="no">No</mat-option>
<mat-form-field *ngIf="businessForm.controls['who_started'].value == 'others'"> </mat-select>
<input matInput placeholder="Specify Other Bussiness Started" </mat-form-field>
formControlName="other_bussiness_who_started">
</mat-form-field> <mat-form-field *ngIf="businessForm.controls['seasonality'].value == 'yes'">
<mat-form-field> <input matInput placeholder="How many months in a year does the business run?" formControlName="month_of_business_run">
<mat-select placeholder="Main person running the businesss" </mat-form-field>
formControlName="main_person" required>
<!-- <mat-option value="applicants">One of the applicants</mat-option> --> <mat-form-field *ngIf="businessForm.controls['seasonality'].value == 'yes'">
<mat-option value="{{owner.pd_co_applicant_id}}" *ngFor="let owner of applicants">{{owner.applicant_name}}</mat-option> <mat-select multiple placeholder="What is the peak period of business ? "
<mat-option value="Relative">Relative of an applicant</mat-option> formControlName="peak_period_of_business" required>
<mat-option value="Others">Others</mat-option> <mat-option value="1">January</mat-option>
</mat-select> <mat-option value="2">February</mat-option>
</mat-form-field> <mat-option value="3">March</mat-option>
<mat-form-field *ngIf="businessForm.controls['main_person'].value == 'Others'"> <mat-option value="4">April</mat-option>
<input matInput placeholder="Specify other person" <mat-option value="5">May</mat-option>
formControlName="other_main_person"> <mat-option value="6">June</mat-option>
</mat-form-field> <mat-option value="7">July</mat-option>
<mat-form-field> <mat-option value="8">August</mat-option>
<mat-select multiple placeholder="Other family members invovled" <mat-option value="9">September</mat-option>
formControlName="family_members_involved" (selectionChange)="relationChanged($event)" required> <mat-option value="10">October</mat-option>
<mat-option value="{{member.relationship_id}}" *ngFor="let member of relationData">{{member.name}}</mat-option> <mat-option value="11">November</mat-option>
</mat-select> <mat-option value="12">December</mat-option>
</mat-form-field>
<mat-form-field> </mat-select>
<!-- <input matInput placeholder="Any other business before" </mat-form-field>
formControlName="before_business" required> -->
<mat-select placeholder="Were the loan applicants involved in any other business before starting this business?" <!--<mat-card>
formControlName="before_business" required> <mat-card-header>
<mat-option value="yes">Yes</mat-option> <p>Designation
<mat-option value="no">No</mat-option> </p>
</mat-select> </mat-card-header>
</mat-form-field> <div formArrayName="designation">
<mat-form-field *ngIf="businessForm.controls['before_business'].value == 'yes'"> <div *ngFor="let members of businessForm.controls.designation['controls']; let i=index"
<input matInput placeholder="Description for before starting this business" [formGroupName]="i">
formControlName="before_business_description"> <mat-card-content class="card">
</mat-form-field> <mat-form-field>
<mat-form-field> <input matInput placeholder="Name" formControlName="sec_name" required>
<input matInput placeholder="Any delays" </mat-form-field>
formControlName="any_delays" required> <mat-form-field>
</mat-form-field> <input matInput placeholder="Designation" formControlName="sec_designation" required>
<mat-card> </mat-form-field>
<mat-card-header> <button type="button" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button (click)="addDesignation()"
<p>Partners / Directors / Shareholders matTooltip="Add More Designation" matTooltipPosition="above" color="primary" *ngIf="i==0">
</p> <mat-icon>add</mat-icon>
</mat-card-header> </button>
<div formArrayName="partners"> <button type="button" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button (click)="deleteDesignation(i)"
<div *ngFor="let members of businessForm.controls.partners['controls']; let i=index" matTooltip="Delete" matTooltipPosition="above" *ngIf="i>0">
[formGroupName]="i"> <mat-icon>delete</mat-icon>
<mat-card-content class="card"> </button>
<mat-form-field> </mat-card-content>
<input matInput placeholder="Name" </div>
formControlName="partner_name" required> </div>
</mat-form-field> </mat-card>-->
<mat-form-field> <mat-form-field>
<input matInput placeholder="Share of Profit / Shareholding (%)" (keypress)="keyPress($event)" <mat-select placeholder="Who started the business / professions"
formControlName="shareholding" required> formControlName="who_started" required>
</mat-form-field> <mat-option value="applicant">Started by Applicants</mat-option>
<div> <mat-option value="family_business">Family Business</mat-option>
<label>How many years and month in this business</label> <mat-option value="others">Others</mat-option>
<br> </mat-select>
<div fxLayout="col" fxLayoutGap="2px" fxLayoutAlign="start none"> </mat-form-field>
<mat-form-field> <mat-form-field *ngIf="businessForm.controls['who_started'].value == 'others'">
<input matInput type="number" placeholder="Year" formControlName="current_business_experiance_year" required min='0'> <input matInput placeholder="Specify Other Bussiness Started"
</mat-form-field> formControlName="other_bussiness_who_started">
<mat-form-field> </mat-form-field>
<input matInput type="number" placeholder="Month" formControlName="current_business_experiance_month" required min='0' max='12'> <mat-form-field>
</mat-form-field> <mat-select placeholder="Main person running the businesss"
formControlName="main_person" required>
<!-- <mat-option value="applicants">One of the applicants</mat-option> -->
<mat-option value="{{owner.pd_co_applicant_id}}" *ngFor="let owner of applicants">{{owner.applicant_name}}</mat-option>
<mat-option value="Relative">Relative of an applicant</mat-option>
<mat-option value="Others">Others</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="businessForm.controls['main_person'].value == 'Others'">
<input matInput placeholder="Specify other person"
formControlName="other_main_person">
</mat-form-field>
<mat-form-field>
<mat-select multiple placeholder="Other family members invovled"
formControlName="family_members_involved" (selectionChange)="relationChanged($event)" required>
<mat-option value="{{member.relationship_id}}" *ngFor="let member of relationData">{{member.name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<!-- <input matInput placeholder="Any other business before"
formControlName="before_business" required> -->
<mat-select placeholder="Were the loan applicants involved in any other business before starting this business?"
formControlName="before_business" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="businessForm.controls['before_business'].value == 'yes'">
<input matInput placeholder="Description for before starting this business"
formControlName="before_business_description">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Any delays"
formControlName="any_delays" required>
</mat-form-field>
<mat-card>
<mat-card-header>
<p>Partners / Directors / Shareholders
</p>
</mat-card-header>
<div formArrayName="partners">
<div *ngFor="let members of businessForm.controls.partners['controls']; let i=index"
[formGroupName]="i">
<mat-card-content class="card">
<mat-form-field>
<input matInput placeholder="Name"
formControlName="partner_name" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Share of Profit / Shareholding (%)" (keypress)="keyPress($event)"
formControlName="shareholding" required>
</mat-form-field>
<div>
<label>How many years and month in this business</label>
<br>
<div fxLayout="col" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field>
<input matInput type="number" placeholder="Year" formControlName="current_business_experiance_year" required min='0'>
</mat-form-field>
<mat-form-field>
<input matInput type="number" placeholder="Month" formControlName="current_business_experiance_month" required min='0' max='12'>
</mat-form-field>
</div>
</div>
<mat-form-field>
<input matInput placeholder="Total Business Experience"
formControlName="total_business_experiance" required>
</mat-form-field>
<button type="button" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button (click)="addPartnerDetails()"
matTooltip="Add More Partners / Directors / Shareholders" matTooltipPosition="above" color="primary" *ngIf="i==0">
<mat-icon>add</mat-icon>
</button>
<button type="button" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button (click)="deletePartnerDetails(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>Employees As per applicant
</p>
</mat-card-header>
<mat-card-content class="matcard">
<mat-form-field>
<input matInput placeholder="Total"
formControlName="employees_total" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Permanent"
formControlName="employees_permanent" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Temporary"
formControlName="employees_temporary" required>
</mat-form-field>
</mat-card-content>
</mat-card>
<mat-card>
<mat-card-header>
<p>No of Employees sighted by PD officer during his visit
</p>
</mat-card-header>
<mat-card-content class="matcard">
<mat-form-field>
<input matInput placeholder="Total"
formControlName="officer_total" required>
</mat-form-field>
<!-- <mat-form-field>
<input matInput placeholder="Permanent"
formControlName="officer_permanent" required>
</mat-form-field> -->
<!-- <mat-form-field>
<input matInput placeholder="Temporary"
formControlName="officer_temporary" required>
</mat-form-field> -->
</mat-card-content>
</mat-card>
<mat-card>
<mat-card-header>
<p>Investment in business by Applicants
</p>
</mat-card-header>
<mat-card-content class="matcard">
<mat-form-field>
<input matInput placeholder="Amount Invested by Applicant"
formControlName="invested_amount" required>
</mat-form-field>
<!-- <mat-form-field>
<input matInput placeholder="Monthly Working Capital Needed"
formControlName="working_capital" required>
</mat-form-field> -->
</mat-card-content>
</mat-card>
<mat-card>
<mat-card-header>
<p>Location
</p>
</mat-card-header>
<mat-card-content class="matcards">
<mat-form-field>
<mat-select
placeholder="Is the location of the business / profession suited to the nature of business / service provided? "
formControlName="is_service_provided" required>
<mat-option value="well_suited.">Well Suited.</mat-option>
<mat-option value="fairly_suited">Fairly Suited</mat-option>
<mat-option value="not_suited">Not Suited</mat-option>
</mat-select>
</mat-form-field>
</mat-card-content>
</mat-card>
<!-- <mat-card>
<mat-card-header>
<p>Business Setup
</p>
</mat-card-header>
<mat-card-content class="matcards">
<mat-form-field>
<mat-select placeholder="What is the ownership of the setup ?"
formControlName="ownership_setup" required>
<mat-option value="self_owned">self owned</mat-option>
<mat-option value="rented">Rented</mat-option>
<mat-option value="family_owned">Family Owned</mat-option>
<mat-option value="others">others</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="businessForm.controls['ownership_setup'].value == 'others'">
<input matInput placeholder="Please Specify"
formControlName="ownership_others">
</mat-form-field>
<mat-form-field *ngIf="businessForm.controls['ownership_setup'].value == 'rented'">
<input matInput placeholder="Provide Rent Paid?"
formControlName="rent_paid" (keypress)="keyPress($event)">
</mat-form-field>
</mat-card-content>
</mat-card> -->
<mat-card>
<mat-card-header>
<p>Documents Sighted
</p>
</mat-card-header>
<mat-card-content class="matcard">
<mat-form-field>
<mat-select placeholder="Shop and Eat Act Cert"
formControlName="shop_eat_act_cert" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="GST Regn Cert"
formControlName="gst_Regn_cert" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Export / Import cert"
formControlName="export_import_cert" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Factory Cert"
formControlName="factory_cert" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Cert of Practice"
formControlName="practice_cert" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="PF Regn"
formControlName="pf_regn" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="ESIC Regn"
formControlName="esic_regn" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Do you want to add other documents?"
formControlName="other_documents" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
<mat-option value="not applicable">Not Applicable</mat-option>
</mat-select>
</mat-form-field>
<div formArrayName="documents" *ngIf="businessForm.controls['other_documents'].value == 'yes'">
<div *ngFor="let members of businessForm.controls.documents['controls']; let i=index"
[formGroupName]="i">
<mat-form-field style="width:86%">
<input matInput placeholder="Specify Document Details"
formControlName="document">
</mat-form-field>
<button type="button" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button (click)="addDocuments()"
matTooltip="Add More Document Details" matTooltipPosition="above" color="primary" *ngIf="i==0">
<mat-icon>add</mat-icon>
</button>
<button type="button" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button (click)="deleteDocuments(i)"
matTooltip="Delete" matTooltipPosition="above" *ngIf="i>0">
<mat-icon>delete</mat-icon>
</button>
</div>
</div>
</mat-card-content>
</mat-card>
</mat-card>
</div> </div>
</div> </div>
<mat-form-field> </ng-template>
<input matInput placeholder="Total Business Experience" </mat-tab>
formControlName="total_business_experiance" required>
<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/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>
</ng-template>
</mat-tab>
</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="business_remarks" required></textarea>
</mat-form-field> </mat-form-field>
<button type="button" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button (click)="addPartnerDetails()" </div>
matTooltip="Add More Partners / Directors / Shareholders" matTooltipPosition="above" color="primary" *ngIf="i==0"> <div fxFlex="40" align="end">
<mat-icon>add</mat-icon> <button type="submit" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button matTooltip="Submit" matTooltipPosition="above" (click)="submitDetails()"><mat-icon>save</mat-icon>
</button> </button>
<button type="button" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button (click)="deletePartnerDetails(i)" </div>
matTooltip="Delete" matTooltipPosition="above" *ngIf="i>0"> </mat-dialog-actions>
<mat-icon>delete</mat-icon> </form>
</button>
</mat-card-content>
</div>
</div>
</mat-card>
<mat-card>
<mat-card-header>
<p>Employees As per applicant
</p>
</mat-card-header>
<mat-card-content class="matcard">
<mat-form-field>
<input matInput placeholder="Total"
formControlName="employees_total" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Permanent"
formControlName="employees_permanent" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Temporary"
formControlName="employees_temporary" required>
</mat-form-field>
</mat-card-content>
</mat-card>
<mat-card>
<mat-card-header>
<p>No of Employees sighted by PD officer during his visit
</p>
</mat-card-header>
<mat-card-content class="matcard">
<mat-form-field>
<input matInput placeholder="Total"
formControlName="officer_total" required>
</mat-form-field>
<!-- <mat-form-field>
<input matInput placeholder="Permanent"
formControlName="officer_permanent" required>
</mat-form-field> -->
<!-- <mat-form-field>
<input matInput placeholder="Temporary"
formControlName="officer_temporary" required>
</mat-form-field> -->
</mat-card-content>
</mat-card>
<mat-card>
<mat-card-header>
<p>Investment in business by Applicants
</p>
</mat-card-header>
<mat-card-content class="matcard">
<mat-form-field>
<input matInput placeholder="Amount Invested by Applicant"
formControlName="invested_amount" required>
</mat-form-field>
<!-- <mat-form-field>
<input matInput placeholder="Monthly Working Capital Needed"
formControlName="working_capital" required>
</mat-form-field> -->
</mat-card-content>
</mat-card>
<mat-card>
<mat-card-header>
<p>Location
</p>
</mat-card-header>
<mat-card-content class="matcards">
<mat-form-field>
<mat-select
placeholder="Is the location of the business / profession suited to the nature of business / service provided? "
formControlName="is_service_provided" required>
<mat-option value="well_suited.">Well Suited.</mat-option>
<mat-option value="fairly_suited">Fairly Suited</mat-option>
<mat-option value="not_suited">Not Suited</mat-option>
</mat-select>
</mat-form-field>
</mat-card-content>
</mat-card>
<!-- <mat-card>
<mat-card-header>
<p>Business Setup
</p>
</mat-card-header>
<mat-card-content class="matcards">
<mat-form-field>
<mat-select placeholder="What is the ownership of the setup ?"
formControlName="ownership_setup" required>
<mat-option value="self_owned">self owned</mat-option>
<mat-option value="rented">Rented</mat-option>
<mat-option value="family_owned">Family Owned</mat-option>
<mat-option value="others">others</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="businessForm.controls['ownership_setup'].value == 'others'">
<input matInput placeholder="Please Specify"
formControlName="ownership_others">
</mat-form-field>
<mat-form-field *ngIf="businessForm.controls['ownership_setup'].value == 'rented'">
<input matInput placeholder="Provide Rent Paid?"
formControlName="rent_paid" (keypress)="keyPress($event)">
</mat-form-field>
</mat-card-content>
</mat-card> -->
<mat-card>
<mat-card-header>
<p>Documents Sighted
</p>
</mat-card-header>
<mat-card-content class="matcard">
<mat-form-field>
<mat-select placeholder="Shop and Eat Act Cert"
formControlName="shop_eat_act_cert" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="GST Regn Cert"
formControlName="gst_Regn_cert" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Export / Import cert"
formControlName="export_import_cert" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Factory Cert"
formControlName="factory_cert" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Cert of Practice"
formControlName="practice_cert" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="PF Regn"
formControlName="pf_regn" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="ESIC Regn"
formControlName="esic_regn" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Do you want to add other documents?"
formControlName="other_documents" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
<mat-option value="not applicable">Not Applicable</mat-option>
</mat-select>
</mat-form-field>
<div formArrayName="documents" *ngIf="businessForm.controls['other_documents'].value == 'yes'">
<div *ngFor="let members of businessForm.controls.documents['controls']; let i=index"
[formGroupName]="i">
<mat-form-field style="width:86%">
<input matInput placeholder="Specify Document Details"
formControlName="document">
</mat-form-field>
<button type="button" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button (click)="addDocuments()"
matTooltip="Add More Document Details" matTooltipPosition="above" color="primary" *ngIf="i==0">
<mat-icon>add</mat-icon>
</button>
<button type="button" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button (click)="deleteDocuments(i)"
matTooltip="Delete" matTooltipPosition="above" *ngIf="i>0">
<mat-icon>delete</mat-icon>
</button>
</div>
</div>
</mat-card-content>
</mat-card>
<div fxLayout="row">
<div fxFlex="60" class="pb-0 text-sm-left">
<mat-form-field appearance="outline" style="width: 100%">
<mat-label>Remarks</mat-label>
<textarea matInput placeholder="Remarks" formControlName="business_remarks" required></textarea>
</mat-form-field>
</div>
</div>
<div style="text-align: right;">
<button type="submit" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button matTooltip="Submit" matTooltipPosition="above" (click)="submitDetails()"><mat-icon>save</mat-icon>
</button>
</div>
</form>
</mat-card>

89
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/business-info/business-info.component.scss
View File

@ -27,4 +27,91 @@
width: 10px; width: 10px;
background: #62B013; background: #62B013;
color: white; color: white;
} }
.paragraph_change {
color: #e00201 !important;
}
.mat-card-content {
background-color: white;
}
.mat-card-actions {
background-color: white;
}
mat-form-field {
margin: 0 2%;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
}

25
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/business-info/business-info.component.ts
View File

@ -29,9 +29,9 @@ import {ActivatedRoute, Router} from "@angular/router";
styleUrls: ['./business-info.component.scss'] styleUrls: ['./business-info.component.scss']
}) })
export class BusinessInfoComponent implements OnInit { export class BusinessInfoComponent implements OnInit {
@Input() pdid: number; pdid: number;
@Input() form_id: number; form_id: number;
@Input() applicant_details: any; pageTitle: string ="Business Details";
relationData: any = []; relationData: any = [];
industryData: any = []; industryData: any = [];
activityData: any = []; activityData: any = [];
@ -40,13 +40,20 @@ export class BusinessInfoComponent implements OnInit {
public businessForm: FormGroup; public businessForm: FormGroup;
private notifier: NotifierService; private notifier: NotifierService;
constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute, constructor(notifier: NotifierService,
private router: Router, private fb: FormBuilder,
private _pd: PdTrigerService) { private route: ActivatedRoute,
this.notifier = notifier; private router: Router,
} private _pd: PdTrigerService,
@Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.applicants = this.pd_all_details.pdapplicants_detials;
this.form_id = 13;
this.notifier = notifier;
}
ngOnInit() { ngOnInit() {
this.applicants = this.applicant_details.pdapplicants_detials;
this.getRelation(); this.getRelation();
this.getIndustry(); this.getIndustry();
this.getActivity(); this.getActivity();

257
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/client-info/client-info.component.html
View File

@ -1,4 +1,245 @@
<!--<pre> {{ m_group | json}}</pre>--> <form *ngIf="apiLoadFinish" [formGroup]="_clientQuesFrom" (submit)="onSubmit()" novalidate>
<h2 mat-dialog-title class="paragraph_change">
<div fxFlex="70" align="left">{{pageTitle}}</div>
<div fxFlex="30" align="end">
<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>
<mat-tab-group>
<mat-tab label="Questions">
<ng-template matTabContent>
<div fxLayout="row wrap">
<div fxFlex="100">
<mat-card>
<!-- <mat-card-title></mat-card-title> -->
<mat-card-content formArrayName="client_details" fxFill>
<div *ngFor="let sup of _clientQuesFrom.controls.client_details['controls']; let i=index" [formGroupName]="i">
<!-- <div [formGroupName]="i"> -->
<div fxLayout="row wrap" fxLayoutGap="12px" fxLayoutAlign="start none">
<div>
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Client Name" formControlName="client_name" required>
<!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
</mat-form-field>
</div>
<div>
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Contact Person Name" formControlName="contact_person" required>
<!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
</mat-form-field>
</div>
<div>
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Contact Mobile Number" formControlName="mobile_number" (keypress)="keyPress($event)" minlength=10 maxlength=10 required>
<!-- <mat-error *ngIf="sup.controls['mobile_number'].hasError('requried') && sup.controls['mobile_number'].touched" class="mat-text-warn">Mobile Number Requried</mat-error> -->
<mat-error *ngIf="sup.controls['mobile_number'].hasError('minlength') && sup.controls['mobile_number'].touched" class="mat-text-warn">Valid Mobile Number Requried</mat-error>
<mat-error *ngIf="sup.controls['mobile_number'].hasError('maxlength') && sup.controls['mobile_number'].touched" class="mat-text-warn">Valid Mobile Number Requried</mat-error>
</mat-form-field>
</div>
</div>
<div fxLayout="row wrap" fxLayoutGap="12px" fxLayoutAlign="start none">
<div>
<mat-form-field>
<mat-select (selectionChange)="selectedPM($event)" placeholder="Payment Mode" formControlName="payment_mode" required>
<mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option>
</mat-select>
</mat-form-field>
</div>
<div *ngIf="sup.get('payment_mode').value == 1 || sup.get('payment_mode').value == 3">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="% of immediate / Advance Payment Purchase to Total Purchase?" formControlName="per_of_immediate_advance_payment" type="number" min="0">
<!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
</mat-form-field>
</div>
<div *ngIf="sup.get('payment_mode').value == 2 || sup.get('payment_mode').value == 3">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Credit Period" formControlName="credit_period">
<!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
</mat-form-field>
</div>
</div>
<div fxLayout="row" fxLayoutGap="12px" fxLayoutAlign="start none">
<div>
<mat-form-field>
<mat-select (selectionChange)="selectedFreqPurchase($event)" placeholder="Frequency of Purchase" formControlName="frequency_of_purchase" required>
<mat-option *ngFor="let feq of m_freqOfPurchase" [value]="feq.frequency_id">{{ feq.name }}</mat-option>
</mat-select>
</mat-form-field>
</div>
<div *ngIf="sup.get('frequency_of_purchase').value == 8">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Others Details" formControlName="freq_purchase_others_text_value">
<!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
</mat-form-field>
</div>
<div fxFlex="20">
<span *ngIf="_clientQuesFrom.controls.client_details.controls.length > 1" (click)="removeLanguage(i)">
<button mat-raised-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> -->
</div>
</mat-card-content>
<mat-card-actions align="end">
<!-- <span *ngIf="_supplierQuesFrom.controls.supplier_details.controls.length > 1" (click)="removeLanguage(i)">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" color="primary" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
</span> -->
</mat-card-actions>
</mat-card>
</div>
</div>
</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">
<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>
</ng-template>
</mat-tab>
</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="personal_info_form_remark" required></textarea>
</mat-form-field> -->
</div>
<div fxFlex="40" align="end">
<button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Client Details" matTooltipPosition="above"
class="mr-1 mb-1 hover-icon" (click)="addSupplierDetails($event); false"><mat-icon>add</mat-icon></button>
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Reset" matTooltipPosition="above" type="reset"><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>
</mat-dialog-actions>
</form>
<notifier-container></notifier-container>
<!--<pre> {{ m_group | json}}</pre>--
<mat-card style="padding: 12px;"> <mat-card style="padding: 12px;">
<p>Client Details</p> <p>Client Details</p>
<form *ngIf="apiLoadFinish" [formGroup]="_clientQuesFrom" (submit)="onSubmit()" novalidate> <form *ngIf="apiLoadFinish" [formGroup]="_clientQuesFrom" (submit)="onSubmit()" novalidate>
@ -10,19 +251,19 @@
<div> <div>
<mat-form-field class="ml-xs example-full-width"> <mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Client Name" formControlName="client_name" required> <input matInput placeholder="Client Name" formControlName="client_name" required>
<!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>--> <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>---
</mat-form-field> </mat-form-field>
</div> </div>
<div> <div>
<mat-form-field class="ml-xs example-full-width"> <mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Contact Person Name" formControlName="contact_person" required> <input matInput placeholder="Contact Person Name" formControlName="contact_person" required>
<!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>--> <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>---
</mat-form-field> </mat-form-field>
</div> </div>
<div> <div>
<mat-form-field class="ml-xs example-full-width"> <mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Contact Mobile Number" formControlName="mobile_number" (keypress)="keyPress($event)" minlength=10 maxlength=10 required> <input matInput placeholder="Contact Mobile Number" formControlName="mobile_number" (keypress)="keyPress($event)" minlength=10 maxlength=10 required>
<!-- <mat-error *ngIf="sup.controls['mobile_number'].hasError('requried') && sup.controls['mobile_number'].touched" class="mat-text-warn">Mobile Number Requried</mat-error> --> <!-- <mat-error *ngIf="sup.controls['mobile_number'].hasError('requried') && sup.controls['mobile_number'].touched" class="mat-text-warn">Mobile Number Requried</mat-error> --
<mat-error *ngIf="sup.controls['mobile_number'].hasError('minlength') && sup.controls['mobile_number'].touched" class="mat-text-warn">Valid Mobile Number Requried</mat-error> <mat-error *ngIf="sup.controls['mobile_number'].hasError('minlength') && sup.controls['mobile_number'].touched" class="mat-text-warn">Valid Mobile Number Requried</mat-error>
<mat-error *ngIf="sup.controls['mobile_number'].hasError('maxlength') && sup.controls['mobile_number'].touched" class="mat-text-warn">Valid Mobile Number Requried</mat-error> <mat-error *ngIf="sup.controls['mobile_number'].hasError('maxlength') && sup.controls['mobile_number'].touched" class="mat-text-warn">Valid Mobile Number Requried</mat-error>
</mat-form-field> </mat-form-field>
@ -39,13 +280,13 @@
<div *ngIf="sup.get('payment_mode').value == 1 || sup.get('payment_mode').value == 3"> <div *ngIf="sup.get('payment_mode').value == 1 || sup.get('payment_mode').value == 3">
<mat-form-field class="ml-xs example-full-width"> <mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="% of immediate / Advance Payment Purchase to Total Purchase?" formControlName="per_of_immediate_advance_payment" type="number" min="0"> <input matInput placeholder="% of immediate / Advance Payment Purchase to Total Purchase?" formControlName="per_of_immediate_advance_payment" type="number" min="0">
<!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>--> <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>--
</mat-form-field> </mat-form-field>
</div> </div>
<div *ngIf="sup.get('payment_mode').value == 2 || sup.get('payment_mode').value == 3"> <div *ngIf="sup.get('payment_mode').value == 2 || sup.get('payment_mode').value == 3">
<mat-form-field class="ml-xs example-full-width"> <mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Credit Period" formControlName="credit_period"> <input matInput placeholder="Credit Period" formControlName="credit_period">
<!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>--> <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>--
</mat-form-field> </mat-form-field>
</div> </div>
</div> </div>
@ -60,7 +301,7 @@
<div *ngIf="sup.get('frequency_of_purchase').value == 8"> <div *ngIf="sup.get('frequency_of_purchase').value == 8">
<mat-form-field class="ml-xs example-full-width"> <mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Others Details" formControlName="freq_purchase_others_text_value"> <input matInput placeholder="Others Details" formControlName="freq_purchase_others_text_value">
<!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>--> <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>--
</mat-form-field> </mat-form-field>
</div> </div>
@ -82,4 +323,4 @@
<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> <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> </div>
</form> </form>
</mat-card> </mat-card>-->

83
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/client-info/client-info.component.scss
View File

@ -0,0 +1,83 @@
.paragraph_change {
color: #e00201 !important;
}
.mat-card-content {
background-color: white;
}
.mat-card-actions {
background-color: white;
}
mat-form-field {
margin: 0 2%;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
}

19
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/client-info/client-info.component.ts
View File

@ -30,7 +30,14 @@ import { PdTrigerService } from '../../../../../pd-service/pd-triger.service';
}) })
export class ClientInfoComponent implements OnInit { export class ClientInfoComponent implements OnInit {
@Input() pdid: number; pageTitle: string ="Client Details";
//@Input() pdid: number;
pdid : number;
form_id: number;
loadDataStatus: boolean=true;
public _clientQuesFrom: FormGroup; public _clientQuesFrom: FormGroup;
public submitted = false; public submitted = false;
@ -88,10 +95,14 @@ export class ClientInfoComponent implements OnInit {
private notifier: NotifierService; private notifier: NotifierService;
constructor( constructor(
notifier: NotifierService, notifier: NotifierService,
private _formBuilder: FormBuilder, private _formBuilder: FormBuilder,
private pdTrigerService: PdTrigerService) { private pdTrigerService: PdTrigerService,
this.notifier = notifier;} @Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.form_id = 2;
this.notifier = notifier;
}
ngOnInit() { ngOnInit() {
this.getM_FreqOfPurchase(); this.getM_FreqOfPurchase();

263
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/current-loan/current-loan.component.html
View File

@ -1,29 +1,272 @@
<mat-card style="min-height: 550px;"> <form [formGroup]="currentLoanForm" class="address">
<h2 mat-dialog-title class="paragraph_change">
<div fxFlex="70" align="left">{{pageTitle}}</div>
<div fxFlex="30" align="end">
<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>
<mat-tab-group>
<mat-tab label="Questions">
<ng-template matTabContent>
<div fxLayout="row wrap">
<div fxFlex="100">
<mat-card>
<!-- <mat-card-title></mat-card-title> -->
<mat-card-content>
<mat-form-field style="width:60% !important;">
<mat-select (selectionChange)="selectedLoanChanges($event)" placeholder="Do you have any other existing loan"
formControlName="existing_loan" required>
<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">
<!-- {{frequencyData | json}} -->
<mat-card-content class="matcard">
<mat-form-field>
<input matInput placeholder="Loan Amount" formControlName="loan_amount" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field>
<mat-select (selectionChange)="selectedfrequency($event.value,i)" placeholder="Frequency"
formControlName="frequency" required>
<mat-option *ngFor="let freq of frequencyData" value="{{freq.frequency_id}}">{{freq.name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<input matInput [placeholder]="placeholderName[i] != '' ? placeholderName[i] : 'Instalment Amount' " formControlName="emi" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Loan Type" formControlName="loan_type" required>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Loan Taken By" formControlName="loan_taken_by" required>
<mat-option value="{{owner.pd_co_applicant_id}}" *ngFor="let owner of applicants">{{owner.applicant_name}}</mat-option>
<mat-option value="Others">Others</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="details.get('loan_taken_by').value == 'Others'">
<input matInput placeholder="Specify Others Loan Taken" formControlName="others_loan_taken">
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Lender" formControlName="lender" required>
<mat-option *ngFor="let btLen of lenderData" [value]="btLen.bt_lender_list_id">{{ btLen.lender_name }}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="details.get('lender').value == 3">
<input matInput placeholder="Specify Others Loan Taken" formControlName="others_loan_taken">
</mat-form-field>
<!-- <mat-form-field>
<input matInput placeholder="Lender" formControlName="lender" required>
</mat-form-field> -->
<mat-form-field>
<input matInput placeholder="Original Tenure in Months" formControlName="original_tenure" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Current Balance Tenure in Months" formControlName="current_balance_tenure" required>
</mat-form-field>
<button type="button" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button matTooltip="Add More Loan Details" matTooltipPosition="above" color="primary" (click)="addLoanDetails()"
*ngIf="i==0">
<mat-icon>add</mat-icon>
</button>
<button type="button" class="mr-1 mb-1 hover-icon" 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>
</mat-card-content>
<mat-card-actions align="end">
<!-- <span *ngIf="_supplierQuesFrom.controls.supplier_details.controls.length > 1" (click)="removeLanguage(i)">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" color="primary" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
</span> -->
</mat-card-actions>
</mat-card>
</div>
</div>
</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">
<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>
</ng-template>
</mat-tab>
</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="currentloan_remarks" required></textarea>
</mat-form-field>
</div>
<div fxFlex="40" align="end">
<button type="submit" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button matTooltip="Submit" matTooltipPosition="above" (click)="submitCurrentloan()"><mat-icon>save</mat-icon>
</button>
</div>
</mat-dialog-actions>
</form>
<notifier-container></notifier-container>
<!-- <mat-card style="min-height: 550px;">
<mat-card-content> <mat-card-content>
<p>Existing Loan Obligations</p> <p>Existing Loan Obligations</p>
<form [formGroup]="currentLoanForm" class="address"> <form [formGroup]="currentLoanForm" class="address"> -->
<!-- <div fxLayout="row"> <!-- <div fxLayout="row">
<div fxFlex="60" class="pb-0 text-sm-left"> --> <div fxFlex="60" class="pb-0 text-sm-left"> -->
<mat-form-field style="width:60% !important;"> <!-- <mat-form-field style="width:60% !important;">
<mat-select (selectionChange)="selectedLoanChanges($event)" placeholder="Do you have any other existing loan" <mat-select (selectionChange)="selectedLoanChanges($event)" placeholder="Do you have any other existing loan"
formControlName="existing_loan" required> formControlName="existing_loan" required>
<mat-option value="Yes">Yes</mat-option> <mat-option value="Yes">Yes</mat-option>
<mat-option value="No">No</mat-option> <mat-option value="No">No</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field> -->
<!-- </div> <!-- </div>
</div> --> </div> -->
<mat-card *ngIf="currentLoanForm.controls.existing_loan.value == 'Yes'"> <!-- <mat-card *ngIf="currentLoanForm.controls.existing_loan.value == 'Yes'">
<mat-card-header> <mat-card-header>
<p>Loan Details<p> <p>Loan Details<p>
</mat-card-header> </mat-card-header>
<div formArrayName="loan_details"> <div formArrayName="loan_details">
<div *ngFor="let details of currentLoanForm.get('loan_details').controls; let i=index" <div *ngFor="let details of currentLoanForm.get('loan_details').controls; let i=index"
[formGroupName]="i"> [formGroupName]="i"> -->
<!-- {{frequencyData | json}} --> <!-- {{frequencyData | json}} -->
<mat-card-content class="matcard"> <!-- <mat-card-content class="matcard">
<mat-form-field> <mat-form-field>
<input matInput placeholder="Loan Amount" formControlName="loan_amount" (keypress)="keyPress($event)" required> <input matInput placeholder="Loan Amount" formControlName="loan_amount" (keypress)="keyPress($event)" required>
</mat-form-field> </mat-form-field>
@ -55,11 +298,11 @@
</mat-form-field> </mat-form-field>
<mat-form-field *ngIf="details.get('lender').value == 3"> <mat-form-field *ngIf="details.get('lender').value == 3">
<input matInput placeholder="Specify Others Loan Taken" formControlName="others_loan_taken"> <input matInput placeholder="Specify Others Loan Taken" formControlName="others_loan_taken">
</mat-form-field> </mat-form-field> -->
<!-- <mat-form-field> <!-- <mat-form-field>
<input matInput placeholder="Lender" formControlName="lender" required> <input matInput placeholder="Lender" formControlName="lender" required>
</mat-form-field> --> </mat-form-field> -->
<mat-form-field> <!-- <mat-form-field>
<input matInput placeholder="Original Tenure in Months" formControlName="original_tenure" required> <input matInput placeholder="Original Tenure in Months" formControlName="original_tenure" required>
</mat-form-field> </mat-form-field>
<mat-form-field> <mat-form-field>
@ -92,5 +335,5 @@
</form> </form>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card> -->

116
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/current-loan/current-loan.component.scss
View File

@ -1,19 +1,103 @@
.address { // .address {
display: flex; // display: flex;
padding: 0 2%; // padding: 0 2%;
flex-direction: column; // flex-direction: column;
} // }
.address > * { // .address > * {
width: 100%; // width: 100%;
// }
// .matcard mat-form-field {
// margin: 0 2%;
// width:26%;
// }
// .address .button {
// float: right;
// width: 10px;
// background: #62B013;
// color: white;
// }
.paragraph_change {
color: #e00201 !important;
} }
.matcard mat-form-field { .mat-card-content {
margin: 0 2%; background-color: white;
width:26%; }
} .mat-card-actions {
.address .button { background-color: white;
float: right; }
width: 10px;
background: #62B013; mat-form-field {
color: white; margin: 0 2%;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
} }

22
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/current-loan/current-loan.component.ts
View File

@ -31,21 +31,27 @@ import { ActivatedRoute, Router } from "@angular/router";
export class CurrentLoanComponent implements OnInit { export class CurrentLoanComponent implements OnInit {
public currentLoanForm: FormGroup; public currentLoanForm: FormGroup;
private notifier: NotifierService; private notifier: NotifierService;
@Input() pdid: number; pageTitle: string ="Existing Loan Obligations";
@Input() form_id: number; pdid : number;
@Input() applicant_details: any; form_id: number;
applicant_details: any;
// @Input() pdid: number;
// @Input() form_id: number;
//@Input() applicant_details: any;
lenderData: any = []; lenderData: any = [];
frequencyData: any = []; frequencyData: any = [];
applicants: any; applicants: any;
placeholderName : any = []; placeholderName : any = [];
holder: any = 'amount';
IDXval : any; IDXval : any;
constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute, constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute,
private router: Router, private router: Router,
private _pd: PdTrigerService) { private _pd: PdTrigerService,
this.notifier = notifier; @Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.form_id = 8;
this.notifier = notifier;
this.applicants = this.pd_all_details.pdapplicants_detials;
} }
ngOnInit() { ngOnInit() {
this.getMasterDetails('BTLENDERLIST',1); this.getMasterDetails('BTLENDERLIST',1);
@ -54,7 +60,7 @@ export class CurrentLoanComponent implements OnInit {
let params: any = {}; let params: any = {};
params.pd_id = this.pdid; params.pd_id = this.pdid;
params.pd_form_id = this.form_id; params.pd_form_id = this.form_id;
this.applicants = this.applicant_details.pdapplicants_detials;
this._pd.retriveForm(params).subscribe(value => { this._pd.retriveForm(params).subscribe(value => {
console.log('value', value); console.log('value', value);
const control = <FormArray>this.currentLoanForm.controls['loan_details']; const control = <FormArray>this.currentLoanForm.controls['loan_details'];

369
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/employment-info/employment-info.component.html
View File

@ -1,122 +1,257 @@
<mat-card style="padding: 12px;">
<p>Employement Information</p>
<form [formGroup]="employmentForm" class="address"> <form [formGroup]="employmentForm" class="address">
<mat-form-field> <h2 mat-dialog-title class="paragraph_change">
<input matInput placeholder="Name of Employer" formControlName="employer_name" required> <div fxFlex="70" align="left">
</mat-form-field> {{pageTitle}}
<div> </div>
<label>Since how long working with this employer?</label> <div fxFlex="30" align="end">
<br> <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 fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none"> </div>
<mat-form-field> </h2>
<input matInput type="number" placeholder="Year" formControlName="how_long_year" required min='0'>
</mat-form-field> <mat-dialog-content>
<mat-form-field> <mat-tab-group>
<input matInput type="number" placeholder="Month" formControlName="how_long_month" required min='0' max='12'> <mat-tab label="Questions">
</mat-form-field> <ng-template matTabContent>
</div> <div fxLayout="row wrap">
</div> <div fxFlex="100">
<mat-form-field *ngIf="pd_cus_segment!='SAL-CHQ'"> <mat-card>
<mat-select placeholder="Was the employer met?"
formControlName="was_met" required> <mat-form-field>
<mat-option value="yes">Yes</mat-option> <input matInput placeholder="Name of Employer" formControlName="employer_name" required>
<mat-option value="no">No</mat-option> </mat-form-field>
</mat-select> <div>
</mat-form-field> <label>Since how long working with this employer?</label>
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none" *ngIf="employmentForm.controls['was_met'].value == 'yes'"> <br>
<mat-form-field fxFlex="50"> <div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<input matInput placeholder="Name of Person Met" formControlName="name_person_met" required> <mat-form-field>
</mat-form-field> <input matInput type="number" placeholder="Year" formControlName="how_long_year" required min='0'>
<mat-form-field fxFlex="50"> </mat-form-field>
<input matInput placeholder="Designation of Person Met" formControlName="designation_person_met" required> <mat-form-field>
</mat-form-field> <input matInput type="number" placeholder="Month" formControlName="how_long_month" required min='0' max='12'>
</div> </mat-form-field>
<mat-form-field *ngIf="pd_cus_segment!='SAL-CHQ'"> </div>
<mat-select placeholder="Salary amount confirmed ?" </div>
formControlName="confirm_salary" required> <mat-form-field *ngIf="pd_cus_segment!='SAL-CHQ'">
<mat-option value="yes">Yes</mat-option> <mat-select placeholder="Was the employer met?"
<mat-option value="no">No</mat-option> formControlName="was_met" required>
</mat-select> <mat-option value="yes">Yes</mat-option>
</mat-form-field> <mat-option value="no">No</mat-option>
<mat-form-field *ngIf="employmentForm.controls['confirm_salary'].value == 'yes'"> </mat-select>
<input matInput placeholder="What is the salary amount confirmed?" formControlName="confirm_salary_amount" (keypress)="keyPress($event)"> </mat-form-field>
</mat-form-field> <div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none" *ngIf="employmentForm.controls['was_met'].value == 'yes'">
<mat-form-field *ngIf="pd_cus_segment!='SAL-CHQ'"> <mat-form-field fxFlex="50">
<mat-select placeholder="Attendance register seen ?" <input matInput placeholder="Name of Person Met" formControlName="name_person_met" required>
formControlName="attendance_seen" required> </mat-form-field>
<mat-option value="yes">Yes</mat-option> <mat-form-field fxFlex="50">
<mat-option value="no">No</mat-option> <input matInput placeholder="Designation of Person Met" formControlName="designation_person_met" required>
</mat-select> </mat-form-field>
</mat-form-field> </div>
<mat-form-field *ngIf="pd_cus_segment!='SAL-CHQ'"> <mat-form-field *ngIf="pd_cus_segment!='SAL-CHQ'">
<mat-select placeholder="Salary register seen ?" <mat-select placeholder="Salary amount confirmed ?"
formControlName="sal_reg_seen" required> formControlName="confirm_salary" required>
<mat-option value="yes">Yes</mat-option> <mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option> <mat-option value="no">No</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-card> <mat-form-field *ngIf="employmentForm.controls['confirm_salary'].value == 'yes'">
<mat-card-header> <input matInput placeholder="What is the salary amount confirmed?" formControlName="confirm_salary_amount" (keypress)="keyPress($event)">
<p>Salary Details<p> </mat-form-field>
</mat-card-header> <mat-form-field *ngIf="pd_cus_segment!='SAL-CHQ'">
<mat-card-content class="matcard"> <mat-select placeholder="Attendance register seen ?"
<mat-form-field> formControlName="attendance_seen" required>
<input matInput placeholder="Date of Salary" formControlName="which_date_the_salary_is_rcv" type="number" min='1' max='31'> <mat-option value="yes">Yes</mat-option>
</mat-form-field> <mat-option value="no">No</mat-option>
<mat-form-field> </mat-select>
<input matInput placeholder="Gross Monthly Salary" formControlName="gross_monthly_salary" (keypress)="keyPress($event)" required> </mat-form-field>
</mat-form-field> <mat-form-field *ngIf="pd_cus_segment!='SAL-CHQ'">
<mat-select placeholder="Salary register seen ?"
formControlName="sal_reg_seen" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-card>
<mat-card-header>
<p>Salary Details<p>
</mat-card-header>
<mat-card-content class="matcard">
<mat-form-field>
<input matInput placeholder="Date of Salary" formControlName="which_date_the_salary_is_rcv" type="number" min='1' max='31'>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Gross Monthly Salary" formControlName="gross_monthly_salary" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field> <mat-form-field>
<input matInput placeholder="Net Monthly Salary" <input matInput placeholder="Net Monthly Salary"
formControlName="net_monthly_salary" (keypress)="keyPress($event)" required> formControlName="net_monthly_salary" (keypress)="keyPress($event)" required>
<!-- <input matInput placeholder="Net Take Home" <!-- <input matInput placeholder="Net Take Home"
formControlName="net_take_home"> --> formControlName="net_take_home"> -->
</mat-form-field> </mat-form-field>
<mat-form-field> <mat-form-field>
<input matInput placeholder="Bonus or Incentive" <input matInput placeholder="Bonus or Incentive"
formControlName="bonus_incentive" (keypress)="keyPress($event)" required> formControlName="bonus_incentive" (keypress)="keyPress($event)" required>
</mat-form-field> </mat-form-field>
<mat-form-field *ngIf="employmentForm.controls['bonus_incentive'].value != '' && employmentForm.controls['bonus_incentive'].value != '0' "> <mat-form-field *ngIf="employmentForm.controls['bonus_incentive'].value != '' && employmentForm.controls['bonus_incentive'].value != '0' ">
<mat-select placeholder="Bonus Frequency" formControlName="bonus_frequency"> <mat-select placeholder="Bonus Frequency" formControlName="bonus_frequency">
<mat-option *ngFor="let fd of frequency_data" [value]="fd.frequency_id">{{ fd.name }}</mat-option> <mat-option *ngFor="let fd of frequency_data" [value]="fd.frequency_id">{{ fd.name }}</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field *ngIf="employmentForm.controls['bonus_incentive'].value != '' && employmentForm.controls['bonus_incentive'].value != '0' "> <mat-form-field *ngIf="employmentForm.controls['bonus_incentive'].value != '' && employmentForm.controls['bonus_incentive'].value != '0' ">
<mat-select placeholder="Type of Bonus" <mat-select placeholder="Type of Bonus"
formControlName="bonus_type"> formControlName="bonus_type">
<mat-option value="fixed">Fixed</mat-option> <mat-option value="fixed">Fixed</mat-option>
<mat-option value="variable depending on performance">Variable depending on performance</mat-option> <mat-option value="variable depending on performance">Variable depending on performance</mat-option>
<mat-option value="others">Others</mat-option> <mat-option value="others">Others</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field *ngIf="employmentForm.controls['bonus_type'].value == 'others'"> <mat-form-field *ngIf="employmentForm.controls['bonus_type'].value == 'others'">
<input matInput placeholder="Bonus Type Others" formControlName="bonus_type_other"> <input matInput placeholder="Bonus Type Others" formControlName="bonus_type_other">
</mat-form-field> </mat-form-field>
<mat-form-field> <mat-form-field>
<mat-select placeholder="Any Delays" <mat-select placeholder="Any Delays"
formControlName="any_delays"> formControlName="any_delays">
<mat-option value="yes">Yes</mat-option> <mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option> <mat-option value="no">No</mat-option>
</mat-select> </mat-select>
<!-- <input matInput placeholder="Any Delays" <!-- <input matInput placeholder="Any Delays"
formControlName="any_delays"> --> formControlName="any_delays"> -->
</mat-form-field> </mat-form-field>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>
<div fxLayout="row"> </mat-card>
<div fxFlex="60" class="pb-0 text-sm-left"> </div>
<mat-form-field appearance="outline" style="width: 100%"> </div>
<mat-label>Remarks</mat-label> </ng-template>
<textarea matInput placeholder="Remarks" formControlName="employment_remarks" required></textarea> </mat-tab>
</mat-form-field> <mat-tab label="Docs">
</div> <ng-template matTabContent>
</div> <div fxLayout="row wrap">
<div style="text-align: right;"> <div fxFlex="25" class="m-gap p-gap">
<button type="submit" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button matTooltip="Submit" matTooltipPosition="above" (click)="submitDetails()"><mat-icon>save</mat-icon> <div class="p-list-main mb-2">
</button> <div class="p-list">
</div>
<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>
</ng-template>
</mat-tab>
</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="employment_remarks" required></textarea>
</mat-form-field>
</div>
<div fxFlex="40" align="end">
<!-- <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" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button matTooltip="Submit" matTooltipPosition="above" (click)="submitDetails()"><mat-icon>save</mat-icon>
</button>
</div>
</mat-dialog-actions>
</form> </form>
</mat-card> <notifier-container></notifier-container>

85
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/employment-info/employment-info.component.scss
View File

@ -18,4 +18,87 @@
width: 10px; width: 10px;
background: #62B013; background: #62B013;
color: white; color: white;
} }
.paragraph_change {
color: #e00201 !important;
}
.mat-card-content {
background-color: white;
}
.mat-card-actions {
background-color: white;
}
mat-form-field {
margin: 0 2%;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
}

19
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/employment-info/employment-info.component.ts
View File

@ -29,9 +29,11 @@ import {ActivatedRoute, Router} from '@angular/router';
styleUrls: ['./employment-info.component.scss'] styleUrls: ['./employment-info.component.scss']
}) })
export class EmploymentInfoComponent implements OnInit { export class EmploymentInfoComponent implements OnInit {
@Input() pdid: number;
@Input() form_id: number; pageTitle: string ="Employement Information";
@Input() pd_all_details:any; pdid: number;
form_id: number;
//pd_all_details:any;
public employmentForm: FormGroup; public employmentForm: FormGroup;
private notifier: NotifierService; private notifier: NotifierService;
@ -40,11 +42,14 @@ export class EmploymentInfoComponent implements OnInit {
constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute, constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute,
private router: Router, private router: Router,
private _pd: PdTrigerService) { private _pd: PdTrigerService,
this.notifier = notifier; @Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
//getAllMasterDatas(); this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.form_id = 12;
this.notifier = notifier;
}
}
ngOnInit() { ngOnInit() {
this.pd_cus_segment=this.pd_all_details.pdmaster_details.customer_segment_abbr.toUpperCase(); this.pd_cus_segment=this.pd_all_details.pdmaster_details.customer_segment_abbr.toUpperCase();
this.initemploymentForm(); this.initemploymentForm();

316
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/family-details/family-details.component.html
View File

@ -1,8 +1,316 @@
<form class="address" [formGroup]="familyForm">
<h2 mat-dialog-title class="paragraph_change">
<div fxFlex="70" align="left">
{{pageTitle}}
</div>
<div fxFlex="30" align="end">
<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>
<mat-tab-group>
<mat-tab label="Questions">
<ng-template matTabContent>
<div fxLayout="row wrap">
<div fxFlex="100">
<mat-card>
<!-- <mat-card-title>Address Details</mat-card-title> -->
<mat-card-content>
<mat-form-field>
<input matInput placeholder="Number Of Family Members" formControlName="members" required>
</mat-form-field>
<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">
<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>
<mat-select placeholder="Relation" formControlName="relation" required>
<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-select>
</mat-form-field>
<mat-form-field>
<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>
</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()">
<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">
<mat-icon>delete</mat-icon>
</button>
</mat-card-content>
</div>
</div>
</mat-card>
<mat-card>
<mat-card-header>
<p>Non Earning Members
</p>
</mat-card-header>
<div formArrayName="nonEarningMembers">
<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">
{{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-form-field *ngIf="members['controls'].occupation.value==3">
<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">
<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">
<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-content>
</mat-card>
</div>
</div>
</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">
<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>
</ng-template>
</mat-tab>
</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">
<!-- <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>
</div>
</mat-dialog-actions>
</form>
<notifier-container></notifier-container>
<mat-card style="min-height: 550px;">
<!-- <mat-card style="min-height: 550px;">
<mat-card-content> <mat-card-content>
<p>Family Details</p> <p>Family Details</p>
<form class="address" [formGroup]="familyForm"> <form class="address" [formGroup]="familyForm"> -->
<!-- <mat-form-field> <!-- <mat-form-field>
<mat-select placeholder="Person Met" formControlName="person" required> <mat-select placeholder="Person Met" formControlName="person" required>
<mat-option *ngFor="let personMet of personMetData" [value]="personMet.person_met_id"> <mat-option *ngFor="let personMet of personMetData" [value]="personMet.person_met_id">
@ -13,7 +321,7 @@
<mat-form-field *ngIf="person.value ==8"> <mat-form-field *ngIf="person.value ==8">
<input matInput placeholder="Enter the relationship" formControlName="personOther"> <input matInput placeholder="Enter the relationship" formControlName="personOther">
</mat-form-field> --> </mat-form-field> -->
<mat-form-field> <!-- <mat-form-field>
<input matInput placeholder="Number Of Family Members" formControlName="members" required> <input matInput placeholder="Number Of Family Members" formControlName="members" required>
</mat-form-field> </mat-form-field>
<mat-card> <mat-card>
@ -169,4 +477,4 @@
</mat-card-content> </mat-card-content>
</mat-card> </mat-card> -->

125
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/family-details/family-details.component.scss
View File

@ -1,23 +1,108 @@
.address { // .address {
display: flex; // display: flex;
padding: 0 2%; // padding: 0 2%;
flex-direction: column; // flex-direction: column;
} // }
.address > * { // .address > * {
width: 100%; // width: 100%;
// }
// .matcard mat-form-field {
// margin: 0 2%;
// width:27%;
// }
// .matcards mat-form-field {
// margin: 0 2%;
// width:40%;
// }
// .address .button {
// float: right;
// width: 10px;
// background: #62B013;
// color: white;
// }
.paragraph_change {
color: #e00201 !important;
} }
.matcard mat-form-field { .mat-card-content {
margin: 0 2%; background-color: white;
width:27%; }
} .mat-card-actions {
.matcards mat-form-field { background-color: white;
margin: 0 2%; }
width:40%;
} mat-form-field {
.address .button { margin: 0 2%;
float: right; }
width: 10px; $base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
background: #62B013; $product-bg-color-hover: rgba(103, 58, 183, 0.7);
color: white; .p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
} }

14
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/family-details/family-details.component.ts
View File

@ -2,7 +2,7 @@ import {
Component, Component,
OnInit, OnInit,
Inject, Inject,
Input Input, Output
} from '@angular/core'; } from '@angular/core';
import { import {
@ -29,7 +29,10 @@ import {ActivatedRoute, Router} from "@angular/router";
styleUrls: ['./family-details.component.scss'] styleUrls: ['./family-details.component.scss']
}) })
export class FamilyDetailsComponent implements OnInit { export class FamilyDetailsComponent implements OnInit {
@Input() pdid: number; //@Input() pdid: number;
pageTitle: string ="Family Details";
pdid : string;
form_id : number;
public currentLoanForm: FormGroup; public currentLoanForm: FormGroup;
private notifier: NotifierService; private notifier: NotifierService;
@ -54,8 +57,11 @@ export class FamilyDetailsComponent implements OnInit {
count : number; count : number;
constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute, constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute,
private router: Router, private router: Router,
private _pd: PdTrigerService) { private _pd: PdTrigerService,
this.notifier = notifier; @Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.form_id = 6;
this.notifier = notifier;
} }
ngOnInit() { ngOnInit() {
this.getMasterDetails('RELATIONSHIPS',1); this.getMasterDetails('RELATIONSHIPS',1);

249
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/financial-info/financial-info.component.html
View File

@ -1,4 +1,245 @@
<mat-card style="padding: 12px;"> <!-- <form [formGroup]="_personalForm" (submit)="submitPersonalForm(_personalForm.value)" novalidate> -->
<form [formGroup]="financialForm" class="address">
<h2 mat-dialog-title class="paragraph_change">
<div fxFlex="70" align="left">
{{pageTitle}}
</div>
<div fxFlex="30" align="end">
<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>
<mat-tab-group>
<mat-tab label="Questions">
<ng-template matTabContent>
<div fxLayout="row wrap">
<div fxFlex="100">
<mat-card>
<mat-card-header>
<p>Data as Per Financial Statements<p>
</mat-card-header>
<div formArrayName="date_per_financial">
<div *ngFor="let details of financialForm.controls.date_per_financial['controls']; let i=index"
[formGroupName]="i">
<mat-card-content class="matcard">
<mat-form-field>
<input matInput placeholder="Year (format: 2015-16)" formControlName="financial_year" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Annual Sale" formControlName="financial_annual_sale" (change)="calMargin(i, details)" type="number" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Net Profit / Loss" formControlName="financial_net_profit" (change)="calMargin( i, details); calYearVariation( i, details)" type="number" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Net Profit to Sales %" formControlName="financial_margin" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field *ngIf="i != 0">
<input matInput [ngClass]="{'highlight': (details.controls['financial_variation'].value > 40) || (details.controls['financial_variation'].value < -40)}" placeholder="Variation from Previous Year" formControlName="financial_variation" (keypress)="keyPress($event)">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Reason For Major Difference" formControlName="financial_reason" required>
</mat-form-field>
<button type="button" mat-raised-button mat-icon-button (click)="addDate()"
matTooltip="Add More Financial Statements" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary" *ngIf="i==0">
<mat-icon>add</mat-icon>
</button>
<button type="button" mat-raised-button mat-icon-button (click)="deleteDate(i)"
matTooltip="Delete" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" *ngIf="i>0">
<mat-icon>delete</mat-icon>
</button>
</mat-card-content>
</div>
</div>
</mat-card>
</div>
</div>
<div fxLayout="row wrap">
<div fxFlex="100">
<!-- start co applicant form details -->
<mat-card>
<mat-card-header>
<p>Actual Values as per Customer<p>
</mat-card-header>
<div formArrayName="estimated_value">
<div *ngFor="let details of financialForm.controls.estimated_value['controls']; let i=index"
[formGroupName]="i">
<mat-card-content class="matcard">
<mat-form-field>
<input matInput placeholder="Year (format: 2015-16)" formControlName="estimate_year" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Annual Sale" formControlName="estimate_annual_sale" (change)="calMarginVal( i, details)" type="number" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Net Profit / Loss" formControlName="estimate_net_profit" (change)="calMarginVal( i, details); calVariation( i, details)" type="number" required>
</mat-form-field>
<mat-form-field>
<input matInput disabled placeholder="Margin" formControlName="estimate_margin" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field *ngIf="i != 0">
<input matInput [ngClass]="{'highlight': details.controls['estimate_variation'].value >= 40 || details.controls['estimate_variation'].value >= -40}" placeholder="Variation from Previous Year" formControlName="estimate_variation" (keypress)="keyPress($event)">
</mat-form-field>
<!--<mat-form-field>
<input matInput placeholder="Reason For Major Difference" formControlName="estimate_reason" required>
</mat-form-field>-->
<button type="button" mat-raised-button mat-icon-button (click)="addGoods()"
matTooltip="Add More Estimated Value" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary" *ngIf="i==0">
<mat-icon>add</mat-icon>
</button>
<button type="button" mat-raised-button mat-icon-button (click)="deleteGoods(i)"
matTooltip="Delete" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" *ngIf="i>0">
<mat-icon>delete</mat-icon>
</button>
</mat-card-content>
</div>
</div>
</mat-card>
<!-- end co apllicant -->
</div>
</div>
</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">
<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>
</ng-template>
</mat-tab>
</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="financial_remarks" required></textarea>
</mat-form-field>
</div>
<div fxFlex="40" align="end">
<button type="submit" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button matTooltip="Submit" matTooltipPosition="above" (click)="submitDetails()"><mat-icon>save</mat-icon>
</button>
</div>
</mat-dialog-actions>
</form>
<notifier-container></notifier-container>
<!-- <mat-card style="padding: 12px;">
<p>Financial Information</p> <p>Financial Information</p>
<form [formGroup]="financialForm" class="address"> <form [formGroup]="financialForm" class="address">
<mat-card> <mat-card>
@ -66,7 +307,7 @@
<!--<mat-form-field> <!--<mat-form-field>
<input matInput placeholder="Reason For Major Difference" formControlName="estimate_reason" required> <input matInput placeholder="Reason For Major Difference" formControlName="estimate_reason" required>
</mat-form-field>--> </mat-form-field>-->
<button type="button" mat-raised-button mat-icon-button (click)="addGoods()" <!-- <button type="button" mat-raised-button mat-icon-button (click)="addGoods()"
matTooltip="Add More Estimated Value" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary" *ngIf="i==0"> matTooltip="Add More Estimated Value" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary" *ngIf="i==0">
<mat-icon>add</mat-icon> <mat-icon>add</mat-icon>
</button> </button>
@ -90,5 +331,5 @@
<button type="submit" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button matTooltip="Submit" matTooltipPosition="above" (click)="submitDetails()"><mat-icon>save</mat-icon> <button type="submit" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button matTooltip="Submit" matTooltipPosition="above" (click)="submitDetails()"><mat-icon>save</mat-icon>
</button> </button>
</div> </div>
</form> </form>
</mat-card> </mat-card> -->

124
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/financial-info/financial-info.component.scss
View File

@ -1,22 +1,108 @@
.address { // .address {
display: flex; // display: flex;
padding: 0 2%; // padding: 0 2%;
flex-direction: column; // flex-direction: column;
} // }
.address > * { // .address > * {
width: 100%; // width: 100%;
// }
// .matcard mat-form-field {
// margin: 0 2%;
// width:26%
// }
// .address .button {
// float: right;
// width: 10px;
// background: #62B013;
// color: white;
// }
// .highlight {
// color: red;
// }
.paragraph_change {
color: #e00201 !important;
} }
.matcard mat-form-field { .mat-card-content {
margin: 0 2%; background-color: white;
width:26% }
.mat-card-actions {
background-color: white;
}
mat-form-field {
margin: 0 2%;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
} }
.address .button {
float: right;
width: 10px;
background: #62B013;
color: white;
}
.highlight {
color: red;
}

17
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/financial-info/financial-info.component.ts
View File

@ -29,18 +29,25 @@ import {ActivatedRoute, Router} from '@angular/router';
styleUrls: ['./financial-info.component.scss'] styleUrls: ['./financial-info.component.scss']
}) })
export class FinancialInfoComponent implements OnInit { export class FinancialInfoComponent implements OnInit {
@Input() pdid: number; pageTitle: string ="Financial Information";
@Input() form_id: number; pdid: string;
form_id: number;
public financialForm: FormGroup; public financialForm: FormGroup;
private notifier: NotifierService; private notifier: NotifierService;
marginVal: any = [] ; marginVal: any = [] ;
setmargin: AbstractControl; setmargin: AbstractControl;
constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute, constructor(notifier: NotifierService,
private fb: FormBuilder,
private route: ActivatedRoute,
private router: Router, private router: Router,
private _pd: PdTrigerService) { private _pd: PdTrigerService,
this.notifier = notifier; @Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.form_id = 14;
this.notifier = notifier;
} }
ngOnInit() { ngOnInit() {
this.initstockForm(); this.initstockForm();
let params: any = {}; let params: any = {};
params.pd_id = this.pdid; params.pd_id = this.pdid;

220
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/lender-representative/lender-representative.component.html
View File

@ -1,43 +1,181 @@
<mat-card style="min-height: 550px;"> <form [formGroup]="representativeForm" class="address">
<mat-card-content> <h2 mat-dialog-title class="paragraph_change">
<p>Lender Representative Details</p> <div fxFlex="70" align="left">
<form [formGroup]="representativeForm" class="address"> {{pageTitle}}
<mat-form-field> </div>
<mat-select (selectionChange)="selectedLoanChanges($event)" placeholder="Did the lender representative accompany the PD officer for PD?" <div fxFlex="30" align="end">
formControlName="lender_representative_accompany"> <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>
<mat-option value="Yes">Yes</mat-option>
<mat-option value="No">No</mat-option> </div>
</mat-select> </h2>
</mat-form-field>
<div *ngIf="representativeForm.controls.lender_representative_accompany.value == 'Yes'">
<div formArrayName="lender_representative_details">
<div *ngFor="let details of representativeForm.get('lender_representative_details').controls; let i=index"
[formGroupName]="i">
<mat-form-field>
<input matInput placeholder="What is the name of lender representative who accompanies the PD officer, If any?" formControlName="lender_representative_who_accompanies" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Did the lender representative carry the loan file during PD?" formControlName="lender_representative_carry_loan_files" required>
</mat-form-field>
</div>
</div>
</div>
<div fxLayout="row">
<div fxFlex="60" class="pb-0 text-sm-left">
<mat-form-field appearance="outline" style="width: 100%">
<mat-label>Remarks</mat-label>
<textarea matInput placeholder="Remarks" formControlName="representative_remarks"></textarea>
</mat-form-field>
</div>
</div>
<div style="text-align: right;">
<button type="submit" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button matTooltip="Submit" matTooltipPosition="above" type="button" (click)="submitLRForm()"><mat-icon>save</mat-icon>
</button>
</div>
</form>
</mat-card-content>
</mat-card>
<mat-dialog-content>
<mat-tab-group>
<mat-tab label="Questions">
<ng-template matTabContent>
<div fxLayout="row wrap">
<div fxFlex="100">
<mat-card>
<mat-card-content>
<mat-form-field>
<mat-select (selectionChange)="selectedLoanChanges($event)" placeholder="Did the lender representative accompany the PD officer for PD?"
formControlName="lender_representative_accompany">
<mat-option value="Yes">Yes</mat-option>
<mat-option value="No">No</mat-option>
</mat-select>
</mat-form-field>
<div *ngIf="representativeForm.controls.lender_representative_accompany.value == 'Yes'">
<div formArrayName="lender_representative_details">
<div *ngFor="let details of representativeForm.get('lender_representative_details').controls; let i=index"
[formGroupName]="i">
<mat-form-field>
<input matInput placeholder="What is the name of lender representative who accompanies the PD officer, If any?" formControlName="lender_representative_who_accompanies" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Did the lender representative carry the loan file during PD?" formControlName="lender_representative_carry_loan_files" required>
</mat-form-field>
</div>
</div>
</div>
</mat-card-content>
</mat-card>
</div>
</div>
</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">
<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>
</ng-template>
</mat-tab>
</mat-tab-group>
</mat-dialog-content>
<mat-dialog-actions>
<div fxFlex="60" class="pb-0 text-sm-left">
<mat-form-field appearance="outline" style="width: 100%">
<mat-label>Remarks</mat-label>
<textarea matInput placeholder="Remarks" formControlName="representative_remarks"></textarea>
</mat-form-field>
</div>
<div fxFlex="40" align="end">
<button type="submit" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button matTooltip="Submit" matTooltipPosition="above" type="button" (click)="submitLRForm()"><mat-icon>save</mat-icon>
</button>
</div>
</mat-dialog-actions>
</form>

88
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/lender-representative/lender-representative.component.scss
View File

@ -1,5 +1,5 @@
.mat-form-field { .mat-form-field {
width: 100%; width: 97%;
} }
// .address > * { // .address > * {
@ -8,4 +8,88 @@
// .matcard mat-form-field { // .matcard mat-form-field {
// margin: 0 2%; // margin: 0 2%;
// width:100%; // width:100%;
// } // }
.paragraph_change {
color: #e00201 !important;
}
.mat-card-content {
background-color: white;
}
.mat-card-actions {
background-color: white;
}
mat-form-field {
margin: 0 2%;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
}

23
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/lender-representative/lender-representative.component.ts
View File

@ -1,6 +1,11 @@
import {Component,OnInit,Inject,Input } from '@angular/core'; import {Component,OnInit,Inject,Input } from '@angular/core';
import {FormBuilder,FormGroup,Validators,FormArray, FormControl,} from '@angular/forms'; import {FormBuilder,FormGroup,Validators,FormArray, FormControl,} from '@angular/forms';
import { NotifierService } from 'angular-notifier'; import { NotifierService } from 'angular-notifier';
import {
MatDialog,
MatDialogRef,
MAT_DIALOG_DATA
} from '@angular/material';
/** Service */ /** Service */
import { PdTrigerService } from '../../../../../pd-service/pd-triger.service'; import { PdTrigerService } from '../../../../../pd-service/pd-triger.service';
import { ActivatedRoute, Router } from "@angular/router"; import { ActivatedRoute, Router } from "@angular/router";
@ -13,15 +18,21 @@ import { ActivatedRoute, Router } from "@angular/router";
export class LenderRepresentativeComponent implements OnInit { export class LenderRepresentativeComponent implements OnInit {
public representativeForm: FormGroup; public representativeForm: FormGroup;
private notifier: NotifierService; private notifier: NotifierService;
@Input() pdid: number; pageTitle: string ="Lender Representative Details";
@Input() form_id: number; pdid: number;
form_id: number;
constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute, constructor(notifier: NotifierService,
private router: Router, private fb: FormBuilder,
private _pd: PdTrigerService) { private route: ActivatedRoute,
private router: Router,
private _pd: PdTrigerService,
@Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.form_id = 15;
this.notifier = notifier; this.notifier = notifier;
} }
ngOnInit() { ngOnInit() {
this.initRepresentative(); this.initRepresentative();
let params: any = {}; let params: any = {};

338
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/loan-details/loan-details.component.html
View File

@ -1,71 +1,87 @@
<mat-card style="padding: 12px;">
<p>Loan Details</p>
<form [formGroup]="loanDetailsForm" class="address"> <form [formGroup]="loanDetailsForm" class="address">
<mat-form-field> <h2 mat-dialog-title class="paragraph_change">
<input matInput placeholder="Loan Amount Applied for ? " formControlName="loan_amount" (keypress)="keyPress($event)" (keyup)="inWords($event,1)" required > <div fxFlex="70" align="left">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['loan_amount'].value != ''">{{"&#8377;"}} {{loanAmtInWords}} Only</mat-hint> {{pageTitle}}
</mat-form-field> </div>
<mat-form-field> <div fxFlex="30" align="end">
<mat-select multiple (selectionChange)="endUserChange($event)" placeholder="What is the end use" formControlName="end_use" required> <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>
<mat-option *ngFor="let enduse of m_endUseofLoad" [value]="enduse.id">{{ enduse.name }}</mat-option>
</mat-select> </div>
<!--<mat-select multiple placeholder="What is the end use" </h2>
formControlName="end_use" (selectionChange)="endUserChange($event)">
<mat-option value="purchase_of_property"> Puchase of property</mat-option>
<mat-option value="construction">Construction</mat-option>
<mat-option value="extention">Extention</mat-option>
<mat-option value="improvement">Improvement</mat-option>
<mat-option value="working_capital">Working capital</mat-option>
<mat-option value="purchase_of_business_asset">Purchase of business asset</mat-option>
<mat-option value="to_close_an_existing_debt">to close an existing debt</mat-option>
<mat-option value="other">Other purpose</mat-option>
</mat-select>-->
</mat-form-field>
<mat-form-field *ngIf="isOtherPurpose">
<input matInput placeholder="Specify End Use" formControlName="end_use_other">
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Is there a balance transfer ? " (selectionChange)="selectedBalancesTransferChanges($event)"
formControlName="is_transfer" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['is_transfer'].value == 'yes'">
<input matInput placeholder="What is the amount required for Balance Transfer ? " (keypress)="keyPress($event)" formControlName="balance_transfer_amount" (keyup)="inWords($event,2)">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['loan_amount'].value != ''">{{"&#8377;"}} {{balTxrfAmtInWords}} Only</mat-hint>
</mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['is_transfer'].value == 'yes'">
<mat-select placeholder="Is there a Top Up"
formControlName="is_topup" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['is_transfer'].value == 'yes'">
<mat-select placeholder="Lender from where balance transfer done"
formControlName="lender">
<mat-option *ngFor="let btLen of m_btLenderList" [value]="btLen.bt_lender_list_id">{{ btLen.lender_name }}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['lender'].value == 3">
<input matInput placeholder="Specify Others Lender" formControlName="other_bt_lender">
</mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['is_transfer'].value == 'yes' && loanDetailsForm.controls['is_topup'].value == 'yes'">
<input matInput placeholder="Top Up Amt" (keypress)="keyPress($event)" formControlName="topup_amount" (keyup)="inWords($event,5)">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['topup_amount'].value != ''">{{"&#8377;"}} {{topUpAmtInWords}} Only</mat-hint>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Amount of Own Contribution" formControlName="own_contribution" (keypress)="keyPress($event)" required (keyup)="inWords($event,4)">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['own_contribution'].value != ''">{{"&#8377;"}} {{ownContributionInWords}} Only</mat-hint>
</mat-form-field>
<mat-form-field> <mat-dialog-content>
<mat-select placeholder="Source" formControlName="source" required>
<mat-option *ngFor="let sour of m_sourceofamount" [value]="sour.id">{{ sour.name }}</mat-option> <mat-tab-group>
</mat-select> <mat-tab label="Questions">
<ng-template matTabContent>
<div fxLayout="row wrap">
<div fxFlex="100">
<mat-card>
<mat-form-field>
<input matInput placeholder="Loan Amount Applied for ? " formControlName="loan_amount" (keypress)="keyPress($event)" (keyup)="inWords($event,1)" required >
<mat-hint align="end" *ngIf="loanDetailsForm.controls['loan_amount'].value != ''">{{"&#8377;"}} {{loanAmtInWords}} Only</mat-hint>
</mat-form-field>
<mat-form-field>
<mat-select multiple (selectionChange)="endUserChange($event)" placeholder="What is the end use" formControlName="end_use" required>
<mat-option *ngFor="let enduse of m_endUseofLoad" [value]="enduse.id">{{ enduse.name }}</mat-option>
</mat-select>
<!--<mat-select multiple placeholder="What is the end use"
formControlName="end_use" (selectionChange)="endUserChange($event)">
<mat-option value="purchase_of_property"> Puchase of property</mat-option>
<mat-option value="construction">Construction</mat-option>
<mat-option value="extention">Extention</mat-option>
<mat-option value="improvement">Improvement</mat-option>
<mat-option value="working_capital">Working capital</mat-option>
<mat-option value="purchase_of_business_asset">Purchase of business asset</mat-option>
<mat-option value="to_close_an_existing_debt">to close an existing debt</mat-option>
<mat-option value="other">Other purpose</mat-option>
</mat-select>-->
</mat-form-field>
<mat-form-field *ngIf="isOtherPurpose">
<input matInput placeholder="Specify End Use" formControlName="end_use_other">
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Is there a balance transfer ? " (selectionChange)="selectedBalancesTransferChanges($event)"
formControlName="is_transfer" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['is_transfer'].value == 'yes'">
<input matInput placeholder="What is the amount required for Balance Transfer ? " (keypress)="keyPress($event)" formControlName="balance_transfer_amount" (keyup)="inWords($event,2)">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['loan_amount'].value != ''">{{"&#8377;"}} {{balTxrfAmtInWords}} Only</mat-hint>
</mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['is_transfer'].value == 'yes'">
<mat-select placeholder="Is there a Top Up"
formControlName="is_topup" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['is_transfer'].value == 'yes'">
<mat-select placeholder="Lender from where balance transfer done"
formControlName="lender">
<mat-option *ngFor="let btLen of m_btLenderList" [value]="btLen.bt_lender_list_id">{{ btLen.lender_name }}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['lender'].value == 3">
<input matInput placeholder="Specify Others Lender" formControlName="other_bt_lender">
</mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['is_transfer'].value == 'yes' && loanDetailsForm.controls['is_topup'].value == 'yes'">
<input matInput placeholder="Top Up Amt" (keypress)="keyPress($event)" formControlName="topup_amount" (keyup)="inWords($event,5)">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['topup_amount'].value != ''">{{"&#8377;"}} {{topUpAmtInWords}} Only</mat-hint>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Amount of Own Contribution" formControlName="own_contribution" (keypress)="keyPress($event)" required (keyup)="inWords($event,4)">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['own_contribution'].value != ''">{{"&#8377;"}} {{ownContributionInWords}} Only</mat-hint>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Source" formControlName="source" required>
<mat-option *ngFor="let sour of m_sourceofamount" [value]="sour.id">{{ sour.name }}</mat-option>
</mat-select>
<!--<mat-select placeholder="Source" <!--<mat-select placeholder="Source"
formControlName="source"> formControlName="source">
@ -123,46 +139,172 @@
<mat-form-field> <mat-form-field>
<mat-select placeholder="Status of Construction" formControlName="construction_status" required>
<mat-option *ngFor="let status of m_statusofCunstruction" [value]="status.id">{{ status.name }} {{status.id}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['construction_status'].value == 4"> <mat-select placeholder="Status of Construction" formControlName="construction_status" required>
<input matInput placeholder="What is the approximate stage of construction (%)?" <mat-option *ngFor="let status of m_statusofCunstruction" [value]="status.id">{{ status.name }} {{status.id}}</mat-option>
formControlName="percentage_of_construction" (keypress)="keyPress($event)" required> </mat-select>
</mat-form-field> </mat-form-field>
<!--<mat-select placeholder="Status of construction" <mat-form-field *ngIf="loanDetailsForm.controls['construction_status'].value == 4">
formControlName="construction_status"> <input matInput placeholder="What is the approximate stage of construction (%)?"
<mat-option value="other_purpose">Under-construction</mat-option> formControlName="percentage_of_construction" (keypress)="keyPress($event)" required>
<mat-option value="other_purpose">Complete</mat-option> </mat-form-field>
<mat-option value="other_purpose">Vacant Land</mat-option>
</mat-select>--> <!--<mat-select placeholder="Status of construction"
formControlName="construction_status">
<mat-option value="other_purpose">Under-construction</mat-option>
<mat-option value="other_purpose">Complete</mat-option>
<mat-option value="other_purpose">Vacant Land</mat-option>
</mat-select>-->
<mat-form-field>
<input matInput placeholder="Estimate Market Value as Per Customer"
formControlName="emv_per_customer" (keypress)="keyPress($event)" required>
</mat-form-field>
<!-- <mat-form-field>
<input matInput placeholder="Value as Per Agreement"
formControlName="value_per_agreement" (keypress)="keyPress($event)" required (keyup)="inWords($event,3)">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['loan_amount'].value != ''">{{"&#8377;"}} {{valAsPerAgmtInWords}} Only</mat-hint>
</mat-form-field> -->
<mat-form-field>
<input matInput placeholder="Estimate Market Value as Per Customer"
formControlName="emv_per_customer" (keypress)="keyPress($event)" required>
</mat-form-field>
</mat-card-content>
</mat-card>
</mat-card>
</div>
</div>
</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">
<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>
</ng-template>
</mat-tab>
</mat-tab-group>
</mat-dialog-content>
<mat-dialog-actions>
<mat-form-field>
<input matInput placeholder="Estimate Market Value as Per Customer"
formControlName="emv_per_customer" (keypress)="keyPress($event)" required>
</mat-form-field>
<!-- <mat-form-field>
<input matInput placeholder="Value as Per Agreement"
formControlName="value_per_agreement" (keypress)="keyPress($event)" required (keyup)="inWords($event,3)">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['loan_amount'].value != ''">{{"&#8377;"}} {{valAsPerAgmtInWords}} Only</mat-hint>
</mat-form-field> -->
</mat-card-content>
</mat-card>
<!-- </div> -->
<div fxLayout="row">
<div fxFlex="60" class="pb-0 text-sm-left"> <div fxFlex="60" class="pb-0 text-sm-left">
<mat-form-field appearance="outline" style="width: 100%"> <mat-form-field appearance="outline" style="width: 100%">
<mat-label>Remarks</mat-label> <mat-label>Remarks</mat-label>
<textarea matInput placeholder="Remarks" formControlName="loandetails_remarks" required></textarea> <textarea matInput placeholder="Remarks" formControlName="loandetails_remarks" required></textarea>
</mat-form-field> </mat-form-field>
</div> </div>
</div>
<div style="text-align: right;">
<div fxFlex="40" align="end">
<button type="submit" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button matTooltip="Submit" matTooltipPosition="above" (click)="submitLoanDetails()"><mat-icon>save</mat-icon> <button type="submit" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button matTooltip="Submit" matTooltipPosition="above" (click)="submitLoanDetails()"><mat-icon>save</mat-icon>
</button> </button>
</div> </div>
</form> </mat-dialog-actions>
</mat-card>
</form>
<notifier-container></notifier-container>

85
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/loan-details/loan-details.component.scss
View File

@ -19,4 +19,89 @@
width: 10px; width: 10px;
background: #62B013; background: #62B013;
color: white; color: white;
}
.paragraph_change {
color: #e00201 !important;
}
.mat-card-content {
background-color: white;
}
.mat-card-actions {
background-color: white;
}
mat-form-field {
margin: 0 2%;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
} }

42
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/loan-details/loan-details.component.ts
View File

@ -31,9 +31,10 @@ import {ActivatedRoute, Router} from '@angular/router';
export class LoanDetailsComponent implements OnInit { export class LoanDetailsComponent implements OnInit {
public loanDetailsForm: FormGroup; public loanDetailsForm: FormGroup;
private notifier: NotifierService; private notifier: NotifierService;
@Input() pdid: number; pdid: number;
@Input() form_id: number; form_id: number;
@Input() applicant_details: any; exist_loan_amt: any;
applicants: any; applicants: any;
productAbbr: any; productAbbr: any;
isOtherPurpose: boolean = false; isOtherPurpose: boolean = false;
@ -52,19 +53,24 @@ export class LoanDetailsComponent implements OnInit {
valAsPerAgmtInWords : any; valAsPerAgmtInWords : any;
ownContributionInWords : any; ownContributionInWords : any;
topUpAmtInWords: any; topUpAmtInWords: any;
pageTitle: string ="Loan Details";
constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute, constructor(notifier: NotifierService,
private router: Router, private fb: FormBuilder,
private _pd: PdTrigerService) { private route: ActivatedRoute,
private router: Router,
this.notifier = notifier; private _pd: PdTrigerService,
@Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
this.applicants = this.pd_all_details.pdapplicants_detials;
this.productAbbr = this.pd_all_details.pdmaster_details.product_abbr;
this.exist_loan_amt = this.pd_all_details.pdmaster_details.loan_amount != '' ? this.pd_all_details.pdmaster_details.loan_amount :'';
this.loanAmtInWords = this._pd.convertNumberToWords(this.exist_loan_amt);
this.form_id = 10;
this.pdid= this.pd_all_details.pdmaster_details.pd_id;
this.notifier = notifier;
} }
ngOnInit() {
ngOnInit() {
console.log(this.applicant_details.pdapplicants_detials);
console.log(this.applicant_details);
this.applicants = this.applicant_details.pdapplicants_detials;
this.productAbbr = this.applicant_details.pdmaster_details.product_abbr;
this.initloanDetailsForm(); this.initloanDetailsForm();
this.getM_EndUseofLoad(); this.getM_EndUseofLoad();
@ -176,10 +182,9 @@ getM_sourceofamount() {
// this._pd.getAllMasterDatas('MORTAGEPROPERTYTYPE').subscribe( // this._pd.getAllMasterDatas('MORTAGEPROPERTYTYPE').subscribe(
this._pd.getAllMasterDatas('MORTAGEPROPERTIES').subscribe( this._pd.getAllMasterDatas('MORTAGEPROPERTIES').subscribe(
data => { data => {
console.log('sadfdfads',this.productAbbr); // console.log('sadfdfads',this.productAbbr);
this.m_mortageTypeProperty = data.records.filter(data => data.isactive == 1); this.m_mortageTypeProperty = data.records.filter(data => data.isactive == 1);
this.m_mortageTypeProperty = data.records.filter(data => data.group == this.productAbbr); this.m_mortageTypeProperty = data.records.filter(data => data.group_name == this.productAbbr);
}, },
error => { error => {
// this.notifier.notify('warning', 'No Category Records Found.!'); // this.notifier.notify('warning', 'No Category Records Found.!');
@ -211,7 +216,8 @@ getM_sourceofamount() {
// ================== // ==================
public initloanDetailsForm(): void { public initloanDetailsForm(): void {
this.loanDetailsForm = this.fb.group({ this.loanDetailsForm = this.fb.group({
loan_amount: [this.applicant_details.loan_amount, Validators.compose([Validators.required])],
loan_amount: [this.exist_loan_amt, Validators.compose([Validators.required])],
end_use: ['', Validators.compose([Validators.required])], end_use: ['', Validators.compose([Validators.required])],
end_use_other: [''], end_use_other: [''],
is_transfer: ['', Validators.compose([Validators.required])], is_transfer: ['', Validators.compose([Validators.required])],

238
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/other-income/other-income.component.html
View File

@ -1,3 +1,225 @@
<form [formGroup]="otherIncomeForm" class="address">
<h2 mat-dialog-title class="paragraph_change">
<div fxFlex="70" align="left">
{{pageTitle}}
</div>
<div fxFlex="30" align="end">
<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>
<mat-tab-group>
<mat-tab label="Questions">
<ng-template matTabContent>
<div fxLayout="row wrap">
<div fxFlex="100">
<mat-card>
<!-- <mat-card-title></mat-card-title> -->
<mat-card-content>
<mat-form-field style="width:25% !important;">
<mat-select (selectionChange)="selectedLoanChanges($event)" 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-content>
</mat-card>
<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" required>
<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-option value="others">Others</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="details.get('source').value == 'others'">
<input matInput placeholder="Specify Others Source"
formControlName="others_source">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Amount" formControlName="amount" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Frequency" formControlName="frequency" required>
<mat-option value="{{frq.frequency_id}}" *ngFor="let frq of frequencyData">{{frq.name}}</mat-option>
</mat-select>
</mat-form-field>
<!-- {{otherIncomeForm.controls.frequency.value}} -->
<mat-form-field *ngIf="details.get('frequency').value == 8">
<input matInput placeholder="Specify Others Frequency"
formControlName="others_frequency">
</mat-form-field>
<button type="button" matTooltip="Add More Income Details" class="mr-1 mb-1 hover-icon" matTooltipPosition="above" mat-raised-button mat-icon-button (click)="addIncomeDetails()"
color="primary" *ngIf="i==0">
<mat-icon>add</mat-icon>
</button>
<button type="button" matTooltip="Delete" class="mr-1 mb-1 hover-icon" 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>
</div>
</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">
<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>
</ng-template>
</mat-tab>
</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="otherincome_remarks" required></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" (click)="submitCurrentDetails()"><mat-icon>save</mat-icon></button>
</div>
</mat-dialog-actions>
</form>
<notifier-container></notifier-container>
<!--<mat-card style="padding: 12px;">--> <!--<mat-card style="padding: 12px;">-->
<!--<form [formGroup]="otherIncomeForm" class="address">--> <!--<form [formGroup]="otherIncomeForm" class="address">-->
<!--<mat-form-field>--> <!--<mat-form-field>-->
@ -16,7 +238,7 @@
<!--[formGroupName]="i">--> <!--[formGroupName]="i">-->
<!--<mat-card-content class="matcard">--> <!--<mat-card-content class="matcard">-->
<mat-card style="min-height: 550px;"> <!--<mat-card style="min-height: 550px;">
<mat-card-content> <mat-card-content>
<p>Other Income Details</p> <p>Other Income Details</p>
<form [formGroup]="otherIncomeForm" class="address"> <form [formGroup]="otherIncomeForm" class="address">
@ -26,7 +248,7 @@
<mat-option value="Yes">Yes</mat-option> <mat-option value="Yes">Yes</mat-option>
<mat-option value="No">No</mat-option> <mat-option value="No">No</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>-->
<!--<mat-form-field>--> <!--<mat-form-field>-->
<!--<input matInput placeholder="Amount" formControlName="amount">--> <!--<input matInput placeholder="Amount" formControlName="amount">-->
@ -55,7 +277,7 @@
<!--</form>--> <!--</form>-->
<!--</mat-card>--> <!--</mat-card>-->
<mat-card *ngIf="otherIncomeForm.controls.other_income.value == 'Yes'"> <!--<mat-card *ngIf="otherIncomeForm.controls.other_income.value == 'Yes'">
<mat-card-header> <mat-card-header>
<p>Income Details<p> <p>Income Details<p>
</mat-card-header> </mat-card-header>
@ -74,7 +296,7 @@
<mat-option value="agricultural_income">Agricultural Income</mat-option> <mat-option value="agricultural_income">Agricultural Income</mat-option>
<mat-option value="dividend_income">Dividend Income</mat-option> <mat-option value="dividend_income">Dividend Income</mat-option>
<mat-option value="others">Others</mat-option> --> <mat-option value="others">Others</mat-option> -->
</mat-select> <!-- </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field *ngIf="details.get('source').value == 5 "> <mat-form-field *ngIf="details.get('source').value == 5 ">
<input matInput placeholder="Specify Others Source" <input matInput placeholder="Specify Others Source"
@ -87,12 +309,12 @@
<mat-form-field> <mat-form-field>
<mat-select placeholder="Frequency" formControlName="frequency" required> <mat-select placeholder="Frequency" formControlName="frequency" required>
<mat-option value="{{frq.frequency_id}}" *ngFor="let frq of frequencyData">{{frq.name}}</mat-option> <mat-option value="{{frq.frequency_id}}" *ngFor="let frq of frequencyData">{{frq.name}}</mat-option>
</mat-select> </mat-select> --
</mat-form-field> </mat-form-field>-->
<!-- {{otherIncomeForm.controls.frequency.value}} --> <!-- {{otherIncomeForm.controls.frequency.value}} -->
<mat-form-field *ngIf="details.get('frequency').value == 8"> <!-- <mat-form-field *ngIf="details.get('frequency').value == 8">
<input matInput placeholder="Specify Others Frequency" <input matInput placeholder="Specify Others Frequency"
formControlName="others_frequency"> formControlName="others_frequency">
</mat-form-field> </mat-form-field>
@ -122,4 +344,4 @@
</div> </div>
</form> </form>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>-->

115
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/other-income/other-income.component.scss
View File

@ -1,18 +1,103 @@
.address { // .address {
display: flex; // display: flex;
padding: 0 2%; // padding: 0 2%;
flex-direction: column; // flex-direction: column;
} // }
.address > * { // .address > * {
width: 100%; // width: 100%;
// }
// .matcard mat-form-field {
// margin: 0 2%;
// }
// .address .button {
// float: right;
// width: 10px;
// background: #62B013;
// color: white;
// }
.paragraph_change {
color: #e00201 !important;
} }
.matcard mat-form-field { .mat-card-content {
margin: 0 2%; background-color: white;
}
.mat-card-actions {
background-color: white;
}
mat-form-field {
margin: 0 2%;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
} }
.address .button {
float: right;
width: 10px;
background: #62B013;
color: white;
}

28
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/other-income/other-income.component.ts
View File

@ -2,7 +2,7 @@ import {
Component, Component,
OnInit, OnInit,
Inject, Inject,
Input Input, Output
} from '@angular/core'; } from '@angular/core';
import { import {
@ -19,6 +19,7 @@ import {
MatDialogRef, MatDialogRef,
MAT_DIALOG_DATA MAT_DIALOG_DATA
} from '@angular/material'; } from '@angular/material';
/** Service */ /** Service */
import { PdTrigerService } from '../../../../../pd-service/pd-triger.service'; import { PdTrigerService } from '../../../../../pd-service/pd-triger.service';
import {ActivatedRoute, Router} from '@angular/router'; import {ActivatedRoute, Router} from '@angular/router';
@ -28,20 +29,35 @@ import {ActivatedRoute, Router} from '@angular/router';
templateUrl: './other-income.component.html', templateUrl: './other-income.component.html',
styleUrls: ['./other-income.component.scss'] styleUrls: ['./other-income.component.scss']
}) })
export class OtherIncomeComponent implements OnInit { export class OtherIncomeComponent implements OnInit {
@Input() pdid: number; pageTitle: string ="Other Income Details";
@Input() form_id: number; loadDataStatus: boolean=true;
// @Input() pdid: number;
// @Input() form_id: number;
pdid : string;
form_id:number;
public otherIncomeForm: FormGroup; public otherIncomeForm: FormGroup;
private notifier: NotifierService; private notifier: NotifierService;
frequencyData: any = []; frequencyData: any = [];
sourceData : any = []; sourceData : any = [];
constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute, constructor(notifier: NotifierService,
private fb: FormBuilder,
private route: ActivatedRoute,
private router: Router, private router: Router,
private _pd: PdTrigerService) { private _pd: PdTrigerService,
this.notifier = notifier; @Inject(MAT_DIALOG_DATA) public pd_all_details: any)
{
this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.form_id = 9;
this.notifier = notifier;
} }
ngOnInit() { ngOnInit() {
console.clear();
this.getFrequency(); this.getFrequency();
this.getSourceOtherIncome(); this.getSourceOtherIncome();
this.initOtherincomeForm(); this.initOtherincomeForm();

396
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/personal-info/personal-info.component.html
View File

@ -1,145 +1,267 @@
<mat-card style="padding: 12px;"> <form [formGroup]="_personalForm" (submit)="submitPersonalForm(_personalForm.value)" novalidate>
<p>Personal Details</p>
<form *ngIf="loadDataStatus" [formGroup]="_personalForm" (submit)="submitPersonalForm(_personalForm.value)" novalidate>
<!-- start main applicant -->
<mat-card>
<mat-card-title>Main Applicant</mat-card-title>
<mat-card-content formArrayName="main_applicant_details">
<div *ngFor="let mainDetails of _personalForm.controls.main_applicant_details['controls']; let i = index;" [formGroupName]="i">
<mat-form-field style="width: 35%"> <h2 mat-dialog-title class="paragraph_change">
<input matInput placeholder="Name" formControlName="name_ans" type="text" required> <div fxFlex="70" align="left">
{{pageTitle}}
</mat-form-field>
<mat-form-field style="width: 10%">
<input matInput placeholder="Age" formControlName="age_ans" type="text" required (keypress)="keyPress($event)">
<mat-error *ngIf="mainDetails['controls'].age_ans.hasError('pattern') || mainDetails['controls'].age_ans.hasError('maxlength') || mainDetails['controls'].age_ans.hasError('minlength')">Enter Valid Age. </mat-error>
</mat-form-field>
<mat-form-field style="width: 42%">
<input matInput placeholder="Entity" formControlName="entity_ans" type="text" required>
</mat-form-field>
<mat-form-field style="width: 49%">
<mat-select placeholder="Earning Status" formControlName="earning_ans" required>
<mat-option *ngFor="let earning of earningStatus" [value]="earning.earning_member_status_id" >
{{earning.earning_member_status}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width: 42%">
<mat-select placeholder="Educational Qualification" formControlName="qualification_ans" required>
<mat-option *ngFor="let education of qualifications" [value]="education.qualification_id" >
{{education.qualification_name}}
</mat-option>
</mat-select>
</mat-form-field>
</div> </div>
<div fxFlex="30" align="end">
</mat-card-content> <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>
</mat-card>
<!-- end main applicant --> </div>
</h2>
<!-- start co applicant form details --> <mat-dialog-content>
<mat-card>
<mat-card-title>Co Applicant</mat-card-title>
<mat-card-content formArrayName="co_applicant_details">
<mat-card *ngFor="let coDetails of _personalForm.controls.co_applicant_details['controls']; let c = index;" [formGroupName]="c">
<mat-card-content>
<mat-form-field style="width: 20%">
<!-- <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: 10%">
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> -->
<input matInput placeholder="Age" formControlName="age_ans" type="text" required>
<mat-error *ngIf="coDetails['controls'].age_ans.hasError('pattern') || coDetails['controls'].age_ans.hasError('maxlength') || coDetails['controls'].age_ans.hasError('minlength')">Enter Valid Age. </mat-error>
</mat-form-field>
<mat-form-field style="width: 20%"> <mat-tab-group>
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> --> <mat-tab label="Questions">
<ng-template matTabContent>
<input matInput placeholder="Entity" formControlName="entity_ans" type="text" required> <div fxLayout="row wrap">
</mat-form-field> <div fxFlex="100">
<mat-form-field style="width: 34%"> <!-- start main applicant -->
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> --> <mat-card>
<mat-select placeholder="Earning Status" formControlName="earning_ans" required> <mat-card-title>Main Applicant</mat-card-title>
<mat-option *ngFor="let earning of earningStatus" [value]="earning.earning_member_status_id" > <mat-card-content formArrayName="main_applicant_details">
{{earning.earning_member_status}} <div *ngFor="let mainDetails of _personalForm.controls.main_applicant_details['controls']; let i = index;" [formGroupName]="i">
</mat-option>
</mat-select> <mat-form-field style="width: 20%">
</mat-form-field> <input matInput placeholder="Name" formControlName="name_ans" type="text" required>
<mat-form-field style="width: 34%">
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> --> </mat-form-field>
<mat-form-field style="width: 5%">
<mat-select placeholder="Educational Qualification" formControlName="qualification_ans" required>
<mat-option *ngFor="let education of qualifications" [value]="education.qualification_id" > <input matInput placeholder="Age" formControlName="age_ans" type="text" required (keypress)="keyPress($event)">
{{education.qualification_name}} <mat-error *ngIf="mainDetails['controls'].age_ans.hasError('pattern') || mainDetails['controls'].age_ans.hasError('maxlength') || mainDetails['controls'].age_ans.hasError('minlength')">Enter Valid Age. </mat-error>
</mat-option>
</mat-select> </mat-form-field>
<mat-form-field style="width: 15%">
</mat-form-field>
<input matInput placeholder="Entity" formControlName="entity_ans" type="text" required>
</mat-form-field>
<mat-form-field style="width: 20%">
<mat-select placeholder="Earning Status" formControlName="earning_ans" required>
<mat-option *ngFor="let earning of earningStatus" [value]="earning.earning_member_status_id" >
{{earning.earning_member_status}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width: 20%">
<mat-select placeholder="Educational Qualification" formControlName="qualification_ans" required>
<mat-option *ngFor="let education of qualifications" [value]="education.qualification_id" >
{{education.qualification_name}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<mat-form-field style="width: 48%"> </mat-card-content>
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> --> </mat-card>
<mat-select placeholder="Relationship With Main Applicant" formControlName="relation_ans" required> <!-- end main applicant -->
<mat-option *ngFor="let rel of relationShipList" [value]="rel.relationship_id" > </div>
{{rel.name}} </div>
</mat-option> <div fxLayout="row wrap">
</mat-select> <div fxFlex="100">
</mat-form-field> <!-- start co applicant form details -->
<button type="button" mat-raised-button mat-icon-button (click)="removeCoApplicant(c)" <mat-card>
matTooltip="Remove Co Applicant" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary" *ngIf="coDetails.controls.current_added_status.value==1"> <mat-card-title>Co Applicant</mat-card-title>
<mat-icon>delete</mat-icon> <mat-card-content formArrayName="co_applicant_details">
</button> <mat-card *ngFor="let coDetails of _personalForm.controls.co_applicant_details['controls']; let c = index;" [formGroupName]="c">
<mat-card-content>
<mat-form-field style="width: 20%">
<!-- <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: 10%">
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> -->
<input matInput placeholder="Age" formControlName="age_ans" type="text" required>
<mat-error *ngIf="coDetails['controls'].age_ans.hasError('pattern') || coDetails['controls'].age_ans.hasError('maxlength') || coDetails['controls'].age_ans.hasError('minlength')">Enter Valid Age. </mat-error>
</mat-form-field>
<mat-form-field style="width: 25%">
<!-- <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: 25%">
<!-- <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_member_status_id" >
{{earning.earning_member_status}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width: 34%">
<!-- <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.qualification_id" >
{{education.qualification_name}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width: 40%">
<!-- <mat-label>{{coDetails.controls.pd_question.value}}</mat-label> -->
<mat-select placeholder="Relationship With Main Applicant" formControlName="relation_ans" required>
<mat-option *ngFor="let rel of relationShipList" [value]="rel.relationship_id" >
{{rel.name}}
</mat-option>
</mat-select>
</mat-form-field>
<button type="button" mat-raised-button mat-icon-button (click)="removeCoApplicant(c)"
matTooltip="Remove Co Applicant" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary" *ngIf="coDetails.controls.current_added_status.value==1">
<mat-icon>delete</mat-icon>
</button>
</mat-card-content>
</mat-card>
</mat-card-content>
</mat-card> </mat-card-content>
<mat-card-actions align="end">
<button type="button" mat-raised-button mat-icon-button (click)="addCoApplicant()"
</mat-card-content> matTooltip="Add More Co Applicant" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary">
<mat-card-actions align="end"> <mat-icon>add</mat-icon>
<button type="button" mat-raised-button mat-icon-button (click)="addCoApplicant()" </button>
matTooltip="Add More Co Applicant" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary">
<mat-icon>add</mat-icon> </mat-card-actions>
</button>
</mat-card>
</mat-card-actions> <!-- end co apllicant -->
</div>
</div>
</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-card> <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>
</ng-template>
</mat-tab>
</mat-tab-group>
<!-- end co apllicant --> </mat-dialog-content>
<mat-dialog-actions>
<!-- <div fxLayout="row"> <div fxFlex="60" class="pb-0 text-sm-left" align="left">
<div fxFlex="60" class="pb-0 text-sm-left"> <mat-form-field appearance="outline" style="width: 100%">
<mat-form-field appearance="outline" style="width: 100%"> <mat-label>Remarks</mat-label>
<mat-label>Remarks</mat-label> <textarea matInput placeholder="Remarks" formControlName="personal_info_form_remark" required></textarea>
<textarea matInput placeholder="Remarks" formControlName="personal_info_form_remark" required></textarea> </mat-form-field>
</mat-form-field> </div>
</div> <div fxFlex="40" align="end">
</div> --> <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>
<!-- end co applicant form details --> </div>
<!-- </mat-card-content> --> </mat-dialog-actions>
<mat-card-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="personal_info_form_remark" required></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>
</div>
</mat-card-actions>
</form>
</mat-card>

74
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/personal-info/personal-info.component.scss
View File

@ -1,3 +1,6 @@
.paragraph_change {
color: #e00201 !important;
}
.mat-card-content { .mat-card-content {
background-color: white; background-color: white;
} }
@ -8,4 +11,75 @@
mat-form-field { mat-form-field {
margin: 0 2%; margin: 0 2%;
} }
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
}

14
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/personal-info/personal-info.component.ts
View File

@ -1,5 +1,6 @@
import { Component, OnInit , Input, Output } from '@angular/core'; import { Component, OnInit, Input, Output, Inject } from '@angular/core';
import { FormBuilder, FormGroup, Validators, FormControl, FormArray } from '@angular/forms'; import { FormBuilder, FormGroup, Validators, FormControl, FormArray } from '@angular/forms';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA , DialogPosition} from '@angular/material';
import { NotifierService } from 'angular-notifier'; import { NotifierService } from 'angular-notifier';
import { PdTrigerService } from './../../../../../pd-service/pd-triger.service'; import { PdTrigerService } from './../../../../../pd-service/pd-triger.service';
import { Key } from 'protractor'; import { Key } from 'protractor';
@ -9,8 +10,10 @@ import { Key } from 'protractor';
templateUrl: './personal-info.component.html', templateUrl: './personal-info.component.html',
styleUrls: ['./personal-info.component.scss'] styleUrls: ['./personal-info.component.scss']
}) })
export class PersonalInfoComponent implements OnInit { export class PersonalInfoComponent implements OnInit {
pageTitle: string ="Personal Details";
//qualifications:any=["Graduate","Under Graduate","Post Graduate","Professional"]; //qualifications:any=["Graduate","Under Graduate","Post Graduate","Professional"];
//earningStatus:any=["Earning Member","House Wife","Student","Retired","Pensioner","Other Non earning member"]; //earningStatus:any=["Earning Member","House Wife","Student","Retired","Pensioner","Other Non earning member"];
loadDataStatus: boolean=true; loadDataStatus: boolean=true;
@ -18,8 +21,9 @@ export class PersonalInfoComponent implements OnInit {
qualifications:any=[]; qualifications:any=[];
relationShipList:any=[]; relationShipList:any=[];
@Input() pdid : string; // @Input() pdid : string;
@Input() pd_all_details:any; // @Input() pd_all_details:any;
pdid : string;
form_id:number; form_id:number;
private notifier: NotifierService; private notifier: NotifierService;
public _personalForm: FormGroup; public _personalForm: FormGroup;
@ -47,7 +51,9 @@ export class PersonalInfoComponent implements OnInit {
public coApplicantDetails :any=[]; public coApplicantDetails :any=[];
errorMessage:any; errorMessage:any;
constructor(notifier: NotifierService,private _fb: FormBuilder,private _pd: PdTrigerService) {
constructor(notifier: NotifierService,private _fb: FormBuilder,private _pd: PdTrigerService , @Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.notifier = notifier; this.notifier = notifier;
this.form_id = 3; this.form_id = 3;
} }

504
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/rental-info/rental-info.component.html
View File

@ -1,190 +1,330 @@
<mat-card style="min-height: 550px;"> <form class="address" [formGroup]="rentalForm">
<mat-card-content>
<p>Rental Information Form</p>
<form class="address" [formGroup]="rentalForm">
<mat-form-field>
<input matInput placeholder="Person Met / Shown the Property(if he is not applicant or co-applicant)" formControlName="person_met">
</mat-form-field>
<mat-form-field> <h2 mat-dialog-title class="paragraph_change">
<mat-select placeholder="Property Owner" formControlName="property_own"> <div fxFlex="70" align="left">
<mat-option value="applicant">Applicant</mat-option> {{pageTitle}}
<mat-option value="co_applicant">co-applicant</mat-option>
<mat-option value="parental">Parental</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Nature of the let out property" formControlName="nature_property">
<mat-option value="residentail/commercial">Residential/commercial</mat-option>
<mat-option value="other">other</mat-option>
</mat-select>
</mat-form-field>
<div formArrayName="rental_home">
<mat-accordion
*ngFor="let item of rentalForm.controls.rental_home['controls']; let i=index"
[formGroupName]="i">
<mat-expansion-panel class="fields" [expanded]="step == i">
<mat-expansion-panel-header>
<mat-panel-title>
<h5>{{i+1}} Rental Home Details</h5>
</mat-panel-title>
<button type="button" class="mr-1 mb-1 hover-icon" matTooltip="Add More Property" matTooltipPosition="above" mat-raised-button mat-icon-button *ngIf="i==0"
color="primary" style="float: right;" (click)="addProperty($event)">
<mat-icon>add</mat-icon>
</button>
<button type="button" class="mr-1 mb-1 hover-icon" matTooltip="Delete" matTooltipPosition="above" mat-raised-button mat-icon-button *ngIf="i>0"
style="float: right;" (click)="deleteProperty(i)">
<mat-icon>delete</mat-icon>
</button>
</mat-expansion-panel-header>
<mat-form-field appearance="outline" style="width: 100%">
<mat-label>Complete address of the property</mat-label>
<textarea matInput placeholder="Address" formControlName="complete_add"></textarea>
</mat-form-field>
<mat-form-field style="width: 100%">
<input matInput placeholder="Area of the Property(in sq yd or Sq ft)"
formControlName="area_of_property">
</mat-form-field>
<mat-form-field style="width: 100%">
<input matInput placeholder="Structure of the let out property (eg. No of floors in total,G,FF,SF etc, let out floors from them)"
formControlName="structure_property">
</mat-form-field>
<mat-form-field style="width: 100%">
<input type="number" matInput placeholder="Total rooms let out (eg single room,2 BHK, let out rooms on each floor)"
formControlName="total_room">
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Is Rent Agreement Available"
formControlName="is_rent">
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<div *ngIf="item.controls['is_rent'].value == 'yes'">
<mat-form-field>
<input matInput [matDatepicker]="picker" formControlName="date_agreement"
placeholder="Date of Agreement">
<mat-datepicker-toggle matSuffix
[for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Validity"
formControlName="date_validity">
</mat-form-field>
<mat-form-field>
<input type="number" matInput placeholder="Rent as per Agreement"
formControlName="rent_agreement">
</mat-form-field>
<mat-form-field>
<input type="number" matInput placeholder="Actual Rent"
formControlName="actual_rent">
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Photo of agreement taken ?"
formControlName="photo_areegment">
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
</div> </div>
<mat-card> <div fxFlex="30" align="end">
<mat-card-header> <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>
<p>How is rent received? (Is it in bank or cash, how much in which mode)</p>
</mat-card-header> </div>
<mat-card-content> </h2>
<mat-form-field>
<input type="number" matInput placeholder="Bank" <mat-dialog-content>
formControlName="bank">
</mat-form-field>
<mat-form-field> <mat-tab-group>
<input type="number" matInput placeholder="Cash" <mat-tab label="Questions">
formControlName="cash"> <ng-template matTabContent>
</mat-form-field> <div fxLayout="row wrap">
</mat-card-content> <div fxFlex="100">
</mat-card>
<mat-form-field style="width: 100%">
<input matInput placeholder="Rent received from each floor and or Rooms (eg FF has 4 rooms, rent per room are Rs 2500, Rs 4000 and Rs 3200 respectively)"
formControlName="rent_each_floor">
</mat-form-field>
<mat-form-field style="width: 100%">
<input matInput placeholder="Total rent received (Total montly rental from property/ies, with break up)"
formControlName="total_rent">
</mat-form-field>
<mat-form-field style="width: 100%">
<input matInput placeholder="Property paper or other related document to prove ownership (eg. Property registry etc)"
formControlName="related_doc_owner">
</mat-form-field>
<mat-card> <mat-form-field>
<mat-card-header> <input matInput placeholder="Person Met / Shown the Property(if he is not applicant or co-applicant)" formControlName="person_met">
<p>Details of the tenants (eg Name and Mobile No and other details)</p> </mat-form-field>
</mat-card-header>
<div formArrayName="details_tenants">
<div *ngFor="let deatil of item.controls.details_tenants['controls']; let idx=index" [formGroupName]="idx">
<mat-card-content>
<mat-form-field> <mat-form-field>
<input matInput placeholder="Name" <mat-select placeholder="Property Owner" formControlName="property_own">
formControlName="name"> <mat-option value="applicant">Applicant</mat-option>
</mat-form-field> <mat-option value="co_applicant">co-applicant</mat-option>
<mat-form-field> <mat-option value="parental">Parental</mat-option>
<input matInput placeholder="Mobile No" </mat-select>
formControlName="mobile_no"> </mat-form-field>
</mat-form-field> <mat-form-field>
<mat-form-field> <mat-select placeholder="Nature of the let out property" formControlName="nature_property">
<input matInput placeholder="Tenant Seen" <mat-option value="residentail/commercial">Residential/commercial</mat-option>
formControlName="tenants_seen"> <mat-option value="other">other</mat-option>
</mat-form-field> </mat-select>
<mat-form-field> </mat-form-field>
<input matInput placeholder="Tenant Confirmed Owner"
formControlName="tenants_con_owner">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Rent Paid"
formControlName="rent_paid">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Staying Since"
formControlName="staying_since">
</mat-form-field>
<button type="button" class="mr-1 mb-1 hover-icon" matTooltip="Add More Tenant" matTooltipPosition="above" mat-raised-button mat-icon-button *ngIf="idx==0"
color="primary" style="float: right;" (click)="addTenant(i)">
<mat-icon>add</mat-icon>
</button>
<button type="button" (click)="deleteTenant(idx, i)" matTooltip="Delete" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button *ngIf="idx>0"
style="float: right;">
<mat-icon>delete</mat-icon> <div formArrayName="rental_home">
</button> <mat-accordion
</mat-card-content> *ngFor="let item of rentalForm.controls.rental_home['controls']; let i=index"
[formGroupName]="i">
<mat-expansion-panel class="fields" [expanded]="step == i">
<mat-expansion-panel-header>
<mat-panel-title>
<h5>{{i+1}} Rental Home Details</h5>
</mat-panel-title>
<button type="button" class="mr-1 mb-1 hover-icon" matTooltip="Add More Property" matTooltipPosition="above" mat-raised-button mat-icon-button *ngIf="i==0"
color="primary" style="float: right;" (click)="addProperty($event)">
<mat-icon>add</mat-icon>
</button>
<button type="button" class="mr-1 mb-1 hover-icon" matTooltip="Delete" matTooltipPosition="above" mat-raised-button mat-icon-button *ngIf="i>0"
style="float: right;" (click)="deleteProperty(i)">
<mat-icon>delete</mat-icon>
</button>
</mat-expansion-panel-header>
<mat-form-field appearance="outline" style="width: 100%">
<mat-label>Complete address of the property</mat-label>
<textarea matInput placeholder="Address" formControlName="complete_add"></textarea>
</mat-form-field>
<mat-form-field style="width: 100%">
<input matInput placeholder="Area of the Property(in sq yd or Sq ft)"
formControlName="area_of_property">
</mat-form-field>
<mat-form-field style="width: 100%">
<input matInput placeholder="Structure of the let out property (eg. No of floors in total,G,FF,SF etc, let out floors from them)"
formControlName="structure_property">
</mat-form-field>
<mat-form-field style="width: 100%">
<input type="number" matInput placeholder="Total rooms let out (eg single room,2 BHK, let out rooms on each floor)"
formControlName="total_room">
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Is Rent Agreement Available"
formControlName="is_rent">
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<div *ngIf="item.controls['is_rent'].value == 'yes'">
<mat-form-field>
<input matInput [matDatepicker]="picker" formControlName="date_agreement"
placeholder="Date of Agreement">
<mat-datepicker-toggle matSuffix
[for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Validity"
formControlName="date_validity">
</mat-form-field>
<mat-form-field>
<input type="number" matInput placeholder="Rent as per Agreement"
formControlName="rent_agreement">
</mat-form-field>
<mat-form-field>
<input type="number" matInput placeholder="Actual Rent"
formControlName="actual_rent">
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Photo of agreement taken ?"
formControlName="photo_areegment">
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
</div>
<mat-card>
<mat-card-header>
<p>How is rent received? (Is it in bank or cash, how much in which mode)</p>
</mat-card-header>
<mat-card-content>
<mat-form-field>
<input type="number" matInput placeholder="Bank"
formControlName="bank">
</mat-form-field>
<mat-form-field>
<input type="number" matInput placeholder="Cash"
formControlName="cash">
</mat-form-field>
</mat-card-content>
</mat-card>
<mat-form-field style="width: 100%">
<input matInput placeholder="Rent received from each floor and or Rooms (eg FF has 4 rooms, rent per room are Rs 2500, Rs 4000 and Rs 3200 respectively)"
formControlName="rent_each_floor">
</mat-form-field>
<mat-form-field style="width: 100%">
<input matInput placeholder="Total rent received (Total montly rental from property/ies, with break up)"
formControlName="total_rent">
</mat-form-field>
<mat-form-field style="width: 100%">
<input matInput placeholder="Property paper or other related document to prove ownership (eg. Property registry etc)"
formControlName="related_doc_owner">
</mat-form-field>
<mat-card>
<mat-card-header>
<p>Details of the tenants (eg Name and Mobile No and other details)</p>
</mat-card-header>
<div formArrayName="details_tenants">
<div *ngFor="let deatil of item.controls.details_tenants['controls']; let idx=index" [formGroupName]="idx">
<mat-card-content>
<mat-form-field>
<input matInput placeholder="Name"
formControlName="name">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Mobile No"
formControlName="mobile_no">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Tenant Seen"
formControlName="tenants_seen">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Tenant Confirmed Owner"
formControlName="tenants_con_owner">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Rent Paid"
formControlName="rent_paid">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Staying Since"
formControlName="staying_since">
</mat-form-field>
<button type="button" class="mr-1 mb-1 hover-icon" matTooltip="Add More Tenant" matTooltipPosition="above" mat-raised-button mat-icon-button *ngIf="idx==0"
color="primary" style="float: right;" (click)="addTenant(i)">
<mat-icon>add</mat-icon>
</button>
<button type="button" (click)="deleteTenant(idx, i)" matTooltip="Delete" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button *ngIf="idx>0"
style="float: right;">
<mat-icon>delete</mat-icon>
</button>
</mat-card-content>
</div>
</div>
</mat-card>
<mat-form-field>
<mat-select placeholder="Photogaraphs of the Property"
formControlName="property_photographs">
<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="Third party check of prevailing rent in the neighbour hood (TPC with whom, how much rent quoted)"
formControlName="third_party_check">
</mat-form-field>
</mat-expansion-panel>
</mat-accordion>
</div>
</div>
</div> </div>
</div> </ng-template>
</mat-card> </mat-tab>
<mat-form-field> <mat-tab label="Docs">
<mat-select placeholder="Photogaraphs of the Property" <ng-template matTabContent>
formControlName="property_photographs"> <div fxLayout="row wrap">
<mat-option value="yes">Yes</mat-option> <div fxFlex="25" class="m-gap p-gap">
<mat-option value="no">No</mat-option> <div class="p-list-main mb-2">
</mat-select> <div class="p-list">
</mat-form-field>
<mat-form-field> <div class="top"><img src="./../../../../../../../assets/images/face2.jpg" alt=""/></div>
<input matInput placeholder="Third party check of prevailing rent in the neighbour hood (TPC with whom, how much rent quoted)" <div class="bottom">
formControlName="third_party_check"> <div class="left">
</mat-form-field> <div class="details">
</mat-expansion-panel> <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>
</ng-template>
</mat-tab>
</mat-tab-group>
</mat-accordion> </mat-dialog-content>
</div> <mat-dialog-actions>
<div style="text-align: right;" class="pt-1"> <div fxFlex="60" class="pb-0 text-sm-left" align="left">
<button class="mr-1 mb-1 hover-icon" type="submit" mat-raised-button mat-icon-button type="submit" matTooltip="Submit" matTooltipPosition="above" (click)="rentalSubmit()"><mat-icon>save</mat-icon> <!-- <mat-form-field appearance="outline" style="width: 100%">
</button> <mat-label>Remarks</mat-label>
</div> <textarea matInput placeholder="Remarks" formControlName="personal_info_form_remark" required></textarea>
</form> </mat-form-field> -->
</mat-card-content> </div>
</mat-card> <div fxFlex="40" align="end">
<button class="mr-1 mb-1 hover-icon" type="submit" mat-raised-button mat-icon-button type="submit" matTooltip="Submit" matTooltipPosition="above" (click)="rentalSubmit()"><mat-icon>save</mat-icon>
</button>
</div>
</mat-dialog-actions>
</form>

133
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/rental-info/rental-info.component.scss
View File

@ -1,27 +1,112 @@
.address { // .address {
display: flex; // display: flex;
padding: 0 2%; // padding: 0 2%;
flex-direction: column; // flex-direction: column;
} // }
.address > * { // .address > * {
width: 100%; // width: 100%;
// }
// .matcard mat-form-field {
// margin: 0 2%;
// width:40%;
// }
// .address .button {
// float: right;
// width: 10px;
// background: #62B013;
// color: white;
// }
// mat-form-field {
// width: 27%;
// margin: 0 2%;
// }
// .fields mat-form-field {
// width: 45%;
// margin: 0 2%;
// }
.paragraph_change {
color: #e00201 !important;
} }
.matcard mat-form-field { .mat-card-content {
margin: 0 2%; background-color: white;
width:40%; }
.mat-card-actions {
background-color: white;
}
mat-form-field {
margin: 0 2%;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
} }
.address .button {
float: right;
width: 10px;
background: #62B013;
color: white;
}
mat-form-field {
width: 27%;
margin: 0 2%;
}
.fields mat-form-field {
width: 45%;
margin: 0 2%;
}

27
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/rental-info/rental-info.component.ts
View File

@ -1,7 +1,9 @@
import {Component, OnInit, Input, Output} from '@angular/core'; import {Component, OnInit, Input, Output, Inject} from '@angular/core';
import {FormBuilder, FormGroup, Validators, FormControl, FormArray} from '@angular/forms'; import {FormBuilder, FormGroup, Validators, FormControl, FormArray} from '@angular/forms';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA , DialogPosition} from '@angular/material';
import {NotifierService} from 'angular-notifier'; import {NotifierService} from 'angular-notifier';
import {PdTrigerService} from './../../../../../pd-service/pd-triger.service'; import {PdTrigerService} from './../../../../../pd-service/pd-triger.service';
import {AwsService} from '../../../../../../AwsService/aws.service';
import {Key} from 'protractor'; import {Key} from 'protractor';
@Component({ @Component({
@ -14,8 +16,9 @@ export class RentalInfoComponent implements OnInit {
// @Input() pdid: string; // @Input() pdid: string;
// @Input() pd_all_details: any; // @Input() pd_all_details: any;
// form_id: number; // form_id: number;
@Input() pdid: number; pageTitle: string ="Rental Information";
@Input() form_id: number; pdid: number;
form_id: number;
step: number; step: number;
public rentalForm: FormGroup; public rentalForm: FormGroup;
@ -23,11 +26,17 @@ export class RentalInfoComponent implements OnInit {
propertyList: FormGroup; propertyList: FormGroup;
private notifier: NotifierService; private notifier: NotifierService;
constructor(notifier: NotifierService, private _fb: FormBuilder, private _pd: PdTrigerService) { constructor(
this.notifier = notifier; notifier: NotifierService,
// this.form_id = 3; private _fb: FormBuilder,
} private _pd: PdTrigerService,
private _aws:AwsService,
@Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.notifier = notifier;
this.form_id = 17;
}
ngOnInit() { ngOnInit() {
this.step = 0; this.step = 0;
this.inintRentalForm(); this.inintRentalForm();
@ -68,7 +77,7 @@ export class RentalInfoComponent implements OnInit {
rentalinfo.rental_home = result; rentalinfo.rental_home = result;
rentalinfo.pdid = this.pdid; rentalinfo.pdid = this.pdid;
rentalinfo.formid = this.form_id; rentalinfo.formid = this.form_id;
rentalinfo.fk_createdby = this.pdid; rentalinfo.fk_createdby = this._aws.getlocale();
this.rentalForm.setValue(rentalinfo); this.rentalForm.setValue(rentalinfo);
} else { } else {
control.push(this.createpropertyArray()); control.push(this.createpropertyArray());

370
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/stock/stock.component.html
View File

@ -1,109 +1,267 @@
<mat-card style="padding: 12px;">
<p>Stock Details</p>
<form [formGroup]="stockForm" class="address"> <form [formGroup]="stockForm" class="address">
<h2 mat-dialog-title class="paragraph_change">
<div fxFlex="70" align="left">
{{pageTitle}}
</div>
<div fxFlex="30" align="end">
<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>
<mat-tab-group>
<mat-tab label="Questions">
<ng-template matTabContent>
<div fxLayout="row wrap">
<div fxFlex="100">
<!-- start main applicant -->
<mat-card>
<mat-card-header>
<p>Raw Materials<p>
</mat-card-header>
<div formArrayName="raw_materials">
<div *ngFor="let details of stockForm.controls.raw_materials['controls']; let i=index"
[formGroupName]="i">
<mat-card-content class="matcard">
<mat-form-field>
<input matInput placeholder="Name" formControlName="raw_name" required>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="is the Stock is Observed ?"
formControlName="stock_observed" required>
<mat-option value="yes" >Yes</mat-option>
<mat-option value="no" >No</mat-option>
</mat-select>
</mat-form-field>
<div *ngIf="details.get('stock_observed').value == 'no'" >
<mat-form-field>
<input matInput placeholder="Estimated Quantity" formControlName="raw_quantity" required>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Unit of Mearsurement"
formControlName="raw_uom" required>
<mat-option value="{{uom.uom_id}}" *ngFor="let uom of uomData">{{uom.name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="details.get('raw_uom').value == 61" >
<input matInput placeholder="Specify Other UOM" formControlName="other_uom" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Value" formControlName="raw_value" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field style="width:76%">
<input matInput placeholder="Value of raw materials as per latest financial Statements" formControlName="rawmaterial_value" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field style="width:76%">
<input matInput placeholder="Is the stock of raw materials observed ?" formControlName="is_sufficiant_raw" required>
</mat-form-field>
</div>
<button type="button" mat-raised-button mat-icon-button (click)="addRawMaterials()"
matTooltip="Add More Raw Materials" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary" *ngIf="i==0">
<mat-icon>add</mat-icon>
</button>
<button type="button" mat-raised-button mat-icon-button (click)="deleteRawMaterials(i)"
matTooltip="Delete" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" *ngIf="i>0">
<mat-icon>delete</mat-icon>
</button>
</mat-card-content>
</div>
</div>
</mat-card>
<!-- end main applicant -->
</div>
</div>
<div fxLayout="row wrap">
<div fxFlex="100">
<!-- start co applicant form details -->
<mat-card>
<mat-card-header>
<p>Finished Goods<p>
</mat-card-header>
<div formArrayName="finished_goods">
<div *ngFor="let details of stockForm.controls.finished_goods['controls']; let i=index"
[formGroupName]="i">
<mat-card-content class="matcard">
<mat-form-field>
<input matInput placeholder="Name" formControlName="goods_name" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Estimated Quantity" formControlName="goods_quantity" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Value" formControlName="goods_value" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field style="width:76%">
<input matInput placeholder="Value of finished goods as per latest financial statements" formControlName="finished_goods_value" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field style="width:76%">
<input matInput placeholder="Is the stock of finished goods observed ?" formControlName="is_sufficiant_goods" required>
</mat-form-field>
<button type="button" mat-raised-button mat-icon-button (click)="addGoods()"
matTooltip="Add More Finished Goods" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary" *ngIf="i==0">
<mat-icon>add</mat-icon>
</button>
<button type="button" mat-raised-button mat-icon-button (click)="deleteGoods(i)"
matTooltip="Delete" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" *ngIf="i>0">
<mat-icon>delete</mat-icon>
</button>
</mat-card-content>
</div>
</div>
</mat-card>
<!-- end co apllicant -->
</div>
</div>
</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">
<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>
</ng-template>
</mat-tab>
</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>Please comment on the stock level observed?</mat-label>
<textarea matInput placeholder="Remarks" formControlName="stock_remarks"></textarea>
</mat-form-field>
</div>
<div fxFlex="40" align="end">
<button type="submit" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button matTooltip="Submit" matTooltipPosition="above" (click)="submitDetails()"><mat-icon>save</mat-icon>
</button>
</div>
</mat-dialog-actions>
</form>
<notifier-container></notifier-container>
<!-- <mat-card style="padding: 12px;">
<p>Stock Details</p>
<form [formGroup]="stockForm" class="address"> -->
<!-- {{uomData | json}} -->
<!-- <mat-card>
=======
<!-- {{uomData | json}} --> <!-- {{uomData | json}} -->
<mat-card> <mat-card>
<mat-card-header>
<p>Raw Materials<p>
</mat-card-header>
<div formArrayName="raw_materials">
<div *ngFor="let details of stockForm.controls.raw_materials['controls']; let i=index"
[formGroupName]="i">
<mat-card-content class="matcard">
<mat-form-field>
<input matInput placeholder="Name" formControlName="raw_name" required>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="is the Stock is Observed ?"
formControlName="stock_observed" required>
<mat-option value="yes" >Yes</mat-option>
<mat-option value="no" >No</mat-option>
</mat-select>
</mat-form-field>
<div *ngIf="details.get('stock_observed').value == 'no'" >
<mat-form-field>
<input matInput placeholder="Estimated Quantity" formControlName="raw_quantity" required>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Unit of Mearsurement"
formControlName="raw_uom" required>
<mat-option value="{{uom.uom_id}}" *ngFor="let uom of uomData">{{uom.name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="details.get('raw_uom').value == 61" >
<input matInput placeholder="Specify Other UOM" formControlName="other_uom" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Value" formControlName="raw_value" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field style="width:76%">
<input matInput placeholder="Value of raw materials as per latest financial Statements" formControlName="rawmaterial_value" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field style="width:76%">
<input matInput placeholder="Is the stock of raw materials observed ?" formControlName="is_sufficiant_raw" required>
</mat-form-field>
</div>
<button type="button" mat-raised-button mat-icon-button (click)="addRawMaterials()"
matTooltip="Add More Raw Materials" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary" *ngIf="i==0">
<mat-icon>add</mat-icon>
</button>
<button type="button" mat-raised-button mat-icon-button (click)="deleteRawMaterials(i)"
matTooltip="Delete" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" *ngIf="i>0">
<mat-icon>delete</mat-icon>
</button>
</mat-card-content>
</div>
</div>
</mat-card>
<mat-card>
<mat-card-header>
<p>Finished Goods<p>
</mat-card-header>
<div formArrayName="finished_goods">
<div *ngFor="let details of stockForm.controls.finished_goods['controls']; let i=index"
[formGroupName]="i">
<mat-card-content class="matcard">
<mat-form-field>
<input matInput placeholder="Name" formControlName="goods_name" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Estimated Quantity" formControlName="goods_quantity" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Value" formControlName="goods_value" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field style="width:76%">
<input matInput placeholder="Value of finished goods as per latest financial statements" formControlName="finished_goods_value" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field style="width:76%">
<input matInput placeholder="Is the stock of finished goods observed ?" formControlName="is_sufficiant_goods" required>
</mat-form-field>
<button type="button" mat-raised-button mat-icon-button (click)="addGoods()"
matTooltip="Add More Finished Goods" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary" *ngIf="i==0">
<mat-icon>add</mat-icon>
</button>
<button type="button" mat-raised-button mat-icon-button (click)="deleteGoods(i)"
matTooltip="Delete" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" *ngIf="i>0">
<mat-icon>delete</mat-icon>
</button>
</mat-card-content>
</div>
</div>
</mat-card>
<div fxLayout="row">
<div fxFlex="60" class="pb-0 text-sm-left">
<mat-form-field appearance="outline" style="width: 100%">
<mat-label>Please comment on the stock level observed?</mat-label>
<textarea matInput placeholder="Remarks" formControlName="stock_remarks"></textarea>
</mat-form-field>
</div>
</div>
<div style="text-align: right;">
<button type="submit" class="mr-1 mb-1 hover-icon" mat-raised-button mat-icon-button matTooltip="Submit" matTooltipPosition="above" (click)="submitDetails()"><mat-icon>save</mat-icon>
</button>
</div>
</form>
</mat-card>

115
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/stock/stock.component.scss
View File

@ -1,18 +1,103 @@
.address { // .address {
display: flex; // display: flex;
padding: 0 2%; // padding: 0 2%;
flex-direction: column; // flex-direction: column;
} // }
.address > * { // .address > * {
width: 100%; // width: 100%;
// }
// .matcard mat-form-field {
// margin: 0 2%;
// }
// .address .button {
// float: right;
// width: 10px;
// background: #62B013;
// color: white;
// }
.paragraph_change {
color: #e00201 !important;
} }
.matcard mat-form-field { .mat-card-content {
margin: 0 2%; background-color: white;
}
.mat-card-actions {
background-color: white;
}
mat-form-field {
margin: 0 2%;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
} }
.address .button {
float: right;
width: 10px;
background: #62B013;
color: white;
}

13
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/stock/stock.component.ts
View File

@ -30,8 +30,11 @@ import { analyzeAndValidateNgModules } from '@angular/compiler';
styleUrls: ['./stock.component.scss'] styleUrls: ['./stock.component.scss']
}) })
export class StockComponent implements OnInit { export class StockComponent implements OnInit {
@Input() pdid: number; // @Input() pdid: number;
@Input() form_id: number; // @Input() form_id: number;
pageTitle: string ="Stock Details";
pdid: number;
form_id: number;
public stockForm: FormGroup; public stockForm: FormGroup;
private notifier: NotifierService; private notifier: NotifierService;
public uomData : any = []; public uomData : any = [];
@ -39,8 +42,10 @@ export class StockComponent implements OnInit {
constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute, constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute,
private router: Router, private router: Router,
private _pd: PdTrigerService) { private _pd: PdTrigerService,@Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
this.notifier = notifier; this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.form_id = 11;
this.notifier = notifier;
} }
ngOnInit() { ngOnInit() {
this.initstockForm(); this.initstockForm();

346
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/supplier-info/supplier-info.component.html
View File

@ -1,96 +1,252 @@
<!--<pre> {{ m_group | json}}</pre>--> <form *ngIf="apiLoadFinish" [formGroup]="_supplierQuesFrom" (submit)="onSubmit()" novalidate>
<mat-card style="padding: 12px;">
<p>Supplier Details</p> <h2 mat-dialog-title class="paragraph_change">
<form *ngIf="apiLoadFinish" [formGroup]="_supplierQuesFrom" (submit)="onSubmit()" novalidate> <div fxFlex="70" align="left">{{pageTitle}}</div>
<div fxLayout="row" fxLayoutAlign="start none"> <div fxFlex="30" align="end">
<div class="example-full-width"> <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>
<mat-form-field fxFill>
<textarea matInput placeholder="What are the main raw materials?(MEG Only)" formControlName="main_raw_materials"></textarea> </div>
<mat-error *ngIf="submitted && f.main_raw_materials.hasError('required')" class="mat-text-warn">You must Include Raw Material Details.</mat-error> </h2>
</mat-form-field>
</div> <mat-dialog-content>
</div>
<div fxLayout="row" fxLayoutAlign="start none"> <mat-tab-group>
<div formArrayName="supplier_details" fxFill>
<div *ngFor="let sup of _supplierQuesFrom.controls.supplier_details['controls']; let i=index"> <mat-tab label="Questions">
<mat-card> <ng-template matTabContent>
<mat-card-content> <div fxLayout="row wrap">
<div [formGroupName]="i"> <div fxFlex="100">
<div fxLayout="row wrap" fxLayoutGap="12px" fxLayoutAlign="start none"> <mat-card>
<div fxFlex="30"> <mat-card-content>
<mat-form-field class="ml-xs example-full-width"> <mat-form-field fxFill>
<input matInput placeholder="Supplier Name" formControlName="supplier_name" required> <textarea matInput placeholder="What are the main raw materials?(MEG Only)" formControlName="main_raw_materials"></textarea>
<!-- <mat-error *ngIf="sup.controls['supplier_name'].hasError('required') && sup.controls['supplier_name'].touched" class="mat-text-warn">Supplier Name Required.</mat-error> --> <mat-error *ngIf="submitted && f.main_raw_materials.hasError('required')" class="mat-text-warn">You must Include Raw Material Details.</mat-error>
</mat-form-field> </mat-form-field>
</div> </mat-card-content>
<div fxFlex="30"> </mat-card>
<mat-form-field class="ml-xs example-full-width"> </div>
<input matInput placeholder="Contact Person Name" formControlName="contact_person" required> </div>
<!-- <mat-error *ngIf="sup.controls['contact_person'].hasError('required') && sup.controls['contact_person'].touched" class="mat-text-warn">Contact Person Name Required.</mat-error> -->
</mat-form-field> <div fxLayout="row wrap">
</div> <div fxFlex="100">
<div fxFlex="30"> <mat-card>
<mat-form-field class="ml-xs example-full-width"> <!-- <mat-card-title></mat-card-title> -->
<input matInput placeholder="Contact Mobile Number" formControlName="mobile_number" (keypress)="keyPress($event)" minlength=10 maxlength=10 required> <mat-card-content formArrayName="supplier_details" fxFill>
<!-- <mat-error *ngIf="sup.controls['mobile_number'].hasError('requried') && sup.controls['mobile_number'].touched" class="mat-text-warn">Mobile Number Requried</mat-error> --> <div *ngFor="let sup of _supplierQuesFrom.controls.supplier_details['controls']; let i=index" [formGroupName]="i">
<mat-error *ngIf="sup.controls['mobile_number'].hasError('minlength') && sup.controls['mobile_number'].touched" class="mat-text-warn">Valid Mobile Number Requried</mat-error>
<mat-error *ngIf="sup.controls['mobile_number'].hasError('maxlength') && sup.controls['mobile_number'].touched" class="mat-text-warn">Vaild Mobile Number Requried</mat-error> <div fxLayout="row wrap" fxLayoutGap="12px" fxLayoutAlign="start none">
<div fxFlex="30">
</mat-form-field> <mat-form-field class="ml-xs example-full-width">
</div> <input matInput placeholder="Supplier Name" formControlName="supplier_name" required>
</div> <!-- <mat-error *ngIf="sup.controls['supplier_name'].hasError('required') && sup.controls['supplier_name'].touched" class="mat-text-warn">Supplier Name Required.</mat-error> -->
<div fxLayout="row wrap" fxLayoutGap="14px" fxLayoutAlign="start none"> </mat-form-field>
<div fxFlex="30"> </div>
<mat-form-field style="width:100%"> <div fxFlex="30">
<mat-select (selectionChange)="selectedPM($event)" placeholder="Payment Mode" formControlName="payment_mode" required> <mat-form-field class="ml-xs example-full-width">
<mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option> <input matInput placeholder="Contact Person Name" formControlName="contact_person" required>
</mat-select> <!-- <mat-error *ngIf="sup.controls['contact_person'].hasError('required') && sup.controls['contact_person'].touched" class="mat-text-warn">Contact Person Name Required.</mat-error> -->
</mat-form-field> </mat-form-field>
</div> </div>
<div *ngIf="sup.get('payment_mode').value == 1 || sup.get('payment_mode').value == 3" fxFlex="30"> <div fxFlex="30">
<mat-form-field class="ml-xs example-full-width" > <mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="% of immediate / Advance Payment Purchase to Total Purchase?" formControlName="per_of_immediate_advance_payment" type="number" min="0"> <input matInput placeholder="Contact Mobile Number" formControlName="mobile_number" (keypress)="keyPress($event)" minlength=10 maxlength=10 required>
</mat-form-field> <!-- <mat-error *ngIf="sup.controls['mobile_number'].hasError('requried') && sup.controls['mobile_number'].touched" class="mat-text-warn">Mobile Number Requried</mat-error> -->
</div> <mat-error *ngIf="sup.controls['mobile_number'].hasError('minlength') && sup.controls['mobile_number'].touched" class="mat-text-warn">Valid Mobile Number Requried</mat-error>
<div *ngIf="sup.get('payment_mode').value == 2 || sup.get('payment_mode').value == 3" fxFlex="30"> <mat-error *ngIf="sup.controls['mobile_number'].hasError('maxlength') && sup.controls['mobile_number'].touched" class="mat-text-warn">Vaild Mobile Number Requried</mat-error>
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Credit Period" formControlName="credit_period"> </mat-form-field>
</mat-form-field> </div>
</div> </div>
</div> <div fxLayout="row wrap" fxLayoutGap="14px" fxLayoutAlign="start none">
<div fxLayout="row" fxLayoutGap="14px" fxLayoutAlign="start none"> <div fxFlex="30">
<!-- <div fxFlex="30"> <mat-form-field style="width:100%">
<mat-form-field style="width:100%"> <mat-select (selectionChange)="selectedPM($event)" placeholder="Payment Mode" formControlName="payment_mode" required>
<mat-select (selectionChange)="selectedFreqPurchase($event)" placeholder="Frequency of Purchase" formControlName="frequency_of_purchase" required> <mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option>
<mat-option *ngFor="let feq of m_freqOfPurchase" [value]="feq.frequency_id">{{ feq.name }}</mat-option> </mat-select>
</mat-select> </mat-form-field>
</div>
</mat-form-field> <div *ngIf="sup.get('payment_mode').value == 1 || sup.get('payment_mode').value == 3" fxFlex="30">
</div> <mat-form-field class="ml-xs example-full-width" >
<div *ngIf="sup.get('frequency_of_purchase').value == 8" fxFlex="30"> <input matInput placeholder="% of immediate / Advance Payment Purchase to Total Purchase?" formControlName="per_of_immediate_advance_payment" type="number" min="0">
<mat-form-field class="ml-xs example-full-width"> </mat-form-field>
<input matInput placeholder="Others Details" formControlName="freq_purchase_others_text_value"> </div>
</mat-form-field> <div *ngIf="sup.get('payment_mode').value == 2 || sup.get('payment_mode').value == 3" fxFlex="30">
</div>--> <mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Credit Period" formControlName="credit_period">
<div fxFlex="30" style="text-align:center;"> </mat-form-field>
<span *ngIf="_supplierQuesFrom.controls.supplier_details.controls.length > 1" (click)="removeLanguage(i)"> </div>
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" color="primary" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button> </div>
</span> <div fxLayout="row" fxLayoutGap="14px" style="text-align:center;">
</div> <!-- <div fxFlex="30">
</div> <mat-form-field style="width:100%">
<mat-select (selectionChange)="selectedFreqPurchase($event)" placeholder="Frequency of Purchase" formControlName="frequency_of_purchase" required>
<mat-option *ngFor="let feq of m_freqOfPurchase" [value]="feq.frequency_id">{{ feq.name }}</mat-option>
</mat-select>
</mat-form-field>
</div>
<div *ngIf="sup.get('frequency_of_purchase').value == 8" fxFlex="30">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Others Details" formControlName="freq_purchase_others_text_value">
</mat-form-field>
</div>-->
<!-- <div fxFlex="30" style="text-align:center;"> -->
<span *ngIf="_supplierQuesFrom.controls.supplier_details.controls.length > 1" (click)="removeLanguage(i)">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" color="primary" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
</span>
<!-- </div> -->
</div>
</div>
</mat-card-content>
<mat-card-actions align="end">
<!-- <span *ngIf="_supplierQuesFrom.controls.supplier_details.controls.length > 1" (click)="removeLanguage(i)">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" color="primary" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
</span> -->
</mat-card-actions>
</mat-card>
</div>
</div>
</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">
<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>
</ng-template>
</mat-tab>
</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="personal_info_form_remark" required></textarea>
</mat-form-field> -->
</div> </div>
<div fxFlex="40" align="end">
</mat-card-content>
</mat-card> <button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Supplier Details" matTooltipPosition="above"
</div> class="mr-1 mb-1 hover-icon" (click)="addSupplierDetails($event); false"><mat-icon>add</mat-icon></button>
</div> <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> <!----<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Reset" matTooltipPosition="above" type="reset"><mat-icon>settings_backup_restore</mat-icon></button>-->
<div class="row" style="text-align:right;"> </div>
<button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Supplier Details" matTooltipPosition="above" </mat-dialog-actions>
class="mr-1 mb-1 hover-icon" (click)="addSupplierDetails($event); false"><mat-icon>add</mat-icon></button>
<!----<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Reset" matTooltipPosition="above" type="reset"><mat-icon>settings_backup_restore</mat-icon></button>--> </form>
<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> <notifier-container></notifier-container>
</div>
</form>
</mat-card>

90
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/supplier-info/supplier-info.component.scss
View File

@ -1,3 +1,87 @@
.example-full-width{ // .example-full-width{
width : 100%; // width : 100%;
} // }
.paragraph_change {
color: #e00201 !important;
}
.mat-card-content {
background-color: white;
}
.mat-card-actions {
background-color: white;
}
mat-form-field {
margin: 0 2%;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7);
.p-list-main {
background: white;
margin: auto;
position: relative;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover {
transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
}
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
}
}

80
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/supplier-info/supplier-info.component.ts
View File

@ -3,7 +3,7 @@ import {
Component, Component,
OnInit, OnInit,
Inject, Inject,
Input Output,Input
} from '@angular/core'; } from '@angular/core';
import { import {
@ -20,79 +20,39 @@ import {
MatDialogRef, MatDialogRef,
MAT_DIALOG_DATA MAT_DIALOG_DATA
} from '@angular/material'; } from '@angular/material';
/** Service */ /** Service */
import { PdTrigerService } from '../../../../../pd-service/pd-triger.service'; import { PdTrigerService } from '../../../../../pd-service/pd-triger.service';
@Component({ @Component({
selector: 'app-supplier-info', selector: 'app-supplier-info',
templateUrl: './supplier-info.component.html', templateUrl: './supplier-info.component.html',
styleUrls: ['./supplier-info.component.scss'] styleUrls: ['./supplier-info.component.scss']
}) })
export class SupplierInfoComponent implements OnInit { export class SupplierInfoComponent implements OnInit {
@Input() pdid: number; pageTitle: string ="Supplier Details";
//@Input() pdid: number;
pdid : string;
form_id:number;
public _supplierQuesFrom: FormGroup; public _supplierQuesFrom: FormGroup;
public submitted = false; public submitted = false;
public m_paymentModeType= []; public m_paymentModeType= [];
// public m_paymentModeType= [
// {
// 'id': "1",
// 'name': 'Immediate Or Advanced Payment'
// },
// {
// 'id': "2",
// 'name': 'Credit'
// },
// {
// 'id': "3",
// 'name': 'Combination of Both'
// },
// ];
//public m_freqOfPurchase= [];
// public m_freqOfPurchase= [
// {
// 'id': "1",
// 'name': 'Daily'
// },
// {
// 'id': "2",
// 'name': 'Weekly'
// },
// {
// 'id': "3",
// 'name': 'Monthly'
// },
// {
// 'id': "4",
// 'name': 'Every 3 months'
// },
// {
// 'id': "5",
// 'name': 'Half yearly'
// },
// {
// 'id': "6",
// 'name': 'Yearly'
// },
// {
// 'id': "7",
// 'name': 'As and when required'
// },
// {
// 'id': "8",
// 'name': 'Others'
// }
// ]
private notifier: NotifierService; private notifier: NotifierService;
constructor( constructor(
notifier: NotifierService, notifier: NotifierService,
private _formBuilder: FormBuilder, private _formBuilder: FormBuilder,
private pdTrigerService: PdTrigerService) { private pdTrigerService: PdTrigerService,
this.notifier = notifier; @Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
} this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.form_id = 1;
this.notifier = notifier;
}
ngOnInit() { ngOnInit() {
// this.getM_FreqOfPurchase(); // this.getM_FreqOfPurchase();
@ -305,4 +265,4 @@ apiLoadFinish: boolean = false;
// ] // ]
// } // }
} }

519
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.component.html
View File

@ -1,495 +1,30 @@
<mat-card> <mat-card class="parent_mat_card">
<mat-card-content> <mat-card-header >
<mat-card-title>
<div fxLayout="row"> <div fxFlex="33" align="left">
<!--- <button mat-raised-button mat-icon-button class="hover-icon start_close_btn" type="button" matTooltip="Close" matTooltipPosition="above" <h4 class="mt-0">{{mainApplicantName}}</h4>
(click)="loadPdViewCompoent()"><mat-icon>close</mat-icon></button>--> <small>{{pdMasterList.customer_segment_name}}</small>
<div fxFlex="33" class="text-xs-left"> </div>
<h4 class="mt-0">{{mainApplicantName}}</h4> <div fxFlex="66" align="end">
<small>{{pdMasterList.customer_segment_name}}</small> <h4 class="mt-0">{{pdMasterList.product_name}}/{{pdMasterList.subproduct_name}}
</div> <button mat-raised-button mat-icon-button class="hover-icon " type="button" matTooltip="Close" matTooltipPosition="above"
<div fxFlex="56" class="text-xs-right"> (click)="loadPdViewCompoent()"><mat-icon>close</mat-icon></button>
<h4 class="mt-0">{{pdMasterList.product_name}}/{{pdMasterList.subproduct_name}}</h4> </h4>
<small>{{pdMasterList.lender_full_name}}/{{pdMasterList.lender_applicant_id}}</small> <small>{{pdMasterList.lender_full_name}}/{{pdMasterList.lender_applicant_id}}</small>
</div>
</div> </mat-card-title>
<div fxFlex="10" style="text-align: right;" class="mb-1"> </mat-card-header>
<button mat-raised-button mat-icon-button class="hover-icon " type="button" matTooltip="Close" matTooltipPosition="above"
(click)="loadPdViewCompoent()"><mat-icon>close</mat-icon></button>
</div>
</div>
</mat-card-content>
</mat-card>
<mat-card style="max-height:400px;overflow: auto;">
<mat-card-content> <mat-card-content>
<button matTooltip="Menu" matTooltipPosition="above" (click)="mailnav.toggle()" color="primary" fxHide="false" fxshow.gt-sm mat-icon-button mat-raised-button> <div fxLayout="row wrap" class="child_mat_card">
<mat-icon style="color: white;">short_text</mat-icon> <mat-card fxFlex.xs="90" fxFlex.sm="45" fxFlex.md="30" fxFlex.lg="23" fxFlex.xl="23" *ngFor="let formButton of categoryFormButtons;let quesIndex=index" [ngStyle]="{'background-color':formButton.isAnswered == false ? '#827f7f' : '#4caf50' ,'color':'#fff'}" (click)="OnSelectDirectForms(formButton)">
</button> <mat-card-header>
<mat-sidenav-container class="app-inner background-none shadow-none mail-db"> <mat-card-title>{{ (formButton.form_name.length>17)? (formButton.form_name | slice:0:17)+'..':(formButton.form_name) }}</mat-card-title>
<mat-sidenav #mailnav [mode]="isOver() ? 'over' : 'side'" [opened]="!isOver()" class="mail-sidebar pl-xs pr-xs"> <!-- <mat-card-subtitle>Karthi Kms</mat-card-subtitle> -->
</mat-card-header>
</mat-card>
<!--{{ (currentPDStatus==pdStatusCheck.INPROGRESS)? 'COMPLETE':(currentPDStatus) }} --> </div>
<div *ngIf="categoryList != ''">
<mat-expansion-panel *ngFor="let category of categoryList;let catIndex = index; ">
<mat-expansion-panel-header>
<mat-panel-title class="text-xs-left">
<span class="mt-0"> {{category.category_name}}</span>
</mat-panel-title>
</mat-expansion-panel-header>
<mat-list>
<mat-list-item class="custm-list-item" *ngFor="let questions of category.questions; let quesIndex=index" [ngStyle]="{'color':quesIndex === selectedQuestionIndex && catIndex === selectedCategoryIndex ? 'red' : 'black' }" (click)="OnSelectDirectQuestions(questions, catIndex,quesIndex)">
<small>{{ (questions.question.length>15)? (questions.question | slice:0:15)+'..':(questions.question) }}</small>
</mat-list-item>
</mat-list>
</mat-expansion-panel>
</div>
<mat-list *ngFor="let formButton of categoryFormButtons">
<mat-list-item class="custm-list-item" (click)="OnSelectDirectForms(formButton)" [ngStyle]="{'background-color':formButton.isAnswered == false ? '#827f7f' : '#4caf50' ,'color':'#fff'}">
<span class="mt-0">{{ (formButton.form_name.length>17)? (formButton.form_name | slice:0:17)+'..':(formButton.form_name) }}</span>
</mat-list-item>
</mat-list>
<button _ngcontent-c21="" matTooltip="Complete Question" matTooltipPosition="above" [disabled]="actualQuestions!=answeredQuestions" class="compose-btn mat-warn mat-raised-button mb-1" (click)="changePDStatus(pdStatusCheck.COMPLETED);" style="margin-top:10px;"><span>{{currentPDStatus==pdStatusCheck.INPROGRESS ? 'COMPLETE':(currentPDStatus==pdStatusCheck.QC_COMPLETED ? 'QC COMPLETED' : currentPDStatus ) }}</span></button>
<!--<mat-list>-->
<!--<mat-list-item (click)="OnSelectDirectForms(rentalDetail)" style="background-color:#e0e0e0">-->
<!--<span class="mt-0">{{rentalDetail.form_name}}</span>-->
<!--</mat-list-item>-->
<!--</mat-list>-->
</mat-sidenav>
<!--<mat-toolbar color="primary" fxHide="false" fxshow.gt-sm>
<button (click)="mailnav.toggle()" mat-icon-button>
<mat-icon style="color: white;">short_text</mat-icon>
</button>
<span class="mr-1 ml-1">Category</span>
</mat-toolbar>-->
<div class="main-content" fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="100" fxFlex.xl="100">
<figure>
<div *ngIf="!formsCategoryEnable">
<mat-card-content style="min-height: 500px;" *ngIf="selectedCategory.length==0">
<p>No Records Found..</p>
</mat-card-content>
<!-- check type of questions -->
<ng-container [ngSwitch]="selectedCategory.fk_question_answertype">
<!-- start options type questions section -->
<ng-container *ngSwitchCase="1">
<mat-card-content>
<form [formGroup]="optionsForm" *ngIf="answerList.length>0 ; else noanswers;" style="min-height: 450px;">
<mat-card-content>
<span class="mt-0">{{optionsForm.controls.pd_question.value}}</span>
<div fxLayout="row" >
<div fxFlex="60" class="text-xs-left">
<mat-list>
<mat-radio-group formControlName="modelValue">
<mat-list-item *ngFor="let option of optionsForm.controls.items.value">
<mat-radio-button [value]="option.pd_answer_id">{{option.pd_answer}}</mat-radio-button>
</mat-list-item>
</mat-radio-group>
</mat-list>
</div>
<div fxFlex="40" class="text-xs-right" *ngIf="optionsForm.controls.documents.length>0">
<mat-card >
<mat-card-content style="display: flex;
overflow: auto;min-height: 200px; max-height: 240px;">
<div fxLayout="row wrap">
<div fxFlex="50" class="m-gap p-gap" *ngFor="let docs of optionsForm.controls.documents.value; let docIndex=index">
<div class="p-list-main mb-2">
<div class="p-list">
<div class="top"><img [src]="docs.pd_document_url" alt=""/></div>
<div class="bottom">
<div class="left">
<div class="details">
<small>{{docs.pd_document_title}}</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>
</mat-card-content>
</mat-card>
</div>
</div>
</mat-card-content>
<mat-card-actions>
<div fxLayout="row" >
<div fxFlex="60" class="pb-0 text-sm-left">
<mat-form-field appearance="outline" style="width: 100%">
<mat-label>Remarks</mat-label>
<textarea matInput placeholder="Remarks" formControlName="pd_answer_remark"></textarea>
</mat-form-field>
</div>
<!-- this section for questions type options button actions -->
<div fxFlex="40" class="text-sm-right" style="margin-top: 7%;">
<mat-button-toggle-group name="fontStyle" aria-label="Font Style">
<mat-button-toggle value="bold" matTooltip="Save&Previous" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" (click)="saveNextPrevious(optionsForm.controls,previous)" matTooltipPosition="below"><mat-icon>skip_previous</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Save&Next" (click)="saveNextPrevious(optionsForm.controls,next)" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltipPosition="below"><mat-icon>skip_next</mat-icon></mat-button-toggle>
</mat-button-toggle-group>
</div>
<!-- end questions type options -->
</div>
</mat-card-actions>
</form>
</mat-card-content>
<ng-template #noanswers>
<mat-card-content>
<span class="mt-0">{{selectedCategory.question}}</span>
</mat-card-content>
<mat-card-actions>
<div fxLayout="row" >
<div fxFlex="100" class="pb-0 text-sm-right">
<mat-button-toggle-group name="fontStyle" aria-label="Font Style">
<mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
</mat-button-toggle-group>
</div>
</div>
</mat-card-actions>
</ng-template>
</ng-container>
<!-- end options type questions section -->
<!-- start text box questions section -->
<ng-container *ngSwitchCase="2">
<form [formGroup]="textBoxForm" *ngIf="answerList.length>0 ; else noanswers;">
<mat-card-content>
<span class="mt-0">{{textBoxForm.controls.pd_question.value}}</span>
<div fxLayout="row" >
<div fxFlex="60" class="text-xs-left">
<mat-list [formArrayName]="'items'" style="padding-top:10%">
<mat-list-item *ngFor="let control of textBoxForm.controls.items.controls; let i = index;" [formGroup]="control">
<mat-form-field appearance="outline" style="width: 100%">
<mat-label>Answers</mat-label>
<textarea matInput placeholder="Answers" formControlName="pd_answer"></textarea>
</mat-form-field>
</mat-list-item>
</mat-list>
</div>
<div fxFlex="40" class="text-xs-right" *ngIf="textBoxForm.controls.documents.length>0">
<mat-card >
<mat-card-content style="display: flex;
overflow: auto;min-height: 200px; max-height: 240px;">
<div fxLayout="row wrap">
<div fxFlex="50" class="m-gap p-gap" *ngFor="let docs of textBoxForm.controls.documents.value; let docIndex=index">
<div class="p-list-main mb-2">
<div class="p-list">
<div class="top"><img [src]="docs.pd_document_url" alt=""/></div>
<div class="bottom">
<div class="left">
<div class="details">
<small>{{docs.pd_document_title}}</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>
</mat-card-content>
</mat-card>
</div>
</div>
</mat-card-content>
<mat-card-actions>
<div fxLayout="row" >
<div fxFlex="60" class="pb-0 text-sm-left">
<mat-form-field appearance="outline" style="width: 100%">
<mat-label>Remarks</mat-label>
<textarea matInput placeholder="Remarks" formControlName="pd_answer_remark"></textarea>
</mat-form-field>
</div>
<!-- this section for questions type options button actions -->
<div fxFlex="40" class="text-sm-right" style="margin-top: 7%;">
<mat-button-toggle-group name="fontStyle" aria-label="Font Style">
<mat-button-toggle value="bold" matTooltip="Save&Previous" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" (click)="saveNextPreviousText(textBoxForm.controls,previous)" matTooltipPosition="below"><mat-icon>skip_previous</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Previous" matTooltipPosition="below" (click)="skipNextPrevious(previous)"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltip="Save&Next" (click)="saveNextPreviousText(textBoxForm.controls,next)" matTooltipPosition="below"><mat-icon>skip_next</mat-icon></mat-button-toggle>
</mat-button-toggle-group>
</div>
<!-- end questions type options -->
</div>
</mat-card-actions>
</form>
<ng-template #noanswers>
<mat-card-content>
<span class="mt-0">{{selectedCategory.question}}</span>
</mat-card-content>
<mat-card-actions>
<div fxLayout="row" >
<div fxFlex="100" class="pb-0 text-sm-right">
<mat-button-toggle-group name="fontStyle" aria-label="Font Style">
<mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
</mat-button-toggle-group>
</div>
</div>
</mat-card-actions>
</ng-template>
</ng-container>
<!-- end text box questions section -->
<!-- start check box questions section -->
<ng-container *ngSwitchCase="3">
<form [formGroup]="checkBoxForm" *ngIf="answerList.length>0 ; else noanswers;">
<mat-card-content>
<span class="mt-0">{{checkBoxForm.controls.pd_question.value}}</span>
<div fxLayout="row" >
<div fxFlex="60" class="text-xs-left">
<mat-list [formArrayName]="'items'">
<mat-list-item *ngFor="let control of checkBoxForm.controls.items.controls; let i = index;" [formGroup]="control">
<small><mat-checkbox class="example-margin" formControlName="checkbox" id="{{ control.controls.pd_answer_id.value }}"> {{ control.controls.pd_answer.value }}</mat-checkbox> </small>
</mat-list-item>
</mat-list>
</div>
<div fxFlex="40" class="text-xs-right" *ngIf="checkBoxForm.controls.documents.length>0">
<mat-card >
<mat-card-content style="display: flex;
overflow: auto;min-height: 200px; max-height: 240px;">
<div fxLayout="row wrap">
<div fxFlex="50" class="m-gap p-gap" *ngFor="let docs of textBoxForm.controls.documents.value; let docIndex=index">
<div class="p-list-main mb-2">
<div class="p-list">
<div class="top"><img [src]="docs.pd_document_url" alt=""/></div>
<div class="bottom">
<div class="left">
<div class="details">
<small>{{docs.pd_document_title}}</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>
</mat-card-content>
</mat-card>
</div>
</div>
</mat-card-content>
<mat-card-actions *ngIf="checkBoxForm.controls.items.length > 0">
<div fxLayout="row" >
<div fxFlex="60" class="pb-0 text-sm-left">
<mat-form-field appearance="outline" style="width: 100%">
<mat-label>Remarks</mat-label>
<textarea matInput placeholder="Remarks" formControlName="pd_answer_remark"></textarea>
</mat-form-field>
</div>
<!-- this section for questions type options button actions -->
<div fxFlex="40" class="text-sm-right" style="margin-top: 7%;">
<mat-button-toggle-group name="fontStyle" aria-label="Font Style">
<mat-button-toggle value="bold" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltip="Save&Previous" (click)="saveNextPrevious(checkBoxForm.controls,previous)" matTooltip="Save&Previous" (click)="saveNextPrevious(checkBoxForm.controls,previous)" matTooltipPosition="below"><mat-icon>skip_previous</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltip="Save&Next" (click)="saveNextPrevious(checkBoxForm.controls,next)" matTooltipPosition="below"><mat-icon>skip_next</mat-icon></mat-button-toggle>
</mat-button-toggle-group>
</div>
<!-- end questions type options -->
</div>
</mat-card-actions>
</form>
<ng-template #noanswers>
<mat-card-content>
<span class="mt-0">{{selectedCategory.question}}</span>
</mat-card-content>
<mat-card-actions>
<div fxLayout="row" >
<div fxFlex="100" class="pb-0 text-sm-right">
<mat-button-toggle-group name="fontStyle" aria-label="Font Style">
<mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
<mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
</mat-button-toggle-group>
</div>
</div>
</mat-card-actions>
</ng-template>
</ng-container>
</ng-container>
</div>
<!-- end check box questions section -->
<!-- start forms based questions -->
<div *ngIf="formsCategoryEnable">
<ng-container [ngSwitch]="selectedFormsCategory.form_id">
<!-- start supplier type questions section -->
<ng-container *ngSwitchCase="1">
<app-supplier-info [pdid]="startPD"></app-supplier-info>
</ng-container>
<!-- end supplier type questions -->
<!-- start client type questions -->
<ng-container *ngSwitchCase="2">
<app-client-info [pdid]="startPD"></app-client-info>
</ng-container>
<!-- end client type questions -->
<!-- start personal type questions -->
<ng-container *ngSwitchCase="3">
<app-personal-info [pdid]="startPD" [pd_all_details]="pdFullDetails"></app-personal-info>
</ng-container>
<ng-container *ngSwitchCase="4">
<app-assets-info [pdid]="startPD"></app-assets-info>
</ng-container>
<ng-container *ngSwitchCase="5">
<app-address [pdid]="startPD"></app-address>
<!-- end personal type questions -->
</ng-container>
<ng-container *ngSwitchCase="6">
<app-family-details [pdid]="startPD"></app-family-details>
</ng-container>
<ng-container *ngSwitchCase="7">
<!--<p>Banking details</p>-->
<app-banking-details [pdid]="startPD" [pd_all_details]="pdFullDetails" ></app-banking-details>
</ng-container>
<ng-container *ngSwitchCase="8">
<app-current-loan [pdid]="startPD" [form_id]="selectedFormsCategory.form_id" [applicant_details]="pdFullDetails"></app-current-loan>
</ng-container>
<ng-container *ngSwitchCase="9">
<app-other-income [pdid]="startPD" [form_id]="selectedFormsCategory.form_id"></app-other-income>
</ng-container>
<ng-container *ngSwitchCase="10">
<app-loan-details [pdid]="startPD" [form_id]="selectedFormsCategory.form_id" [applicant_details]="pdFullDetails"></app-loan-details>
</ng-container>
<ng-container *ngSwitchCase="11">
<app-stock [pdid]="startPD" [form_id]="selectedFormsCategory.form_id"></app-stock>
</ng-container>
<ng-container *ngSwitchCase="12">
<app-employment-info [pdid]="startPD" [form_id]="selectedFormsCategory.form_id" [pd_all_details]="pdFullDetails"></app-employment-info>
</ng-container>
<ng-container *ngSwitchCase="13">
<app-business-info [pdid]="startPD" [form_id]="selectedFormsCategory.form_id" [applicant_details]="pdFullDetails"></app-business-info>
</ng-container>
<ng-container *ngSwitchCase="14">
<app-financial-info [pdid]="startPD" [form_id]="selectedFormsCategory.form_id"></app-financial-info>
</ng-container>
<ng-container *ngSwitchCase="15">
<app-lender-representative [pdid]="startPD" [form_id]="selectedFormsCategory.form_id"></app-lender-representative>
</ng-container>
<ng-container *ngSwitchCase="16">
<app-assessed-income [pdid]="startPD" [form_id]="selectedFormsCategory.form_id"></app-assessed-income>
</ng-container>
<ng-container *ngSwitchCase="17">
<app-rental-info [pdid]="startPD" [form_id]="selectedFormsCategory.form_id"></app-rental-info>
</ng-container>
</ng-container>
</div>
<!-- end form based questions -->
</figure>
<!--</ng-container>-->
<!--&lt;!&ndash; end supplier type questions &ndash;&gt;-->
<!--&lt;!&ndash; start client type questions &ndash;&gt;-->
<!--<ng-container *ngSwitchCase="2">-->
<!--<app-client-info [pdid]="startPD"></app-client-info>-->
<!--</ng-container>-->
<!--&lt;!&ndash; end client type questions &ndash;&gt;-->
<!--&lt;!&ndash; start personal type questions &ndash;&gt;-->
<!--<ng-container *ngSwitchCase="3">-->
<!--<app-personal-info [pdid]="startPD" [pd_all_details]="pdFullDetails"></app-personal-info>-->
<!--</ng-container>-->
<!--<ng-container *ngSwitchCase="4">-->
<!--<app-assets-info [pdid]="startPD"></app-assets-info>-->
<!--</ng-container>-->
<!--&lt;!&ndash; end personal type questions -->
<!--&ndash;&gt;-->
<!--</ng-container>-->
<!--</div>-->
<!-- end form based questions -->
<!--</figure>-->
</div>
</mat-sidenav-container>
</mat-card-content> </mat-card-content>
<!-- <mat-card-actions align="end">
<button _ngcontent-c21="" matTooltip="Complete Question" matTooltipPosition="above" [disabled]="actualQuestions!=answeredQuestions" class="compose-btn mat-warn mat-raised-button mb-1" (click)="changePDStatus(pdStatusCheck.COMPLETED);" style="margin-top:10px;"><span>{{currentPDStatus==pdStatusCheck.INPROGRESS ? 'COMPLETE':(currentPDStatus==pdStatusCheck.QC_COMPLETED ? 'QC COMPLETED' : currentPDStatus ) }}</span></button>
</mat-card-actions> -->
</mat-card> </mat-card>
<notifier-container></notifier-container>

179
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.component.scss
View File

@ -1,137 +1,58 @@
@import "./../../../../../assets/styles/scss/components/messages"; // .child_mat_card mat-card {
:host { // margin: 2 0%;
margin-left: -5px; // }
margin-right: -5px; mat-card.parent_mat_card > {
margin-top: -5px; mat-card-header {
display: block; display: flex;
} flex-direction: column;
:host /deep/ { }
mat-sidenav { mat-card-content {
width: 250px; min-height:auto;
} max-height:52vh;
.mat-sidenav-content { overflow:auto;
padding: 0;
}
@media (min-width: 959px) {
.mat-sidenav-side {
background-color: transparent;
box-shadow: none!important;
}
} }
// @media only screen and (max-width:319px) {
// mat-card-content {
// max-height: 350px;
// overflow: auto;
// }
// }
// @media only screen and (min-width:320px) and (max-width:767px) {
// mat-card-content {
// max-height: 350px;
// overflow: auto;
// }
// }
// @media only screen and (min-width:768px) and (max-width:1023px) {
// mat-card-content {
// max-height: 350px;
// overflow: auto;
// }
// }
// @media only screen and (min-width:1024px) and (max-width:1899px) {
// mat-card-content {
// max-height: 400px;
// overflow: auto;
// }
// }
// @media only screen and (min-width:1900px) {
// mat-card-content {
// max-height: 500px;
// overflow: auto;
// }
// }
} }
.mat-expansion-panel-header-description {
color: rgba(0, 0, 0, 87);
}
.mat-card-content {
background-color: white;
}
.mat-card-actions {
background-color: white;
}
.text-ellipsis {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.custm-list-item {
cursor: pointer;
}
$base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important; $base-card-box-shadow:1.5px 2.6px 24px 0 rgba(0, 35, 136, 0.08) !important;
$product-bg-color-hover: rgba(103, 58, 183, 0.7); mat-card .child_mat_card > mat-card {
.p-list-main { border-radius: 0px 0px 0px 15px;
background: white; box-shadow: $base-card-box-shadow;
margin: auto; transform: scale(0.95);
position: relative; transition: box-shadow 0.5s, transform 0.5s;
overflow: hidden !important;
border-radius: 10px 10px 10px 10px;
box-shadow: $base-card-box-shadow;
transform: scale(0.95);
transition: box-shadow 0.5s, transform 0.5s;
&:hover { &:hover {
cursor: pointer;
background-color: #e00201 !important;
transform: scale(1); transform: scale(1);
box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2); box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.2);
} }
.p-list {
position: relative;
.top {
height: 100%;
width: 100%;
// background: url(https://s-media-cache-ak0.pinimg.com/736x/49/80/6f/49806f3f1c7483093855ebca1b8ae2c4.jpg) no-repeat center center;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
.bottom {
width: 200%;
height: 15%;
transition: transform 0.5s;
h1 {
margin: 0;
padding: 0;
}
p {
margin: 0;
padding: 0;
}
.left {
height: 100%;
width: 50%;
background: #f4f4f4;
position: relative;
float: left;
.details {
padding: 5px;
float: left;
// width: calc(70% - 40px);
}
}
.right {
width: 50%;
background: #A6CDDE;
color: white;
float: right;
height: 200%;
overflow: hidden;
.details {
padding: 20px;
float: right;
width: calc(70% - 40px);
}
}
}
} }
}
mat-icon{
color: #ff3636;
}
.address {
display: flex;
padding: 0 2%;
flex-direction: column;
}
.address > * {
width: 100%;
}
.matcard mat-form-field {
margin: 0 2%;
}
.address .button {
float: right;
width: 10px;
background: #62B013;
color: white;
}

256
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.component.ts
View File

@ -1,10 +1,29 @@
import {Component, ViewChild, OnInit, ViewEncapsulation, OnDestroy} from '@angular/core'; import {Component, ViewChild, OnInit, ViewEncapsulation, OnDestroy} from '@angular/core';
import {FormBuilder, FormGroup, Validators, FormControl, FormArray, AbstractControl} from '@angular/forms'; import {FormBuilder, FormGroup, Validators, FormControl, FormArray, AbstractControl} from '@angular/forms';
import {ActivatedRoute, Router} from '@angular/router'; import {ActivatedRoute, Router} from '@angular/router';
import {MatDialog } from '@angular/material';
import {NotifierService} from 'angular-notifier'; import {NotifierService} from 'angular-notifier';
import {ListPdComponent} from './../list-pd.component'; import {ListPdComponent} from './../list-pd.component';
import {PdTrigerService} from '../../../pd-service/pd-triger.service'; import {PdTrigerService} from '../../../pd-service/pd-triger.service';
import {PersonalInfoComponent} from './forms/personal-info/personal-info.component';
import {AddressComponent } from './forms/address/address.component';
import {OtherIncomeComponent} from './forms/other-income/other-income.component';
import {SupplierInfoComponent} from './forms/supplier-info/supplier-info.component';
import {ClientInfoComponent} from './forms/client-info/client-info.component';
import {FamilyDetailsComponent} from './forms/family-details/family-details.component';
import {EmploymentInfoComponent} from './forms/employment-info/employment-info.component';
import {StockComponent} from './forms/stock/stock.component';
import {CurrentLoanComponent} from './forms/current-loan/current-loan.component';
import {FinancialInfoComponent} from './forms/financial-info/financial-info.component';
import {AssetsInfoComponent} from './forms/assets-info/assets-info.component';
import {RentalInfoComponent} from './forms/rental-info/rental-info.component';
import {AssessedIncomeComponent} from './forms/assessed-income/assessed-income.component';
import {BankingDetailsComponent} from './forms/banking-details/banking-details.component';
import {BusinessInfoComponent} from './forms/business-info/business-info.component';
import {LenderRepresentativeComponent} from './forms/lender-representative/lender-representative.component';
import {LoanDetailsComponent} from './forms/loan-details/loan-details.component';
@Component({ @Component({
selector: 'app-start-pd', selector: 'app-start-pd',
templateUrl: './start-pd.component.html', templateUrl: './start-pd.component.html',
@ -177,7 +196,7 @@ pdFullDetails:any=[];
private notifier: NotifierService; private notifier: NotifierService;
constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute, constructor(notifier: NotifierService, private dialog: MatDialog, private fb: FormBuilder, private route: ActivatedRoute,
private router: Router, private router: Router,
private listPDComponent: ListPdComponent, private _pd: PdTrigerService,) { private listPDComponent: ListPdComponent, private _pd: PdTrigerService,) {
this.startPD = this.route.snapshot.params['pdid']; this.startPD = this.route.snapshot.params['pdid'];
@ -295,9 +314,7 @@ pdFullDetails:any=[];
this.pdMasterList=data.records.pdmaster_details; this.pdMasterList=data.records.pdmaster_details;
this.categoryList=data.records.question_answers; this.categoryList=data.records.question_answers;
this.categoryFormButtons = data.records.template_forms; this.categoryFormButtons = data.records.template_forms;
console.log('formButtons', this.categoryFormButtons);
let filterApplicantName= data.records.pdapplicants_detials.filter(item => item.applicant_type == 1); let filterApplicantName= data.records.pdapplicants_detials.filter(item => item.applicant_type == 1);
console.log(filterApplicantName);
this.mainApplicantName = filterApplicantName[0].applicant_name; this.mainApplicantName = filterApplicantName[0].applicant_name;
this.currentPDStatus = data.records.pdmaster_details.pd_status; this.currentPDStatus = data.records.pdmaster_details.pd_status;
@ -626,10 +643,235 @@ pdFullDetails:any=[];
// start // start
// direct form based questions // direct form based questions
OnSelectDirectForms(details: any) { OnSelectDirectForms(details: any) {
this.formsCategoryEnable = true; // this.formsCategoryEnable = true;
this.selectedFormsCategory = details; this.selectedFormsCategory = details;
console.log('select..', this.selectedFormsCategory);
if(this.selectedFormsCategory.form_id==1){
const dialogRef = this.dialog.open(SupplierInfoComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}else
if(this.selectedFormsCategory.form_id==2){
const dialogRef = this.dialog.open(ClientInfoComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}else
if(this.selectedFormsCategory.form_id==3){
const dialogRef = this.dialog.open(PersonalInfoComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}else
if(this.selectedFormsCategory.form_id==4){
const dialogRef = this.dialog.open(AssetsInfoComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}else
if(this.selectedFormsCategory.form_id==5){
const dialogRef = this.dialog.open(AddressComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}else
if(this.selectedFormsCategory.form_id==6){
const dialogRef = this.dialog.open(FamilyDetailsComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}else
if(this.selectedFormsCategory.form_id==7){
const dialogRef = this.dialog.open(BankingDetailsComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}
else
if(this.selectedFormsCategory.form_id==8){
const dialogRef = this.dialog.open(CurrentLoanComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}
else
if(this.selectedFormsCategory.form_id==9){
const dialogRef = this.dialog.open(OtherIncomeComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}else
if(this.selectedFormsCategory.form_id==10){
const dialogRef = this.dialog.open(LoanDetailsComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}else
if(this.selectedFormsCategory.form_id==11){
const dialogRef = this.dialog.open(StockComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}else
if(this.selectedFormsCategory.form_id==12){
const dialogRef = this.dialog.open(EmploymentInfoComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}else
if(this.selectedFormsCategory.form_id==13){
const dialogRef = this.dialog.open(BusinessInfoComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}else
if(this.selectedFormsCategory.form_id==14){
const dialogRef = this.dialog.open(FinancialInfoComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}else
if(this.selectedFormsCategory.form_id==15){
const dialogRef = this.dialog.open(LenderRepresentativeComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}
else
if(this.selectedFormsCategory.form_id==16){
const dialogRef = this.dialog.open(AssessedIncomeComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}else
if(this.selectedFormsCategory.form_id==17){
const dialogRef = this.dialog.open(RentalInfoComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
dialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}
} }

3
ng6-seed/src/app/personal-discussion/manage-pd/manage-pd.module.ts
View File

@ -175,7 +175,8 @@ const pdCustomNotifierOptions: NotifierOptions = {
// declarations: [ListPdComponent, ManagePdComponent, MapPdViewComponent, AddPdComponent, ViewPdComponent, PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, InprogressPdComponent, AllPdComponent, ScheduledPdComponent, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, SupplierInfoComponent, PersonalInfoComponent, AssetsInfoComponent], // declarations: [ListPdComponent, ManagePdComponent, MapPdViewComponent, AddPdComponent, ViewPdComponent, PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, InprogressPdComponent, AllPdComponent, ScheduledPdComponent, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, SupplierInfoComponent, PersonalInfoComponent, AssetsInfoComponent],
exports: [PdAllocationComponent, SmartPdAllocationComponent, TelePdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, SupplierInfoComponent, PersonalInfoComponent, CurrentLoanComponent, LoanDetailsComponent, OtherIncomeComponent, AssetsInfoComponent, AddressComponent, FamilyDetailsComponent, BankingDetailsComponent, StockComponent, EmploymentInfoComponent, BusinessInfoComponent, FinancialInfoComponent, LenderRepresentativeComponent,RentalInfoComponent, AssessedIncomeComponent, AllocationViewMoreComponent], exports: [PdAllocationComponent, SmartPdAllocationComponent, TelePdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, SupplierInfoComponent, PersonalInfoComponent, CurrentLoanComponent, LoanDetailsComponent, OtherIncomeComponent, AssetsInfoComponent, AddressComponent, FamilyDetailsComponent, BankingDetailsComponent, StockComponent, EmploymentInfoComponent, BusinessInfoComponent, FinancialInfoComponent, LenderRepresentativeComponent,RentalInfoComponent, AssessedIncomeComponent, AllocationViewMoreComponent],
providers: [PdTrigerService, GetGeometricLocationService], providers: [PdTrigerService, GetGeometricLocationService],
entryComponents: [PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, TelePdAllocationComponent, AllocationViewMoreComponent] entryComponents: [PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, TelePdAllocationComponent, AllocationViewMoreComponent, PersonalInfoComponent,
ClientInfoComponent, SupplierInfoComponent, CurrentLoanComponent, LoanDetailsComponent, OtherIncomeComponent, AssetsInfoComponent, AddressComponent, FamilyDetailsComponent, BankingDetailsComponent, StockComponent, EmploymentInfoComponent, BusinessInfoComponent, FinancialInfoComponent, LenderRepresentativeComponent,RentalInfoComponent, AssessedIncomeComponent],
}) })
export class ManagePdModule { export class ManagePdModule {
} }