mgr/dashboard: Add a 'clear filter' button to configuration page

Fixes:http://tracker.ceph.com/issues/36173

Signed-off-by: familyuu <guodan1@lenovo.com>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration.component.html
index c6fce9f31325f405b8f0c0df3371a1a7645b3dd4..36d280aebb0ec7a2953481ee907a4615024741c0 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration.component.html
@@ -18,6 +18,12 @@
         <option *ngFor="let opt of filter.options">{{ opt }}</option>
       </select>
     </div>
+    <a class="fa-stack" 
+       title="Reset filters" 
+       (click)="resetFilter()">
+      <i class="fa fa-filter fa-stack-2x"></i>
+      <i class="fa fa-times fa-stack-1x" style="margin-left: 8px; margin-top: 5px;"></i>
+    </a>
   </div>
   <cd-configuration-details cdTableDetail
                             [selection]="selection">

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration.component.ts
index 3f33a43b4e664b2007f166bbfb7b719283e74225..9c056bcb602f418521170fe2d50c8a6b043f1955 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration.component.ts
@@ -25,6 +25,7 @@ export class ConfigurationComponent implements OnInit {
     {
       label: this.i18n('Level'),
       prop: 'level',
+      initValue: 'basic',
       value: 'basic',
       options: ['basic', 'advanced', 'dev'],
       applyFilter: (row, value) => {
@@ -42,6 +43,7 @@ export class ConfigurationComponent implements OnInit {
     {
       label: this.i18n('Service'),
       prop: 'services',
+      initValue: 'any',
       value: 'any',
       options: ['any', 'mon', 'mgr', 'osd', 'mds', 'common', 'mds_client', 'rgw'],
       applyFilter: (row, value) => {
@@ -55,6 +57,7 @@ export class ConfigurationComponent implements OnInit {
     {
       label: this.i18n('Source'),
       prop: 'source',
+      initValue: 'any',
       value: 'any',
       options: ['any', 'mon'],
       applyFilter: (row, value) => {
@@ -125,4 +128,11 @@ export class ConfigurationComponent implements OnInit {
   updateFilter() {
     this.data = [...this.data];
   }
+
+  resetFilter() {
+    this.filters.forEach((item) => {
+      item.value = item.initValue;
+    });
+    this.data = [...this.data];
+  }
 }