95 lines
2.4 KiB
Svelte
95 lines
2.4 KiB
Svelte
<script>
|
|
import ModelView from "./ModelView.svelte"
|
|
import IndexView from "./IndexView.svelte"
|
|
import ModelDataTable from "./ModelDataTable"
|
|
import ActionsHeader from "./ActionsHeader.svelte"
|
|
import { store, backendUiStore } from "../builderStore"
|
|
import getIcon from "../common/icon"
|
|
import DropdownButton from "../common/DropdownButton.svelte"
|
|
import ActionButton from "../common/ActionButton.svelte"
|
|
import Modal from "../common/Modal.svelte"
|
|
import {
|
|
CreateEditRecordModal,
|
|
CreateEditModelModal,
|
|
CreateEditViewModal,
|
|
CreateDatabaseModal,
|
|
DeleteRecordModal
|
|
} from "./ModelDataTable/modals"
|
|
|
|
let selectedRecord
|
|
|
|
function selectRecord(record) {
|
|
selectedRecord = record
|
|
}
|
|
|
|
function onClosed() {
|
|
backendUiStore.actions.modals.hide()
|
|
}
|
|
|
|
$: recordOpen = $backendUiStore.visibleModal === "RECORD"
|
|
$: modelOpen = $backendUiStore.visibleModal === "MODEL"
|
|
$: viewOpen = $backendUiStore.visibleModal === "VIEW"
|
|
$: databaseOpen = $backendUiStore.visibleModal === "DATABASE"
|
|
$: deleteRecordOpen = $backendUiStore.visibleModal === "DELETE_RECORD"
|
|
$: breadcrumbs = $store.currentNode
|
|
</script>
|
|
|
|
<Modal isOpen={!!$backendUiStore.visibleModal} {onClosed}>
|
|
{#if recordOpen}
|
|
<CreateEditRecordModal record={selectedRecord} {onClosed} />
|
|
{/if}
|
|
{#if modelOpen}
|
|
<CreateEditModelModal {onClosed} />
|
|
{/if}
|
|
{#if viewOpen}
|
|
<CreateEditViewModal {onClosed} />
|
|
{/if}
|
|
{#if databaseOpen}
|
|
<CreateDatabaseModal {onClosed} />
|
|
{/if}
|
|
{#if deleteRecordOpen}
|
|
<DeleteRecordModal record={selectedRecord} {onClosed} />
|
|
{/if}
|
|
</Modal>
|
|
|
|
|
|
<div class="root">
|
|
<div class="node-view">
|
|
<div class="database-actions">
|
|
<div class="budibase__label--big">
|
|
{#if $backendUiStore.selectedDatabase.name}
|
|
{$backendUiStore.selectedDatabase.name} {breadcrumbs}
|
|
{/if}
|
|
</div>
|
|
{#if $backendUiStore.selectedDatabase.id}
|
|
<ActionButton
|
|
primary
|
|
on:click={() => {
|
|
selectedRecord = null
|
|
backendUiStore.actions.modals.show("RECORD")
|
|
}}>
|
|
Create new record
|
|
</ActionButton>
|
|
{/if}
|
|
</div>
|
|
<ModelDataTable {selectRecord} />
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
.root {
|
|
height: 100%;
|
|
position: relative;
|
|
}
|
|
|
|
.node-view {
|
|
overflow-y: auto;
|
|
flex: 1 1 auto;
|
|
}
|
|
|
|
.database-actions {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
</style>
|