query toolbar

This commit is contained in:
Jan Prochazka
2022-02-12 18:29:53 +01:00
parent a8265cebff
commit 1b77675ed7
6 changed files with 111 additions and 63 deletions

View File

@@ -68,6 +68,8 @@
import StatusBarTabItem from '../widgets/StatusBarTabItem.svelte';
import { showSnackbarError } from '../utility/snackbar';
import { apiCall, apiOff, apiOn } from '../utility/api';
import ToolStripCommandButton from '../buttons/ToolStripCommandButton.svelte';
import ToolStripContainer from '../buttons/ToolStripContainer.svelte';
export let tabid;
export let conid;
@@ -270,52 +272,60 @@
}
</script>
<VerticalSplitter isSplitter={visibleResultTabs}>
<svelte:fragment slot="1">
{#if driver?.dialect?.nosql}
<AceEditor
mode="javascript"
value={$editorState.value || ''}
splitterOptions={driver?.getQuerySplitterOptions('script')}
menu={createMenu()}
on:input={e => setEditorData(e.detail)}
on:focus={() => {
activator.activate();
invalidateCommands();
}}
bind:this={domEditor}
/>
{:else}
<SqlEditor
engine={$connection && $connection.engine}
{conid}
{database}
splitterOptions={driver?.getQuerySplitterOptions('script')}
value={$editorState.value || ''}
menu={createMenu()}
on:input={e => setEditorData(e.detail)}
on:focus={() => {
activator.activate();
invalidateCommands();
}}
bind:this={domEditor}
/>
{/if}
</svelte:fragment>
<svelte:fragment slot="2">
<ResultTabs tabs={[{ label: 'Messages', slot: 0 }]} {sessionId} {executeNumber}>
<svelte:fragment slot="0">
<SocketMessageView
eventName={sessionId ? `session-info-${sessionId}` : null}
on:messageClick={handleMesageClick}
{executeNumber}
showProcedure
showLine
<ToolStripContainer>
<VerticalSplitter isSplitter={visibleResultTabs}>
<svelte:fragment slot="1">
{#if driver?.dialect?.nosql}
<AceEditor
mode="javascript"
value={$editorState.value || ''}
splitterOptions={driver?.getQuerySplitterOptions('script')}
menu={createMenu()}
on:input={e => setEditorData(e.detail)}
on:focus={() => {
activator.activate();
invalidateCommands();
}}
bind:this={domEditor}
/>
</svelte:fragment>
</ResultTabs>
{:else}
<SqlEditor
engine={$connection && $connection.engine}
{conid}
{database}
splitterOptions={driver?.getQuerySplitterOptions('script')}
value={$editorState.value || ''}
menu={createMenu()}
on:input={e => setEditorData(e.detail)}
on:focus={() => {
activator.activate();
invalidateCommands();
}}
bind:this={domEditor}
/>
{/if}
</svelte:fragment>
<svelte:fragment slot="2">
<ResultTabs tabs={[{ label: 'Messages', slot: 0 }]} {sessionId} {executeNumber}>
<svelte:fragment slot="0">
<SocketMessageView
eventName={sessionId ? `session-info-${sessionId}` : null}
on:messageClick={handleMesageClick}
{executeNumber}
showProcedure
showLine
/>
</svelte:fragment>
</ResultTabs>
</svelte:fragment>
</VerticalSplitter>
<svelte:fragment slot="toolstrip">
<ToolStripCommandButton command="query.execute" />
<ToolStripCommandButton command="query.kill" />
<ToolStripCommandButton command="query.save" />
<ToolStripCommandButton command="query.formatCode" />
</svelte:fragment>
</VerticalSplitter>
</ToolStripContainer>
{#if sessionId}
<StatusBarTabItem icon={busy ? 'icon loading' : 'icon check'} text={busy ? 'Running...' : 'Finished'} />

View File

@@ -58,6 +58,7 @@
import ToolStripCommandButton from '../buttons/ToolStripCommandButton.svelte';
import ToolStripDropDownButton from '../buttons/ToolStripDropDownButton.svelte';
import { createQuickExportMenuItems } from '../utility/createQuickExportMenu';
import ToolStripExportButton, { createQuickExportHandlerRef } from '../buttons/ToolStripExportButton.svelte';
export let tabid;
export let conid;
@@ -119,18 +120,7 @@
setContext('collapsedLeftColumnStore', collapsedLeftColumnStore);
$: setLocalStorage('dataGrid_collapsedLeftColumn', $collapsedLeftColumnStore);
let quickExportHandler = null;
function setQuickExportHandler(value) {
quickExportHandler = value;
}
setContext('setQuickExportHandler', setQuickExportHandler);
function getExportMenu() {
return [
quickExportHandler ? createQuickExportMenuItems($extensions, quickExportHandler) : null,
{ divider: true },
{ command: 'sqlDataGrid.export', text: 'Advanced settings' },
];
}
const quickExportHandlerRef = createQuickExportHandlerRef();
</script>
<ToolStripContainer>
@@ -151,7 +141,7 @@
<ToolStripCommandButton command="tableData.save" />
<ToolStripCommandButton command="dataGrid.insertNewRow" />
<ToolStripCommandButton command="dataGrid.deleteSelectedRows" />
<ToolStripDropDownButton menu={getExportMenu} label="Export" icon="icon export" />
<ToolStripExportButton {quickExportHandlerRef} />
</svelte:fragment>
</ToolStripContainer>

View File

@@ -10,6 +10,7 @@
import { writable } from 'svelte/store';
import ToolStripCommandButton from '../buttons/ToolStripCommandButton.svelte';
import ToolStripContainer from '../buttons/ToolStripContainer.svelte';
import ToolStripExportButton, { createQuickExportHandlerRef } from '../buttons/ToolStripExportButton.svelte';
import DataGrid from '../datagrid/DataGrid.svelte';
import SqlDataGridCore from '../datagrid/SqlDataGridCore.svelte';
@@ -50,6 +51,8 @@ import ToolStripContainer from '../buttons/ToolStripContainer.svelte';
const collapsedLeftColumnStore = writable(getLocalStorage('dataGrid_collapsedLeftColumn', false));
setContext('collapsedLeftColumnStore', collapsedLeftColumnStore);
$: setLocalStorage('dataGrid_collapsedLeftColumn', $collapsedLeftColumnStore);
const quickExportHandlerRef = createQuickExportHandlerRef();
</script>
{#if display}
@@ -66,7 +69,7 @@ import ToolStripContainer from '../buttons/ToolStripContainer.svelte';
/>
<svelte:fragment slot="toolstrip">
<ToolStripCommandButton command="dataGrid.refresh" />
<ToolStripCommandButton command="sqlDataGrid.export" />
<ToolStripExportButton {quickExportHandlerRef} />
</svelte:fragment>
</ToolStripContainer>
{/if}