From b1a7191eb287fe92c82d3346f2a9587e41c62d2b Mon Sep 17 00:00:00 2001
From: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Date: Wed, 29 Apr 2020 10:52:39 -0700
Subject: Add export functionality to Sensors page

- Create TableToolbarExport component to be used as a slot
  in TableToolbar
- Allows selected table items to be exported

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I929347e046af8a5d5188e4c4fd9fc874e067cce5
---
 src/components/Global/TableToolbar.vue       |  3 ++-
 src/components/Global/TableToolbarExport.vue | 35 ++++++++++++++++++++++++++++
 2 files changed, 37 insertions(+), 1 deletion(-)
 create mode 100644 src/components/Global/TableToolbarExport.vue

(limited to 'src/components')

diff --git a/src/components/Global/TableToolbar.vue b/src/components/Global/TableToolbar.vue
index 041a9c18..331f0076 100644
--- a/src/components/Global/TableToolbar.vue
+++ b/src/components/Global/TableToolbar.vue
@@ -15,6 +15,7 @@
           >
             {{ action.label }}
           </b-button>
+          <slot name="export"></slot>
           <b-button
             variant="primary"
             class="d-block"
@@ -38,7 +39,7 @@ export default {
     },
     actions: {
       type: Array,
-      required: true,
+      default: () => [],
       validator: prop => {
         return prop.every(action => {
           return (
diff --git a/src/components/Global/TableToolbarExport.vue b/src/components/Global/TableToolbarExport.vue
new file mode 100644
index 00000000..ed1d980f
--- /dev/null
+++ b/src/components/Global/TableToolbarExport.vue
@@ -0,0 +1,35 @@
+<template>
+  <b-link
+    class="btn btn-primary d-block align-self-center"
+    :download="download"
+    :href="href"
+  >
+    {{ $t('global.action.export') }}
+  </b-link>
+</template>
+
+<script>
+export default {
+  props: {
+    data: {
+      type: Array,
+      default: () => []
+    },
+    fileName: {
+      type: String,
+      default: 'data'
+    }
+  },
+  computed: {
+    dataForExport() {
+      return JSON.stringify(this.data);
+    },
+    download() {
+      return `${this.fileName}.json`;
+    },
+    href() {
+      return `data:text/json;charset=utf-8,${this.dataForExport}`;
+    }
+  }
+};
+</script>
-- 
cgit v1.2.3