Merge branch 'fix/13288' of github.com:Budibase/budibase into fix/13288

This commit is contained in:
mike12345567 2024-03-19 14:50:56 +00:00
commit 73a52bce64
8 changed files with 133 additions and 104 deletions

View File

@ -1,5 +1,5 @@
{
"version": "2.22.1",
"version": "2.22.2",
"npmClient": "yarn",
"packages": [
"packages/*",

View File

@ -197,7 +197,9 @@
>
<Icon name="ChevronRight" />
</div>
{#if maximum !== 1}
<div class="footer">File {selectedImageIdx + 1} of {fileCount}</div>
{/if}
</div>
{:else if value?.length}
{#each value as file}

View File

@ -470,7 +470,7 @@
newError.name = `Column name already in use.`
}
if (fieldInfo.type === "auto" && !fieldInfo.subtype) {
if (fieldInfo.type === FieldType.AUTO && !fieldInfo.subtype) {
newError.subtype = `Auto Column requires a type`
}
@ -531,18 +531,18 @@
}}
/>
{#if editableColumn.type === "string"}
{#if editableColumn.type === FieldType.STRING}
<Input
type="number"
label="Max Length"
bind:value={editableColumn.constraints.length.maximum}
/>
{:else if editableColumn.type === "options"}
{:else if editableColumn.type === FieldType.OPTIONS}
<OptionSelectDnD
bind:constraints={editableColumn.constraints}
bind:optionColors={editableColumn.optionColors}
/>
{:else if editableColumn.type === "longform"}
{:else if editableColumn.type === FieldType.LONGFORM}
<div>
<div class="tooltip-alignment">
<Label size="M">Formatting</Label>
@ -560,12 +560,12 @@
text="Enable rich text support (markdown)"
/>
</div>
{:else if editableColumn.type === "array"}
{:else if editableColumn.type === FieldType.ARRAY}
<OptionSelectDnD
bind:constraints={editableColumn.constraints}
bind:optionColors={editableColumn.optionColors}
/>
{:else if editableColumn.type === "datetime" && !editableColumn.autocolumn}
{:else if editableColumn.type === FieldType.DATETIME && !editableColumn.autocolumn}
<div class="split-label">
<div class="label-length">
<Label size="M">Earliest</Label>
@ -604,7 +604,7 @@
</div>
{/if}
<Toggle bind:value={editableColumn.dateOnly} text="Date only" />
{:else if editableColumn.type === "number" && !editableColumn.autocolumn}
{:else if editableColumn.type === FieldType.NUMBER && !editableColumn.autocolumn}
<div class="split-label">
<div class="label-length">
<Label size="M">Min Value</Label>
@ -629,7 +629,7 @@
/>
</div>
</div>
{:else if editableColumn.type === "link"}
{:else if editableColumn.type === FieldType.LINK}
<RelationshipSelector
bind:relationshipPart1
bind:relationshipPart2
@ -703,6 +703,24 @@
thin
text="Allow multiple users"
/>
{:else if editableColumn.type === FieldType.ATTACHMENT}
<Toggle
value={editableColumn.constraints?.length?.maximum !== 1}
on:change={e => {
if (!e.detail) {
editableColumn.constraints ??= { length: {} }
editableColumn.constraints.length ??= {}
editableColumn.constraints.length.maximum = 1
editableColumn.constraints.length.message =
"cannot contain multiple files"
} else {
delete editableColumn.constraints?.length?.maximum
delete editableColumn.constraints?.length?.message
}
}}
thin
text="Allow multiple"
/>
{/if}
{#if editableColumn.type === AUTO_TYPE || editableColumn.autocolumn}
<Select

View File

@ -4,6 +4,16 @@
"composite": true,
"declaration": true,
"sourceMap": true,
"baseUrl": "."
"baseUrl": ".",
"paths": {
"assets/*": ["./assets/*"],
"@budibase/*": [
"../*/src/index.ts",
"../*/src/index.js",
"../*",
"../../node_modules/@budibase/*"
],
"*": ["./src/*"]
}
}
}

View File

@ -0,0 +1,86 @@
<script>
import BlockComponent from "components/BlockComponent.svelte"
import { FieldType } from "@budibase/types"
export let field
export let schema
export let order
const FieldTypeToComponentMap = {
string: "stringfield",
number: "numberfield",
bigint: "bigintfield",
options: "optionsfield",
array: "multifieldselect",
boolean: "booleanfield",
longform: "longformfield",
datetime: "datetimefield",
attachment: "attachmentfield",
link: "relationshipfield",
json: "jsonfield",
barcodeqr: "codescanner",
bb_reference: "bbreferencefield",
}
const getFieldSchema = field => {
const fieldSchemaName = field.field || field.name
if (!fieldSchemaName || !schema?.[fieldSchemaName]) {
return null
}
return schema[fieldSchemaName]
}
const getComponentForField = field => {
const fieldSchema = getFieldSchema(field)
if (!fieldSchema) {
return null
}
const { type } = fieldSchema
return FieldTypeToComponentMap[type]
}
const getPropsForField = field => {
let fieldProps = field._component
? {
...field,
}
: {
field: field.name,
label: field.name,
placeholder: field.name,
_instanceName: field.name,
}
fieldProps = {
...getPropsByType(field),
...fieldProps,
}
return fieldProps
}
function getPropsByType(field) {
const propsMapByType = {
[FieldType.ATTACHMENT]: (_field, schema) => {
return {
maximum: schema?.constraints?.length?.maximum,
}
},
}
const fieldSchema = getFieldSchema(field)
const mapper = propsMapByType[fieldSchema.type]
if (mapper) {
return mapper(field, fieldSchema)
}
}
</script>
{#if getComponentForField(field) && field.active}
<BlockComponent
type={getComponentForField(field)}
props={getPropsForField(field)}
{order}
interactive
name={field?.field}
/>
{/if}

View File

@ -6,6 +6,7 @@
import { Utils } from "@budibase/frontend-core"
import FormBlockWrapper from "./form/FormBlockWrapper.svelte"
import { get, writable } from "svelte/store"
import FormBlockComponent from "./FormBlockComponent.svelte"
export let actionType
export let rowId
@ -23,22 +24,6 @@
const currentStep = writable(1)
setContext("current-step", currentStep)
const FieldTypeToComponentMap = {
string: "stringfield",
number: "numberfield",
bigint: "bigintfield",
options: "optionsfield",
array: "multifieldselect",
boolean: "booleanfield",
longform: "longformfield",
datetime: "datetimefield",
attachment: "attachmentfield",
link: "relationshipfield",
json: "jsonfield",
barcodeqr: "codescanner",
bb_reference: "bbreferencefield",
}
let schema
$: fetchSchema(dataSource)
@ -78,27 +63,6 @@
currentStep.set(newStep + 1)
}
const getPropsForField = field => {
if (field._component) {
return field
}
return {
field: field.name,
label: field.name,
placeholder: field.name,
_instanceName: field.name,
}
}
const getComponentForField = field => {
const fieldSchemaName = field.field || field.name
if (!fieldSchemaName || !schema?.[fieldSchemaName]) {
return null
}
const type = schema[fieldSchemaName].type
return FieldTypeToComponentMap[type]
}
const fetchSchema = async () => {
schema = (await fetchDatasourceSchema(dataSource)) || {}
}
@ -205,15 +169,7 @@
class:mobile={$context.device.mobile}
>
{#each step.fields as field, fieldIdx (`${field.field || field.name}_${fieldIdx}`)}
{#if getComponentForField(field)}
<BlockComponent
type={getComponentForField(field)}
props={getPropsForField(field)}
order={fieldIdx}
interactive
name={field.field}
/>
{/if}
<FormBlockComponent {field} {schema} order={fieldIdx} />
{/each}
</div>
</BlockComponent>

View File

@ -2,6 +2,7 @@
import BlockComponent from "components/BlockComponent.svelte"
import Placeholder from "components/app/Placeholder.svelte"
import { getContext } from "svelte"
import FormBlockComponent from "../FormBlockComponent.svelte"
export let dataSource
export let actionType
@ -14,49 +15,11 @@
export let buttonPosition = "bottom"
export let schema
const FieldTypeToComponentMap = {
string: "stringfield",
number: "numberfield",
bigint: "bigintfield",
options: "optionsfield",
array: "multifieldselect",
boolean: "booleanfield",
longform: "longformfield",
datetime: "datetimefield",
attachment: "attachmentfield",
link: "relationshipfield",
json: "jsonfield",
barcodeqr: "codescanner",
bb_reference: "bbreferencefield",
}
const context = getContext("context")
let formId
$: renderHeader = buttons || title
const getComponentForField = field => {
const fieldSchemaName = field.field || field.name
if (!fieldSchemaName || !schema?.[fieldSchemaName]) {
return null
}
const type = schema[fieldSchemaName].type
return FieldTypeToComponentMap[type]
}
const getPropsForField = field => {
let fieldProps = field._component
? {
...field,
}
: {
field: field.name,
label: field.name,
placeholder: field.name,
_instanceName: field.name,
}
return fieldProps
}
</script>
{#if fields?.length}
@ -132,15 +95,7 @@
<BlockComponent type="container">
<div class="form-block fields" class:mobile={$context.device.mobile}>
{#each fields as field, idx}
{#if getComponentForField(field) && field.active}
<BlockComponent
type={getComponentForField(field)}
props={getPropsForField(field)}
order={idx}
interactive
name={field?.field}
/>
{/if}
<FormBlockComponent {field} {schema} order={idx} />
{/each}
</div>
</BlockComponent>

View File

@ -9,6 +9,7 @@
export let api
export let invertX = false
export let invertY = false
export let schema
const { API, notifications } = getContext("grid")
const imageExtensions = ["png", "tiff", "gif", "raw", "jpg", "jpeg"]
@ -97,6 +98,7 @@
{value}
compact
on:change={e => onChange(e.detail)}
maximum={schema.constraints?.length?.maximum}
{processFiles}
{deleteAttachments}
{handleFileTooLarge}