feat: export data tables to json or csv file

antares-sql · Jan 8, 2021 · 0cbea9d · 0cbea9d
1 parent e351c90
commit 0cbea9d
Show file tree

Hide file tree

Showing 6 changed files with 86 additions and 18 deletions.
diff --git a/src/renderer/components/ModalSettings.vue b/src/renderer/components/ModalSettings.vue
@@ -206,7 +206,7 @@
                      <h4>{{ appName }}</h4>
                      <p>
                         {{ $t('word.version') }}: {{ appVersion }}<br>
-                        <a class="c-hand" @click="openOutside('https://github.com/Fabio286/antares')">GitHub</a><br>
+                        <a class="c-hand" @click="openOutside('https://github.com/Fabio286/antares')">GitHub</a> | <a class="c-hand" @click="openOutside('https://github.com/Fabio286/antares/blob/master/CHANGELOG.md')">CHANGELOG</a><br>
                         <small>{{ $t('word.author') }}: <a class="c-hand" @click="openOutside('https://github.com/Fabio286')">Fabio Di Stasio</a></small><br>
                         <small>{{ $t('message.madeWithJS') }}</small>
                      </p>

diff --git a/src/renderer/components/WorkspaceQueryTable.vue b/src/renderer/components/WorkspaceQueryTable.vue
@@ -80,6 +80,7 @@
 
 <script>
 import { uidGen } from 'common/libs/uidGen';
+import arrayToFile from '../libs/arrayToFile';
 import { LONG_TEXT, BLOB } from 'common/fieldTypes';
 import BaseVirtualScroll from '@/components/BaseVirtualScroll';
 import WorkspaceQueryTableRow from '@/components/WorkspaceQueryTableRow';
@@ -354,6 +355,15 @@ export default {
       },
       selectResultset (index) {
          this.resultsetIndex = index;
+      },
+      downloadTable (format, filename) {
+         if (!this.sortedResults) return;
+
+         arrayToFile({
+            type: format,
+            content: this.sortedResults,
+            filename
+         });
       }
    }
 };

diff --git a/src/renderer/components/WorkspaceTableTab.vue b/src/renderer/components/WorkspaceTableTab.vue
@@ -32,13 +32,30 @@
                      </div>
                   </div>
                </div>
-               <button
-                  class="btn btn-dark btn-sm"
-                  @click="showAddModal"
-               >
+
+               <button class="btn btn-dark btn-sm" @click="showAddModal">
                   <span>{{ $t('word.add') }}</span>
                   <i class="mdi mdi-24px mdi-playlist-plus ml-1" />
                </button>
+               <div class="dropdown export-dropdown">
+                  <button
+                     :disabled="isQuering"
+                     class="btn btn-dark btn-sm dropdown-toggle mr-0 pr-0"
+                     tabindex="0"
+                  >
+                     <span>{{ $t('word.export') }}</span>
+                     <i class="mdi mdi-24px mdi-file-export ml-1" />
+                     <i class="mdi mdi-24px mdi-menu-down" />
+                  </button>
+                  <ul class="menu text-left">
+                     <li class="menu-item">
+                        <a class="c-hand" @click="downloadTable('json')">JSON</a>
+                     </li>
+                     <li class="menu-item">
+                        <a class="c-hand" @click="downloadTable('csv')">CSV</a>
+                     </li>
+                  </ul>
+               </div>
             </div>
             <div class="workspace-query-info">
                <div v-if="results.length && results[0].rows">
@@ -222,7 +239,21 @@ export default {
                   this.reloadTable();
             }, this.autorefreshTimer * 1000);
          }
+      },
+      downloadTable (format) {
+         this.$refs.queryTable.downloadTable(format, this.table);
       }
    }
 };
 </script>
+<style lang="scss" scoped>
+.export-dropdown {
+  .menu {
+    min-width: 100%;
+
+    .menu-item a:hover {
+      background: $bg-color-gray;
+    }
+  }
+}
+</style>
diff --git a/src/renderer/i18n/en-US.js b/src/renderer/i18n/en-US.js
@@ -78,7 +78,8 @@ module.exports = {
       parameters: 'Parameters',
       function: 'Function | Functions',
       deterministic: 'Deterministic',
-      context: 'Context'
+      context: 'Context',
+      export: 'Export'
    },
    message: {
       appWelcome: 'Welcome to Antares SQL Client!',

diff --git a/src/renderer/libs/arrayToFile.js b/src/renderer/libs/arrayToFile.js
@@ -0,0 +1,37 @@
+const arrayToFile = args => {
+   let mime;
+   let content;
+
+   switch (args.type) {
+      case 'csv': {
+         mime = 'text/csv';
+         const csv = [];
+
+         if (args.content.length)
+            csv.push(Object.keys(args.content[0]).join(';'));
+
+         for (const row of args.content)
+            csv.push(Object.values(row).map(col => typeof col === 'string' ? `"${col}"` : col).join(';'));
+
+         content = csv.join('\n');
+         break;
+      }
+      case 'json':
+         mime = 'application/json';
+         content = JSON.stringify(args.content, null, 3);
+         break;
+
+      default:
+         break;
+   }
+
+   const file = new Blob([content], { mime });
+   const downloadLink = document.createElement('a');
+   downloadLink.download = `${args.filename}.${args.type}`;
+   downloadLink.href = window.URL.createObjectURL(file);
+   downloadLink.style.display = 'none';
+   document.body.appendChild(downloadLink);
+   downloadLink.click();
+};
+
+export default arrayToFile;
diff --git a/src/renderer/store/modules/workspaces.store.js b/src/renderer/store/modules/workspaces.store.js
@@ -307,18 +307,7 @@ export default {
             uid,
             connected: false,
             selected_tab: 0,
-            tabs: [{
-               uid: 'data',
-               type: 'table',
-               fields: [],
-               keyUsage: []
-            },
-            {
-               uid: 'prop',
-               type: 'table',
-               fields: [],
-               keyUsage: []
-            }],
+            tabs: [],
             structure: {},
             variables: [],
             collations: [],