1 files changed, 57 insertions, 0 deletions
diff --git a/ecomp-sdk/portalsdk-tag-library/projects/portalsdk-tag-lib/src/lib/rdp/rdp-data-table/rdp-data-table.component.html b/ecomp-sdk/portalsdk-tag-library/projects/portalsdk-tag-lib/src/lib/rdp/rdp-data-table/rdp-data-table.component.html
new file mode 100644
index 00000000..a87a7b70
--- /dev/null
+++ b/ecomp-sdk/portalsdk-tag-library/projects/portalsdk-tag-lib/src/lib/rdp/rdp-data-table/rdp-data-table.component.html
@@ -0,0 +1,57 @@
+<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>&nbsp;Add
+    </button>
+  </div>
+  <!-- <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>
+\ No newline at end of file