import ceph quincy 17.2.4

[ceph.git] / ceph / src / pybind / mgr / dashboard / frontend / src / app / shared / datatable / table / table.component.html

diff --git a/ceph/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html b/ceph/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html
index 71ba156cf3f607cb108325d0a1565a4b015a2e9c..d7dd7e5c703ffbbf4b8a69e13fe82200a351cea2 100644 (file)
--- a/ceph/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html
+++ b/ceph/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html
@@ -172,7 +172,12 @@
                  [rowClass]="getRowClass()"
                  [headerHeight]="header ? 'auto' : 0"
                  [footerHeight]="footer ? 'auto' : 0"
+                 [count]="count"
+                 [externalPaging]="serverSide"
+                 [externalSorting]="serverSide"
                  [limit]="userConfig.limit > 0 ? userConfig.limit : undefined"
+                 [offset]="userConfig.offset >= 0 ? userConfig.offset : 0"
+                 (page)="changePage($event)"
                  [loadingIndicator]="loadingIndicator"
                  [rowIdentity]="rowIdentity()"
                  [rowHeight]="'auto'">
@@ -200,17 +205,26 @@
           <span *ngIf="selectionType">
             {{ selectedCount }} <ng-container i18n="X selected">selected</ng-container> /
           </span>
-          <span *ngIf="rowCount != data?.length">
-            {{ rowCount }} <ng-container i18n="X found">found</ng-container> /
-          </span>
-          <span>
+
+          <!-- rowCount might have different semantics with or without serverSide.
+            We treat serverSide (backend-driven tables) as a specific case.
+          -->
+          <span *ngIf="!serverSide else serverSideTpl">
+            <span *ngIf="rowCount != data?.length">
+              {{ rowCount }} <ng-container i18n="X found">found</ng-container> /
+            </span>
             {{ data?.length || 0 }} <ng-container i18n="X total">total</ng-container>
           </span>
+
+          <ng-template #serverSideTpl>
+            {{ data?.length || 0 }} <ng-container i18n="X found">found</ng-container> /
+            {{ rowCount }} <ng-container i18n="X total">total</ng-container>
+          </ng-template>
         </div>
-        <datatable-pager [pagerLeftArrowIcon]="paginationClasses.pagerLeftArrow"
-                         [pagerRightArrowIcon]="paginationClasses.pagerRightArrow"
-                         [pagerPreviousIcon]="paginationClasses.pagerPrevious"
-                         [pagerNextIcon]="paginationClasses.pagerNext"
+        <datatable-pager [pagerLeftArrowIcon]="paginationClasses.pagerPrevious"
+                         [pagerRightArrowIcon]="paginationClasses.pagerNext"
+                         [pagerPreviousIcon]="paginationClasses.pagerLeftArrow"
+                         [pagerNextIcon]="paginationClasses.pagerRightArrow"
                          [page]="curPage"
                          [size]="pageSize"
                          [count]="rowCount"
@@ -311,3 +325,9 @@
      (click)="toggleExpandRow(row, isExpanded, $event)">
   </a>
 </ng-template>
+
+<ng-template #timeAgoTpl
+             let-value="value">
+  <span data-toggle="tooltip"
+        [title]="value | cdDate">{{ value | relativeDate }}</span>
+</ng-template>