PD List UI

This commit is contained in:
saravanakumarkandasami 2018-10-24 18:17:20 +05:30
parent a0cf304925
commit 28a86dfbb8
3 changed files with 43 additions and 38 deletions

View File

@ -18,43 +18,36 @@
<mat-tab>
<ng-template mat-tab-label>All</ng-template>
<mat-card-content>
<div class="card-comment-widget">
<mat-list *ngIf="pdList.length > 0">
<mat-list-item *ngFor="let details of dataSource.connect() | async" style="border-bottom:1px solid #f1f7f5">
<!--<img mat-list-avatar src="assets/images/lime.jpg" alt="">-->
<!-- {{details.applicat_details[0].applicant_name}} -->
<p *ngIf="details.applicat_details" mat-line>{{details.applicat_details[0].applicant_name}} </p>
<mat-table [dataSource]="dataSource" matSort *ngIf="pdList.length > 0" >
<p *ngIf="details.lender_full_name" mat-line><a style="padding-right: 7%;">{{details.lender_full_name}} </a><a style="padding-right: 7%">{{details.lender_applicant_id}}</a>{{details.pd_date_of_initiation}}</p>
<p *ngIf="details.product_abbr" mat-line><a style="padding-right: 7%;">{{details.product_abbr}}/{{details.subproduct_abbr}}/{{details.customer_segment_abbr}}</a><a style="padding-right: 7%;"><span *ngIf="details.loan_amount" class="hover-icon"><i class="fa-1x fa fa-rupee">&nbsp;</i>{{details.loan_amount}}</span></a><span class="hover-icon"><i class="fa-1x fa fa-map-marker"> </i> &nbsp;{{details.city_name}}/{{details.state_name}}-{{details.pincode}}</span></p>
<!-- <span class="text-mat mat-text-muted">Chennai</span> -->
<ng-container matColumnDef="Name">
<mat-cell class="cell" *matCellDef="let details;"> <span *ngIf="details.applicat_details" mat-line><b>{{details.applicat_details[0].applicant_name}}</b></span><br>
<span *ngIf="details.lender_full_name" mat-line> {{details.lender_full_name}} </span><br>
<span *ngIf="details.product_abbr" mat-line> {{details.product_abbr}}/{{details.subproduct_abbr}}/{{details.customer_segment_abbr}} </span> </mat-cell>
</ng-container>
<ng-container matColumnDef="Lenderid">
<mat-cell class="cell" *matCellDef="let details"><span> {{details.lender_applicant_id}} </span><br>
<!-- <div class="comment-time">
<button mat-raised-button mat-icon-button mat-button-sm class="mr-1 mb-1" type="button" color="primary" (click)="editPdDetails(details.pd_id)"><mat-icon>edit</mat-icon></button>
<span><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> <i class="fa-1x fa fa-map-marker"> </i> {{details.city_name}}/{{details.state_name}}-{{details.pincode}} </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)="viewPDDetails(details.pd_id)"><mat-icon>visibility</mat-icon></button>
</mat-cell>
</ng-container>
<!---- <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>-->
<mat-row *matRowDef="let row; columns: displayedColumns;">
</mat-row>
</mat-table>
</div> -->
<div class="comment-time">
<!-- <button mat-raised-button mat-icon-button mat-button-sm class="mr-1 mb-1" color="accent" type="button" (click)="viewPdDetails(details.pd_id)"><mat-icon>visibility</mat-icon></button> -->
<button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="viewPDDetails(details.pd_id)"><mat-icon>visibility</mat-icon></button>
</div>
</mat-list-item>
</mat-list>
<mat-list *ngIf="recordStatus">
<mat-list-item>
<p mat-line>No Record Found ...</p>
</mat-list-item>
</mat-list>
</div>
</mat-card-content>
<mat-card-actions *ngIf="!recordStatus">
<mat-paginator #paginator class="mat-elevation-z1" [length]="pdList.length" [pageIndex]="pageIndex" [pageSize]="pageSize"
[pageSizeOptions]="[5, 10, 25, 100]" (page)="pageEvent = $event; pageChange($event)">
[pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)">
</mat-paginator>
</mat-card-actions>
</mat-tab>

View File

@ -2,3 +2,12 @@
transform: scale(1.1);
color: green;
}
.cell{
display:inline !important;
}
.cellhide{
display: none !important;
}
.center{
text-align:center;
}

View File

@ -10,6 +10,12 @@ import { MatPaginator, MatSort, MatTableDataSource, PageEvent } from '@angular/m
encapsulation: ViewEncapsulation.None
})
export class ListPdComponent implements OnInit, OnDestroy {
public dataLength: number;
public dataSource = new MatTableDataSource();
displayedColumns = ['Name','Lenderid','Address','Action'];
@ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
private notifier: NotifierService;
recordStatus: boolean;
noRecordFound:boolean;
@ -24,10 +30,7 @@ export class ListPdComponent implements OnInit, OnDestroy {
// data source variable details
pdListData = null;
public dataLength: number;
public dataSource = new MatTableDataSource();
@ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
pdList:any[] = [];
constructor( notifier: NotifierService, private route: ActivatedRoute,
private router: Router, private _pd: PdTrigerService) {