merge : kms

This commit is contained in:
gandhimathi 2018-12-20 19:26:55 +05:30
parent 2e006b2085
commit 1729af3679
79 changed files with 6782 additions and 3443 deletions

View File

@ -4352,12 +4352,14 @@
"balanced-match": {
"version": "1.0.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"brace-expansion": {
"version": "1.1.11",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"balanced-match": "1.0.0",
"concat-map": "0.0.1"
@ -4372,17 +4374,20 @@
"code-point-at": {
"version": "1.1.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"concat-map": {
"version": "0.0.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"console-control-strings": {
"version": "1.1.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"core-util-is": {
"version": "1.0.2",
@ -4499,7 +4504,8 @@
"inherits": {
"version": "2.0.3",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"ini": {
"version": "1.3.5",
@ -4511,6 +4517,7 @@
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"number-is-nan": "1.0.1"
}
@ -4525,6 +4532,7 @@
"version": "3.0.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"brace-expansion": "1.1.11"
}
@ -4532,12 +4540,14 @@
"minimist": {
"version": "0.0.8",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"minipass": {
"version": "2.2.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"safe-buffer": "5.1.1",
"yallist": "3.0.2"
@ -4556,6 +4566,7 @@
"version": "0.5.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"minimist": "0.0.8"
}
@ -4636,7 +4647,8 @@
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"object-assign": {
"version": "4.1.1",
@ -4648,6 +4660,7 @@
"version": "1.4.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"wrappy": "1.0.2"
}
@ -4769,6 +4782,7 @@
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"code-point-at": "1.1.0",
"is-fullwidth-code-point": "1.0.0",
@ -7321,6 +7335,14 @@
}
}
},
"ngx-viewer": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/ngx-viewer/-/ngx-viewer-1.0.1.tgz",
"integrity": "sha512-9nYfxsxco/x8zLjdVOAhi4SFMZhSgtHBGTmcns9ebQn5nCBwHbk9O62K5ZIWkfOElr9ey1KA+DmppH32YGkXEA==",
"requires": {
"tslib": "^1.9.0"
}
},
"nice-try": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
@ -10703,6 +10725,11 @@
"extsprintf": "1.3.0"
}
},
"viewerjs": {
"version": "1.3.1",
"resolved": "https://registry.npmjs.org/viewerjs/-/viewerjs-1.3.1.tgz",
"integrity": "sha512-FBO2pN5XKx2yYpfZpQFSI89GhN4PvIhI2gCyahTsLzIUQzKIIRTQyAOMG5Dey7rgMMGU+JsmpfL2q/eARiB7Dg=="
},
"vm-browserify": {
"version": "0.0.4",
"resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz",

View File

@ -58,6 +58,7 @@
"ngx-mat-daterange-picker": "^1.1.4",
"ngx-mat-select-search": "^1.3.1",
"ngx-perfect-scrollbar": "5.0.0-7",
"ngx-viewer": "^1.0.1",
"perfect-scrollbar": "^1.3.0",
"quill": "^1.2.0",
"rxjs": "^6.3.1",
@ -67,6 +68,7 @@
"sortablejs": "^1.6.0",
"sweetalert2": "^7.28.4",
"tether": "^1.4.0",
"viewerjs": "^1.3.1",
"zone.js": "^0.8.26"
},
"devDependencies": {

View File

@ -1,4 +1,4 @@
<div class="pad-wrap">
<div class="pad-wrap" [style.minHeight]="'100%'">
<div fxFlex.gt-sm="100" fxFlex.gt-xs="100" fxFlex="100">
<mat-card style="min-height: 90%;">
<mat-card-title>

View File

@ -20,6 +20,7 @@ li
//float:left;
}
.example-full-width {
width: 95%;
}

View File

@ -21,12 +21,21 @@
<mat-option>
Select
</mat-option>
<mat-option *ngFor="let LL of lenderList" [value]="LL.entity_id" >
<mat-option (click)="selectedLender(LL)" *ngFor="let LL of lenderList" [value]="LL.entity_id" >
{{LL.full_name}}
</mat-option>
</mat-select>
<!-- <mat-error *ngIf="pdMain.fk_lender_id.hasError('required')" class="mat-text-warn">Lender Name Required.</mat-error> -->
</mat-form-field>
<mat-form-field style="width: 32%">
<mat-select placeholder="Branch" formControlName="pd_branch_id">
<!-- (selectionChange)="getBillingDetails(pdMain.fk_lender_id.value)" -->
<mat-option>
Select
</mat-option>
<mat-option *ngFor="let LB of lenderBranchList" [value]="LB.entity_lender_branch_id" >
{{LB.branch_name}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width: 32%">

View File

@ -25,6 +25,7 @@ export class AddPdComponent implements OnInit, OnDestroy {
productList:any;
subProductList:any;
lenderList:any;
lenderBranchList: any;
customerSegmentList:any;
stateList:any;
cityList:any;
@ -62,6 +63,7 @@ export class AddPdComponent implements OnInit, OnDestroy {
loadFormData(){
this._PDtriggerForm = this._fb.group({
fk_lender_id: [null],
pd_branch_id: [null],
lender_applicant_id: [null, Validators.compose([Validators.required])],
lender_contact_person: [null, Validators.compose([Validators.required])],
lender_contact_mobile: [null, Validators.compose([Validators.required,Validators.minLength(10),Validators.maxLength(12),Validators.required,Validators.pattern('^[0-9]*$')])],
@ -92,6 +94,14 @@ export class AddPdComponent implements OnInit, OnDestroy {
});
}
selectedLender(lender){
// console.log(JSON.stringify(lender));
// alert(JSON.stringify(lender['branches ']));
this.lenderBranchList = lender['branches'];
this._PDtriggerForm.controls.pd_branch_id.setValue(null);
}
getLenderList(){
this._pd.getLenderDetails().subscribe(
data => {
@ -358,6 +368,7 @@ export class AddPdComponent implements OnInit, OnDestroy {
let pd_details:any={
"fk_lender_id":formValue.fk_lender_id,
"lender_applicant_id":formValue.lender_applicant_id,
"pd_branch_id":formValue.pd_branch_id,
"pd_contact_person":formValue.lender_contact_person,
"pd_contact_mobileno":formValue.lender_contact_mobile,
"fk_product_id":formValue.fk_product_id,

View File

@ -1,58 +1,135 @@
<mat-card-content>
<mat-table [dataSource]="dataSourceTab1" matSort *ngIf="PdListData.length > 0" >
<mat-card-content>
<mat-expansion-panel [(expanded)]="xpandStatus">
<mat-expansion-panel-header>
<mat-panel-title class="text-xs-left">
<h6 class="mt-0">
<mat-icon>filter_list</mat-icon> Filter</h6>
</mat-panel-title>
</mat-expansion-panel-header>
<mat-list class="m-gap p-gap">
<div [formGroup]="searchForm">
<mat-form-field style="width:40%">
<mat-select multiple formControlName="pd_type" placeholder="PD Type">
<mat-option *ngFor="let type of PDType" [value]="type.pd_type_id">{{type.type_name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:40%">
<mat-select multiple formControlName="pd_status" placeholder="PD Status">
<mat-option *ngFor="let status of pdStatus" [value]="status.pd_status_name">{{status.pd_status_name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:40%">
<input matInput [matDatepicker]="picker" (blur)="checkDate($event)" formControlName="pd_from_date" placeholder="Choose a From date">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:40%">
<input matInput [matDatepicker]="picker1" [min]="searchForm.get('pd_from_date').value" formControlName="pd_to_date" placeholder="Choose a todate">
<mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
<mat-datepicker #picker1></mat-datepicker>
</mat-form-field>
<mat-form-field style="width:25%">
<mat-select multiple formControlName="pd_products" placeholder="Products">
<mat-option *ngFor="let pro of PRODUCTS" [value]="pro.product_id">{{pro.name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:25%">
<mat-select multiple formControlName="pd_city" placeholder="City">
<mat-option *ngFor="let city of CITY" [value]="city.city_id">{{city.name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:25%">
<mat-select multiple formControlName="pd_lender" placeholder="Lender Name">
<mat-option *ngFor="let ent of ENTITY" [value]="ent.entity_id">{{ent.full_name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:40%">
<input matInput type="text" formControlName="pd_name" placeholder="Applicant Name">
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:40%">
<input matInput type="text" formControlName="pd_applicant_id" placeholder="Applicant Id">
</mat-form-field>
<br/>
<button type="button" mat-raised-button mat-icon-button (click)="searchItem()" matTooltip="Add More Additional Requirements"
matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary" type="button">
<mat-icon>search</mat-icon>
</button>
</div>
</mat-list>
</mat-expansion-panel>
<br/>
<mat-table [dataSource]="dataSourceTab1" matSort *ngIf="PdListData.length > 0">
<ng-container matColumnDef="PDType">
<mat-cell fxFlex="15" class="cell" *matCellDef="let details;" style="justify-content:flex-end">
<div *ngIf="details.fk_pd_type != null" [ngClass]="(details.fk_pd_type=='1')?'fullPD':(details.fk_pd_type=='2')?'smartPD':'telePD'" class="mr-1 mb-1 hover-icon commonPDType"
[matTooltip]="details.pd_type_name" matTooltipPosition="above"><strong style="font-size:3rem;">{{(details.pd_type_name | slice:0:1)}}</strong></div>
<div *ngIf="details.fk_pd_type != null" [ngClass]="(details.fk_pd_type=='1')?'fullPD':(details.fk_pd_type=='2')?'smartPD':'telePD'"
class="mr-1 mb-1 hover-icon commonPDType" [matTooltip]="details.pd_type_name" matTooltipPosition="above">
<strong style="font-size:3rem;">{{(details.pd_type_name | slice:0:1)}}</strong>
</div>
</mat-cell>
</ng-container>
<ng-container matColumnDef="Name">
<mat-cell class="cell" *matCellDef="let details;">
<span *ngIf="details.applicat_details" mat-line><b>{{details.applicat_details[0].applicant_name}}</b></span><br>
<span class="fontsize"> {{details.lender_applicant_id}}</span> <span class="fontsize" *ngIf="details.customer_segment_abbr">-({{details.customer_segment_abbr}} )</span>
<span *ngIf="details.applicat_details" mat-line>
<b>{{details.applicat_details[0].applicant_name}}</b>
</span>
<br>
<span class="fontsize"> {{details.lender_applicant_id}}</span>
<span class="fontsize" *ngIf="details.customer_segment_abbr">-({{details.customer_segment_abbr}} )</span>
</mat-cell>
</ng-container>
<ng-container matColumnDef="Lenderid">
<mat-cell class="cell" *matCellDef="let details">
<span *ngIf="details.lender_full_name" mat-line> {{details.lender_full_name}} </span><br>
<span *ngIf="details.product_abbr" mat-line class="fontsize"> {{details.product_abbr}}/{{details.subproduct_abbr}}</span> <br>
<span *ngIf="details.loan_amount" class="fontsize"><i class="fa-1x fa fa-rupee"></i> {{details.loan_amount}}</span>
<span *ngIf="details.lender_full_name" mat-line> {{details.lender_full_name}} </span>
<br>
<span *ngIf="details.product_abbr" mat-line class="fontsize"> {{details.product_abbr}}/{{details.subproduct_abbr}}</span>
<br>
<span *ngIf="details.loan_amount" class="fontsize">
<i class="fa-1x fa fa-rupee"></i> {{details.loan_amount}}</span>
</mat-cell>
</ng-container>
<ng-container matColumnDef="Address">
<mat-cell class="cell" *matCellDef="let details;">
<span matTooltip="Initiated Date" matTooltipPosition="above" >{{details.pd_date_of_initiation}}</span><br>
<span class="fontsize" *ngIf="details.city_name"> <i class="fa-1x fa fa-map-marker"> </i> {{details.city_name}}-{{details.pincode}} </span>
<span matTooltip="Initiated Date" matTooltipPosition="above">{{details.pd_date_of_initiation}}</span>
<br>
<span class="fontsize" *ngIf="details.city_name">
<i class="fa-1x fa fa-map-marker"> </i> {{details.city_name}}-{{details.pincode}} </span>
</mat-cell>
</ng-container>
<ng-container matColumnDef="Status">
<mat-cell class="cell center" *matCellDef="let details;">
<span *ngIf="details.pd_status!='QC_COMPLETED'"> {{details.pd_status}}</span>
<span *ngIf="details.pd_status=='QC_COMPLETED'"> QC COMPLETED</span><br>
<span class="fontsize" *ngIf="details.pd_status!='SCHEDULED' && details.pd_status!='QC_COMPLETED'" [matTooltip]="details.pd_status | titlecase" matTooltipPosition="above" >{{ (details.updatedon)? (details.updatedon | slice:0:10):(details.updatedon) }}
<span *ngIf="details.pd_status=='QC_COMPLETED'"> QC COMPLETED</span>
<br>
<span class="fontsize" *ngIf="details.pd_status!='SCHEDULED' && details.pd_status!='QC_COMPLETED'" [matTooltip]="details.pd_status | titlecase"
matTooltipPosition="above">{{ (details.updatedon)? (details.updatedon | slice:0:10):(details.updatedon) }}
</span>
<span class="fontsize" *ngIf="details.pd_status=='QC_COMPLETED'" matTooltip="QC Completed" matTooltipPosition="above" >{{ (details.updatedon)? (details.updatedon | slice:0:10):(details.updatedon) }}
<span class="fontsize" *ngIf="details.pd_status=='QC_COMPLETED'" matTooltip="QC Completed" matTooltipPosition="above">{{ (details.updatedon)? (details.updatedon | slice:0:10):(details.updatedon) }}
</span>
<span class="fontsize" *ngIf="details.pd_status=='SCHEDULED'" [matTooltip]="details.pd_status | titlecase" matTooltipPosition="above" >{{details.scheduled_on}}
<span class="fontsize" *ngIf="details.pd_status=='SCHEDULED'" [matTooltip]="details.pd_status | titlecase" matTooltipPosition="above">{{details.scheduled_on}}
</span>
</mat-cell>
</ng-container>
<ng-container matColumnDef="Action">
<mat-cell class="cell center" *matCellDef="let details;">
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" color="primary" (click)="viewPD(details.pd_id)" matTooltip="View"
matTooltipPosition="above"><mat-icon>visibility</mat-icon></button>
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" color="primary" (click)="viewPD(details.pd_id)"
matTooltip="View" matTooltipPosition="above">
<mat-icon>visibility</mat-icon>
</button>
</mat-cell>
</ng-container>
<mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;">
</mat-row>
</mat-table>
</mat-card-content>
</mat-card-content>
<mat-paginator *ngIf="!recordStatus" #paginator class="mat-elevation-z1" [length]="PdListData.length" [pageIndex]="pageIndex" [pageSize]="pageSize"
[pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons>
</mat-paginator>
<mat-paginator *ngIf="!recordStatus" #paginator class="mat-elevation-z1" [length]="PdListData.length" [pageIndex]="pageIndex"
[pageSize]="pageSize" [pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons>
</mat-paginator>
<notifier-container></notifier-container>

View File

@ -1,6 +1,9 @@
import { Component,ViewChild, OnInit, ViewEncapsulation, Input, Output, EventEmitter, OnDestroy, AfterViewInit, OnChanges, SimpleChanges } from '@angular/core';
import { PdTrigerService } from './../../../pd-service/pd-triger.service';
import { MatPaginator, MatSort, MatTableDataSource, PageEvent } from '@angular/material';
import { FormGroup, FormBuilder } from '@angular/forms';
import { DatePipe } from '@angular/common';
import { NotifierService } from 'angular-notifier';
@Component({
selector: 'app-all-pd',
@ -11,6 +14,16 @@ import { MatPaginator, MatSort, MatTableDataSource, PageEvent } from '@angular/m
})
export class AllPdComponent implements OnInit, OnChanges {
xpandStatus: boolean = false;
PRODUCTS: any;
ENTITY: any;
CITY: any;
tempStore = new MatTableDataSource();
PDType: any;
pdStatus: any;
searchForm:FormGroup;
pipe = new DatePipe('en-US');
public notifier : NotifierService;
recordStatus: boolean;
errorMessage:any[]=[];
tabStatus:string="ALL";
@ -34,12 +47,26 @@ export class AllPdComponent implements OnInit, OnChanges {
pageSize = 10;
pageEvent: PageEvent;
constructor(private _pd: PdTrigerService) {
constructor(private _pd: PdTrigerService,private _fb:FormBuilder) {
this.searchForm = this._fb.group(
{
pd_type:[null],
pd_status:[null],
pd_from_date:[null],
pd_to_date:[null],
pd_city:[null],
pd_products:[null],
pd_lender:[null],
pd_name:[null],
pd_applicant_id:[null],
});
}
ngOnInit() {
this.recordStatus=false;
// this.loadPDDetails();
this.getcommonDropDown();
}
ngAfterViewInit() {
this.dataSourceTab1.paginator = this.paginator;
@ -65,7 +92,7 @@ export class AllPdComponent implements OnInit, OnChanges {
this.PdListData = data.records;
this.dataLengthTab1 = data.records.length;
this.dataSourceTab1.data = this.PdListData;
this.tempStore.data = this.PdListData;
}
else{
this.PdListData=[];
@ -87,4 +114,89 @@ export class AllPdComponent implements OnInit, OnChanges {
return word[0].toUpperCase() + word.substr(1).toLowerCase();
}
/**
* Common Search
* sriram
*/
getcommonDropDown()
{
this._pd.getAllMasterDatas('PDSTATUS').subscribe(res=>
{
if(res.dataStatus==true)
{
this.pdStatus = res.records.filter(status=>status.isactive==1);
}
});
this._pd.getAllMasterDatas('PDTYPE').subscribe(res=>
{
if(res.dataStatus==true)
{
this.PDType = res.records.filter(type=>type.isactive==1);
}
});
this._pd.getAllMasterDatas('CITY').subscribe(res=>
{
if(res.dataStatus==true)
{
this.CITY = res.records.filter(city=>city.isactive==1);
}
});
this._pd.getAllMasterDatas('ENTITY').subscribe(res=>
{
if(res.dataStatus==true)
{
this.ENTITY = res.records.filter(ent=>ent.isactive==1);
}
});
this._pd.getAllMasterDatas('PRODUCTS').subscribe(res=>
{
if(res.dataStatus==true)
{
this.PRODUCTS = res.records.filter(pro=>pro.isactive==1);
}
});
}
checkDate(e)
{
console.log(e);
}
searchItem()
{
if(this.searchForm.value.pd_type !=null)
{
}else
{
this.searchForm.value.pd_type = [];
}
if(this.searchForm.value.pd_status !=null)
{
}else
{
this.searchForm.value.pd_status = [];
}
this.searchForm.value.pd_from_date = this.pipe.transform(this.searchForm.value.pd_from_date,'yyyy-MM-dd');
this.searchForm.value.pd_to_date = this.pipe.transform(this.searchForm.value.pd_to_date,'yyyy-MM-dd');
console.log(JSON.stringify(this.searchForm.value));
this._pd.overAllSearchFormDetails(this.searchForm.value).subscribe(res=>
{
this.xpandStatus = false;
if(res['dataStatus']==true)
{
this.dataSourceTab1 = res['records'];
}else{
// this.notifier.notify('warning', 'No Records Found');
this.dataSourceTab1 = this.tempStore;
}
})
}
}

View File

@ -1,4 +1,66 @@
<mat-card-content>
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title class="text-xs-left">
<h6 class="mt-0"><mat-icon>filter_list</mat-icon> Filter</h6>
</mat-panel-title>
</mat-expansion-panel-header>
<mat-list class="m-gap p-gap">
<div [formGroup]="searchForm">
<mat-form-field style="width:40%">
<mat-select multiple formControlName="pd_type" placeholder="PD Type">
<mat-option *ngFor="let type of PDType" [value]="type.pd_type_id">{{type.type_name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:40%">
<mat-select multiple formControlName="pd_status" placeholder="PD Status">
<mat-option *ngFor="let status of pdStatus" [value]="status.pd_status_name">{{status.pd_status_name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:40%">
<input matInput [matDatepicker]="picker" (blur)="checkDate($event)" formControlName="pd_from_date" placeholder="Choose a From date">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:40%">
<input matInput [matDatepicker]="picker1" [min]="searchForm.get('pd_from_date').value" formControlName="pd_to_date" placeholder="Choose a todate">
<mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
<mat-datepicker #picker1></mat-datepicker>
</mat-form-field>
<mat-form-field style="width:25%">
<mat-select multiple formControlName="pd_products" placeholder="Products">
<mat-option *ngFor="let pro of PRODUCTS" [value]="pro.product_id">{{pro.name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:25%">
<mat-select multiple formControlName="pd_city" placeholder="City">
<mat-option *ngFor="let city of CITY" [value]="city.city_id">{{city.name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:25%">
<mat-select multiple formControlName="pd_lender" placeholder="Lender Name">
<mat-option *ngFor="let ent of ENTITY" [value]="ent.entity_id">{{ent.full_name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:40%">
<input matInput type="text" formControlName="pd_name" placeholder="Applicant Name">
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:40%">
<input matInput type="text" formControlName="pd_applicant_id" placeholder="Applicant Id">
</mat-form-field>
<br/>
<button type="button" mat-raised-button mat-icon-button (click)="searchItem()"
matTooltip="Add More Additional Requirements" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary" type="button">
<mat-icon>search</mat-icon>
</button>
</div>
</mat-list>
</mat-expansion-panel>
<br/>
<mat-table [dataSource]="dataSourceTab4" matSort *ngIf="completedPdListData.length > 0" >
<ng-container matColumnDef="PDType">

View File

@ -1,6 +1,8 @@
import { Component,ViewChild, OnInit, ViewEncapsulation, Input, Output, EventEmitter, OnDestroy, AfterViewInit, OnChanges, SimpleChanges } from '@angular/core';
import { PdTrigerService } from './../../../pd-service/pd-triger.service';
import { MatPaginator, MatSort, MatTableDataSource, PageEvent } from '@angular/material';
import { FormGroup, FormBuilder } from '@angular/forms';
import { DatePipe } from '@angular/common';
@Component({
selector: 'app-completed-pd',
@ -11,11 +13,23 @@ import { MatPaginator, MatSort, MatTableDataSource, PageEvent } from '@angular/m
})
export class CompletedPdComponent implements OnInit, OnChanges {
xpandStatus: boolean = false;
PRODUCTS: any;
CITY: any;
ENTITY: any;
PDType: any;
pdStatus: any;
recordStatus: boolean;
errorMessage:any[]=[];
tabStatus:string="COMPLETED";
pipe = new DatePipe('en-US');
public dataLengthTab4: number;
public dataSourceTab4 = new MatTableDataSource();
tempStore = new MatTableDataSource();
searchForm:FormGroup;
displayedColumns = ['PDType','Name','Lenderid','Address','Status','Action'];
@ViewChild(MatPaginator) paginator: MatPaginator;
@ -33,12 +47,26 @@ export class CompletedPdComponent implements OnInit, OnChanges {
pageSize = 10;
pageEvent: PageEvent;
constructor(private _pd: PdTrigerService) {
constructor(private _pd: PdTrigerService,public _fb:FormBuilder) {
this.searchForm = this._fb.group(
{
pd_type:[null],
pd_status:[null],
pd_from_date:[null],
pd_to_date:[null],
pd_city:[null],
pd_products:[null],
pd_lender:[null],
pd_name:[null],
pd_applicant_id:[null],
});
}
ngOnInit() {
this.recordStatus=false;
// this.loadPDDetails();
this.getcommonDropDown();
}
ngAfterViewInit() {
this.dataSourceTab4.paginator = this.paginator;
@ -63,7 +91,7 @@ export class CompletedPdComponent implements OnInit, OnChanges {
this.completedPdListData = data.records;
this.dataLengthTab4 = data.records.length;
this.dataSourceTab4.data = this.completedPdListData;
this.tempStore.data
}
else{
this.completedPdListData=[];
@ -85,6 +113,94 @@ export class CompletedPdComponent implements OnInit, OnChanges {
return word[0].toUpperCase() + word.substr(1).toLowerCase();
}
/**
* Common Search
* sriram
*/
getcommonDropDown()
{
this._pd.getAllMasterDatas('PDSTATUS').subscribe(res=>
{
if(res.dataStatus==true)
{
this.pdStatus = res.records.filter(status=>status.isactive==1 && status.pd_status_name==this.tabStatus);
// this.searchForm.controls['pd_status'].setValue(this.pdStatus[0]);
}
});
this._pd.getAllMasterDatas('PDTYPE').subscribe(res=>
{
if(res.dataStatus==true)
{
this.PDType = res.records.filter(type=>type.isactive==1);
}
});
this._pd.getAllMasterDatas('CITY').subscribe(res=>
{
if(res.dataStatus==true)
{
this.CITY = res.records.filter(city=>city.isactive==1);
}
});
this._pd.getAllMasterDatas('ENTITY').subscribe(res=>
{
if(res.dataStatus==true)
{
this.ENTITY = res.records.filter(ent=>ent.isactive==1);
}
});
this._pd.getAllMasterDatas('PRODUCTS').subscribe(res=>
{
if(res.dataStatus==true)
{
this.PRODUCTS = res.records.filter(pro=>pro.isactive==1);
}
});
}
checkDate(e)
{
console.log(e);
}
searchItem()
{
if(this.searchForm.value.pd_type !=null)
{
}else
{
this.searchForm.value.pd_type = [];
}
if(this.searchForm.value.pd_status !=null)
{
}else
{
this.searchForm.value.pd_status = [];
}
this.searchForm.value.pd_from_date = this.pipe.transform(this.searchForm.value.pd_from_date,'yyyy-MM-dd');
this.searchForm.value.pd_to_date = this.pipe.transform(this.searchForm.value.pd_to_date,'yyyy-MM-dd');
this._pd.overAllSearchFormDetails(this.searchForm.value).subscribe(res=>
{
this.xpandStatus = false;
if(res['dataStatus']==true)
{
this.dataSourceTab4 = res['records'];
}else{
// this.notifier.notify('warning', 'No Records Found');
this.dataSourceTab4 = this.tempStore;
}
})
}
}

View File

@ -1,4 +1,64 @@
<mat-card-content>
<mat-expansion-panel [(expanded)]="xpandStatus">
<mat-expansion-panel-header >
<mat-panel-title class="text-xs-left">
<h6 class="mt-0"><mat-icon>filter_list</mat-icon> Filter</h6>
</mat-panel-title>
</mat-expansion-panel-header>
<mat-list class="m-gap p-gap">
<div [formGroup]="searchForm">
<mat-form-field style="width:40%">
<mat-select multiple formControlName="pd_type" placeholder="PD Type">
<mat-option *ngFor="let type of PDType" [value]="type.pd_type_id">{{type.type_name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:40%">
<mat-select multiple formControlName="pd_status" placeholder="PD Status">
<mat-option *ngFor="let status of pdStatus" [value]="status.pd_status_name">{{status.pd_status_name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:40%">
<input matInput [matDatepicker]="picker" (blur)="checkDate($event)" formControlName="pd_from_date" placeholder="Choose a From date">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:40%">
<input matInput [matDatepicker]="picker1" [min]="searchForm.get('pd_from_date').value" formControlName="pd_to_date" placeholder="Choose a todate">
<mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
<mat-datepicker #picker1></mat-datepicker>
</mat-form-field>
<mat-form-field style="width:25%">
<mat-select multiple formControlName="pd_products" placeholder="Products">
<mat-option *ngFor="let pro of PRODUCTS" [value]="pro.product_id">{{pro.name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:25%">
<mat-select multiple formControlName="pd_city" placeholder="City">
<mat-option *ngFor="let city of CITY" [value]="city.city_id">{{city.name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:25%">
<mat-select multiple formControlName="pd_lender" placeholder="Lender Name">
<mat-option *ngFor="let ent of ENTITY" [value]="ent.entity_id">{{ent.full_name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:40%">
<input matInput type="text" formControlName="pd_name" placeholder="Applicant Name">
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:40%">
<input matInput type="text" formControlName="pd_applicant_id" placeholder="Applicant Id">
</mat-form-field>
<br/>
<button type="button" mat-raised-button mat-icon-button (click)="searchItem()"
matTooltip="Add More Additional Requirements" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary" type="button">
<mat-icon>search</mat-icon>
</button>
</div>
</mat-list>
</mat-expansion-panel>
<br/>
<mat-table [dataSource]="dataSourceTab2" matSort *ngIf="progressPdListData.length > 0" >
<ng-container matColumnDef="PDType">
<mat-cell fxFlex="15" class="cell" style="text-align: center" *matCellDef="let details;">

View File

@ -1,6 +1,8 @@
import { Component,ViewChild, OnInit, ViewEncapsulation, Input, Output, EventEmitter, OnDestroy, AfterViewInit, OnChanges, SimpleChanges } from '@angular/core';
import { PdTrigerService } from './../../../pd-service/pd-triger.service';
import { MatPaginator, MatSort, MatTableDataSource, PageEvent } from '@angular/material';
import { FormBuilder, FormGroup } from '@angular/forms';
import { DatePipe } from '@angular/common';
@Component({
selector: 'app-inprogress-pd',
@ -9,11 +11,19 @@ import { MatPaginator, MatSort, MatTableDataSource, PageEvent } from '@angular/m
encapsulation: ViewEncapsulation.None
})
export class InprogressPdComponent implements OnInit, OnChanges {
xpandStatus: boolean = false;
PRODUCTS: any;
ENTITY: any;
CITY: any;
PDType: any;
pdStatus: any;
recordStatus: boolean;
errorMessage:any[]=[];
tabStatus:string="INPROGRESS";
pipe = new DatePipe('en-US');
public dataLengthTab2: number;
public dataSourceTab2 = new MatTableDataSource();
tempStore = new MatTableDataSource();
displayedColumns = ['PDType','Name','Lenderid','Address','Status','Action'];
@ViewChild(MatPaginator) paginator: MatPaginator;
@ -30,13 +40,27 @@ export class InprogressPdComponent implements OnInit, OnChanges {
pageIndex = 0;
pageSize = 10;
pageEvent: PageEvent;
searchForm:FormGroup;
constructor(private _pd: PdTrigerService,public _fb:FormBuilder) {
constructor(private _pd: PdTrigerService) {
this.searchForm = this._fb.group(
{
pd_type:[null],
pd_status:[null],
pd_from_date:[null],
pd_to_date:[null],
pd_city:[null],
pd_products:[null],
pd_lender:[null],
pd_name:[null],
pd_applicant_id:[null],
});
}
ngOnInit() {
this.recordStatus=false;
// this.loadPDDetails();
this.getcommonDropDown();
}
ngAfterViewInit() {
this.dataSourceTab2.paginator = this.paginator;
@ -61,7 +85,7 @@ export class InprogressPdComponent implements OnInit, OnChanges {
this.progressPdListData = data.records;
this.dataLengthTab2 = data.records.length;
this.dataSourceTab2.data = this.progressPdListData;
this.tempStore.data = this.progressPdListData;
}
else{
this.progressPdListData=[];
@ -82,4 +106,89 @@ export class InprogressPdComponent implements OnInit, OnChanges {
return word[0].toUpperCase() + word.substr(1).toLowerCase();
}
/**
* Common Search
* sriram
*/
getcommonDropDown()
{
this._pd.getAllMasterDatas('PDSTATUS').subscribe(res=>
{
if(res.dataStatus==true)
{
this.pdStatus = res.records.filter(status=>status.isactive==1 && status.pd_status_name == this.tabStatus);
}
// this.searchForm.controls['pd_status'].setValue(this.pdStatus[0]);
});
this._pd.getAllMasterDatas('PDTYPE').subscribe(res=>
{
if(res.dataStatus==true)
{
this.PDType = res.records.filter(type=>type.isactive==1);
}
});
this._pd.getAllMasterDatas('CITY').subscribe(res=>
{
if(res.dataStatus==true)
{
this.CITY = res.records.filter(city=>city.isactive==1);
}
});
this._pd.getAllMasterDatas('ENTITY').subscribe(res=>
{
if(res.dataStatus==true)
{
this.ENTITY = res.records.filter(ent=>ent.isactive==1);
}
});
this._pd.getAllMasterDatas('PRODUCTS').subscribe(res=>
{
if(res.dataStatus==true)
{
this.PRODUCTS = res.records.filter(pro=>pro.isactive==1);
}
});
}
checkDate(e)
{
console.log(e);
}
searchItem()
{
if(this.searchForm.value.pd_type !=null)
{
}else
{
this.searchForm.value.pd_type = [];
}
if(this.searchForm.value.pd_status !=null)
{
}else
{
this.searchForm.value.pd_status = [];
}
this.searchForm.value.pd_from_date = this.pipe.transform(this.searchForm.value.pd_from_date,'yyyy-MM-dd');
this.searchForm.value.pd_to_date = this.pipe.transform(this.searchForm.value.pd_to_date,'yyyy-MM-dd');
this._pd.overAllSearchFormDetails(this.searchForm.value).subscribe(res=>
{
this.xpandStatus = false;
if(res['dataStatus']==true)
{
this.dataSourceTab2 = res['records'];
}else{
// this.notifier.notify('warning', 'No Records Found');
this.dataSourceTab2 = this.tempStore;
}
})
}
}

View File

@ -7,8 +7,8 @@
</mat-form-field>
</div>
<div fxFlex="50" class="pb-0 text-sm-right">
<button mat-fab color="primary" (click)="viewMapPdDetails()" class="mr-1 mb-1" matTooltip="Map view" matTooltipPosition="above"><mat-icon>map</mat-icon></button>
<button mat-fab color="primary" (click)="addPdDetails()" class="mr-1 mb-1" matTooltip="Add PD" matTooltipPosition="above"><mat-icon>add</mat-icon></button>
<button mat-fab (click)="viewMapPdDetails()" class="mr-1 mb-1 hover-icon" matTooltip="Map view" matTooltipPosition="above"><mat-icon>map</mat-icon></button>
<button mat-fab (click)="addPdDetails()" class="mr-1 mb-1 hover-icon" matTooltip="Add PD" matTooltipPosition="above"><mat-icon>add</mat-icon></button>
</div>
</div>
<mat-card>

View File

@ -21,3 +21,7 @@
.mat-tab-label-active{
color: red !important;
}
.mat-fab.mat-accent{
color:red !important;
background-color: #fff !important;
}

View File

@ -1,5 +1,5 @@
<div fxLayout="row">
<div fxLayout="row" [style.minHeight]="'100%'">
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="100" fxFlex.xl="100">
<div *ngIf="!noRecordFound" class="ml-xs mr-xs" style="width: 95%;">
<mat-form-field dividerColor="primary" class="ml-xs mr-xs" style="width: 24%;">
@ -10,7 +10,7 @@
<div>
<div style="text-align:right;position:absolute;z-index:2;right:1px">
<button mat-fab color="primary" matTooltip="Close" matTooltipPosition="above" (click)="goList()"><mat-icon>close</mat-icon></button>
<button mat-fab class="hover-icon" matTooltip="Close" matTooltipPosition="above" (click)="goList()"><mat-icon>close</mat-icon></button>
</div>
<div fxFlex="row">
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="30" fxFlex.lg="30" fxFlex.xl="30">

View File

@ -43,20 +43,35 @@
</div>
</mat-tab>
<mat-tab label="PD Report">
<div>
<div style="text-align: left; margin: 12px;" class="mb-1">
<button mat-raised-button color="primary" *ngIf="generateBtn" (click)="generateNewPDReport()">Generate Report</button>
<button mat-raised-button color="accent" *ngIf="reGenerateBtn" (click)="reGeneratePFReport()">Re-generate Report</button>
</div>
<div *ngIf="reGenerateBtn">
<div style="text-align: right;">
<mat-select style="width: 50%;" placeholder="Select PD Version" >
<mat-option>--</mat-option>
<mat-option *ngFor="let pd of pdReportVersionList" (click)="changeVersion(pd)" >
{{ pd.doc_name }} <span *ngIf="pd.is_latest == 1" [style.color]="'green'">( Current Version )</span>
</mat-option>
</mat-select>
</div>
<mat-card >
<mat-card-content>
<mat-sidenav-container class="app-inner background-none shadow-none mail-db">
<button matTooltip="Menu" matTooltipPosition="above" (click)="mailnav.toggle()" color="primary" fxHide="false" fxshow.gt-sm mat-icon-button mat-raised-button>
<mat-icon style="color: white;">short_text</mat-icon>
</button>
<mat-sidenav #mailnav [mode]="isOver() ? 'over' : 'side'" [opened]="!isOver()" class="mail-sidebar pl-xs pr-xs">
<mat-card style="text-align:center;"> <button mat-raised-button color="red" *ngIf="reGenerateBtn" (click)="reGeneratePFReport()" style="padding: 0 58px !important;">Re-generate Report</button></mat-card>
<button mat-menu-item *ngFor="let pd of pdReportVersionList" [ngClass]="{'active': selectedItem == item}" (click)="changeVersion(pd)" style="font-size: 0.9em !important;height:6% !important;line-height: normal !important;">
{{ pd.doc_name }}<span *ngIf="pd.is_latest == 1" [style.color]="'green'">( Current Version )</span><br>
<span style="color:rgba(117, 115, 115, 0.87)!important;font-size:13px !important;">{{pd.createdby}}</span><br>
<span style="color:rgba(117, 115, 115, 0.87)!important;font-size:13px !important;">{{pd.createdon}}</span>
<hr>
</button>
</mat-sidenav>
<div class="main-content" fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="100" fxFlex.xl="100">
<figure>
<div *ngIf="latestPDDetails">
<div style="margin: 12px;
background: #ddd;
@ -64,16 +79,38 @@
<div style="text-align: right;" class="mb-1">
<button mat-raised-button mat-icon-button class="hover-icon " type="button" matTooltip="Edit" matTooltipPosition="above"
*ngIf="latestPDDetails.is_latest == 1" (click)="addNewQuestion()"><mat-icon>edit</mat-icon></button>
<button mat-stroked-button *ngIf="latestPDDetails.is_latest == 0" (click)="changeDocumentEdit()">Enable Editable</button>
<button mat-stroked-button *ngIf="latestPDDetails.is_latest == 0" (click)="changeDocumentEdit()">Restore</button>
</div>
<div>
<div *ngIf="reGenerateBtn">
<pdf-viewer [src]="latestPDDetails.doc_uri" [original-size]="false" [page]="1">
</pdf-viewer>
</div>
</div>
</div>
</figure>
</div>
</mat-sidenav-container>
</mat-card-content>
</mat-card>
</div>
<div *ngIf="generateBtn">
<div fxLayout="row wrap">
<div class="container" fxLayout fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="10px" fxLayoutGap.xs="0" style="padding: 10%;">
<div fxFlex="100">
<h5 style="text-align:center;color: black;"> {{message}}</h5>
<div style="text-align:center;">
<button mat-raised-button color="primary" *ngIf="generateBtn" (click)="generateNewPDReport()">Generate Report</button>
</div>
</div>
</div>
</div>
</div>
</mat-tab>
</mat-tab-group>
</mat-card-content>

View File

@ -0,0 +1,119 @@
@import "./../../../../../assets/styles/scss/components/messages";
:host {
margin-left: -5px;
margin-right: -5px;
margin-top: -5px;
display: block;
}
:host /deep/ {
mat-sidenav {
width: 267px;
}
.mat-sidenav-content {
padding: 0;
}
@media (min-width: 959px) {
.mat-sidenav-side {
background-color: transparent;
box-shadow: none!important;
}
}
}
.mat-menu-item-active {
color: red !important;
}
.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;
$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);
}
}
}
}
}

View File

@ -32,6 +32,7 @@ export class PdReportComponent implements OnInit {
// public src;
pdReportRecords:any;
latestPDDetails: any;
message:any;
private notifier: NotifierService;
constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute,
@ -52,6 +53,36 @@ export class PdReportComponent implements OnInit {
this.listPDComponent.showListView(false);
this.getPdReportDetails();
this.getPdReportVersionList();
// start
// end
const elemSidebar = <HTMLElement>document.querySelector('.app-inner .mail-sidebar');
const elemContent = <HTMLElement>document.querySelector('.app-inner .main-content');
if (window.matchMedia(`(min-width: 1560px)`).matches && !this.isMac()) {
// Ps.initialize(elemSidebar, { wheelSpeed: 2, suppressScrollX: true });
// Ps.initialize(elemContent, { wheelSpeed: 2, suppressScrollX: true });
}
// this.loadTemplates(this.startPD);
// this.next = 1;
// this.previous = 2;
}
isMac(): boolean {
let bool = false;
if (navigator.platform.toUpperCase().indexOf('MAC') >= 0 || navigator.platform.toUpperCase().indexOf('IPAD') >= 0) {
bool = true;
}
return bool;
}
isOver(): boolean {
return window.matchMedia(`(max-width: 1560px)`).matches;
}
reGeneratePFReport(){
@ -97,6 +128,7 @@ export class PdReportComponent implements OnInit {
} else {
// this.reGenerateBtn = true;
this.generateBtn = true;
this.message= data.msg;
}
}, err=> {
@ -139,6 +171,7 @@ export class PdReportComponent implements OnInit {
changeVersion(pd : any): void {
this.latestPDDetails = pd;
console.log(this.latestPDDetails);
}
changeDocumentEdit() : void{

View File

@ -1,4 +1,64 @@
<mat-card-content>
<mat-expansion-panel [(expanded)]="xpandStatus">
<mat-expansion-panel-header>
<mat-panel-title class="text-xs-left">
<h6 class="mt-0"><mat-icon>filter_list</mat-icon> Filter</h6>
</mat-panel-title>
</mat-expansion-panel-header>
<mat-list class="m-gap p-gap">
<div [formGroup]="searchForm">
<mat-form-field style="width:40%">
<mat-select multiple formControlName="pd_type" placeholder="PD Type">
<mat-option *ngFor="let type of PDType" [value]="type.pd_type_id">{{type.type_name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:40%">
<mat-select multiple formControlName="pd_status" placeholder="PD Status">
<mat-option *ngFor="let status of pdStatus" [value]="status.pd_status_name">{{status.pd_status_name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:40%">
<input matInput [matDatepicker]="picker" (blur)="checkDate($event)" formControlName="pd_from_date" placeholder="Choose a From date">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field>&nbsp; &nbsp;
<mat-form-field style="width:40%">
<input matInput [matDatepicker]="picker1" [min]="searchForm.get('pd_from_date').value"formControlName="pd_to_date" placeholder="Choose a todate">
<mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
<mat-datepicker #picker1></mat-datepicker>
</mat-form-field>
<mat-form-field style="width:25%">
<mat-select multiple formControlName="pd_products" placeholder="Products">
<mat-option *ngFor="let pro of PRODUCTS" [value]="pro.product_id">{{pro.name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:25%">
<mat-select multiple formControlName="pd_city" placeholder="City">
<mat-option *ngFor="let city of CITY" [value]="city.city_id">{{city.name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:25%">
<mat-select multiple formControlName="pd_lender" placeholder="Lender Name">
<mat-option *ngFor="let ent of ENTITY" [value]="ent.entity_id">{{ent.full_name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:40%">
<input matInput type="text" formControlName="pd_name" placeholder="Applicant Name">
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:40%">
<input matInput type="text" formControlName="pd_applicant_id" placeholder="Applicant Id">
</mat-form-field>
<br/>
<button type="button" mat-raised-button mat-icon-button (click)="searchItem()"
matTooltip="Add More Additional Requirements" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary" type="button">
<mat-icon>search</mat-icon>
</button>
</div>
</mat-list>
</mat-expansion-panel>
<br/>
<mat-table [dataSource]="dataSourceTab5" matSort *ngIf="qcCompletedPdListData.length > 0" >
<ng-container matColumnDef="PDType">
<mat-cell fxFlex="15" class="cell" style="text-align: center" *matCellDef="let details;">

View File

@ -1,6 +1,8 @@
import { Component,ViewChild, OnInit, ViewEncapsulation, Input, Output, EventEmitter, OnDestroy, AfterViewInit, OnChanges, SimpleChanges } from '@angular/core';
import { Component, ViewChild, OnInit, ViewEncapsulation, Input, Output, EventEmitter, OnDestroy, AfterViewInit, OnChanges, SimpleChanges } from '@angular/core';
import { PdTrigerService } from './../../../pd-service/pd-triger.service';
import { MatPaginator, MatSort, MatTableDataSource, PageEvent } from '@angular/material';
import { FormBuilder, FormGroup } from '@angular/forms';
import { DatePipe } from '@angular/common';
@Component({
selector: 'app-qc-completed-pd',
@ -11,12 +13,22 @@ import { MatPaginator, MatSort, MatTableDataSource, PageEvent } from '@angular/m
})
export class QcCompletedPdComponent implements OnInit, OnChanges {
xpandStatus: boolean = false;
PRODUCTS: any;
ENTITY: any;
CITY: any;
PDType: any;
pdStatus: any;
recordStatus: boolean;
errorMessage:any[]=[];
tabStatus:string="QC_COMPLETED";
errorMessage: any[] = [];
tabStatus: string = "QC_COMPLETED";
pipe = new DatePipe('en-US');
public dataLengthTab5: number;
public dataSourceTab5 = new MatTableDataSource();
displayedColumns = ['PDType','Name','Lenderid','Address','Status','Action'];
tempStore = new MatTableDataSource();
searchForm: FormGroup;
displayedColumns = ['PDType', 'Name', 'Lenderid', 'Address', 'Status', 'Action'];
@ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
@ -25,7 +37,7 @@ export class QcCompletedPdComponent implements OnInit, OnChanges {
@Output() loadPdView = new EventEmitter<string>();
// data source variable details
qcCompletedPdListData:any[] = [];
qcCompletedPdListData: any[] = [];
// pagination variable details
length = 50;
@ -33,12 +45,26 @@ export class QcCompletedPdComponent implements OnInit, OnChanges {
pageSize = 10;
pageEvent: PageEvent;
constructor(private _pd: PdTrigerService) {
constructor(private _pd: PdTrigerService, public _fb: FormBuilder) {
this.searchForm = this._fb.group(
{
pd_type: [null],
pd_status: [null],
pd_from_date: [null],
pd_to_date: [null],
pd_city: [null],
pd_products: [null],
pd_lender: [null],
pd_name: [null],
pd_applicant_id: [null],
});
}
ngOnInit() {
this.recordStatus=false;
this.recordStatus = false;
// this.loadPDDetails();
this.getcommonDropDown();
}
ngAfterViewInit() {
this.dataSourceTab5.paginator = this.paginator;
@ -51,9 +77,9 @@ export class QcCompletedPdComponent implements OnInit, OnChanges {
filteredText = filteredText ? filteredText.trim() : filteredText;
filteredText = filteredText ? filteredText.toLowerCase() : filteredText;
this.dataSourceTab5.filter = filteredText;
}
}
// load inprogress pd list
// load inprogress pd list
loadPDDetails() {
this._pd.getTabStatusPdDetails(this.tabStatus)
@ -63,27 +89,93 @@ export class QcCompletedPdComponent implements OnInit, OnChanges {
this.qcCompletedPdListData = data.records;
this.dataLengthTab5 = data.records.length;
this.dataSourceTab5.data = this.qcCompletedPdListData;
this.tempStore.data = this.qcCompletedPdListData;
}
else{
this.qcCompletedPdListData=[];
this.dataLengthTab5= null;
this.recordStatus=true;
else {
this.qcCompletedPdListData = [];
this.dataLengthTab5 = null;
this.recordStatus = true;
}
}, error => this.errorMessage = <any> error);
}, error => this.errorMessage = <any>error);
}
pageChange(e) {
console.log(e);
}
viewPD(pdid:string){
viewPD(pdid: string) {
this.loadPdView.next(pdid);
}
titleCaseWord(word:string) {
titleCaseWord(word: string) {
if (!word) return word;
return word[0].toUpperCase() + word.substr(1).toLowerCase();
}
/**
* Common Search
* sriram
*/
getcommonDropDown() {
this._pd.getAllMasterDatas('PDSTATUS').subscribe(res => {
if (res.dataStatus == true) {
this.pdStatus = res.records.filter(status => status.isactive == 1 && status.pd_status_name == this.tabStatus);
// this.searchForm.controls['pd_status'].setValue(this.pdStatus[0]);
}
});
this._pd.getAllMasterDatas('PDTYPE').subscribe(res => {
if (res.dataStatus == true) {
this.PDType = res.records.filter(type => type.isactive == 1);
}
});
this._pd.getAllMasterDatas('CITY').subscribe(res => {
if (res.dataStatus == true) {
this.CITY = res.records.filter(city => city.isactive == 1);
}
});
this._pd.getAllMasterDatas('ENTITY').subscribe(res => {
if (res.dataStatus == true) {
this.ENTITY = res.records.filter(ent => ent.isactive == 1);
}
});
this._pd.getAllMasterDatas('PRODUCTS').subscribe(res => {
if (res.dataStatus == true) {
this.PRODUCTS = res.records.filter(pro => pro.isactive == 1);
}
});
}
checkDate(e) {
console.log(e);
}
searchItem() {
if (this.searchForm.value.pd_type != null) {
} else {
this.searchForm.value.pd_type = [];
}
if (this.searchForm.value.pd_status != null) {
} else {
this.searchForm.value.pd_status = [];
}
this.searchForm.value.pd_from_date = this.pipe.transform(this.searchForm.value.pd_from_date, 'yyyy-MM-dd');
this.searchForm.value.pd_to_date = this.pipe.transform(this.searchForm.value.pd_to_date, 'yyyy-MM-dd');
this._pd.overAllSearchFormDetails(this.searchForm.value).subscribe(res => {
this.xpandStatus = false;
if (res['dataStatus'] == true) {
this.dataSourceTab5 = res['records'];
} else {
console.log('else');
// this.notifier.notify('warning', 'No Records Found');
this.dataSourceTab5 = this.tempStore;
}
})
}
}

View File

@ -1,4 +1,64 @@
<mat-card-content>
<mat-expansion-panel [(expanded)]="xpandStatus">
<mat-expansion-panel-header>
<mat-panel-title class="text-xs-left">
<h6 class="mt-0"><mat-icon>filter_list</mat-icon> Filter</h6>
</mat-panel-title>
</mat-expansion-panel-header>
<mat-list class="m-gap p-gap">
<div [formGroup]="searchForm">
<mat-form-field style="width:40%">
<mat-select multiple formControlName="pd_type" placeholder="PD Type">
<mat-option *ngFor="let type of PDType" [value]="type.pd_type_id">{{type.type_name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:40%">
<mat-select multiple formControlName="pd_status" placeholder="PD Status">
<mat-option *ngFor="let status of pdStatus" [value]="status.pd_status_name">{{status.pd_status_name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:40%">
<input matInput [matDatepicker]="picker" (blur)="checkDate($event)" formControlName="pd_from_date" placeholder="Choose a From date">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:40%">
<input matInput [matDatepicker]="picker1" [min]="searchForm.get('pd_from_date').value"formControlName="pd_to_date" placeholder="Choose a todate">
<mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
<mat-datepicker #picker1></mat-datepicker>
</mat-form-field>
<mat-form-field style="width:25%">
<mat-select multiple formControlName="pd_products" placeholder="Products">
<mat-option *ngFor="let pro of PRODUCTS" [value]="pro.product_id">{{pro.name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:25%">
<mat-select multiple formControlName="pd_city" placeholder="City">
<mat-option *ngFor="let city of CITY" [value]="city.city_id">{{city.name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:25%">
<mat-select multiple formControlName="pd_lender" placeholder="Lender Name">
<mat-option *ngFor="let ent of ENTITY" [value]="ent.entity_id">{{ent.full_name}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:40%">
<input matInput type="text" formControlName="pd_name" placeholder="Applicant Name">
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:40%">
<input matInput type="text" formControlName="pd_applicant_id" placeholder="Applicant Id">
</mat-form-field>
<br/>
<button type="button" mat-raised-button mat-icon-button (click)="searchItem()"
matTooltip="Add More Additional Requirements" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" color="primary" type="button">
<mat-icon>search</mat-icon>
</button>
</div>
</mat-list>
</mat-expansion-panel>
<br/>
<mat-table [dataSource]="dataSourceTab3" matSort *ngIf="scheduledPdListData.length > 0" >
<ng-container matColumnDef="PDType">
<mat-cell fxFlex="15" class="cell" style="text-align: center" *matCellDef="let details;">

View File

@ -1,6 +1,8 @@
import { Component,ViewChild, OnInit, ViewEncapsulation, Input, Output, EventEmitter, OnDestroy, AfterViewInit, OnChanges, SimpleChanges } from '@angular/core';
import { PdTrigerService } from './../../../pd-service/pd-triger.service';
import { MatPaginator, MatSort, MatTableDataSource, PageEvent } from '@angular/material';
import { FormBuilder, FormGroup } from '@angular/forms';
import { DatePipe } from '@angular/common';
@Component({
selector: 'app-scheduled-pd',
@ -9,11 +11,20 @@ import { MatPaginator, MatSort, MatTableDataSource, PageEvent } from '@angular/m
encapsulation: ViewEncapsulation.None
})
export class ScheduledPdComponent implements OnInit, OnChanges {
xpandStatus: boolean = false;
PRODUCTS: any;
ENTITY: any;
CITY: any;
PDType: any;
pdStatus: any;
recordStatus: boolean;
errorMessage:any[]=[];
tabStatus:string="SCHEDULED";
pipe = new DatePipe('en-US');
searchForm:FormGroup;
public dataLengthTab3: number;
public dataSourceTab3 = new MatTableDataSource();
tempStore = new MatTableDataSource();
displayedColumns = ['PDType','Name','Lenderid','Address','Status','Action'];
@ViewChild(MatPaginator) paginator: MatPaginator;
@ -31,12 +42,26 @@ export class ScheduledPdComponent implements OnInit, OnChanges {
pageSize = 10;
pageEvent: PageEvent;
constructor(private _pd: PdTrigerService) {
constructor(private _pd: PdTrigerService,public _fb:FormBuilder) {
this.searchForm = this._fb.group(
{
pd_type:[null],
pd_status:[null],
pd_from_date:[null],
pd_to_date:[null],
pd_city:[null],
pd_products:[null],
pd_lender:[null],
pd_name:[null],
pd_applicant_id:[null],
});
}
ngOnInit() {
this.recordStatus=false;
// this.loadPDDetails();
this.getcommonDropDown();
}
ngAfterViewInit() {
this.dataSourceTab3.paginator = this.paginator;
@ -61,6 +86,7 @@ export class ScheduledPdComponent implements OnInit, OnChanges {
this.scheduledPdListData = data.records;
this.dataLengthTab3 = data.records.length;
this.dataSourceTab3.data = this.scheduledPdListData;
this.tempStore.data = this.scheduledPdListData
}
else{
@ -81,7 +107,89 @@ export class ScheduledPdComponent implements OnInit, OnChanges {
if (!word) return word;
return word[0].toUpperCase() + word.substr(1).toLowerCase();
}
/**
* Common Search
* sriram
*/
getcommonDropDown()
{
this._pd.getAllMasterDatas('PDSTATUS').subscribe(res=>
{
if(res.dataStatus==true)
{
this.pdStatus = res.records.filter(status=>status.isactive==1 && status.pd_status_name==this.tabStatus);
// this.searchForm.controls['pd_status'].setValue(this.pdStatus[0]);
}
});
this._pd.getAllMasterDatas('PDTYPE').subscribe(res=>
{
if(res.dataStatus==true)
{
this.PDType = res.records.filter(type=>type.isactive==1);
}
});
this._pd.getAllMasterDatas('CITY').subscribe(res=>
{
if(res.dataStatus==true)
{
this.CITY = res.records.filter(city=>city.isactive==1);
}
});
this._pd.getAllMasterDatas('ENTITY').subscribe(res=>
{
if(res.dataStatus==true)
{
this.ENTITY = res.records.filter(ent=>ent.isactive==1);
}
});
this._pd.getAllMasterDatas('PRODUCTS').subscribe(res=>
{
if(res.dataStatus==true)
{
this.PRODUCTS = res.records.filter(pro=>pro.isactive==1);
}
});
}
checkDate(e)
{
console.log(e);
}
searchItem()
{
if(this.searchForm.value.pd_type !=null)
{
}else
{
this.searchForm.value.pd_type = [];
}
if(this.searchForm.value.pd_status !=null)
{
}else
{
this.searchForm.value.pd_status = [];
}
this.searchForm.value.pd_from_date = this.pipe.transform(this.searchForm.value.pd_from_date,'yyyy-MM-dd');
this.searchForm.value.pd_to_date = this.pipe.transform(this.searchForm.value.pd_to_date,'yyyy-MM-dd');
this._pd.overAllSearchFormDetails(this.searchForm.value).subscribe(res=>
{
this.xpandStatus = false;
if(res['dataStatus']==true)
{
this.dataSourceTab3 = res['records'];
}else{
// this.notifier.notify('warning', 'No Records Found');
this.dataSourceTab3 = this.tempStore;
}
})
}
}

View File

@ -22,7 +22,7 @@
<mat-form-field>
<!-- <input matInput placeholder="Name" formControlName="name_ans" type="text" required> -->
<input matInput placeholder="Address" formControlName="address" required>
<input matInput placeholder="Address" formControlName="address" required autocomplete="off">
</mat-form-field>
@ -35,7 +35,7 @@
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls['address_type'].value == 12">
<input matInput placeholder="Address Type Others" formControlName="address_type_others">
<input matInput placeholder="Address Type Others" formControlName="address_type_others" autocomplete="off">
</mat-form-field>
<mat-form-field>
@ -48,7 +48,7 @@
<mat-form-field *ngIf="addressForm.controls.locality.value == 'Others'">
<input matInput placeholder="Specify Locality"
formControlName="locality_others">
formControlName="locality_others" autocomplete="off">
</mat-form-field>
<mat-form-field style="width: 30%">
@ -87,11 +87,11 @@
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls['address_ownership'].value == 4 " style="width: 38%">
<input matInput placeholder="Specify Other Ownership" formControlName="other_ownership">
<input matInput placeholder="Specify Other Ownership" formControlName="other_ownership" autocomplete="off">
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls['address_ownership'].value == 3 " style="width: 38%">
<input matInput placeholder="What is the monthly rent paid?" formControlName="rent_amt">
<input matInput placeholder="What is the monthly rent paid?" formControlName="rent_amt" autocomplete="off">
</mat-form-field>
<mat-form-field style="width: 42%">
@ -102,35 +102,39 @@
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls['bussiness_activity'].value == 'yes'" style="width: 100%">
<!-- <mat-form-field *ngIf="addressForm.controls['bussiness_activity'].value == 'yes'" style="width: 100%"> -->
<!-- <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-select placeholder="Type of Premises" formControlName="bussiness_address_type" multiple>
<!-- <mat-select placeholder="Type of Premises" formControlName="bussiness_address_type" multiple>
<mat-option *ngFor="let m_addressType of addressData" [value]="m_addressType.address_type_id" (onSelectionChange)="SelectedPremises($event)" > {{m_addressType.address_type}} </mat-option>
</mat-select>
</mat-form-field>
</mat-form-field> -->
<p>Type of Premises</p>
<div fxLayout="row wrap" class="example-section" *ngIf="addressForm.controls['bussiness_activity'].value == 'yes'">
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25" *ngFor="let at of addressData;let i = index;"> <!---- [formGroupName]="i"> -->
<mat-checkbox class="example-margin" color="primary" [value]="at.address_type_id" (change)="SelectedPremises($event)" [checked]="at.status==1 ? true:false">{{at.address_type}}</mat-checkbox>
</div>
</div>
<mat-form-field *ngIf="PremisesOtherFlag == true" style="width: 40%">
<input matInput placeholder="Specify Other Premises Type" formControlName="bussiness_address_type_others">
<input matInput placeholder="Specify Other Premises Type" formControlName="bussiness_address_type_others" (change)="otherValueset()" autocomplete="off">
</mat-form-field>
<mat-card formArrayName="premises">
<span formArrayName="additional_premises">
<div
*ngFor="let item of addressForm.controls.premises['controls']; let i = index;" [formGroupName]="i">
*ngFor="let item of addressForm.controls.additional_premises['controls']; let i = index;" [formGroupName]="i">
<p>{{i+1}} . {{PremisesLabel[i]}}</p>
<mat-card-header>
<mat-card-title>{{i+1}} . {{PremisesLabel[i]}}</mat-card-title>
</mat-card-header>
<mat-card-content>
<mat-form-field style="width: 40%;">
<input matInput placeholder="Number Of Additional Units"
formControlName="no_of_additional_units">
formControlName="no_of_additional_units" autocomplete="off">
</mat-form-field>
<mat-form-field *ngIf="item.get('no_of_additional_units').value > 2" style="width: 40%;">
<mat-select placeholder="City" formControlName="premises_city"> <!--multiple (selectionChange)="relationChanged($event)"> -->
<mat-select placeholder="City" formControlName="premises_city" multiple > <!-- (selectionChange)="relationChanged($event)"> -->
<mat-option *ngFor="let CL of cityData" [value]="CL.city_id">
{{CL.name}}
</mat-option>
@ -148,18 +152,17 @@
<!-- <mat-form-field *ngIf="addressForm.controls['premises_ownership'].value == 4 "> -->
<mat-form-field *ngIf="item.get('premises_ownership').value == 4" style="width: 40%;">
<input matInput placeholder="Specify Other Ownership" formControlName="premises_ownership_others">
<input matInput placeholder="Specify Other Ownership" formControlName="premises_ownership_others" autocomplete="off">
</mat-form-field>
<mat-form-field *ngIf="item.get('premises_ownership').value == 3" style="width: 40%;">
<input matInput placeholder="What is the monthly rent paid?" formControlName="premises_rent_amt">
<input matInput placeholder="What is the monthly rent paid?" formControlName="premises_rent_amt" autocomplete="off">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Remarks"
formControlName="premises_remarks" style="width: 65%;">
formControlName="premises_remarks" style="width: 65%;" autocomplete="off">
</mat-form-field>
</mat-card-content>
</div>
</mat-card>
</span>
<!--- Don't Remove To replace atlast of the PD Completion and creating new form (Neighbourhood check) --
<mat-card>
<mat-card-header>
@ -236,110 +239,95 @@
<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 fxLayout="row wrap" style="padding:20px;">
<div fxFlex="100">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
<div fxFlex="row">
<div fxFlex="100" class="m-gap p-gap">
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
</div>
</div>
</div>
</ng-template>

View File

@ -50,12 +50,13 @@ export class AddressComponent implements OnInit {
ownerShipData:any = [];
cityData:any = [];
z = 0;
formPremisesArray: any = [];
relativeNames2: any = [];
formPremisesCityArray: any = [];
additional_premises: any=[];
bussiness_address_type: any=[];
tempArr: any[];
//neighbourStatusData:any=["Yes","No"];
//applicantOwnerData:any=["Yes","No","Dont Know"];
@ -96,13 +97,15 @@ export class AddressComponent implements OnInit {
this.getMasterDetails('RESIDENCEOWNERSHIP',6);
this.getMasterDetails('CITY',7);
this.initAddressForm();
let params: any = {};
params.pd_id = this.pdid;
params.pd_form_id = '5';
this._pd.retriveForm(params).subscribe(data => {
console.log('data', data);
//const control = <FormArray>this.addressForm.controls['neighbourhood'];
const control = <FormArray>this.addressForm.controls['premises'];
const additionalPremisesControl = <FormArray>this.addressForm.controls['additional_premises'];
if(data.status == 200) {
// var result = Object.keys(data.records.neighbourhood).map(function (key) {
// return data.records.neighbourhood[key];
@ -111,6 +114,7 @@ export class AddressComponent implements OnInit {
this.addressForm.controls.address.setValue(data.records.address);
this.addressForm.controls.pd_location.setValue(data.records.pd_location);
this.addressForm.controls.address_type.setValue(data.records.address_type);
if(data.records.address_type == 12) {
this.addressForm.controls.address_type_others.setValue(data.records.address_type_others);
}
@ -122,44 +126,79 @@ export class AddressComponent implements OnInit {
this.addressForm.controls.other_ownership.setValue(data.records.other_ownership);
this.addressForm.controls.rent_amt.setValue(data.records.rent_amt);
this.addressForm.controls.bussiness_activity.setValue(data.records.bussiness_activity);
if(data.records.bussiness_activity == 'yes') {
let selectedMembers = Object.keys(data.records.bussiness_address_type).map(function (key) {
return data.records.bussiness_address_type[key];
});
let enduse: any = [];
let existPremises: any =[];
// if(data.records.bussiness_activity == 'yes') {
selectedMembers.forEach(val => {
enduse.push(val.premises);
existPremises.push(val);
});
// this.bussiness_address_type = [];
this.formPremisesArray = existPremises;
// this.bussiness_address_type = (Object.keys(data.records.bussiness_address_type).map(function(key)
// {
// return data.records.bussiness_address_type[key].premises_types;
// }))
this.addressForm.controls.bussiness_address_type.setValue(enduse);
// // console.log(bussiness_address_type);
var result = Object.keys(data.records.premises).map(function (key) {
return data.records.premises[key];
});
if (result.length == 0) {
control.push(this.createPremises());
} else {
result.forEach(datas => {
control.push(this.createPremises());
});
// let selectedPremisesDBData = Object.keys(data.records.bussiness_address_type).map(function (key) {
// return data.records.bussiness_address_type[key];
// });
// let enduse: any = [];
// let existPremises: any =[];
// selectedPremisesDBData.forEach(val => {
// enduse.push(val.premises_types);
// existPremises.push(val);
// });
// this.formPremisesArray = existPremises;
// this.addressForm.controls.bussiness_address_type.setValue(enduse);
// var additionalPremisesResult = Object.keys(data.records.additional_premises).map(function (key) {
// return data.records.additional_premises[key];
// });
// this.additional_premises = additionalPremisesResult;
// if (additionalPremisesResult.length == 0) {
// additionalPremisesControl.push(this.createPremises());
// } else {
// additionalPremisesResult.forEach(datas => {
// additionalPremisesControl.push(this.createPremises());
// });
// }
// if(data.records.bussiness_address_type == 12) {
// this.addressForm.controls.bussiness_address_type_others.setValue(data.records.bussiness_address_type_others);
// }
// }
if(data.records.bussiness_activity == 'yes' && data.records.bussiness_address_type !=null) {
let that = this;
this.bussiness_address_type = [];
this.bussiness_address_type = (Object.keys(data.records.bussiness_address_type).map(function(key)
{
return data.records.bussiness_address_type[key].premises_types;
}))
this.additional_premises = Object.keys(data.records.additional_premises).map(function(key)
{
return data.records.additional_premises[key];
})
}
console.log(this.bussiness_address_type);
console.log(this.additional_premises);
this.addressForm.controls['premises'].setValue(result);
if(data.records.bussiness_address_type == 12) {
this.addressForm.controls.bussiness_address_type_others.setValue(data.records.bussiness_address_type_others);
}
}
this.selectedValue(this.bussiness_address_type,this.additional_premises);
if (data.records.locality_others) {
this.addressForm.controls.locality_others.setValue(data.records.locality_others);
}
// if (result.length == 0) {
// control.push(this.createNeighbour());
// } else {
@ -173,6 +212,7 @@ export class AddressComponent implements OnInit {
}
});
}
public initAddressForm(): void {
this.addressForm = this.fb.group({
address: ['', Validators.compose([Validators.required])],
@ -191,7 +231,7 @@ export class AddressComponent implements OnInit {
bussiness_activity:[''],
bussiness_address_type:[''],
bussiness_address_type_others: [''],
premises: this.fb.array([])
additional_premises: this.fb.array([])
});
this.address = this.addressForm.controls['address'];
this.addressType = this.addressForm.controls['address_type'];
@ -251,6 +291,25 @@ export class AddressComponent implements OnInit {
})
});
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
/*221118 review doc s.no 3.f
addNeighbour() {
const control = <FormArray>this.addressForm.controls['neighbourhood'];
@ -297,37 +356,54 @@ export class AddressComponent implements OnInit {
records.bussiness_address_type_others = this.addressForm.controls.bussiness_address_type_others.value;
}
}
this.addressForm.controls.additional_premises.value.forEach((val,index)=>
{
console.log(val);
records.premises = this.addressForm.controls.premises.value;
if(val.premises_city != ''){
this.formPremisesCityArray = [];
val.premises_city.forEach(option => {
this.formPremisesCityArray.push({additional_premises_city: option});
this.addressForm.controls.additional_premises.value[index].premises_city = this.formPremisesCityArray;
// console.log(val);
});
}
else{
this.formPremisesCityArray = [];
console.log(this.addressForm.controls.premises.value);
this.addressForm.controls.additional_premises.value[index].premises_city = null;
}
});
records.additional_premises = this.addressForm.controls.additional_premises.value;
// console.log(this.formPremisesCityArray);
// console.log(this.addressForm.controls.premises.value);
records.pdid = this.pdid;
records.formid = '5';
// records.fk_createdby = '250';
console.log('params', records);
this._pd.saveForm(records).subscribe(data => {
console.log('data', data);
this.notifier.notify('success', 'Saved Successfully.');
}, error => {
this.notifier.notify('warning', 'Something Wents Wrong Try Again.!');
});
}
relationChanged(event) {
this.relativeNames2 = [];
event.value.forEach(option => {
this.relativeNames2.push({city: option});
});
}
// relationChanged(event) {
// this.formPremisesCityArray = [];
// event.value.forEach(option => {
// this.formPremisesCityArray.push({city: option});
// });
// }
SelectedPremises($event){
let premisesData = $event.source.value;
console.log(premisesData);
if($event.source._selected === true ){
if($event.checked === true ){
//this.formPremisesArray.push({member: $event.source.value});
//this.selectedSegmentDatas.push(CustomerSegmentName.name);
@ -335,46 +411,183 @@ export class AddressComponent implements OnInit {
//console.log(this.formPremisesArray);
this.formPremisesArray.push({premises: $event.source.value});
//console.log(this.formPremisesArray);
let array = this.addressData.filter(data => data.address_type_id == premisesData);
this.formPremisesArray.push({premises_types: $event.source.value});
console.log(this.formPremisesArray);
const control = <FormArray>this.addressForm.controls['additional_premises'];
let array = this.addressData.filter(data => data.address_type_id == premisesData)[0];
console.log(array);
if(premisesData == 12){
this.PremisesOtherFlag = true;
this.PremisesLabel[this.z] = this.addressForm.get('bussiness_address_type_others').value;
// this.PremisesLabel[this.z] = this.pdQuestionAddress.get('bussiness_address_type_others').value;
control.push(this.createPremises());
}
else{
this.PremisesLabel[this.z] = array[0].address_type;
this.PremisesLabel[this.z] = array.address_type;
control.push(this.createPremises());
}
console.log(this.PremisesLabel);
this.z++;
const control = <FormArray>this.addressForm.controls['premises'];
control.push(this.createPremises());
}
else if($event.source._selected === false ){
console.log('false',premisesData);
else if($event.checked === false ){
if(premisesData == 12){
this.PremisesOtherFlag = false;
}
const control = <FormArray>this.addressForm.controls['neighbourhood'];
control.removeAt(this.z);
console.log(this.formPremisesArray);
let index = this.formPremisesArray.findIndex(form=>form.premises_types== $event.source.value);
console.log(index);
const control = <FormArray>this.addressForm.controls['additional_premises'];
control.removeAt(index);
this.PremisesLabel.splice(index,1);
console.log(this.z);
this.z--;
//let index = this.selectedSegmentDatas.indexOf(CustomerSegmentName.name);
//this.selectedSegmentDatas.splice(index,1);
}
}
getCity(e)
{
this.cityData = [];
e.forEach(val=>
{
this.cityData.push({additional_premises_city:val});
});
console.log(this.cityData);
}
otherValueset()
{
let z = this.z;
this.PremisesLabel[z-1] = this.addressForm.get('bussiness_address_type_others').value;
}
// checkaddress(value)
// {
// // console.log(value);
// if(value=="OTHERS")
// {
// this.addressRemarksAccess = true;
// }else
// {
// this.addressRemarksAccess = false;
// }
// }
// SelectedPremises($event){
// console.log('event',$event);
// let premisesData = $event.source.value;
// if($event.source._selected === true ){
// //this.formPremisesArray.push({member: $event.source.value});
// //this.selectedSegmentDatas.push(CustomerSegmentName.name);
// //console.log('true',premisesData);
// //console.log(this.formPremisesArray);
// this.formPremisesArray.push({premises_types: $event.source.value});
// //console.log(this.formPremisesArray);
// let array = this.addressData.filter(data => data.address_type_id == premisesData);
// if(premisesData == 12){
// this.PremisesOtherFlag = true;
// this.PremisesLabel[this.z] = this.addressForm.get('bussiness_address_type_others').value;
// }
// else{
// this.PremisesLabel[this.z] = array[0].address_type;
// }
// this.z++;
// const control = <FormArray>this.addressForm.controls['additional_premises'];
// control.push(this.createPremises());
// }
// else if($event.source._selected === false ){
// console.log('false',premisesData);
// if(premisesData == 12){
// this.PremisesOtherFlag = false;
// }
// const control = <FormArray>this.addressForm.controls['additional_premises'];
// control.removeAt(this.z);
// this.z--;
// //let index = this.selectedSegmentDatas.indexOf(CustomerSegmentName.name);
// //this.selectedSegmentDatas.splice(index,1);
// }
// }
selectedValue(e,data)
{
console.log('501 function',);
console.log('inside function in bussiness_address_type,',e);
console.log('inside function in this.additional_premises,',data);
let premisesData = e ;
this.tempArr = [];
let that = this;
this.addressData = Object.keys(this.addressData).map(function(key)
{
that.addressData[key].status = 0;
return that.addressData[key];
})
console.log(this.addressData);
premisesData.forEach((val,index)=>
{
console.log(val);
this.z++;
// console.log(this.addressTypes);
this.formPremisesArray.push({premises_types: val});
this.tempArr.push(this.addressData.filter(add=>add.address_type_id==val)[0]);
this.PremisesLabel[index] = this.tempArr[index].address_type;
if(data[index] !==undefined && data[index].premises_ownership < 2 ){
data[index].premises_city = Object.keys(data[index].premises_city).map(function(key)
{
return data[index].premises_city[key].additional_premises_city;
});
}
this.addressData.forEach(data=>
{
if(data.address_type_id == val)
{
data.status = 1;
}
});
});
const control = <FormArray>this.addressForm.controls['additional_premises'] as FormArray;
// control.removeAt(0);
this.tempArr.forEach((item,index)=>
{
control.push(this.createPremises());
});
this.addressForm.controls['additional_premises'].setValue(data);
}
validateAllFormFields(formGroup: FormGroup) {
Object.keys(formGroup.controls).forEach(field => {
const control = formGroup.get(field);

View File

@ -280,112 +280,98 @@
</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 ngxViewer>
<div fxLayout="row wrap" style="padding:20px;">
<div fxFlex="100">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
</div>
</div>
</div>
<div fxFlex="row">
<div fxFlex="100" class="m-gap p-gap">
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
</div>
</div>
</div>
</div>
</ng-template>
</mat-tab>

View File

@ -48,6 +48,9 @@ tr.mat-footer-row {
mat-form-field {
margin: 0 2%;
}
::ng-deep .cdk-global-overlay-wrapper{
justify-content: center !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);
.p-list-main {

View File

@ -53,7 +53,25 @@ salesMonthWiseExpandedItems: any=[]
this.notifier = notifier;
this.form_id = 16;
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
ngOnInit() {
this.initAssessedIncomeForm();

View File

@ -14,7 +14,307 @@
<mat-tab-group>
<mat-tab label="Questions">
<mat-tab label="Business Asset Questions">
<ng-template matTabContent>
<div fxLayout="row wrap">
<div fxFlex="100">
<mat-card style="min-height: 550px;">
<mat-card-content>
<div fxLayout="row" fxLayoutAlign="start none">
<div formArrayName="business_assets_details" fxFill>
<div *ngFor="let sup of _assetsQuesFrom.controls.business_assets_details['controls']; let i=index">
<mat-card>
<mat-card-content>
<div [formGroupName]="i">
<div fxLayout="row wrap" fxLayoutGap="5px" fxLayoutAlign="start none">
<mat-form-field style="width:100%">
<mat-select (selectionChange)="selectedAssetsType($event, i,2)" placeholder="Assets Type" formControlName="business_assets_mode" requried>
<mat-option *ngFor="let asset of m_assets_type" [value]="asset.id">{{ asset.name }}</mat-option>
</mat-select>
</mat-form-field>
</div>
<!--Desction Dynamic details: START-->
<div formArrayName="business_details" class="example-full-width">
<!--Property-->
<div *ngIf="sup.get('business_assets_mode').value == 1 ">
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<div *ngFor="let detail of sup['controls'].business_details['controls']; let s = index">
<div [formGroupName]="s">
<div>
<mat-form-field style="width:100%">
<mat-select placeholder="Property Type" formControlName="property_type" required>
<mat-option *ngFor="let prop of m_propertyType" [value]="prop.id">{{ prop.name }}</mat-option>
</mat-select>
</mat-form-field>
</div>
<div>
<mat-form-field *ngIf="detail.get('property_type').value == 5">
<input matInput placeholder="Other Property Type" formControlName="other_property_type" autocomplete="off">
</mat-form-field>
</div>
</div>
</div>
</div>
</div>
<!--Four Wheeler-->
<div *ngIf="sup.get('business_assets_mode').value == 2">
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<div *ngFor="let detail of sup['controls'].business_details['controls']; let s = index">
<div [formGroupName]="s">
<div>
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Manufacturer, Model" formControlName="manufacturer_model_four_weeler" required autocomplete="off">
</mat-form-field>
</div>
</div>
</div>
</div>
</div>
<!--Two Wheeler-->
<div *ngIf="sup.get('business_assets_mode').value == 3">
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<div *ngFor="let detail of sup['controls'].business_details['controls']; let s = index">
<div [formGroupName]="s">
<div>
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Manufacturer, Model" formControlName="manufacturer_model_two_weeler" required autocomplete="off">
</mat-form-field>
</div>
</div>
</div>
</div>
</div>
<!--Consumer Durable-->
<div *ngIf="sup.get('business_assets_mode').value == 5">
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<div *ngFor="let detail of sup['controls'].business_details['controls']; let s = index">
<div [formGroupName]="s">
<div>
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Description" formControlName="consumer_durable_description" required>
</mat-form-field>
</div>
</div>
</div>
</div>
</div>
<!--Insurance-->
<div *ngIf="sup.get('business_assets_mode').value == 6">
<div fxFill>
<div *ngFor="let detail of sup['controls'].business_details['controls']; let s = index">
<div [formGroupName]="s">
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<div fxFlex="33">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Premium Paid" formControlName="premium_paid" required (keypress)="keyPress($event)" autocomplete="off">
</mat-form-field>
</div>
<div fxFlex="33">
<mat-form-field>
<mat-select placeholder="Frequency" formControlName="frequency_mode" required>
<mat-option *ngFor="let freqn of m_freqOfPurchase" [value]="freqn.frequency_id">{{ freqn.name }}</mat-option>
</mat-select>
</mat-form-field>
</div>
<div fxFlex="33">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Sum Assured" formControlName="sum_assured" required (keypress)="keyPress($event)" autocomplete="off">
</mat-form-field>
</div>
</div>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<div fxFlex="33">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Members Covered" formControlName="members_coverd" required autocomplete="off">
</mat-form-field>
</div>
</div>
</div>
</div>
</div>
</div>
<!--Investments-->
<div *ngIf="sup.get('business_assets_mode').value == 7">
<div>
<div *ngFor="let detail of sup['controls'].business_details['controls']; let s = index">
<div [formGroupName]="s">
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<div fxFlex="33">
<mat-form-field>
<mat-select placeholder="Type" formControlName="investments_type" required>
<mat-option *ngFor="let ins_type of m_investmentType" [value]="ins_type.id">{{ ins_type.name }}</mat-option>
</mat-select>
</mat-form-field>
</div>
<!-- <div fxFlex="33" *ngIf="detail.get('investments_type').value == 6 "> -->
<mat-form-field>
<input matInput placeholder="Specify Other Type" formControlName="other_investments_type" autocomplete="off">
</mat-form-field>
<!-- </div> -->
<div fxFlex="33" >
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Amount of Investment" formControlName="amount_of_invest" required (keypress)="keyPress($event)" autocomplete="off">
</mat-form-field>
</div>
<div fxFlex="33">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Bank Name" formControlName="bank_name" required autocomplete="off">
</mat-form-field>
</div>
</div>
</div>
</div>
</div>
</div>
<!--other assets-->
<!-- <div *ngIf="sup.get('assets_mode').value == 8"> -->
<div *ngIf="sup.get('business_assets_mode').value == 8">
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<div *ngFor="let detail of sup['controls'].business_details['controls']; let s = index">
<div [formGroupName]="s">
<div>
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Description of the Assets" formControlName="any_other_assets" required autocomplete="off">
</mat-form-field>
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Value of the Assets" formControlName="any_other_asset_value" required autocomplete="off">
</mat-form-field>
<!-- <mat-form-field class="ml-xs example-full-width"> -->
<!-- <input matInput placeholder="Is Any Loan" formControlName="any_other_asset_loan" required> -->
<!-- </mat-form-field> -->
<mat-form-field class="ml-xs example-full-width">
<mat-select placeholder="Is there any asset loan?" formControlName="any_other_asset_loan" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
<mat-option value="nan">NAN</mat-option>
</mat-select>
</mat-form-field>
<!-- <mat-form-field class="ml-xs example-full-width" *ngIf="detail.get(any_other_asset_loan).value == 'yes'"> -->
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="What is the EMI amount ?" formControlName="other_asset_emi_amt" autocomplete="off">
<!-- <span matSuffix>.00</span> -->
</mat-form-field>
</div>
</div>
</div>
</div>
</div>
</div>
<!--Desction Dynamic details : END -->
<!-- {{sup.get('business_assets_mode').value}} -->
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<div *ngIf="sup.get('business_assets_mode').value == 1 || sup.get('business_assets_mode').value == 4">
<div fxFlex="33">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Approximate Market Value" formControlName="business_approximate_market_value" (keypress)="keyPress($event)" autocomplete="off">
</mat-form-field>
</div>
</div>
<div *ngIf="sup.get('business_assets_mode').value == 1 || sup.get('business_assets_mode').value == 2 || sup.get('business_assets_mode').value == 3 || sup.get('business_assets_mode').value == 4 || sup.get('business_assets_mode').value == 5">
<div fxFlex="33">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Name of the Owner" formControlName="business_name_of_the_owner" autocomplete="off">
</mat-form-field>
</div>
<!-- <div fxFlex="33">
<mat-form-field class="ml-xs example-full-width">
<mat-select placeholder="Name of the Owner"
formControlName="business_name_of_the_owner" required>
<mat-option value="{{owner.pd_co_applicant_id}}" *ngFor="let owner of applicants">{{owner.applicant_name}}</mat-option>
</mat-select>
</mat-form-field>
</div>
<div fxFlex="33">
<mat-form-field class="ml-xs example-full-width" *ngIf="sup.get('business_name_of_the_owner').value == 0">
<input matInput placeholder="Specify Other Owner Name"
formControlName="other_owner" autocomplete="off">
</mat-form-field>
</div>
<div fxFlex="33">
<mat-form-field class="ml-xs example-full-width">
<mat-select placeholder="Relation" formControlName="relation" required>
<mat-option value="{{relations.relationship_id}}"
*ngFor="let relations of m_relation">
{{relations.name}}
</mat-option>
</mat-select>
</mat-form-field>
</div> -->
</div>
</div>
<div *ngIf="sup.get('business_assets_mode').value == 1 || sup.get('business_assets_mode').value == 2 || sup.get('business_assets_mode').value == 3 || sup.get('business_assets_mode').value == 4 || sup.get('business_assets_mode').value == 5">
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<div fxFlex="33">
<mat-form-field class="ml-xs example-full-width" style="width:95%">
<mat-select placeholder="Is there a loan existing against this asset?" formControlName="business_emi">
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
</div>
<div *ngIf="sup.get('business_emi').value === 'yes'" fxFlex="33">
<mat-form-field class="ml-xs example-full-width" style="width:95%">
<input matInput placeholder="Amount of EMI on This Loan?" formControlName="business_emi_paid" (keypress)="keyPress($event)" autocomplete="off">
</mat-form-field>
</div>
<div *ngIf="sup.get('business_emi').value === 'yes'" fxFlex="33">
<mat-form-field class="ml-xs example-full-width" style="width:95%">
<input matInput placeholder="Original Loan Tenure in Months" formControlName="business_original_loan_tenure" autocomplete="off" (change)="loanCalc(sup,2)">
</mat-form-field>
</div>
<div *ngIf="sup.get('business_emi').value === 'yes'" fxFlex="33" style="width:95%">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Balance Tenure in Months" formControlName="business_balance_tenure" autocomplete="off" (change)="loanCalc(sup,2)">
</mat-form-field>
</div>
<div *ngIf="sup.get('business_emi').value === 'yes' && sup.get('business_original_loan_tenure').value != '' && sup.get('business_balance_tenure').value != '' " fxFlex="33" style="width:95%">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Elapsed Tenure in Months" formControlName="business_elapsed_tenure" autocomplete="off">
</mat-form-field>
<!-- <p>Elapsed tenure is {{elapsed_tenure}}</p> -->
</div>
</div>
</div>
<div fxLayout="row" fxLayoutGap="12px" fxLayoutAlign="start none">
<div fxFlex="20">
<span *ngIf="_assetsQuesFrom.controls.business_assets_details.controls.length > 1" (click)="removeLanguage(i,2)">
<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>
</mat-card-content>
</mat-card>
</div>
</div>
</div>
<div class="row" style="text-align:right;">
<button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Business Asset Details" matTooltipPosition="above"
class="mr-1 mb-1 hover-icon" (click)="addSupplierDetails($event,2); false"><mat-icon>add</mat-icon></button>
</div>
</mat-card-content>
</mat-card>
</div>
</div>
</ng-template>
</mat-tab>
<mat-tab label="Other Asset Questions">
<ng-template matTabContent>
<div fxLayout="row wrap">
<div fxFlex="100">
@ -29,7 +329,7 @@
<div [formGroupName]="i">
<div fxLayout="row wrap" fxLayoutGap="5px" fxLayoutAlign="start none">
<mat-form-field style="width:100%">
<mat-select (selectionChange)="selectedAssetsType($event, i)" placeholder="Assets Type" formControlName="assets_mode" requried>
<mat-select (selectionChange)="selectedAssetsType($event, i,1)" placeholder="Assets Type" formControlName="assets_mode" requried>
<mat-option *ngFor="let asset of m_assets_type" [value]="asset.id">{{ asset.name }}</mat-option>
</mat-select>
</mat-form-field>
@ -50,7 +350,7 @@
</div>
<div>
<mat-form-field *ngIf="detail.get('property_type').value == 5">
<input matInput placeholder="Other Property Type" formControlName="other_property_type">
<input matInput placeholder="Other Property Type" formControlName="other_property_type" autocomplete="off">
</mat-form-field>
</div>
</div>
@ -64,7 +364,7 @@
<div [formGroupName]="s">
<div>
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Manufacturer, Model" formControlName="manufacturer_model_four_weeler" required>
<input matInput placeholder="Manufacturer, Model" formControlName="manufacturer_model_four_weeler" required autocomplete="off">
</mat-form-field>
</div>
</div>
@ -78,7 +378,7 @@
<div [formGroupName]="s">
<div>
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Manufacturer, Model" formControlName="manufacturer_model_two_weeler" required>
<input matInput placeholder="Manufacturer, Model" formControlName="manufacturer_model_two_weeler" required autocomplete="off">
</mat-form-field>
</div>
</div>
@ -92,7 +392,7 @@
<div [formGroupName]="s">
<div>
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Description" formControlName="jwell_description">
<input matInput placeholder="Description" formControlName="jwell_description" autocomplete="off">
</mat-form-field>
</div>
</div>
@ -128,7 +428,7 @@
</div>-->
<div fxFlex="33">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Premium Paid" formControlName="premium_paid" required (keypress)="keyPress($event)">
<input matInput placeholder="Premium Paid" formControlName="premium_paid" required (keypress)="keyPress($event)" autocomplete="off">
</mat-form-field>
</div>
<div fxFlex="33">
@ -140,14 +440,14 @@
</div>
<div fxFlex="33">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Sum Assured" formControlName="sum_assured" required (keypress)="keyPress($event)">
<input matInput placeholder="Sum Assured" formControlName="sum_assured" required (keypress)="keyPress($event)" autocomplete="off">
</mat-form-field>
</div>
</div>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<div fxFlex="33">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Members Covered" formControlName="members_coverd" required>
<input matInput placeholder="Members Covered" formControlName="members_coverd" required autocomplete="off">
</mat-form-field>
</div>
</div>
@ -161,7 +461,7 @@
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
<div [formGroupName]="s">
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<div fxFlex="33">
<div fxFlex="33%" class="ml-xs example-full-width">
<mat-form-field>
<mat-select placeholder="Type" formControlName="investments_type" required>
<mat-option *ngFor="let ins_type of m_investmentType" [value]="ins_type.id">{{ ins_type.name }}</mat-option>
@ -169,18 +469,22 @@
</mat-form-field>
</div>
<!-- <div fxFlex="33" *ngIf="detail.get('investments_type').value == 6 "> -->
<mat-form-field>
<input matInput placeholder="Specify Other Type" formControlName="other_investments_type">
</mat-form-field>
<!-- </div> -->
<div fxFlex="33" >
<div fxFlex="33%" >
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Amount of Investment" formControlName="amount_of_invest" required (keypress)="keyPress($event)">
<input matInput placeholder="Specify Other Type" formControlName="other_investments_type" autocomplete="off">
</mat-form-field>
</div>
<div fxFlex="33">
<!-- </div> -->
<div fxFlex="33%" >
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Bank Name" formControlName="bank_name" required>
<input matInput placeholder="Amount of Investment" formControlName="amount_of_invest" required (keypress)="keyPress($event)" autocomplete="off">
</mat-form-field>
</div>
</div>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<div fxFlex="33%">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Bank Name" formControlName="bank_name" required autocomplete="off">
</mat-form-field>
</div>
</div>
@ -195,10 +499,10 @@
<div [formGroupName]="s">
<div>
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Description of the Assets" formControlName="any_other_assets" required>
<input matInput placeholder="Description of the Assets" formControlName="any_other_assets" required autocomplete="off">
</mat-form-field>
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Value of the Assets" formControlName="any_other_asset_value" required>
<input matInput placeholder="Value of the Assets" formControlName="any_other_asset_value" required autocomplete="off">
</mat-form-field>
<!-- <mat-form-field class="ml-xs example-full-width"> -->
<!-- <input matInput placeholder="Is Any Loan" formControlName="any_other_asset_loan" required> -->
@ -209,10 +513,12 @@
<mat-option value="no">No</mat-option>
<mat-option value="nan">NAN</mat-option>
</mat-select>
<!-- <input matInput placeholder="What is the EMI amount ?" formControlName="any_other_asset_loan" autocomplete="off"> -->
</mat-form-field>
<mat-form-field class="ml-xs example-full-width" *ngIf="detail.get(any_other_asset_loan).value == 'yes'">
<input matInput placeholder="What is the EMI amount ?" formControlName="other_asset_emi_amt">
<span matSuffix>.00</span>
<!-- <mat-form-field class="ml-xs example-full-width" *ngIf="detail.get(any_other_asset_loan).value == 'yes'"> -->
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="What is the EMI amount ?" formControlName="other_asset_emi_amt" autocomplete="off">
<!-- <span matSuffix>.00</span> -->
</mat-form-field>
</div>
</div>
@ -221,23 +527,49 @@
</div>
</div>
<!--Desction Dynamic details : END -->
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<!--<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">-->
<div *ngIf="sup.get('assets_mode').value == 1 || sup.get('assets_mode').value == 4">
<div fxFlex="33">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Approximate Market Value" formControlName="approximate_market_value" (keypress)="keyPress($event)">
<input matInput placeholder="Approximate Market Value" formControlName="approximate_market_value" (keypress)="keyPress($event)" autocomplete="off">
</mat-form-field>
</div>
</div>
<div *ngIf="sup.get('assets_mode').value == 1 || sup.get('assets_mode').value == 2 || sup.get('assets_mode').value == 3 || sup.get('assets_mode').value == 4 || sup.get('assets_mode').value == 5">
<!-- <div fxFlex="33">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Name of the Owner" formControlName="name_of_the_owner" autocomplete="off">
</mat-form-field>
</div> -->
<div fxFlex="33">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Name of the Owner" formControlName="name_of_the_owner">
<mat-select placeholder="Name of the Owner"
formControlName="name_of_the_owner" required>
<mat-option value="{{owner.pd_co_applicant_id}}" *ngFor="let owner of applicants">{{owner.applicant_name}}</mat-option>
</mat-select>
</mat-form-field>
</div>
<div fxFlex="33" *ngIf="sup.get('name_of_the_owner').value == 0 && sup.get('name_of_the_owner').value != ''">
<mat-form-field class="ml-xs example-full-width" >
<input matInput placeholder="Specify Other Owner Name"
formControlName="other_owner" autocomplete="off">
</mat-form-field>
</div>
<div fxFlex="33">
<mat-form-field class="ml-xs example-full-width">
<mat-select placeholder="Relation" formControlName="relation" required>
<mat-option value="{{relations.relationship_id}}"
*ngFor="let relations of m_relation">
{{relations.name}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
</div>
</div>
<!--</div>-->
<!---- <div *ngIf="sup.get('assets_mode').value == 1 || sup.get('assets_mode').value == 2 || sup.get('assets_mode').value == 3 || sup.get('assets_mode').value == 5">
<label>Year and Month of Purchase?</label>
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
@ -261,24 +593,30 @@
</div>
<div *ngIf="sup.get('emi').value === 'yes'" fxFlex="33">
<mat-form-field class="ml-xs example-full-width" style="width:95%">
<input matInput placeholder="Amount of EMI on This Loan?" formControlName="emi_paid" (keypress)="keyPress($event)">
<input matInput placeholder="Amount of EMI on This Loan?" formControlName="emi_paid" (keypress)="keyPress($event)" autocomplete="off">
</mat-form-field>
</div>
<div *ngIf="sup.get('emi').value === 'yes'" fxFlex="33">
<mat-form-field class="ml-xs example-full-width" style="width:95%">
<input matInput placeholder="Original Loan Tenure in Months" formControlName="elapsed_tenure">
<input matInput placeholder="Original Loan Tenure in Months" formControlName="original_loan_tenure" (change)="loanCalc(sup,1)" autocomplete="off">
</mat-form-field>
</div>
<div *ngIf="sup.get('emi').value === 'yes'" fxFlex="33" style="width:95%">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Balance Tenure in Months" formControlName="balance_tenure">
<input matInput placeholder="Balance Tenure in Months" formControlName="balance_tenure" (change)="loanCalc(sup,1)" autocomplete="off">
</mat-form-field>
</div>
<div *ngIf="sup.get('emi').value === 'yes' && sup.get('original_loan_tenure').value != '' && sup.get('balance_tenure').value != '' " fxFlex="33" style="width:95%">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Elapsed Tenure in Months" formControlName="elapsed_tenure" autocomplete="off">
</mat-form-field>
<!-- <p>Elapsed tenure is {{elapsed_tenure}}</p> -->
</div>
</div>
</div>
<div fxLayout="row" fxLayoutGap="12px" fxLayoutAlign="start none">
<div fxFlex="20">
<span *ngIf="_assetsQuesFrom.controls.assets_details.controls.length > 1" (click)="removeLanguage(i)">
<span *ngIf="_assetsQuesFrom.controls.assets_details.controls.length > 1" (click)="removeLanguage(i,1)">
<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>
@ -292,10 +630,7 @@
<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"
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,1); false"><mat-icon>add</mat-icon></button>
</div>
</mat-card-content>
@ -306,125 +641,111 @@
</div>
</div>
</ng-template>
</mat-tab>
<mat-tab label="Docs">
</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 ngxViewer>
<div fxLayout="row wrap" style="padding:20px;">
<div fxFlex="100">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
</div>
</div>
</div>
<div fxFlex="row">
<div fxFlex="100" class="m-gap p-gap">
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
</div>
</div>
</div>
</div>
</ng-template>
</mat-tab>
</mat-tab-group>
</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>
<textarea matInput placeholder="Remarks" formControlName="assets_form_remark" autocomplete="off"></textarea>
</mat-form-field>
</div>
<div fxFlex="40" align="end">
@ -433,3 +754,6 @@
</div>
</mat-dialog-actions>
</form>
<notifier-container></notifier-container>

View File

@ -35,6 +35,9 @@ export class AssetsInfoComponent implements OnInit {
public _assetsQuesFrom: FormGroup;
public submitted = false;
public m_assets_type = [];
public m_relation = [];
public applicants: any;
// public m_assets_type = [
// {
// 'id': "1",
@ -167,10 +170,30 @@ public m_investmentType = [];
private pdTrigerService: 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.applicants.push({'pd_co_applicant_id':'0','applicant_name':'Others'});
this.notifier = notifier;
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
ngOnInit() {
@ -180,6 +203,7 @@ public m_investmentType = [];
this.getM_PropertyType();
this.getM_InvestmentType();
this.getM_FreqOfPurchase();
this.getM_Relation();
//this.getM_InsuranceType();
}
@ -221,6 +245,17 @@ public m_investmentType = [];
)
}
getM_Relation() {
this.pdTrigerService.getAllMasterDatas('RELATIONSHIPS').subscribe(
data => {
this.m_relation = data.records.filter(data => data.isactive == 1);
},
error => {
this.notifier.notify('warning', 'No Category Records Found.!');
}
)
}
getM_FreqOfPurchase() {
this.pdTrigerService.getAllMasterDatas('FREQUENCY').subscribe(
data => {
@ -274,9 +309,11 @@ public m_investmentType = [];
assets_details: this._formBuilder.array([
// this.initDetails(),
]),
business_assets_details : this._formBuilder.array([]),
assets_form_remark:[value.assets_form_remark || 'check']
});
this.addAssetsDetailsWithData(value.assets_details);
this.addBusinessAssetsDetailsWithData(value.business_assets_details);
} else {
this._assetsQuesFrom = this._formBuilder.group({
pdid: [this.pdid],
@ -284,6 +321,9 @@ public m_investmentType = [];
assets_details: this._formBuilder.array([
this.initDetails(),
]),
business_assets_details : this._formBuilder.array([
this.initBusinessDetails(),
]),
assets_form_remark:['']
});
}
@ -304,60 +344,98 @@ public m_investmentType = [];
details: this._formBuilder.array([]),
approximate_market_value: ['', Validators.compose([])],
name_of_the_owner: ['', Validators.compose([])],
other_owner:[''],
relation: [''],
// purchase_year: ['', Validators.compose([])],
//purchase_month: ['', Validators.compose([])],
emi: [''],
emi_paid: [''],
original_loan_tenure: [''],
balance_tenure: [''],
elapsed_tenure: [''],
balance_tenure: ['']
});
}
initBusinessDetails() {
return this._formBuilder.group({
business_assets_mode: ['', Validators.compose([Validators.required])],
business_details: this._formBuilder.array([]),
business_approximate_market_value: ['', Validators.compose([])],
business_name_of_the_owner: ['', Validators.compose([])],
// other_owner:[''],
// relation:[''],
// purchase_year: ['', Validators.compose([])],
//purchase_month: ['', Validators.compose([])],
business_emi: [''],
business_emi_paid: [''],
business_original_loan_tenure: [''],
business_balance_tenure: [''],
business_elapsed_tenure: [''],
});
}
show: boolean;
selectedAssetsType(e: any, i: any): void {
selectedAssetsType(e: any, i: any,flag : any): void {
console.log(e);
console.log(i);
console.log(flag);
let val = i;
if(flag == 1){
const arr = (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray;
arr.controls.splice(0);
}
else if(flag == 2){
const arr = (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray;
arr.controls.splice(0);
}
switch (e.value) {
case '1': {
let val = i;
const control = (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray;
const control = (flag == 1) ? (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray
: (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray ;
control.push(this.loadProperty());
break;
}
case '2': {
const control = (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray;
const control = (flag == 1) ? (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray
: (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray ;
control.push(this.load_Four_Weeler());
break;
}
case '3': {
const control = (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray;
const control = (flag == 1) ? (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray
: (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray ;
control.push(this.load_Two_Weeler());
break;
}
case '4': {
const control = (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray;
const control = (flag == 1) ? (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray
: (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray ;
//control.push(this.loadJwellDescription());
break;
}
case '5': {
const control = (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray;
const control = (flag == 1) ? (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray
: (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray ;
control.push(this.loadConsumerDurableDescription());
break;
}
case '6': {
const control = (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray;
const control = (flag == 1) ? (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray
: (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray ;
control.push(this.loadInsuranceDescription());
break;
}
case '7': {
const control = (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray;
const control = (flag == 1) ? (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray
: (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray ;
control.push(this.loadInvestDescription());
break;
}
case '8': {
const control = (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray;
const control = (flag == 1) ? (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray
: (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('details') as FormArray ;
control.push(this.otherAssetsDescription());
break;
}
@ -400,25 +478,25 @@ public m_investmentType = [];
loadInsuranceDescription() {
return this._formBuilder.group({
//insurance_type: ['', Validators.compose([Validators.required])],
premium_paid: ['', Validators.compose([Validators.required])],
frequency_mode: ['', Validators.compose([Validators.required])],
sum_assured: ['', Validators.compose([Validators.required])],
members_coverd: ['', Validators.compose([Validators.required])]
premium_paid: ['', Validators.compose([])],
frequency_mode: ['', Validators.compose([])],
sum_assured: ['', Validators.compose([])],
members_coverd: ['', Validators.compose([])]
});
}
loadInvestDescription() {
return this._formBuilder.group({
investments_type: ['', Validators.compose([Validators.required])],
other_investment_type:[''],
amount_of_invest: ['', Validators.compose([Validators.required])],
bank_name: ['', Validators.compose([Validators.required])]
investments_type: ['', Validators.compose([])],
other_investments_type:[''],
amount_of_invest: ['', Validators.compose([])],
bank_name: ['', Validators.compose([])]
});
}
load_Four_Weeler() {
return this._formBuilder.group({
manufacturer_model_four_weeler: ['', Validators.compose([Validators.required])]
manufacturer_model_four_weeler: ['', Validators.compose([])]
});
}
@ -433,6 +511,14 @@ public m_investmentType = [];
loadPropertyWithData(data) {
return this._formBuilder.group({
property_type: [data.property_type, Validators.compose([Validators.required])]
//property_type:['']
});
}
loadPropertyWithData2(data) {
return this._formBuilder.group({
property_type: [data.property_type, Validators.compose([Validators.required])]
//property_type:['']
});
}
@ -496,16 +582,37 @@ public m_investmentType = [];
details: this._formBuilder.array([]),
approximate_market_value: [data.approximate_market_value, Validators.compose([])],
name_of_the_owner: [data.name_of_the_owner, Validators.compose([])],
other_owner:[data.other_owner || ''],
relation: [data.relation || ''],
// purchase_year: [data.purchase_year, Validators.compose([])],
// purchase_month: [data.purchase_month, Validators.compose([])],
emi: [data.emi || 0],
emi_paid: [data.emi_paid || ''],
elapsed_tenure: [data.elapsed_tenure || ''],
balance_tenure: [data.balance_tenure || '']
original_loan_tenure: [data.original_loan_tenure || ''],
balance_tenure: [data.balance_tenure || ''],
elapsed_tenure: [data.elapsed_tenure || '']
});
}
initBusinessDetailsWithdata(data) {
return this._formBuilder.group({
business_assets_mode: [data.business_assets_mode, Validators.compose([Validators.required])],
business_details: this._formBuilder.array([]),
business_approximate_market_value: [data.business_approximate_market_value, Validators.compose([])],
business_name_of_the_owner: [data.business_name_of_the_owner, Validators.compose([])],
// other_owner:[data.other_owner || ''],
// relation: [data.relation || ''],
// purchase_year: [data.purchase_year, Validators.compose([])],
// purchase_month: [data.purchase_month, Validators.compose([])],
business_emi: [data.business_emi || 0],
business_emi_paid: [data.business_emi_paid || ''],
business_original_loan_tenure: [data.business_original_loan_tenure || ''],
business_balance_tenure: [data.business_balance_tenure || ''],
business_elapsed_tenure: [data.business_elapsed_tenure || '']
});
}
loadDetails: boolean;
addAssetsDetailsWithData(supp_data) {
console.log(supp_data);
var result = Object.keys(supp_data).map(function (key) {
return supp_data[key];
});
@ -515,10 +622,13 @@ public m_investmentType = [];
assets_mode: val.assets_mode,
approximate_market_value: val.approximate_market_value,
name_of_the_owner: val.name_of_the_owner,
other_owner:val.other_owner,
relation: val.relation,
// purchase_year: val.purchase_year,
// purchase_month: val.purchase_month,
emi: val.emi,
emi_paid: val.emi_paid,
original_loan_tenure: val.original_loan_tenure,
elapsed_tenure: val.elapsed_tenure,
balance_tenure: val.balance_tenure
};
@ -530,6 +640,41 @@ public m_investmentType = [];
this.loadDetails = true;
}
addBusinessAssetsDetailsWithData(supp_data) {
console.log(supp_data);
var result = Object.keys(supp_data).map(function (key) {
return supp_data[key];
});
if (result.length > 0) {
for (let val of result) {
let vals = {
business_assets_mode: val.business_assets_mode,
business_approximate_market_value: val.business_approximate_market_value,
business_name_of_the_owner: val.business_name_of_the_owner,
// other_owner: val.other_owner,
// relation : val.relation,
// purchase_year: val.purchase_year,
// purchase_month: val.purchase_month,
business_emi: val.business_emi,
business_emi_paid: val.business_emi_paid,
business_original_loan_tenure: val.business_original_loan_tenure,
business_elapsed_tenure: val.business_elapsed_tenure,
business_balance_tenure: val.business_balance_tenure
};
// const control = <FormArray>this._assetsQuesFrom.controls['assets_details'];
// control.push(this.initDetailsWithdata(vals));
// this.setAssetsDetailsWithData(vals.business_assets_mode, val.details, control.length - 1)
const control = <FormArray>this._assetsQuesFrom.controls['business_assets_details'];
control.push(this.initBusinessDetailsWithdata(vals));
this.setAssetsDetailsWithData2(vals.business_assets_mode, val.business_details, control.length - 1)
}
}
//this.loadDetails = true;
}
setAssetsDetailsWithData(assets_details_mode: any, datas: any, i: any): void {
let val = i;
// var data = Object.keys(datas).map(function (key) {
@ -539,6 +684,7 @@ public m_investmentType = [];
let data = datas;
const arr = (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray;
arr.controls.splice(0);
switch (assets_details_mode) {
case '1': {
const control = (<FormArray>this._assetsQuesFrom.controls['assets_details']).at(val).get('details') as FormArray;
@ -586,13 +732,76 @@ public m_investmentType = [];
}
}
addSupplierDetails(e) {
setAssetsDetailsWithData2(assets_details_mode: any, datas: any, i: any): void {
let val = i;
let data = datas;
const arr = (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray ;
arr.controls.splice(0);
switch (assets_details_mode) {
case '1': {
const control = (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray ;
control.push(this.loadPropertyWithData2(data));
break;
}
case '2': {
const control = (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray ;
control.push(this.load_Four_WeelerWithData(data));
break;
}
case '3': {
const control = (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray ;
control.push(this.load_Two_WeelerWithData(data));
break;
}
case '4': {
break;
}
case '5': {
const control = (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray ;
control.push(this.loadConsumerDurableDescriptionWithData(data));
break;
}
case '6': {
const control = (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray ;
control.push(this.loadInsuranceDescriptionWithData(data));
break;
}
case '7': {
const control = (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray ;
control.push(this.loadInvestDescriptionWithData(data));
break;
}
case '8': {
const control = (<FormArray>this._assetsQuesFrom.controls['business_assets_details']).at(val).get('business_details') as FormArray ;
control.push(this.otherAssetsDescriptionWithData(data));
break;
}
default: {
break;
}
}
}
addSupplierDetails(e,flag) {
console.log(flag);
console.log(e);
if(flag == 1){
const control = <FormArray>this._assetsQuesFrom.controls['assets_details'];
control.push(this.initDetails());
}else if(flag == 2){
const control = <FormArray>this._assetsQuesFrom.controls['business_assets_details'];
control.push(this.initBusinessDetails());
}
removeLanguage(i: number) {
}
removeLanguage(i: number,flag) {
if(flag == 1){
const control = <FormArray>this._assetsQuesFrom.controls['assets_details'];
control.removeAt(i);
}else if(flag == 2){
const control = <FormArray>this._assetsQuesFrom.controls['business_assets_details'];
control.removeAt(i);
}
}
public paymentModeTextBox: number;
@ -621,8 +830,19 @@ public m_investmentType = [];
answerFormValues.assets_details.map(val => {
if (val.emi == '0') {
val.emi_paid = '';
val.elapsed_tenure = '';
val.original_loan_tenure = '';
val.balance_tenure = '';
val.elapsed_tenure = '';
}
});
//To Remove The "Null" With Key also
answerFormValues.business_assets_details.map(val => {
if (val.business_emi == '0') {
val.business_emi_paid = '';
val.business_original_loan_tenure = '';
val.business_balance_tenure = '';
val.business_elapsed_tenure = '';
}
});
@ -664,6 +884,29 @@ public m_investmentType = [];
event.preventDefault();
}
}
loanCalc(details ,flag)
{
if(flag == 1){
//console.log(details.value);
let ElapsedValues;
if(details.value.original_loan_tenure != null && details.value.original_loan_tenure != '' && details.value.balance_tenure != null && details.value.balance_tenure != ''){
ElapsedValues = details.value.original_loan_tenure - details.value.balance_tenure ;
details.controls['elapsed_tenure'].setValue(ElapsedValues);
}
}
else if(flag == 2){
let BusinessElapsedValues;
if(details.value.business_original_loan_tenure != null && details.value.business_original_loan_tenure != '' && details.value.business_balance_tenure != null && details.value.business_balance_tenure != ''){
BusinessElapsedValues = details.value.business_original_loan_tenure - details.value.business_balance_tenure ;
details.controls['business_elapsed_tenure'].setValue(BusinessElapsedValues);
}
}
}
// {
// 'main_raw_materials': 'sdkjfal',
// 'supplier_details' ; [

View File

@ -99,12 +99,12 @@
formControlName="applicant_name" 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="itemrow.get('applicant_name').value == 'Others'">
<mat-form-field *ngIf="itemrow.get('applicant_name').value == 0">
<input matInput placeholder="Specify Other Applicant"
formControlName="other_applicant">
formControlName="other_applicant" autocomplete="off">
</mat-form-field>
<!-- <mat-form-field>
@ -122,7 +122,7 @@
</mat-form-field>
<mat-form-field *ngIf="itemrow.get('bank_name').value == 3">
<input matInput placeholder="Specify Other Bank Name"
formControlName="other_bank">
formControlName="other_bank" autocomplete="off">
</mat-form-field>
@ -140,7 +140,7 @@
</mat-select>-->
</mat-form-field>
<mat-form-field>
<mat-form-field *ngIf="salaryField">
<mat-select placeholder="Salary Credited in this account"
formControlName="salary" required>
<mat-option value="Yes">Yes</mat-option>
@ -151,7 +151,7 @@
<mat-form-field *ngIf="itemrow.get('account_type').value != 2">
<input matInput placeholder="Limit in case of OD / CC account"
formControlName="limit" (keypress)="keyPress($event)" required>
formControlName="limit" (keypress)="keyPress($event)" required autocomplete="off">
</mat-form-field>
<mat-form-field *ngIf="pd_cus_segment!='SAL'">
<mat-select placeholder="Is this the main business account"
@ -169,10 +169,10 @@
<br>
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field>
<input matInput type="number" placeholder="Year" formControlName="vintage_year" required min='0'>
<input matInput type="number" placeholder="Year(s)" formControlName="vintage_year" required min='0' (keypress)="keyPress($event)" autocomplete="off">
</mat-form-field>
<mat-form-field>
<input matInput type="number" placeholder="Month" formControlName="vintage_month" required min='0' max='12'>
<input matInput type="number" placeholder="Month(s)" formControlName="vintage_month" required min='0' max='11'(keypress)="keyPress($event)" autocomplete="off">
</mat-form-field>
</div>
</div>
@ -192,116 +192,98 @@
</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 ngxViewer>
<div fxLayout="row wrap" style="padding:20px;">
<div fxFlex="100">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
</div>
</div>
</div>
<div fxFlex="row">
<div fxFlex="100" class="m-gap p-gap">
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
</div>
</div>
</div>
</div>
</ng-template>
</mat-tab>

View File

@ -37,6 +37,7 @@ export class BankingDetailsComponent implements OnInit {
public applicants: any;
m_accountType= [];
m_btLenderList = [];
salaryField : boolean;
constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute,
private router: Router,
@ -46,17 +47,38 @@ export class BankingDetailsComponent implements OnInit {
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.applicants.push({'pd_co_applicant_id':'0','applicant_name':'Others'});
this.notifier = notifier;
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
ngOnInit() {
this.step = 0;
this.initBankingForm();
this.getM_AccountType();
this.getM_BTLenderList();
this.salaryField = this.pd_cus_segment.substring(0,2) == 'SE' ? false : true ;
// 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(this.pd_all_details.pdmaster_details);
@ -123,7 +145,8 @@ export class BankingDetailsComponent implements OnInit {
bank_name: ['', Validators.compose([Validators.required])],
other_bank: [''],
account_type: ['', Validators.compose([Validators.required])],
salary: ['', Validators.compose([Validators.required])],
//salary: ['', Validators.compose([Validators.required])],
salary: this.pd_cus_segment.substring(0,2) == 'SE' ? [''] : ['', Validators.compose([Validators.required])],
limit: ['', Validators.compose([Validators.required])],
//is_main: ['', Validators.compose([Validators.required])],
//is_main: [this.pd_cus_segment == 'SAL' ? '' : '', Validators.compose([Validators.required])],
@ -188,13 +211,13 @@ export class BankingDetailsComponent implements OnInit {
}
selectedAccTypeChanges(event: any){
console.log('First Time',event);
console.log('First Time Value',event.value);
// console.log('First Time',event);
// console.log('First Time Value',event.value);
if(event.value == 2) {
const control = <FormArray>this.bankingForm.controls['itemRows'];
console.log('Inside If Condition');
console.log(control);
console.log(control.controls);
// console.log('Inside If Condition');
// console.log(control);
// console.log(control.controls);
control.controls[0].get('limit').clearValidators();
control.controls[0].get('limit').updateValueAndValidity();
@ -208,7 +231,7 @@ export class BankingDetailsComponent implements OnInit {
}
else{
alert('sd');
//alert('sd');
}
}

View File

@ -873,116 +873,98 @@
<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 ngxViewer>
<div fxLayout="row wrap" style="padding:20px;">
<div fxFlex="100">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
</div>
</div>
</div>
<div fxFlex="row">
<div fxFlex="100" class="m-gap p-gap">
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
</div>
</div>
</div>
</div>
</ng-template>
</mat-tab>

View File

@ -62,7 +62,25 @@ export class BusinessInfoComponent implements OnInit {
this.form_id = 13;
this.notifier = notifier;
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
ngOnInit() {
let get_max_date = this.pd_all_details.pdmaster_details.pd_date_of_initiation.split('/').reverse().join("/");
this.maxDate = new Date(get_max_date);

View File

@ -1,332 +1,203 @@
<form *ngIf="apiLoadFinish" [formGroup]="_clientQuesFrom" (submit)="onSubmit()" novalidate>
<h2 mat-dialog-title class="paragraph_change">
<h2 mat-dialog-title class="paragraph_change">
<div fxFlex="70" align="left" style="padding: 10px !important;">{{pageTitle}}</div>
<div fxFlex="30" align="end" style="padding: 10px !important;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Close" matTooltipPosition="right" mat-dialog-close><mat-icon>close</mat-icon></button>
<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>
</h2>
<div *ngIf="noRecordsFound" style="max-width: 100vw !important;width: 100% !important;height: 95% !important;">
<form [formGroup]="_supplierQuesFrom" (submit)="onSubmit()" novalidate>
<mat-dialog-content>
<mat-tab-group>
<mat-tab label="Questions">
<ng-template matTabContent>
<div fxLayout="row wrap">
<div fxFlex="100">
<mat-card>
<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-card *ngIf="manufacturingForm">
<h5 style="margin: 12px;">Manufacturing Product Details</h5>
<div formArrayName="manufacturing_details">
<div *ngFor="let item of _supplierQuesFrom.controls.manufacturing_details['controls']; let i=index" [formGroupName]="i">
<div formArrayName="main_raw_materials">
<div *ngFor="let items of item.controls.main_raw_materials['controls']; let l=index" [formGroupName]="l">
<mat-card style="margin: 12px;">
<h6 style="margin: 12px;">Raw Material #{{l+1}}</h6>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width: 100%">
<mat-select placeholder="Manufacturing Product Name" formControlName="manufacturing_product_name">
<mat-option *ngFor="let pm of m_manufacturingProducts[0]" [value]="pm.name">{{ pm.name }}</mat-option>
</mat-select>
</mat-form-field>
<!--<mat-form-field style="width: 100%">
<input matInput placeholder="Raw Material Name" formControlName="manufacturing_raw_material_name">
</mat-form-field>-->
<mat-form-field style="width: 100%">
<input matInput placeholder="Client Name" formControlName="manufacturing_client_name">
</mat-form-field>
<mat-form-field style="width: 100%">
<input matInput placeholder="Contact Person Name" formControlName="manufacturing_contact_person_name">
</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>-->
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width: 100%">
<input matInput placeholder="Contact Person Mobile Number" formControlName="manufacturing_contact_person_mobile_number">
</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-form-field style="width: 100%">
<mat-select placeholder="Payment Type" formControlName="manufacturing_payment_type">
<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 style="width: 100%" *ngIf="items.get('manufacturing_payment_type').value == 3">
<input matInput placeholder="Number of days of credit provided" formControlName="manufacturing_credit_days">
</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>
<div align="end">
<span *ngIf="item.controls.main_raw_materials.controls.length > 1" (click)="removeRawMaterials(l)">
<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> -->
</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>
<mat-dialog-actions>
</div>
</div>
<div>
<mat-form-field style="width: 100%">
<input matInput placeholder="% of total manufacturing raw materials credit values" formControlName="main_raw_materials_total_payments_percent_on_credit"
type="number">
</mat-form-field>
<div fxFlex="100" 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 mat-button color="primary" matTooltip="Add More Supplier Details" matTooltipPosition="above"
class="mr-1 mb-1 hover-icon" (click)="addMoreRawMaterials($event); false"><mat-icon>add</mat-icon></button>
</div>
</div>
</div>
</div>
</mat-card>
<mat-card *ngIf="tradingForm">
<h5 style="margin: 12px;">Trading Product Details</h5>
<div formArrayName="trade_details">
<div *ngFor="let item of _supplierQuesFrom.controls.trade_details['controls']; let i=index" [formGroupName]="i">
<div formArrayName="trading_products">
<div *ngFor="let items of item.controls.trading_products['controls']; let l=index" [formGroupName]="l">
<mat-card style="margin: 12px;">
<h6 style="margin: 12px;">Trading Product #{{l+1}}</h6>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width: 100%">
<mat-select placeholder="Trading Product Name" formControlName="trade_product_name">
<mat-option *ngFor="let pm of m_tradingProducts[0]" [value]="pm.name">{{ pm.name }}</mat-option>
</mat-select>
</mat-form-field>
<!--<mat-form-field style="width: 100%">
<input matInput placeholder="Trade Product Name" formControlName="trade_product_name">
</mat-form-field>-->
<mat-form-field style="width: 100%">
<input matInput placeholder="Client Name" formControlName="trade_client_name">
</mat-form-field>
<mat-form-field style="width: 100%">
<input matInput placeholder="Contact Person Name" formControlName="trade_product_contact_person_name">
</mat-form-field>
</div>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width: 100%">
<input matInput placeholder="Contact Person Mobile Number" formControlName="trade_product_contact_person_mobile_number">
</mat-form-field>
<mat-form-field style="width: 100%">
<mat-select placeholder="Payment Type" formControlName="trade_product_payment_type">
<mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width: 100%" *ngIf="items.get('trade_product_payment_type').value == 3">
<input matInput placeholder="Number of days of credit provided" formControlName="trade_product_credit_days">
</mat-form-field>
</div>
<div align="end">
<span *ngIf="item.controls.trading_products.controls.length > 1" (click)="removeTradingProduct(l)">
<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>
</mat-dialog-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>
<mat-form-field style="width: 100%">
<input matInput placeholder="% of total trading product credit values" formControlName="trading_products_total_payments_percent_on_credit"
type="number">
</mat-form-field>
<div fxFlex="100" align="end">
<button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Supplier Details" matTooltipPosition="above"
class="mr-1 mb-1 hover-icon" (click)="addMoretradeProduct($event); false"><mat-icon>add</mat-icon></button>
</div>
</div>
</div>
</div>
</mat-card>
<!--===========================: service provider details : START-->
<mat-card *ngIf="serviceProviderForm">
<h5 style="margin: 12px;">Service Provider Product Details</h5>
<div formArrayName="service_provider_details">
<div *ngFor="let item of _supplierQuesFrom.controls.service_provider_details['controls']; let i=index" [formGroupName]="i">
<div formArrayName="service_products">
<div *ngFor="let items of item.controls.service_products['controls']; let l=index" [formGroupName]="l">
<mat-card style="margin: 12px;">
<h6 style="margin: 12px;">Service Provider Product #{{l+1}}</h6>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width: 100%">
<mat-select placeholder="Service Provider Product Name" formControlName="service_provider_product_name">
<mat-option *ngFor="let pm of m_suplierProducts[0]" [value]="pm.name">{{ pm.name }}</mat-option>
</mat-select>
</mat-form-field>
<!--<mat-form-field style="width: 100%">
<input matInput placeholder="Trade Product Name" formControlName="trade_product_name">
</mat-form-field>-->
<mat-form-field style="width: 100%">
<input matInput placeholder="Client Name" formControlName="service_provider_client_name">
</mat-form-field>
<mat-form-field style="width: 100%">
<input matInput placeholder="Contact Person Name" formControlName="service_provider_product_contact_person_name">
</mat-form-field>
</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 fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width: 100%">
<input matInput placeholder="Contact Person Mobile Number" formControlName="service_provider_product_contact_person_mobile_number">
</mat-form-field>
<mat-form-field style="width: 100%">
<mat-select placeholder="Payment Type" formControlName="service_provider_product_payment_type">
<mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width: 100%" *ngIf="items.get('service_provider_product_payment_type').value == 3">
<input matInput placeholder="Number of days of credit provided" formControlName="service_provider_product_credit_days">
</mat-form-field>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
<div align="end">
<span *ngIf="item.controls.service_products.controls.length > 1" (click)="removeServiceProduct(l)">
<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>
</mat-card>
</div>
</div>
<div>
<mat-form-field style="width: 100%">
<input matInput placeholder="% of total service provider products credit values" formControlName="service_products_total_payments_percent_on_credit"
type="number">
</mat-form-field>
<div fxFlex="100" align="end">
<button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Supplier Details" matTooltipPosition="above"
class="mr-1 mb-1 hover-icon" (click)="addMoreServiceProduct($event); false"><mat-icon>add</mat-icon></button>
</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-card>
<mat-card *ngIf="retaildTradingForm">
<h5 style="margin: 12px;">Retail Trading Product Details</h5>
<div style="text-align: center; margin: 12px;">Retail Trading Details Not applicable here !!</div>
</mat-card>
</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-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> -->
<textarea matInput placeholder="Remarks" formControlName="supplier_info_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="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;">
<p>Client Details</p>
<form *ngIf="apiLoadFinish" [formGroup]="_clientQuesFrom" (submit)="onSubmit()" novalidate>
<div fxLayout="row" fxLayoutAlign="start none">
<div formArrayName="client_details" fxFill>
<div *ngFor="let sup of _clientQuesFrom.controls.client_details['controls']; let i=index">
<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>
</div>
</div>
<div class="row" style="text-align:right;">
<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>
</form>
</mat-card>-->
</div>

View File

@ -30,69 +30,46 @@ import { PdTrigerService } from '../../../../../pd-service/pd-triger.service';
})
export class ClientInfoComponent implements OnInit {
pageTitle: string ="Client Details";
pageTitle: string = "Client Details";
//@Input() pdid: number;
pdid : number;
pdid: string;
form_id: number;
loadDataStatus: boolean=true;
public _clientQuesFrom: FormGroup;
public _supplierQuesFrom: FormGroup;
public submitted = false;
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;
public m_paymentModeType = [];
private notifier: NotifierService;
public m_manufacturingProducts = [
{
id: 1,
name: 'Manufac prd 1'
}, {
id: 2,
name: 'Manufac prd 2'
}
];
public m_tradingProducts = [
{
id: 1,
name: 'trading prd 1'
}, {
id: 2,
name: 'trading prd 2'
}
];
public m_suplierProducts = [
{
id: 1,
name: 'service prd 1'
}, {
id: 2,
name: 'service prd 2'
}
];
constructor(
notifier: NotifierService,
@ -102,28 +79,394 @@ private notifier: NotifierService;
this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.form_id = 2;
this.notifier = notifier;
}
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
noRecordsFound: Boolean = false;
ngOnInit() {
this.getM_FreqOfPurchase();
this.pdTrigerService.getTypeofActivityForSuppliedInfoForm(this.pdid).subscribe(data => {
if(data.dataStatus){
// let datas = {
// "profession_name": "Others",
// "type_of_activity": [
// {
// "type_of_activity_id": 1,
// "name": "Manufacturing Details"
// },
// {
// "type_of_activity_id": 2,
// "name": "Retail trading"
// },
// {
// "type_of_activity_id": 3,
// "name": "Wholesale trading"
// },
// {
// "type_of_activity_id": 4,
// "name": "Service Providers"
// }
// ]
// };
let datas = data.records;
this.m_manufacturingProducts = datas.type_of_activity.filter(data=>{if(data.type_of_activity_id == 1 ){return data}}).map(data=> [...data.prodcuts]);
this.m_tradingProducts = datas.type_of_activity.filter(data=>{if(data.type_of_activity_id == 3 ){return data}}).map(data=> [...data.prodcuts]);
this.m_suplierProducts = datas.type_of_activity.filter(data=>{if(data.type_of_activity_id == 4 ){return data}}).map(data=> [...data.prodcuts]);
// alert(JSON.stringify(this.m_manufacturingProducts[0]));
this.initFormLoadDetails(datas.type_of_activity);
}else {
this.notifier.notify('warning', 'No Category Records Found.!');
this.noRecordsFound = false;
}
}, err => {
this.notifier.notify('warning', 'No Category Records Found.!');
this.noRecordsFound = false;
})
// this.getM_FreqOfPurchase();
this.getM_PaymentModeType();
this.getClientFormDetails();
// this.getPdSupplierFormDetails();
}
retaildTradingForm: Boolean = false;
initFormLoadDetails(record) {
this.pdTrigerService.getPDFormDetailsWithID(this.pdid, '2').subscribe(
data => {
if (data.dataStatus) {
let dataForm = data.records;
if (dataForm !== undefined) {
this._supplierQuesFrom = this._formBuilder.group({
pdid: [this.pdid],
formid: ['2'],
manufacturing_details: this._formBuilder.array([this.manufacturingFormCreation(record)]),
trade_details: this._formBuilder.array([this.tradingFormCreation(record)]),
service_provider_details: this._formBuilder.array([this.serviceProviderFormCreation(record)]),
supplier_info_form_remark: [dataForm.supplier_info_form_remark || null]
// wholesale_trade_details: this._formBuilder.array([this.tradingFormCreation(record)]),
});
// Load form details for manufacturing
let arr = record.filter(data => data.type_of_activity_id == 1);
if (arr.length > 0) {
let api_main_raw_materials = Object.keys(dataForm.main_raw_materials).map(function (key) {
return dataForm.main_raw_materials[key];
});
this.initManufacturingProductsDetails(api_main_raw_materials);
this._supplierQuesFrom.controls['manufacturing_details']['controls'][0].controls['main_raw_materials_total_payments_percent_on_credit'].setValue(dataForm.main_raw_materials_total_payments_percent_on_credit || null);
}
// Load form details for the wholeshale trading details
let arr1 = record.filter(data => data.type_of_activity_id == 3);
if (arr1.length > 0) {
let api_trading_products = Object.keys(dataForm.trading_products).map(function (key) {
return dataForm.trading_products[key];
});
this.initTradingProductsDetails(api_trading_products);
this._supplierQuesFrom.controls['trade_details']['controls'][0].controls['trading_products_total_payments_percent_on_credit'].setValue(dataForm.trading_products_total_payments_percent_on_credit || null);
}
// Load form details for the service provider prduct details
let arr2 = record.filter(data => data.type_of_activity_id == 4);
if (arr2.length > 0) {
let api_service_provider_products = Object.keys(dataForm.service_products).map(function (key) {
return dataForm.service_products[key];
});
this.initServiceProviderProductsDetails(api_service_provider_products);
this._supplierQuesFrom.controls['service_provider_details']['controls'][0].controls['service_products_total_payments_percent_on_credit'].setValue(dataForm.service_products_total_payments_percent_on_credit || null);
}
// Load form details for the retail trading details
let arr3 = record.filter(data => data.type_of_activity_id == 2);
if (arr3.length > 0) {
this.retaildTradingForm = true;
}
this.noRecordsFound = true;
} else {
this._supplierQuesFrom = this._formBuilder.group({
pdid: [this.pdid],
formid: ['2'],
manufacturing_details: this._formBuilder.array([this.manufacturingFormCreation(record)]),
trade_details: this._formBuilder.array([this.tradingFormCreation(record)]),
service_provider_details: this._formBuilder.array([this.serviceProviderFormCreation(record)]),
supplier_info_form_remark: [dataForm.supplier_info_form_remark || null]
// wholesale_trade_details: this._formBuilder.array([this.tradingFormCreation(record)]),
});
let arr = record.filter(data => data.type_of_activity_id == 1);
if (arr.length > 0) {
this.initManufacturingProductsDetails(null);
this._supplierQuesFrom.controls['manufacturing_details']['controls'][0].controls['main_raw_materials_total_payments_percent_on_credit'].setValue(null);
}
let arr1 = record.filter(data => data.type_of_activity_id == 3);
if (arr1.length > 0) {
this.initTradingProductsDetails(null);
this._supplierQuesFrom.controls['trade_details']['controls'][0].controls['trading_products_total_payments_percent_on_credit'].setValue(dataForm.trading_products_total_payments_percent_on_credit || null);
}
let arr2 = record.filter(data => data.type_of_activity_id == 4);
if (arr2.length > 0) {
let api_service_provider_products = Object.keys(dataForm.service_products).map(function (key) {
return dataForm.service_products[key];
});
this.initServiceProviderProductsDetails(api_service_provider_products);
this._supplierQuesFrom.controls['service_provider_details']['controls'][0].controls['service_products_total_payments_percent_on_credit'].setValue(dataForm.service_products_total_payments_percent_on_credit || null);
}
// Load form details for the retail trading details
let arr3 = record.filter(data => data.type_of_activity_id == 2);
if (arr3.length > 0) {
this.retaildTradingForm = true;
}
this.noRecordsFound = true;
}
} else {
this._supplierQuesFrom = this._formBuilder.group({
pdid: [this.pdid],
formid: ['2'],
manufacturing_details: this._formBuilder.array([this.manufacturingFormCreation(record)]),
trade_details: this._formBuilder.array([this.tradingFormCreation(record)]),
service_provider_details: this._formBuilder.array([this.serviceProviderFormCreation(record)]),
supplier_info_form_remark: []
// wholesale_trade_details: this._formBuilder.array([this.tradingFormCreation(record)]),
});
let arr = record.filter(data => data.type_of_activity_id == 1);
if (arr.length > 0) {
this.initManufacturingProductsDetails(null);
this._supplierQuesFrom.controls['manufacturing_details']['controls'][0].controls['main_raw_materials_total_payments_percent_on_credit'].setValue(null);
}
let arr1 = record.filter(data => data.type_of_activity_id == 3);
if (arr1.length > 0) {
this.initTradingProductsDetails(null);
this._supplierQuesFrom.controls['trade_details']['controls'][0].controls['trading_products_total_payments_percent_on_credit'].setValue(null);
}
let arr2 = record.filter(data => data.type_of_activity_id == 4);
if (arr2.length > 0) {
this.initServiceProviderProductsDetails(null);
this._supplierQuesFrom.controls['service_provider_details']['controls'][0].controls['service_products_total_payments_percent_on_credit'].setValue(null);
}
// Load form details for the retail trading details
let arr3 = record.filter(data => data.type_of_activity_id == 2);
if (arr3.length > 0) {
this.retaildTradingForm = true;
}
this.noRecordsFound = true;
}
}, err => {
}
);
}
// ==================
manufacturingForm: Boolean = false;
manufacturingFormCreation(val) {
let arr = val.filter(data => data.type_of_activity_id == 1);
if (arr.length > 0) {
this.manufacturingForm = true;
return this._formBuilder.group({
main_raw_materials: this._formBuilder.array([]),
main_raw_materials_total_payments_percent_on_credit: []
})
// }
} else {
return;
}
}
getM_FreqOfPurchase() {
this.pdTrigerService.getAllMasterDatas('FREQUENCY').subscribe(
data => {
this.m_freqOfPurchase = data.records.filter(data => data.isactive == 1);
},
error => {
tradingForm: Boolean = false;
tradingFormCreation(val) {
let arr = val.filter(data => data.type_of_activity_id == 3);
if (arr.length > 0) {
this.tradingForm = true;
return this._formBuilder.group({
trading_products: this._formBuilder.array([]),
trading_products_total_payments_percent_on_credit: []
});
} else {
return;
}
}
serviceProviderForm: Boolean = false;
serviceProviderFormCreation(val) {
let arr = val.filter(data => data.type_of_activity_id == 4);
if (arr.length > 0) {
this.serviceProviderForm = true;
return this._formBuilder.group({
service_products: this._formBuilder.array([]),
service_products_total_payments_percent_on_credit: []
});
} else {
return;
}
}
initManufacturingProductsDetails(datas) {
const control = <FormArray>this._supplierQuesFrom.controls['manufacturing_details']['controls'][0].controls['main_raw_materials'];
if (datas === null) {
control.push(this.initManufacturingProducts(null));
} else {
for (let val of datas) {
control.push(this.initManufacturingProducts(val));
}
}
}
initManufacturingProducts(records) {
if (records === null) {
return this._formBuilder.group({
manufacturing_product_name: [''],
manufacturing_client_name: [''],
manufacturing_contact_person_name: [''],
manufacturing_contact_person_mobile_number: [''],
manufacturing_payment_type: [''],
manufacturing_credit_days: [''],
})
} else {
return this._formBuilder.group({
manufacturing_product_name: [records.manufacturing_raw_material_name || null],
manufacturing_client_name: [records.manufacturing_client_name || null],
manufacturing_contact_person_name: [records.manufacturing_contact_person_name || null],
manufacturing_contact_person_mobile_number: [records.manufacturing_contact_person_mobile_number || null],
manufacturing_payment_type: [records.manufacturing_payment_type || null],
manufacturing_credit_days: [records.manufacturing_credit_days || null],
})
}
}
initTradingProductsDetails(datas) {
const control = <FormArray>this._supplierQuesFrom.controls['trade_details']['controls'][0].controls['trading_products'];
if (datas === null) {
control.push(this.initTradingProducts(null));
} else {
for (let val of datas) {
control.push(this.initTradingProducts(val));
}
}
}
initTradingProducts(records) {
if (records === null) {
return this._formBuilder.group({
trade_product_name: [''],
trade_client_name: [''],
trade_product_contact_person_name: [''],
trade_product_contact_person_mobile_number: [''],
trade_product_payment_type: [''],
trade_product_frequency_of_purchase: [''],
trade_product_credit_days: [''],
})
} else {
return this._formBuilder.group({
trade_product_name: [records.trade_product_name],
trade_client_name: [records.trade_client_name],
trade_product_contact_person_name: [records.trade_product_contact_person_name],
trade_product_contact_person_mobile_number: [records.trade_product_contact_person_mobile_number],
trade_product_payment_type: [records.trade_product_payment_type],
trade_product_frequency_of_purchase: [records.trade_product_frequency_of_purchase],
trade_product_credit_days: [records.trade_product_credit_days],
})
}
}
initServiceProviderProductsDetails(datas) {
const control = <FormArray>this._supplierQuesFrom.controls['service_provider_details']['controls'][0].controls['service_products'];
if (datas === null) {
control.push(this.initServiceProviderProducts(null));
} else {
for (let val of datas) {
control.push(this.initServiceProviderProducts(val));
}
}
}
initServiceProviderProducts(records) {
if (records === null) {
return this._formBuilder.group({
service_provider_product_name: [''],
service_provider_client_name: [''],
service_provider_product_contact_person_name: [''],
service_provider_product_contact_person_mobile_number: [''],
service_provider_product_payment_type: [''],
service_provider_product_frequency_of_purchase: [''],
service_provider_product_credit_days: [''],
})
} else {
return this._formBuilder.group({
service_provider_product_name: [records.service_provider_product_name],
service_provider_client_name: [records.service_provider_client_name],
service_provider_product_contact_person_name: [records.service_provider_product_contact_person_name],
service_provider_product_contact_person_mobile_number: [records.service_provider_product_contact_person_mobile_number],
service_provider_product_payment_type: [records.service_provider_product_payment_type],
service_provider_product_frequency_of_purchase: [records.service_provider_product_frequency_of_purchase],
service_provider_product_credit_days: [records.service_provider_product_credit_days],
})
}
}
addMoreRawMaterials(e): void {
// e.stropPropagation();
const control = <FormArray>this._supplierQuesFrom.controls['manufacturing_details']['controls'][0].controls['main_raw_materials'];
// console.log(control);
control.push(this.initManufacturingProducts(null));
}
removeRawMaterials(inx): void {
const control = <FormArray>this._supplierQuesFrom.controls['manufacturing_details']['controls'][0].controls['main_raw_materials'];
control.removeAt(inx);
}
addMoretradeProduct(e): void {
// e.stropPropagation();
const control = <FormArray>this._supplierQuesFrom.controls['trade_details']['controls'][0].controls['trading_products'];
// console.log(control);
control.push(this.initTradingProducts(null));
}
removeTradingProduct(inx): void {
const control = <FormArray>this._supplierQuesFrom.controls['trade_details']['controls'][0].controls['trading_products'];
control.removeAt(inx);
}
addMoreServiceProduct(e): void {
// e.stropPropagation();
const control = <FormArray>this._supplierQuesFrom.controls['service_provider_details']['controls'][0].controls['service_products'];
// console.log(control);
control.push(this.initServiceProviderProducts(null));
}
removeServiceProduct(inx): void {
const control = <FormArray>this._supplierQuesFrom.controls['service_provider_details']['controls'][0].controls['service_products'];
control.removeAt(inx);
}
// ==================
//getM_FreqOfPurchase() {
// this.pdTrigerService.getAllMasterDatas('FREQUENCY').subscribe(
// data => {
// this.m_freqOfPurchase = data.records.filter(data => data.isactive == 1);
// },
// error => {
// this.notifier.notify('warning', 'No Category Records Found.!');
// this.m_assets_type = "No Category Records Found.";
}
)
}
/// }
// )
// }
getM_PaymentModeType() {
this.pdTrigerService.getAllMasterDatas('PAYMENTMODE').subscribe(
@ -138,132 +481,28 @@ private notifier: NotifierService;
}
// ==================
apiLoadFinish: boolean = false;
getClientFormDetails() {
this.pdTrigerService.getPDFormDetailsWithID(this.pdid, '2').subscribe(
data => {
if (data) {
if(data.dataStatus){
this.formLoadData(data.records)
} else {
this.formLoadData(null)
}
this.apiLoadFinish = true;
} else {
// this.noRecordFound = true;
}
}
);
}
formLoadData(val) {
if(val !== null) {
let value = val;
this._clientQuesFrom = this._formBuilder.group({
pdid: [this.pdid],
formid: ['2'],
client_details: this._formBuilder.array([
// this.initDetails(),
])
});
this.addClientDetailsWithData(value.client_details);
} else {
this._clientQuesFrom = this._formBuilder.group({
pdid: [this.pdid],
formid: ['2'],
client_details: this._formBuilder.array([
this.initDetails(),
])
});
}
}
// convenience getter for easy access to form fields
get f() { return this._clientQuesFrom.controls; }
// Dynamic Form field creation Functionality : START ===>
initDetails() {
return this._formBuilder.group({
client_name: ['', Validators.compose([Validators.required])],
contact_person: ['', Validators.compose([Validators.required])],
mobile_number: ['', Validators.compose([Validators.required, Validators.minLength(10), Validators.maxLength(10)])],
payment_mode: ['', Validators.compose([Validators.required])],
per_of_immediate_advance_payment:[''],
credit_period:[''],
frequency_of_purchase: ['', Validators.compose([Validators.required])],
freq_purchase_others_text_value: ['']
});
}
initDetailsWithdata(data) {
return this._formBuilder.group({
client_name: [data.client_name, Validators.compose([Validators.required])],
contact_person: [data.contact_person, Validators.compose([Validators.required])],
mobile_number: [data.mobile_number, Validators.compose([Validators.required, Validators.minLength(10), Validators.maxLength(10)])],
payment_mode: [data.payment_mode, Validators.compose([Validators.required])],
per_of_immediate_advance_payment:[data.per_of_immediate_advance_payment || ''],
credit_period:[data.credit_period || ''],
frequency_of_purchase: [data.frequency_of_purchase, Validators.compose([Validators.required])],
freq_purchase_others_text_value: [data.freq_purchase_others_text_value || '']
});
}
addClientDetailsWithData(supp_data) {
var result = Object.keys(supp_data).map(function(key) {
return supp_data[key];
});
if (result.length > 0) {
for (let val of result) {
let vals = {
client_name: val.client_name,
contact_person: val.contact_person,
mobile_number: val.mobile_number,
payment_mode: val.payment_mode,
per_of_immediate_advance_payment: val.per_of_immediate_advance_payment,
credit_period: val.credit_period,
frequency_of_purchase: val.frequency_of_purchase,
freq_purchase_others_text_value: val.freq_purchase_others_text_value
};
const control = <FormArray>this._clientQuesFrom.controls['client_details'];
control.push(this.initDetailsWithdata(vals));
}
}
}
addSupplierDetails(e) {
const control = <FormArray>this._clientQuesFrom.controls['client_details'];
control.push(this.initDetails());
}
removeLanguage(i: number) {
const control = <FormArray>this._clientQuesFrom.controls['client_details'];
control.removeAt(i);
}
public paymentModeTextBox: number;
selectedPM(e) {
this.paymentModeTextBox = e.value;
// this.f.supplier_details.controls.get('payment_mode_value');
}
public freqPurchaseTextBox: number;
selectedFreqPurchase(e){
this.freqPurchaseTextBox = e.value;
}
// ==================
/** To Save/Edited Popup Data */
onSubmit() {
this.submitted = true;
// stop here if form is invalid
if (this._clientQuesFrom.invalid) {
if (this._supplierQuesFrom.invalid) {
return;
} else {
var answerFormValues = this._clientQuesFrom.value;
// To Remove The "Null" With Key also
Object.keys(answerFormValues).forEach((key) => (answerFormValues[key] == null) && delete answerFormValues[key]);
var answerFormValues = this._supplierQuesFrom.value;
//To Remove The "Null" With Key also
Object.keys(answerFormValues).forEach((key) => {if(answerFormValues[key] === null || answerFormValues[key] === undefined || answerFormValues[key] === ''){ delete answerFormValues[key]}; console.log("chec:" +answerFormValues[key])});
if(answerFormValues.manufacturing_details[0]==null){
delete answerFormValues['manufacturing_details'];
}
if(answerFormValues.trade_details[0]==null){
delete answerFormValues['trade_details'];
}
if(answerFormValues.service_provider_details[0]==null){
delete answerFormValues['service_provider_details'];
}
// Add BRANCH data with help Service File
this.pdTrigerService.savePDFormDetailsWithID(answerFormValues).subscribe(
dataresult => {
@ -291,6 +530,7 @@ var result = Object.keys(supp_data).map(function(key) {
onReset() {
// this._addQuesFrom.reset();
}
/** On Key Press Event For Mobile Number */
keyPress(event: any) {
const pattern = /[0-9]/;

View File

@ -107,116 +107,98 @@
<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 ngxViewer>
<div fxLayout="row wrap" style="padding:20px;">
<div fxFlex="100">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
</div>
</div>
</div>
<div fxFlex="row">
<div fxFlex="100" class="m-gap p-gap">
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
</div>
</div>
</div>
</div>
</ng-template>
</mat-tab>

View File

@ -53,6 +53,25 @@ export class CurrentLoanComponent implements OnInit {
this.notifier = notifier;
this.applicants = this.pd_all_details.pdapplicants_detials;
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
ngOnInit() {
this.getMasterDetails('BTLENDERLIST',1);
this.getMasterDetails('FREQUENCY',2);

View File

@ -128,112 +128,98 @@
</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 ngxViewer>
<div fxLayout="row wrap" style="padding:20px;">
<div fxFlex="100">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
</div>
</div>
</div>
<div fxFlex="row">
<div fxFlex="100" class="m-gap p-gap">
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
</div>
</div>
</div>
</div>
</ng-template>
</mat-tab>
</mat-tab-group>

View File

@ -49,7 +49,25 @@ export class EmploymentInfoComponent implements OnInit {
this.notifier = notifier;
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
ngOnInit() {
this.pd_cus_segment=this.pd_all_details.pdmaster_details.customer_segment_abbr.toUpperCase();
this.initemploymentForm();

View File

@ -4,7 +4,8 @@
{{pageTitle}}
</div>
<div fxFlex="30" align="end" style="padding: 10px !important;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Close" matTooltipPosition="right" mat-dialog-close><mat-icon>close</mat-icon></button>
<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>
@ -18,148 +19,130 @@
<!-- <mat-card-title>Address Details</mat-card-title> -->
<mat-card-content>
<mat-form-field>
<!--<mat-form-field>
<input matInput placeholder="Number Of Family Members" formControlName="members" required>
</mat-form-field>
<mat-card>
<mat-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>-->
<div>
<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-select placeholder="Select a person" formControlName="selected_person" required>
<mat-option value="{{person.pd_co_applicant_id}}" *ngFor="let person of selectPerson">
{{person.applicant_name}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<div>
<h5>Residence Details</h5>
<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>
<input matInput placeholder="Place" formControlName="residence_place" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="City" formControlName="residence_city" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="State" formControlName="residence_state" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Pin" formControlName="residence_pin" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Number of yrs" formControlName="residence_No_of_years" type="number" required>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Ownership" formControlName="residence_ownership" required>
<mat-option value="{{ownerShip.id}}" *ngFor="let ownerShip of ownerShipData">
{{ownerShip.name}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Income / Revenue"
formControlName="income" required>
<mat-form-field *ngIf="familyForm.get('residence_ownership').value == 4">
<input matInput placeholder="Please specify" formControlName="ownershipOther">
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Name of Employer / Business"
formControlName="employer_name" required>
<mat-form-field *ngIf="familyForm.get('residence_ownership').value == 3">
<input matInput placeholder="Rent Amount" formControlName="rent">
</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-form-field>
<input matInput placeholder="Number of Family Members" formControlName="total_number_of_family_members" (focusout)="getNumberOfFamilyMemberDetails()"
type="number" max='20' min='1'>
</mat-form-field>
</div>
</mat-card>
<div>
<div formArrayName="family_members_details">
<div *ngFor="let item of familyForm.controls.family_members_details['controls']; let i=index" [formGroupName]="i">
<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">
<div>
<mat-form-field>
<input matInput placeholder="Name"
formControlName="non_earning_member_name" required>
<input matInput placeholder="Name" formControlName="family_member_name" required>
</mat-form-field>
<!--<mat-form-field>
<input matInput placeholder="Relationship" formControlName="family_member_relationship" required>
</mat-form-field>-->
<mat-form-field>
<input matInput placeholder="Age" (keypress)="keyPress($event)"
formControlName="non_earning_member_age" required>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Relation"
formControlName="relationship" required>
<mat-option value="{{relation.relationship_id}}"
*ngFor="let relation of relationData">
<mat-select placeholder="Relationship" formControlName="family_member_relationship" required>
<mat-option value="{{relation.relationship_id}}" *ngFor="let relation of relationData">
{{relation.name}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Occupation"
formControlName="occupation" required>
<mat-option value="{{occupation.occupation_non_earning_member_id}}"
*ngFor="let occupation of occupationData">{{occupation.name}}
<input matInput placeholder="Age" formControlName="family_member_age" required>
</mat-form-field>
</div>
<div>
<mat-form-field>
<mat-select placeholder="Earning Status" formControlName="family_member_earning_status" required>
<mat-option value="{{earnings.id}}" *ngFor="let earnings of earningStatus">
{{earnings.type}}
</mat-option>
</mat-select>
</mat-form-field>
<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">
<div *ngIf="item.get('family_member_earning_status').value == 1">
<!--<pre>{{ customerSegData | json}}</pre>-->
<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-select placeholder="Segment" formControlName="earning_segment" required>
<mat-option value="{{segment.customer_segment_id}}" *ngFor="let segment of customerSegData">
{{segment.name}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="ownership.value ==4">
<input matInput placeholder="Please specify" formControlName="ownershipOther">
<mat-form-field>
<input matInput placeholder="Income Per Month" formControlName="earning_gross_income_per_month" required>
</mat-form-field>
<mat-form-field *ngIf="ownership.value ==3">
<input matInput placeholder="Rent Amount"
formControlName="rent">
<mat-form-field>
<input matInput placeholder="Name of the Employer/Business" formControlName="earning_name_of_the_employer_or_business" required>
</mat-form-field>
</mat-card-content>
<mat-form-field>
<input matInput placeholder="No. of years in Employer/Business" formControlName="earning_number_of_years_in_employment_or_business"
required>
</mat-form-field>
</div>
<div *ngIf="item.get('family_member_earning_status').value == 2">
<mat-form-field>
<mat-select placeholder="Occupation" formControlName="non_earning_occupation" required>
<mat-option value="{{occupation.occupation_non_earning_member_id}}" *ngFor="let occupation of occupationData">
{{occupation.name}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="item.get('non_earning_occupation').value==9">
<input matInput placeholder="Specify Others" formControlName="non_earning_if_others" required>
</mat-form-field>
<mat-form-field *ngIf="item.get('non_earning_occupation').value==3">
<input matInput placeholder="Retired From" formControlName="non_earning_if_retired_from" type="date" required>
</mat-form-field>
</div>
</mat-card>
</div>
</div>
</div>
</mat-card-content>
</mat-card>
@ -170,112 +153,98 @@
<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 ngxViewer>
<div fxLayout="row wrap" style="padding:20px;">
<div fxFlex="100">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
</div>
</div>
</div>
<div fxFlex="row">
<div fxFlex="100" class="m-gap p-gap">
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
</div>
</div>
</div>
</div>
</ng-template>
</mat-tab>
@ -311,7 +280,7 @@
<mat-card-content>
<p>Family Details</p>
<form class="address" [formGroup]="familyForm"> -->
<!-- <mat-form-field>
<!-- <mat-form-field>
<mat-select placeholder="Person Met" formControlName="person" required>
<mat-option *ngFor="let personMet of personMetData" [value]="personMet.person_met_id">
{{personMet.person_met_name}}
@ -321,7 +290,7 @@
<mat-form-field *ngIf="person.value ==8">
<input matInput placeholder="Enter the relationship" formControlName="personOther">
</mat-form-field> -->
<!-- <mat-form-field>
<!-- <mat-form-field>
<input matInput placeholder="Number Of Family Members" formControlName="members" required>
</mat-form-field>
<mat-card>

View File

@ -30,22 +30,28 @@ import {ActivatedRoute, Router} from "@angular/router";
})
export class FamilyDetailsComponent implements OnInit {
//@Input() pdid: number;
pageTitle: string ="Family Details";
pageTitle: string ="Other Family Details";
pdid : string;
form_id : number;
public currentLoanForm: FormGroup;
private notifier: NotifierService;
public familyForm: FormGroup;
public selectPerson;
// selectPerson = [{
// name : 'person 1',
// id : 111
// }, {
// name : 'person 2',
// id : 222
// }];
// public person: AbstractControl;
// public personOther: AbstractControl;
public members: AbstractControl;
public residence: AbstractControl;
public years: AbstractControl;
public ownership: AbstractControl;
public ownershipOther: AbstractControl;
public rent: AbstractControl;
earningStatus = [{
type: 'Earning',
id: 1
}, {
type: 'Non Earning',
id: 2
}]
relationData: any = [];
occupationData: any = [];
@ -59,6 +65,8 @@ export class FamilyDetailsComponent implements OnInit {
private router: Router,
private _pd: PdTrigerService,
@Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
console.log(pd_all_details);
this.selectPerson = this.pd_all_details.pdapplicants_detials;
this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.form_id = 6;
this.notifier = notifier;
@ -68,7 +76,7 @@ export class FamilyDetailsComponent implements OnInit {
this.getMasterDetails('OCCUPATIONMEMBERS',2);
//this.getMasterDetails('PERSONSMET',3);
this.getMasterDetails('RESIDENCEOWNERSHIP',4);
this.getMasterDetails('CUSTOMERSEGMENT',5)
this.getMasterDetails('CUSTOMERSEGMENT',5);
this.initFamilyForm();
let params: any = {};
params.pd_id = this.pdid;
@ -77,131 +85,112 @@ export class FamilyDetailsComponent implements OnInit {
const control = <FormArray>this.familyForm.controls['nonEarningMembers'];
const value = <FormArray>this.familyForm.controls['earningMembers'];
if (data.status == 200) {
var result = Object.keys(data.records.non_earning_members).map(function (key) {
return data.records.non_earning_members[key];
});
var earning = Object.keys(data.records.earning_members).map(function (key) {
return data.records.earning_members[key];
});
// this.familyForm.controls.person.setValue(data.records.person_met);
// if (data.records.person_met_other) {
// this.familyForm.controls.personOther.setValue(data.records.person_met_other);
// }
this.familyForm.controls.members.setValue(data.records.family_members);
this.familyForm.controls.years.setValue(data.records.no_of_years);
this.familyForm.controls.ownership.setValue(data.records.ownership);
this.familyForm.controls.selected_person.setValue(data.records.selected_person);
this.familyForm.controls.residence_place.setValue(data.records.residence_place);
this.familyForm.controls.residence_city.setValue(data.records.residence_city);
this.familyForm.controls.residence_state.setValue(data.records.residence_state);
this.familyForm.controls.residence_pin.setValue(data.records.residence_pin);
this.familyForm.controls.residence_No_of_years.setValue(data.records.residence_No_of_years);
this.familyForm.controls.residence_ownership.setValue(data.records.residence_ownership);
this.familyForm.controls.ownershipOther.setValue(data.records.ownershipOther);
this.familyForm.controls.rent.setValue(data.records.rent);
this.familyForm.controls.total_number_of_family_members.setValue(data.records.total_number_of_family_members);
this.familyForm.controls.family_details_form_remark.setValue(data.records.family_details_form_remark);
this.generateFamilyMembersDetailsGetData(data.records.family_members_details);
} else {
// value.push(this.createMembers());
// control.push(this.createNonMembers());
}
});
}
if (data.records.ownership_others) {
this.familyForm.controls.ownershipOther.setValue(data.records.ownership_others);
initgenerateFamilyMembersDetailsGet(val): FormGroup {
return this.fb.group({
family_member_name : [val.family_member_name, Validators.compose([])],
family_member_relationship : [val.family_member_relationship, Validators.compose([])],
family_member_age : [val.family_member_age, Validators.compose([])],
family_member_earning_status : [val.family_member_earning_status, Validators.compose([])],
earning_segment: [val.earning_segment, Validators.compose([])],
earning_gross_income_per_month: [val.earning_gross_income_per_month, Validators.compose([])],
earning_name_of_the_employer_or_business: [val.earning_name_of_the_employer_or_business, Validators.compose([])],
earning_number_of_years_in_employment_or_business: [val.earning_number_of_years_in_employment_or_business, Validators.compose([])],
non_earning_occupation: [val.non_earning_occupation, Validators.compose([])],
non_earning_if_others: [val.non_earning_if_others, Validators.compose([])],
non_earning_if_retired_from: [val.non_earning_if_retired_from, Validators.compose([])],
})
}
this.familyForm.controls.rent.setValue(data.records.what_rent);
if (result.length == 0) {
control.push(this.createNonMembers());
} else {
result.forEach(datas => {
control.push(this.createNonMembers());
generateFamilyMembersDetailsGetData(data) {
var result = Object.keys(data).map(function (key) {
return data[key];
});
this.familyForm.controls.nonEarningMembers.setValue(result);
if (result.length > 0) {
for (let val of result) {
const control = <FormArray>this.familyForm.controls['family_members_details'];
control.push(this.initgenerateFamilyMembersDetailsGet(val));
}
if (earning.length == 0) {
value.push(this.createMembers());
} else {
earning.forEach(datas => {
value.push(this.createMembers());
});
this.familyForm.controls.earningMembers.setValue(earning);
}
this.familyForm.controls.residence.setValue(data.records.residence);
} else {
value.push(this.createMembers());
control.push(this.createNonMembers());
}
});
onSearchChange(e):void {
e.preventDefault();
}
public initFamilyForm(): void {
this.familyForm = this.fb.group({
// person: ['', Validators.compose([Validators.required])],
// personOther: [''],
members: ['', Validators.compose([Validators.required])],
residence: ['', Validators.compose([Validators.required])],
years: ['', Validators.compose([Validators.required])],
ownership: ['', Validators.compose([Validators.required])],
selected_person: ['', Validators.compose([Validators.required])],
residence_place: ['', Validators.compose([])],
residence_city: ['', Validators.compose([])],
residence_state: ['', Validators.compose([])],
residence_pin: ['', Validators.compose([])],
residence_No_of_years: ['', Validators.compose([])],
residence_ownership: ['', Validators.compose([])],
ownershipOther: [''],
rent: [''],
earningMembers: this.fb.array([]),
nonEarningMembers: this.fb.array([]),
total_number_of_family_members: ['', Validators.compose([Validators.min(1), Validators.max(20)])],
family_members_details: this.fb.array([]),
family_details_form_remark: ['']
});
// this.person = this.familyForm.controls['person'];
// this.personOther = this.familyForm.controls['personOther'];
this.members = this.familyForm.controls['members'];
this.residence = this.familyForm.controls['residence'];
this.years = this.familyForm.controls['years'];
this.ownership = this.familyForm.controls['ownership'];
this.ownershipOther = this.familyForm.controls['ownershipOther'];
this.rent = this.familyForm.controls['rent'];
}
createMembers(): FormGroup {
getNumberOfFamilyMemberDetails(){
// alert(this.familyForm.controls.total_number_of_family_members.valid);
if(this.familyForm.controls.total_number_of_family_members.valid){
let totalMem = this.familyForm.get('total_number_of_family_members').value;
const control = <FormArray>this.familyForm.controls.family_members_details;
if(totalMem > control.length) {
let len = totalMem - control.length;
for(let i = 0; i < len; i++){
control.push(this.generateFamilyMembersDetailsGet());
}
} else if (totalMem < control.length) {
// control.controls.slice(0, totalMem);
control.controls = [];
for(let i = 0; i < totalMem; i++){
control.push(this.generateFamilyMembersDetailsGet());
}
}
} else {
}
}
generateFamilyMembersDetailsGet(): FormGroup {
return this.fb.group({
earning_member_name : ['', Validators.compose([Validators.required])],
earning_member_age : ['', Validators.compose([Validators.required])],
relation: ['', Validators.compose([Validators.required])],
segment: ['', Validators.compose([Validators.required])],
income: ['', Validators.compose([Validators.required])],
employer_name: ['', Validators.compose([Validators.required])],
});
}
createNonMembers(): FormGroup {
return this.fb.group({
non_earning_member_name : ['', Validators.compose([Validators.required])],
non_earning_member_age : ['', Validators.compose([Validators.required])],
relationship: ['', Validators.compose([Validators.required])],
occupation: ['', Validators.compose([Validators.required])],
retired: [''],
others_occupation : ['']
});
family_member_name : ['', Validators.compose([])],
family_member_relationship : ['', Validators.compose([])],
family_member_age : ['', Validators.compose([])],
family_member_earning_status : ['', Validators.compose([])],
earning_segment: ['', Validators.compose([])],
earning_gross_income_per_month: ['', Validators.compose([])],
earning_name_of_the_employer_or_business: ['', Validators.compose([])],
earning_number_of_years_in_employment_or_business: ['', Validators.compose([])],
non_earning_occupation: ['', Validators.compose([])],
non_earning_if_others: ['', Validators.compose([])],
non_earning_if_retired_from: ['', Validators.compose([])],
})
}
addearningMembers() {
const control = <FormArray>this.familyForm.controls['earningMembers'];
//this.earnMemberArrCount = control.length;
if(control.length == this.familyForm.controls['members'].value)
{
}else{
control.push(this.createMembers());
//console.log('Add earn member',this.familyForm.controls['members'].value);
}
// console.log(this.earnMemberArrCount);
// console.log(this.nonEarnMemberArrCount);
}
addMembers() {
const control = <FormArray>this.familyForm.controls['nonEarningMembers'];
this.count++;
// this.nonEarnMemberArrCount = control.length;
// console.log(this.earnMemberArrCount);
// console.log(this.nonEarnMemberArrCount);
// if(control.length == this.familyForm.controls['members'].value)
// {
// }else{
// control.push(this.createNonMembers());
// }
}
deleteEarningMembers(index) {
const control = <FormArray>this.familyForm.controls['earningMembers'];
control.removeAt(index);
}
deleteMembers(index) {
const control = <FormArray>this.familyForm.controls['nonEarningMembers'];
control.removeAt(index);
}
// get all master details
getMasterDetails(table:string,type:number){
this._pd.getAllMasterDatas(table).subscribe(
@ -231,43 +220,10 @@ export class FamilyDetailsComponent implements OnInit {
if (!this.familyForm.valid) {
return;
}
let records: any = {};
records.no_of_years = this.years.value;
if (this.ownership.value == 4) {
records.ownership_others = this.ownershipOther.value;
}
records.ownership = this.ownership.value;
records.residence = this.residence.value;
if (this.ownership.value == 3) {
records.what_rent = this.rent.value;
}
// if (this.person.value == 8) {
// records.person_met_other = this.personOther.value;
// }
//records.person_met = this.person.value;
records.family_members = this.members.value;
records.earning_members = this.familyForm.controls['earningMembers'].value;
// filter re conditions
let non_earning_members_filter = this.familyForm.controls['nonEarningMembers'].value.map(function(obj) {
console.log(obj.occupation);
if(obj.occupation==3){
return obj;
}
else{
obj.retired='';
return obj;
}
if(obj.occupation==9){
return obj;
}
else{
obj.others_occupation='';
return obj;
}
});
records.non_earning_members = non_earning_members_filter;
records.family_details_form_remark = this.familyForm.controls['family_details_form_remark'].value;
var records = this.familyForm.value;
//To Remove The "Null" With Key also
Object.keys(records).forEach((key) => (records[key] == null) && delete records[key]);
// records.other_family_details = answerFormValues;
records.pdid = this.pdid;
records.formid = '6';
// records.fk_createdby = '251';
@ -277,25 +233,26 @@ export class FamilyDetailsComponent implements OnInit {
this.notifier.notify('warning', 'Something Wents Wrong Try Again.!');
});
}
validateAllFormFields(formGroup: FormGroup) {
Object.keys(formGroup.controls).forEach(field => {
const control = formGroup.get(field);
if (control instanceof FormControl) {
control.markAsTouched({onlySelf: true});
} else if (control instanceof FormGroup) {
this.validateAllFormFields(control);
}
});
}
// validateAllFormFields(formGroup: FormGroup) {
// Object.keys(formGroup.controls).forEach(field => {
// const control = formGroup.get(field);
// if (control instanceof FormControl) {
// control.markAsTouched({onlySelf: true});
// } else if (control instanceof FormGroup) {
// this.validateAllFormFields(control);
// }
// });
// }
/** On Key Press Event For Age */
keyPress(event: any) {
const pattern = /[0-9]/;
// /** On Key Press Event For Age */
// keyPress(event: any) {
// const pattern = /[0-9]/;
let inputChar = String.fromCharCode(event.charCode);
if (event.keyCode != 8 && !pattern.test(inputChar)) {
event.preventDefault();
}
}
// let inputChar = String.fromCharCode(event.charCode);
// if (event.keyCode != 8 && !pattern.test(inputChar)) {
// event.preventDefault();
// }
// }
}

View File

@ -0,0 +1,31 @@
<h2 mat-dialog-title class="paragraph_change">
<div fxFlex="70" align="left" style="padding: 10px !important;">{{pageTitle}}</div>
<div fxFlex="30" align="end" style="padding: 10px !important;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Close" matTooltipPosition="right"
mat-dialog-close><mat-icon>close</mat-icon></button>
</div>
</h2>
<div *ngIf="noRecordsFound" style="max-width: 100vw !important;width: 100% !important;height: 95% !important;">
<form [formGroup]="_finalRemarkForm" (submit)="onSubmit()" novalidate>
<mat-dialog-content>
<mat-card>
<mat-form-field>
<mat-select placeholder="Customer Behaviour" formControlName="final_custormer_remark_type">
<mat-option *ngFor="let pm of m_remarkTypeCustomerBehaviour" [value]="pm.customer_behaviour_id">{{ pm.description }}</mat-option>
</mat-select>
</mat-form-field>
</mat-card>
</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="final_form_remarks"></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>
</div>

View File

@ -0,0 +1,96 @@
// .example-full-width{
// width : 100%;
// }
.paragraph_change {
color: #fff !important;
background-color: #e00201 !important;
}
// ::ng-deep .cdk-overlay-pane{
// max-width: 100vw !important;
// width: 100% !important;
// height: 95% !important;
// }
.mat-card-content {
background-color: white;
}
.mat-card-actions {
background-color: white;
}
::ng-deep .cdk-global-overlay-wrapper{
justify-content: center !important;
}
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);
}
}
}
}
}

View File

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { FinalRemarksComponent } from './final-remarks.component';
describe('FinalRemarksComponent', () => {
let component: FinalRemarksComponent;
let fixture: ComponentFixture<FinalRemarksComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ FinalRemarksComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(FinalRemarksComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,162 @@
import {
Component,
OnInit,
Inject,
Input
} from '@angular/core';
import {
FormBuilder,
FormGroup,
Validators,
FormArray, FormControl,
} from '@angular/forms';
import { NotifierService } from 'angular-notifier';
import {
MatDialog,
MatDialogRef,
MAT_DIALOG_DATA
} from '@angular/material';
/** Service */
import { PdTrigerService } from '../../../../../pd-service/pd-triger.service';
import {ActivatedRoute, Router} from '@angular/router';
import { analyzeAndValidateNgModules } from '@angular/compiler';
@Component({
selector: 'app-final-remarks',
templateUrl: './final-remarks.component.html',
styleUrls: ['./final-remarks.component.scss']
})
export class FinalRemarksComponent implements OnInit {
pageTitle: string = "Final Remarks Details";
//@Input() pdid: number;
pdid: string;
form_id: number;
public _finalRemarkForm: FormGroup;
public submitted = false;
public m_remarkTypeCustomerBehaviour = [];
private notifier: NotifierService;
constructor(
notifier: NotifierService,
private _formBuilder: FormBuilder,
private pdTrigerService: PdTrigerService,
@Inject(MAT_DIALOG_DATA) public pd_all_details: any) {
this.pdid = this.pd_all_details.pdmaster_details.pd_id;
this.form_id = 20;
this.notifier = notifier;
this._finalRemarkForm = this._formBuilder.group({
pdid: [this.pdid],
formid: ['20'],
final_custormer_remark_type : [],
final_form_remarks: []
});
this.getM_Type();
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
noRecordsFound: Boolean = false;
ngOnInit() {
this.pdTrigerService.getPDFormDetailsWithID(this.pdid, '20').subscribe(data=>{
if(data.dataStatus){
this._finalRemarkForm.controls.final_custormer_remark_type.setValue(data.records.final_custormer_remark_type);
this._finalRemarkForm.controls.final_form_remarks.setValue(data.records.final_form_remarks);
this.noRecordsFound = true;
} else {
this.noRecordsFound = true;
}
}, err => {
})
}
getM_Type() {
this.pdTrigerService.getAllMasterDatas('CUSTOMERBEHAVIOUR').subscribe(
data => {
this.m_remarkTypeCustomerBehaviour = data.records.filter(data => data.isactive == 1);
},
error => {
// this.notifier.notify('warning', 'No Category Records Found.!');
// this.m_assets_type = "No Category Records Found.";
}
)
}
// ==================
/** To Save/Edited Popup Data */
onSubmit() {
this.submitted = true;
// stop here if form is invalid
if (this._finalRemarkForm.invalid) {
return;
} else {
var answerFormValues = this._finalRemarkForm.value;
//To Remove The "Null" With Key also
Object.keys(answerFormValues).forEach((key) => (answerFormValues[key] == null) && delete answerFormValues[key]);
console.log(JSON.stringify(answerFormValues));
//Add BRANCH data with help Service File
this.pdTrigerService.savePDFormDetailsWithID(answerFormValues).subscribe(
dataresult => {
if (dataresult.status == 200) {
// console.log(dataresult);
this.notifier.notify('success', 'Record Saved Successfully.!');
// this.dialogRef.close();
// alert("sample alert for Saving");
}
else {
this.notifier.notify('warning', 'Something Wents Wrong Try Again.!');
// this.errorMessage = "Some Thing Wents Wrong Try Again !";
}
}, error => {
this.notifier.notify('warning', 'Something Wents Wrong Try Again.!');
// this.errorMessage = "Something Wents Wrong Try Again !";
// this.dialogRef.close();
});
// //After Saving the BRANCH data then popup close
// // this.dialogRef.close();
}
}
/** To Reset Popup Data */
onReset() {
// this._addQuesFrom.reset();
}
/** On Key Press Event For Mobile Number */
keyPress(event: any) {
const pattern = /[0-9]/;
let inputChar = String.fromCharCode(event.charCode);
if (event.keyCode != 8 && !pattern.test(inputChar)) {
event.preventDefault();
}
}
}

View File

@ -13,7 +13,6 @@
<mat-dialog-content>
<mat-tab-group>
<mat-tab label="Questions">
<ng-template matTabContent>
@ -61,16 +60,18 @@
</span>
<span *ngIf="details.get('finanical_profit_or_loss').value == 2 ">
<mat-form-field>
<input matInput placeholder="Net Loss Amount" formControlName="financial_net_loss" (change)="calMargin( i, details); calYearVariation( i, details)" type="number" required>
<input matInput placeholder="Net Loss Amount" formControlName="financial_net_loss" (change)="calMargin( i, details); calYearVariation( i, details)" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field>
<input matInput placeholder="Net Loss to Sales %" formControlName="financial_margin_of_loss" (keypress)="keyPress($event)" required>
</mat-form-field>
</span>
<mat-form-field *ngIf="i != 0">
<mat-form-field *ngIf="i != 0" style="width:65%">
<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-hint align="end" *ngIf="i != 0" [ngClass]="{'highlight': (details.controls['financial_variation'].value > 40) || (details.controls['financial_variation'].value < -40)}" >{{SalesStatement[i]}}</mat-hint>
</mat-form-field>
<mat-form-field>
<mat-form-field *ngIf="customerCommentsFlag" style="width:65%">
<!-- <input matInput placeholder="Reason For Major Difference" formControlName="financial_reason" required> -->
<input matInput placeholder="Customer Comments on variances in Financials" formControlName="financial_reason" required>
</mat-form-field>
@ -96,33 +97,60 @@
<mat-card-header>
<p>Actual Values as per Customer<p>
</mat-card-header>
<mat-form-field *ngIf="total_financial_year != ''">
<mat-select placeholder="Same as Financial Statements?" formControlName="same_as_financial_statements" (selectionChange)="selectedType($event)">
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<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> -->
<input matInput placeholder="Year (format: 2015-2016)" formControlName="estimate_year" required>
<input matInput placeholder="Year" 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>
<input matInput placeholder="Annual Sale" formControlName="estimate_annual_sale" (change)="calMarginVal( i, details)" (keypress)="keyPress($event)" 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>
<!-- <input matInput placeholder="Net Profit / Loss" formControlName="financial_net_profit" (change)="calMargin( i, details); calYearVariation( i, details)" type="number" required> -->
<mat-select placeholder="Is there Net Profit or Net Loss?" formControlName="estimate_profit_or_loss" required>
<mat-option value="1" >Net Profit</mat-option>
<mat-option value="2" >Net Loss</mat-option>
</mat-select>
</mat-form-field>
<span *ngIf="details.get('estimate_profit_or_loss').value == 1 ">
<mat-form-field>
<input matInput placeholder="Net Profit Amount" formControlName="estimate_net_profit" (change)="calMarginVal( i, details); calVariation( i, details)" required>
</mat-form-field>
<mat-form-field>
<input matInput disabled placeholder="Margin" formControlName="estimate_margin" (keypress)="keyPress($event)" required>
<input matInput disabled placeholder="Margin" formControlName="estimate_margin_of_profit" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field *ngIf="i != 0">
</span>
<span *ngIf="details.get('estimate_profit_or_loss').value == 2 ">
<mat-form-field>
<input matInput placeholder="Net Loss" formControlName="estimate_net_loss" (change)="calMarginVal( i, details); calVariation( i, details)" required>
</mat-form-field>
<mat-form-field>
<input matInput disabled placeholder="Margin" formControlName="estimate_margin_of_loss" (keypress)="keyPress($event)" (change)="calAmount( i, details); calVariation( i, details)" required>
</mat-form-field>
</span>
<mat-form-field *ngIf="i != 0" style="width:65%">
<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-hint align="end" [ngClass]="{'highlight': (details.controls['estimate_variation'].value >= 40) || (details.controls['estimate_variation'].value < -40)}" > {{details.controls['estimate_variation'].value}} {{details.controls['estimate_year'].value}}
<!-- 'details.controls['estimate_variation'].value <= 0' ? 'Decreases ' : 'Increases ' + 'in Sales in FY ' + curr_year + ' Over Sales in FY '+ prev_year + ' is ' + {{details.controls['estimate_variation'].value}} + '%'; -->
</mat-hint>
</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()"
<!-- <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> -->
<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>
@ -139,112 +167,98 @@
</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 ngxViewer>
<div fxLayout="row wrap" style="padding:20px;">
<div fxFlex="100">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
</div>
</div>
</div>
<div fxFlex="row">
<div fxFlex="100" class="m-gap p-gap">
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
</div>
</div>
</div>
</div>
</ng-template>
</mat-tab>

View File

@ -17,9 +17,9 @@
// background: #62B013;
// color: white;
// }
// .highlight {
// color: red;
// }
.highlight {
color: red;
}
.paragraph_change {

View File

@ -34,9 +34,11 @@ export class FinancialInfoComponent implements OnInit {
form_id: number;
public financialForm: FormGroup;
private notifier: NotifierService;
SalesStatement : any = [];
marginVal: any = [] ;
placeholderName : any = [];
setmargin: AbstractControl;
customerCommentsFlag :boolean;
constructor(notifier: NotifierService,
private fb: FormBuilder,
private route: ActivatedRoute,
@ -48,6 +50,25 @@ export class FinancialInfoComponent implements OnInit {
this.form_id = 14;
this.notifier = notifier;
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
ngOnInit() {
this.initstockForm();
@ -77,11 +98,11 @@ export class FinancialInfoComponent implements OnInit {
}
if (result_val.length > 0) {
result_val.forEach(val => {
estimated_val.push(this.createValue());
estimated_val.push(this.createValue(''));
});
retriveData.estimated_value = result_val;
} else {
estimated_val.push(this.createValue());
estimated_val.push(this.createValue(''));
}
retriveData.pdid = this.pdid;
retriveData.formid = this.form_id;
@ -89,7 +110,7 @@ export class FinancialInfoComponent implements OnInit {
this.financialForm.setValue(retriveData);
} else {
//financial_date.push(this.createDate());
estimated_val.push(this.createValue());
//estimated_val.push(this.createValue(''));
}
})
}
@ -101,6 +122,7 @@ export class FinancialInfoComponent implements OnInit {
financial_remarks: ['', Validators.compose([Validators.required])],
staring_financial_year : ['', Validators.compose([Validators.required])],
total_financial_year : ['', Validators.compose([Validators.required])],
same_as_financial_statements:[''],
date_per_financial: this.fb.array([]),
estimated_value: this.fb.array([])
});
@ -128,16 +150,36 @@ export class FinancialInfoComponent implements OnInit {
financial_reason: ['', Validators.compose([Validators.required])],
});
}
createValue() {
createValue(date) {
return this.fb.group({
estimate_year: ['', Validators.compose([Validators.required, Validators.pattern(/^[0-9]{4}-[0-9]{2}$/)])],
estimate_year: [date, Validators.compose([Validators.required, Validators.pattern(/^[0-9]{4}-[0-9]{2}$/)])],
estimate_annual_sale: ['', Validators.compose([Validators.required, Validators.pattern(/^[0-9\(\)]+$/)])],
estimate_profit_or_loss:['', Validators.compose([Validators.required])],
estimate_net_profit: ['', Validators.compose([Validators.required, Validators.pattern(/^-?[1-9]\d*|0$/)])],
estimate_margin: ['', Validators.compose([Validators.required])],
estimate_net_loss: ['', Validators.compose([Validators.pattern(/^-?[1-9]\d*|0$/)])],
//estimate_margin: ['', Validators.compose([Validators.required])],
estimate_margin_of_profit: [''],
estimate_margin_of_loss: [''],
estimate_variation: [''],
// estimate_reason: ['', Validators.compose([Validators.required])],
});
}
createValuewithData(value) {
return this.fb.group({
estimate_year: [value.estimate_year, Validators.compose([Validators.required, Validators.pattern(/^[0-9]{4}-[0-9]{2}$/)])],
estimate_annual_sale: [value.estimate_annual_sale, Validators.compose([Validators.required, Validators.pattern(/^[0-9\(\)]+$/)])],
estimate_profit_or_loss:[value.estimate_profit_or_loss, Validators.compose([Validators.required])],
estimate_net_loss: [value.estimate_net_loss, Validators.compose([Validators.pattern(/^-?[1-9]\d*|0$/)])],
estimate_net_profit: [value.estimate_net_profit, Validators.compose([Validators.required, Validators.pattern(/^-?[1-9]\d*|0$/)])],
//estimate_margin: [value., Validators.compose([Validators.required])],
estimate_margin_of_profit: [value.estimate_margin_of_profit],
estimate_margin_of_loss: [value.estimate_margin_of_loss],
estimate_variation: [value.estimate_variation],
// estimate_reason: ['', Validators.compose([Validators.required])],
});
}
addDate() {
const control = <FormArray>this.financialForm.controls['date_per_financial'];
//control.push(this.createDate());
@ -148,7 +190,7 @@ export class FinancialInfoComponent implements OnInit {
}
addGoods() {
const control = <FormArray>this.financialForm.controls['estimated_value'];
control.push(this.createValue());
//control.push(this.createValue());
}
deleteGoods(index) {
const control = <FormArray>this.financialForm.controls['estimated_value'];
@ -159,6 +201,13 @@ export class FinancialInfoComponent implements OnInit {
//console.log(this.financialForm.controls['total_financial_year'].value);
//console.log('data',$event.target.value);
let e = $event.target.value;
if(e == 1){
this.customerCommentsFlag = false;
}
else{
this.customerCommentsFlag = true;
}
let startingYear = this.financialForm.controls['staring_financial_year'].value;
const control = <FormArray>this.financialForm.controls['date_per_financial'];
@ -175,6 +224,70 @@ export class FinancialInfoComponent implements OnInit {
}
}
}
selectedType(e: any): void {
console.log(e);
if(e.value == 'yes'){
let startingYear = this.financialForm.controls['staring_financial_year'].value;
let totalFinYear = this.financialForm.controls['total_financial_year'].value;
//let YearParam = (+startingYear) +'-'+ ((+startingYear+1));
let array = <FormArray>this.financialForm.controls['date_per_financial'];
const control = <FormArray>this.financialForm.controls['estimated_value'];
while (control.length !== 0) {
control.removeAt(0);
}
if(array.length > 0 ){
console.log(array.length);
for (let val of array.value) {
let vals = {
estimate_year: val.financial_year,
estimate_annual_sale: val.financial_annual_sale,
estimate_profit_or_loss:val.finanical_profit_or_loss,
estimate_net_loss: val.financial_net_loss,
estimate_net_profit: val.financial_net_profit,
estimate_margin_of_profit: val.financial_margin_of_profit,
estimate_margin_of_loss: val.financial_margin_of_loss,
estimate_variation: val.financial_variation,
};
control.push(this.createValuewithData(vals));
}
}
//control.controls[0].get('raw_quantity').setValidators([Validators.required]);
// for(let i = 1 ; i<= totalFinYear ; i++ ){
// let Year = (+startingYear+(i-1)) +'-'+ ((+startingYear)+(+i));
// control.push(this.createValue(Year));
// }
//control.push(this.createValue(YearParam));
}
else if (e.value == 'no'){
let startingYear = this.financialForm.controls['staring_financial_year'].value;
let totalFinYear = this.financialForm.controls['total_financial_year'].value;
const control = <FormArray>this.financialForm.controls['estimated_value'];
while (control.length !== 0) {
control.removeAt(0);
}
if(totalFinYear > 0 ){
for(let i = 1 ; i<= totalFinYear ; i++ ){
let Year = (+startingYear+(i-1)) +'-'+ ((+startingYear)+(+i));
control.push(this.createValue(Year));
//console.log(this.financialForm.controls['staring_financial_year'].value);
}
}
}
}
// calYearVariation(index, detail) {
// let profit = detail.value.financial_net_profit;
// if ( profit != '' && index != 0) {
@ -190,20 +303,28 @@ export class FinancialInfoComponent implements OnInit {
let profit = detail.value.financial_net_profit;
let loss = detail.value.financial_net_loss;
let curr_year = detail.value.financial_year;
this.SalesStatement[0] = 0.00;
if ( profit != '' || loss != '' && index != 0) {
if ( (profit != '' || loss != '') && index != 0) {
let array = <FormArray>this.financialForm.controls['date_per_financial']
let array = <FormArray>this.financialForm.controls['date_per_financial'];
console.log(array.value[index - 1].financial_net_profit);
let prev_profit = array.value[index - 1].financial_net_profit != '' ? array.value[index - 1].financial_net_profit : 0;
let prev_loss = array.value[index - 1].financial_net_loss !='' ? array.value[index - 1].financial_net_loss : 0 ;
let prev_year = array.value[index - 1].financial_year;
let variation = (((profit != '' ? profit : loss ) - ( prev_profit != '' ? prev_profit : prev_loss ))/ (prev_profit != '' ? prev_profit : prev_loss)) * 100;
detail.controls.financial_variation.setValue(variation.toFixed(2));
//Increase in Sales in FY 2017-18 over sales in FY 2016-17 is 11.11%
console.log('variation',variation);
this.SalesStatement[index] = ( variation <= 0 ? 'Decreases ' : 'Increases ' ) + 'in Sales in FY ' + curr_year + ' Over Sales in FY '+ prev_year + ' is ' + variation.toFixed(2) + '%';
console.log('this.SlesStatement',this.SalesStatement);
}
// if(detail.value.finanical_profit_or_loss == 1){
@ -260,29 +381,121 @@ export class FinancialInfoComponent implements OnInit {
if (salary != '' && loss != '') {
let margin = (loss / salary) * 100;
detail.controls.financial_margin_of_loss.setValue(margin.toFixed(2))
detail.controls.financial_margin_of_loss.setValue(margin.toFixed(2));
// detail.controls.financial_margin.disable()
}
}
}
calVariation(index, detail) {
// console.log('CalVar In');
// let profit = detail.value.estimate_net_profit;
// let curr_year = detail.value.financial_year;
// if ( profit != '' && index != 0) {
// let array = <FormArray>this.financialForm.controls['estimated_value']
// let prev_profit = array.value[index - 1].estimate_net_profit;
// let variation = ((profit - prev_profit) / prev_profit) * 100;
// detail.controls.estimate_variation.setValue(variation.toFixed(2))
// let prev_year = array.value[index - 1].financial_year;
// // detail.controls.estimate_variation.disable()
// }
let profit = detail.value.estimate_net_profit;
if ( profit != '' && index != 0) {
let array = <FormArray>this.financialForm.controls['estimated_value']
let prev_profit = array.value[index - 1].estimate_net_profit;
let variation = ((profit - prev_profit) / prev_profit) * 100;
detail.controls.estimate_variation.setValue(variation.toFixed(2))
// detail.controls.estimate_variation.disable()
let loss = detail.value.estimate_net_loss;
let curr_year = detail.value.estimate_year;
if ( (profit != '' || loss != '') && index != 0) {
let array = <FormArray>this.financialForm.controls['estimated_value'];
console.log(array.value[index - 1].financial_net_profit);
let prev_profit = array.value[index - 1].estimate_net_profit != '' ? array.value[index - 1].estimate_net_profit : 0;
let prev_loss = array.value[index - 1].estimate_net_loss !='' ? array.value[index - 1].estimate_net_loss : 0 ;
let prev_year = array.value[index - 1].estimate_year;
let variation = (((profit != '' ? profit : loss ) - ( prev_profit != '' ? prev_profit : prev_loss ))/ (prev_profit != '' ? prev_profit : prev_loss)) * 100;
detail.controls.estimate_variation.setValue(variation.toFixed(2));
}
}
calMarginVal(index, detail) {
console.log('Margin Estimate VAR',detail);
let salary = detail.value.estimate_annual_sale;
console.log('Margin Estimate Vsalary',salary);
// if (salary != '' && profit != '') {
// let margin = profit / salary * 100;
// detail.controls.estimate_margin.setValue(margin.toFixed(2))
// // detail.controls.estimate_margin.disable()
// }
if(detail.value.estimate_profit_or_loss == 1){
let profit = detail.value.estimate_net_profit;
console.log('if Margin Profit',profit);
if (salary != '' && profit != '') {
console.log('if if Margin Estimate salary',salary);
console.log('if if Margin Profit',profit);
let margin = profit / salary * 100;
detail.controls.estimate_margin.setValue(margin.toFixed(2))
// detail.controls.estimate_margin.disable()
console.log('margin',margin);
detail.controls.estimate_margin_of_profit.setValue(margin.toFixed(2));
}
}
else if (detail.value.estimate_profit_or_loss == 2){
let loss = detail.value.estimate_net_profit;
console.log('else if Margin loss',loss);
if (salary != '' && loss != '') {
console.log('elseif if Margin Estimate salary',salary);
console.log('alseif if Margin loss',loss);
let margin = (loss / salary) * 100;
detail.controls.estimate_margin_of_loss.setValue(margin.toFixed(2));
}
}
}
calAmount(index, detail) {
let salary = detail.value.estimate_annual_sale;
if(detail.value.estimate_profit_or_loss == 1){
// let profit = detail.value.estimate_net_profit;
let margin_profit = detail.value.estimate_margin_of_profit;
if (salary != '' && margin_profit != '') {
//let margin = profit / salary * 100;
let profit = margin_profit / salary * 100;
console.log('margin',margin_profit);
console.log('profit',profit);
//detail.controls.estimate_margin_of_profit.setValue(margin.toFixed(2));
detail.controls.estimate_net_profit.setValue(profit.toFixed(2));
}
}
// else if (detail.value.estimate_profit_or_loss == 2){
// let loss = detail.value.estimate_net_profit;
// console.log('else if Margin loss',loss);
// if (salary != '' && loss != '') {
// console.log('elseif if Margin Estimate salary',salary);
// console.log('alseif if Margin loss',loss);
// let margin = (loss / salary) * 100;
// detail.controls.estimate_margin_of_loss.setValue(margin.toFixed(2));
// }
// }
}
submitDetails() {
console.log(this.financialForm.value.date_per_financial['financial_variation']);

View File

@ -51,112 +51,98 @@
<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 ngxViewer>
<div fxLayout="row wrap" style="padding:20px;">
<div fxFlex="100">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
</div>
</div>
</div>
<div fxFlex="row">
<div fxFlex="100" class="m-gap p-gap">
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
</div>
</div>
</div>
</div>
</ng-template>
</mat-tab>
</mat-tab-group>

View File

@ -32,7 +32,25 @@ export class LenderRepresentativeComponent implements OnInit {
this.form_id = 15;
this.notifier = notifier;
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
ngOnInit() {
this.initRepresentative();
let params: any = {};

View File

@ -18,12 +18,12 @@
<div fxFlex="100">
<mat-card>
<mat-form-field style="width: 25%">
<input matInput placeholder="Loan Amount Applied for ? " formControlName="loan_amount" (keypress)="keyPress($event)" (keyup)="inWords($event,1)" (change)="loanCalc()" required>
<input matInput placeholder="Loan Amount Applied for ? " formControlName="loan_amount" (keypress)="keyPress($event)" (keyup)="inWords($event,1)" (change)="loanCalc()" required autocomplete="off">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['loan_amount'].value != ''">{{"&#8377;"}} {{loanAmtInWords}} Only</mat-hint>
</mat-form-field>
<mat-form-field style="width: 25%">
<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 multiple (selectionChange)="endUserChange($event.value)" placeholder="What is the end use" formControlName="end_use" required>
<mat-option *ngFor="let enduse of m_endUseofLoad" [value]="enduse.subproduct_id">{{ enduse.name }}</mat-option>
</mat-select>
<!--<mat-select multiple placeholder="What is the end use"
formControlName="end_use" (selectionChange)="endUserChange($event)">
@ -38,7 +38,7 @@
</mat-select>-->
</mat-form-field>
<mat-form-field *ngIf="isOtherPurpose" style="width: 25%">
<input matInput placeholder="Specify End Use" formControlName="end_use_other">
<input matInput placeholder="Specify End Use" formControlName="end_use_other" autocomplete="off">
</mat-form-field>
<mat-form-field style="width: 30%">
<mat-select placeholder="Is there a balance transfer ? " (selectionChange)="selectedBalancesTransferChanges($event)"
@ -49,7 +49,7 @@
</mat-form-field>
<div *ngIf="loanDetailsForm.controls['is_transfer'].value == 'yes' && loanDetailsForm.controls['is_transfer'].value != ''">
<mat-form-field style="width: 50%">
<input matInput placeholder="What is the amount required for Balance Transfer ? " (keypress)="keyPress($event)" formControlName="balance_transfer_amount" (keyup)="inWords($event,2)" (change)="loanCalc()">
<input matInput placeholder="What is the amount required for Balance Transfer ? " (keypress)="keyPress($event)" formControlName="balance_transfer_amount" (keyup)="inWords($event,2)" (change)="loanCalc()" autocomplete="off">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['loan_amount'].value != ''">{{"&#8377;"}} {{balTxrfAmtInWords}} Only</mat-hint>
</mat-form-field>
<mat-form-field style="width:20%">
@ -67,18 +67,18 @@
</mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['lender'].value == 3" style="width: 25%">
<input matInput placeholder="Specify Others Lender" formControlName="other_bt_lender">
<input matInput placeholder="Specify Others Lender" formControlName="other_bt_lender" autocomplete="off">
</mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['is_topup'].value == 'yes' && loanDetailsForm.controls['is_topup'].value != '' " style="width: 20%">
<input matInput placeholder="Top Up Amount" (keypress)="keyPress($event)" formControlName="topup_amount" (keyup)="inWords($event,5)">
<input matInput placeholder="Top Up Amount" (keypress)="keyPress($event)" formControlName="topup_amount" (keyup)="inWords($event,5)" autocomplete="off">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['topup_amount'].value != ''">{{"&#8377;"}} {{topUpAmtInWords}} Only</mat-hint>
</mat-form-field>
</div>
<div *ngIf="loanDetailsForm.controls['is_transfer'].value != 'yes' && loanDetailsForm.controls['is_transfer'].value != '' ">
<mat-form-field style="width: 35%">
<input matInput placeholder="Amount of Own Contribution" formControlName="own_contribution" (keypress)="keyPress($event)" required (keyup)="inWords($event,4)">
<input matInput placeholder="Amount of Own Contribution" formControlName="own_contribution" (keypress)="keyPress($event)" required (keyup)="inWords($event,4)" autocomplete="off">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['own_contribution'].value != ''">{{"&#8377;"}} {{ownContributionInWords}} Only</mat-hint>
</mat-form-field>
@ -96,14 +96,14 @@
</mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['source'].value =='other'" style="width: 35%">
<input matInput placeholder="Specify Lender Name and Type" formControlName="lender_name_type">
<input matInput placeholder="Specify Lender Name and Type" formControlName="lender_name_type" autocomplete="off">
</mat-form-field>
</div>
<mat-form-field style="width: 50%">
<input matInput placeholder="EMI Comfort Level" formControlName="emi_level" (keypress)="keyPress($event)" required>
<input matInput placeholder="EMI Comfort Level" formControlName="emi_level" (keypress)="keyPress($event)" required autocomplete="off">
</mat-form-field>
<!-- <div *ngIf="productAbbr === 'HL' || productAbbr === 'LL' || productAbbr === 'LAP' "> -->
<mat-card *ngIf="mortageCardAccess">
@ -133,7 +133,7 @@
</mat-select>-->
<mat-form-field *ngIf="mortageAccess">
<input matInput placeholder="Specify Type of Property" formControlName="property_type_others">
<input matInput placeholder="Specify Type of Property" formControlName="property_type_others" autocomplete="off">
</mat-form-field>
<mat-form-field>
<mat-select multiple placeholder="Name of Owner"
@ -144,7 +144,7 @@
</mat-form-field>
<mat-form-field *ngIf="OtherOwnerFlag">
<input matInput placeholder="Specify Other Owner Name" formControlName="other_owners_name">
<input matInput placeholder="Specify Other Owner Name" formControlName="other_owners_name" autocomplete="off">
</mat-form-field>
<mat-form-field>
@ -155,7 +155,7 @@
<mat-form-field *ngIf="loanDetailsForm.controls['construction_status'].value == 4">
<input matInput placeholder="What is the approximate stage of construction (%)?"
formControlName="percentage_of_construction" (keypress)="keyPress($event)" required>
formControlName="percentage_of_construction" (keypress)="keyPress($event)" required autocomplete="off">
</mat-form-field>
<!--<mat-select placeholder="Status of construction"
@ -167,7 +167,7 @@
<mat-form-field>
<input matInput placeholder="Estimate Market Value as Per Customer"
formControlName="emv_per_customer" (keypress)="keyPress($event)" required>
formControlName="emv_per_customer" (keypress)="keyPress($event)" required autocomplete="off">
</mat-form-field>
<!-- <mat-form-field>
<input matInput placeholder="Value as Per Agreement"
@ -183,110 +183,97 @@
</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 ngxViewer>
<div fxLayout="row wrap" style="padding:20px;">
<div fxFlex="100">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
</div>
</div>
</div>
<div fxFlex="row">
<div fxFlex="100" class="m-gap p-gap">
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
</div>
</div>
</div>
</div>
</ng-template>

View File

@ -38,6 +38,7 @@ export class LoanDetailsComponent implements OnInit {
applicants: any;
productAbbr: any;
productID: any;
subProductName: any;
isOtherPurpose: boolean = false;
@ -70,8 +71,10 @@ export class LoanDetailsComponent implements OnInit {
private router: Router,
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.productID = this.pd_all_details.pdmaster_details.fk_product_id;
this.subProductName = this.pd_all_details.pdmaster_details.subproduct_name;
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);
@ -79,9 +82,28 @@ export class LoanDetailsComponent implements OnInit {
this.pdid= this.pd_all_details.pdmaster_details.pd_id;
this.notifier = notifier;
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
ngOnInit() {
console.clear();
console.log(this.pd_all_details);
this.initloanDetailsForm();
this.getM_EndUseofLoad();
this.getM_sourceofamount();
@ -123,6 +145,7 @@ export class LoanDetailsComponent implements OnInit {
if(value.records.loan_amount){ this.loanAmtInWords = this._pd.convertNumberToWords(value.records.loan_amount); }
this.loanDetailsForm.controls['end_use'].setValue(enduse);
this.endUserChange(enduse);
if (value.records.end_use_other) {
this.loanDetailsForm.controls['end_use_other'].setValue(value.records.end_use_other);
}
@ -187,9 +210,10 @@ export class LoanDetailsComponent implements OnInit {
// =============
getM_EndUseofLoad() {
this._pd.getAllMasterDatas('ENDUSEOFLOAN').subscribe(
//this._pd.getAllMasterDatas('ENDUSEOFLOAN').subscribe(
this._pd.getAllMasterDatas('SUBPRODUCTS').subscribe(
data => {
this.m_endUseofLoad = data.records.filter(data => data.isactive == 1);
this.m_endUseofLoad = data.records.filter(data => data.isactive == 1 && data.fk_product_id == this.productID);
},
error => {
// this.notifier.notify('warning', 'No Category Records Found.!');
@ -307,15 +331,33 @@ getM_sourceofamount() {
loandetails_remarks: ['', Validators.compose([Validators.required])],
});
}
// endUserChange(event) {
// this.endUserList = [];
// event.value.forEach(option => {
// this.endUserList.push({end_use: option});
// if (option == 'other') {
// this.isOtherPurpose = true;
// }
// });
// }
endUserChange(event) {
this.endUserList = [];
event.value.forEach(option => {
this.endUserList.push({end_use: option});
if (option == 'other') {
event.forEach(option => {
let othersData = this.m_endUseofLoad.filter(sub=>sub.subproduct_id==option)[0];
othersData = othersData.name.substr(0,6).toLowerCase();
this.endUserList.push({ end_use: option });
if (othersData == 'others') {
this.isOtherPurpose = true;
return ;
}else
{
this.isOtherPurpose = false;
}
});
}
ownerNameChange(event) {
let EventValue;

View File

@ -1,7 +1,6 @@
<form [formGroup]="_neighbourhoodForm" novalidate>
<h2 mat-dialog-title class="paragraph_change">
<div fxFlex="70" align="left" style="padding: 10px !important;">
<div fxFlex="70" align="left">
<div fxLayout="row wrap">
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="100" fxFlex.xl="100">
{{pageTitle}}
@ -10,19 +9,21 @@
</div>
</div>
<div fxFlex="30" align="end" style="padding: 10px !important;">
<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>
<h6>
<mat-dialog-content>
<mat-card>
<mat-card-header>
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="100" fxFlex.xl="100">
<mat-radio-group formControlName="check_type" class="example-radio-group">
<mat-radio-button class="example-radio-button" color="primary" [value]="types.id" *ngFor="let types of check_type; let t = index">{{types.type_name}}</mat-radio-button>
</mat-radio-group>
</div>
</h6>
<mat-dialog-content formArrayName="neighbourhood_list" *ngIf="_neighbourhoodForm.controls.check_type.value==0">
<mat-card>
</mat-card-header>
<mat-card-content formArrayName="neighbourhood_list" *ngIf="_neighbourhoodForm.controls.check_type.value==0">
<mat-card *ngFor="let neighbourhood of _neighbourhoodForm.controls.neighbourhood_list['controls']; let n = index;" [formGroupName]="n">
<mat-card-content>
<mat-form-field style="width: 42%">
@ -49,15 +50,8 @@
<mat-icon>delete</mat-icon></button>
</mat-card-content>
</mat-card>
<mat-dialog-actions>
<div fxFlex="100" align="end">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Add More" matTooltipPosition="above" (click)="_neighbourhoodForm.controls.check_type.value==0 ? addNeighbourhood() : addReferencecheck()" color="primary"><mat-icon>add</mat-icon></button>
</div>
</mat-dialog-actions>
</mat-card>
</mat-dialog-content>
<mat-dialog-content formArrayName="referencecheck_list" *ngIf="_neighbourhoodForm.controls.check_type.value==1">
<mat-card>
</mat-card-content>
<mat-card-content formArrayName="referencecheck_list" *ngIf="_neighbourhoodForm.controls.check_type.value==1">
<mat-card *ngFor="let reference of _neighbourhoodForm.controls.referencecheck_list['controls']; let r = index;" [formGroupName]="r">
<mat-card-content>
<mat-form-field style="width: 28%">
@ -109,15 +103,18 @@
<mat-icon>delete</mat-icon></button>
</mat-card-content>
</mat-card>
<mat-dialog-actions>
<div fxFlex="100" align="end">
</mat-card-content>
<mat-card-actions align="end">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Add More" matTooltipPosition="above" (click)="_neighbourhoodForm.controls.check_type.value==0 ? addNeighbourhood() : addReferencecheck()" color="primary"><mat-icon>add</mat-icon></button>
</div>
</mat-dialog-actions>
</mat-card>
</mat-card-actions>
</mat-card>
</mat-dialog-content>
<mat-dialog-actions>
<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>
@ -128,8 +125,6 @@
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Save" matTooltipPosition="above" (click)="saveNeighbourhood(_neighbourhoodForm.value)"><mat-icon>save</mat-icon></button>
</div>
</mat-dialog-actions>
</mat-dialog-actions>
<notifier-container></notifier-container>

View File

@ -93,102 +93,92 @@
<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 ngxViewer>
<div fxLayout="row wrap" style="padding:20px;">
<div fxFlex="100">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
</div>
</div>
</div>
<div fxFlex="row">
<div fxFlex="100" class="m-gap p-gap">
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
</div>

View File

@ -55,7 +55,25 @@ export class OtherIncomeComponent implements OnInit {
this.form_id = 9;
this.notifier = notifier;
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
ngOnInit() {
console.clear();
this.getFrequency();

View File

@ -209,112 +209,98 @@
</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 ngxViewer>
<div fxLayout="row wrap" style="padding:20px;">
<div fxFlex="100">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
</div>
</div>
</div>
<div fxFlex="row">
<div fxFlex="100" class="m-gap p-gap">
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
</div>
</div>
</div>
</div>
</ng-template>
</mat-tab>

View File

@ -66,7 +66,25 @@ export class PersonalInfoComponent implements OnInit {
this.notifier = notifier;
this.form_id = 3;
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
ngOnInit() {
this.initFormDetails()
this.loadPDDetails();

View File

@ -204,110 +204,97 @@
</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 ngxViewer>
<div fxLayout="row wrap" style="padding:20px;">
<div fxFlex="100">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
</div>
</div>
</div>
<div fxFlex="row">
<div fxFlex="100" class="m-gap p-gap">
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
</div>
</div>
</div>
</div>
</ng-template>
</mat-tab>

View File

@ -36,7 +36,25 @@ export class RentalInfoComponent implements OnInit {
this.notifier = notifier;
this.form_id = 17;
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
ngOnInit() {
this.step = 0;
this.inintRentalForm();

View File

@ -18,7 +18,7 @@
<div fxLayout="row wrap">
<div fxFlex="100">
<!-- start main applicant -->
<mat-card>
<mat-card *ngIf="rawMaterialAccess">
<mat-card-header>
<p>Raw Materials<p>
</mat-card-header>
@ -26,39 +26,50 @@
<div *ngFor="let details of stockForm.controls.raw_materials['controls']; let i=index"
[formGroupName]="i">
<mat-card-content class="matcard">
<mat-form-field>
<mat-form-field style="width:30%">
<input matInput placeholder="Name" formControlName="raw_name" required>
</mat-form-field>
<mat-form-field>
<mat-form-field style="width:30%">
<mat-select placeholder="is the Stock is Observed ?"
formControlName="stock_observed" required>
formControlName="stock_observed" required
(selectionChange)="RawMaterialValidation($event)">
<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>
<span *ngIf="details.get('stock_observed').value == 'no'" >
<mat-form-field style="width:30%">
<input matInput placeholder="Estimated Quantity" formControlName="raw_quantity" required>
</mat-form-field>
<mat-form-field>
<mat-form-field style="width:30%">
<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" >
<mat-form-field *ngIf="details.get('raw_uom').value == 61" style="width:30%">
<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 style="width:76%">
<input matInput placeholder="Estimated Value of Stock Observed" formControlName="raw_value" (keypress)="keyPress($event)" (keyup)="inWords($event,1)" required>
<mat-hint align="end" *ngIf="details.get('raw_value').value != ''">{{"&#8377;"}} {{rawValueInWords}} Only</mat-hint>
</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 style="width:90%">
<!-- <input matInput placeholder="Is the stock of raw materials observed ?" formControlName="is_sufficiant_raw" required> -->
<mat-select placeholder="Is the stock of Raw Materials observed, sufficient considering the size of operations" formControlName="is_sufficiant_raw" required>
<mat-option value="yes" >Yes</mat-option>
<mat-option value="no" >No</mat-option>
</mat-select>
</mat-form-field>
</div>
<mat-form-field *ngIf="details.get('is_sufficiant_raw').value == 'no'" appearance="outline" style="width: 90%">
<mat-label>Please comment on the stock level observed?</mat-label>
<textarea matInput placeholder="Please comment on the stock level observed" formControlName="rawmaterial_remarks"></textarea>
</mat-form-field>
</span>
<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">
@ -79,7 +90,7 @@
<div fxLayout="row wrap">
<div fxFlex="100">
<!-- start co applicant form details -->
<mat-card>
<mat-card *ngIf="finishedGoodsAccess">
<mat-card-header>
<p>Finished Goods<p>
</mat-card-header>
@ -87,21 +98,40 @@
<div *ngFor="let details of stockForm.controls.finished_goods['controls']; let i=index"
[formGroupName]="i">
<mat-card-content class="matcard">
<mat-form-field>
<mat-form-field style="width:30%">
<input matInput placeholder="Name" formControlName="goods_name" required>
</mat-form-field>
<mat-form-field>
<mat-form-field style="width:30%">
<mat-select placeholder="is the Goods is Observed ?"
formControlName="goods_observed" required
(selectionChange)="GoodsValidation($event)">
<mat-option value="yes" >Yes</mat-option>
<mat-option value="no" >No</mat-option>
</mat-select>
</mat-form-field>
<span *ngIf="details.get('goods_observed').value == 'no'" >
<mat-form-field style="width:30%">
<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 style="width:76%">
<input matInput placeholder="Estimated Value of Stock Observed" formControlName="goods_value" (keypress)="keyPress($event)" (keyup)="inWords($event,2)" required>
<mat-hint align="end" *ngIf="details.get('goods_value').value != ''">{{"&#8377;"}} {{goodsValueInWords}} Only</mat-hint>
</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 style="width:90%">
<!-- <input matInput placeholder="Is the stock of finished goods observed ?" formControlName="is_sufficiant_goods" required> -->
<mat-select placeholder="Is the stock of finished goods observed ?" formControlName="is_sufficiant_goods" required>
<mat-option value="yes" >Yes</mat-option>
<mat-option value="no" >No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="details.get('is_sufficiant_goods').value == 'no'" appearance="outline" style="width: 90%">
<mat-label>Please comment on the finished goods stock level observed?</mat-label>
<textarea matInput placeholder="Please comment on the finished goods observed" formControlName="finishedgoods_remarks"></textarea>
</mat-form-field>
</span>
<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">
@ -117,118 +147,166 @@
</mat-card>
<!-- end co apllicant -->
</div>
</div>
<div fxLayout="row wrap">
<div fxFlex="100">
<mat-card *ngIf="tradeConcernAccess">
<mat-card-header>
<p>Stock of Goods Traded<p>
</mat-card-header>
<div formArrayName="traded_goods">
<div *ngFor="let details of stockForm.controls.traded_goods['controls']; let i=index"
[formGroupName]="i">
<mat-card-content class="matcard">
<mat-form-field style="width:30%">
<input matInput placeholder="Name" formControlName="traded_goods_name" required>
</mat-form-field>
<mat-form-field style="width:30%">
<mat-select placeholder="is the Traded Goods is Observed ?"
formControlName="traded_goods_observed" required
(selectionChange)="TradedGoodsValidation($event)">
<mat-option value="yes" >Yes</mat-option>
<mat-option value="no" >No</mat-option>
</mat-select>
</mat-form-field>
<span *ngIf="details.get('traded_goods_observed').value == 'no'" >
<mat-form-field style="width:30%">
<input matInput placeholder="Estimated Quantity" formControlName="traded_goods_quantity" required>
</mat-form-field>
<mat-form-field style="width:76%">
<input matInput placeholder="Estimated Value of Stock Observed" formControlName="estimated_traded_goods_value" (keypress)="keyPress($event)" (keyup)="inWords($event,3)" required>
<mat-hint align="end" *ngIf="details.get('estimated_traded_goods_value').value != ''">{{"&#8377;"}} {{tradedGoodsValueInWords}} Only</mat-hint>
</mat-form-field>
<mat-form-field style="width:76%">
<input matInput placeholder="Value of traded goods as per latest financial statements" formControlName="traded_goods_value" (keypress)="keyPress($event)" required>
</mat-form-field>
<mat-form-field style="width:90%">
<!-- <input matInput placeholder="Is the stock of finished goods observed ?" formControlName="is_sufficiant_goods" required> -->
<mat-select placeholder="Is the stock of Traded goods observed ?" formControlName="is_sufficiant_traded_goods" required>
<mat-option value="yes" >Yes</mat-option>
<mat-option value="no" >No</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="details.get('is_sufficiant_traded_goods').value == 'no'" appearance="outline" style="width: 90%">
<mat-label>Please comment on the Traded Goods stock level observed?</mat-label>
<textarea matInput placeholder="Please comment on the traded goods stock level observed" formControlName="traded_goods_remarks"></textarea>
</mat-form-field>
</span>
<button type="button" mat-raised-button mat-icon-button (click)="addTradedGoods()"
matTooltip="Add More Traded 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)="deleteTradedGoods(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>
</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 ngxViewer>
<div fxLayout="row wrap" style="padding:20px;">
<div fxFlex="100">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=2" alt="Image 2"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"><img src="https://picsum.photos/2000/1500/?random=3" alt="Image 3"></div>
</div>
</div>
</div>
</div>
</div>
<div fxFlex="25" class="m-gap p-gap">
<div class="p-list-main mb-2">
<div fxFlex="20" class="m-gap p-gap">
<div class="p-list-main mb-2" style="width: 60%;height: auto;">
<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 class="top"> <img src="https://picsum.photos/2000/1500/?random=1" alt="Image 1"></div>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
</div>
</div>
</div>
<div fxFlex="row">
<div fxFlex="100" class="m-gap p-gap">
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="25" fxFlex.lg="25" fxFlex.xl="25">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
<div class="text-center mb-2 hover-icon" fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="20" fxFlex.lg="20" fxFlex.xl="20">
<a href="http://www.google.com"><mat-icon style="color: #e00201;font-size: 60px !important;width:inherit !important;">picture_as_pdf</mat-icon> <span class="d-block">version_111</span></a>
</div>
</div>
</div>
</div>
</div>
</div>
</ng-template>
</mat-tab>
@ -238,7 +316,7 @@
<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>
<mat-label>Remarks</mat-label>
<textarea matInput placeholder="Remarks" formControlName="stock_remarks"></textarea>
</mat-form-field>
</div>

View File

@ -38,7 +38,14 @@ export class StockComponent implements OnInit {
public stockForm: FormGroup;
private notifier: NotifierService;
public uomData : any = [];
rawmaterial : any;
goodsValueInWords : any;
rawValueInWords : any;
tradedGoodsValueInWords : any;
rawMaterialAccess: boolean;
finishedGoodsAccess: boolean;
tradeConcernAccess: boolean;
constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute,
private router: Router,
@ -47,93 +54,207 @@ export class StockComponent implements OnInit {
this.form_id = 11;
this.notifier = notifier;
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
ngOnInit() {
this.initstockForm();
this.getUOM();
this.setSku('data',0);
//this.setSku('data',0);
let params: any = {};
let activityArray : any = [];
params.pd_id = this.pdid;
params.pd_form_id = this.form_id;
this._pd.retriveForm({pd_id:this.pdid,pd_form_id:'1'}).subscribe(value => {
console.log('Raw material Name',value.records.main_raw_materials);
this._pd.stockFormAccess({pd_id:this.pdid}).subscribe(value => {
console.log(value);
const rawMaterial = <FormArray>this.stockForm.controls['raw_materials'];
const finishedGoods = <FormArray>this.stockForm.controls['finished_goods'];
const tradedGoods = <FormArray>this.stockForm.controls['traded_goods'];
if (value.status == 200) {
console.log('value.records',value.records);
value.records.type_of_activity.forEach(val => {
//console.log(val);
//console.log(val.type_of_activity_id);
this.rawMaterialAccess = true;
this.finishedGoodsAccess = true;
this.tradeConcernAccess = true;
if(val.type_of_activity_id == 1){
rawMaterial.push(this.createRawmaterial());
finishedGoods.push(this.createGoods());
tradedGoods.push(this.createTradedGoods());
}
else if(val.type_of_activity_id == 2){
rawMaterial.push(this.createRawmaterial());
finishedGoods.push(this.createGoods());
}
else if(val.type_of_activity_id == 3){
rawMaterial.push(this.createRawmaterial());
finishedGoods.push(this.createGoods());
}
// else if(val.type_of_activity_id == 4){
// }
});
this._pd.retriveForm({pd_id:this.pdid,pd_form_id:'1'}).subscribe(value => {
//console.log('Raw material Name',value.records.main_raw_materials);
// const faControl = (<FormArray>this.stockForm.controls['raw_materials']).at(1);
const control = (<FormArray>this.stockForm.controls['raw_materials']).at(0);
console.log(control);
//const control = (<FormArray>this.stockForm.controls['raw_materials']).at(0);
//console.log(control);
// this.stockForm.controls['raw_materials'].setValue(value.records.main_raw_materials);
if (value.status == 200) {
this.rawmaterial = value.records.main_raw_materials;
}else{ this.rawmaterial = ''; }
// if (value.status == 200) {
// this.rawmaterial = value.records.main_raw_materials;
// }else{ this.rawmaterial = ''; }
})
this._pd.retriveForm(params).subscribe(value => {
console.log('value', value);
const rawMaterial = <FormArray>this.stockForm.controls['raw_materials'];
const finishedGoods = <FormArray>this.stockForm.controls['finished_goods'];
//console.log('value', value);
if (value.status == 200) {
console.log('data',value);
// Raw Material Access is True means., Data have to load,
if(this.rawMaterialAccess == true){
let result = Object.keys(value.records.raw_materials).map(function(key) {
return value.records.raw_materials[key];
});
let result_Goods = Object.keys(value.records.finished_goods).map(function(key) {
return value.records.finished_goods[key];
});
this.stockForm.controls['stock_remarks'].setValue(value.records.stock_remarks);
if (result.length > 0) {
result.forEach(val => {
//this.RawMaterialValidation(val.stock_observed);
rawMaterial.push(this.createRawmaterial());
if(val.raw_value != '' && val.raw_value != null ){ this.rawValueInWords = this._pd.convertNumberToWords(val.raw_value); }
});
this.stockForm.controls['raw_materials'].setValue(result);
} else {
rawMaterial.push(this.createRawmaterial());
}
}
// Finished Goods Access is TRUE Means., data have to load.,
if(this.finishedGoodsAccess == true){
let result_Goods = Object.keys(value.records.finished_goods).map(function(key) {
return value.records.finished_goods[key];
});
if (result_Goods.length > 0) {
result_Goods.forEach(val => {
//this.GoodsValidation(val.goods_observed);
finishedGoods.push(this.createGoods());
if(val.goods_value != '' && val.goods_value != null ){ this.goodsValueInWords = this._pd.convertNumberToWords(val.goods_value); }
});
this.stockForm.controls['finished_goods'].setValue(result_Goods);
} else {
finishedGoods.push(this.createGoods());
}
}
//TradeConcern Access is TRUE Means., data have to load.,
if(this.tradeConcernAccess == true){
let result_Traded_Goods = Object.keys(value.records.finished_goods).map(function(key) {
return value.records.traded_goods[key];
});
if (result_Traded_Goods.length > 0) {
result_Traded_Goods.forEach(val => {
tradedGoods.push(this.createTradedGoods());
if(val.traded_goods_value != '' && val.traded_goods_value != null )
{ this.tradedGoodsValueInWords = this._pd.convertNumberToWords(val.traded_goods_value); }
});
this.stockForm.controls['traded_goods'].setValue(result_Traded_Goods);
} else {
rawMaterial.push(this.createRawmaterial());
finishedGoods.push(this.createGoods());
tradedGoods.push(this.createTradedGoods());
}
}
this.stockForm.controls['stock_remarks'].setValue(value.records.stock_remarks);
} else {
// rawMaterial.push(this.createRawmaterial());
// finishedGoods.push(this.createGoods());
// tradedGoods.push(this.createTradedGoods());
}
})
}
});
}
public initstockForm(): void {
this.stockForm = this.fb.group({
stock_remarks: ['', Validators.compose([Validators.required])],
raw_materials: this.fb.array([]),
finished_goods: this.fb.array([])
finished_goods: this.fb.array([]),
traded_goods: this.fb.array([])
});
}
setSku(sku: string, index: number) {
//setSku(sku: string, index: number) {
// const faControl =
// (<FormArray>this.stockForm.controls['raw_materials']).at(index);
// faControl['controls'].raw_name.setValue(sku);
}
// }
createRawmaterial() {
return this.fb.group({
raw_name: ['', Validators.compose([Validators.required])],
stock_observed:['', Validators.compose([Validators.required])],
raw_quantity: ['', Validators.compose([Validators.required])],
raw_uom: ['', Validators.compose([Validators.required])],
raw_quantity: [''],
raw_uom: [''],
other_uom : [''],
raw_value: ['', Validators.compose([Validators.required])],
rawmaterial_value: ['', Validators.compose([Validators.required])],
is_sufficiant_raw: ['', Validators.compose([Validators.required])],
raw_value: [''],
rawmaterial_value: [''],
is_sufficiant_raw: [''],
rawmaterial_remarks:['']
});
}
createGoods() {
return this.fb.group({
goods_name: ['', Validators.compose([Validators.required])],
goods_quantity: ['', Validators.compose([Validators.required])],
goods_value: ['', Validators.compose([Validators.required])],
finished_goods_value: ['', Validators.compose([Validators.required])],
is_sufficiant_goods: ['', Validators.compose([Validators.required])],
goods_observed: ['', Validators.compose([Validators.required])],
goods_quantity: [''],
goods_value: [''],
finished_goods_value: [''],
is_sufficiant_goods: [''],
finishedgoods_remarks:['']
});
}
createTradedGoods() {
return this.fb.group({
traded_goods_name: ['', Validators.compose([Validators.required])],
traded_goods_observed: ['', Validators.compose([Validators.required])],
traded_goods_quantity: [''],
estimated_traded_goods_value: [''],
traded_goods_value: [''],
is_sufficiant_traded_goods: [''],
traded_goods_remarks:['']
});
}
addRawMaterials() {
@ -152,6 +273,15 @@ export class StockComponent implements OnInit {
const control = <FormArray>this.stockForm.controls['finished_goods'];
control.removeAt(index);
}
addTradedGoods() {
const control = <FormArray>this.stockForm.controls['traded_goods'];
control.push(this.createTradedGoods());
}
deleteTradedGoods(index) {
const control = <FormArray>this.stockForm.controls['traded_goods'];
control.removeAt(index);
}
submitDetails() {
if (!this.stockForm.valid) {
return;
@ -160,12 +290,16 @@ export class StockComponent implements OnInit {
records.pdid = this.pdid;
records.formid = this.form_id;
records.fk_createdby = this.pdid;
records.raw_materials = this.stockForm.controls['raw_materials'].value;
if(this.rawMaterialAccess == true){
records.raw_materials = this.stockForm.controls['raw_materials'].value; }
if(this.finishedGoodsAccess == true){
records.finished_goods = this.stockForm.controls['finished_goods'].value;}
if(this.tradeConcernAccess == true){
records.traded_goods = this.stockForm.controls['traded_goods'].value; }
records.stock_remarks = this.stockForm.controls['stock_remarks'].value;
records.finished_goods = this.stockForm.controls['finished_goods'].value;
console.log('data', records);
//console.log('data', records);
this._pd.saveForm(records).subscribe(data => {
console.log('data', data);
//console.log('data', data);
this.notifier.notify('success', 'Saved Successfully.');
}, error => {
this.notifier.notify('warning', 'Something Wents Wrong Try Again.!');
@ -201,4 +335,151 @@ export class StockComponent implements OnInit {
event.preventDefault();
}
}
/** To Convert Amount into Words */
inWords(e,flag:number){
switch(flag){
case 1 :
this.rawValueInWords = this._pd.convertNumberToWords(e.target.value);
break;
case 2 :
this.goodsValueInWords = this._pd.convertNumberToWords(e.target.value);
break;
case 3 :
this.tradedGoodsValueInWords = this._pd.convertNumberToWords(e.target.value);
break;
default:
break;
}
}
// Validation Dynamically Add And Remove
GoodsValidation(event: any){
// console.log('First Time',event);
// console.log('First Time Value',event.value);
const control = <FormArray>this.stockForm.controls['finished_goods'];
if(event.value == 'no') {
control.controls[0].get('goods_quantity').setValidators([Validators.required]);
control.controls[0].get('goods_quantity').updateValueAndValidity();
control.controls[0].get('goods_value').setValidators([Validators.required]);
control.controls[0].get('goods_value').updateValueAndValidity();
control.controls[0].get('finished_goods_value').setValidators([Validators.required]);
control.controls[0].get('finished_goods_value').updateValueAndValidity();
control.controls[0].get('is_sufficiant_goods').setValidators([Validators.required]);
control.controls[0].get('is_sufficiant_goods').updateValueAndValidity();
}
else
if(event.value == 'yes') {
control.controls[0].get('goods_quantity').clearValidators();
control.controls[0].get('goods_quantity').updateValueAndValidity();
control.controls[0].get('goods_value').clearValidators();
control.controls[0].get('goods_value').updateValueAndValidity();
control.controls[0].get('finished_goods_value').clearValidators();
control.controls[0].get('finished_goods_value').updateValueAndValidity();
control.controls[0].get('is_sufficiant_goods').clearValidators();
control.controls[0].get('is_sufficiant_goods').updateValueAndValidity();
}
}
RawMaterialValidation(event: any){
// console.log('First Time',event);
// console.log('First Time Value',event.value);
const control = <FormArray>this.stockForm.controls['raw_materials'];
if(event.value == 'no') {
control.controls[0].get('raw_quantity').setValidators([Validators.required]);
control.controls[0].get('raw_quantity').updateValueAndValidity();
control.controls[0].get('raw_uom').setValidators([Validators.required]);
control.controls[0].get('raw_uom').updateValueAndValidity();
control.controls[0].get('raw_value').setValidators([Validators.required]);
control.controls[0].get('raw_value').updateValueAndValidity();
control.controls[0].get('rawmaterial_value').setValidators([Validators.required]);
control.controls[0].get('rawmaterial_value').updateValueAndValidity();
control.controls[0].get('is_sufficiant_raw').setValidators([Validators.required]);
control.controls[0].get('is_sufficiant_raw').updateValueAndValidity();
}
else
if(event.value == 'yes') {
control.controls[0].get('raw_quantity').clearValidators();
control.controls[0].get('raw_quantity').updateValueAndValidity();
control.controls[0].get('raw_uom').clearValidators();
control.controls[0].get('raw_uom').updateValueAndValidity();
control.controls[0].get('raw_value').clearValidators();
control.controls[0].get('raw_value').updateValueAndValidity();
control.controls[0].get('rawmaterial_value').clearValidators();
control.controls[0].get('rawmaterial_value').updateValueAndValidity();
control.controls[0].get('is_sufficiant_raw').clearValidators();
control.controls[0].get('is_sufficiant_raw').updateValueAndValidity();
}
}
TradedGoodsValidation(event: any){
console.log('First Time',event);
console.log('First Time Value',event.value);
const control = <FormArray>this.stockForm.controls['tradeded_goods'];
if(event.value == 'no') {
control.controls[0].get('traded_goods_quantity').setValidators([Validators.required]);
control.controls[0].get('traded_goods_quantity').updateValueAndValidity();
control.controls[0].get('estimated_traded_goods_value').setValidators([Validators.required]);
control.controls[0].get('estimated_traded_goods_value').updateValueAndValidity();
control.controls[0].get('traded_goods_value').setValidators([Validators.required]);
control.controls[0].get('traded_goods_value').updateValueAndValidity();
control.controls[0].get('is_sufficiant_traded_goods').setValidators([Validators.required]);
control.controls[0].get('is_sufficiant_traded_goods').updateValueAndValidity();
}
else
if(event.value == 'yes') {
control.controls[0].get('traded_goods_quantity').clearValidators();
control.controls[0].get('traded_goods_quantity').updateValueAndValidity();
control.controls[0].get('estimated_traded_goods_value').clearValidators();
control.controls[0].get('estimated_traded_goods_value').updateValueAndValidity();
control.controls[0].get('traded_goods_value').clearValidators();
control.controls[0].get('traded_goods_value').updateValueAndValidity();
control.controls[0].get('is_sufficiant_traded_goods').clearValidators();
control.controls[0].get('is_sufficiant_traded_goods').updateValueAndValidity();
}
}
}

View File

@ -1,260 +1,134 @@
<div style="max-width: 100vw !important;width: 100% !important;height: 95% !important;">
<form *ngIf="apiLoadFinish" [formGroup]="_supplierQuesFrom" (submit)="onSubmit()" novalidate>
<h2 mat-dialog-title class="paragraph_change">
<h2 mat-dialog-title class="paragraph_change">
<div fxFlex="70" align="left" style="padding: 10px !important;">{{pageTitle}}</div>
<div fxFlex="30" align="end" style="padding: 10px !important;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Close" matTooltipPosition="right" mat-dialog-close><mat-icon>close</mat-icon></button>
<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>
</h2>
<div *ngIf="noRecordsFound" style="max-width: 100vw !important;width: 100% !important;height: 95% !important;">
<form [formGroup]="_supplierQuesFrom" (submit)="onSubmit()" novalidate>
<mat-dialog-content>
<mat-tab-group>
<mat-tab label="Questions">
<ng-template matTabContent>
<mat-card>
<div fxLayout="row wrap">
<div fxFlex="100">
<mat-card>
<mat-card-content>
<mat-form-field fxFill>
<textarea matInput placeholder="What are the main raw materials?(MEG Only)" formControlName="main_raw_materials"></textarea>
<mat-error *ngIf="submitted && f.main_raw_materials.hasError('required')" class="mat-text-warn">You must Include Raw Material Details.</mat-error>
<mat-card *ngIf="manufacturingForm">
<h5 style="margin: 12px;">Manufacturing Product Details</h5>
<div formArrayName="manufacturing_details">
<div *ngFor="let item of _supplierQuesFrom.controls.manufacturing_details['controls']; let i=index" [formGroupName]="i">
<div formArrayName="main_raw_materials">
<div *ngFor="let items of item.controls.main_raw_materials['controls']; let l=index" [formGroupName]="l">
<mat-card style="margin: 12px;">
<h6 style="margin: 12px;">Raw Material #{{l+1}}</h6>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width: 100%">
<input matInput placeholder="Raw Material Name" formControlName="manufacturing_raw_material_name">
</mat-form-field>
</mat-card-content>
</mat-card>
</div>
</div>
<div fxLayout="row wrap">
<div fxFlex="100">
<mat-card>
<!-- <mat-card-title></mat-card-title> -->
<mat-card-content formArrayName="supplier_details" fxFill>
<div *ngFor="let sup of _supplierQuesFrom.controls.supplier_details['controls']; let i=index" [formGroupName]="i">
<div fxLayout="row wrap" fxLayoutGap="12px" fxLayoutAlign="start none">
<div fxFlex="30">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Supplier Name" formControlName="supplier_name" required>
<!-- <mat-error *ngIf="sup.controls['supplier_name'].hasError('required') && sup.controls['supplier_name'].touched" class="mat-text-warn">Supplier Name Required.</mat-error> -->
<mat-form-field style="width: 100%">
<input matInput placeholder="Supplier Name" formControlName="manufacturing_supplier_name">
</mat-form-field>
<mat-form-field style="width: 100%">
<input matInput placeholder="Contact Person Name" formControlName="manufacturing_contact_person_name">
</mat-form-field>
</div>
<div fxFlex="30">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Contact Person Name" formControlName="contact_person" required>
<!-- <mat-error *ngIf="sup.controls['contact_person'].hasError('required') && sup.controls['contact_person'].touched" class="mat-text-warn">Contact Person Name Required.</mat-error> -->
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width: 100%">
<input matInput placeholder="Contact Person Mobile Number" formControlName="manufacturing_contact_person_mobile_number">
</mat-form-field>
</div>
<div fxFlex="30">
<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">Vaild Mobile Number Requried</mat-error>
</mat-form-field>
</div>
</div>
<div fxLayout="row wrap" fxLayoutGap="14px" fxLayoutAlign="start none">
<div fxFlex="30">
<mat-form-field style="width:100%">
<mat-select (selectionChange)="selectedPM($event)" placeholder="Payment Mode" formControlName="payment_mode" required>
<mat-form-field style="width: 100%">
<mat-select (selectionChange)="selectedPM($event)" placeholder="Payment Type" formControlName="manufacturing_payment_type">
<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" fxFlex="30">
<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-form-field style="width: 100%" *ngIf="items.get('manufacturing_payment_type').value == 3">
<input matInput placeholder="Number of days of credit provided" formControlName="manufacturing_credit_days">
</mat-form-field>
</div>
<div *ngIf="sup.get('payment_mode').value == 2 || sup.get('payment_mode').value == 3" fxFlex="30">
<mat-form-field class="ml-xs example-full-width">
<input matInput placeholder="Credit Period" formControlName="credit_period">
</mat-form-field>
</div>
</div>
<div fxLayout="row" fxLayoutGap="14px" style="text-align:center;">
<!-- <div fxFlex="30">
<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)">
<div align="end">
<span *ngIf="item.controls.main_raw_materials.controls.length > 1" (click)="removeRawMaterials(l)">
<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>
<mat-dialog-actions>
<div>
<mat-form-field style="width: 100%">
<input matInput placeholder="% of total manufacturing raw materials credit values" formControlName="main_raw_materials_total_payments_percent_on_credit"
type="number">
</mat-form-field>
<div fxFlex="100" align="end">
<button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Supplier 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)="addMoreRawMaterials($event); false"><mat-icon>add</mat-icon></button>
</div>
</div>
</div>
</div>
</mat-dialog-actions>
</mat-card>
</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> -->
<mat-card *ngIf="tradingForm">
<h5 style="margin: 12px;">Trading Product Details</h5>
<div formArrayName="trade_details">
<div *ngFor="let item of _supplierQuesFrom.controls.trade_details['controls']; let i=index" [formGroupName]="i">
<div formArrayName="trading_products">
<div *ngFor="let items of item.controls.trading_products['controls']; let l=index" [formGroupName]="l">
<mat-card style="margin: 12px;">
<h6 style="margin: 12px;">Trading Product #{{l+1}}</h6>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width: 100%">
<input matInput placeholder="Trade Product Name" formControlName="trade_product_name">
</mat-form-field>
<mat-form-field style="width: 100%">
<input matInput placeholder="Supplier Name" formControlName="trade_supplier_name">
</mat-form-field>
<mat-form-field style="width: 100%">
<input matInput placeholder="Contact Person Name" formControlName="trade_product_contact_person_name">
</mat-form-field>
</div>
<!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width: 100%">
<input matInput placeholder="Contact Person Mobile Number" formControlName="trade_product_contact_person_mobile_number">
</mat-form-field>
<mat-form-field style="width: 100%">
<mat-select (selectionChange)="selectedPM($event)" placeholder="Payment Type" formControlName="trade_product_payment_type">
<mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width: 100%" *ngIf="items.get('trade_product_payment_type').value == 3">
<input matInput placeholder="Number of days of credit provided" formControlName="trade_product_credit_days">
</mat-form-field>
</div>
<div align="end">
<span *ngIf="item.controls.trading_products.controls.length > 1" (click)="removeTradingProduct(l)">
<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>
</mat-card>
</div>
</div>
<div>
<mat-form-field style="width: 100%">
<input matInput placeholder="% of total trading product credit values" formControlName="trading_products_total_payments_percent_on_credit"
type="number">
</mat-form-field>
<div fxFlex="100" align="end">
<button mat-raised-button mat-icon-button mat-button color="primary" matTooltip="Add More Supplier Details" matTooltipPosition="above"
class="mr-1 mb-1 hover-icon" (click)="addMoretradeProduct($event); false"><mat-icon>add</mat-icon></button>
</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-card>
<mat-card *ngIf="serviceProviderForm">
<h5 style="margin: 12px;">Service Provider Product Details</h5>
<div style="text-align: center; margin: 12px;">Service Provider Details Not applicable here !!</div>
</mat-card>
</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-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> -->
<textarea matInput placeholder="Remarks" formControlName="supplier_info_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>
<!----<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>
</mat-dialog-actions>
</form>
</form>
</div>
<notifier-container></notifier-container>

View File

@ -17,6 +17,9 @@
.mat-card-actions {
background-color: white;
}
::ng-deep .cdk-global-overlay-wrapper{
justify-content: center !important;
}
mat-form-field {
margin: 0 2%;

View File

@ -3,7 +3,7 @@ import {
Component,
OnInit,
Inject,
Output,Input
Output, Input
} from '@angular/core';
import {
@ -32,16 +32,16 @@ import { PdTrigerService } from '../../../../../pd-service/pd-triger.service';
export class SupplierInfoComponent implements OnInit {
pageTitle: string ="Supplier Details";
pageTitle: string = "Supplier Details";
//@Input() pdid: number;
pdid : string;
form_id:number;
pdid: string;
form_id: number;
public _supplierQuesFrom: FormGroup;
public submitted = false;
public m_paymentModeType= [];
public m_paymentModeType = [];
private notifier: NotifierService;
constructor(
@ -53,14 +53,279 @@ export class SupplierInfoComponent implements OnInit {
this.form_id = 1;
this.notifier = notifier;
}
public viewerOptions: any = {
navbar: false,
toolbar: {
zoomIn: 4,
zoomOut: 4,
oneToOne: 4,
reset: 4,
prev: 4,
play: {
show: 4,
size: 'large',
},
next: 4,
rotateLeft: 4,
rotateRight: 4,
flipHorizontal: 4,
flipVertical: 4,
}
};
noRecordsFound: Boolean = false;
ngOnInit() {
this.pdTrigerService.getTypeofActivityForSuppliedInfoForm(this.pdid).subscribe(data => {
if(data.dataStatus){
// let datas = {
// "profession_name": "Others",
// "type_of_activity": [
// {
// "type_of_activity_id": 1,
// "name": "Manufacturing Details"
// },
// {
// "type_of_activity_id": 2,
// "name": "Retail trading"
// },
// {
// "type_of_activity_id": 4,
// "name": "Service Provider"
// }
// ]
// };
let datas = data.records;
this.initFormLoadDetails(datas.type_of_activity);
}else {
this.notifier.notify('warning', 'No Category Records Found.!');
this.noRecordsFound = false;
}
}, err => {
this.notifier.notify('warning', 'No Category Records Found.!');
this.noRecordsFound = false;
})
// this.getM_FreqOfPurchase();
this.getM_PaymentModeType();
this.getPdSupplierFormDetails();
// this.getPdSupplierFormDetails();
}
// ==================
serviceProviderForm: Boolean = false;
initFormLoadDetails(record) {
// alert(JSON.stringify(record));
this.pdTrigerService.getPDFormDetailsWithID(this.pdid, '1').subscribe(
data => {
if(data.dataStatus){
let dataForm = data.records;
if(dataForm !== undefined) {
this._supplierQuesFrom = this._formBuilder.group({
pdid: [this.pdid],
formid: ['1'],
manufacturing_details: this._formBuilder.array([this.manufacturingFormCreation(record)]),
trade_details: this._formBuilder.array([this.tradingFormCreation(record)]),
supplier_info_form_remark: [dataForm.supplier_info_form_remark || null]
// wholesale_trade_details: this._formBuilder.array([this.tradingFormCreation(record)]),
});
let arr = record.filter(data => data.type_of_activity_id == 1);
if(arr.length > 0) {
let api_main_raw_materials = Object.keys(dataForm.main_raw_materials).map(function (key) {
return dataForm.main_raw_materials[key];
});
this.initManufacturingProductsDetails(api_main_raw_materials);
this._supplierQuesFrom.controls['manufacturing_details']['controls'][0].controls['main_raw_materials_total_payments_percent_on_credit'].setValue(dataForm.main_raw_materials_total_payments_percent_on_credit || null);
}
let arr1 = record.filter(data => data.type_of_activity_id == 2 || 3);
if(arr1.length > 0) {
let api_trading_products = Object.keys(dataForm.trading_products).map(function (key) {
return dataForm.trading_products[key];
});
this.initTradingProductsDetails(api_trading_products);
this._supplierQuesFrom.controls['trade_details']['controls'][0].controls['trading_products_total_payments_percent_on_credit'].setValue(dataForm.trading_products_total_payments_percent_on_credit || null);
}
this.noRecordsFound = true;
} else {
this._supplierQuesFrom = this._formBuilder.group({
pdid: [this.pdid],
formid: ['1'],
manufacturing_details: this._formBuilder.array([this.manufacturingFormCreation(record)]),
trade_details: this._formBuilder.array([this.tradingFormCreation(record)]),
supplier_info_form_remark: [dataForm.supplier_info_form_remark || null]
// wholesale_trade_details: this._formBuilder.array([this.tradingFormCreation(record)]),
});
let arr = record.filter(data => data.type_of_activity_id == 1);
if(arr.length > 0) {
this.initManufacturingProductsDetails(null);
this._supplierQuesFrom.controls['manufacturing_details']['controls'][0].controls['main_raw_materials_total_payments_percent_on_credit'].setValue(null);
}
let arr1 = record.filter(data => data.type_of_activity_id == 2 || 3);
if(arr1.length > 0) {
this.initTradingProductsDetails(null);
this._supplierQuesFrom.controls['trade_details']['controls'][0].controls['trading_products_total_payments_percent_on_credit'].setValue(dataForm.trading_products_total_payments_percent_on_credit || null);
}
this.noRecordsFound = true;
}
let arr2 = record.filter(data => data.type_of_activity_id == 4);
if(arr2.length > 0) {
this.serviceProviderForm = true;
}
} else {
this._supplierQuesFrom = this._formBuilder.group({
pdid: [this.pdid],
formid: ['1'],
manufacturing_details: this._formBuilder.array([this.manufacturingFormCreation(record)]),
trade_details: this._formBuilder.array([this.tradingFormCreation(record)]),
supplier_info_form_remark: []
// wholesale_trade_details: this._formBuilder.array([this.tradingFormCreation(record)]),
});
let arr = record.filter(data => data.type_of_activity_id == 1);
if(arr.length > 0) {
this.initManufacturingProductsDetails(null);
this._supplierQuesFrom.controls['manufacturing_details']['controls'][0].controls['main_raw_materials_total_payments_percent_on_credit'].setValue(null);
}
let arr1 = record.filter(data => data.type_of_activity_id == 2 || 3);
if(arr1.length > 0) {
this.initTradingProductsDetails(null);
this._supplierQuesFrom.controls['trade_details']['controls'][0].controls['trading_products_total_payments_percent_on_credit'].setValue(null);
}
let arr2 = record.filter(data => data.type_of_activity_id == 4);
if(arr2.length > 0) {
this.serviceProviderForm = true;
}
this.noRecordsFound = true;
}
}, err => {
}
);
}
manufacturingForm: Boolean = false;
manufacturingFormCreation(val) {
let arr = val.filter(data => data.type_of_activity_id == 1);
if (arr.length > 0) {
this.manufacturingForm = true;
return this._formBuilder.group({
main_raw_materials: this._formBuilder.array([]),
main_raw_materials_total_payments_percent_on_credit: []
})
// }
} else {
return;
}
}
tradingForm: Boolean = false;
tradingFormCreation(val) {
let arr = val.filter(data => data.type_of_activity_id == 2 || 3);
if (arr.length > 0) {
this.tradingForm = true;
return this._formBuilder.group({
trading_products: this._formBuilder.array([]),
trading_products_total_payments_percent_on_credit: []
});
} else {
return;
}
}
initManufacturingProductsDetails(datas) {
const control = <FormArray>this._supplierQuesFrom.controls['manufacturing_details']['controls'][0].controls['main_raw_materials'];
if(datas === null){
control.push(this.initManufacturingProducts(null));
} else {
for (let val of datas) {
control.push(this.initManufacturingProducts(val));
}
}
}
initManufacturingProducts(records) {
if(records === null) {
return this._formBuilder.group({
manufacturing_raw_material_name: [''],
manufacturing_supplier_name: [''],
manufacturing_contact_person_name: [''],
manufacturing_contact_person_mobile_number: [''],
manufacturing_payment_type: [''],
manufacturing_credit_days: [''],
manufacturing_frequency_of_purchase: [''],
})
} else {
return this._formBuilder.group({
manufacturing_raw_material_name: [records.manufacturing_raw_material_name || null],
manufacturing_supplier_name: [records.manufacturing_supplier_name || null],
manufacturing_contact_person_name: [records.manufacturing_contact_person_name || null],
manufacturing_contact_person_mobile_number: [records.manufacturing_contact_person_mobile_number || null],
manufacturing_payment_type: [records.manufacturing_payment_type || null],
manufacturing_credit_days: [records.manufacturing_credit_days || null],
manufacturing_frequency_of_purchase: [records.manufacturing_frequency_of_purchase || null],
})
}
}
initTradingProductsDetails(datas) {
const control = <FormArray>this._supplierQuesFrom.controls['trade_details']['controls'][0].controls['trading_products'];
if(datas === null){
control.push(this.initTradingProducts(null));
} else {
for (let val of datas) {
control.push(this.initTradingProducts(val));
}
}
}
initTradingProducts(records) {
if(records === null) {
return this._formBuilder.group({
trade_product_name: [''],
trade_supplier_name: [''],
trade_product_contact_person_name: [''],
trade_product_contact_person_mobile_number: [''],
trade_product_payment_type: [''],
trade_product_frequency_of_purchase: [''],
trade_product_credit_days: [''],
})
} else {
return this._formBuilder.group({
trade_product_name: [records.trade_product_name],
trade_supplier_name: [records.trade_supplier_name],
trade_product_contact_person_name: [records.trade_product_contact_person_name],
trade_product_contact_person_mobile_number: [records.trade_product_contact_person_mobile_number],
trade_product_payment_type: [records.trade_product_payment_type],
trade_product_frequency_of_purchase: [records.trade_product_frequency_of_purchase],
trade_product_credit_days: [records.trade_product_credit_days],
})
}
}
addMoreRawMaterials(e): void {
// e.stropPropagation();
const control = <FormArray>this._supplierQuesFrom.controls['manufacturing_details']['controls'][0].controls['main_raw_materials'];
// console.log(control);
control.push(this.initManufacturingProducts(null));
}
removeRawMaterials(inx): void {
const control = <FormArray>this._supplierQuesFrom.controls['manufacturing_details']['controls'][0].controls['main_raw_materials'];
control.removeAt(inx);
}
addMoretradeProduct(e): void {
// e.stropPropagation();
const control = <FormArray>this._supplierQuesFrom.controls['trade_details']['controls'][0].controls['trading_products'];
// console.log(control);
control.push(this.initTradingProducts(null));
}
removeTradingProduct(inx): void {
const control = <FormArray>this._supplierQuesFrom.controls['trade_details']['controls'][0].controls['trading_products'];
control.removeAt(inx);
}
// ==================
//getM_FreqOfPurchase() {
// this.pdTrigerService.getAllMasterDatas('FREQUENCY').subscribe(
@ -87,122 +352,7 @@ export class SupplierInfoComponent implements OnInit {
}
// ==================
apiLoadFinish: boolean = false;
getPdSupplierFormDetails() {
this.pdTrigerService.getPDFormDetailsWithID(this.pdid, '1').subscribe(
data => {
if (data) {
if(data.dataStatus){
this.formLoadData(data.records)
} else {
this.formLoadData(null)
}
this.apiLoadFinish = true;
} else {
// this.noRecordFound = true;
}
}
);
}
formLoadData(val) {
if(val !== null) {
let value = val;
this._supplierQuesFrom = this._formBuilder.group({
pdid: [this.pdid],
formid: ['1'],
main_raw_materials: [value.main_raw_materials, Validators.compose([Validators.required])],
supplier_details: this._formBuilder.array([
// this.initDetails(),
])
});
this.addSupplierDetailsWithData(value.supplier_details);
} else {
this._supplierQuesFrom = this._formBuilder.group({
pdid: [this.pdid],
formid: ['1'],
main_raw_materials: [null, Validators.compose([Validators.required])],
supplier_details: this._formBuilder.array([
this.initDetails(),
])
});
}
}
// convenience getter for easy access to form fields
get f() { return this._supplierQuesFrom.controls; }
// Dynamic Form field creation Functionality : START ===>
initDetails() {
return this._formBuilder.group({
supplier_name: ['', Validators.compose([Validators.required])],
contact_person: ['', Validators.compose([Validators.required])],
mobile_number: ['', Validators.compose([Validators.required, Validators.minLength(10), Validators.maxLength(10)])],
payment_mode: ['', Validators.compose([Validators.required])],
per_of_immediate_advance_payment:[''],
credit_period:[''],
// frequency_of_purchase: ['', Validators.compose([Validators.required])],
// freq_purchase_others_text_value: ['']
});
}
initDetailsWithdata(data) {
return this._formBuilder.group({
supplier_name: [data.supplier_name, Validators.compose([Validators.required])],
contact_person: [data.contact_person, Validators.compose([Validators.required])],
mobile_number: [data.mobile_number, Validators.compose([Validators.required, Validators.minLength(10), Validators.maxLength(10)])],
payment_mode: [data.payment_mode, Validators.compose([Validators.required])],
per_of_immediate_advance_payment:[data.per_of_immediate_advance_payment || ''],
credit_period:[data.credit_period || ''],
//frequency_of_purchase: [data.frequency_of_purchase, Validators.compose([Validators.required])],
//freq_purchase_others_text_value: [data.freq_purchase_others_text_value || '']
});
}
addSupplierDetailsWithData(supp_data) {
var result = Object.keys(supp_data).map(function(key) {
return supp_data[key];
});
if (result.length > 0) {
for (let val of result) {
let vals = {
supplier_name: val.supplier_name,
contact_person: val.contact_person,
mobile_number: val.mobile_number,
payment_mode: val.payment_mode,
per_of_immediate_advance_payment: val.per_of_immediate_advance_payment,
credit_period: val.credit_period
// frequency_of_purchase: val.frequency_of_purchase,
// freq_purchase_others_text_value: val.freq_purchase_others_text_value
};
const control = <FormArray>this._supplierQuesFrom.controls['supplier_details'];
control.push(this.initDetailsWithdata(vals));
}
}
}
addSupplierDetails(e) {
const control = <FormArray>this._supplierQuesFrom.controls['supplier_details'];
control.push(this.initDetails());
}
removeLanguage(i: number) {
const control = <FormArray>this._supplierQuesFrom.controls['supplier_details'];
control.removeAt(i);
}
public paymentModeTextBox: number;
selectedPM(e) {
this.paymentModeTextBox = e.value;
// this.f.supplier_details.controls.get('payment_mode_value');
}
public freqPurchaseTextBox: number;
selectedFreqPurchase(e){
this.freqPurchaseTextBox = e.value;
}
// ==================
/** To Save/Edited Popup Data */
onSubmit() {
@ -215,7 +365,7 @@ apiLoadFinish: boolean = false;
//To Remove The "Null" With Key also
Object.keys(answerFormValues).forEach((key) => (answerFormValues[key] == null) && delete answerFormValues[key]);
// alert(JSON.stringify(answerFormValues));
console.log(JSON.stringify(answerFormValues));
//Add BRANCH data with help Service File
this.pdTrigerService.savePDFormDetailsWithID(answerFormValues).subscribe(
dataresult => {
@ -234,8 +384,8 @@ apiLoadFinish: boolean = false;
// this.errorMessage = "Something Wents Wrong Try Again !";
// this.dialogRef.close();
});
//After Saving the BRANCH data then popup close
// this.dialogRef.close();
// //After Saving the BRANCH data then popup close
// // this.dialogRef.close();
}
}

View File

@ -14,11 +14,16 @@
</div>
</mat-card-title>
</mat-card-header>
<mat-card-content>
<mat-card-content style="max-height:100% !important;">
<div fxLayout="row wrap" class="child_mat_card">
<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)">
<mat-card fxFlex.xs="80" 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)">
<mat-card-header>
<mat-card-title>{{ (formButton.form_name.length>17)? (formButton.form_name | slice:0:17)+'..':(formButton.form_name) }}</mat-card-title>
<div fxFlex="90" align="left" style="padding:15px !important;">
{{ (formButton.form_name.length>17)? (formButton.form_name | slice:0:17)+'..':(formButton.form_name) }}
</div>
<div fxFlex="20" align="end">
<span style="padding: 3px;" class="menu-badge mat-purple ng-star-inserted" align="center">Q{{formButton.pd_form_order}}</span>
</div>
<!-- <mat-card-subtitle>Karthi Kms</mat-card-subtitle> -->
</mat-card-header>
</mat-card>

View File

@ -11,6 +11,16 @@ mat-card.parent_mat_card > {
max-height:52vh;
overflow:auto;
}
.user-thumb {
position: absolute;
bottom: -35%;
// img {
// border: 5px solid $white;
// border-radius: 100%;
// height: 75px;
// width: 75px;
// }
}
// @media only screen and (max-width:319px) {
// mat-card-content {
// max-height: 350px;

View File

@ -25,6 +25,8 @@ import {LenderRepresentativeComponent} from './forms/lender-representative/lende
import {LoanDetailsComponent} from './forms/loan-details/loan-details.component';
import {GeneralInfoComponent} from './forms/general-info/general-info.component';
import {NeighbourHoodComponent} from './forms/neighbour-hood/neighbour-hood.component';
import {FinalRemarksComponent} from './forms/final-remarks/final-remarks.component';
@Component({
selector: 'app-start-pd',
templateUrl: './start-pd.component.html',
@ -897,6 +899,18 @@ pdFullDetails:any=[];
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}else if(this.selectedFormsCategory.form_id==20){
const generaldialogRef = this.dialog.open(FinalRemarksComponent, {
data: this.pdFullDetails,
position: { right: '0'},
width:'80%',
disableClose: true
});
generaldialogRef.afterClosed()
.subscribe(dataresult => {
// this.notifier.notify('success', 'Successfully allocated.!');
this.loadTemplates(this.startPD);
});
}

View File

@ -5,7 +5,7 @@
<mat-card-content style="background:#e00201;">
<div fxLayout="row" fxLayoutAlign="start center" class="filter-header">
<div *ngFor="let master of pdMasterData" class="ml-xs mr-xs" fxFlex="45" style="color:#fff;">
<h4>{{master.lender_full_name}} </h4>
<h4>{{master.lender_full_name}} - {{master.branch_name}}</h4>
<span *ngIf="master.lender_applicant_id"> {{master.lender_applicant_id}} - </span> {{master.pd_date_of_initiation}}
</div>
<div *ngFor="let master of pdMasterData" class="ml-xs mr-xs pt-1" fxFlex="55" style="text-align:right;" >
@ -75,7 +75,7 @@
<button mat-raised-button mat-button-sm mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="editPdApplicant(pdApplicantData)"><mat-icon>edit</mat-icon></button>
</div>
<mat-card-header>
<mat-card-title>Applicants</mat-card-title>
<mat-card-title style="color:red !important;">Applicants</mat-card-title>
</mat-card-header>
<mat-card-content *ngIf="pdApplicantData.length>0; else noApplicant">
@ -101,7 +101,7 @@
<button mat-raised-button mat-button-sm mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="editAdditionalRequirement(pdAdditionalReqData)"><mat-icon>edit</mat-icon></button>
</div>
<mat-card-header>
<mat-card-title>Additional Requirements</mat-card-title>
<mat-card-title style="color:red !important;">Additional Requirements</mat-card-title>
</mat-card-header>
<mat-card-content *ngIf="pdAdditionalReqData.length>0; else noRequirement">
@ -123,7 +123,7 @@
<!-- pd documents card -->
<mat-expansion-panel *ngIf="pdDocumentsData.length>0; else nodocument">
<mat-expansion-panel-header>
<mat-panel-title class="text-xs-left">
<mat-panel-title class="text-xs-left" style="color:red !important;">
<h6 class="mt-0">Documents</h6>
</mat-panel-title>
</mat-expansion-panel-header>
@ -145,7 +145,7 @@
<!--pd logs card -->
<mat-expansion-panel *ngIf="masterPdLogsData.length>0; else nohistory">
<mat-expansion-panel-header>
<mat-panel-title class="text-xs-left">
<mat-panel-title class="text-xs-left" style="color:red !important;">
<h6 class="mt-0"> PD History</h6>
</mat-panel-title>

View File

@ -6,3 +6,6 @@
.minheight {
min-height: 100%;
}
::ng-deep .body-container{
padding: 0rem !important;
}

View File

@ -15,7 +15,7 @@ import {
MatToolbarModule, MatSelectModule, MatListModule, MatGridListModule,
MatTabsModule, MatCheckboxModule,
MatBadgeModule, MatExpansionModule, MatStepperModule, MatSidenavModule,
MatMenuModule, MatButtonToggleModule,
MatMenuModule, MatButtonToggleModule,MatChipsModule,
MatAutocompleteModule, MatDatepickerModule } from '@angular/material';
import {MatSlideToggleModule} from '@angular/material/slide-toggle';
@ -80,6 +80,9 @@ import { ModelEditPdReportComponent } from './list-pd/pd-report/model-edit-pd-re
import { OtherApplicantDetailsComponent } from './list-pd/start-pd/forms/other-applicant-details/other-applicant-details.component';
import { NeighbourHoodComponent } from './list-pd/start-pd/forms/neighbour-hood/neighbour-hood.component';
// import ngx-viewer module
import { NgxViewerModule } from 'ngx-viewer';
import { FinalRemarksComponent } from './list-pd/start-pd/forms/final-remarks/final-remarks.component';
/**
* Custom angular notifier options
@ -257,7 +260,7 @@ const pdCustomNotifierOptions: NotifierOptions = {
// AgmCoreModule.forRoot({apiKey: 'AIzaSyBtdO5k6CRntAMJCF-H5uZjTCoSGX95cdk'}), OwlDateTimeModule,
// OwlNativeDateTimeModule,
// ],
declarations: [RentalInfoComponent, TelePdAllocationComponent, FinancialInfoComponent, BusinessInfoComponent, EmploymentInfoComponent, StockComponent, BankingDetailsComponent, ListPdComponent, FamilyDetailsComponent, AddressComponent, ManagePdComponent, MapPdViewComponent, AddPdComponent, ViewPdComponent, PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, InprogressPdComponent, AllPdComponent, ScheduledPdComponent, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, CurrentLoanComponent, AssetsInfoComponent, LoanDetailsComponent, OtherIncomeComponent, SupplierInfoComponent, PersonalInfoComponent, LenderRepresentativeComponent, PdReportComponent, AssessedIncomeComponent, AllocationViewMoreComponent, PdRequirementComponent, GeneralInfoComponent, ModelEditPdReportComponent, OtherApplicantDetailsComponent, NeighbourHoodComponent, DialogChangeCurrentVenrsion],
declarations: [RentalInfoComponent, TelePdAllocationComponent, FinancialInfoComponent, BusinessInfoComponent, EmploymentInfoComponent, StockComponent, BankingDetailsComponent, ListPdComponent, FamilyDetailsComponent, AddressComponent, ManagePdComponent, MapPdViewComponent, AddPdComponent, ViewPdComponent, PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, InprogressPdComponent, AllPdComponent, ScheduledPdComponent, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, CurrentLoanComponent, AssetsInfoComponent, LoanDetailsComponent, OtherIncomeComponent, SupplierInfoComponent, PersonalInfoComponent, LenderRepresentativeComponent, PdReportComponent, AssessedIncomeComponent, AllocationViewMoreComponent, PdRequirementComponent, GeneralInfoComponent, ModelEditPdReportComponent, OtherApplicantDetailsComponent, NeighbourHoodComponent, DialogChangeCurrentVenrsion, FinalRemarksComponent],
// exports: [PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, CompletedPdComponent, QcCompletedPdComponent],
// providers: [PdTrigerService, GetGeometricLocationService],
@ -265,11 +268,13 @@ const pdCustomNotifierOptions: NotifierOptions = {
imports: [
CommonModule,
ManagePdRoutingModule,
NgxViewerModule,
NotifierModule.withConfig(pdCustomNotifierOptions),
CKEditorModule,
PdfViewerModule,
MatCardModule,
MatIconModule,
MatAutocompleteModule,
MatInputModule,
MatRadioModule,
MatTableModule,
@ -279,6 +284,7 @@ const pdCustomNotifierOptions: NotifierOptions = {
MatToolbarModule,
FlexLayoutModule,
NgxDatatableModule,
MatChipsModule,
FormsModule,MatSlideToggleModule,
MatSelectModule, MatListModule,MatGridListModule, MatTabsModule, MatBadgeModule, MatCheckboxModule,MatStepperModule,MatSidenavModule ,MatMenuModule, MatButtonToggleModule,
ReactiveFormsModule,
@ -295,7 +301,7 @@ const pdCustomNotifierOptions: NotifierOptions = {
providers: [PdTrigerService, GetGeometricLocationService],
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, GeneralInfoComponent, PdRequirementComponent, ModelEditPdReportComponent, OtherApplicantDetailsComponent, NeighbourHoodComponent, DialogChangeCurrentVenrsion],
ClientInfoComponent, SupplierInfoComponent, CurrentLoanComponent, LoanDetailsComponent, OtherIncomeComponent, AssetsInfoComponent, AddressComponent, FamilyDetailsComponent, BankingDetailsComponent, StockComponent, EmploymentInfoComponent, BusinessInfoComponent, FinancialInfoComponent, LenderRepresentativeComponent,RentalInfoComponent, AssessedIncomeComponent, GeneralInfoComponent, PdRequirementComponent, ModelEditPdReportComponent, OtherApplicantDetailsComponent, NeighbourHoodComponent, DialogChangeCurrentVenrsion, FinalRemarksComponent],
})
export class ManagePdModule {

View File

@ -282,14 +282,14 @@ getPDFormDetailsWithID(pdID, formID ):Observable<any> {
// get Pd Final report Question Answer
getPdFinalReportDetails(pdId: number) {
getPdFinalReportDetails(pdId: number): Observable<any> {
return this._http.post<any>(this.apiUrl+"getFinalPDReportQuestions",{"pd_id":pdId})
.pipe(
catchError(this.handleError('operation', []))
)
}
getPDReportFinalDocument(pdId: any){
getPDReportFinalDocument(pdId: any): Observable<any>{
pdId.fk_createdby = this._aws.getlocale();
return this._http.post<any>(this.apiUrl+"generatePDReport",{"records": pdId})
.pipe(
@ -297,28 +297,28 @@ getPDFormDetailsWithID(pdID, formID ):Observable<any> {
)
}
getActualPDReportModelTemplate(pdId: any) {
getActualPDReportModelTemplate(pdId: any) : Observable<any>{
return this._http.post<any>(this.apiUrl+"getLatestPDReportBlob ",{"records":{"pd_id":pdId}})
.pipe(
catchError(this.handleError('operation', []))
)
}
updatePDReportDetails(records: any){
updatePDReportDetails(records: any): Observable<any>{
return this._http.post<any>(this.apiUrl+"saveNewVersionOfPDReport ",{"records": records})
.pipe(
catchError(this.handleError('operation', []))
)
}
getPdDocVersionList(pdId: number){
getPdDocVersionList(pdId: number): Observable<any>{
return this._http.post<any>(this.apiUrl+"getListOfPDReportVersions",{"records":{"pd_id":pdId}})
.pipe(
catchError(this.handleError('operation', []))
)
}
swapOlderPDReportToLatest(pdId: any){
swapOlderPDReportToLatest(pdId: any): Observable<any>{
pdId.fk_createdby = this._aws.getlocale();
alert(JSON.stringify(pdId));
return this._http.post<any>(this.apiUrl+"swapOlderPDReportToLatest",{"records": pdId})
@ -327,6 +327,12 @@ getPDFormDetailsWithID(pdID, formID ):Observable<any> {
)
}
getTypeofActivityForSuppliedInfoForm(pd_id: any): Observable<any>{
return this._http.post<any>(this.apiUrl+"getTypeOfActivetyFromBusinessForm", {"records": { "pd_id" : pd_id }})
.pipe(
catchError(this.handleError('operation', []))
)
}
@ -417,9 +423,29 @@ convertNumberToWords(amount) {
)
}
stockFormAccess(pdid: any): Observable<any> {
return this._http.post<any>(this.apiUrl+"getTypeOfActivetyFromBusinessForm",{"records":pdid})
.pipe(
catchError(this.handleError('operation', []))
)
}
// private handleError<T>(operation = 'operation', result?: T) {
// return (error: any): Observable<T> => {
// return of(result as T);
// };
// }
/**Search Filter
* Sriram
*/
overAllSearchFormDetails(searchItem)
{
let records = {'records':searchItem};
return this._http.post(this.apiUrl+'filterPDList',records).pipe(
catchError(this.handleError('operation', []))
);
}
}

View File

@ -0,0 +1,73 @@
<!--<div *ngIf="listofCity.length > 0">
<mat-card *ngFor="let city of listofCity; let i = index;">
<h4>{{city.name}}</h4>
<div *ngIf="city.branch_details.length > 0">
<form class="example-form">
<mat-form-field class="example-full-width">
<input matInput placeholder="Add Branch" name="first" [(ngModel)]="newElement[city.name]">
</mat-form-field> <span *ngIf="newElement[city.name]"><mat-icon (click)="addItem(city.name)">check</mat-icon></span>
</form>
<mat-list role="list" class="inlist">
<ng-container *ngFor="let branch of city.branch_details; let i = index;">
<mat-list-item role="listitem" *ngIf="branch.isactive == 1" class="list-item" [ngStyle]="{ 'border-color': i === currentElement ? '#f44336' : 'gray'}">
<label style="width: 80%" [hidden]="currentElement === i">{{branch.branch_name}}</label>
<input *ngIf="currentElement === i" matInput placeholder="Add Branch" [(ngModel)]="branch.branch_name">
<span (click)="editItem(i)" [hidden]="currentElement === i"><mat-icon>edit</mat-icon></span>
<span (click)="editItem(-1)" *ngIf="currentElement === i"><mat-icon>check</mat-icon></span>
<span (click)="deleteItem(branch, i)"><mat-icon>delete</mat-icon></span>
</mat-list-item>
</ng-container>
</mat-list>
</div>
<div *ngIf="city.branch_details.length == 0">
<h2 style="color: #ddd; text-align: center;">No Records Found...</h2>
</div>
</mat-card>
<pre>{{ newElement | json}}</pre>
<div class="row" style="text-align:right;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Reset" matTooltipPosition="above" (click)="reset();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="button"
(click)="saveBranch()"><mat-icon>save</mat-icon></button>
</div>
</div>
<div *ngIf="listofCity.length == 0">
<h2 style="color: #ddd; text-align: center;">No Records Found...</h2>
</div>-->
<form [formGroup]="_addEntityBranchFrom" (submit)="onSubmit()">
<div formArrayName="branch_details" class="example-full-width">
<mat-card *ngFor="let region of _addEntityBranchFrom.controls.branch_details['controls']; let i=index">
<mat-card-content *ngIf="region.get('isactive').value == 1">
<div [formGroupName]="i">
<div fxLayout="row wrap" fxLayout.xs="column" fxLayoutGap="2%" fxLayoutAlign="center center">
<mat-form-field fxFlex="30%">
<input matInput placeholder="Branch Name" name="first" formControlName="branch_name">
<mat-error *ngIf="submitted && region['controls'].branch_name.hasError('required')" class="mat-text-warn">Branch Name Required.!</mat-error>
</mat-form-field>
<mat-form-field fxFlex="30%">
<mat-select placeholder="City *" formControlName="fk_city_id">
<mat-option *ngFor="let city of m_city" [value]="city.fk_city_id">{{ city.name }}</mat-option>
</mat-select>
<mat-error *ngIf="submitted && region['controls'].fk_city_id.hasError('required')" class="mat-text-warn">City Required.!</mat-error>
</mat-form-field>
<div fxFlex="30%" style="text-align:center;">
<!--<mat-checkbox *ngIf="region.get('entity_lender_branch_id').value != null" formControlName="isactive" [ngModel]="region.get('isactive').value == 1 ? true : region.get('isactive').value == 0 ? false : null"
(ngModelChange)="region.get('isactive').value = $event ? 1 : 0"></mat-checkbox>
<span *ngIf="_addEntityBranchFrom.controls.branch_details.controls.length > 1" (click)="removeLanguage(i)">-->
<button (click)="deleteEntityBranch(i, $event); false" mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
<!--</span>-->
</div>
</div>
</div>
</mat-card-content>
</mat-card>
</div>
<div class="row" style="text-align:right;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1" color="primary" matTooltip="Add More Region Information" matTooltipPosition="above" (click)="addRegionFormData(null, $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)="reset();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="button" (click)="saveBranch(); false"><mat-icon>save</mat-icon></button>
</div>
</form>

View File

@ -0,0 +1,14 @@
.inlist{
display: flex;
flex-wrap: wrap;
}
.inlist > * {
width: 350px;
}
.list-item {
border: 1px solid gray;
margin: 2px;
border-radius: 6px;
}

View File

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { EntityBranchAddComponent } from './entity-branch-add.component';
describe('EntityBranchAddComponent', () => {
let component: EntityBranchAddComponent;
let fixture: ComponentFixture<EntityBranchAddComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ EntityBranchAddComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(EntityBranchAddComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,245 @@
import { Component, ViewChild, OnInit, OnDestroy, Input, Inject } from '@angular/core';
import { MatPaginator, MatSort, MatTableDataSource, MatDialog, MatDialogRef, MAT_DIALOG_DATA, PageEvent } from '@angular/material';
import { FormGroup, FormControl, FormBuilder, Validators, FormArray } from '@angular/forms';
import { ActivatedRoute, Router } from '@angular/router';
import { DataSource } from '@angular/cdk/table';
import { Observable } from 'rxjs/Observable';
import { NotifierService } from 'angular-notifier';
import { MastersService } from './../../../service/masters/masters.service';
import { EntityService } from './../../../service/entity/entity.service';
@Component({
selector: 'app-entity-branch-add',
templateUrl: './entity-branch-add.component.html',
styleUrls: ['./entity-branch-add.component.scss']
})
export class EntityBranchAddComponent implements OnInit {
@Input() public entityId: number;
public newElement: any= {};
public listofCity = [];
public listOfBranch = [];
public m_city: any = [];
public _addEntityBranchFrom: FormGroup;
public submitted = false;
/**
* Notifier service
*/
private notifier: NotifierService;
constructor(
notifier: NotifierService,
private entityService: EntityService,
private mastersService: MastersService,
private _formBuilder: FormBuilder) {
this.notifier = notifier;
this._addEntityBranchFrom = this._formBuilder.group({
branch_details: this._formBuilder.array([
// this.addRegionFormData(null, null),
])
})
}
ngOnInit() {
this.entityService.getEntityBranchList(this.entityId).subscribe(data => {
if (data.dataStatus) {
this.listofCity = data.records;
this.m_city = data.records.city_master;
// this.listOfBranch = data.records;
this.setFormDatas(data.records.branch_details);
}
}, err => {
})
}
setFormDatas(record) {
if (record.length > 0) {
for (let val of record) {
let vals = {
entity_lender_branch_id: val.entity_lender_branch_id,
branch_name: val.branch_name,
fk_entity_id: val.fk_entity_id,
fk_region_id: val.fk_region_id,
fk_city_id: val.fk_city_id,
fk_updatedby: val.fk_updatedby,
fk_createdby: val.fk_createdby,
isactive: val.isactive,
};
this.addRegionFormData(vals, null);
}
}
}
// convenience getter for easy access to form fields
get f() { return this._addEntityBranchFrom.controls; }
// Dynamic Form field creation Functionality : START ===>
initRegionFormLoad(data) {
return this._formBuilder.group({
entity_lender_branch_id: [data.entity_lender_branch_id],
branch_name: [data.branch_name, Validators.compose([Validators.required])],
fk_city_id: [data.fk_city_id, Validators.compose([Validators.required])],
fk_entity_id: [data.fk_entity_id],
fk_updatedby: [data.fk_updatedby],
fk_createdby: [data.fk_createdby],
isactive: [data.isactive],
});
}
addRegionFormData(data, e) {
if (data == null) {
let newDate = {
entity_lender_branch_id: null,
branch_name:null,
fk_entity_id: this.entityId,
fk_createdby: null,
fk_updatedby: null,
fk_city_id: null,
isactive: 1,
}
const control = <FormArray>this._addEntityBranchFrom.controls['branch_details'];
control.push(this.initRegionFormLoad(newDate));
} else {
const control = <FormArray>this._addEntityBranchFrom.controls['branch_details'];
control.push(this.initRegionFormLoad(data));
}
}
deleteEntityBranch(inx, e) {
e.stopPropagation();
const control = <FormArray>this._addEntityBranchFrom.controls['branch_details'];
// let dataS = control.controls[inx].value;
if(control.controls[inx].value['entity_lender_branch_id'] !== null){
console.log( this._addEntityBranchFrom.controls['branch_details']['controls'][inx].controls.isactive);
this._addEntityBranchFrom.controls['branch_details']['controls'][inx].controls.isactive.setValue("0");
console.log( this._addEntityBranchFrom.controls['branch_details']['controls'][inx].controls.isactive.value);
} else {
control.removeAt(inx);
}
}
// public listOfBranch = [
// {
// "entity_lender_branch_id": 1,
// "branch_name": "Dev Test Branch 1",
// "isactive": "1",
// "fk_createdby": "1",
// "fk_updatedby": "1",
// "fk_entity_id": "1"
// },
// {
// "entity_lender_branch_id": 2,
// "branch_name": "Dev Test Branch 2",
// "isactive": "1",
// "fk_createdby": "1",
// "fk_updatedby": "1",
// "fk_entity_id": "1"
// },
// {
// "entity_lender_branch_id": 3,
// "branch_name": "Dev Test Branch 3",
// "isactive": "1",
// "fk_createdby": "1",
// "fk_updatedby": "1",
// "fk_entity_id": "1"
// }
// ];
addItem(prop): void {
// let data = {
// "entity_lender_branch_id": null,
// "branch_name": this.newElement.name,
// "isactive": "1",
// "fk_createdby": null,
// "fk_updatedby": null,
// "fk_entity_id": this.entityId.toString()
// }
// this.listOfBranch.push(data);
// this.newElement.name = '';
}
public currentElement = -1;
editItem(i): void {
this.currentElement = i;
}
deleteItem(obj, i): void {
if (obj.entity_lender_branch_id !== null) {
obj.isactive = 0;
} else {
this.listOfBranch.splice(i, 1);
}
}
/** To Save/Edited Popup Data */
onSubmit() {
alert();
this.submitted = true;
// stop here if form is invalid
if (this._addEntityBranchFrom.invalid) {
// this.errorMessage = "Please Fill All Mandate Fields.";
return;
} else {
var formValues = this._addEntityBranchFrom.value;
//To Remove The "Null" With Key also
Object.keys(formValues).forEach((key) => (formValues[key] == null) && delete formValues[key]);
alert(JSON.stringify(formValues.branch_details));
// this.entityService.updateEntityIdRegionInfoDetails(formValues.region_lender).subscribe(
// dataresult => {
// if (dataresult.status == 200) {
// console.log(dataresult);
// this.notifier.notify('success', 'Your Changes Updated.!');
// const arr = <FormArray>this._editEntityRegionFrom.controls.region_lender;
// arr.controls.splice(0);
// // this.getEntityIDRegionInfoDetails();
// }
// else {
// this.notifier.notify('warning', 'Something Wents Wrong Try Again.!');
// // this.errorMessage = "Something Wents Wrong Try Again.!";
// }
// }, error => {
// this.notifier.notify('warning', 'Something Wents Wrong Try Again.!');
// // this.errorMessage = "Some Thing Wents Wrong Try Again.!";
// });
}
}
saveBranch(): void {
// alert();
var formValues = this._addEntityBranchFrom.value;
//To Remove The "Null" With Key also
Object.keys(formValues).forEach((key) => (formValues[key] == null) && delete formValues[key]);
// alert(JSON.stringify(formValues.branch_details));
this.entityService.updateEntityIdBranchInfoDetails(formValues.branch_details).subscribe(data => {
if (data.dataStatus) {
this.notifier.notify('success', 'Your Changes Updated.!');
} else {
this.notifier.notify('warning', 'Something Wents Wrong Try Again.!');
}
}, err => {
this.notifier.notify('warning', 'Something Wents Wrong Try Again.!');
})
}
reset(): void {
this.listOfBranch = [];
this.ngOnInit();
}
}
// "records": [
// {
// "entity_lender_branch_id": null,
// "branch_name": "Dev Test Branch",
// "isactive": "1",
// "fk_createdby": "1",
// "fk_updatedby": "1",
// "fk_entity_id": "1"
// }
// ]

View File

@ -233,6 +233,12 @@
<app-entity-edit-vendor-city-info [entityId]="entity_id">
</app-entity-edit-vendor-city-info>
</ng-template>
</mat-tab>
<mat-tab *ngIf="localEntityType == 2" label="Branch">
<ng-template matTabContent>
<app-entity-branch-add [entityId]="entity_id">
</app-entity-branch-add>
</ng-template>
</mat-tab>
<mat-tab label="TAT Information">
<ng-template matTabContent>

View File

@ -38,6 +38,7 @@ import { EntityEditBillingInfoComponent } from './entity-edit/entity-edit-billin
import { DialogAddEditBillingInfo } from './entity-edit/entity-edit-billing-info/entity-edit-billing-info.component';
import { EntityEditVendorCityInfoComponent } from './entity-edit/entity-edit-vendor-city-info/entity-edit-vendor-city-info.component';
import { EntityBranchAddComponent } from './entity-edit/entity-branch-add/entity-branch-add.component';
// import { MatTooltipModule } from '@angular/material/tooltip';
/**
* Custom angular notifier options
@ -115,7 +116,8 @@ const customNotifierOptions: NotifierOptions = {
EntityEditPriceComponent,
EntityEditBillingInfoComponent,
DialogAddEditBillingInfo,
EntityEditVendorCityInfoComponent
EntityEditVendorCityInfoComponent,
EntityBranchAddComponent
],
entryComponents: [
EntityEditComponent,

View File

@ -165,6 +165,22 @@ export class EntityService {
}
getEntityBranchList(entity_id: any): Observable<any> {
// Add safe, URL encoded search parameter if there is a search term
const options = entity_id ?
{ params: new HttpParams().set('entityid', entity_id) } : {};
return this._http.get<any[]>(this.apiUrl + "listLenderBranches", options);
}
updateEntityIdBranchInfoDetails(Records: any): Observable<any>{
Records.map(data=>{
data.fk_updatedby = data.fk_createdby == null ? null : this._aws.getlocale();
data.fk_createdby = data.fk_createdby == null ? this._aws.getlocale() : data.fk_createdby;
})
return this._http.post<any[]>(this.apiUrl + "saveLenderBranches", {'records': Records });
}
/**
* TO Handle The Error

View File

@ -44,6 +44,7 @@ Author: TrendSetter Themes
@import "scss/core";
@import "scss/material";
@import "scss/utilities/utilities";
@import '~viewerjs/dist/viewer.css';
/* Add application styles & imports to this file! */