mirror of
https://github.com/dbgate/dbgate
synced 2024-11-07 20:26:23 +00:00
pk editor
This commit is contained in:
Jan Prochazka
parent
b8ccae570e
commit
dea6700a25
@ -15,70 +15,3 @@ export function generateTablePairingId(table: TableInfo): TableInfo {
|
||||
}
|
||||
return table;
|
||||
}
|
||||
|
||||
function processPrimaryKey(table: TableInfo, oldColumn: ColumnInfo, newColumn: ColumnInfo) {
|
||||
if (!oldColumn?.isPrimaryKey && newColumn?.isPrimaryKey) {
|
||||
if (!table.primaryKey) {
|
||||
table.primaryKey = {
|
||||
constraintType: 'primaryKey',
|
||||
pureName: table.pureName,
|
||||
schemaName: table.schemaName,
|
||||
columns: [],
|
||||
};
|
||||
}
|
||||
table.primaryKey.columns = [
|
||||
...table.primaryKey.columns,
|
||||
{
|
||||
columnName: newColumn.columnName,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
console.log('processPrimaryKey', oldColumn, newColumn);
|
||||
|
||||
if (oldColumn?.isPrimaryKey && !newColumn?.isPrimaryKey) {
|
||||
if (table.primaryKey) {
|
||||
table.primaryKey = {
|
||||
...table.primaryKey,
|
||||
columns: table.primaryKey.columns.filter(x => x.columnName != oldColumn.columnName),
|
||||
};
|
||||
if (table.primaryKey.columns.length == 0) {
|
||||
table.primaryKey = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export function editorAddColumn(table: TableInfo, column: ColumnInfo): TableInfo {
|
||||
const res = {
|
||||
...table,
|
||||
columns: [...table.columns, { ...column, pairingId: uuidv1() }],
|
||||
};
|
||||
|
||||
processPrimaryKey(res, null, column);
|
||||
|
||||
return res;
|
||||
}
|
||||
|
||||
export function editorModifyColumn(table: TableInfo, column: ColumnInfo): TableInfo {
|
||||
const oldColumn = table?.columns?.find(x => x.pairingId == column.pairingId);
|
||||
|
||||
const res = {
|
||||
...table,
|
||||
columns: table.columns.map(col => (col.pairingId == column.pairingId ? column : col)),
|
||||
};
|
||||
processPrimaryKey(res, oldColumn, column);
|
||||
|
||||
return res;
|
||||
}
|
||||
|
||||
export function editorDeleteColumn(table: TableInfo, column: ColumnInfo): TableInfo {
|
||||
const res = {
|
||||
...table,
|
||||
columns: table.columns.filter(col => col.pairingId != column.pairingId),
|
||||
};
|
||||
|
||||
processPrimaryKey(res, column, null);
|
||||
|
||||
return res;
|
||||
}
|
||||
|
||||
@ -12,3 +12,4 @@ export * from './structureTools';
|
||||
export * from './settingsExtractors';
|
||||
export * from './filterName';
|
||||
export * from './diffTools';
|
||||
export * from './schemaEditorTools';
|
||||
|
||||
111
packages/tools/src/schemaEditorTools.ts
Normal file
111
packages/tools/src/schemaEditorTools.ts
Normal file
@ -0,0 +1,111 @@
|
||||
import uuidv1 from 'uuid/v1';
|
||||
import { ColumnInfo, ConstraintInfo, PrimaryKeyInfo, TableInfo } from 'dbgate-types';
|
||||
|
||||
function processPrimaryKey(table: TableInfo, oldColumn: ColumnInfo, newColumn: ColumnInfo) {
|
||||
if (!oldColumn?.isPrimaryKey && newColumn?.isPrimaryKey) {
|
||||
if (!table.primaryKey) {
|
||||
table.primaryKey = {
|
||||
constraintType: 'primaryKey',
|
||||
pureName: table.pureName,
|
||||
schemaName: table.schemaName,
|
||||
columns: [],
|
||||
};
|
||||
}
|
||||
table.primaryKey.columns = [
|
||||
...table.primaryKey.columns,
|
||||
{
|
||||
columnName: newColumn.columnName,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
console.log('processPrimaryKey', oldColumn, newColumn);
|
||||
|
||||
if (oldColumn?.isPrimaryKey && !newColumn?.isPrimaryKey) {
|
||||
if (table.primaryKey) {
|
||||
table.primaryKey = {
|
||||
...table.primaryKey,
|
||||
columns: table.primaryKey.columns.filter(x => x.columnName != oldColumn.columnName),
|
||||
};
|
||||
if (table.primaryKey.columns.length == 0) {
|
||||
table.primaryKey = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export function editorAddColumn(table: TableInfo, column: ColumnInfo): TableInfo {
|
||||
const res = {
|
||||
...table,
|
||||
columns: [...table.columns, { ...column, pairingId: uuidv1() }],
|
||||
};
|
||||
|
||||
processPrimaryKey(res, null, column);
|
||||
|
||||
return res;
|
||||
}
|
||||
|
||||
export function editorModifyColumn(table: TableInfo, column: ColumnInfo): TableInfo {
|
||||
const oldColumn = table?.columns?.find(x => x.pairingId == column.pairingId);
|
||||
|
||||
const res = {
|
||||
...table,
|
||||
columns: table.columns.map(col => (col.pairingId == column.pairingId ? column : col)),
|
||||
};
|
||||
processPrimaryKey(res, oldColumn, column);
|
||||
|
||||
return res;
|
||||
}
|
||||
|
||||
export function editorDeleteColumn(table: TableInfo, column: ColumnInfo): TableInfo {
|
||||
const res = {
|
||||
...table,
|
||||
columns: table.columns.filter(col => col.pairingId != column.pairingId),
|
||||
};
|
||||
|
||||
processPrimaryKey(res, column, null);
|
||||
|
||||
return res;
|
||||
}
|
||||
|
||||
export function editorAddConstraint(table: TableInfo, constraint: ConstraintInfo): TableInfo {
|
||||
const res = {
|
||||
...table,
|
||||
};
|
||||
|
||||
if (constraint.constraintType == 'primaryKey') {
|
||||
res.primaryKey = {
|
||||
pairingId: uuidv1(),
|
||||
...constraint,
|
||||
} as PrimaryKeyInfo;
|
||||
}
|
||||
|
||||
return res;
|
||||
}
|
||||
|
||||
export function editorModifyConstraint(table: TableInfo, constraint: ConstraintInfo): TableInfo {
|
||||
const res = {
|
||||
...table,
|
||||
};
|
||||
|
||||
if (constraint.constraintType == 'primaryKey') {
|
||||
res.primaryKey = {
|
||||
...res.primaryKey,
|
||||
...constraint,
|
||||
};
|
||||
}
|
||||
|
||||
return res;
|
||||
}
|
||||
|
||||
export function editorDeleteConstraint(table: TableInfo, constraint: ConstraintInfo): TableInfo {
|
||||
const res = {
|
||||
...table,
|
||||
};
|
||||
|
||||
if (constraint.constraintType == 'primaryKey') {
|
||||
res.primaryKey = null;
|
||||
}
|
||||
|
||||
return res;
|
||||
}
|
||||
157
packages/web/src/tableeditor/ColumnsConstraintEditorModal.svelte
Normal file
157
packages/web/src/tableeditor/ColumnsConstraintEditorModal.svelte
Normal file
@ -0,0 +1,157 @@
|
||||
<script lang="ts">
|
||||
import FormStyledButton from '../elements/FormStyledButton.svelte';
|
||||
import uuidv1 from 'uuid/v1';
|
||||
|
||||
import FormSelectField from '../forms/FormSelectField.svelte';
|
||||
import FormTextField from '../forms/FormTextField.svelte';
|
||||
import FormCheckboxField from '../forms/FormCheckboxField.svelte';
|
||||
|
||||
import FormProvider from '../forms/FormProvider.svelte';
|
||||
import FormSubmit from '../forms/FormSubmit.svelte';
|
||||
import ModalBase from '../modals/ModalBase.svelte';
|
||||
import { closeCurrentModal } from '../modals/modalTools';
|
||||
import ElectronFilesInput from '../impexp/ElectronFilesInput.svelte';
|
||||
import DropDownButton from '../elements/DropDownButton.svelte';
|
||||
import DataTypeEditor from './DataTypeEditor.svelte';
|
||||
import { editorAddConstraint, editorDeleteConstraint, editorModifyConstraint } from 'dbgate-tools';
|
||||
import TextField from '../forms/TextField.svelte';
|
||||
import SelectField from '../forms/SelectField.svelte';
|
||||
|
||||
export let constraintInfo;
|
||||
export let setTableInfo;
|
||||
export let tableInfo;
|
||||
export let constraintLabel;
|
||||
export let constraintType;
|
||||
|
||||
let constraintName = constraintInfo?.constraintName;
|
||||
let columns = constraintInfo?.columns || [];
|
||||
|
||||
function getConstraint() {
|
||||
return {
|
||||
pairingId: uuidv1(),
|
||||
...constraintInfo,
|
||||
pureName: tableInfo.pureName,
|
||||
schemaName: tableInfo.schemaName,
|
||||
constraintName,
|
||||
constraintType,
|
||||
};
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<ModalBase {...$$restProps}>
|
||||
<svelte:fragment slot="header"
|
||||
>{constraintInfo ? `Edit ${constraintLabel}` : `Add ${constraintLabel}`}</svelte:fragment
|
||||
>
|
||||
|
||||
<div class="largeFormMarker">
|
||||
<div class="row">
|
||||
<div class="label col-3">Constraint name</div>
|
||||
<div class="col-9">
|
||||
<TextField value={constraintName} on:input={e => (constraintName = e.target['value'])} focused />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{#each columns as column, index}
|
||||
<div class="row">
|
||||
<div class="label col-3">Column {index + 1}</div>
|
||||
<div class="col-6">
|
||||
<SelectField
|
||||
value={column.columnName}
|
||||
isNative
|
||||
options={tableInfo.columns.map(col => ({
|
||||
label: col.columnName,
|
||||
value: col.columnName,
|
||||
}))}
|
||||
/>
|
||||
</div>
|
||||
<div class="col-3 button">
|
||||
<FormStyledButton
|
||||
value="Delete"
|
||||
on:click={e => {
|
||||
const x = [...columns];
|
||||
x.splice(index, 1);
|
||||
columns = x;
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
{/each}
|
||||
|
||||
<div class="row">
|
||||
<div class="label col-3">Add new column</div>
|
||||
<div class="col-9">
|
||||
{#key columns.length}
|
||||
<SelectField
|
||||
placeholder="Select column"
|
||||
value={''}
|
||||
on:change={e => {
|
||||
if (e.detail)
|
||||
columns = [
|
||||
...columns,
|
||||
{
|
||||
columnName: e.detail,
|
||||
},
|
||||
];
|
||||
}}
|
||||
isNative
|
||||
options={[
|
||||
{
|
||||
label: 'Choose column',
|
||||
value: '',
|
||||
},
|
||||
...tableInfo.columns.map(col => ({
|
||||
label: col.columnName,
|
||||
value: col.columnName,
|
||||
})),
|
||||
]}
|
||||
/>
|
||||
{/key}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<svelte:fragment slot="footer">
|
||||
<FormStyledButton
|
||||
value={'Save'}
|
||||
on:click={() => {
|
||||
closeCurrentModal();
|
||||
if (constraintInfo) {
|
||||
setTableInfo(tbl => editorModifyConstraint(tbl, getConstraint()));
|
||||
} else {
|
||||
setTableInfo(tbl => editorAddConstraint(tbl, getConstraint()));
|
||||
}
|
||||
}}
|
||||
/>
|
||||
|
||||
<FormStyledButton type="button" value="Close" on:click={closeCurrentModal} />
|
||||
{#if constraintInfo}
|
||||
<FormStyledButton
|
||||
type="button"
|
||||
value="Remove"
|
||||
on:click={() => {
|
||||
closeCurrentModal();
|
||||
setTableInfo(tbl => editorDeleteConstraint(tbl, constraintInfo));
|
||||
}}
|
||||
/>
|
||||
{/if}
|
||||
</svelte:fragment>
|
||||
</ModalBase>
|
||||
|
||||
<style>
|
||||
.row {
|
||||
margin: var(--dim-large-form-margin);
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.row .label {
|
||||
white-space: nowrap;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.button {
|
||||
align-self: center;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
</style>
|
||||
17
packages/web/src/tableeditor/PrimaryKeyEditorModal.svelte
Normal file
17
packages/web/src/tableeditor/PrimaryKeyEditorModal.svelte
Normal file
@ -0,0 +1,17 @@
|
||||
<script lang="ts">
|
||||
import ColumnsConstraintEditorModal from './ColumnsConstraintEditorModal.svelte';
|
||||
|
||||
export let constraintInfo;
|
||||
export let setTableInfo;
|
||||
export let tableInfo;
|
||||
|
||||
</script>
|
||||
|
||||
<ColumnsConstraintEditorModal
|
||||
{...$$restProps}
|
||||
constraintLabel="primary key"
|
||||
constraintType="primaryKey"
|
||||
{constraintInfo}
|
||||
{setTableInfo}
|
||||
{tableInfo}
|
||||
/>
|
||||
@ -30,6 +30,7 @@
|
||||
|
||||
import { useDbCore } from '../utility/metadataLoaders';
|
||||
import ColumnEditorModal from './ColumnEditorModal.svelte';
|
||||
import PrimaryKeyEditorModal from './PrimaryKeyEditorModal.svelte';
|
||||
|
||||
export const activator = createActivator('TableEditor', true);
|
||||
|
||||
@ -111,6 +112,9 @@
|
||||
<ObjectListControl
|
||||
collection={_.compact([primaryKey])}
|
||||
title="Primary key"
|
||||
clickable={writable()}
|
||||
on:clickrow={e => showModal(PrimaryKeyEditorModal, { constraintInfo: e.detail, tableInfo, setTableInfo })}
|
||||
|
||||
columns={[
|
||||
{
|
||||
fieldName: 'columns',
|
||||
|
||||
Loading…
Reference in New Issue
Block a user