diff --git a/package-lock.json b/package-lock.json index b050e297..2a514d75 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12884,6 +12884,11 @@ "integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==", "dev": true }, + "vue-virtual-scroll-list": { + "version": "2.2.9", + "resolved": "https://registry.npmjs.org/vue-virtual-scroll-list/-/vue-virtual-scroll-list-2.2.9.tgz", + "integrity": "sha512-dPlvzIUUtxkaVBVea2/73sWsiTrsIpjWXd+7FWJPUEL+ME1i6LuwWNiMMqu2WVad82ONWeoXSiM5NMSDpMxYGA==" + }, "vue-virtual-scroller": { "version": "1.0.10", "resolved": "https://registry.npmjs.org/vue-virtual-scroller/-/vue-virtual-scroller-1.0.10.tgz", diff --git a/package.json b/package.json index 0a0e625e..9f0395d5 100644 --- a/package.json +++ b/package.json @@ -41,6 +41,7 @@ "spectre.css": "^0.5.8", "vue-click-outside": "^1.1.0", "vue-i18n": "^8.18.2", + "vue-virtual-scroll-list": "^2.2.9", "vue-virtual-scroller": "^1.0.10", "vuedraggable": "^2.23.2", "vuex": "^3.4.0", diff --git a/src/renderer/components/BaseVirtualScroll.vue b/src/renderer/components/BaseVirtualScroll.vue new file mode 100644 index 00000000..9a0de319 --- /dev/null +++ b/src/renderer/components/BaseVirtualScroll.vue @@ -0,0 +1,77 @@ + + + diff --git a/src/renderer/components/WorkspaceQueryRow.vue b/src/renderer/components/WorkspaceQueryRow.vue new file mode 100644 index 00000000..4b71b246 --- /dev/null +++ b/src/renderer/components/WorkspaceQueryRow.vue @@ -0,0 +1,43 @@ + + + + + diff --git a/src/renderer/components/WorkspaceQueryTab.vue b/src/renderer/components/WorkspaceQueryTab.vue index 8745026e..b88c768d 100644 --- a/src/renderer/components/WorkspaceQueryTab.vue +++ b/src/renderer/components/WorkspaceQueryTab.vue @@ -22,7 +22,7 @@ -
+
@@ -58,12 +58,6 @@ export default { return this.getWorkspace(this.connection.uid); } }, - mounted () { - window.addEventListener('resize', this.resizeResults); - }, - destroyed () { - window.removeEventListener('resize', this.resizeResults); - }, methods: { ...mapActions({ addNotification: 'notifications/addNotification' @@ -72,7 +66,6 @@ export default { if (!this.query) return; this.isQuering = true; this.results = {}; - this.resizeResults(); const params = { uid: this.connection.uid, @@ -92,24 +85,6 @@ export default { } this.isQuering = false; - }, - resizeResults (e) { - const el = this.$refs.resultTable; - const footer = document.getElementById('footer'); - - if (el) { - const size = window.innerHeight - el.getBoundingClientRect().top - footer.offsetHeight; - el.style.height = size + 'px'; - } - }, - fieldType (col) { - let type = typeof col; - if (type === 'object') - if (col instanceof Date) type = 'date'; - if (col instanceof Uint8Array) type = 'blob'; - if (col === null) type = 'null'; - - return `type-${type}`; } } }; diff --git a/src/renderer/components/WorkspaceQueryTable.vue b/src/renderer/components/WorkspaceQueryTable.vue index a5c2c5d7..103cf9a3 100644 --- a/src/renderer/components/WorkspaceQueryTable.vue +++ b/src/renderer/components/WorkspaceQueryTable.vue @@ -1,42 +1,80 @@ diff --git a/src/renderer/main.js b/src/renderer/main.js index 25ea026c..277bb42c 100644 --- a/src/renderer/main.js +++ b/src/renderer/main.js @@ -2,6 +2,7 @@ import Vue from 'vue'; +import 'vue-virtual-scroller/dist/vue-virtual-scroller.css'; import 'material-design-icons/iconfont/material-icons.css'; import '@/scss/main.scss';