From: Kiefer Chang <kiefer.chang@suse.com>
Date: Fri, 31 May 2019 07:28:25 +0000 (+0800)
Subject: mgr/dashboard: fix MDS charts are stacked in Filesystems page
X-Git-Tag: v15.1.0~2313^2
X-Git-Url: http://git-server-git.apps.pok.os.sepia.ceph.com/?a=commitdiff_plain;h=a3e76ac5f5cf56f830fd2ae9d2e2ac4585195fc2;p=ceph.git

mgr/dashboard: fix MDS charts are stacked in Filesystems page

Also include some UI enhancements:
- Fix MDS chart container is not aligned to other components.
- Show header on client table.

Fixes: https://tracker.ceph.com/issues/37579

Signed-off-by: Kiefer Chang <kiefer.chang@suse.com>
---

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-chart/cephfs-chart.component.scss b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-chart/cephfs-chart.component.scss
index 62a023b9aaf4..81457a147089 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-chart/cephfs-chart.component.scss
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-chart/cephfs-chart.component.scss
@@ -1,6 +1,8 @@
 @import '../../../../styles/chart-tooltip.scss';
 
 .chart-container {
+  position: relative;
   height: 500px;
   width: 100%;
+  margin-bottom: 20px;
 }
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-chart/cephfs-chart.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-chart/cephfs-chart.component.ts
index 1dd411677a75..7c5054e3c84e 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-chart/cephfs-chart.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-chart/cephfs-chart.component.ts
@@ -71,6 +71,10 @@ export class CephfsChartComponent implements OnChanges, OnInit {
         }
       ],
       options: {
+        title: {
+          text: this.mdsCounter.name,
+          display: true
+        },
         responsive: true,
         maintainAspectRatio: false,
         legend: {
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-clients/cephfs-clients.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-clients/cephfs-clients.component.html
index ae2e2160b197..8b84e618f5b2 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-clients/cephfs-clients.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-clients/cephfs-clients.component.html
@@ -2,6 +2,5 @@
 
 <cd-table [data]="clients.data"
           [columns]="clients.columns"
-          (fetchData)="refresh()"
-          [header]="false">
+          (fetchData)="refresh()">
 </cd-table>
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-detail/cephfs-detail.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-detail/cephfs-detail.component.html
index 81ae6060849b..73a385bee6a0 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-detail/cephfs-detail.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-detail/cephfs-detail.component.html
@@ -25,9 +25,10 @@
       </div>
     </div>
 
+    <legend i18n>MDS performance counters</legend>
     <div class="row"
          *ngFor="let mdsCounter of objectValues(mdsCounters); trackBy: trackByFn">
-      <div class="cold-md-12">
+      <div class="col-md-12">
         <cd-cephfs-chart [mdsCounter]="mdsCounter"></cd-cephfs-chart>
       </div>
     </div>