tsai
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

use params to select DB rather than store

pull/200/head
kevmodrome 7 years ago
parent
d3a707956f
commit
13dba18215
4 changed files with 124 additions and 98 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 5
      packages/builder/src/components/nav/DatabasesList.svelte
  2. 43
      packages/builder/src/pages/[application]/backend/database/[selectedDatabase]/index.svelte
  3. 76
      packages/builder/src/pages/[application]/backend/database/_layout.svelte
  4. 98
      packages/builder/src/pages/[application]/backend/database/index.svelte

5
packages/builder/src/components/nav/DatabasesList.svelte
View File

@ -1,5 +1,6 @@
<script>
import { tick, onMount } from "svelte"
import { goto } from "@sveltech/routify"
import { store, backendUiStore } from "builderStore"
import api from "builderStore/api"
import getIcon from "../common/icon"
@ -44,7 +45,9 @@
</span>
<button
class:active={database.id === $backendUiStore.selectedDatabase.id}
on:click={() => selectDatabase(database)}>
on:click={() => {
$goto(`./database/${database.id}`), selectDatabase(database)
}}>
{database.name}
</button>
<i

43
packages/builder/src/pages/[application]/backend/database/[selectedDatabase]/index.svelte
View File

@ -0,0 +1,43 @@
<script>
import ModelDataTable from "components/database/ModelDataTable"
import { store, backendUiStore } from "builderStore"
import ActionButton from "components/common/ActionButton.svelte"
import * as api from "components/database/ModelDataTable/api"
export let selectedDatabase
let selectedRecord
async function selectRecord(record) {
selectedRecord = await api.loadRecord(record.key, {
appname: $store.appname,
instanceId: selectedDatabase,
})
}
$: breadcrumbs = $backendUiStore.breadcrumbs.join(" / ")
</script>
<div class="database-actions">
<div class="budibase__label--big">{breadcrumbs}</div>
{#if $backendUiStore.selectedDatabase.id}
<ActionButton
primary
on:click={() => {
selectedRecord = null
backendUiStore.actions.modals.show('RECORD')
}}>
Create new record
</ActionButton>
{/if}
</div>
{#if $backendUiStore.selectedDatabase.id}
<ModelDataTable {selectRecord} />
{:else}Please select a database{/if}
<style>
.database-actions {
display: flex;
justify-content: space-between;
}
</style>

76
packages/builder/src/pages/[application]/backend/database/_layout.svelte
View File

@ -0,0 +1,76 @@
<script>
import ModelDataTable from "components/database/ModelDataTable"
import { store, backendUiStore } from "builderStore"
import getIcon from "components/common/icon"
import DropdownButton from "components/common/DropdownButton.svelte"
import ActionButton from "components/common/ActionButton.svelte"
import Modal from "components/common/Modal.svelte"
import * as api from "components/database/ModelDataTable/api"
import {
CreateEditRecordModal,
CreateEditModelModal,
CreateEditViewModal,
CreateDatabaseModal,
DeleteRecordModal,
CreateUserModal,
} from "components/database/ModelDataTable/modals"
let selectedRecord
async function selectRecord(record) {
selectedRecord = await api.loadRecord(record.key, {
appname: $store.appname,
instanceId: $backendUiStore.selectedDatabase.id,
})
}
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"
$: userOpen = $backendUiStore.visibleModal === "USER"
</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}
{#if userOpen}
<CreateUserModal {onClosed} />
{/if}
</Modal>
<div class="root">
<div class="node-view">
<slot />
</div>
</div>
<style>
.root {
height: 100%;
position: relative;
}
.node-view {
overflow-y: auto;
flex: 1 1 auto;
}
</style>

98
packages/builder/src/pages/[application]/backend/database/index.svelte
View File

@ -1,97 +1 @@
<script>
import ModelDataTable from "components/database/ModelDataTable"
import { store, backendUiStore } from "builderStore"
import getIcon from "components/common/icon"
import DropdownButton from "components/common/DropdownButton.svelte"
import ActionButton from "components/common/ActionButton.svelte"
import Modal from "components/common/Modal.svelte"
import * as api from "components/database/ModelDataTable/api"
import {
CreateEditRecordModal,
CreateEditModelModal,
CreateEditViewModal,
CreateDatabaseModal,
DeleteRecordModal,
CreateUserModal,
} from "components/database/ModelDataTable/modals"
let selectedRecord
async function selectRecord(record) {
selectedRecord = await api.loadRecord(record.key, {
appname: $store.appname,
instanceId: $backendUiStore.selectedDatabase.id,
})
}
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"
$: userOpen = $backendUiStore.visibleModal === "USER"
$: breadcrumbs = $backendUiStore.breadcrumbs.join(" / ")
</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}
{#if userOpen}
<CreateUserModal {onClosed} />
{/if}
</Modal>
<div class="root">
<div class="node-view">
<div class="database-actions">
<div class="budibase__label--big">{breadcrumbs}</div>
{#if $backendUiStore.selectedDatabase.id}
<ActionButton
primary
on:click={() => {
selectedRecord = null
backendUiStore.actions.modals.show('RECORD')
}}>
Create new record
</ActionButton>
{/if}
</div>
{#if $backendUiStore.selectedDatabase.id}
<ModelDataTable {selectRecord} />
{:else}Please select a database{/if}
</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>
Please select a database

Write Preview
Loading…
Cancel
Save