feat: new data tabs

This commit is contained in:
Fabio Di Stasio 2021-07-13 19:23:02 +02:00
parent 88c4cdc8e2
commit ab382dfbcd
6 changed files with 77 additions and 20 deletions

View File

@ -29,7 +29,7 @@ export default (connections) => {
if (sortParams && sortParams.field && sortParams.dir)
query.orderBy({ [sortParams.field]: sortParams.dir.toUpperCase() });
const result = await query.run({ details: true });
const result = await query.run({ details: true, schema });
return { status: 'success', response: result };
}

View File

@ -1419,7 +1419,7 @@ export class MySQLClient extends AntaresCore {
name: field.orgName,
alias: field.name,
orgName: field.orgName,
schema: field.schema,
schema: field.schema || args.schema,
table: field.table,
tableAlias: field.table,
orgTable: field.orgTable,

View File

@ -91,7 +91,11 @@
</span>
</a>
<a v-if="tab.type === 'temp-data'" class="tab-link">
<a
v-if="tab.type === 'temp-data'"
class="tab-link"
@dblclick="openAsDataTab(tab)"
>
<i class="mdi mdi-18px mr-1" :class="workspace.breadcrumbs.table ? 'mdi-table' : 'mdi-table-eye'" />
<span :title="`${$t('word.data').toUpperCase()}: ${tab.table}`">
<span class=" text-italic">{{ tab.table }}</span>
@ -102,6 +106,18 @@
/>
</span>
</a>
<a v-if="tab.type === '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
class="btn btn-clear"
:title="$t('word.close')"
@click.stop="closeTab(tab)"
/>
</span>
</a>
</li>
<li class="tab-item">
<a
@ -164,7 +180,7 @@
:connection="connection"
/>
<WorkspaceTableTab
v-else-if="tab.type==='temp-data'"
v-else-if="['temp-data', 'data'].includes(tab.type)"
:key="tab.uid"
:connection="connection"
:is-selected="selectedTab === tab.uid"
@ -307,14 +323,11 @@ export default {
}),
addQueryTab () {
this.newTab({ uid: this.connection.uid, type: 'query' });
if (!this.hasWheelEvent) {
this.$refs.tabWrap.addEventListener('wheel', e => {
if (e.deltaY > 0) this.$refs.tabWrap.scrollLeft += 50;
else this.$refs.tabWrap.scrollLeft -= 50;
});
this.hasWheelEvent = true;
}
this.addWheelEvent();
},
openAsDataTab (tab) {
this.newTab({ uid: this.connection.uid, schema: tab.schema, table: tab.table, type: 'data' });
this.addWheelEvent();
},
closeTab (tab) {
if (tab.type === 'query' && this.queryTabs.length === 1) return;
@ -328,6 +341,15 @@ export default {
},
hideProcessesModal () {
this.isProcessesModal = false;
},
addWheelEvent () {
if (!this.hasWheelEvent) {
this.$refs.tabWrap.addEventListener('wheel', e => {
if (e.deltaY > 0) this.$refs.tabWrap.scrollLeft += 50;
else this.$refs.tabWrap.scrollLeft -= 50;
});
this.hasWheelEvent = true;
}
}
}
};

View File

@ -20,6 +20,7 @@
class="menu-item"
:class="{'text-bold': breadcrumbs.schema === database.name && [breadcrumbs.table, breadcrumbs.view].includes(table.name)}"
@click="selectTable({schema: database.name, table})"
@dblclick="openDataTab({schema: database.name, table})"
@contextmenu.prevent="showTableContext($event, table)"
>
<a class="table-name">
@ -281,8 +282,12 @@ export default {
this.changeBreadcrumbs({ schema, table: null });
},
selectTable ({ schema, table }) {
this.setBreadcrumbs({ schema, [table.type]: table.name });
this.newTab({ uid: this.connection.uid, table: table.name, schema: this.database.name, type: 'temp-data' });
this.setBreadcrumbs({ schema, [table.type]: table.name });
},
openDataTab ({ schema, table }) {
this.newTab({ uid: this.connection.uid, table: table.name, schema: this.database.name, type: 'data' });
this.setBreadcrumbs({ schema, [table.type]: table.name });
},
showSchemaContext (event, schema) {
this.selectSchema(schema);

View File

@ -187,7 +187,7 @@ export default {
},
data () {
return {
tabUid: 'data',
tabUid: 'data', // ???
isQuering: false,
isPageMenu: false,
results: [],

View File

@ -493,14 +493,44 @@ export default {
},
newTab ({ state, commit }, { uid, content, type, autorun, schema, table }) {
let tabUid;
const workspaceTabs = state.workspaces.find(workspace => workspace.uid === uid);
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 && 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;
const existentTab = workspaceTabs
? workspaceTabs.tabs.find(tab =>
tab.schema === schema &&
tab.table === table &&
['temp-data', 'data'].includes(tab.type))
: false;
if (existentTab) { // if data tab exists
tabUid = existentTab.uid;
}
else {
const tempTabs = workspaceTabs ? workspaceTabs.tabs.filter(tab => tab.type === 'temp-data') : false;
if (tempTabs && tempTabs.length) { // if 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 if (type === 'data') {
const existentTab = workspaceTabs
? workspaceTabs.tabs.find(tab =>
tab.schema === schema &&
tab.table === table &&
['temp-data', 'data'].includes(tab.type))
: false;
if (existentTab) {
commit('REPLACE_TAB', { uid, tab: existentTab.uid, type, schema, table });
tabUid = existentTab.uid;
}
else {
tabUid = uidGen('T');