Fix workflow select components which use objects as options and take initial state from API

This commit is contained in:
Andrew Kingston 2020-09-14 11:51:52 +01:00
parent 9d2f7ed874
commit 55f418bc95
2 changed files with 23 additions and 8 deletions

View File

@ -2,12 +2,19 @@
import { backendUiStore } from "builderStore" import { backendUiStore } from "builderStore"
export let value export let value
let modelId = value ? value._id : "" $: modelId = value ? value._id : ""
$: value = $backendUiStore.models.find(x => x._id === modelId)
function onChange(e) {
value = $backendUiStore.models.find(x => x._id === e.target.value)
}
</script> </script>
<div class="block-field"> <div class="block-field">
<select class="budibase__input" bind:value={modelId}> <select
class="budibase__input"
value={modelId}
on:blur={onChange}
on:change={onChange}>
<option value="">Choose an option</option> <option value="">Choose an option</option>
{#each $backendUiStore.models as model} {#each $backendUiStore.models as model}
<option value={model._id}>{model.name}</option> <option value={model._id}>{model.name}</option>

View File

@ -3,8 +3,12 @@
import { Input, Label } from "@budibase/bbui" import { Input, Label } from "@budibase/bbui"
export let value export let value
let modelId = value && value.model ? value.model._id : "" $: modelId = value && value.model ? value.model._id : ""
$: value.model = $backendUiStore.models.find(x => x._id === modelId) $: schemaFields = Object.keys(value && value.model ? value.model.schema : {})
function onChangeModel(e) {
value.model = $backendUiStore.models.find(x => x._id === e.target.value)
}
function setParsedValue(evt, field) { function setParsedValue(evt, field) {
const fieldSchema = value.model.schema[field] const fieldSchema = value.model.schema[field]
@ -17,7 +21,11 @@
</script> </script>
<div class="block-field"> <div class="block-field">
<select class="budibase__input" bind:value={modelId}> <select
class="budibase__input"
value={modelId}
on:blur={onChangeModel}
on:change={onChangeModel}>
<option value="">Choose an option</option> <option value="">Choose an option</option>
{#each $backendUiStore.models as model} {#each $backendUiStore.models as model}
<option value={model._id}>{model.name}</option> <option value={model._id}>{model.name}</option>
@ -25,10 +33,10 @@
</select> </select>
</div> </div>
{#if value.model} {#if schemaFields.length}
<div class="bb-margin-xl block-field"> <div class="bb-margin-xl block-field">
<Label small forAttr={'fields'}>Fields</Label> <Label small forAttr={'fields'}>Fields</Label>
{#each Object.keys(value.model.schema) as field} {#each schemaFields as field}
<div class="bb-margin-xl"> <div class="bb-margin-xl">
<Input <Input
thin thin