Provide additional form context so that bindings for special data types work as intended

This commit is contained in:
Andrew Kingston 2021-08-31 12:26:52 +01:00
parent 51e48f343f
commit 706a4e8dd7
2 changed files with 25 additions and 0 deletions

View File

@ -25,6 +25,7 @@
const labelPosition = fieldGroupContext?.labelPosition || "above" const labelPosition = fieldGroupContext?.labelPosition || "above"
const formField = formApi?.registerField( const formField = formApi?.registerField(
field, field,
type,
defaultValue, defaultValue,
disabled, disabled,
validation, validation,

View File

@ -26,6 +26,7 @@
// Reactive derived stores to derive form state from field array // Reactive derived stores to derive form state from field array
$: values = deriveFieldProperty(fields, f => f.fieldState.value) $: values = deriveFieldProperty(fields, f => f.fieldState.value)
$: errors = deriveFieldProperty(fields, f => f.fieldState.error) $: errors = deriveFieldProperty(fields, f => f.fieldState.error)
$: enrichments = deriveBindingEnrichments(fields)
$: valid = !Object.values($errors).some(error => error != null) $: valid = !Object.values($errors).some(error => error != null)
// Derive whether the current form step is valid // Derive whether the current form step is valid
@ -57,6 +58,26 @@
}) })
} }
// Derives any enrichments which need to be made so that bindings work for
// special data types like attachments. Relationships are currently not
// handled as we don't have the primaryDisplay field that is required.
const deriveBindingEnrichments = fieldStores => {
return derived(fieldStores, fieldValues => {
let enrichments = {}
fieldValues.forEach(field => {
if (field.type === "attachment") {
const value = field.fieldState.value
let url = null
if (Array.isArray(value) && value[0] != null) {
url = value[0].url
}
enrichments[`${field.name}_first`] = url
}
})
return enrichments
})
}
// Searches the field array for a certain field // Searches the field array for a certain field
const getField = name => { const getField = name => {
return fields.find(field => get(field).name === name) return fields.find(field => get(field).name === name)
@ -65,6 +86,7 @@
const formApi = { const formApi = {
registerField: ( registerField: (
field, field,
type,
defaultValue = null, defaultValue = null,
fieldDisabled = false, fieldDisabled = false,
validationRules, validationRules,
@ -100,6 +122,7 @@
// Construct field info // Construct field info
const fieldInfo = writable({ const fieldInfo = writable({
name: field, name: field,
type,
step: step || 1, step: step || 1,
fieldState: { fieldState: {
fieldId: `id-${generateID()}`, fieldId: `id-${generateID()}`,
@ -262,6 +285,7 @@
$: dataContext = { $: dataContext = {
...initialValues, ...initialValues,
...$values, ...$values,
...$enrichments,
// These static values are prefixed to avoid clashes with actual columns // These static values are prefixed to avoid clashes with actual columns
__valid: valid, __valid: valid,