From f7c5ffa0cef5e0c729233148f32d11de2060a8ce Mon Sep 17 00:00:00 2001 From: Jan Prochazka Date: Thu, 19 Sep 2024 09:00:13 +0200 Subject: [PATCH] create table - changed workflow --- .../web/src/appobj/DatabaseAppObject.svelte | 23 +-------- packages/web/src/commands/stdCommands.ts | 22 +-------- .../src/elements/ObjectFieldsEditor.svelte | 15 ++++++ .../web/src/tableeditor/TableEditor.svelte | 12 ++--- packages/web/src/tableeditor/newTable.ts | 48 +++++++++++++++++++ .../web/src/tabs/TableStructureTab.svelte | 48 +++++-------------- packages/web/src/utility/openNewTab.ts | 2 +- 7 files changed, 85 insertions(+), 85 deletions(-) create mode 100644 packages/web/src/tableeditor/newTable.ts diff --git a/packages/web/src/appobj/DatabaseAppObject.svelte b/packages/web/src/appobj/DatabaseAppObject.svelte index 32368740..b817f697 100644 --- a/packages/web/src/appobj/DatabaseAppObject.svelte +++ b/packages/web/src/appobj/DatabaseAppObject.svelte @@ -56,27 +56,7 @@ }; const handleNewTable = () => { - const tooltip = `${getConnectionLabel(connection)}\n${name}`; - openNewTab( - { - title: 'Table #', - tooltip, - icon: 'img table-structure', - tabComponent: 'TableStructureTab', - props: { - conid: connection._id, - database: name, - }, - }, - { - editor: { - columns: [], - }, - }, - { - forceNewTab: true, - } - ); + newTable(connection, name); }; const handleDropDatabase = () => { @@ -410,6 +390,7 @@ import NewCollectionModal from '../modals/NewCollectionModal.svelte'; import hasPermission from '../utility/hasPermission'; import { openImportExportTab } from '../utility/importExportTools'; + import newTable from '../tableeditor/newTable'; export let data; export let passProps; diff --git a/packages/web/src/commands/stdCommands.ts b/packages/web/src/commands/stdCommands.ts index 9a019254..70282233 100644 --- a/packages/web/src/commands/stdCommands.ts +++ b/packages/web/src/commands/stdCommands.ts @@ -44,6 +44,7 @@ import NewCollectionModal from '../modals/NewCollectionModal.svelte'; import ConfirmModal from '../modals/ConfirmModal.svelte'; import localforage from 'localforage'; import { openImportExportTab } from '../utility/importExportTools'; +import newTable from '../tableeditor/newTable'; // function themeCommand(theme: ThemeDefinition) { // return { @@ -253,26 +254,7 @@ registerCommand({ const $currentDatabase = get(currentDatabase); const connection = _.get($currentDatabase, 'connection') || {}; const database = _.get($currentDatabase, 'name'); - - openNewTab( - { - title: 'Table #', - icon: 'img table-structure', - tabComponent: 'TableStructureTab', - props: { - conid: connection._id, - database, - }, - }, - { - editor: { - columns: [], - }, - }, - { - forceNewTab: true, - } - ); + newTable(connection, database); }, }); diff --git a/packages/web/src/elements/ObjectFieldsEditor.svelte b/packages/web/src/elements/ObjectFieldsEditor.svelte index caa2fbf6..5deac34a 100644 --- a/packages/web/src/elements/ObjectFieldsEditor.svelte +++ b/packages/web/src/elements/ObjectFieldsEditor.svelte @@ -5,11 +5,16 @@ import { writable } from 'svelte/store'; import FormProviderCore from '../forms/FormProviderCore.svelte'; import createRef from '../utility/createRef'; + import FormSchemaSelect from '../impexp/FormSchemaSelect.svelte'; + import FormTextField from '../forms/FormTextField.svelte'; + import FormSelectField from '../forms/FormSelectField.svelte'; export let title; export let fieldDefinitions; export let values; export let onChangeValues; + export let pureNameTitle = null; + export let schemaList = null; let collapsed = false; @@ -32,6 +37,16 @@ {#if !collapsed} + {#if schemaList?.length > 0} + ({ label: x.schemaName, value: x.schemaName }))} + /> + {/if} + {#if pureNameTitle} + + {/if} {/if} diff --git a/packages/web/src/tableeditor/TableEditor.svelte b/packages/web/src/tableeditor/TableEditor.svelte index 2e65924f..e722f47c 100644 --- a/packages/web/src/tableeditor/TableEditor.svelte +++ b/packages/web/src/tableeditor/TableEditor.svelte @@ -91,6 +91,7 @@ export let dbInfo; export let driver; export let resetCounter; + export let isCreateTable; $: isWritable = !!setTableInfo; @@ -165,15 +166,14 @@
- {#if tableFormOptions} + {#if tableInfo && (tableFormOptions || isCreateTable)} {#key resetCounter} x.name) - )} + fieldDefinitions={tableFormOptions ?? []} + pureNameTitle="Table name" + schemaList={dbInfo?.schemas?.length >= 0 ? dbInfo?.schemas : null} + values={_.pick(tableInfo, ['schemaName', 'pureName', ...(tableFormOptions ?? []).map(x => x.name)])} onChangeValues={vals => { if (!_.isEmpty(vals)) { setTableInfo(tbl => ({ ...tbl, ...vals })); diff --git a/packages/web/src/tableeditor/newTable.ts b/packages/web/src/tableeditor/newTable.ts new file mode 100644 index 00000000..df8285c9 --- /dev/null +++ b/packages/web/src/tableeditor/newTable.ts @@ -0,0 +1,48 @@ +import _ from 'lodash'; +import openNewTab from '../utility/openNewTab'; +import { findEngineDriver, getConnectionLabel } from 'dbgate-tools'; +import { getExtensions } from '../stores'; + +export default function newTable(connection, database) { + const tooltip = `${getConnectionLabel(connection)}\n${database}`; + const driver = findEngineDriver(connection, getExtensions()); + openNewTab( + { + title: 'Table #', + tooltip, + icon: 'img table-structure', + tabComponent: 'TableStructureTab', + props: { + conid: connection._id, + database, + }, + }, + { + editor: { + current: { + pureName: 'new_table', + schemaName: driver?.dialect?.defaultSchemaName, + columns: [ + { + columnName: 'id', + dataType: 'int', + isNullable: false, + isPrimaryKey: true, + isAutoIncrement: true, + }, + ], + primaryKey: { + columns: [ + { + columnName: 'id', + }, + ], + }, + }, + }, + }, + { + forceNewTab: true, + } + ); +} diff --git a/packages/web/src/tabs/TableStructureTab.svelte b/packages/web/src/tabs/TableStructureTab.svelte index c3717745..e1c602ee 100644 --- a/packages/web/src/tabs/TableStructureTab.svelte +++ b/packages/web/src/tabs/TableStructureTab.svelte @@ -22,7 +22,7 @@ toolbar: true, isRelatedToTab: true, icon: 'icon close', - testEnabled: () => getCurrentEditor()?.canSave(), + testEnabled: () => getCurrentEditor()?.canResetChanges(), onClick: () => getCurrentEditor().reset(), }); @@ -90,30 +90,11 @@ return objectTypeField == 'tables' && !!$editorValue && !$connection?.isReadOnly; } - export function save() { - if ($editorValue.base) { - doSave(null); - } else { - showModal(InputTextModal, { - header: 'Set table name', - value: savedName || 'newTable', - label: 'Table name', - onConfirm: name => { - savedName = name; - setEditorData(tbl => ({ - base: tbl.base, - current: { - ...tbl.current, - pureName: name, - }, - })); - doSave(name); - }, - }); - } + export function canResetChanges() { + return canSave() && !!$editorValue.base; } - function doSave(createTableName) { + export function save() { const { sql, recreates } = getAlterTableScript( $editorValue.base, extendTableInfo(fillConstraintNames($editorValue.current, driver.dialect)), @@ -127,29 +108,18 @@ sql, recreates, onConfirm: () => { - handleConfirmSql(sql, createTableName); + handleConfirmSql(sql); }, engine: driver.engine, }); } - async function handleConfirmSql(sql, createTableName) { + async function handleConfirmSql(sql) { const resp = await apiCall('database-connections/run-script', { conid, database, sql, useTransaction: true }); const { errorMessage } = resp || {}; if (errorMessage) { showModal(ErrorMessageModal, { title: 'Error when saving', message: errorMessage }); } else { - if (createTableName) { - changeTab(tabid, tab => ({ - ...tab, - title: createTableName, - props: { - ...tab.props, - pureName: createTableName, - }, - })); - } - await apiCall('database-connections/sync-model', { conid, database }); showSnackbarSuccess('Saved to database'); clearEditorData(); @@ -175,6 +145,7 @@ dbInfo={$dbInfo} {driver} {resetCounter} + isCreateTable={objectTypeField == 'tables' && !$editorValue?.base} setTableInfo={objectTypeField == 'tables' && !$connection?.isReadOnly && hasPermission(`dbops/model/edit`) ? tableInfoUpdater => setEditorData(tbl => @@ -191,7 +162,10 @@ : null} /> - + diff --git a/packages/web/src/utility/openNewTab.ts b/packages/web/src/utility/openNewTab.ts index 687002dc..fd40141e 100644 --- a/packages/web/src/utility/openNewTab.ts +++ b/packages/web/src/utility/openNewTab.ts @@ -15,7 +15,7 @@ function findFreeNumber(numbers: number[]) { // return res; } -export default async function openNewTab(newTab, initialData = undefined, options = undefined) { +export default async function openNewTab(newTab, initialData: any = undefined, options: any = undefined) { const oldTabs = getOpenedTabs(); const activeTab = getActiveTab();