From 9901096a45c9bda51438dcc91d5feb8a590df0c3 Mon Sep 17 00:00:00 2001
From: Sukanya Pandey <sukapan1@in.ibm.com>
Date: Mon, 27 Jul 2020 21:44:47 +0530
Subject: Show total and filtered number of items in a table

 -The total number of items and the filtered items will be shown in the
   EventLogs, Sensors and HardwareStatus table.

Signed-off-by: Sukanya Pandey <sukapan1@in.ibm.com>
Change-Id: I0ee6410bf675038a350a71a02ec076f9e8baf004
---
 src/components/Global/TableCellCount.vue | 35 ++++++++++++++++++++++++++++++++
 1 file changed, 35 insertions(+)
 create mode 100644 src/components/Global/TableCellCount.vue

(limited to 'src/components/Global/TableCellCount.vue')

diff --git a/src/components/Global/TableCellCount.vue b/src/components/Global/TableCellCount.vue
new file mode 100644
index 00000000..4f44ec29
--- /dev/null
+++ b/src/components/Global/TableCellCount.vue
@@ -0,0 +1,35 @@
+<template>
+  <div class="mt-2 d-flex flex-column justify-content-end">
+    <p v-if="!filterActive">
+      {{ $t('global.table.items', { count: totalNumberOfCells }) }}
+    </p>
+    <p v-else>
+      {{
+        $t('global.table.selectedItems', {
+          count: totalNumberOfCells,
+          filterCount: filteredItemsCount
+        })
+      }}
+    </p>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    filteredItemsCount: {
+      type: Number,
+      required: true
+    },
+    totalNumberOfCells: {
+      type: Number,
+      required: true
+    }
+  },
+  computed: {
+    filterActive() {
+      return this.filteredItemsCount !== this.totalNumberOfCells;
+    }
+  }
+};
+</script>
-- 
cgit v1.2.3