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

Trigger a redraw of the form step contents when the step index change

This commit is contained in:
Dean 2024-01-09 10:08:58 +00:00
parent b41f83dc9d
commit c039b0421d
1 changed files with 67 additions and 64 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

131
packages/client/src/components/app/blocks/MultiStepFormblock.svelte
View File

@ -122,75 +122,78 @@
} }
</script> </script>
<FormBlockWrapper {actionType} {dataSource} {rowId} {noRowsMessage}> {#key $currentStep}
<BlockComponent <FormBlockWrapper {actionType} {dataSource} {rowId} {noRowsMessage}>
type="form" <BlockComponent
context="form" type="form"
props={{ context="form"
dataSource, props={{
actionType: actionType === "Create" ? "Create" : "Update", dataSource,
readonly: actionType === "View", actionType: actionType === "Create" ? "Create" : "Update",
}} readonly: actionType === "View",
styles={{ }}
normal: { styles={{
width: "600px", normal: {
"margin-left": "auto", width: "600px",
"margin-right": "auto", "margin-left": "auto",
}, "margin-right": "auto",
}} },
> }}
{#each enrichedSteps as step, stepIdx} >
<BlockComponent {`Current step internal ${$currentStep + ""}`}
type="formstep" {#each enrichedSteps as step, stepIdx}
props={{ step: stepIdx + 1, _instanceName: `Step ${stepIdx + 1}` }}
>
<BlockComponent <BlockComponent
type="container" type="formstep"
props={{ props={{ step: stepIdx + 1, _instanceName: `Step ${stepIdx + 1}` }}
gap: "M",
direction: "column",
hAlign: "stretch",
vAlign: "top",
size: "shrink",
}}
> >
<BlockComponent type="container" order={0}>
<BlockComponent type="heading" props={{ text: step.title }} />
</BlockComponent>
<BlockComponent type="text" props={{ text: step.desc }} order={1} />
<BlockComponent type="container" order={2}>
<div
class="form-block fields"
class:mobile={$context.device.mobile}
>
{#each step.fields as field, fieldIdx (`${field.field || field.name}_${stepIdx}_${fieldIdx}`)}
{#if getComponentForField(field)}
<BlockComponent
type={getComponentForField(field)}
props={getPropsForField(field)}
order={fieldIdx}
interactive
name={field.field}
/>
{/if}
{/each}
</div>
</BlockComponent>
<BlockComponent <BlockComponent
type="buttongroup" type="container"
props={{ buttons: step.buttons }} props={{
styles={{ gap: "M",
normal: { direction: "column",
"margin-top": "16px", hAlign: "stretch",
}, vAlign: "top",
size: "shrink",
}} }}
order={3} >
/> <BlockComponent type="container" order={0}>
<BlockComponent type="heading" props={{ text: step.title }} />
</BlockComponent>
<BlockComponent type="text" props={{ text: step.desc }} order={1} />
<BlockComponent type="container" order={2}>
<div
class="form-block fields"
class:mobile={$context.device.mobile}
>
{#each step.fields as field, fieldIdx (`${field.field || field.name}_${stepIdx}_${fieldIdx}`)}
{#if getComponentForField(field)}
<BlockComponent
type={getComponentForField(field)}
props={getPropsForField(field)}
order={fieldIdx}
interactive
name={field.field}
/>
{/if}
{/each}
</div>
</BlockComponent>
<BlockComponent
type="buttongroup"
props={{ buttons: step.buttons }}
styles={{
normal: {
"margin-top": "16px",
},
}}
order={3}
/>
</BlockComponent>
</BlockComponent> </BlockComponent>
</BlockComponent> {/each}
{/each} </BlockComponent>
</BlockComponent> </FormBlockWrapper>
</FormBlockWrapper> {/key}
<style> <style>
.fields { .fields {