fabio286/antares
1
1
Fork 0
mirror of https://github.com/Fabio286/antares.git synced 2025-06-05 21:59:22 +02:00
Code Issues Releases Wiki Activity

feat: new view setting tabs

Browse Source
This commit is contained in:
Fabio Di Stasio
2021-07-16 18:52:18 +02:00
parent ef21ea7448
commit 003c02b1fb
6 changed files with 120 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
src/renderer/components/Workspace.vue
View File

@ -64,9 +64,9 @@
class="tab-link" class="tab-link"
@dblclick="openAsDataTab(tab)" @dblclick="openAsDataTab(tab)"
> >
<i class="mdi mdi-18px mr-1" :class="tab.element === 'view' ? 'mdi-table-eye' : 'mdi-table'" /> <i class="mdi mdi-18px mr-1" :class="tab.elementType === 'view' ? 'mdi-table-eye' : 'mdi-table'" />
<span :title="`${$t('word.data').toUpperCase()}: ${tab.table}`"> <span :title="`${$t('word.data').toUpperCase()}: ${tab.elementType}`">
<span class=" text-italic">{{ tab.table }}</span> <span class=" text-italic">{{ tab.elementName }}</span>
<span <span
class="btn btn-clear" class="btn btn-clear"
:title="$t('word.close')" :title="$t('word.close')"
@ -76,9 +76,9 @@
</a> </a>
<a v-else-if="tab.type === 'data'" class="tab-link"> <a v-else-if="tab.type === 'data'" class="tab-link">
<i class="mdi mdi-18px mr-1" :class="tab.element === 'view' ? 'mdi-table-eye' : 'mdi-table'" /> <i class="mdi mdi-18px mr-1" :class="tab.elementType === 'view' ? 'mdi-table-eye' : 'mdi-table'" />
<span :title="`${$t('word.data').toUpperCase()}: ${tab.table}`"> <span :title="`${$t('word.data').toUpperCase()}: ${tab.elementType}`">
{{ tab.table }} {{ tab.elementName }}
<span <span
class="btn btn-clear" class="btn btn-clear"
:title="$t('word.close')" :title="$t('word.close')"
@ -89,8 +89,20 @@
<a v-else-if="tab.type === 'table-props'" class="tab-link"> <a v-else-if="tab.type === 'table-props'" class="tab-link">
<i class="mdi mdi-tune-vertical-variant mdi-18px mr-1" /> <i class="mdi mdi-tune-vertical-variant mdi-18px mr-1" />
<span :title="`${$t('word.settings').toUpperCase()}: ${tab.table}`"> <span :title="`${$t('word.settings').toUpperCase()}: ${tab.elementType}`">
{{ tab.table }} {{ tab.elementName }}
<span
class="btn btn-clear"
:title="$t('word.close')"
@click.stop="closeTab(tab)"
/>
</span>
</a>
<a v-else-if="tab.type === 'view-props'" class="tab-link">
<i class="mdi mdi-tune-vertical-variant mdi-18px mr-1" />
<span :title="`${$t('word.settings').toUpperCase()}: ${tab.elementType}`">
{{ tab.elementName }}
<span <span
class="btn btn-clear" class="btn btn-clear"
:title="$t('word.close')" :title="$t('word.close')"
@ -147,12 +159,6 @@
</li> </li>
</Draggable> </Draggable>
<!-- <!--
<WorkspacePropsTabView
v-show="selectedTab === 'prop' && workspace.breadcrumbs.view"
:is-selected="selectedTab === 'prop'"
:connection="connection"
:view="workspace.breadcrumbs.view"
/>
<WorkspacePropsTabTrigger <WorkspacePropsTabTrigger
v-show="selectedTab === 'prop' && workspace.breadcrumbs.trigger" v-show="selectedTab === 'prop' && workspace.breadcrumbs.trigger"
:is-selected="selectedTab === 'prop'" :is-selected="selectedTab === 'prop'"
@ -196,7 +202,7 @@
:key="tab.uid" :key="tab.uid"
:connection="connection" :connection="connection"
:is-selected="selectedTab === tab.uid" :is-selected="selectedTab === tab.uid"
:table="tab.table" :table="tab.elementName"
:schema="tab.schema" :schema="tab.schema"
:element-type="tab.element" :element-type="tab.element"
/> />
@ -205,7 +211,15 @@
:key="tab.uid" :key="tab.uid"
:connection="connection" :connection="connection"
:is-selected="selectedTab === tab.uid" :is-selected="selectedTab === tab.uid"
:table="tab.table" :table="tab.elementName"
:schema="tab.schema"
/>
<WorkspacePropsTabView
v-else-if="tab.type === 'view-props'"
:key="tab.uid"
:is-selected="selectedTab === tab.uid"
:connection="connection"
:view="tab.elementName"
:schema="tab.schema" :schema="tab.schema"
/> />
</template> </template>
@ -228,7 +242,7 @@ import WorkspaceEditConnectionPanel from '@/components/WorkspaceEditConnectionPa
import WorkspaceQueryTab from '@/components/WorkspaceQueryTab'; import WorkspaceQueryTab from '@/components/WorkspaceQueryTab';
import WorkspaceTableTab from '@/components/WorkspaceTableTab'; import WorkspaceTableTab from '@/components/WorkspaceTableTab';
import WorkspacePropsTab from '@/components/WorkspacePropsTab'; import WorkspacePropsTab from '@/components/WorkspacePropsTab';
// import WorkspacePropsTabView from '@/components/WorkspacePropsTabView'; import WorkspacePropsTabView from '@/components/WorkspacePropsTabView';
// import WorkspacePropsTabTrigger from '@/components/WorkspacePropsTabTrigger'; // import WorkspacePropsTabTrigger from '@/components/WorkspacePropsTabTrigger';
// import WorkspacePropsTabRoutine from '@/components/WorkspacePropsTabRoutine'; // import WorkspacePropsTabRoutine from '@/components/WorkspacePropsTabRoutine';
// import WorkspacePropsTabFunction from '@/components/WorkspacePropsTabFunction'; // import WorkspacePropsTabFunction from '@/components/WorkspacePropsTabFunction';
@ -245,7 +259,7 @@ export default {
WorkspaceQueryTab, WorkspaceQueryTab,
WorkspaceTableTab, WorkspaceTableTab,
WorkspacePropsTab, WorkspacePropsTab,
// WorkspacePropsTabView, WorkspacePropsTabView,
// WorkspacePropsTabTrigger, // WorkspacePropsTabTrigger,
// WorkspacePropsTabRoutine, // WorkspacePropsTabRoutine,
// WorkspacePropsTabFunction, // WorkspacePropsTabFunction,
@ -349,7 +363,7 @@ export default {
this.newTab({ uid: this.connection.uid, type: 'query' }); this.newTab({ uid: this.connection.uid, type: 'query' });
}, },
openAsDataTab (tab) { openAsDataTab (tab) {
this.newTab({ uid: this.connection.uid, schema: tab.schema, table: tab.table, type: 'data', element: tab.element }); this.newTab({ uid: this.connection.uid, schema: tab.schema, elementName: tab.elementName, type: 'data', elementType: tab.elementType });
}, },
closeTab (tab) { closeTab (tab) {
if (tab.type === 'query' && this.queryTabs.length === 1) return; if (tab.type === 'query' && this.queryTabs.length === 1) return;

5
src/renderer/components/WorkspaceExploreBarSchema.vue
View File

@ -282,11 +282,11 @@ export default {
this.changeBreadcrumbs({ schema, table: null }); this.changeBreadcrumbs({ schema, table: null });
}, },
selectTable ({ schema, table }) { selectTable ({ schema, table }) {
this.newTab({ uid: this.connection.uid, table: table.name, schema: this.database.name, type: 'temp-data', element: table.type }); this.newTab({ uid: this.connection.uid, elementName: table.name, schema: this.database.name, type: 'temp-data', elementType: table.type });
this.setBreadcrumbs({ schema, [table.type]: table.name }); this.setBreadcrumbs({ schema, [table.type]: table.name });
}, },
openDataTab ({ schema, table }) { openDataTab ({ schema, table }) {
this.newTab({ uid: this.connection.uid, table: table.name, schema: this.database.name, type: 'data', element: table.type }); this.newTab({ uid: this.connection.uid, elementName: table.name, schema: this.database.name, type: 'data', elementType: table.type });
this.setBreadcrumbs({ schema, [table.type]: table.name }); this.setBreadcrumbs({ schema, [table.type]: table.name });
}, },
showSchemaContext (event, schema) { showSchemaContext (event, schema) {
@ -294,7 +294,6 @@ export default {
this.$emit('show-schema-context', { event, schema }); this.$emit('show-schema-context', { event, schema });
}, },
showTableContext (event, table) { showTableContext (event, table) {
// this.setBreadcrumbs({ schema: this.database.name, [table.type]: table.name });
this.$emit('show-table-context', { event, schema: this.database.name, table }); this.$emit('show-table-context', { event, schema: this.database.name, table });
}, },
showMiscContext (event, misc) { showMiscContext (event, misc) {

33
src/renderer/components/WorkspaceExploreBarTableContext.vue
View File

@ -6,7 +6,14 @@
<div <div
v-if="selectedTable.type === 'table' && workspace.customizations.tableSettings" v-if="selectedTable.type === 'table' && workspace.customizations.tableSettings"
class="context-element" class="context-element"
@click="openSettingTab" @click="openTableSettingTab"
>
<span class="d-flex"><i class="mdi mdi-18px mdi-tune-vertical-variant text-light pr-1" /> {{ $t('word.settings') }}</span>
</div>
<div
v-if="selectedTable.type === 'view' && workspace.customizations.viewSettings"
class="context-element"
@click="openViewSettingTab"
> >
<span class="d-flex"><i class="mdi mdi-18px mdi-tune-vertical-variant text-light pr-1" /> {{ $t('word.settings') }}</span> <span class="d-flex"><i class="mdi mdi-18px mdi-tune-vertical-variant text-light pr-1" /> {{ $t('word.settings') }}</span>
</div> </div>
@ -121,18 +128,34 @@ export default {
closeContext () { closeContext () {
this.$emit('close-context'); this.$emit('close-context');
}, },
openSettingTab () { openTableSettingTab () {
this.newTab({ this.newTab({
uid: this.selectedWorkspace, uid: this.selectedWorkspace,
table: this.selectedTable.name, elementName: this.selectedTable.name,
schema: this.selectedSchema, schema: this.selectedSchema,
type: 'table-props', type: 'table-props',
element: this.selectedTable.type elementType: 'table'
}); });
this.changeBreadcrumbs({ this.changeBreadcrumbs({
schema: this.selectedSchema, schema: this.selectedSchema,
[this.selectedTable.type]: this.selectedTable.name table: this.selectedTable.name
});
this.closeContext();
},
openViewSettingTab () {
this.newTab({
uid: this.selectedWorkspace,
elementType: 'table',
elementName: this.selectedTable.name,
schema: this.selectedSchema,
type: 'view-props'
});
this.changeBreadcrumbs({
schema: this.selectedSchema,
view: this.selectedTable.name
}); });
this.closeContext(); this.closeContext();

8
src/renderer/components/WorkspacePropsTab.vue
View File

@ -237,12 +237,12 @@ export default {
try { try {
this.localOptions = JSON.parse(JSON.stringify(this.tableOptions)); this.localOptions = JSON.parse(JSON.stringify(this.tableOptions));
} }
catch (error) {} catch (err) {}
const params = { const params = {
uid: this.connection.uid, uid: this.connection.uid,
schema: this.schema, schema: this.schema,
table: this.workspace.breadcrumbs.table table: this.table
}; };
try { // Columns data try { // Columns data
@ -426,7 +426,7 @@ export default {
const params = { const params = {
uid: this.connection.uid, uid: this.connection.uid,
schema: this.schema, schema: this.schema,
table: this.workspace.breadcrumbs.table, table: this.table,
additions, additions,
changes, changes,
deletions, deletions,
@ -454,8 +454,6 @@ export default {
}); });
this.changeBreadcrumbs({ schema: this.schema, table: this.localOptions.name }); this.changeBreadcrumbs({ schema: this.schema, table: this.localOptions.name });
} }
this.getFieldsData();
} }
else else
this.addNotification({ status: 'error', message: response }); this.addNotification({ status: 'error', message: response });

52
src/renderer/components/WorkspacePropsTabView.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div class="workspace-query-tab column col-12 columns col-gapless"> <div v-show="isSelected" class="workspace-query-tab column col-12 columns col-gapless">
<div class="workspace-query-runner column col-12"> <div class="workspace-query-runner column col-12">
<div class="workspace-query-runner-footer"> <div class="workspace-query-runner-footer">
<div class="workspace-query-buttons"> <div class="workspace-query-buttons">
@ -186,6 +186,8 @@ export default {
}, },
props: { props: {
connection: Object, connection: Object,
isSelected: Boolean,
schema: String,
view: String view: String
}, },
data () { data () {
@ -208,12 +210,6 @@ export default {
workspace () { workspace () {
return this.getWorkspace(this.connection.uid); return this.getWorkspace(this.connection.uid);
}, },
isSelected () {
return this.workspace.selected_tab === 'prop' && this.selectedWorkspace === this.workspace.uid && this.view;
},
schema () {
return this.workspace.breadcrumbs.schema;
},
isChanged () { isChanged () {
return JSON.stringify(this.originalView) !== JSON.stringify(this.localView); return JSON.stringify(this.originalView) !== JSON.stringify(this.localView);
}, },
@ -222,34 +218,44 @@ export default {
} }
}, },
watch: { watch: {
async view () { schema () {
if (this.isSelected) { if (this.isSelected) {
await this.getViewData(); this.getViewData();
this.$refs.queryEditor.editor.session.setValue(this.localView.sql); this.$refs.queryEditor.editor.session.setValue(this.localView.sql);
this.lastView = this.view; this.lastView = this.view;
} }
}, },
async isSelected (val) { view () {
if (val && this.lastView !== this.view) { if (this.isSelected) {
await this.getViewData(); this.getViewData();
this.$refs.queryEditor.editor.session.setValue(this.localView.sql); this.$refs.queryEditor.editor.session.setValue(this.localView.sql);
this.lastView = this.view; this.lastView = this.view;
} }
}, },
isSelected (val) {
if (val) {
this.changeBreadcrumbs({ schema: this.schema, view: this.view });
if (this.lastView !== this.view)
this.getViewData();
}
},
isChanged (val) { isChanged (val) {
if (this.isSelected && this.lastView === this.view && this.view !== null) if (this.isSelected && this.lastView === this.view && this.view !== null)
this.setUnsavedChanges(val); this.setUnsavedChanges(val);
} }
}, },
async created () {
await this.getViewData();
this.$refs.queryEditor.editor.session.setValue(this.localView.sql);
window.addEventListener('keydown', this.onKey);
},
mounted () { mounted () {
window.addEventListener('resize', this.resizeQueryEditor); window.addEventListener('resize', this.resizeQueryEditor);
}, },
destroyed () { destroyed () {
window.removeEventListener('resize', this.resizeQueryEditor); window.removeEventListener('resize', this.resizeQueryEditor);
}, },
created () {
window.addEventListener('keydown', this.onKey);
},
beforeDestroy () { beforeDestroy () {
window.removeEventListener('keydown', this.onKey); window.removeEventListener('keydown', this.onKey);
}, },
@ -258,17 +264,19 @@ export default {
addNotification: 'notifications/addNotification', addNotification: 'notifications/addNotification',
refreshStructure: 'workspaces/refreshStructure', refreshStructure: 'workspaces/refreshStructure',
setUnsavedChanges: 'workspaces/setUnsavedChanges', setUnsavedChanges: 'workspaces/setUnsavedChanges',
changeBreadcrumbs: 'workspaces/changeBreadcrumbs' changeBreadcrumbs: 'workspaces/changeBreadcrumbs',
renameTabs: 'workspaces/renameTabs'
}), }),
async getViewData () { async getViewData () {
if (!this.view) return; if (!this.view) return;
this.isLoading = true; this.isLoading = true;
this.localView = { sql: '' }; this.localView = { sql: '' };
this.lastView = this.view;
const params = { const params = {
uid: this.connection.uid, uid: this.connection.uid,
schema: this.schema, schema: this.schema,
view: this.workspace.breadcrumbs.view view: this.view
}; };
try { try {
@ -310,10 +318,16 @@ export default {
if (oldName !== this.localView.name) { if (oldName !== this.localView.name) {
this.setUnsavedChanges(false); this.setUnsavedChanges(false);
this.renameTabs({
uid: this.connection.uid,
schema: this.schema,
elementName: oldName,
elementNewName: this.localView.name,
elementType: 'view'
});
this.changeBreadcrumbs({ schema: this.schema, view: this.localView.name }); this.changeBreadcrumbs({ schema: this.schema, view: this.localView.name });
} }
this.getViewData();
} }
else else
this.addNotification({ status: 'error', message: response }); this.addNotification({ status: 'error', message: response });

40
src/renderer/store/modules/workspaces.store.js
View File

@ -178,7 +178,7 @@ export default {
} }
: workspace); : workspace);
}, },
NEW_TAB (state, { uid, tab, content, type, autorun, schema, table, element }) { NEW_TAB (state, { uid, tab, content, type, autorun, schema, elementName, elementType }) {
if (type === 'query') if (type === 'query')
tabIndex[uid] = tabIndex[uid] ? ++tabIndex[uid] : 1; tabIndex[uid] = tabIndex[uid] ? ++tabIndex[uid] : 1;
@ -188,8 +188,8 @@ export default {
selected: false, selected: false,
type, type,
schema, schema,
table, elementName,
element, elementType,
fields: [], fields: [],
keyUsage: [], keyUsage: [],
content: content || '', content: content || '',
@ -218,14 +218,14 @@ export default {
return workspace; return workspace;
}); });
}, },
REPLACE_TAB (state, { uid, tab: tUid, type, schema, table, element }) { REPLACE_TAB (state, { uid, tab: tUid, type, schema, elementName, elementType }) {
state.workspaces = state.workspaces.map(workspace => { state.workspaces = state.workspaces.map(workspace => {
if (workspace.uid === uid) { if (workspace.uid === uid) {
return { return {
...workspace, ...workspace,
tabs: workspace.tabs.map(tab => { tabs: workspace.tabs.map(tab => {
if (tab.uid === tUid) if (tab.uid === tUid)
return { ...tab, type, schema, table, element }; return { ...tab, type, schema, elementName, elementType };
return tab; return tab;
}) })
@ -241,10 +241,10 @@ export default {
return { return {
...workspace, ...workspace,
tabs: workspace.tabs.map(tab => { tabs: workspace.tabs.map(tab => {
if (tab[elementType] === elementName && tab.schema === schema) { if (tab.elementName === elementName && tab.schema === schema) {
return { return {
...tab, ...tab,
[elementType]: elementNewName elementName: elementNewName
}; };
} }
@ -517,7 +517,7 @@ export default {
setSearchTerm ({ commit, getters }, term) { setSearchTerm ({ commit, getters }, term) {
commit('SET_SEARCH_TERM', { uid: getters.getSelected, term }); commit('SET_SEARCH_TERM', { uid: getters.getSelected, term });
}, },
newTab ({ state, commit }, { uid, content, type, autorun, schema, table, element }) { newTab ({ state, commit }, { uid, content, type, autorun, schema, elementName, elementType }) {
let tabUid; let tabUid;
const workspaceTabs = state.workspaces.find(workspace => workspace.uid === uid); const workspaceTabs = state.workspaces.find(workspace => workspace.uid === uid);
@ -525,7 +525,8 @@ export default {
const existentTab = workspaceTabs const existentTab = workspaceTabs
? workspaceTabs.tabs.find(tab => ? workspaceTabs.tabs.find(tab =>
tab.schema === schema && tab.schema === schema &&
tab.table === table && tab.elementName === elementName &&
tab.elementType === elementType &&
['temp-data', 'data'].includes(tab.type)) ['temp-data', 'data'].includes(tab.type))
: false; : false;
@ -536,13 +537,13 @@ export default {
const tempTabs = workspaceTabs ? workspaceTabs.tabs.filter(tab => tab.type === 'temp-data') : false; const tempTabs = workspaceTabs ? workspaceTabs.tabs.filter(tab => tab.type === 'temp-data') : false;
if (tempTabs && tempTabs.length) { // if temp table already opened if (tempTabs && tempTabs.length) { // if temp table already opened
for (const tab of tempTabs) { for (const tab of tempTabs) {
commit('REPLACE_TAB', { uid, tab: tab.uid, type, schema, table, element }); commit('REPLACE_TAB', { uid, tab: tab.uid, type, schema, elementName, elementType });
tabUid = tab.uid; tabUid = tab.uid;
} }
} }
else { else {
tabUid = uidGen('T'); tabUid = uidGen('T');
commit('NEW_TAB', { uid, tab: tabUid, content, type, autorun, schema, table, element }); commit('NEW_TAB', { uid, tab: tabUid, content, type, autorun, schema, elementName, elementType });
} }
} }
} }
@ -550,39 +551,40 @@ export default {
const existentTab = workspaceTabs const existentTab = workspaceTabs
? workspaceTabs.tabs.find(tab => ? workspaceTabs.tabs.find(tab =>
tab.schema === schema && tab.schema === schema &&
tab.table === table && tab.elementName === elementName &&
tab.elementType === elementType &&
['temp-data', 'data'].includes(tab.type)) ['temp-data', 'data'].includes(tab.type))
: false; : false;
if (existentTab) { if (existentTab) {
commit('REPLACE_TAB', { uid, tab: existentTab.uid, type, schema, table, element }); commit('REPLACE_TAB', { uid, tab: existentTab.uid, type, schema, elementName, elementType });
tabUid = existentTab.uid; tabUid = existentTab.uid;
} }
else { else {
tabUid = uidGen('T'); tabUid = uidGen('T');
commit('NEW_TAB', { uid, tab: tabUid, content, type, autorun, schema, table }); commit('NEW_TAB', { uid, tab: tabUid, content, type, autorun, schema, elementName, elementType });
} }
} }
else if (type === 'table-props') { else if (type === 'table-props') {
const existentTab = workspaceTabs const existentTab = workspaceTabs
? workspaceTabs.tabs.find(tab => ? workspaceTabs.tabs.find(tab =>
tab.schema === schema && tab.elementName === elementName &&
tab.table === table && tab.elementType === elementType &&
tab.type === type) tab.type === type)
: false; : false;
if (existentTab) { if (existentTab) {
commit('REPLACE_TAB', { uid, tab: existentTab.uid, type, schema, table, element }); commit('REPLACE_TAB', { uid, tab: existentTab.uid, type, schema, elementName, elementType });
tabUid = existentTab.uid; tabUid = existentTab.uid;
} }
else { else {
tabUid = uidGen('T'); tabUid = uidGen('T');
commit('NEW_TAB', { uid, tab: tabUid, content, type, autorun, schema, table }); commit('NEW_TAB', { uid, tab: tabUid, content, type, autorun, schema, elementName, elementType });
} }
} }
else { else {
tabUid = uidGen('T'); tabUid = uidGen('T');
commit('NEW_TAB', { uid, tab: tabUid, content, type, autorun, schema, table }); commit('NEW_TAB', { uid, tab: tabUid, content, type, autorun, schema, elementName, elementType });
} }
commit('SELECT_TAB', { uid, tab: tabUid }); commit('SELECT_TAB', { uid, tab: tabUid });