From: Tatjana Dehler <tdehler@suse.com>
Date: Fri, 6 Jul 2018 12:27:12 +0000 (+0200)
Subject: mgr/dashboard: add placeholder for filters to datatable
X-Git-Tag: v14.0.1~99^2~4
X-Git-Url: http://git.apps.os.sepia.ceph.com/?a=commitdiff_plain;h=a8745481218295ca37109437ba96d427b92b1217;p=ceph-ci.git

mgr/dashboard: add placeholder for filters to datatable

As (e.g.) the configuration option documentation has dropdown menus
with pre-defined filters we need a placeholder for them in the
datatable.

Signed-off-by: Tatjana Dehler <tdehler@suse.com>
---

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html
index d9b68758d06..b3840744f0d 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html
@@ -3,7 +3,7 @@
   Failed to load data.
 </cd-error-panel>
 <div class="dataTables_wrapper">
-  <div class="dataTables_header clearfix"
+  <div class="dataTables_header clearfix form-inline"
        *ngIf="toolHeader">
     <!-- actions -->
     <div class="oadatatableactions">
@@ -11,6 +11,10 @@
     </div>
     <!-- end actions -->
 
+    <!-- filters -->
+    <ng-content select=".table-filters"></ng-content>
+    <!-- end filters -->
+
     <!-- search -->
     <div class="input-group">
       <span class="input-group-addon">
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.scss b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.scss
index 05584f5bfe7..6ee3997ebf8 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.scss
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.scss
@@ -58,6 +58,14 @@
   .oadatatableactions {
     display: inline-block;
   }
+  ::ng-deep .table-filters {
+    float: right;
+    border-left: 1px solid $color-table-seperator-border;
+    padding-left: 8px;
+  }
+  ::ng-deep .table-filters label {
+    margin-right: 4px;
+  }
   .form-group {
     padding-left: 8px;
   }
@@ -65,6 +73,7 @@
     float: right;
     border-left: 1px solid $color-table-input-border;
     padding-left: 8px;
+    padding-right: 8px;
     width: 40%;
     max-width: 250px;
     .form-control {