Sineedge/sparq-lender
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

list and view page mobile responsive

Browse Source
This commit is contained in:
sriram-at-840620226347 2020-11-05 18:22:39 +05:30
parent 5027ffa334
commit 4c11d94c1a
22 changed files with 1231 additions and 332 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
ng6-seed/angular.json
View File

@ -197,5 +197,8 @@
"@schematics/angular:directive": { "@schematics/angular:directive": {
"prefix": "app" "prefix": "app"
} }
},
"cli": {
"analytics": "509641b9-0932-4a65-bc55-144b73b41471"
} }
} }

18
ng6-seed/package-lock.json generated
View File

@ -2626,9 +2626,9 @@
} }
}, },
"caniuse-lite": { "caniuse-lite": {
"version": "1.0.30001150", "version": "1.0.30001151",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001150.tgz", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001151.tgz",
"integrity": "sha512-kiNKvihW0m36UhAFnl7bOAv0i1K1f6wpfVtTF5O5O82XzgtBnb05V0XeV3oZ968vfg2sRNChsHw8ASH2hDfoYQ==", "integrity": "sha512-Zh3sHqskX6mHNrqUerh+fkf0N72cMxrmflzje/JyVImfpknscMnkeJrlFGJcqTmaa0iszdYptGpWMJCRQDkBVw==",
"dev": true "dev": true
}, },
"caseless": { "caseless": {
@ -4054,9 +4054,9 @@
"dev": true "dev": true
}, },
"electron-to-chromium": { "electron-to-chromium": {
"version": "1.3.582", "version": "1.3.584",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.582.tgz", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.584.tgz",
"integrity": "sha512-0nCJ7cSqnkMC+kUuPs0YgklFHraWGl/xHqtZWWtOeVtyi+YqkoAOMGuZQad43DscXCQI/yizcTa3u6B5r+BLww==", "integrity": "sha512-NB3DzrTzJFhWkUp+nl2KtUtoFzrfGXTir2S+BU4tXGyXH9vlluPuFpE3pTKeH7+PY460tHLjKzh6K2+TWwW+Ww==",
"dev": true "dev": true
}, },
"elliptic": { "elliptic": {
@ -11871,9 +11871,9 @@
"integrity": "sha1-t8+nHnaPHJAAxJe5FRswlHxQ5G0=" "integrity": "sha1-t8+nHnaPHJAAxJe5FRswlHxQ5G0="
}, },
"timers-browserify": { "timers-browserify": {
"version": "2.0.11", "version": "2.0.12",
"resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.11.tgz", "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.12.tgz",
"integrity": "sha512-60aV6sgJ5YEbzUdn9c8kYGIqOubPoUdqQCul3SBAsRCZ40s6Y5cMcrW4dt3/k/EsbLVJNl9n6Vz3fTc+k2GeKQ==", "integrity": "sha512-9phl76Cqm6FhSX9Xe1ZUAMLtm1BLkKj2Qd5ApyWkXzsMRaA7dgr81kf4wJmQf/hAvg8EEyJxDo3du/0KlhPiKQ==",
"dev": true, "dev": true,
"requires": { "requires": {
"setimmediate": "^1.0.4" "setimmediate": "^1.0.4"

2
ng6-seed/src/app/lender-credit-pd/pd-list/pd-list.component.html
View File

@ -14,7 +14,7 @@
(resetFilter)= "loadSalesPDDetails()"></app-credit-advance-filter> --> (resetFilter)= "loadSalesPDDetails()"></app-credit-advance-filter> -->
<p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p> <p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p>
<br/> <br/>
<mat-table [dataSource]="dataSourceTab4" matSort *ngIf="salesPdData.length > 0" > <mat-table #table_element [dataSource]="dataSourceTab4" matSort *ngIf="salesPdData.length > 0" >
<ng-container matColumnDef="SalesPdId"> <ng-container matColumnDef="SalesPdId">
<mat-cell class="cell" *matCellDef="let details;" fxFlex.xs="7" fxFlex.sm="7" fxFlex.md="7" fxFlex.lg="7" fxFlex.xl="10"> <mat-cell class="cell" *matCellDef="let details;" fxFlex.xs="7" fxFlex.sm="7" fxFlex.md="7" fxFlex.lg="7" fxFlex.xl="10">

31
ng6-seed/src/app/lender-credit-pd/pd-list/pd-list.component.scss
View File

@ -2,13 +2,7 @@
transform: scale(1.1); transform: scale(1.1);
color: green; color: green;
} }
.cell{
display:inline !important;
// text-align: center !important;
}
.cellhide{
display: none !important;
}
.center{ .center{
text-align:center; text-align:center;
} }
@ -26,3 +20,26 @@ p.note {
font-weight: bold; font-weight: bold;
} }
::ng-deep .mat-cell{
display: inline !important;
}
@media(max-width: 600px) {
.cell{
display: none !important;
}
.mobile-label {
width: 80px;
display: inline-block;
font-weight: bold;
}
.mat-header-row {
display: none;
}
.mat-row {
flex-direction: column;
align-items: start;
padding: 8px 24px;
}
}

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

@ -1,5 +1,5 @@
<mat-card> <mat-card>
<mat-card-content> <mat-card-content style="padding: 0px !important;">
<div *ngIf="!loadControl"> <div *ngIf="!loadControl">
<div fxLayoutAlign="center"> <div fxLayoutAlign="center">
<mat-progress-spinner mode="indeterminate" class="primary"></mat-progress-spinner> <mat-progress-spinner mode="indeterminate" class="primary"></mat-progress-spinner>

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

@ -12,32 +12,32 @@
</mat-expansion-panel-header> </mat-expansion-panel-header>
<mat-list class="m-gap p-gap"> <mat-list class="m-gap p-gap">
<div [formGroup]="searchForm"> <div [formGroup]="searchForm">
<mat-form-field style="width:20%"> <mat-form-field style="width:20%" class="matfieldblock">
<mat-select multiple formControlName="pd_type" placeholder="PD Type"> <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-option *ngFor="let type of PDType" [value]="type.pd_type_id">{{type.type_name}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> &nbsp; &nbsp; </mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:25%"> <mat-form-field style="width:25%" class="matfieldblock">
<mat-select multiple formControlName="pd_status" placeholder="PD Status"> <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-option *ngFor="let status of pdStatus" [value]="status.pd_status_name">{{status.pd_status_name}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> &nbsp; &nbsp; </mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:20%"> <mat-form-field style="width:20%" class="matfieldblock">
<input matInput [matDatepicker]="picker" (blur)="checkDate($event)" [max]="todaydate" formControlName="pd_from_date" placeholder="Choose a From date"> <input matInput [matDatepicker]="picker" (blur)="checkDate($event)" [max]="todaydate" formControlName="pd_from_date" placeholder="Choose a From date">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle> <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker> <mat-datepicker #picker></mat-datepicker>
</mat-form-field> &nbsp; &nbsp; </mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:20%"> <mat-form-field style="width:20%" class="matfieldblock">
<input matInput [matDatepicker]="picker1" [min]="searchForm.get('pd_from_date').value" [max]="todaydate" formControlName="pd_to_date" placeholder="Choose a todate"> <input matInput [matDatepicker]="picker1" [min]="searchForm.get('pd_from_date').value" [max]="todaydate" formControlName="pd_to_date" placeholder="Choose a todate">
<mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle> <mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
<mat-datepicker #picker1></mat-datepicker> <mat-datepicker #picker1></mat-datepicker>
</mat-form-field> </mat-form-field>
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<mat-select multiple formControlName="pd_products" placeholder="Products"> <mat-select multiple formControlName="pd_products" placeholder="Products">
<mat-option *ngFor="let pro of PRODUCTS" [value]="pro.product_id">{{pro.name}}</mat-option> <mat-option *ngFor="let pro of PRODUCTS" [value]="pro.product_id">{{pro.name}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> &nbsp; &nbsp; </mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<mat-select multiple formControlName="pd_city" placeholder="City"> <mat-select multiple formControlName="pd_city" placeholder="City">
<mat-option *ngFor="let city of CITY" [value]="city.city_id">{{city.name}}</mat-option> <mat-option *ngFor="let city of CITY" [value]="city.city_id">{{city.name}}</mat-option>
</mat-select> </mat-select>
@ -47,10 +47,10 @@
<mat-option *ngFor="let ent of ENTITY" [value]="ent.entity_id">{{ent.full_name}}</mat-option> <mat-option *ngFor="let ent of ENTITY" [value]="ent.entity_id">{{ent.full_name}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> --> </mat-form-field> -->
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<input matInput type="text" formControlName="pd_name" placeholder="Applicant Name"> <input matInput type="text" formControlName="pd_name" placeholder="Applicant Name">
</mat-form-field> &nbsp; &nbsp; </mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<input matInput type="text" formControlName="pd_applicant_id" placeholder="Applicant Id"> <input matInput type="text" formControlName="pd_applicant_id" placeholder="Applicant Id">
</mat-form-field> </mat-form-field>
<div align="right"> <div align="right">
@ -73,17 +73,60 @@
<p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p> <p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p>
<br/> <br/>
<mat-table [dataSource]="dataSourceTab1" matSort *ngIf="PdListData.length > 0"> <div class="example-container">
<div fxLayout="row wrap" *ngFor="let details of pagedList" (click)="viewPD(details.is_child == 0 ? details.pd_id : details.parent_pd_id,details.random_string)" class="webhide">
<!--Start Mobile View Code-->
<!-- <div (click)="viewPD(details.is_child == 0 ? details.pd_id : details.parent_pd_id,details.random_string)" class="webhide"> -->
<div fxFlex.xs="20" fxFlex.sm="20" class="webhide" style="text-align: center;">
<p class="lettericon">{{details.pd_sno_split.lender_name}}<br/>
<span style="font-size: 90%">{{details.pd_sno_split.serial_no}}</span></p>
<span class="lettertext" style="color: #e2412f;">{{details.pd_type_name}}</span>
</div>
<div fxFlex.xs="80" fxFlex.sm="80" class="webhide">
<div fxLayout="row wrap" style="margin-left: 6px;">
<div fxFlex.xs="100" fxFlex.sm="100" class="webhide">
<span style="font-size: 100%;" *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b>
</span>
</div>
</div>
<div fxLayout="row wrap" style="margin-left: 6px;">
<div fxFlex.xs="50" fxFlex.sm="50" class="webhide">
<span class="lettertext" *ngIf="!details.lender_applicant_id"> Not Provided</span>
<span class="lettertext" *ngIf="details.lender_applicant_id"> {{details.lender_applicant_id}}</span>
</div>
<div fxFlex.xs="50" fxFlex.sm="50" class="webhide" style="text-align: right;">
<span *ngIf="details.product_abbr" mat-line class="lettertext"> {{details.product_abbr}}<span *ngIf="details.subproduct_abbr">/{{details.subproduct_abbr}}</span></span>
</div>
</div>
<div fxLayout="row wrap" style="margin-left: 6px;">
<div fxFlex.xs="55" fxFlex.sm="55" class="webhide">
<span class="lettertext" *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="lettertext" *ngIf="details.pd_status=='QC_COMPLETED'" matTooltip="QC Completed" matTooltipPosition="above">{{ (details.updatedon)? (details.updatedon | slice:0:10):(details.updatedon) }}
</span>
<span class="lettertext" *ngIf="details.pd_status=='SCHEDULED'" [matTooltip]="details.pd_status | titlecase" matTooltipPosition="above">{{details.scheduled_on}}
</span>
</div>
<div fxFlex.xs="45" fxFlex.sm="45" class="webhide" style="text-align: right;">
<span class="lettertext" *ngIf="details.pd_status!='QC_COMPLETED'"> {{details.pd_status}}</span>
<span class="lettertext" *ngIf="details.pd_status=='QC_COMPLETED'"> QC COMPLETED</span>
</div>
</div>
</div>
<mat-divider></mat-divider>
</div>
<!-- </div>-->
<!--End Mobile View Code-->
<ng-container matColumnDef="PDType"> <!--Start Web View Code-->
<div fxLayout="row wrap" *ngFor="let details of pagedList">
<mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="13" fxFlex.lg="15" fxFlex.xl="13" class="cell" *matCellDef="let details;" style="justify-content:flex-end"> <div fxFlex.xs="20" fxFlex.sm="20" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<div [ngStyle]="{'color': '#e00201','font-weight': 'bold','font-size':'16px'}" mat-line>{{details.pd_sno}}</div> <div [ngStyle]="{'color': '#e00201','font-weight': 'bold','font-size':'16px'}" mat-line>{{details.pd_sno}}</div>
<small mat-line>{{details.pd_type_name}}</small> <span mat-line class="cell">{{details.pd_type_name}}</span>
</mat-cell> </div>
</ng-container> <div fxFlex.xs="30" fxFlex.sm="30" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<ng-container matColumnDef="Name">
<mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="22" fxFlex.lg="24" fxFlex.xl="16" class="cell" *matCellDef="let details;">
<span *ngIf="details.is_child" mat-line> <span *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b> <b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b>
</span> </span>
@ -91,60 +134,121 @@
<span class="fontsize" *ngIf="!details.lender_applicant_id"> Not Provided</span> <span class="fontsize" *ngIf="!details.lender_applicant_id"> Not Provided</span>
<span class="fontsize" *ngIf="details.lender_applicant_id"> {{details.lender_applicant_id}}</span> <span class="fontsize" *ngIf="details.lender_applicant_id"> {{details.lender_applicant_id}}</span>
<span class="fontsize" *ngIf="details.customer_segment_abbr">-({{details.customer_segment_abbr}} )</span> <span class="fontsize" *ngIf="details.customer_segment_abbr">-({{details.customer_segment_abbr}} )</span>
</mat-cell> </div>
</ng-container> <div fxFlex.xs="40" fxFlex.sm="40" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<ng-container matColumnDef="Lenderid">
<mat-cell class="cell" *matCellDef="let details">
<span *ngIf="details.lender_short_name" mat-line> {{details.lender_short_name}} </span> <span *ngIf="details.lender_short_name" mat-line> {{details.lender_short_name}} </span>
<br> <br>
<span *ngIf="details.product_abbr" mat-line class="fontsize"> {{details.product_abbr}}<span *ngIf="details.subproduct_abbr">/{{details.subproduct_abbr}}</span></span> <span *ngIf="details.product_abbr" mat-line class="fontsize"> {{details.product_abbr}}<span *ngIf="details.subproduct_abbr">/{{details.subproduct_abbr}}</span></span>
<br> <br>
<span *ngIf="details.loan_amount" class="fontsize"> <span *ngIf="details.loan_amount" class="fontsize">
<i class="fa-1x fa fa-rupee"></i> {{details.loan_amount}}</span> <i class="fa-1x fa fa-rupee"></i> {{details.loan_amount}}</span>
</mat-cell> </div>
</ng-container> <div fxFlex.xs="40" fxFlex.sm="40" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<ng-container matColumnDef="Address">
<mat-cell class="cell" *matCellDef="let details;">
<span matTooltip="Initiated Date" matTooltipPosition="above">{{details.pd_date_of_initiation}}</span> <span matTooltip="Initiated Date" matTooltipPosition="above">{{details.pd_date_of_initiation}}</span>
<br> <br>
<span class="fontsize" *ngIf="details.city_name"> <span class="fontsize" *ngIf="details.city_name">
<i class="fa-1x fa fa-map-marker"> </i> {{details.city_name}}-{{details.pincode_id == 1 ? details.other_pincode : details.pincode }} </span> <i class="fa-1x fa fa-map-marker"> </i> {{details.city_name}}-{{details.pincode_id == 1 ? details.other_pincode : details.pincode }} </span>
</mat-cell> </div>
</ng-container> <div fxFlex.xs="30" fxFlex.sm="30" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="center no-pad cell" style="justify-content:flex-end">
<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'"> {{details.pd_status}}</span>
<span *ngIf="details.pd_status=='QC_COMPLETED'"> QC COMPLETED</span> <span *ngIf="details.pd_status=='QC_COMPLETED'"> QC COMPLETED</span>
<br> <br>
<span class="fontsize" *ngIf="details.pd_status!='SCHEDULED' && details.pd_status!='QC_COMPLETED'" [matTooltip]="details.pd_status | titlecase" <span class="fontsize cell" *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) }} matTooltipPosition="above">{{ (details.updatedon)? (details.updatedon | slice:0:10):(details.updatedon) }}
</span> </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>
<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> </span>
</mat-cell> </div>
</ng-container> <div fxFlex.xs="20" fxFlex.sm="20" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell center" style="justify-content:flex-end">
<ng-container matColumnDef="Action"> <a [style.visibility]="details.pd_status=='INITIATED' && details.encrypted_url!=null && details.encrypted_url!='' ? 'visible' : 'hidden'" [attr.href]="details.encrypted_url" target="_blank">
<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"
<a [style.visibility]="details.pd_status=='INITIATED' && details.encrypted_url!=null && details.encrypted_url!='' ? 'visible' : 'hidden'" [attr.href]="details.encrypted_url" target="_blank"> matTooltip="Officer Tracking" matTooltipPosition="above">
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" color="primary" <mat-icon>my_location</mat-icon>
matTooltip="Officer Tracking" matTooltipPosition="above"> </button>
<mat-icon>my_location</mat-icon> </a>
</button>
</a>
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" color="primary" (click)="viewPD(details.is_child == 0 ? details.pd_id : details.parent_pd_id,details.random_string)" <button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" color="primary" (click)="viewPD(details.is_child == 0 ? details.pd_id : details.parent_pd_id,details.random_string)"
matTooltip="View" matTooltipPosition="above"> matTooltip="View" matTooltipPosition="above">
<mat-icon>visibility</mat-icon> <mat-icon>visibility</mat-icon>
</button> </button>
</div>
<!--End Web View Code-->
<mat-divider></mat-divider>
</div>
</div>
</mat-cell> <!-- <mat-table [dataSource]="dataSourceTab1" matSort *ngIf="PdListData.length > 0">
</ng-container>
<mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;"> <ng-container matColumnDef="PDType">
</mat-row>
</mat-table>
<mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="13" fxFlex.lg="15" fxFlex.xl="13" class="cell" *matCellDef="let details;" style="justify-content:flex-end">
<div [ngStyle]="{'color': '#e00201','font-weight': 'bold','font-size':'16px'}" mat-line>{{details.pd_sno}}</div>
<small mat-line>{{details.pd_type_name}}</small>
</mat-cell>
</ng-container>
<ng-container matColumnDef="Name">
<mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="22" fxFlex.lg="24" fxFlex.xl="16" class="cell" *matCellDef="let details;">
<span *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b>
</span>
<br>
<span class="fontsize" *ngIf="!details.lender_applicant_id"> Not Provided</span>
<span class="fontsize" *ngIf="details.lender_applicant_id"> {{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_short_name" mat-line> {{details.lender_short_name}} </span>
<br>
<span *ngIf="details.product_abbr" mat-line class="fontsize"> {{details.product_abbr}}<span *ngIf="details.subproduct_abbr">/{{details.subproduct_abbr}}</span></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_id == 1 ? details.other_pincode : 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>
<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>
</mat-cell>
</ng-container>
<ng-container matColumnDef="Action">
<mat-cell class="cell center" *matCellDef="let details;">
<a [style.visibility]="details.pd_status=='INITIATED' && details.encrypted_url!=null && details.encrypted_url!='' ? 'visible' : 'hidden'" [attr.href]="details.encrypted_url" target="_blank">
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" color="primary"
matTooltip="Officer Tracking" matTooltipPosition="above">
<mat-icon>my_location</mat-icon>
</button>
</a>
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" color="primary" (click)="viewPD(details.is_child == 0 ? details.pd_id : details.parent_pd_id,details.random_string)"
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> -->
<!-- <ng-template #noRecord> <!-- <ng-template #noRecord>
<div> No Record found </div> <div> No Record found </div>
</ng-template> --> </ng-template> -->
@ -152,7 +256,7 @@
</mat-card-content> </mat-card-content>
<div [hidden]="recordStatus"> <div [hidden]="recordStatus">
<mat-paginator #paginator class="mat-elevation-z1" [length]="PdListData.length" [pageIndex]="pageIndex" <mat-paginator #paginator class="mat-elevation-z1" [length]="PdListData.length" [pageIndex]="pageIndex"
[pageSize]="pageSize" [pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons> [pageSize]="pageSize" [pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent=OnPageChange($event)" showFirstLastButtons>
</mat-paginator> </mat-paginator>
</div> </div>
<mat-card-content *ngIf="recordStatus"> <mat-card-content *ngIf="recordStatus">

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

@ -2,12 +2,8 @@
transform: scale(1.1); transform: scale(1.1);
color: green; color: green;
} }
.cell{
display:inline !important;
}
.cellhide{
display: none !important;
}
.center{ .center{
text-align:center; text-align:center;
} }
@ -26,4 +22,71 @@ p.note {
font-weight: bold; font-weight: bold;
} }
// .example-container {
// display: flex;
// flex-direction: column;
// max-height: 500px;
// min-width: 300px;
// }
// .mat-table {
// overflow: auto;
// max-height: 500px;
// }
.mobile-label {
display: none;
}
@media(min-width: 600px) {
.webhide{
display: none !important;
}
}
@media(max-width: 600px) {
.body-container {
padding: 0px !important;
}
.mat-expansion-panel-body {
padding: 0 10px 16px !important;
}
.cell{
display: none !important;
}
.mat-form-field{
display: inline !important;
}
// .no-pad{
// text-align: left !important;
// padding-left: 0px !important;
// }
.mobile-label {
width: 80px;
display: inline-block;
font-weight: bold;
}
.mat-header-row {
display: none;
}
.mat-row {
flex-direction: column;
align-items: start;
padding: 8px 24px;
}
.lettericon{
// background-color: cadetblue;
// padding: 6px 7px 6px 7px;
border-radius: 10px;
color: #e2412f;
font-size: 75%;
font-weight: bold;
min-width: 4.4em;
text-align: center;
margin: 10px 0px 0px 0px !important;
}
.lettertext{
font-size: 80%;
}
}

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

@ -51,6 +51,7 @@ export class AllPdComponent implements OnInit, OnChanges {
user_role_name: string; user_role_name: string;
limitMsg: boolean = false; limitMsg: boolean = false;
common: any; common: any;
pagedList: any=[];
constructor(private _pd: PdTrigerService,private _fb:FormBuilder,notifier: NotifierService,private userService:UserService) { constructor(private _pd: PdTrigerService,private _fb:FormBuilder,notifier: NotifierService,private userService:UserService) {
this.notifier = notifier; this.notifier = notifier;
@ -111,14 +112,25 @@ console.log(this.displayedColumns)
data => { data => {
if (data.status == 200) { if (data.status == 200) {
this.PdListData = data.records; this.PdListData = data.records;
this.dataLengthTab1 = data.records.length; // this.PdListData = <GetOrInitializeYourListHere>;
this.dataSourceTab1.data = this.PdListData; this.pagedList = this.PdListData.slice(0, 10);
this.length = this.PdListData.length;
this.PdListData.forEach(value=>{
let original=value.pd_sno
value.pd_sno_split={lender_name:original.replace(/[^a-z]/gi, ''),serial_no:original.match(/(\d+)/)[0]}
})
// this.dataLengthTab1 = data.records.length;
// this.dataSourceTab1.data = this.PdListData;
this.recordStatus=false; this.recordStatus=false;
this.limitMsg = true this.limitMsg = true
} }
else{ else{
this.PdListData=[]; this.PdListData=[];
this.dataSourceTab1.data = []; // this.pagedList.forEach(value=>{
// let original=value.pd_sno
// value.pd_sno_split={lender_name:original.replace(/[^a-z]/gi, ''),serial_no:original.match(/(\d+)/)[0]}
// })
// this.dataSourceTab1.data = [];
this.recordStatus=true; this.recordStatus=true;
this.limitMsg = false this.limitMsg = false
} }
@ -130,6 +142,16 @@ console.log(this.displayedColumns)
alert(error.html_format); alert(error.html_format);
}); });
} }
OnPageChange(event: PageEvent){
let startIndex = event.pageIndex * event.pageSize;
let endIndex = startIndex + event.pageSize;
if(endIndex > this.length){
endIndex = this.length;
}
this.pagedList = this.PdListData.slice(startIndex, endIndex);
}
pageChange(e) { pageChange(e) {
console.log(e); console.log(e);
} }
@ -226,17 +248,25 @@ console.log(this.displayedColumns)
if(res['dataStatus']) if(res['dataStatus'])
{ {
this.PdListData = res['records']; this.PdListData = res['records'];
this.dataSourceTab1.data = res['records']; this.pagedList = this.PdListData.slice(0, 10);
// console.log('records',res['records']); this.length = this.PdListData.length;
this.dataSourceTab1.paginator = this.paginator; this.PdListData.forEach(value=>{
let original=value.pd_sno
value.pd_sno_split={lender_name:original.replace(/[^a-z]/gi, ''),serial_no:original.match(/(\d+)/)[0]}
})
// this.dataSourceTab1.data = res['records'];
// // console.log('records',res['records']);
// this.dataSourceTab1.paginator = this.paginator;
this.recordStatus=false this.recordStatus=false
this.limitMsg = false this.limitMsg = false
}else{ }else{
this.notifier.notify('warning', 'No Records Found !'); this.notifier.notify('warning', 'No Records Found !');
this.dataSourceTab1.paginator['length'] = 0; // this.dataSourceTab1.paginator['length'] = 0;
this.dataSourceTab1.paginator['pageIndex'] = 0; // this.dataSourceTab1.paginator['pageIndex'] = 0;
this.dataSourceTab1.data = []; // this.dataSourceTab1.data = [];
this.PdListData = []; this.PdListData = [];
this.pagedList = [];
// this.length = this.PdListData.length;
this.recordStatus = true; this.recordStatus = true;
this.limitMsg = false this.limitMsg = false
// console.log('records-records',res['records']); // console.log('records-records',res['records']);

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

@ -72,7 +72,88 @@
</mat-expansion-panel> </mat-expansion-panel>
<p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p> <p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p>
<br/> <br/>
<mat-table [dataSource]="dataSourceTab4" matSort *ngIf="completedPdListData.length > 0" > <div class="example-container">
<!--Start Mobile View Code-->
<div fxLayout="row wrap" *ngFor="let details of pagedList" (click)="viewPD(details.is_child == 0 ? details.pd_id : details.parent_pd_id,details.random_string)" class="webhide">
<div fxFlex.xs="20" fxFlex.sm="20" class="webhide" style="text-align: center;">
<p class="lettericon">{{details.pd_sno_split.lender_name}}<br/>
<span style="font-size: 90%">{{details.pd_sno_split.serial_no}}</span></p>
<span class="lettertext" style="color: #e2412f;">{{details.pd_type_name}}</span>
</div>
<div fxFlex.xs="80" fxFlex.sm="80" class="webhide">
<div fxLayout="row wrap" style="margin-left: 6px;">
<div fxFlex.xs="100" fxFlex.sm="100" class="webhide">
<span style="font-size: 100%;" *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD'}}</b>
</span>
</div>
</div>
<div fxLayout="row wrap" style="margin-left: 6px;">
<div fxFlex.xs="50" fxFlex.sm="50" class="webhide">
<span class="lettertext" *ngIf="!details.lender_applicant_id"> Not Provided</span>
<span class="lettertext" *ngIf="details.lender_applicant_id"> {{details.lender_applicant_id}}</span>
</div>
<div fxFlex.xs="50" fxFlex.sm="50" class="webhide" style="text-align: right;">
<span *ngIf="details.product_abbr" mat-line class="lettertext"> {{details.product_abbr}}<span *ngIf="details.subproduct_abbr">/{{details.subproduct_abbr}}</span></span>
</div>
</div>
<div fxLayout="row wrap" style="margin-left: 6px;">
<div fxFlex.xs="55" fxFlex.sm="55" class="webhide">
<span class="lettertext" [matTooltip]="details.pd_status | titlecase" matTooltipPosition="above">{{ (details.updatedon)? (details.updatedon | slice:0:10):(details.updatedon) }}</span>
</div>
<div fxFlex.xs="45" fxFlex.sm="45" class="webhide" style="text-align: right;">
<span class="lettertext"> {{details.pd_status}}</span>
</div>
</div>
</div>
<mat-divider></mat-divider>
</div>
<!--End Mobile View Code-->
<!--Start Web View Code-->
<div fxLayout="row wrap" *ngFor="let details of pagedList">
<div fxFlex.xs="20" fxFlex.sm="20" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<div [ngStyle]="{'color': '#e00201','font-weight': 'bold','font-size':'16px'}" mat-line>{{details.pd_sno}}</div>
<span mat-line class="cell">{{details.pd_type_name}}</span>
</div>
<div fxFlex.xs="30" fxFlex.sm="30" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<span *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b>
</span>
<br>
<span class="fontsize" *ngIf="!details.lender_applicant_id"> Not Provided</span>
<span class="fontsize" *ngIf="details.lender_applicant_id"> {{details.lender_applicant_id}}</span>
<span class="fontsize" *ngIf="details.customer_segment_abbr">-({{details.customer_segment_abbr}} )</span>
</div>
<div fxFlex.xs="40" fxFlex.sm="40" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<span *ngIf="details.lender_short_name" mat-line> {{details.lender_short_name}} </span>
<br>
<span *ngIf="details.product_abbr" mat-line class="fontsize"> {{details.product_abbr}}<span *ngIf="details.subproduct_abbr">/{{details.subproduct_abbr}}</span></span>
<br>
<span *ngIf="details.loan_amount" class="fontsize">
<i class="fa-1x fa fa-rupee"></i> {{details.loan_amount}}</span>
</div>
<div fxFlex.xs="40" fxFlex.sm="40" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<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_id == 1 ? details.other_pincode : details.pincode }} </span>
</div>
<div fxFlex.xs="30" fxFlex.sm="30" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="center no-pad cell" style="justify-content:flex-end">
<span> {{details.pd_status}}</span><br>
<span class="fontsize" [matTooltip]="details.pd_status | titlecase" >{{ (details.updatedon)? (details.updatedon | slice:0:10):(details.updatedon) }}</span>
</div>
<div fxFlex.xs="20" fxFlex.sm="20" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell center" style="justify-content:flex-end">
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="viewPD(details.is_child == 0 ? details.pd_id : details.parent_pd_id,details.random_string)" matTooltip="View"
matTooltipPosition="above" color="primary"><mat-icon>visibility</mat-icon></button>
</div>
<mat-divider></mat-divider>
</div>
<!--End Web View Code-->
</div>
<!-- <mat-table #table_element [dataSource]="dataSourceTab4" matSort *ngIf="completedPdListData.length > 0" >
<ng-container matColumnDef="PDType"> <ng-container matColumnDef="PDType">
<mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="13" fxFlex.lg="15" fxFlex.xl="13" class="cell" *matCellDef="let details;" style="justify-content:flex-end"> <mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="13" fxFlex.lg="15" fxFlex.xl="13" class="cell" *matCellDef="let details;" style="justify-content:flex-end">
@ -82,7 +163,6 @@
</ng-container> </ng-container>
<ng-container matColumnDef="Name"> <ng-container matColumnDef="Name">
<mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="22" fxFlex.lg="24" fxFlex.xl="16" class="cell" *matCellDef="let details;"> <mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="22" fxFlex.lg="24" fxFlex.xl="16" class="cell" *matCellDef="let details;">
<!-- <span *ngIf="details.applicant_name" mat-line><b>{{details.applicant_name}}</b></span><br> -->
<span *ngIf="details.is_child" mat-line> <span *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b> <b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b>
</span><br> </span><br>
@ -119,12 +199,12 @@
</ng-container> </ng-container>
<mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;"> <mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;">
</mat-row> </mat-row>
</mat-table> </mat-table> -->
</mat-card-content> </mat-card-content>
<div [hidden]="recordStatus"> <div [hidden]="recordStatus">
<mat-paginator #paginator class="mat-elevation-z1" [length]="completedPdListData.length" [pageIndex]="pageIndex" [pageSize]="pageSize" <mat-paginator #paginator class="mat-elevation-z1" [length]="completedPdListData.length" [pageIndex]="pageIndex" [pageSize]="pageSize"
[pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons> [pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent=OnPageChange($event)" showFirstLastButtons>
</mat-paginator> </mat-paginator>
</div> </div>
<mat-card-content *ngIf="recordStatus"> <mat-card-content *ngIf="recordStatus">

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

@ -1,27 +1,91 @@
.ic-change:hover { .ic-change:hover {
transform: scale(1.1); transform: scale(1.1);
color: green; color: green;
}
.cell{
display:inline !important;
}
.cellhide{
display: none !important;
}
.center{
text-align:center;
}
.fontsize{
font-size:14px;
}
.toolbar-space {
flex: 0.01 0 auto;
}
p.note {
// float: right;
text-align: right;
font-size: 12px;
color: grey;
font-weight: bold;
} }
.center{
text-align:center;
}
.fontsize{
font-size:14px;
}
.toolbar-space {
flex: 0.01 0 auto;
}
p.note {
// float: right;
text-align: right;
font-size: 12px;
color: grey;
font-weight: bold;
}
// .example-container {
// display: flex;
// flex-direction: column;
// max-height: 500px;
// min-width: 300px;
// }
// .mat-table {
// overflow: auto;
// max-height: 500px;
// }
.mobile-label {
display: none;
}
@media(min-width: 600px) {
.webhide{
display: none !important;
}
}
@media(max-width: 600px) {
.body-container {
padding: 0px !important;
}
.mat-expansion-panel-body {
padding: 0 10px 16px !important;
}
.cell{
display: none !important;
}
.mat-form-field{
display: inline !important;
}
// .no-pad{
// text-align: left !important;
// padding-left: 0px !important;
// }
.mobile-label {
width: 80px;
display: inline-block;
font-weight: bold;
}
.mat-header-row {
display: none;
}
.mat-row {
flex-direction: column;
align-items: start;
padding: 8px 24px;
}
.lettericon{
// background-color: cadetblue;
// padding: 6px 7px 6px 7px;
border-radius: 10px;
color: #e2412f;
font-size: 75%;
font-weight: bold;
min-width: 4.4em;
text-align: center;
margin: 10px 0px 0px 0px !important;
}
.lettertext{
font-size: 80%;
}
}

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

@ -50,7 +50,7 @@ export class CompletedPdComponent implements OnInit, OnChanges {
user_role_name: string; user_role_name: string;
limitMsg: boolean = false; limitMsg: boolean = false;
common: any; common: any;
pagedList: any=[];
constructor(private _pd: PdTrigerService,public _fb:FormBuilder,notifier: NotifierService,private userService:UserService) { constructor(private _pd: PdTrigerService,public _fb:FormBuilder,notifier: NotifierService,private userService:UserService) {
this.notifier = notifier; this.notifier = notifier;
@ -107,15 +107,21 @@ public LenderRoleID : any = localStorage.getItem('LenderRoleID');
data => { data => {
if (data.status == 200) { if (data.status == 200) {
this.completedPdListData = data.records; this.completedPdListData = data.records;
this.dataLengthTab4 = data.records.length; // this.dataLengthTab4 = data.records.length;
this.dataSourceTab4.data = this.completedPdListData; // this.dataSourceTab4.data = this.completedPdListData;
this.pagedList = this.completedPdListData.slice(0, 10);
this.length = this.completedPdListData.length;
this.completedPdListData.forEach(value=>{
let original=value.pd_sno
value.pd_sno_split={lender_name:original.replace(/[^a-z]/gi, ''),serial_no:original.match(/(\d+)/)[0]}
})
this.recordStatus = false this.recordStatus = false
this.limitMsg = true this.limitMsg = true
} }
else{ else{
this.dataSourceTab4.data =[]
this.completedPdListData=[]; this.completedPdListData=[];
this.dataLengthTab4= null; // this.dataSourceTab4.data =[]
// this.dataLengthTab4= null;
this.recordStatus=true; this.recordStatus=true;
this.limitMsg = false this.limitMsg = false
} }
@ -127,6 +133,16 @@ public LenderRoleID : any = localStorage.getItem('LenderRoleID');
alert(error.html_format); alert(error.html_format);
}); });
} }
OnPageChange(event: PageEvent){
let startIndex = event.pageIndex * event.pageSize;
let endIndex = startIndex + event.pageSize;
if(endIndex > this.length){
endIndex = this.length;
}
this.pagedList = this.completedPdListData.slice(startIndex, endIndex);
}
pageChange(e) { pageChange(e) {
console.log(e); console.log(e);
} }
@ -231,16 +247,24 @@ public LenderRoleID : any = localStorage.getItem('LenderRoleID');
if(res['dataStatus']==true) if(res['dataStatus']==true)
{ {
this.completedPdListData=res['records']; this.completedPdListData=res['records'];
this.dataSourceTab4.data = res['records']; // this.dataSourceTab4.data = res['records'];
this.dataSourceTab4.paginator = this.paginator; // this.dataSourceTab4.paginator = this.paginator;
this.pagedList = this.completedPdListData.slice(0, 10);
this.length = this.completedPdListData.length;
this.completedPdListData.forEach(value=>{
let original=value.pd_sno
value.pd_sno_split={lender_name:original.replace(/[^a-z]/gi, ''),serial_no:original.match(/(\d+)/)[0]}
})
this.recordStatus=false; this.recordStatus=false;
this.limitMsg = false this.limitMsg = false
}else{ }else{
this.notifier.notify('warning', 'No Records Found !'); this.notifier.notify('warning', 'No Records Found !');
this.recordStatus=true; // this.dataSourceTab4.paginator['length'] = 0;
this.dataSourceTab4.paginator['length'] = 0; // this.dataSourceTab4.paginator['pageIndex'] = 0;
this.dataSourceTab4.paginator['pageIndex'] = 0; // this.dataSourceTab4.data = [];
this.dataSourceTab4.data = []; // this.completedPdListData = [];
this.pagedList = [];
this.recordStatus=true
this.limitMsg = false this.limitMsg = false
} }
},error => { },error => {

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

@ -13,7 +13,7 @@
</mat-expansion-panel-header> </mat-expansion-panel-header>
<mat-list class="m-gap p-gap"> <mat-list class="m-gap p-gap">
<div [formGroup]="searchForm"> <div [formGroup]="searchForm">
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<mat-select multiple formControlName="pd_type" placeholder="PD Type"> <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-option *ngFor="let type of PDType" [value]="type.pd_type_id">{{type.type_name}}</mat-option>
</mat-select> </mat-select>
@ -23,12 +23,12 @@
<mat-option *ngFor="let status of pdStatus" [value]="status.pd_status_name">{{status.pd_status_name}}</mat-option> <mat-option *ngFor="let status of pdStatus" [value]="status.pd_status_name">{{status.pd_status_name}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> --> </mat-form-field> -->
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<input matInput [matDatepicker]="picker" [max]="todaydate" (blur)="checkDate($event)" formControlName="pd_from_date" placeholder="Choose a From date"> <input matInput [matDatepicker]="picker" [max]="todaydate" (blur)="checkDate($event)" formControlName="pd_from_date" placeholder="Choose a From date">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle> <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker> <mat-datepicker #picker></mat-datepicker>
</mat-form-field> &nbsp; &nbsp; </mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<input matInput [matDatepicker]="picker1" [max]="todaydate" [min]="searchForm.get('pd_from_date').value" formControlName="pd_to_date" placeholder="Choose a todate"> <input matInput [matDatepicker]="picker1" [max]="todaydate" [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-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
<mat-datepicker #picker1></mat-datepicker> <mat-datepicker #picker1></mat-datepicker>
@ -38,7 +38,7 @@
<mat-option *ngFor="let pro of PRODUCTS" [value]="pro.product_id">{{pro.name}}</mat-option> <mat-option *ngFor="let pro of PRODUCTS" [value]="pro.product_id">{{pro.name}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> &nbsp; &nbsp; </mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<mat-select multiple formControlName="pd_city" placeholder="City"> <mat-select multiple formControlName="pd_city" placeholder="City">
<mat-option *ngFor="let city of CITY" [value]="city.city_id">{{city.name}}</mat-option> <mat-option *ngFor="let city of CITY" [value]="city.city_id">{{city.name}}</mat-option>
</mat-select> </mat-select>
@ -48,10 +48,10 @@
<mat-option *ngFor="let ent of ENTITY" [value]="ent.entity_id">{{ent.full_name}}</mat-option> <mat-option *ngFor="let ent of ENTITY" [value]="ent.entity_id">{{ent.full_name}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> --> </mat-form-field> -->
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<input matInput type="text" formControlName="pd_name" placeholder="Applicant Name"> <input matInput type="text" formControlName="pd_name" placeholder="Applicant Name">
</mat-form-field> &nbsp; &nbsp; </mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<input matInput type="text" formControlName="pd_applicant_id" placeholder="Applicant Id"> <input matInput type="text" formControlName="pd_applicant_id" placeholder="Applicant Id">
</mat-form-field> </mat-form-field>
<div align="right"> <div align="right">
@ -71,7 +71,87 @@
</mat-expansion-panel> </mat-expansion-panel>
<p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p> <p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p>
<br/> <br/>
<mat-table [dataSource]="dataSourceTab2" matSort *ngIf="progressPdListData.length > 0" > <div class="example-container">
<!--Start Mobile View Code-->
<div fxLayout="row wrap" *ngFor="let details of pagedList" (click)="viewPD(details.is_child == 0 ? details.pd_id : details.parent_pd_id,details.random_string)" class="webhide">
<div fxFlex.xs="20" fxFlex.sm="20" class="webhide" style="text-align: center;">
<p class="lettericon">{{details.pd_sno_split.lender_name}}<br/>
<span style="font-size: 90%">{{details.pd_sno_split.serial_no}}</span></p>
<span class="lettertext" style="color: #e2412f;">{{details.pd_type_name}}</span>
</div>
<div fxFlex.xs="80" fxFlex.sm="80" class="webhide">
<div fxLayout="row wrap" style="margin-left: 6px;">
<div fxFlex.xs="100" fxFlex.sm="100" class="webhide">
<span style="font-size: 100%;" *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD'}}</b>
</span>
</div>
</div>
<div fxLayout="row wrap" style="margin-left: 6px;">
<div fxFlex.xs="50" fxFlex.sm="50" class="webhide">
<span class="lettertext" *ngIf="!details.lender_applicant_id"> Not Provided</span>
<span class="lettertext" *ngIf="details.lender_applicant_id"> {{details.lender_applicant_id}}</span>
</div>
<div fxFlex.xs="50" fxFlex.sm="50" class="webhide" style="text-align: right;">
<span *ngIf="details.product_abbr" mat-line class="lettertext"> {{details.product_abbr}}<span *ngIf="details.subproduct_abbr">/{{details.subproduct_abbr}}</span></span>
</div>
</div>
<div fxLayout="row wrap" style="margin-left: 6px;">
<div fxFlex.xs="55" fxFlex.sm="55" class="webhide">
<span class="lettertext" [matTooltip]="details.pd_status | titlecase" matTooltipPosition="above">{{ (details.updatedon)? (details.updatedon | slice:0:10):(details.updatedon) }}</span>
</div>
<div fxFlex.xs="45" fxFlex.sm="45" class="webhide" style="text-align: right;">
<span class="lettertext"> {{details.pd_status}}</span>
</div>
</div>
</div>
<mat-divider></mat-divider>
</div>
<!--End Mobile View Code-->
<!--Start Web View Code-->
<div fxLayout="row wrap" *ngFor="let details of pagedList">
<div fxFlex.xs="20" fxFlex.sm="20" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<div [ngStyle]="{'color': '#e00201','font-weight': 'bold','font-size':'16px'}" mat-line>{{details.pd_sno}}</div>
<span mat-line class="cell">{{details.pd_type_name}}</span>
</div>
<div fxFlex.xs="30" fxFlex.sm="30" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<span *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b>
</span>
<br>
<span class="fontsize" *ngIf="!details.lender_applicant_id"> Not Provided</span>
<span class="fontsize" *ngIf="details.lender_applicant_id"> {{details.lender_applicant_id}}</span>
<span class="fontsize" *ngIf="details.customer_segment_abbr">-({{details.customer_segment_abbr}} )</span>
</div>
<div fxFlex.xs="40" fxFlex.sm="40" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<span *ngIf="details.lender_short_name" mat-line> {{details.lender_short_name}} </span>
<br>
<span *ngIf="details.product_abbr" mat-line class="fontsize"> {{details.product_abbr}}<span *ngIf="details.subproduct_abbr">/{{details.subproduct_abbr}}</span></span>
<br>
<span *ngIf="details.loan_amount" class="fontsize">
<i class="fa-1x fa fa-rupee"></i> {{details.loan_amount}}</span>
</div>
<div fxFlex.xs="40" fxFlex.sm="40" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<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_id == 1 ? details.other_pincode : details.pincode }} </span>
</div>
<div fxFlex.xs="30" fxFlex.sm="30" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="center no-pad cell" style="justify-content:flex-end">
<span> {{details.pd_status}}</span><br>
<span class="fontsize" [matTooltip]="details.pd_status | titlecase" matTooltipPosition="above">{{ (details.updatedon)? (details.updatedon | slice:0:10):(details.updatedon) }}</span>
</div>
<div fxFlex.xs="20" fxFlex.sm="20" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell center" style="justify-content:flex-end">
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="viewPD(details.is_child == 0 ? details.pd_id : details.parent_pd_id,details.random_string)" matTooltip="View" matTooltipPosition="above" color="primary"><mat-icon>visibility</mat-icon></button>
</div>
<mat-divider></mat-divider>
</div>
<!--End Web View Code-->
</div>
<!-- <mat-table #table_element [dataSource]="dataSourceTab2" matSort *ngIf="progressPdListData.length > 0" >
<ng-container matColumnDef="PDType"> <ng-container matColumnDef="PDType">
<mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="13" fxFlex.lg="15" fxFlex.xl="13" class="cell" *matCellDef="let details;" style="justify-content:flex-end"> <mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="13" fxFlex.lg="15" fxFlex.xl="13" class="cell" *matCellDef="let details;" style="justify-content:flex-end">
<div [ngStyle]="{'color': '#e00201','font-weight': 'bold','font-size':'16px'}" mat-line>{{details.pd_sno}}</div> <div [ngStyle]="{'color': '#e00201','font-weight': 'bold','font-size':'16px'}" mat-line>{{details.pd_sno}}</div>
@ -80,7 +160,6 @@
</ng-container> </ng-container>
<ng-container matColumnDef="Name"> <ng-container matColumnDef="Name">
<mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="22" fxFlex.lg="24" fxFlex.xl="16" class="cell" *matCellDef="let details;"> <mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="22" fxFlex.lg="24" fxFlex.xl="16" class="cell" *matCellDef="let details;">
<!-- <span *ngIf="details.applicant_name" mat-line><b>{{details.applicant_name}}</b></span><br> -->
<span *ngIf="details.is_child" mat-line> <span *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b> <b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b>
</span><br> </span><br>
@ -116,12 +195,12 @@
</ng-container> </ng-container>
<mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;"> <mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;">
</mat-row> </mat-row>
</mat-table> </mat-table> -->
</mat-card-content> </mat-card-content>
<div [hidden]="recordStatus"> <div [hidden]="recordStatus">
<mat-paginator #paginator class="mat-elevation-z1" [length]="progressPdListData.length" [pageIndex]="pageIndex" [pageSize]="pageSize" <mat-paginator #paginator class="mat-elevation-z1" [length]="progressPdListData.length" [pageIndex]="pageIndex" [pageSize]="pageSize"
[pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons> [pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent=OnPageChange($event)" showFirstLastButtons>
</mat-paginator> </mat-paginator>
</div> </div>
<mat-card-content *ngIf="recordStatus"> <mat-card-content *ngIf="recordStatus">

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

@ -1,26 +1,91 @@
.ic-change:hover { .ic-change:hover {
transform: scale(1.1); transform: scale(1.1);
color: green; color: green;
}
.cell{
display:inline !important;
}
.cellhide{
display: none !important;
} }
.center{ .center{
text-align:center; text-align:center;
} }
.fontsize{ .fontsize{
font-size:14px; font-size:14px;
} }
.toolbar-space { .toolbar-space {
flex: 0.01 0 auto; flex: 0.01 0 auto;
} }
p.note { p.note {
// float: right; // float: right;
text-align: right; text-align: right;
font-size: 12px; font-size: 12px;
color: grey; color: grey;
font-weight: bold; font-weight: bold;
}
// .example-container {
// display: flex;
// flex-direction: column;
// max-height: 500px;
// min-width: 300px;
// }
// .mat-table {
// overflow: auto;
// max-height: 500px;
// }
.mobile-label {
display: none;
}
@media(min-width: 600px) {
.webhide{
display: none !important;
}
}
@media(max-width: 600px) {
.body-container {
padding: 0px !important;
}
.mat-expansion-panel-body {
padding: 0 10px 16px !important;
}
.cell{
display: none !important;
}
.mat-form-field{
display: inline !important;
}
// .no-pad{
// text-align: left !important;
// padding-left: 0px !important;
// }
.mobile-label {
width: 80px;
display: inline-block;
font-weight: bold;
}
.mat-header-row {
display: none;
}
.mat-row {
flex-direction: column;
align-items: start;
padding: 8px 24px;
}
.lettericon{
// background-color: cadetblue;
// padding: 6px 7px 6px 7px;
border-radius: 10px;
color: #e2412f;
font-size: 75%;
font-weight: bold;
min-width: 4.4em;
text-align: center;
margin: 10px 0px 0px 0px !important;
}
.lettertext{
font-size: 80%;
}
} }

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

@ -48,6 +48,7 @@ export class InprogressPdComponent implements OnInit, OnChanges {
user_role_name: string; user_role_name: string;
limitMsg: boolean = false; limitMsg: boolean = false;
common: any; common: any;
pagedList: any=[];
constructor(private _pd: PdTrigerService,public _fb:FormBuilder,notifier: NotifierService,private userService:UserService) { constructor(private _pd: PdTrigerService,public _fb:FormBuilder,notifier: NotifierService,private userService:UserService) {
this.notifier = notifier; this.notifier = notifier;
@ -102,14 +103,20 @@ public LenderRoleID : string = localStorage.getItem('LenderRoleID');
data => { data => {
if (data.status == 200) { if (data.status == 200) {
this.progressPdListData = data.records; this.progressPdListData = data.records;
this.dataLengthTab2 = data.records.length; // this.dataLengthTab2 = data.records.length;
this.dataSourceTab2.data = this.progressPdListData; // this.dataSourceTab2.data = this.progressPdListData;
this.pagedList = this.progressPdListData.slice(0, 10);
this.length = this.progressPdListData.length;
this.progressPdListData.forEach(value=>{
let original=value.pd_sno
value.pd_sno_split={lender_name:original.replace(/[^a-z]/gi, ''),serial_no:original.match(/(\d+)/)[0]}
})
this.recordStatus=false this.recordStatus=false
this.limitMsg = true this.limitMsg = true
}else{ }else{
this.progressPdListData =[]; this.progressPdListData =[];
this.progressPdListData = []; // this.progressPdListData = [];
this.dataSourceTab2.data = []; // this.dataSourceTab2.data = [];
this.recordStatus=true; this.recordStatus=true;
this.limitMsg = false this.limitMsg = false
} }
@ -119,6 +126,16 @@ public LenderRoleID : string = localStorage.getItem('LenderRoleID');
alert(error.html_format); alert(error.html_format);
}); });
} }
OnPageChange(event: PageEvent){
let startIndex = event.pageIndex * event.pageSize;
let endIndex = startIndex + event.pageSize;
if(endIndex > this.length){
endIndex = this.length;
}
this.pagedList = this.progressPdListData.slice(startIndex, endIndex);
}
pageChange(e) { pageChange(e) {
console.log(e); console.log(e);
} }
@ -220,16 +237,23 @@ public LenderRoleID : string = localStorage.getItem('LenderRoleID');
if(res['dataStatus']==true) if(res['dataStatus']==true)
{ {
this.progressPdListData = res['records']; this.progressPdListData = res['records'];
this.dataSourceTab2.data = res['records']; // this.dataSourceTab2.data = res['records'];
this.dataSourceTab2.paginator = this.paginator; // this.dataSourceTab2.paginator = this.paginator;
this.pagedList = this.progressPdListData.slice(0, 10);
this.length = this.progressPdListData.length;
this.progressPdListData.forEach(value=>{
let original=value.pd_sno
value.pd_sno_split={lender_name:original.replace(/[^a-z]/gi, ''),serial_no:original.match(/(\d+)/)[0]}
})
this.recordStatus=false this.recordStatus=false
this.limitMsg = false this.limitMsg = false
}else{ }else{
this.notifier.notify('warning', 'No Records Found !'); this.notifier.notify('warning', 'No Records Found !');
this.dataSourceTab2.paginator['length'] = 0; // this.dataSourceTab2.paginator['length'] = 0;
this.dataSourceTab2.paginator['pageIndex'] = 0; // this.dataSourceTab2.paginator['pageIndex'] = 0;
this.dataSourceTab2.data = []; // this.dataSourceTab2.data = [];
this.progressPdListData = []; this.progressPdListData = [];
this.pagedList = [];
this.recordStatus=true this.recordStatus=true
this.limitMsg = false this.limitMsg = false
} }

88
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/qc-completed-pd/qc-completed-pd.component.html
View File

@ -73,7 +73,88 @@
</mat-expansion-panel> </mat-expansion-panel>
<p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p> <p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p>
<br/> <br/>
<mat-table [dataSource]="dataSourceTab5" matSort *ngIf="qcCompletedPdListData.length > 0" > <div class="example-container">
<!--Start Mobile View Code-->
<div fxLayout="row wrap" *ngFor="let details of pagedList" (click)="viewPD(details.is_child == 0 ? details.pd_id : details.parent_pd_id,details.random_string)" class="webhide">
<div fxFlex.xs="20" fxFlex.sm="20" class="webhide" style="text-align: center;">
<p class="lettericon">{{details.pd_sno_split.lender_name}}<br/>
<span style="font-size: 90%">{{details.pd_sno_split.serial_no}}</span></p>
<span class="lettertext" style="color: #e2412f;">{{details.pd_type_name}}</span>
</div>
<div fxFlex.xs="80" fxFlex.sm="80" class="webhide">
<div fxLayout="row wrap" style="margin-left: 6px;">
<div fxFlex.xs="100" fxFlex.sm="100" class="webhide">
<span style="font-size: 100%;" *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD'}}</b>
</span>
</div>
</div>
<div fxLayout="row wrap" style="margin-left: 6px;">
<div fxFlex.xs="50" fxFlex.sm="50" class="webhide">
<span class="lettertext" *ngIf="!details.lender_applicant_id"> Not Provided</span>
<span class="lettertext" *ngIf="details.lender_applicant_id"> {{details.lender_applicant_id}}</span>
</div>
<div fxFlex.xs="50" fxFlex.sm="50" class="webhide" style="text-align: right;">
<span *ngIf="details.product_abbr" mat-line class="lettertext"> {{details.product_abbr}}<span *ngIf="details.subproduct_abbr">/{{details.subproduct_abbr}}</span></span>
</div>
</div>
<div fxLayout="row wrap" style="margin-left: 6px;">
<div fxFlex.xs="55" fxFlex.sm="55" class="webhide">
<span class="lettertext" [matTooltip]="details.pd_status | titlecase" matTooltipPosition="above">{{ (details.updatedon)? (details.updatedon | slice:0:10):(details.updatedon) }}</span>
</div>
<div fxFlex.xs="45" fxFlex.sm="45" class="webhide" style="text-align: right;">
<span class="lettertext"> QC COMPLETED</span>
</div>
</div>
</div>
<mat-divider></mat-divider>
</div>
<!--End Mobile View Code-->
<!--Start Web View Code-->
<div fxLayout="row wrap" *ngFor="let details of pagedList">
<div fxFlex.xs="20" fxFlex.sm="20" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<div [ngStyle]="{'color': '#e00201','font-weight': 'bold','font-size':'16px'}" mat-line>{{details.pd_sno}}</div>
<span mat-line class="cell">{{details.pd_type_name}}</span>
</div>
<div fxFlex.xs="30" fxFlex.sm="30" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<span *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b>
</span>
<br>
<span class="fontsize" *ngIf="!details.lender_applicant_id"> Not Provided</span>
<span class="fontsize" *ngIf="details.lender_applicant_id"> {{details.lender_applicant_id}}</span>
<span class="fontsize" *ngIf="details.customer_segment_abbr">-({{details.customer_segment_abbr}} )</span>
</div>
<div fxFlex.xs="40" fxFlex.sm="40" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<span *ngIf="details.lender_short_name" mat-line> {{details.lender_short_name}} </span>
<br>
<span *ngIf="details.product_abbr" mat-line class="fontsize"> {{details.product_abbr}}<span *ngIf="details.subproduct_abbr">/{{details.subproduct_abbr}}</span></span>
<br>
<span *ngIf="details.loan_amount" class="fontsize">
<i class="fa-1x fa fa-rupee"></i> {{details.loan_amount}}</span>
</div>
<div fxFlex.xs="40" fxFlex.sm="40" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<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_id == 1 ? details.other_pincode : details.pincode }} </span>
</div>
<div fxFlex.xs="30" fxFlex.sm="30" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="center no-pad cell" style="justify-content:flex-end">
<span> QC COMPLETED</span><br>
<span class="fontsize" [matTooltip]="details.pd_status | titlecase" matTooltipPosition="above">{{ (details.updatedon)? (details.updatedon | slice:0:10):(details.updatedon) }}</span>
</div>
<div fxFlex.xs="20" fxFlex.sm="20" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell center" style="justify-content:flex-end">
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="viewPD(details.is_child == 0 ? details.pd_id : details.parent_pd_id,details.random_string)" matTooltip="View" matTooltipPosition="above" color="primary"><mat-icon>visibility</mat-icon></button>
</div>
<mat-divider></mat-divider>
</div>
<!--End Web View Code-->
</div>
<!-- <mat-table [dataSource]="dataSourceTab5" matSort *ngIf="qcCompletedPdListData.length > 0" >
<ng-container matColumnDef="PDType"> <ng-container matColumnDef="PDType">
<mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="13" fxFlex.lg="15" fxFlex.xl="13" class="cell" *matCellDef="let details;" style="justify-content:flex-end"> <mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="13" fxFlex.lg="15" fxFlex.xl="13" class="cell" *matCellDef="let details;" style="justify-content:flex-end">
<div [ngStyle]="{'color': '#e00201','font-weight': 'bold','font-size':'16px'}" mat-line>{{details.pd_sno}}</div> <div [ngStyle]="{'color': '#e00201','font-weight': 'bold','font-size':'16px'}" mat-line>{{details.pd_sno}}</div>
@ -82,7 +163,6 @@
</ng-container> </ng-container>
<ng-container matColumnDef="Name"> <ng-container matColumnDef="Name">
<mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="22" fxFlex.lg="24" fxFlex.xl="16" class="cell" *matCellDef="let details;"> <mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="22" fxFlex.lg="24" fxFlex.xl="16" class="cell" *matCellDef="let details;">
<!-- <span *ngIf="details.applicant_name" mat-line><b>{{details.applicant_name}}</b></span><br> -->
<span *ngIf="details.is_child" mat-line> <span *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b> <b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b>
</span><br> </span><br>
@ -118,12 +198,12 @@
</ng-container> </ng-container>
<mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;"> <mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;">
</mat-row> </mat-row>
</mat-table> </mat-table> -->
</mat-card-content> </mat-card-content>
<div [hidden]="recordStatus"> <div [hidden]="recordStatus">
<mat-paginator #paginator class="mat-elevation-z1" [length]="qcCompletedPdListData.length" [pageIndex]="pageIndex" [pageSize]="pageSize" <mat-paginator #paginator class="mat-elevation-z1" [length]="qcCompletedPdListData.length" [pageIndex]="pageIndex" [pageSize]="pageSize"
[pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons> [pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent=OnPageChange($event)" showFirstLastButtons>
</mat-paginator> </mat-paginator>
</div> </div>
<mat-card-content *ngIf="recordStatus"> <mat-card-content *ngIf="recordStatus">

97
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/qc-completed-pd/qc-completed-pd.component.scss
View File

@ -1,26 +1,91 @@
.ic-change:hover { .ic-change:hover {
transform: scale(1.1); transform: scale(1.1);
color: green; color: green;
}
.cell{
display:inline !important;
}
.cellhide{
display: none !important;
} }
.center{ .center{
text-align:center; text-align:center;
} }
.fontsize{ .fontsize{
font-size:14px; font-size:14px;
} }
.toolbar-space { .toolbar-space {
flex: 0.01 0 auto; flex: 0.01 0 auto;
} }
p.note { p.note {
// float: right; // float: right;
text-align: right; text-align: right;
font-size: 12px; font-size: 12px;
color: grey; color: grey;
font-weight: bold; font-weight: bold;
}
// .example-container {
// display: flex;
// flex-direction: column;
// max-height: 500px;
// min-width: 300px;
// }
// .mat-table {
// overflow: auto;
// max-height: 500px;
// }
.mobile-label {
display: none;
}
@media(min-width: 600px) {
.webhide{
display: none !important;
}
}
@media(max-width: 600px) {
.body-container {
padding: 0px !important;
}
.mat-expansion-panel-body {
padding: 0 10px 16px !important;
}
.cell{
display: none !important;
}
.mat-form-field{
display: inline !important;
}
// .no-pad{
// text-align: left !important;
// padding-left: 0px !important;
// }
.mobile-label {
width: 80px;
display: inline-block;
font-weight: bold;
}
.mat-header-row {
display: none;
}
.mat-row {
flex-direction: column;
align-items: start;
padding: 8px 24px;
}
.lettericon{
// background-color: cadetblue;
// padding: 6px 7px 6px 7px;
border-radius: 10px;
color: #e2412f;
font-size: 75%;
font-weight: bold;
min-width: 4.4em;
text-align: center;
margin: 10px 0px 0px 0px !important;
}
.lettertext{
font-size: 80%;
}
} }

46
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/qc-completed-pd/qc-completed-pd.component.ts
View File

@ -49,7 +49,7 @@ export class QcCompletedPdComponent implements OnInit, OnChanges {
user_role_name: string; user_role_name: string;
limitMsg: boolean = false; limitMsg: boolean = false;
common: any; common: any;
pagedList: any=[];
constructor(private _pd: PdTrigerService, public _fb: FormBuilder,notifier: NotifierService,private userService:UserService) { constructor(private _pd: PdTrigerService, public _fb: FormBuilder,notifier: NotifierService,private userService:UserService) {
this.notifier = notifier; this.notifier = notifier;
@ -109,15 +109,21 @@ export class QcCompletedPdComponent implements OnInit, OnChanges {
data => { data => {
if (data.status == 200) { if (data.status == 200) {
this.qcCompletedPdListData = data.records; this.qcCompletedPdListData = data.records;
this.dataLengthTab5 = data.records.length; // this.dataLengthTab5 = data.records.length;
this.dataSourceTab5.data = this.qcCompletedPdListData; // this.dataSourceTab5.data = this.qcCompletedPdListData;
this.pagedList = this.qcCompletedPdListData.slice(0, 10);
this.length = this.qcCompletedPdListData.length;
this.qcCompletedPdListData.forEach(value=>{
let original=value.pd_sno
value.pd_sno_split={lender_name:original.replace(/[^a-z]/gi, ''),serial_no:original.match(/(\d+)/)[0]}
})
this.recordStatus = false this.recordStatus = false
this.limitMsg = true this.limitMsg = true
} }
else { else {
this.qcCompletedPdListData = []; this.qcCompletedPdListData = [];
this.dataSourceTab5.data = [] // this.dataSourceTab5.data = []
this.dataLengthTab5 = null; // this.dataLengthTab5 = null;
this.recordStatus = true; this.recordStatus = true;
this.limitMsg = false this.limitMsg = false
} }
@ -129,6 +135,16 @@ export class QcCompletedPdComponent implements OnInit, OnChanges {
alert(error.html_format); alert(error.html_format);
}); });
} }
OnPageChange(event: PageEvent){
let startIndex = event.pageIndex * event.pageSize;
let endIndex = startIndex + event.pageSize;
if(endIndex > this.length){
endIndex = this.length;
}
this.pagedList = this.qcCompletedPdListData.slice(startIndex, endIndex);
}
pageChange(e) { pageChange(e) {
console.log(e); console.log(e);
} }
@ -209,16 +225,24 @@ export class QcCompletedPdComponent implements OnInit, OnChanges {
this.xpandStatus = false; this.xpandStatus = false;
if (res['dataStatus'] == true) { if (res['dataStatus'] == true) {
this.qcCompletedPdListData = res['records']; this.qcCompletedPdListData = res['records'];
this.dataSourceTab5.data = res['records']; // this.dataSourceTab5.data = res['records'];
this.dataSourceTab5.paginator = this.paginator; // this.dataSourceTab5.paginator = this.paginator;
this.pagedList = this.qcCompletedPdListData.slice(0, 10);
this.length = this.qcCompletedPdListData.length;
this.qcCompletedPdListData.forEach(value=>{
let original=value.pd_sno
value.pd_sno_split={lender_name:original.replace(/[^a-z]/gi, ''),serial_no:original.match(/(\d+)/)[0]}
})
this.recordStatus = false; this.recordStatus = false;
this.limitMsg = false this.limitMsg = false
}else{ }else{
this.qcCompletedPdListData = [] this.qcCompletedPdListData = []
this.notifier.notify('warning', 'No Records Found !'); this.notifier.notify('warning', 'No Records Found !');
this.dataSourceTab5.paginator['length'] = 0; // this.dataSourceTab5.paginator['length'] = 0;
this.dataSourceTab5.paginator['pageIndex'] = 0; // this.dataSourceTab5.paginator['pageIndex'] = 0;
this.dataSourceTab5.data = []; // this.dataSourceTab5.data = [];
this.qcCompletedPdListData = []
this.pagedList = [];
this.recordStatus = true; this.recordStatus = true;
this.limitMsg = false this.limitMsg = false
} }

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

@ -13,45 +13,45 @@
</mat-expansion-panel-header> </mat-expansion-panel-header>
<mat-list class="m-gap p-gap"> <mat-list class="m-gap p-gap">
<div [formGroup]="searchForm"> <div [formGroup]="searchForm">
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<mat-select multiple formControlName="pd_type" placeholder="PD Type"> <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-option *ngFor="let type of PDType" [value]="type.pd_type_id">{{type.type_name}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> &nbsp; &nbsp; </mat-form-field> &nbsp; &nbsp;
<!-- <mat-form-field style="width:40%"> <!-- <mat-form-field style="width:40%" class="matfieldblock">
<mat-select formControlName="pd_status" placeholder="PD Status"> <mat-select formControlName="pd_status" placeholder="PD Status">
<mat-option *ngFor="let status of pdStatus" [value]="status.pd_status_name" [disabled]="'true'">{{status.pd_status_name}}</mat-option> <mat-option *ngFor="let status of pdStatus" [value]="status.pd_status_name" [disabled]="'true'">{{status.pd_status_name}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> --> </mat-form-field> -->
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<input matInput [matDatepicker]="picker" [max]="todaydate" (blur)="checkDate($event)" formControlName="pd_from_date" placeholder="Choose a From date"> <input matInput [matDatepicker]="picker" [max]="todaydate" (blur)="checkDate($event)" formControlName="pd_from_date" placeholder="Choose a From date">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle> <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker> <mat-datepicker #picker></mat-datepicker>
</mat-form-field> &nbsp; &nbsp; </mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<input matInput [matDatepicker]="picker1" [max]="todaydate" [min]="searchForm.get('pd_from_date').value"formControlName="pd_to_date" placeholder="Choose a todate"> <input matInput [matDatepicker]="picker1" [max]="todaydate" [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-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
<mat-datepicker #picker1></mat-datepicker> <mat-datepicker #picker1></mat-datepicker>
</mat-form-field> </mat-form-field>
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<mat-select multiple formControlName="pd_products" placeholder="Products"> <mat-select multiple formControlName="pd_products" placeholder="Products">
<mat-option *ngFor="let pro of PRODUCTS" [value]="pro.product_id">{{pro.name}}</mat-option> <mat-option *ngFor="let pro of PRODUCTS" [value]="pro.product_id">{{pro.name}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> &nbsp; &nbsp; </mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<mat-select multiple formControlName="pd_city" placeholder="City"> <mat-select multiple formControlName="pd_city" placeholder="City">
<mat-option *ngFor="let city of CITY" [value]="city.city_id">{{city.name}}</mat-option> <mat-option *ngFor="let city of CITY" [value]="city.city_id">{{city.name}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> &nbsp; &nbsp; </mat-form-field> &nbsp; &nbsp;
<!-- <mat-form-field style="width:30%"> <!-- <mat-form-field style="width:30%" class="matfieldblock">
<mat-select multiple formControlName="pd_lender" placeholder="Lender Name"> <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-option *ngFor="let ent of ENTITY" [value]="ent.entity_id">{{ent.full_name}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> --> </mat-form-field> -->
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<input matInput type="text" formControlName="pd_name" placeholder="Applicant Name"> <input matInput type="text" formControlName="pd_name" placeholder="Applicant Name">
</mat-form-field> &nbsp; &nbsp; </mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:30%"> <mat-form-field style="width:30%" class="matfieldblock">
<input matInput type="text" formControlName="pd_applicant_id" placeholder="Applicant Id"> <input matInput type="text" formControlName="pd_applicant_id" placeholder="Applicant Id">
</mat-form-field> </mat-form-field>
<div align="right"> <div align="right">
@ -71,60 +71,137 @@
</mat-expansion-panel> </mat-expansion-panel>
<p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p> <p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p>
<br/> <br/>
<mat-table [dataSource]="dataSourceTab3" matSort *ngIf="scheduledPdListData.length > 0" > <div class="example-container">
<ng-container matColumnDef="PDType"> <!--Start Mobile View Code-->
<mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="13" fxFlex.lg="15" fxFlex.xl="13" class="cell" *matCellDef="let details;" style="justify-content:flex-end"> <div fxLayout="row wrap" *ngFor="let details of pagedList" (click)="viewPD(details.is_child == 0 ? details.pd_id : details.parent_pd_id,details.random_string)" class="webhide">
<div fxFlex.xs="20" fxFlex.sm="20" class="webhide" style="text-align: center;">
<p class="lettericon">{{details.pd_sno_split.lender_name}}<br/>
<span style="font-size: 90%">{{details.pd_sno_split.serial_no}}</span></p>
<span class="lettertext" style="color: #e2412f;">{{details.pd_type_name}}</span>
</div>
<div fxFlex.xs="80" fxFlex.sm="80" class="webhide">
<div fxLayout="row wrap" style="margin-left: 6px;">
<div fxFlex.xs="100" fxFlex.sm="100" class="webhide">
<span style="font-size: 100%;" *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD'}}</b>
</span>
</div>
</div>
<div fxLayout="row wrap" style="margin-left: 6px;">
<div fxFlex.xs="50" fxFlex.sm="50" class="webhide">
<span class="lettertext" *ngIf="!details.lender_applicant_id"> Not Provided</span>
<span class="lettertext" *ngIf="details.lender_applicant_id"> {{details.lender_applicant_id}}</span>
</div>
<div fxFlex.xs="50" fxFlex.sm="50" class="webhide" style="text-align: right;">
<span *ngIf="details.product_abbr" mat-line class="lettertext"> {{details.product_abbr}}<span *ngIf="details.subproduct_abbr">/{{details.subproduct_abbr}}</span></span>
</div>
</div>
<div fxLayout="row wrap" style="margin-left: 6px;">
<div fxFlex.xs="55" fxFlex.sm="55" class="webhide">
<span class="lettertext">{{details.scheduled_on}}</span>
</div>
<div fxFlex.xs="45" fxFlex.sm="45" class="webhide" style="text-align: right;">
<span class="lettertext"> {{details.pd_status}}</span>
</div>
</div>
</div>
<mat-divider></mat-divider>
</div>
<!--End Mobile View Code-->
<!--Start Web View Code-->
<div fxLayout="row wrap" *ngFor="let details of pagedList">
<div fxFlex.xs="20" fxFlex.sm="20" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<div [ngStyle]="{'color': '#e00201','font-weight': 'bold','font-size':'16px'}" mat-line>{{details.pd_sno}}</div> <div [ngStyle]="{'color': '#e00201','font-weight': 'bold','font-size':'16px'}" mat-line>{{details.pd_sno}}</div>
<small mat-line>{{details.pd_type_name}}</small> <span mat-line class="cell">{{details.pd_type_name}}</span>
</div>
<div fxFlex.xs="30" fxFlex.sm="30" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<span *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD'}}</b>
</span>
<br>
<span class="fontsize" *ngIf="!details.lender_applicant_id"> Not Provided</span>
<span class="fontsize" *ngIf="details.lender_applicant_id"> {{details.lender_applicant_id}}</span>
<span class="fontsize" *ngIf="details.customer_segment_abbr">-({{details.customer_segment_abbr}} )</span>
</div>
<div fxFlex.xs="40" fxFlex.sm="40" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<span *ngIf="details.lender_short_name" mat-line> {{details.lender_short_name}} </span>
<br>
<span *ngIf="details.product_abbr" mat-line class="fontsize"> {{details.product_abbr}}<span *ngIf="details.subproduct_abbr">/{{details.subproduct_abbr}}</span></span>
<br>
<span *ngIf="details.loan_amount" class="fontsize">
<i class="fa-1x fa fa-rupee"></i> {{details.loan_amount}}</span>
</div>
<div fxFlex.xs="40" fxFlex.sm="40" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell" style="justify-content:flex-end">
<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_id == 1 ? details.other_pincode : details.pincode }} </span>
</div>
<div fxFlex.xs="30" fxFlex.sm="30" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="center no-pad cell" style="justify-content:flex-end">
<span> {{details.pd_status}}</span><br>
<span class="fontsize">{{details.scheduled_on}}</span>
</div>
<div fxFlex.xs="20" fxFlex.sm="20" fxFlex.md="16.66" fxFlex.lg="16.66" fxFlex.xl="16.66" class="cell center" style="justify-content:flex-end">
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="viewPD(details.is_child == 0 ? details.pd_id : details.parent_pd_id,details.random_string)" color="primary" matTooltip="View" matTooltipPosition="above"><mat-icon>visibility</mat-icon></button>
</div>
<mat-divider></mat-divider>
</div>
<!--End Web View Code-->
</div>
<!-- <mat-table [dataSource]="dataSourceTab3" matSort *ngIf="scheduledPdListData.length > 0" >
<ng-container matColumnDef="PDType">
<mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="13" fxFlex.lg="15" fxFlex.xl="13" class="cell" *matCellDef="let details;" style="justify-content:flex-end">
<div [ngStyle]="{'color': '#e00201','font-weight': 'bold','font-size':'16px'}" mat-line>{{details.pd_sno}}</div>
<small mat-line>{{details.pd_type_name}}</small>
</mat-cell>
</ng-container>
<ng-container matColumnDef="Name">
<mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="22" fxFlex.lg="24" fxFlex.xl="16" class="cell" *matCellDef="let details;">
<span *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD'}}</b>
</span><br>
<span class="fontsize" *ngIf="!details.lender_applicant_id"> Not Provided</span>
<span class="fontsize" *ngIf="details.lender_applicant_id"> {{details.lender_applicant_id}}</span>
<span class="fontsize" *ngIf="details.customer_segment_abbr">-({{details.customer_segment_abbr}} )</span>
</mat-cell> </mat-cell>
</ng-container> </ng-container>
<ng-container matColumnDef="Name"> <ng-container matColumnDef="Lenderid">
<mat-cell fxFlex.xs="20" fxFlex.sm="15" fxFlex.md="22" fxFlex.lg="24" fxFlex.xl="16" class="cell" *matCellDef="let details;"> <mat-cell class="cell" *matCellDef="let details">
<!-- <span *ngIf="details.applicant_name" mat-line><b>{{details.applicant_name}}</b></span><br> --> <span *ngIf="details.lender_short_name" mat-line> {{details.lender_short_name}} </span><br>
<span *ngIf="details.is_child" mat-line> <span *ngIf="details.product_abbr" mat-line class="fontsize"> {{details.product_abbr}}<span *ngIf="details.subproduct_abbr">/{{details.subproduct_abbr}}</span></span> <br>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD'}}</b> <span *ngIf="details.loan_amount" class="fontsize"><i class="fa-1x fa fa-rupee"></i> {{details.loan_amount}}</span>
</span><br> </mat-cell>
<span class="fontsize" *ngIf="!details.lender_applicant_id"> Not Provided</span> </ng-container>
<span class="fontsize" *ngIf="details.lender_applicant_id"> {{details.lender_applicant_id}}</span> <ng-container matColumnDef="Address">
<span class="fontsize" *ngIf="details.customer_segment_abbr">-({{details.customer_segment_abbr}} )</span> <mat-cell class="cell" *matCellDef="let details;">
</mat-cell> <span>{{details.pd_date_of_initiation}}</span><br>
</ng-container> <span class="fontsize" *ngIf="details.city_name"> <i class="fa-1x fa fa-map-marker"> </i> {{details.city_name}}-{{details.pincode_id == 1 ? details.other_pincode : details.pincode }} </span>
<ng-container matColumnDef="Lenderid"> </mat-cell>
<mat-cell class="cell" *matCellDef="let details"> </ng-container>
<span *ngIf="details.lender_short_name" mat-line> {{details.lender_short_name}} </span><br> <ng-container matColumnDef="Status">
<span *ngIf="details.product_abbr" mat-line class="fontsize"> {{details.product_abbr}}<span *ngIf="details.subproduct_abbr">/{{details.subproduct_abbr}}</span></span> <br> <mat-cell class="cell center" *matCellDef="let details;">
<span *ngIf="details.loan_amount" class="fontsize"><i class="fa-1x fa fa-rupee"></i> {{details.loan_amount}}</span> <span> {{details.pd_status}}</span><br>
</mat-cell> <span class="fontsize">{{details.scheduled_on}}
</ng-container> </span>
<ng-container matColumnDef="Address">
<mat-cell class="cell" *matCellDef="let details;">
<span>{{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_id == 1 ? details.other_pincode : details.pincode }} </span>
</mat-cell>
</ng-container>
<ng-container matColumnDef="Status">
<mat-cell class="cell center" *matCellDef="let details;">
<span> {{details.pd_status}}</span><br>
<!-- <span class="fontsize">{{ (details.updatedon)? (details.updatedon | slice:0:10):(details.updatedon) }}
</span> -->
<span class="fontsize">{{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" (click)="viewPD(details.is_child == 0 ? details.pd_id : details.parent_pd_id,details.random_string)" color="primary" 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-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" (click)="viewPD(details.is_child == 0 ? details.pd_id : details.parent_pd_id,details.random_string)" color="primary" 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>
<div [hidden]="recordStatus"> <div [hidden]="recordStatus">
<mat-paginator #paginator class="mat-elevation-z1" [length]="scheduledPdListData.length" [pageIndex]="pageIndex" [pageSize]="pageSize" <mat-paginator #paginator class="mat-elevation-z1" [length]="scheduledPdListData.length" [pageIndex]="pageIndex" [pageSize]="pageSize"
[pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons> [pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent=OnPageChange($event)" showFirstLastButtons>
</mat-paginator> </mat-paginator>
</div> </div>

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

@ -1,26 +1,91 @@
.ic-change:hover { .ic-change:hover {
transform: scale(1.1); transform: scale(1.1);
color: green; color: green;
}
.cell{
display:inline !important;
}
.cellhide{
display: none !important;
} }
.center{ .center{
text-align:center; text-align:center;
} }
.fontsize{ .fontsize{
font-size:14px; font-size:14px;
} }
.toolbar-space { .toolbar-space {
flex: 0.01 0 auto; flex: 0.01 0 auto;
} }
p.note { p.note {
// float: right; // float: right;
text-align: right; text-align: right;
font-size: 12px; font-size: 12px;
color: grey; color: grey;
font-weight: bold; font-weight: bold;
}
// .example-container {
// display: flex;
// flex-direction: column;
// max-height: 500px;
// min-width: 300px;
// }
// .mat-table {
// overflow: auto;
// max-height: 500px;
// }
.mobile-label {
display: none;
}
@media(min-width: 600px) {
.webhide{
display: none !important;
}
}
@media(max-width: 600px) {
.body-container {
padding: 0px !important;
}
.mat-expansion-panel-body {
padding: 0 10px 16px !important;
}
.cell{
display: none !important;
}
.mat-form-field{
display: inline !important;
}
// .no-pad{
// text-align: left !important;
// padding-left: 0px !important;
// }
.mobile-label {
width: 80px;
display: inline-block;
font-weight: bold;
}
.mat-header-row {
display: none;
}
.mat-row {
flex-direction: column;
align-items: start;
padding: 8px 24px;
}
.lettericon{
// background-color: cadetblue;
// padding: 6px 7px 6px 7px;
border-radius: 10px;
color: #e2412f;
font-size: 75%;
font-weight: bold;
min-width: 4.4em;
text-align: center;
margin: 10px 0px 0px 0px !important;
}
.lettertext{
font-size: 80%;
}
} }

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

@ -48,7 +48,7 @@ export class ScheduledPdComponent implements OnInit, OnChanges {
user_role_name: string; user_role_name: string;
limitMsg: boolean = false; limitMsg: boolean = false;
common: any; common: any;
pagedList: any=[];
constructor(private _pd: PdTrigerService,public _fb:FormBuilder,notifier: NotifierService,private userService:UserService) { constructor(private _pd: PdTrigerService,public _fb:FormBuilder,notifier: NotifierService,private userService:UserService) {
this.notifier = notifier; this.notifier = notifier;
@ -107,15 +107,21 @@ public LenderRoleID : any = localStorage.getItem('LenderRoleID');
data => { data => {
if (data.status == 200) { if (data.status == 200) {
this.scheduledPdListData = data.records; this.scheduledPdListData = data.records;
this.dataLengthTab3 = data.records.length; // this.dataLengthTab3 = data.records.length;
this.dataSourceTab3.data = this.scheduledPdListData; // this.dataSourceTab3.data = this.scheduledPdListData;
this.pagedList = this.scheduledPdListData.slice(0, 10);
this.length = this.scheduledPdListData.length;
this.scheduledPdListData.forEach(value=>{
let original=value.pd_sno
value.pd_sno_split={lender_name:original.replace(/[^a-z]/gi, ''),serial_no:original.match(/(\d+)/)[0]}
})
this.recordStatus =false this.recordStatus =false
this.limitMsg = true this.limitMsg = true
} }
else{ else{
this.scheduledPdListData=[]; this.scheduledPdListData=[];
this.dataLengthTab3 = null; // this.dataLengthTab3 = null;
this.dataSourceTab3.data = [] // this.dataSourceTab3.data = []
this.recordStatus=true; this.recordStatus=true;
this.limitMsg = false this.limitMsg = false
} }
@ -126,6 +132,16 @@ public LenderRoleID : any = localStorage.getItem('LenderRoleID');
alert(error.html_format); alert(error.html_format);
}); });
} }
OnPageChange(event: PageEvent){
let startIndex = event.pageIndex * event.pageSize;
let endIndex = startIndex + event.pageSize;
if(endIndex > this.length){
endIndex = this.length;
}
this.pagedList = this.scheduledPdListData.slice(startIndex, endIndex);
}
pageChange(e) { pageChange(e) {
console.log(e); console.log(e);
} }
@ -224,18 +240,25 @@ public LenderRoleID : any = localStorage.getItem('LenderRoleID');
this.xpandStatus = false; this.xpandStatus = false;
if(res['dataStatus']==true) if(res['dataStatus']==true)
{ {
this.dataSourceTab3 = res['records']; // this.dataSourceTab3 = res['records'];
this.dataSourceTab3.paginator = this.paginator; // this.dataSourceTab3.paginator = this.paginator;
this.scheduledPdListData = res['records']; this.scheduledPdListData = res['records'];
this.pagedList = this.scheduledPdListData.slice(0, 10);
this.length = this.scheduledPdListData.length;
this.scheduledPdListData.forEach(value=>{
let original=value.pd_sno
value.pd_sno_split={lender_name:original.replace(/[^a-z]/gi, ''),serial_no:original.match(/(\d+)/)[0]}
})
this.recordStatus = false; this.recordStatus = false;
this.limitMsg = false this.limitMsg = false
}else{ }else{
this.notifier.notify('warning', 'No Records Found !'); this.notifier.notify('warning', 'No Records Found !');
this.dataSourceTab3.paginator['length'] = 0; // this.dataSourceTab3.paginator['length'] = 0;
this.dataSourceTab3.paginator['pageIndex'] = 0; // this.dataSourceTab3.paginator['pageIndex'] = 0;
this.dataSourceTab3.data = []; // this.dataSourceTab3.data = [];
this.recordStatus = true; this.recordStatus = true;
this.scheduledPdListData = [] this.scheduledPdListData = []
this.pagedList = [];
this.limitMsg = false this.limitMsg = false
} }
},error => { },error => {

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

@ -1,10 +1,20 @@
<mat-card> <mat-card>
<mat-card-content> <mat-card-content>
<div fxLayout="row" *ngFor="let master of pdMasterData">
<div fxFlex="100" align="right">
<button mat-raised-button class="mr-1 mb-1" color="primary" style="cursor: not-allowed !important;">
<strong> {{master.pd_status==pdStatusCheck.QC_COMPLETED ? 'QC Completed' : master.pd_status==pdStatusCheck.ADD_ON_PENDING ? 'Addon Pending' : master.pd_status | titlecase}}</strong>
</button>
<button *ngIf="roleAccessDetails.trigger && currentPDStatus==pdStatusCheck.DRAFT" mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="editPdMaster(master)" matTooltipPosition="above" matTooltip="Edit PD Master"><mat-icon>edit</mat-icon></button>
<button *ngIf="roleAccessDetails.trigger && currentPDStatus==pdStatusCheck.DRAFT" mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Trigger" matTooltipPosition="above" (click)="directTriggerPD(mandatoryFieldsValidations,master)"><mat-icon>flash_on</mat-icon></button>
<button *ngIf="roleAccessDetails.reports && master.pd_type_name && currentPDStatus==pdStatusCheck.QC_COMPLETED" mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="PD Report" matTooltipPosition="above" (click)="getPDIDReport(viewID)"><mat-icon>ballot</mat-icon></button>
<span><button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Close" matTooltipPosition="above" (click)="loadPdListCompoent()"><mat-icon>close</mat-icon></button></span>
</div>
</div>
<div fxLayout="row wrap"> <div fxLayout="row wrap">
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="40" fxFlex.lg="30" fxFlex.xl="30" *ngFor="let master of pdMasterData"> <div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="40" fxFlex.lg="30" fxFlex.xl="30" *ngFor="let master of pdMasterData">
<mat-card style="min-width: 80%;max-width: 100%;box-shadow: 0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15) !important;margin-top:60px;"> <mat-card style="min-width: 80%;max-width: 100%;box-shadow: 0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15) !important;">
<mat-card-content style="background-color: whitesmoke;padding:0px !important;"> <mat-card-content style="background-color: whitesmoke;padding:0px !important;">
<mat-list role="list" style="padding-top: 0px !important;"> <mat-list role="list" style="padding-top: 0px !important;">
<mat-list-item role="listitem" style="background-color:#e00201;height:48px !important;"> <mat-list-item role="listitem" style="background-color:#e00201;height:48px !important;">
@ -16,7 +26,7 @@
</div> </div>
</div> </div>
</mat-list-item> </mat-list-item>
<mat-list-item role="listitem" style="height:48px !important;"> <mat-list-item role="listitem">
<div fxFlex="row"> <div fxFlex="row">
<div fxFlex="100"> <div fxFlex="100">
<div fxFlex="50" align="left"> <div fxFlex="50" align="left">
@ -30,7 +40,7 @@
</mat-list-item> </mat-list-item>
<mat-list-item role="listitem" style="height:auto !important;"> <mat-list-item role="listitem" style="height:60px !important;">
<div fxFlex="row"> <div fxFlex="row">
<div fxFlex="100"> <div fxFlex="100">
<div fxFlex="50" align="left" *ngIf="master.lender_applicant_id"> <div fxFlex="50" align="left" *ngIf="master.lender_applicant_id">
@ -69,7 +79,7 @@
</mat-list-item> </mat-list-item>
<mat-list-item role="listitem" *ngIf="master.loan_amount && master.loan_amount != 0"> <mat-list-item role="listitem" *ngIf="master.loan_amount && master.loan_amount != 0">
<div fxFlex="70" fxFlexOffset="30"> <div fxFlex="100">
<div style="font-size:0.9rem !important;">{{master.loan_amount | numberToWords}} Only</div> <div style="font-size:0.9rem !important;">{{master.loan_amount | numberToWords}} Only</div>
<!-- <div style="font-size:0.9rem !important;">{{ 9999999999 | numberToWords}} Only</div> --> <!-- <div style="font-size:0.9rem !important;">{{ 9999999999 | numberToWords}} Only</div> -->
</div> </div>
@ -77,7 +87,7 @@
</mat-list> </mat-list>
<div> <div style="padding: 10px !important;">
<mat-card-title style="color:#e00201;">Lender Contact Details</mat-card-title> <mat-card-title style="color:#e00201;">Lender Contact Details</mat-card-title>
<div *ngIf="master.pd_contact_person != '' && master.pd_contact_person != null"> <div *ngIf="master.pd_contact_person != '' && master.pd_contact_person != null">
<mat-list> <mat-list>
@ -91,52 +101,48 @@
</div> </div>
<div *ngIf="master.lender_credit_person_name != '' && master.lender_credit_person_name != null"> <div *ngIf="master.lender_credit_person_name != '' && master.lender_credit_person_name != null">
<!-- <mat-list-item> --> <!-- <mat-list-item> -->
<mat-card-subtitle>Credit Person</mat-card-subtitle> <div><p style="margin: 0px;">Credit Person</p></div>
<!-- </mat-list-item> --> <!-- </mat-list-item> -->
<div fxLayout="row" fxFlex="100"> <div fxLayout="row">
<!-- <div > --> <!-- <div > -->
<div fxFlex="50" align="left"> <div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="100" fxFlex.xl="100">
<i class="fa-1x fa fa-user"></i><small style="margin-left: 1%; font-size: inherit">{{master.lender_credit_person_name}}</small> <i class="fa-1x fa fa-user"></i><small style="margin-left: 1%; font-size: inherit">{{master.lender_credit_person_name}}</small>
</div> </div>
<div fxFlex="50" align="right"> </div>
<div fxLayout="row">
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="100" fxFlex.xl="100">
<i class="fa-1x fa fa-phone"></i><small style="margin-left: 1%; font-size: inherit">{{master.lender_credit_person_contact_mobileno}}</small> <i class="fa-1x fa fa-phone"></i><small style="margin-left: 1%; font-size: inherit">{{master.lender_credit_person_contact_mobileno}}</small>
</div> </div>
<!-- </div> --> <!-- </div> -->
</div> </div>
</div><br/> </div>
<div *ngIf="master.lender_sales_person_name != '' && master.lender_sales_person_name != null"> <div *ngIf="master.lender_sales_person_name != '' && master.lender_sales_person_name != null">
<mat-card-subtitle>Sales Person</mat-card-subtitle><br/> <!-- <mat-list-item> -->
<div fxFlex="row"> <div><p style="margin: 0px;">Sales Person</p></div>
<div fxFlex="100"> <!-- </mat-list-item> -->
<div fxFlex="50" align="left"> <div fxLayout="row">
<i class="fa-1x fa fa-user"></i><small style="margin-left: 2%; font-size: inherit">{{master.lender_sales_person_name}}</small> <!-- <div > -->
</div> <div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="100" fxFlex.xl="100">
<div fxFlex="50" align="right"> <i class="fa-1x fa fa-user"></i><small style="margin-left: 1%; font-size: inherit">{{master.lender_sales_person_name}}</small>
<i class="fa-1x fa fa-phone"></i><small style="margin-left: 2%; font-size: inherit">{{master.lender_sales_contact_mobileno}}</small>
</div>
</div>
</div> </div>
</div> </div>
<div fxLayout="row">
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="100" fxFlex.xl="100">
<i class="fa-1x fa fa-phone"></i><small style="margin-left: 1%; font-size: inherit">{{master.lender_sales_contact_mobileno}}</small>
</div>
<!-- </div> -->
</div>
</div>
</div> </div>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>
</div> </div>
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="60" fxFlex.lg="70" fxFlex.xl="70" class="content-data" *ngFor="let master of pdMasterData"> <div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="60" fxFlex.lg="70" fxFlex.xl="70" class="content-data" *ngFor="let master of pdMasterData">
<div fxLayout="row">
<div fxFlex="100" align="right">
<button mat-raised-button class="mr-1 mb-1" color="primary" style="cursor: not-allowed !important;">
<strong> {{master.pd_status==pdStatusCheck.QC_COMPLETED ? 'QC Completed' : master.pd_status==pdStatusCheck.ADD_ON_PENDING ? 'Addon Pending' : master.pd_status | titlecase}}</strong>
</button>
<button *ngIf="roleAccessDetails.trigger && currentPDStatus==pdStatusCheck.DRAFT" mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="editPdMaster(master)" matTooltipPosition="above" matTooltip="Edit PD Master"><mat-icon>edit</mat-icon></button>
<button *ngIf="roleAccessDetails.trigger && currentPDStatus==pdStatusCheck.DRAFT" mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Trigger" matTooltipPosition="above" (click)="directTriggerPD(mandatoryFieldsValidations,master)"><mat-icon>flash_on</mat-icon></button>
<button *ngIf="roleAccessDetails.reports && master.pd_type_name && currentPDStatus==pdStatusCheck.QC_COMPLETED" mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="PD Report" matTooltipPosition="above" (click)="getPDIDReport(viewID)"><mat-icon>ballot</mat-icon></button>
<span><button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Close" matTooltipPosition="above" (click)="loadPdListCompoent()"><mat-icon>close</mat-icon></button></span>
</div>
</div>
<!-- <hr/> --> <!-- <hr/> -->
<div fxLayout="row wrap"> <div fxLayout="row wrap">
<div fxFlex="50" *ngFor="let addresses of master.addresses;"> <div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="50" fxFlex.lg="50" fxFlex.xl="50" *ngFor="let addresses of master.addresses;">
<mat-card style="box-shadow: 0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15) !important;border-radius: 5px !important;border-bottom:1px solid #e00201 !important;" *ngIf="addresses.pincode"> <mat-card style="box-shadow: 0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15) !important;border-radius: 5px !important;border-bottom:1px solid #e00201 !important;" *ngIf="addresses.pincode">
<mat-card-title class="headerdesign" style="margin:0px !important;padding: 0px !important;height: 95px !important;"> <mat-card-title class="headerdesign" style="margin:0px !important;padding: 0px !important;height: 95px !important;">
<!-- this is for set primary address of the PD actions--> <!-- this is for set primary address of the PD actions-->
@ -247,7 +253,7 @@
</mat-card> </mat-card>
</div> </div>
<div fxFlex="50" *ngIf="master.remarks"> <div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="50" fxFlex.lg="50" fxFlex.xl="50" *ngIf="master.remarks">
<mat-card style="box-shadow: 0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15) !important;border-radius: 5px !important;border-bottom:1px solid #e00201 !important;"> <mat-card style="box-shadow: 0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15) !important;border-radius: 5px !important;border-bottom:1px solid #e00201 !important;">
<mat-card-header> <mat-card-header>
<mat-card-title style="color:#e00201;">Remarks</mat-card-title> <mat-card-title style="color:#e00201;">Remarks</mat-card-title>
@ -283,26 +289,31 @@
</div> </div>
</mat-card-header> </mat-card-header>
<mat-card-content *ngIf="pdApplicantData.length>0; else noApplicant"> <mat-card-content *ngIf="pdApplicantData.length>0; else noApplicant" style="padding: 0px !important;">
<mat-list *ngFor="let applicant of pdApplicantData"> <mat-card *ngFor="let applicant of pdApplicantData" style="padding: 6px;border-radius: 5px;border: 2px solid #00BCD4;margin-bottom: 10px;">
<mat-list-item style="height:68px !important;"> <div fxLayout="row wrap">
<p><span *ngIf="applicant.applicant_name!=null" class="mb-2 text-center hover-icon"> <div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="20.33" fxFlex.xl="20.33">
<i class="fa-1x fa fa-user-o" style="width: 37px;padding: 8px 9px 8px 9px;border-bottom: 2px solid red;"></i> <span *ngIf="applicant.applicant_name!=null" class="mb-2 text-center hover-icon">
&nbsp;{{applicant.applicant_name}} <i class="fa-1x fa fa-user-o" style="width: 37px;padding: 8px 9px 8px 9px;border-bottom: 2px solid red;"></i>
</span> &nbsp;&nbsp;&nbsp; &nbsp;{{applicant.applicant_name}}
<span *ngIf="applicant.mobile_no != '' && (applicant.mobile_no != null || applicant.mobile_no != undefined) " class="mb-2 text-center hover-icon"> </span>
<i class="fa-1x fa fa-phone" style="width: 37px;padding: 8px 9px 8px 9px;border-bottom: 2px solid red;"></i> </div>
&nbsp;{{applicant.mobile_no}} <div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="20.33" fxFlex.xl="20.33">
</span> &nbsp;&nbsp;&nbsp; <span *ngIf="applicant.mobile_no != '' && (applicant.mobile_no != null || applicant.mobile_no != undefined) " class="mb-2 text-center hover-icon">
<span *ngIf="applicant.landline != '' && (applicant.landline != 'null-null'|| applicant.landline != undefined-undefined) && (applicant.landline != null || applicant.landline != undefined) " class="mb-2 text-center hover-icon"> <i class="fa-1x fa fa-phone" style="width: 37px;padding: 8px 9px 8px 9px;border-bottom: 2px solid red;"></i>
<i class="fa-1x fa fa-phone" style="width: 37px;padding: 8px 9px 8px 9px;border-bottom: 2px solid red;"></i> &nbsp;{{applicant.mobile_no}}
&nbsp;{{applicant.landline}} </span>
</span> </div>
<span *ngIf="applicant.applicant_type=='1';else codetails" style="font-size:12px;">( Applicant )</span> <div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="35.33" fxFlex.xl="35.33">
<ng-template #codetails><span> {{applicant.relation_name}} </span></ng-template> <span *ngIf="applicant.landline != '' && (applicant.landline != 'null-null'|| applicant.landline != undefined-undefined) && (applicant.landline != null || applicant.landline != undefined) " class="mb-2 text-center hover-icon">
</p> <i class="fa-1x fa fa-phone" style="width: 37px;padding: 8px 9px 8px 9px;border-bottom: 2px solid red;"></i>
</mat-list-item> &nbsp;{{applicant.landline}}
</mat-list> </span>
<span *ngIf="applicant.applicant_type=='1';else codetails" style="font-size:12px;">( Applicant )</span>
<ng-template #codetails><span> {{applicant.relation_name}} </span></ng-template>
</div>
</div>
</mat-card>
</mat-card-content> </mat-card-content>
<ng-template #noApplicant> <ng-template #noApplicant>
<mat-card-content> <mat-card-content>

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

@ -15,7 +15,7 @@ import {
MatTabsModule, MatCheckboxModule, MatTabsModule, MatCheckboxModule,
MatBadgeModule, MatExpansionModule, MatStepperModule, MatSidenavModule, MatBadgeModule, MatExpansionModule, MatStepperModule, MatSidenavModule,
MatMenuModule, MatButtonToggleModule,MatChipsModule,MatProgressSpinnerModule, MatMenuModule, MatButtonToggleModule,MatChipsModule,MatProgressSpinnerModule,
MatAutocompleteModule, MatDatepickerModule } from '@angular/material'; MatAutocompleteModule, MatDatepickerModule, MatDividerModule } from '@angular/material';
import {MatSlideToggleModule} from '@angular/material/slide-toggle'; import {MatSlideToggleModule} from '@angular/material/slide-toggle';
import {FormsModule, ReactiveFormsModule} from '@angular/forms'; import {FormsModule, ReactiveFormsModule} from '@angular/forms';
@ -187,6 +187,7 @@ const pdCustomNotifierOptions: NotifierOptions = {
MatTableModule, MatTableModule,
MatPaginatorModule, MatPaginatorModule,
MatButtonModule, MatButtonModule,
MatDividerModule,
MatProgressBarModule, MatProgressBarModule,
MatToolbarModule, MatToolbarModule,
FlexLayoutModule, FlexLayoutModule,