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": {
"prefix": "app"
}
},
"cli": {
"analytics": "509641b9-0932-4a65-bc55-144b73b41471"
}
}

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

@ -2626,9 +2626,9 @@
}
},
"caniuse-lite": {
"version": "1.0.30001150",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001150.tgz",
"integrity": "sha512-kiNKvihW0m36UhAFnl7bOAv0i1K1f6wpfVtTF5O5O82XzgtBnb05V0XeV3oZ968vfg2sRNChsHw8ASH2hDfoYQ==",
"version": "1.0.30001151",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001151.tgz",
"integrity": "sha512-Zh3sHqskX6mHNrqUerh+fkf0N72cMxrmflzje/JyVImfpknscMnkeJrlFGJcqTmaa0iszdYptGpWMJCRQDkBVw==",
"dev": true
},
"caseless": {
@ -4054,9 +4054,9 @@
"dev": true
},
"electron-to-chromium": {
"version": "1.3.582",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.582.tgz",
"integrity": "sha512-0nCJ7cSqnkMC+kUuPs0YgklFHraWGl/xHqtZWWtOeVtyi+YqkoAOMGuZQad43DscXCQI/yizcTa3u6B5r+BLww==",
"version": "1.3.584",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.584.tgz",
"integrity": "sha512-NB3DzrTzJFhWkUp+nl2KtUtoFzrfGXTir2S+BU4tXGyXH9vlluPuFpE3pTKeH7+PY460tHLjKzh6K2+TWwW+Ww==",
"dev": true
},
"elliptic": {
@ -11871,9 +11871,9 @@
"integrity": "sha1-t8+nHnaPHJAAxJe5FRswlHxQ5G0="
},
"timers-browserify": {
"version": "2.0.11",
"resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.11.tgz",
"integrity": "sha512-60aV6sgJ5YEbzUdn9c8kYGIqOubPoUdqQCul3SBAsRCZ40s6Y5cMcrW4dt3/k/EsbLVJNl9n6Vz3fTc+k2GeKQ==",
"version": "2.0.12",
"resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.12.tgz",
"integrity": "sha512-9phl76Cqm6FhSX9Xe1ZUAMLtm1BLkKj2Qd5ApyWkXzsMRaA7dgr81kf4wJmQf/hAvg8EEyJxDo3du/0KlhPiKQ==",
"dev": true,
"requires": {
"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> -->
<p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p>
<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">
<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);
color: green;
}
.cell{
display:inline !important;
// text-align: center !important;
}
.cellhide{
display: none !important;
}
.center{
text-align:center;
}
@ -26,3 +20,26 @@ p.note {
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-content>
<mat-card-content style="padding: 0px !important;">
<div *ngIf="!loadControl">
<div fxLayoutAlign="center">
<mat-progress-spinner mode="indeterminate" class="primary"></mat-progress-spinner>

202
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-list class="m-gap p-gap">
<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-option *ngFor="let type of PDType" [value]="type.pd_type_id">{{type.type_name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:25%">
<mat-form-field style="width:25%" class="matfieldblock">
<mat-select multiple formControlName="pd_status" placeholder="PD Status">
<mat-option *ngFor="let status of pdStatus" [value]="status.pd_status_name">{{status.pd_status_name}}</mat-option>
</mat-select>
</mat-form-field> &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">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</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">
<mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
<mat-datepicker #picker1></mat-datepicker>
</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-option *ngFor="let pro of PRODUCTS" [value]="pro.product_id">{{pro.name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:30%">
<mat-form-field style="width:30%" class="matfieldblock">
<mat-select multiple formControlName="pd_city" placeholder="City">
<mat-option *ngFor="let city of CITY" [value]="city.city_id">{{city.name}}</mat-option>
</mat-select>
@ -47,10 +47,10 @@
<mat-option *ngFor="let ent of ENTITY" [value]="ent.entity_id">{{ent.full_name}}</mat-option>
</mat-select>
</mat-form-field> -->
<mat-form-field style="width:30%">
<mat-form-field style="width:30%" class="matfieldblock">
<input matInput type="text" formControlName="pd_name" placeholder="Applicant Name">
</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">
</mat-form-field>
<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>
<br/>
<mat-table [dataSource]="dataSourceTab1" matSort *ngIf="PdListData.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;">
<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-->
<!--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>
@ -91,60 +134,121 @@
<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">
</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>
</mat-cell>
</ng-container>
<ng-container matColumnDef="Address">
<mat-cell class="cell" *matCellDef="let details;">
</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>
</mat-cell>
</ng-container>
<ng-container matColumnDef="Status">
<mat-cell class="cell center" *matCellDef="let details;">
</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 *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"
<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) }}
</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>
</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">
<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>
</div>
<!--End Web View Code-->
<mat-divider></mat-divider>
</div>
</div>
</mat-cell>
</ng-container>
<mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;">
</mat-row>
</mat-table>
<!-- <mat-table [dataSource]="dataSourceTab1" matSort *ngIf="PdListData.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>
</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>
<div> No Record found </div>
</ng-template> -->
@ -152,7 +256,7 @@
</mat-card-content>
<div [hidden]="recordStatus">
<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>
</div>
<mat-card-content *ngIf="recordStatus">

77
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);
color: green;
}
.cell{
display:inline !important;
}
.cellhide{
display: none !important;
}
.center{
text-align:center;
}
@ -26,4 +22,71 @@ p.note {
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%;
}
}

50
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;
limitMsg: boolean = false;
common: any;
pagedList: any=[];
constructor(private _pd: PdTrigerService,private _fb:FormBuilder,notifier: NotifierService,private userService:UserService) {
this.notifier = notifier;
@ -111,14 +112,25 @@ console.log(this.displayedColumns)
data => {
if (data.status == 200) {
this.PdListData = data.records;
this.dataLengthTab1 = data.records.length;
this.dataSourceTab1.data = this.PdListData;
// this.PdListData = <GetOrInitializeYourListHere>;
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.limitMsg = true
}
else{
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.limitMsg = false
}
@ -130,6 +142,16 @@ console.log(this.displayedColumns)
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) {
console.log(e);
}
@ -226,17 +248,25 @@ console.log(this.displayedColumns)
if(res['dataStatus'])
{
this.PdListData = res['records'];
this.dataSourceTab1.data = res['records'];
// console.log('records',res['records']);
this.dataSourceTab1.paginator = this.paginator;
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.dataSourceTab1.data = res['records'];
// // console.log('records',res['records']);
// this.dataSourceTab1.paginator = this.paginator;
this.recordStatus=false
this.limitMsg = false
}else{
this.notifier.notify('warning', 'No Records Found !');
this.dataSourceTab1.paginator['length'] = 0;
this.dataSourceTab1.paginator['pageIndex'] = 0;
this.dataSourceTab1.data = [];
this.PdListData = [];
// this.dataSourceTab1.paginator['length'] = 0;
// this.dataSourceTab1.paginator['pageIndex'] = 0;
// this.dataSourceTab1.data = [];
this.PdListData = [];
this.pagedList = [];
// this.length = this.PdListData.length;
this.recordStatus = true;
this.limitMsg = false
// 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>
<p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p>
<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">
<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 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.applicant_name" mat-line><b>{{details.applicant_name}}</b></span><br> -->
<span *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b>
</span><br>
@ -119,12 +199,12 @@
</ng-container>
<mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;">
</mat-row>
</mat-table>
</mat-table> -->
</mat-card-content>
<div [hidden]="recordStatus">
<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>
</div>
<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 {
transform: scale(1.1);
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;
transform: scale(1.1);
color: green;
}
.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%;
}
}

48
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;
limitMsg: boolean = false;
common: any;
pagedList: any=[];
constructor(private _pd: PdTrigerService,public _fb:FormBuilder,notifier: NotifierService,private userService:UserService) {
this.notifier = notifier;
@ -107,15 +107,21 @@ public LenderRoleID : any = localStorage.getItem('LenderRoleID');
data => {
if (data.status == 200) {
this.completedPdListData = data.records;
this.dataLengthTab4 = data.records.length;
this.dataSourceTab4.data = this.completedPdListData;
// this.dataLengthTab4 = data.records.length;
// 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.limitMsg = true
}
else{
this.dataSourceTab4.data =[]
this.completedPdListData=[];
this.dataLengthTab4= null;
// this.dataSourceTab4.data =[]
// this.dataLengthTab4= null;
this.recordStatus=true;
this.limitMsg = false
}
@ -127,6 +133,16 @@ public LenderRoleID : any = localStorage.getItem('LenderRoleID');
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) {
console.log(e);
}
@ -231,17 +247,25 @@ public LenderRoleID : any = localStorage.getItem('LenderRoleID');
if(res['dataStatus']==true)
{
this.completedPdListData=res['records'];
this.dataSourceTab4.data = res['records'];
this.dataSourceTab4.paginator = this.paginator;
// this.dataSourceTab4.data = res['records'];
// 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.limitMsg = false
}else{
this.notifier.notify('warning', 'No Records Found !');
this.recordStatus=true;
this.dataSourceTab4.paginator['length'] = 0;
this.dataSourceTab4.paginator['pageIndex'] = 0;
this.dataSourceTab4.data = [];
this.limitMsg = false
// this.dataSourceTab4.paginator['length'] = 0;
// this.dataSourceTab4.paginator['pageIndex'] = 0;
// this.dataSourceTab4.data = [];
// this.completedPdListData = [];
this.pagedList = [];
this.recordStatus=true
this.limitMsg = false
}
},error => {
this.errorMessage.push(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-list class="m-gap p-gap">
<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-option *ngFor="let type of PDType" [value]="type.pd_type_id">{{type.type_name}}</mat-option>
</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-select>
</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">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</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">
<mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
<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-select>
</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-option *ngFor="let city of CITY" [value]="city.city_id">{{city.name}}</mat-option>
</mat-select>
@ -48,10 +48,10 @@
<mat-option *ngFor="let ent of ENTITY" [value]="ent.entity_id">{{ent.full_name}}</mat-option>
</mat-select>
</mat-form-field> -->
<mat-form-field style="width:30%">
<mat-form-field style="width:30%" class="matfieldblock">
<input matInput type="text" formControlName="pd_name" placeholder="Applicant Name">
</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">
</mat-form-field>
<div align="right">
@ -71,7 +71,87 @@
</mat-expansion-panel>
<p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p>
<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">
<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>
@ -80,7 +160,6 @@
</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.applicant_name" mat-line><b>{{details.applicant_name}}</b></span><br> -->
<span *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b>
</span><br>
@ -116,12 +195,12 @@
</ng-container>
<mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;">
</mat-row>
</mat-table>
</mat-table> -->
</mat-card-content>
<div [hidden]="recordStatus">
<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>
</div>
<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 {
transform: scale(1.1);
color: green;
}
.cell{
display:inline !important;
}
.cellhide{
display: none !important;
transform: scale(1.1);
color: green;
}
.center{
text-align:center;
text-align:center;
}
.fontsize{
font-size:14px;
font-size:14px;
}
.toolbar-space {
flex: 0.01 0 auto;
flex: 0.01 0 auto;
}
p.note {
// float: right;
text-align: right;
font-size: 12px;
color: grey;
font-weight: bold;
// 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%;
}
}

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;
limitMsg: boolean = false;
common: any;
pagedList: any=[];
constructor(private _pd: PdTrigerService,public _fb:FormBuilder,notifier: NotifierService,private userService:UserService) {
this.notifier = notifier;
@ -102,14 +103,20 @@ public LenderRoleID : string = localStorage.getItem('LenderRoleID');
data => {
if (data.status == 200) {
this.progressPdListData = data.records;
this.dataLengthTab2 = data.records.length;
this.dataSourceTab2.data = this.progressPdListData;
// this.dataLengthTab2 = data.records.length;
// 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.limitMsg = true
}else{
this.progressPdListData =[];
this.progressPdListData = [];
this.dataSourceTab2.data = [];
// this.progressPdListData = [];
// this.dataSourceTab2.data = [];
this.recordStatus=true;
this.limitMsg = false
}
@ -119,6 +126,16 @@ public LenderRoleID : string = localStorage.getItem('LenderRoleID');
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) {
console.log(e);
}
@ -220,16 +237,23 @@ public LenderRoleID : string = localStorage.getItem('LenderRoleID');
if(res['dataStatus']==true)
{
this.progressPdListData = res['records'];
this.dataSourceTab2.data = res['records'];
this.dataSourceTab2.paginator = this.paginator;
// this.dataSourceTab2.data = res['records'];
// 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.limitMsg = false
}else{
this.notifier.notify('warning', 'No Records Found !');
this.dataSourceTab2.paginator['length'] = 0;
this.dataSourceTab2.paginator['pageIndex'] = 0;
this.dataSourceTab2.data = [];
// this.dataSourceTab2.paginator['length'] = 0;
// this.dataSourceTab2.paginator['pageIndex'] = 0;
// this.dataSourceTab2.data = [];
this.progressPdListData = [];
this.pagedList = [];
this.recordStatus=true
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>
<p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p>
<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">
<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>
@ -82,7 +163,6 @@
</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.applicant_name" mat-line><b>{{details.applicant_name}}</b></span><br> -->
<span *ngIf="details.is_child" mat-line>
<b>{{details.is_child == 0 ? details.applicant_name : 'Add On PD' }}</b>
</span><br>
@ -118,12 +198,12 @@
</ng-container>
<mat-row style="align-items: normal !important;" *matRowDef="let row; columns: displayedColumns;">
</mat-row>
</mat-table>
</mat-table> -->
</mat-card-content>
<div [hidden]="recordStatus">
<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>
</div>
<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 {
transform: scale(1.1);
color: green;
}
.cell{
display:inline !important;
}
.cellhide{
display: none !important;
transform: scale(1.1);
color: green;
}
.center{
text-align:center;
text-align:center;
}
.fontsize{
font-size:14px;
font-size:14px;
}
.toolbar-space {
flex: 0.01 0 auto;
flex: 0.01 0 auto;
}
p.note {
// float: right;
text-align: right;
font-size: 12px;
color: grey;
font-weight: bold;
// 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/qc-completed-pd/qc-completed-pd.component.ts
View File

@ -49,7 +49,7 @@ export class QcCompletedPdComponent implements OnInit, OnChanges {
user_role_name: string;
limitMsg: boolean = false;
common: any;
pagedList: any=[];
constructor(private _pd: PdTrigerService, public _fb: FormBuilder,notifier: NotifierService,private userService:UserService) {
this.notifier = notifier;
@ -109,15 +109,21 @@ export class QcCompletedPdComponent implements OnInit, OnChanges {
data => {
if (data.status == 200) {
this.qcCompletedPdListData = data.records;
this.dataLengthTab5 = data.records.length;
this.dataSourceTab5.data = this.qcCompletedPdListData;
// this.dataLengthTab5 = data.records.length;
// 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.limitMsg = true
}
else {
this.qcCompletedPdListData = [];
this.dataSourceTab5.data = []
this.dataLengthTab5 = null;
// this.dataSourceTab5.data = []
// this.dataLengthTab5 = null;
this.recordStatus = true;
this.limitMsg = false
}
@ -129,6 +135,16 @@ export class QcCompletedPdComponent implements OnInit, OnChanges {
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) {
console.log(e);
}
@ -209,16 +225,24 @@ export class QcCompletedPdComponent implements OnInit, OnChanges {
this.xpandStatus = false;
if (res['dataStatus'] == true) {
this.qcCompletedPdListData = res['records'];
this.dataSourceTab5.data = res['records'];
this.dataSourceTab5.paginator = this.paginator;
// this.dataSourceTab5.data = res['records'];
// 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.limitMsg = false
}else{
this.qcCompletedPdListData = []
this.qcCompletedPdListData = []
this.notifier.notify('warning', 'No Records Found !');
this.dataSourceTab5.paginator['length'] = 0;
this.dataSourceTab5.paginator['pageIndex'] = 0;
this.dataSourceTab5.data = [];
// this.dataSourceTab5.paginator['length'] = 0;
// this.dataSourceTab5.paginator['pageIndex'] = 0;
// this.dataSourceTab5.data = [];
this.qcCompletedPdListData = []
this.pagedList = [];
this.recordStatus = true;
this.limitMsg = false
}

193
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-list class="m-gap p-gap">
<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-option *ngFor="let type of PDType" [value]="type.pd_type_id">{{type.type_name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<!-- <mat-form-field style="width:40%">
<!-- <mat-form-field style="width:40%" class="matfieldblock">
<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-select>
</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">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</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">
<mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
<mat-datepicker #picker1></mat-datepicker>
</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-option *ngFor="let pro of PRODUCTS" [value]="pro.product_id">{{pro.name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<mat-form-field style="width:30%">
<mat-form-field style="width:30%" class="matfieldblock">
<mat-select multiple formControlName="pd_city" placeholder="City">
<mat-option *ngFor="let city of CITY" [value]="city.city_id">{{city.name}}</mat-option>
</mat-select>
</mat-form-field> &nbsp; &nbsp;
<!-- <mat-form-field style="width:30%">
<!-- <mat-form-field style="width:30%" class="matfieldblock">
<mat-select multiple formControlName="pd_lender" placeholder="Lender Name">
<mat-option *ngFor="let ent of ENTITY" [value]="ent.entity_id">{{ent.full_name}}</mat-option>
</mat-select>
</mat-form-field> -->
<mat-form-field style="width:30%">
<mat-form-field style="width:30%" class="matfieldblock">
<input matInput type="text" formControlName="pd_name" placeholder="Applicant Name">
</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">
</mat-form-field>
<div align="right">
@ -71,60 +71,137 @@
</mat-expansion-panel>
<p class="note" *ngIf="!recordStatus && limitMsg">Showing data for last {{common}}. To see older records, please use advanced filter</p>
<br/>
<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 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">{{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>
<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.applicant_name" mat-line><b>{{details.applicant_name}}</b></span><br> -->
<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>{{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>
<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>
</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>
</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>
</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>{{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.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-card-content>
<div [hidden]="recordStatus">
<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>
</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 {
transform: scale(1.1);
color: green;
}
.cell{
display:inline !important;
}
.cellhide{
display: none !important;
transform: scale(1.1);
color: green;
}
.center{
text-align:center;
text-align:center;
}
.fontsize{
font-size:14px;
font-size:14px;
}
.toolbar-space {
flex: 0.01 0 auto;
flex: 0.01 0 auto;
}
p.note {
// float: right;
text-align: right;
font-size: 12px;
color: grey;
font-weight: bold;
// 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%;
}
}

45
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;
limitMsg: boolean = false;
common: any;
pagedList: any=[];
constructor(private _pd: PdTrigerService,public _fb:FormBuilder,notifier: NotifierService,private userService:UserService) {
this.notifier = notifier;
@ -107,15 +107,21 @@ public LenderRoleID : any = localStorage.getItem('LenderRoleID');
data => {
if (data.status == 200) {
this.scheduledPdListData = data.records;
this.dataLengthTab3 = data.records.length;
this.dataSourceTab3.data = this.scheduledPdListData;
// this.dataLengthTab3 = data.records.length;
// 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.limitMsg = true
}
else{
this.scheduledPdListData=[];
this.dataLengthTab3 = null;
this.dataSourceTab3.data = []
// this.dataLengthTab3 = null;
// this.dataSourceTab3.data = []
this.recordStatus=true;
this.limitMsg = false
}
@ -126,6 +132,16 @@ public LenderRoleID : any = localStorage.getItem('LenderRoleID');
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) {
console.log(e);
}
@ -224,18 +240,25 @@ public LenderRoleID : any = localStorage.getItem('LenderRoleID');
this.xpandStatus = false;
if(res['dataStatus']==true)
{
this.dataSourceTab3 = res['records'];
this.dataSourceTab3.paginator = this.paginator;
// this.dataSourceTab3 = res['records'];
// this.dataSourceTab3.paginator = this.paginator;
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.limitMsg = false
}else{
this.notifier.notify('warning', 'No Records Found !');
this.dataSourceTab3.paginator['length'] = 0;
this.dataSourceTab3.paginator['pageIndex'] = 0;
this.dataSourceTab3.data = [];
// this.dataSourceTab3.paginator['length'] = 0;
// this.dataSourceTab3.paginator['pageIndex'] = 0;
// this.dataSourceTab3.data = [];
this.recordStatus = true;
this.scheduledPdListData = []
this.scheduledPdListData = []
this.pagedList = [];
this.limitMsg = false
}
},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-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 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-list role="list" style="padding-top: 0px !important;">
<mat-list-item role="listitem" style="background-color:#e00201;height:48px !important;">
@ -16,7 +26,7 @@
</div>
</div>
</mat-list-item>
<mat-list-item role="listitem" style="height:48px !important;">
<mat-list-item role="listitem">
<div fxFlex="row">
<div fxFlex="100">
<div fxFlex="50" align="left">
@ -30,7 +40,7 @@
</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="100">
<div fxFlex="50" align="left" *ngIf="master.lender_applicant_id">
@ -69,7 +79,7 @@
</mat-list-item>
<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;">{{ 9999999999 | numberToWords}} Only</div> -->
</div>
@ -77,7 +87,7 @@
</mat-list>
<div>
<div style="padding: 10px !important;">
<mat-card-title style="color:#e00201;">Lender Contact Details</mat-card-title>
<div *ngIf="master.pd_contact_person != '' && master.pd_contact_person != null">
<mat-list>
@ -91,52 +101,48 @@
</div>
<div *ngIf="master.lender_credit_person_name != '' && master.lender_credit_person_name != null">
<!-- <mat-list-item> -->
<mat-card-subtitle>Credit Person</mat-card-subtitle>
<div><p style="margin: 0px;">Credit Person</p></div>
<!-- </mat-list-item> -->
<div fxLayout="row" fxFlex="100">
<div fxLayout="row">
<!-- <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>
</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>
</div>
<!-- </div> -->
</div>
</div><br/>
<div *ngIf="master.lender_sales_person_name != '' && master.lender_sales_person_name != null">
<mat-card-subtitle>Sales Person</mat-card-subtitle><br/>
<div fxFlex="row">
<div fxFlex="100">
<div fxFlex="50" align="left">
<i class="fa-1x fa fa-user"></i><small style="margin-left: 2%; font-size: inherit">{{master.lender_sales_person_name}}</small>
</div>
<div fxFlex="50" align="right">
<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 *ngIf="master.lender_sales_person_name != '' && master.lender_sales_person_name != null">
<!-- <mat-list-item> -->
<div><p style="margin: 0px;">Sales Person</p></div>
<!-- </mat-list-item> -->
<div fxLayout="row">
<!-- <div > -->
<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_sales_person_name}}</small>
</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>
</mat-card-content>
</mat-card>
</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 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/> -->
<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-title class="headerdesign" style="margin:0px !important;padding: 0px !important;height: 95px !important;">
<!-- this is for set primary address of the PD actions-->
@ -247,7 +253,7 @@
</mat-card>
</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-header>
<mat-card-title style="color:#e00201;">Remarks</mat-card-title>
@ -283,26 +289,31 @@
</div>
</mat-card-header>
<mat-card-content *ngIf="pdApplicantData.length>0; else noApplicant">
<mat-list *ngFor="let applicant of pdApplicantData">
<mat-list-item style="height:68px !important;">
<p><span *ngIf="applicant.applicant_name!=null" class="mb-2 text-center hover-icon">
<i class="fa-1x fa fa-user-o" style="width: 37px;padding: 8px 9px 8px 9px;border-bottom: 2px solid red;"></i>
&nbsp;{{applicant.applicant_name}}
</span> &nbsp;&nbsp;&nbsp;
<span *ngIf="applicant.mobile_no != '' && (applicant.mobile_no != null || applicant.mobile_no != 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>
&nbsp;{{applicant.mobile_no}}
</span> &nbsp;&nbsp;&nbsp;
<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>
&nbsp;{{applicant.landline}}
</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>
</p>
</mat-list-item>
</mat-list>
<mat-card-content *ngIf="pdApplicantData.length>0; else noApplicant" style="padding: 0px !important;">
<mat-card *ngFor="let applicant of pdApplicantData" style="padding: 6px;border-radius: 5px;border: 2px solid #00BCD4;margin-bottom: 10px;">
<div fxLayout="row wrap">
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="20.33" fxFlex.xl="20.33">
<span *ngIf="applicant.applicant_name!=null" class="mb-2 text-center hover-icon">
<i class="fa-1x fa fa-user-o" style="width: 37px;padding: 8px 9px 8px 9px;border-bottom: 2px solid red;"></i>
&nbsp;{{applicant.applicant_name}}
</span>
</div>
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="20.33" fxFlex.xl="20.33">
<span *ngIf="applicant.mobile_no != '' && (applicant.mobile_no != null || applicant.mobile_no != 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>
&nbsp;{{applicant.mobile_no}}
</span>
</div>
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="35.33" fxFlex.xl="35.33">
<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>
&nbsp;{{applicant.landline}}
</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>
<ng-template #noApplicant>
<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,
MatBadgeModule, MatExpansionModule, MatStepperModule, MatSidenavModule,
MatMenuModule, MatButtonToggleModule,MatChipsModule,MatProgressSpinnerModule,
MatAutocompleteModule, MatDatepickerModule } from '@angular/material';
MatAutocompleteModule, MatDatepickerModule, MatDividerModule } from '@angular/material';
import {MatSlideToggleModule} from '@angular/material/slide-toggle';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
@ -187,6 +187,7 @@ const pdCustomNotifierOptions: NotifierOptions = {
MatTableModule,
MatPaginatorModule,
MatButtonModule,
MatDividerModule,
MatProgressBarModule,
MatToolbarModule,
FlexLayoutModule,