Add ability to view all the dumps

The story is integration of these two API responses
for their respective dumps:

1.Resource and Hostboot dumps:
redfish/v1/Systems/system/LogServices/Dump/Entries
2.BMC Dumps: /redfish/v1/Managers/bmc/LogServices/Dump/Entries

Signed-off-by: Sukanya Pandey <sukapan1@in.ibm.com>
Change-Id: I24ded733e682d21904e92e2e8be1951e46d33b09

2 files changed, 54 insertions, 27 deletions

diff --git a/src/views/Logs/Dumps/Dumps.vue b/src/views/Logs/Dumps/Dumps.vue
index a6dc10f5..179a503e 100644
--- a/src/views/Logs/Dumps/Dumps.vue
+++ b/src/views/Logs/Dumps/Dumps.vue
@@ -20,8 +20,8 @@
               />
               <div class="ml-sm-4">
                 <table-cell-count
-                  :filtered-items-count="filteredItemCount"
-                  :total-number-of-cells="tableItems.length"
+                  :filtered-items-count="filteredRows"
+                  :total-number-of-cells="allDumps.length"
                 ></table-cell-count>
               </div>
             </b-col>
@@ -29,6 +29,14 @@
               <table-date-filter @change="onChangeDateTimeFilter" />
             </b-col>
           </b-row>
+          <b-row>
+            <b-col class="text-right">
+              <table-filter
+                :filters="tableFilters"
+                @filter-change="onFilterChange"
+              />
+            </b-col>
+          </b-row>
           <table-toolbar
             :selected-items-count="selectedRows.length"
             :actions="batchActions"
@@ -47,12 +55,12 @@
             responsive="md"
             sort-by="dateTime"
             :fields="fields"
-            :items="filteredTableItems"
+            :items="filteredDumps"
             :empty-text="$t('global.table.emptyMessage')"
             :empty-filtered-text="$t('global.table.emptySearchMessage')"
             :filter="searchFilter"
-            @filtered="onChangeSearchFilter"
-            @row-selected="onRowSelected($event, filteredTableItems.length)"
+            @filtered="onFiltered"
+            @row-selected="onRowSelected($event, filteredDumps.length)"
           >
             <!-- Checkbox column -->
             <template #head(checkbox)>
@@ -126,7 +134,7 @@
           first-number
           last-number
           :per-page="perPage"
-          :total-rows="getTotalRowCount(filteredItemCount)"
+          :total-rows="getTotalRowCount()"
           aria-controls="table-dump-entries"
         />
       </b-col>
@@ -137,7 +145,6 @@
 <script>
 import IconDelete from '@carbon/icons-vue/es/trash-can/20';
 import IconDownload from '@carbon/icons-vue/es/download/20';
-
 import DumpsForm from './DumpsForm';
 import PageSection from '@/components/Global/PageSection';
 import PageTitle from '@/components/Global/PageTitle';
@@ -146,7 +153,6 @@ import TableCellCount from '@/components/Global/TableCellCount';
 import TableDateFilter from '@/components/Global/TableDateFilter';
 import TableRowAction from '@/components/Global/TableRowAction';
 import TableToolbar from '@/components/Global/TableToolbar';
-
 import BVTableSelectableMixin, {
   selectedRows,
   tableHeaderCheckboxModel,
@@ -162,6 +168,7 @@ import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
 import SearchFilterMixin, {
   searchFilter,
 } from '@/components/Mixins/SearchFilterMixin';
+import TableFilter from '@/components/Global/TableFilter';
 import TableFilterMixin from '@/components/Mixins/TableFilterMixin';
 
 export default {
@@ -176,6 +183,7 @@ export default {
     TableDateFilter,
     TableRowAction,
     TableToolbar,
+    TableFilter,
   },
   mixins: [
     BVTableSelectableMixin,
@@ -231,24 +239,39 @@ export default {
           label: this.$t('global.action.delete'),
         },
       ],
+      tableFilters: [
+        {
+          key: 'dumpType',
+          label: this.$t('pageDumps.table.dumpType'),
+          values: [
+            'BMC Dump Entry',
+            'Hostboot Dump Entry',
+            'Resource Dump Entry',
+            'System Dump Entry',
+          ],
+        },
+      ],
+      activeFilters: [],
       currentPage: currentPage,
       filterEndDate: null,
       filterStartDate: null,
       itemsPerPageOptions: itemsPerPageOptions,
       perPage: perPage,
       searchFilter,
-      searchFilteredItemsCount: 0,
+      searchTotalFilteredRows: 0,
       selectedRows,
       tableHeaderCheckboxIndeterminate,
       tableHeaderCheckboxModel,
     };
   },
   computed: {
-    dumps() {
-      return this.$store.getters['dumps/allDumps'];
+    filteredRows() {
+      return this.searchFilter
+        ? this.searchTotalFilteredRows
+        : this.filteredDumps.length;
     },
-    tableItems() {
-      return this.dumps.map((item) => {
+    allDumps() {
+      return this.$store.getters['dumps/allDumps'].map((item) => {
         return {
           ...item,
           actions: [
@@ -264,32 +287,34 @@ export default {
         };
       });
     },
-    filteredTableItems() {
+    filteredDumpsByDate() {
       return this.getFilteredTableDataByDate(
-        this.tableItems,
+        this.allDumps,
         this.filterStartDate,
         this.filterEndDate,
         'dateTime'
       );
     },
-    filteredItemCount() {
-      return this.searchFilter
-        ? this.searchFilteredItemsCount
-        : this.filteredTableItems.length;
+    filteredDumps() {
+      return this.getFilteredTableData(
+        this.filteredDumpsByDate,
+        this.activeFilters
+      );
     },
   },
   created() {
     this.startLoader();
-    this.$store
-      .dispatch('dumps/getBmcDumpEntries')
-      .finally(() => this.endLoader());
+    this.$store.dispatch('dumps/getAllDumps').finally(() => this.endLoader());
   },
   methods: {
     convertBytesToMegabytes(bytes) {
       return parseFloat((bytes / 1000000).toFixed(3));
     },
-    onChangeSearchFilter(items) {
-      this.searchFilteredItemsCount = items.length;
+    onFilterChange({ activeFilters }) {
+      this.activeFilters = activeFilters;
+    },
+    onFiltered(filteredItems) {
+      this.searchTotalFilteredRows = filteredItems.length;
     },
     onChangeDateTimeFilter({ fromDate, toDate }) {
       this.filterStartDate = fromDate;
diff --git a/src/views/Logs/Dumps/DumpsForm.vue b/src/views/Logs/Dumps/DumpsForm.vue
index 02ec1864..07f4a060 100644
--- a/src/views/Logs/Dumps/DumpsForm.vue
+++ b/src/views/Logs/Dumps/DumpsForm.vue
@@ -34,10 +34,8 @@
 
 <script>
 import { required } from 'vuelidate/lib/validators';
-
 import ModalConfirmation from './DumpsModalConfirmation';
 import Alert from '@/components/Global/Alert';
-
 import BVToastMixin from '@/components/Mixins/BVToastMixin';
 import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js';
 
@@ -62,9 +60,13 @@ export default {
     handleSubmit() {
       this.$v.$touch();
       if (this.$v.$invalid) return;
+
+      // System dump initiation
       if (this.selectedDumpType === 'system') {
         this.showConfirmationModal();
-      } else {
+      }
+      // BMC dump initiation
+      else if (this.selectedDumpType === 'bmc') {
         this.$store
           .dispatch('dumps/createBmcDump')
           .then(() =>