blob: 4f98abd5cc2b7eee81b6ac16ee6374e56cdf4c99 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
|
<div>
<div class="table-search-box">
<mat-form-field *ngIf="isSearchEnabled">
<input matInput *ngIf="!isServerSidePaginationEnabled" type="text" (keyup)="applyFilter($event.target.value)" placeholder="Search in entire table">
<input matInput *ngIf="isServerSidePaginationEnabled" type="text" #input placeholder="Search in entire table">
</mat-form-field>
<button *ngIf="showAddButton" type="button" style="float: right;" class="btn btn-primary" (click)="openEditModalPopup('')">
<i class="icon ion-md-person-add"></i> Add
</button>
</div>
<span class="rdp-spinner" *ngIf="showSpinner"></span>
<!-- <rdp-scroll-container [more]="hasMore()" [scrollOffset]="2500" [scrollDelay]="3000" (scrolled)="handleScroll($event)"
[class.full]="full" [class.part]="!full"> -->
<table mat-table #table [dataSource]="dataSource" style="width: 100%" matSort>
<rdp-column *ngFor="let column of columnsInfoList" name="{{column.title}}"
label="{{column.dispalyTitle | titlecase }}" sort="{{column.sort}}">
</rdp-column>
<!--Edit column will be displayed only if displayedColumns has Delete-->
<ng-container matColumnDef="edit">
<th mat-header-cell *matHeaderCellDef id="heading5">Edit</th>
<td id="rowheader_t1_{{i}}" mat-cell *matCellDef="let rowData; let i=index;">
<span class="icon-trash" id="{{i}}-button-role-edit" (click)="openEditModalPopup(rowData)">
<i class="ion ion-md-create"></i>
</span>
</td>
</ng-container>
<!--End of Edit Column-->
<!--Delete column will be displayed only if displayedColumns has Delete-->
<ng-container matColumnDef="delete">
<th mat-header-cell *matHeaderCellDef id="heading6">Delete</th>
<td id="rowheader_t1_{{i}}" mat-cell *matCellDef="let rowData; let i=index;">
<span class="icon-trash" id="{{i}}-button-role-remove" (click)="deleteRow(rowData)">
<i class="icon ion-md-trash"></i>
</span>
</td>
</ng-container>
<!--End of Delete Column-->
<!--Toggle column will be displayed only if displayedColumns has toggle-->
<ng-container matColumnDef="toggle">
<th mat-header-cell *matHeaderCellDef id="heading6">Active?</th>
<td mat-cell *matCellDef="let rowData">
<mat-slide-toggle [(ngModel)]="rowData.active" (change)="toggleUserActive(rowData)"></mat-slide-toggle>
</td>
</ng-container>
<!--End of Toggle Column-->
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
<!-- </rdp-scroll-container> -->
<div *ngIf="isPaginationRequired">
<mat-paginator [length]="totalRowsCount" #paginator [pageSizeOptions]="[5, 10, 25, 100]" [pageSize]="pageSize"
(page)="pageEvent = $event; onPaginationChange($event)"></mat-paginator>
</div>
</div>
|