Merge pull request #8395 from Budibase/pc/backups-ui-fixes

Assorted Backups UI fixes
This commit is contained in:
Peter Clement 2022-10-26 10:03:18 +01:00 committed by GitHub
commit 0dc7463826
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 37 additions and 27 deletions

View File

@ -66,7 +66,7 @@
newValue = newValue.toISOString() newValue = newValue.toISOString()
} }
// If time only set date component to 2000-01-01 // If time only set date component to 2000-01-01
else if (timeOnly) { if (timeOnly) {
// Classic flackpickr causing issues. // Classic flackpickr causing issues.
// When selecting a value for the first time for a "time only" field, // When selecting a value for the first time for a "time only" field,
// the time is always offset by 1 hour for some reason (regardless of time // the time is always offset by 1 hour for some reason (regardless of time

View File

@ -77,7 +77,7 @@
title="Confirm Deletion" title="Confirm Deletion"
> >
Are you sure you wish to delete the backup Are you sure you wish to delete the backup
<i>{row.name}</i> <i>{row.name}?</i>
This action cannot be undone. This action cannot be undone.
</ConfirmDialog> </ConfirmDialog>

View File

@ -37,7 +37,7 @@
let startDate = null let startDate = null
let endDate = null let endDate = null
let filters = getFilters() let filters = getFilters()
let loaded = false
$: page = $pageInfo.page $: page = $pageInfo.page
$: fetchBackups(filterOpt, page, startDate, endDate) $: fetchBackups(filterOpt, page, startDate, endDate)
@ -62,24 +62,31 @@
const schema = { const schema = {
type: { type: {
displayName: "Type", displayName: "Type",
width: "auto",
}, },
createdAt: { createdAt: {
displayName: "Date", displayName: "Date",
width: "auto",
}, },
name: { name: {
displayName: "Name", displayName: "Name",
width: "auto",
}, },
appSize: { appSize: {
displayName: "App size", displayName: "App size",
width: "auto",
}, },
createdBy: { createdBy: {
displayName: "User", displayName: "User",
width: "auto",
}, },
status: { status: {
displayName: "Status", displayName: "Status",
width: "auto",
}, },
actions: { actions: {
displayName: null, displayName: null,
width: "5%",
}, },
} }
@ -154,6 +161,7 @@
onMount(() => { onMount(() => {
fetchBackups(filterOpt, page, startDate, endDate) fetchBackups(filterOpt, page, startDate, endDate)
loaded = true
}) })
</script> </script>
@ -195,12 +203,32 @@
window.open("https://budibase.com/pricing/", "_blank") window.open("https://budibase.com/pricing/", "_blank")
}} }}
> >
View Plans View plans
</Button> </Button>
</div> </div>
</Layout> </Layout>
</Page> </Page>
{:else if backupData?.length > 0} {:else if backupData?.length === 0 && !loaded && !filterOpt && !startDate}
<Page wide={false}>
<div class="align">
<img
width="220px"
height="130px"
src={BackupsDefault}
alt="BackupsDefault"
/>
<Layout gap="S">
<Heading>You have no backups yet</Heading>
<div class="opacity">
<Body size="S">You can manually backup your app any time</Body>
</div>
<div class="padding">
<Button on:click={modal.show} cta>Create Backup</Button>
</div>
</Layout>
</div>
</Page>
{:else if loaded}
<Layout noPadding gap="M" alignContent="start"> <Layout noPadding gap="M" alignContent="start">
<div class="search"> <div class="search">
<div class="select"> <div class="select">
@ -235,6 +263,7 @@
<div> <div>
<Table <Table
{schema} {schema}
disableSorting
allowSelectRows={false} allowSelectRows={false}
allowEditColumns={false} allowEditColumns={false}
allowEditRows={false} allowEditRows={false}
@ -255,26 +284,6 @@
</div> </div>
</div> </div>
</Layout> </Layout>
{:else if backupData?.length === 0}
<Page wide={false}>
<div class="align">
<img
width="200px"
height="120px"
src={BackupsDefault}
alt="BackupsDefault"
/>
<Layout gap="S">
<Heading>You have no backups yet</Heading>
<div class="opacity">
<Body size="S">You can manually backup your app any time</Body>
</div>
<div class="padding">
<Button on:click={modal.show} cta>Create Backup</Button>
</div>
</Layout>
</div>
</Page>
{/if} {/if}
</div> </div>

View File

@ -13,6 +13,7 @@
<ModalContent <ModalContent
onConfirm={() => createManualBackup(name)} onConfirm={() => createManualBackup(name)}
title="Create new backup" title="Create new backup"
diabled={!name}
confirmText="Create" confirmText="Create"
><Input label="Backup name" bind:value={name} /></ModalContent ><Input label="Backup name" bind:value={name} /></ModalContent
> >