feat(UI): close temp data tabs

This commit is contained in:
Fabio Di Stasio 2021-07-13 16:53:47 +02:00
parent 15ff211a41
commit 88c4cdc8e2
6 changed files with 65 additions and 17 deletions

View File

@ -76,7 +76,7 @@
class="tab-item"
:class="{'active': selectedTab === tab.uid}"
@click="selectTab({uid: workspace.uid, tab: tab.uid})"
@mouseup.middle="closeTab(tab.uid)"
@mouseup.middle="closeTab(tab)"
>
<a v-if="tab.type === 'query'" class="tab-link">
<i class="mdi mdi-18px mdi-code-tags mr-1" />
@ -86,13 +86,21 @@
v-if="queryTabs.length > 1"
class="btn btn-clear"
:title="$t('word.close')"
@click.stop="closeTab(tab.uid)"
@click.stop="closeTab(tab)"
/>
</span>
</a>
<a v-if="tab.type === 'temp-data'" class="tab-link text-italic">
<a v-if="tab.type === 'temp-data'" class="tab-link">
<i class="mdi mdi-18px mr-1" :class="workspace.breadcrumbs.table ? 'mdi-table' : 'mdi-table-eye'" />
<span :title="`${$t('word.data').toUpperCase()}: ${tab.table}`">{{ tab.table }}</span>
<span :title="`${$t('word.data').toUpperCase()}: ${tab.table}`">
<span class=" text-italic">{{ tab.table }}</span>
<span
class="btn btn-clear"
:title="$t('word.close')"
@click.stop="closeTab(tab)"
/>
</span>
</a>
</li>
<li class="tab-item">
@ -308,9 +316,12 @@ export default {
this.hasWheelEvent = true;
}
},
closeTab (tUid) {
if (this.queryTabs.length === 1) return;
this.removeTab({ uid: this.connection.uid, tab: tUid });
closeTab (tab) {
if (tab.type === 'query' && this.queryTabs.length === 1) return;
this.removeTab({ uid: this.connection.uid, tab: tab.uid });
if (this.selectedTab === tab.uid && this.workspace.tabs.length)
this.selectTab({ uid: this.workspace.uid, tab: this.workspace.tabs[0].uid });
},
showProcessesModal () {
this.isProcessesModal = true;

View File

@ -282,7 +282,6 @@ export default {
},
selectTable ({ schema, table }) {
this.setBreadcrumbs({ schema, [table.type]: table.name });
// TODO: open only if not already opened
this.newTab({ uid: this.connection.uid, table: table.name, schema: this.database.name, type: 'temp-data' });
},
showSchemaContext (event, schema) {

View File

@ -138,9 +138,6 @@ export default {
});
if (status === 'success') {
if (this.selectedTable.name === this.workspace.breadcrumbs.table)
this.changeBreadcrumbs({ table: null });
this.closeContext();
this.$emit('reload');
}

View File

@ -185,6 +185,12 @@ export default {
}
},
watch: {
schema () {
if (this.isSelected) {
this.getFieldsData();
this.lastTable = this.table;
}
},
table () {
if (this.isSelected) {
this.getFieldsData();

View File

@ -236,6 +236,15 @@ export default {
}
},
watch: {
schema () {
if (this.isSelected) {
this.page = 1;
this.sortParams = {};
this.getTableData();
this.lastTable = this.table;
this.$refs.queryTable.resetSort();
}
},
table () {
if (this.isSelected) {
this.page = 1;

View File

@ -217,6 +217,23 @@ export default {
return workspace;
});
},
REPLACE_TAB (state, { uid, tab: tUid, type, schema, table }) {
state.workspaces = state.workspaces.map(workspace => {
if (workspace.uid === uid) {
return {
...workspace,
tabs: workspace.tabs.map(tab => {
if (tab.uid === tUid)
return { ...tab, type, schema, table };
return tab;
})
};
}
else
return workspace;
});
},
SELECT_TAB (state, { uid, tab }) {
state.workspaces = state.workspaces.map(workspace => workspace.uid === uid ? { ...workspace, selected_tab: tab } : workspace);
},
@ -475,18 +492,27 @@ export default {
commit('SET_SEARCH_TERM', { uid: getters.getSelected, term });
},
newTab ({ state, commit }, { uid, content, type, autorun, schema, table }) {
let tabUid;
if (type === 'temp-data') {
const workspaceTabs = state.workspaces.find(workspace => workspace.uid === uid);
const tempTabs = workspaceTabs ? workspaceTabs.tabs.filter(tab => tab.type === 'temp-data') : false;
if (tempTabs) {
for (const tab of tempTabs)
commit('REMOVE_TAB', { uid, tab: tab.uid });// TODO: replace instead remove
if (tempTabs && tempTabs.length) { // id temp table already opened
for (const tab of tempTabs) {
commit('REPLACE_TAB', { uid, tab: tab.uid, type, schema, table });
tabUid = tab.uid;
}
}
else {
tabUid = uidGen('T');
commit('NEW_TAB', { uid, tab: tabUid, content, type, autorun, schema, table });
}
}
else {
tabUid = uidGen('T');
commit('NEW_TAB', { uid, tab: tabUid, content, type, autorun, schema, table });
}
const tab = uidGen('T');
commit('NEW_TAB', { uid, tab, content, type, autorun, schema, table });
commit('SELECT_TAB', { uid, tab });
commit('SELECT_TAB', { uid, tab: tabUid });
},
removeTab ({ commit }, payload) {
commit('REMOVE_TAB', payload);