diff --git a/src/views/MyQueries.vue b/src/views/MyQueries.vue index 66d7022..de8d7b9 100644 --- a/src/views/MyQueries.vue +++ b/src/views/MyQueries.vue @@ -2,17 +2,18 @@
You don't have saved queries so far. - Create + Create the one from scratch or - from a file. + import from a file.
-
@@ -117,21 +122,8 @@ Delete {{ deleteGroup ? 'queries' : 'query' }}
-
- Are you sure you want to delete - {{ deleteGroup - ? `${selectedNotPredefinedCount} ${selectedNotPredefinedCount > 1 ? 'queries' : 'query'}` - : `"${queries[currentQueryIndex].name}"` - }}? +
+ {{ deleteDialogMsg }}
Note: Predefined queries you've selected won't be deleted @@ -174,7 +166,7 @@ export default { queries: [], filter: null, newName: null, - currentQueryId: null, + processedQueryId: null, errorMsg: null, selectedQueriesIds: new Set(), selectedQueriesCount: 0, @@ -207,8 +199,25 @@ export default { allQueries () { return this.predefinedQueries.concat(this.queries) }, - currentQueryIndex () { - return this.queries.findIndex(query => query.id === this.currentQueryId) + processedQueryIndex () { + return this.queries.findIndex(query => query.id === this.processedQueryId) + }, + deleteDialogMsg () { + if (!this.deleteGroup && ( + this.processedQueryIndex === null || + this.processedQueryIndex < 0 || + this.processedQueryIndex > this.queries.length + )) { + return '' + } + + const deleteItem = this.deleteGroup + ? `${this.selectedNotPredefinedCount} ${this.selectedNotPredefinedCount > 1 + ? 'queries' + : 'query'}` + : `"${this.queries[this.processedQueryIndex].name}"` + + return `Are you sure you want to delete ${deleteItem}?` } }, created () { @@ -260,10 +269,6 @@ export default { const freeSpace = this.$refs['my-queries-content'].offsetHeight - 200 this.maxTableHeight = freeSpace - (freeSpace % 40) + 1 }, - create () { - this.$root.$emit('createNewQuery') - this.$router.push('/editor') - }, openQuery (index) { const tab = this.showedQueries[index] this.$store.dispatch('addTab', tab).then(id => { @@ -273,8 +278,8 @@ export default { }, showRenameDialog (id) { this.errorMsg = null - this.currentQueryId = id - this.newName = this.queries[this.currentQueryIndex].name + this.processedQueryId = id + this.newName = this.queries[this.processedQueryIndex].name this.$modal.show('rename') }, renameQuery () { @@ -282,20 +287,20 @@ export default { this.errorMsg = 'Query name can\'t be empty' return } - const currentQuery = this.queries[this.currentQueryIndex] - currentQuery.name = this.newName - this.$set(this.queries, this.currentQueryIndex, currentQuery) + const processedQuery = this.queries[this.processedQueryIndex] + processedQuery.name = this.newName + this.$set(this.queries, this.processedQueryIndex, processedQuery) // update queries in local storage storedQueries.updateStorage(this.queries) // update tab, if renamed query is opened - const tabIndex = this.findTabIndex(currentQuery.id) + const tabIndex = this.findTabIndex(processedQuery.id) if (tabIndex >= 0) { this.$store.commit('updateTab', { index: tabIndex, name: this.newName, - id: currentQuery.id + id: processedQuery.id }) } // hide dialog @@ -310,27 +315,27 @@ export default { this.queries.push(newQuery) storedQueries.updateStorage(this.queries) }, - showDeleteDialog (id) { - this.deleteGroup = typeof id !== 'string' + showDeleteDialog (idsSet) { + this.deleteGroup = idsSet.size > 1 if (!this.deleteGroup) { - this.currentQueryId = id + this.processedQueryId = idsSet.values().next().value } this.$modal.show('delete') }, deleteQuery () { this.$modal.hide('delete') if (!this.deleteGroup) { - this.queries.splice(this.currentQueryIndex, 1) + this.queries.splice(this.processedQueryIndex, 1) // Close deleted query tab if it was opened - const tabIndex = this.findTabIndex(this.currentQueryId) + const tabIndex = this.findTabIndex(this.processedQueryId) if (tabIndex >= 0) { this.$store.commit('deleteTab', tabIndex) } // Clear checkboxes - if (this.selectedQueriesIds.has(this.currentQueryId)) { - this.selectedQueriesIds.delete(this.currentQueryId) + if (this.selectedQueriesIds.has(this.processedQueryId)) { + this.selectedQueriesIds.delete(this.processedQueryId) } } else { this.queries = this.selectAll @@ -363,7 +368,7 @@ export default { ? this.allQueries : this.allQueries.filter(query => this.selectedQueriesIds.has(query.id)) - this.exportToFile(queryList, 'My sqlitevis queries.json') + this.exportToFile(queryList, 'My sqliteviz queries.json') }, importQueries () { storedQueries.importQueries() @@ -525,15 +530,6 @@ button.toolbar { margin-right: 16px; } -button label { - display: block; - line-height: 36px; -} - -button label:hover { - cursor: pointer; -} - .badge { display: none; background-color: var(--color-gray-light-4); @@ -545,7 +541,7 @@ button label:hover { margin-left: 12px; } -tbody tr.predefined:hover .badge { +tbody tr:hover .badge { display: block; } #note {