CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-09-30 00:57:16 +13:00
Code Issues Projects Releases Wiki Activity

Update DeleteRow button action to take explicit props and fix massive width

Browse source
This commit is contained in:
Andrew Kingston 2021-03-19 14:04:37 +00:00
parent b9c43052f6
commit fecf35dc46
1 changed files with 26 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

74
packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/actions/DeleteRow.svelte
View file

@ -1,53 +1,35 @@
<script>
import { Select, Label } from "@budibase/bbui"
import { store, currentAsset } from "builderStore"
import {
getDataProviderComponents,
getDatasourceForProvider,
getSchemaForDatasource,
} from "builderStore/dataBinding"
import { store, currentAsset, backendUiStore } from "builderStore"
import { getBindableProperties } from "builderStore/dataBinding"
import DrawerBindableInput from "components/common/DrawerBindableInput.svelte"
export let parameters
$: dataProviderComponents = getDataProviderComponents(
$currentAsset,
$store.selectedComponentId
)
$: {
// Automatically set rev and table ID based on row ID
if (parameters.providerId) {
parameters.rowId = `{{ ${parameters.providerId}._id }}`
parameters.revId = `{{ ${parameters.providerId}._rev }}`
const providerComponent = dataProviderComponents.find(
provider => provider._id === parameters.providerId
)
const datasource = getDatasourceForProvider(
$currentAsset,
providerComponent
)
const { table } = getSchemaForDatasource(datasource)
if (table) {
parameters.tableId = table._id
}
}
}
$: tableOptions = $backendUiStore.tables || []
$: bindings = getBindableProperties($currentAsset, $store.selectedComponentId)
</script>
<div class="root">
{#if dataProviderComponents.length === 0}
<div class="cannot-use">
Delete row can only be used within a component that provides data, such as
a List
</div>
{:else}
<Label small>Datasource</Label>
<Select thin secondary bind:value={parameters.providerId}>
<option value="" />
{#each dataProviderComponents as provider}
<option value={provider._id}>{provider._instanceName}</option>
{/each}
</Select>
{/if}
<Label small>Table</Label>
<Select thin secondary bind:value={parameters.tableId}>
<option value="" />
{#each tableOptions as table}
<option value={table._id}>{table.name}</option>
{/each}
</Select>
<Label small>Row ID</Label>
<DrawerBindableInput
{bindings}
value={parameters.rowId}
on:change={value => (parameters.rowId = value.detail)} />
<Label small>Row Rev</Label>
<DrawerBindableInput
{bindings}
value={parameters.revId}
on:change={value => (parameters.revId = value.detail)} />
</div>
<style>
@ -57,11 +39,7 @@
row-gap: var(--spacing-s);
grid-template-columns: auto 1fr;
align-items: baseline;
}
.cannot-use {
color: var(--red);
font-size: var(--font-size-s);
margin: auto;
max-width: 800px;
margin: 0 auto;
}
</style>