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

some css fixes for autoscreen ui work

This commit is contained in:
Peter Clement 2021-12-03 14:27:38 +00:00
parent d818bd6dfa
commit 5e5f1d8e1b
3 changed files with 5 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
packages/builder/src/components/backend/TableNavigator/modals/CreateTableModal.svelte
View File

@ -1,6 +1,5 @@
<script> <script>
import { goto, url } from "@roxi/routify" import { goto, url } from "@roxi/routify"
import { store } from "builderStore"
import { tables } from "stores/backend" import { tables } from "stores/backend"
import { notifications } from "@budibase/bbui" import { notifications } from "@budibase/bbui"
import { import {
@ -13,24 +12,13 @@
} from "@budibase/bbui" } from "@budibase/bbui"
import TableDataImport from "../TableDataImport.svelte" import TableDataImport from "../TableDataImport.svelte"
import analytics, { Events } from "analytics" import analytics, { Events } from "analytics"
import screenTemplates from "builderStore/store/screenTemplates"
import { buildAutoColumn, getAutoColumnInformation } from "builderStore/utils" import { buildAutoColumn, getAutoColumnInformation } from "builderStore/utils"
import { NEW_ROW_TEMPLATE } from "builderStore/store/screenTemplates/newRowScreen"
import { ROW_DETAIL_TEMPLATE } from "builderStore/store/screenTemplates/rowDetailScreen"
import { ROW_LIST_TEMPLATE } from "builderStore/store/screenTemplates/rowListScreen"
const defaultScreens = [
NEW_ROW_TEMPLATE,
ROW_DETAIL_TEMPLATE,
ROW_LIST_TEMPLATE,
]
$: tableNames = $tables.list.map(table => table.name) $: tableNames = $tables.list.map(table => table.name)
export let name export let name
let dataImport let dataImport
let error = "" let error = ""
let createAutoscreens = true
let autoColumns = getAutoColumnInformation() let autoColumns = getAutoColumnInformation()
function addAutoColumns(tableName, schema) { function addAutoColumns(tableName, schema) {
@ -69,27 +57,6 @@
notifications.success(`Table ${name} created successfully.`) notifications.success(`Table ${name} created successfully.`)
analytics.captureEvent(Events.TABLE.CREATED, { name }) analytics.captureEvent(Events.TABLE.CREATED, { name })
// Create auto screens
if (createAutoscreens) {
const screens = screenTemplates($store, [table])
.filter(template => defaultScreens.includes(template.id))
.map(template => template.create())
for (let screen of screens) {
// Record the table that created this screen so we can link it later
screen.autoTableId = table._id
await store.actions.screens.create(screen)
}
// Create autolink to newly created list screen
const listScreen = screens.find(screen =>
screen.props._instanceName.endsWith("List")
)
await store.actions.components.links.save(
listScreen.routing.route,
table.name
)
}
// Navigate to new table // Navigate to new table
const currentUrl = $url() const currentUrl = $url()
const path = currentUrl.endsWith("data") const path = currentUrl.endsWith("data")
@ -128,10 +95,6 @@
</div> </div>
<Divider /> <Divider />
</div> </div>
<Toggle
text="Generate screens in Design section"
bind:value={createAutoscreens}
/>
<div> <div>
<Layout gap="XS" noPadding> <Layout gap="XS" noPadding>
<Label grey extraSmall>Create Table from CSV (Optional)</Label> <Label grey extraSmall>Create Table from CSV (Optional)</Label>

2
packages/builder/src/components/design/NavigationPanel/NewScreenModal.svelte
View File

@ -70,7 +70,7 @@
disabled={!selectedScreens.length} disabled={!selectedScreens.length}
size="L" size="L"
> >
<Body size="XS" <Body size="S"
>Please select the screens you would like to add to your application. >Please select the screens you would like to add to your application.
Autogenerated screens come with CRUD functionality.</Body Autogenerated screens come with CRUD functionality.</Body
> >

11
packages/builder/src/pages/builder/app/[application]/design/[assetType]/_layout.svelte
View File

@ -179,7 +179,7 @@
<Layout gap="S" justifyItems="center"> <Layout gap="S" justifyItems="center">
<img class="img-size" alt="logo" src={Logo} /> <img class="img-size" alt="logo" src={Logo} />
<div class="new-screen-text"> <div class="new-screen-text">
<Detail size="M">Let's add some life to this screen</Detail> <Detail size="M">LET’S BRING THIS APP TO LIFE</Detail>
</div> </div>
<Button on:click={() => showModal()} size="M" cta> <Button on:click={() => showModal()} size="M" cta>
<div class="new-screen-button"> <div class="new-screen-button">
@ -290,12 +290,9 @@
} }
.centered { .centered {
top: 0; width: calc(100% - 350px);
bottom: 0; height: calc(100% - 100px);
left: 10%; position: absolute;
right: 0;
width: 100%;
height: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;