update FilterEditor and SaveFields drawers

This commit is contained in:
Keviin Åberg Kultalahti 2021-04-23 08:30:23 +02:00
parent 79366072dc
commit 2edc795185
2 changed files with 25 additions and 38 deletions

View File

@ -1,5 +1,5 @@
<script> <script>
import { Label, Button, Spacer, Select, Input } from "@budibase/bbui" import { Label, ActionButton, Button, Spacer, Select, Input } from "@budibase/bbui"
import { store, currentAsset } from "builderStore" import { store, currentAsset } from "builderStore"
import { getBindableProperties } from "builderStore/dataBinding" import { getBindableProperties } from "builderStore/dataBinding"
import { createEventDispatcher } from "svelte" import { createEventDispatcher } from "svelte"
@ -69,13 +69,10 @@
value={field[1]} value={field[1]}
bindings={bindableProperties} bindings={bindableProperties}
on:change={event => updateFieldValue(idx, event.detail)} /> on:change={event => updateFieldValue(idx, event.detail)} />
<div class="remove-field-container"> <ActionButton
<Button
icon="Close"
size="S"
quiet quiet
icon="Delete"
on:click={() => removeField(field[0])} /> on:click={() => removeField(field[0])} />
</div>
{/each} {/each}
<div> <div>
<Spacer small /> <Spacer small />
@ -85,9 +82,3 @@
</Button> </Button>
</div> </div>
{/if} {/if}
<style>
.remove-field-container :global(button) {
vertical-align: bottom;
}
</style>

View File

@ -36,13 +36,10 @@
</script> </script>
<Button secondary wide on:click={drawer.show}>Define Filters</Button> <Button secondary wide on:click={drawer.show}>Define Filters</Button>
<Drawer bind:this={drawer} title={'Filtering'}> <Drawer bind:this={drawer} title='Filtering'>
<heading slot="buttons"> <Button cta slot="buttons" on:click={saveFilter}>Save</Button>
<Button thin blue on:click={saveFilter}>Save</Button> <div class="root" slot="body">
</heading> <Body s>
<div slot="body">
<div class="root">
<Body small grey>
{#if !Object.keys(tempValue || {}).length} {#if !Object.keys(tempValue || {}).length}
Add your first filter column. Add your first filter column.
{:else} {:else}
@ -59,7 +56,6 @@
on:change={onFieldsChanged} /> on:change={onFieldsChanged} />
</div> </div>
</div> </div>
</div>
</Drawer> </Drawer>
<style> <style>
@ -74,7 +70,7 @@
display: grid; display: grid;
column-gap: var(--spacing-l); column-gap: var(--spacing-l);
row-gap: var(--spacing-s); row-gap: var(--spacing-s);
align-items: center;
grid-template-columns: auto 1fr auto 1fr auto; grid-template-columns: auto 1fr auto 1fr auto;
align-items: baseline;
} }
</style> </style>