Merge branch 'develop' into budi-6922-the-number-0-cannot-be-displayed-on-input-number-fields-when
This commit is contained in:
commit
f1cf9c3d41
4 changed files with 127 additions and 57 deletions
|
@ -1,5 +1,5 @@
|
||||||
{
|
{
|
||||||
"version": "2.10.12-alpha.17",
|
"version": "2.10.12-alpha.18",
|
||||||
"npmClient": "yarn",
|
"npmClient": "yarn",
|
||||||
"packages": [
|
"packages": [
|
||||||
"packages/*"
|
"packages/*"
|
||||||
|
|
|
@ -5,7 +5,6 @@
|
||||||
Label,
|
Label,
|
||||||
Select,
|
Select,
|
||||||
Toggle,
|
Toggle,
|
||||||
RadioGroup,
|
|
||||||
Icon,
|
Icon,
|
||||||
DatePicker,
|
DatePicker,
|
||||||
Modal,
|
Modal,
|
||||||
|
@ -26,14 +25,15 @@
|
||||||
ALLOWABLE_STRING_TYPES,
|
ALLOWABLE_STRING_TYPES,
|
||||||
ALLOWABLE_NUMBER_TYPES,
|
ALLOWABLE_NUMBER_TYPES,
|
||||||
SWITCHABLE_TYPES,
|
SWITCHABLE_TYPES,
|
||||||
|
PrettyRelationshipDefinitions,
|
||||||
} from "constants/backend"
|
} from "constants/backend"
|
||||||
import { getAutoColumnInformation, buildAutoColumn } from "builderStore/utils"
|
import { getAutoColumnInformation, buildAutoColumn } from "builderStore/utils"
|
||||||
import ConfirmDialog from "components/common/ConfirmDialog.svelte"
|
import ConfirmDialog from "components/common/ConfirmDialog.svelte"
|
||||||
import { truncate } from "lodash"
|
|
||||||
import ModalBindableInput from "components/common/bindings/ModalBindableInput.svelte"
|
import ModalBindableInput from "components/common/bindings/ModalBindableInput.svelte"
|
||||||
import { getBindings } from "components/backend/DataTable/formula"
|
import { getBindings } from "components/backend/DataTable/formula"
|
||||||
import JSONSchemaModal from "./JSONSchemaModal.svelte"
|
import JSONSchemaModal from "./JSONSchemaModal.svelte"
|
||||||
import { ValidColumnNameRegex } from "@budibase/shared-core"
|
import { ValidColumnNameRegex } from "@budibase/shared-core"
|
||||||
|
import RelationshipSelector from "components/common/RelationshipSelector.svelte"
|
||||||
|
|
||||||
const AUTO_TYPE = "auto"
|
const AUTO_TYPE = "auto"
|
||||||
const FORMULA_TYPE = FIELDS.FORMULA.type
|
const FORMULA_TYPE = FIELDS.FORMULA.type
|
||||||
|
@ -57,6 +57,10 @@
|
||||||
let indexes = [...($tables.selected.indexes || [])]
|
let indexes = [...($tables.selected.indexes || [])]
|
||||||
let isCreating = undefined
|
let isCreating = undefined
|
||||||
|
|
||||||
|
let relationshipPart1 = PrettyRelationshipDefinitions.Many
|
||||||
|
let relationshipPart2 = PrettyRelationshipDefinitions.One
|
||||||
|
|
||||||
|
let relationshipTableIdSecondary = null
|
||||||
let table = $tables.selected
|
let table = $tables.selected
|
||||||
let confirmDeleteDialog
|
let confirmDeleteDialog
|
||||||
let savingColumn
|
let savingColumn
|
||||||
|
@ -74,6 +78,33 @@
|
||||||
editableColumn.constraints.presence = { allowEmpty: false }
|
editableColumn.constraints.presence = { allowEmpty: false }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
let relationshipMap = {
|
||||||
|
[RelationshipType.MANY_TO_ONE]: {
|
||||||
|
part1: PrettyRelationshipDefinitions.MANY,
|
||||||
|
part2: PrettyRelationshipDefinitions.ONE,
|
||||||
|
},
|
||||||
|
[RelationshipType.MANY_TO_MANY]: {
|
||||||
|
part1: PrettyRelationshipDefinitions.MANY,
|
||||||
|
part2: PrettyRelationshipDefinitions.MANY,
|
||||||
|
},
|
||||||
|
[RelationshipType.ONE_TO_MANY]: {
|
||||||
|
part1: PrettyRelationshipDefinitions.ONE,
|
||||||
|
part2: PrettyRelationshipDefinitions.MANY,
|
||||||
|
},
|
||||||
|
}
|
||||||
|
|
||||||
|
$: {
|
||||||
|
if (editableColumn.type === LINK_TYPE) {
|
||||||
|
// Determine the relationship type based on the selected values of both parts
|
||||||
|
editableColumn.relationshipType = Object.entries(relationshipMap).find(
|
||||||
|
([_, parts]) =>
|
||||||
|
parts.part1 === relationshipPart1 && parts.part2 === relationshipPart2
|
||||||
|
)?.[0]
|
||||||
|
// Set the tableId based on the selected table
|
||||||
|
editableColumn.tableId = relationshipTableIdSecondary
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const initialiseField = (field, savingColumn) => {
|
const initialiseField = (field, savingColumn) => {
|
||||||
isCreating = !field
|
isCreating = !field
|
||||||
if (field && !savingColumn) {
|
if (field && !savingColumn) {
|
||||||
|
@ -100,6 +131,16 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
allowedTypes = getAllowedTypes()
|
allowedTypes = getAllowedTypes()
|
||||||
|
|
||||||
|
if (editableColumn.type === LINK_TYPE && editableColumn.tableId) {
|
||||||
|
relationshipTableIdSecondary = editableColumn.tableId
|
||||||
|
if (editableColumn.relationshipType in relationshipMap) {
|
||||||
|
const { part1, part2 } =
|
||||||
|
relationshipMap[editableColumn.relationshipType]
|
||||||
|
relationshipPart1 = part1
|
||||||
|
relationshipPart2 = part2
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
$: initialiseField(field, savingColumn)
|
$: initialiseField(field, savingColumn)
|
||||||
|
@ -157,7 +198,6 @@
|
||||||
!uneditable &&
|
!uneditable &&
|
||||||
editableColumn?.type !== AUTO_TYPE &&
|
editableColumn?.type !== AUTO_TYPE &&
|
||||||
!editableColumn.autocolumn
|
!editableColumn.autocolumn
|
||||||
$: relationshipOptions = getRelationshipOptions(editableColumn)
|
|
||||||
$: external = table.type === "external"
|
$: external = table.type === "external"
|
||||||
// in the case of internal tables the sourceId will just be undefined
|
// in the case of internal tables the sourceId will just be undefined
|
||||||
$: tableOptions = $tables.list.filter(
|
$: tableOptions = $tables.list.filter(
|
||||||
|
@ -288,35 +328,6 @@
|
||||||
return match ? parseInt(match[1]) : 0
|
return match ? parseInt(match[1]) : 0
|
||||||
}
|
}
|
||||||
|
|
||||||
function getRelationshipOptions(field) {
|
|
||||||
if (!field || !field.tableId) {
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
const linkTable = tableOptions?.find(table => table._id === field.tableId)
|
|
||||||
if (!linkTable) {
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
const thisName = truncate(table.name, { length: 14 }),
|
|
||||||
linkName = truncate(linkTable.name, { length: 14 })
|
|
||||||
return [
|
|
||||||
{
|
|
||||||
name: `Many ${thisName} rows → many ${linkName} rows`,
|
|
||||||
alt: `Many ${table.name} rows → many ${linkTable.name} rows`,
|
|
||||||
value: RelationshipType.MANY_TO_MANY,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: `One ${linkName} row → many ${thisName} rows`,
|
|
||||||
alt: `One ${linkTable.name} rows → many ${table.name} rows`,
|
|
||||||
value: RelationshipType.ONE_TO_MANY,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: `One ${thisName} row → many ${linkName} rows`,
|
|
||||||
alt: `One ${table.name} rows → many ${linkTable.name} rows`,
|
|
||||||
value: RelationshipType.MANY_TO_ONE,
|
|
||||||
},
|
|
||||||
]
|
|
||||||
}
|
|
||||||
|
|
||||||
function getAllowedTypes() {
|
function getAllowedTypes() {
|
||||||
if (
|
if (
|
||||||
originalName &&
|
originalName &&
|
||||||
|
@ -547,30 +558,15 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{:else if editableColumn.type === "link"}
|
{:else if editableColumn.type === "link"}
|
||||||
<Select
|
<RelationshipSelector
|
||||||
label="Table"
|
bind:relationshipPart1
|
||||||
disabled={linkEditDisabled}
|
bind:relationshipPart2
|
||||||
bind:value={editableColumn.tableId}
|
bind:relationshipTableIdPrimary={table.name}
|
||||||
options={tableOptions}
|
bind:relationshipTableIdSecondary
|
||||||
getOptionLabel={table => table.name}
|
bind:editableColumn
|
||||||
getOptionValue={table => table._id}
|
{linkEditDisabled}
|
||||||
/>
|
{tableOptions}
|
||||||
{#if relationshipOptions && relationshipOptions.length > 0}
|
{errors}
|
||||||
<RadioGroup
|
|
||||||
disabled={linkEditDisabled}
|
|
||||||
label="Define the relationship"
|
|
||||||
bind:value={editableColumn.relationshipType}
|
|
||||||
options={relationshipOptions}
|
|
||||||
getOptionLabel={option => option.name}
|
|
||||||
getOptionValue={option => option.value}
|
|
||||||
getOptionTitle={option => option.alt}
|
|
||||||
/>
|
|
||||||
{/if}
|
|
||||||
<Input
|
|
||||||
disabled={linkEditDisabled}
|
|
||||||
label={`Column name in other table`}
|
|
||||||
bind:value={editableColumn.fieldName}
|
|
||||||
error={errors.relatedName}
|
|
||||||
/>
|
/>
|
||||||
{:else if editableColumn.type === FORMULA_TYPE}
|
{:else if editableColumn.type === FORMULA_TYPE}
|
||||||
{#if !table.sql}
|
{#if !table.sql}
|
||||||
|
|
|
@ -0,0 +1,69 @@
|
||||||
|
<script>
|
||||||
|
import { Select, Input } from "@budibase/bbui"
|
||||||
|
import { PrettyRelationshipDefinitions } from "constants/backend"
|
||||||
|
|
||||||
|
export let relationshipPart1
|
||||||
|
export let relationshipPart2
|
||||||
|
export let relationshipTableIdPrimary
|
||||||
|
export let relationshipTableIdSecondary
|
||||||
|
export let editableColumn
|
||||||
|
export let linkEditDisabled
|
||||||
|
export let tableOptions
|
||||||
|
export let errors
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div class="relationship-container">
|
||||||
|
<div class="relationship-part">
|
||||||
|
<Select
|
||||||
|
disabled={linkEditDisabled}
|
||||||
|
bind:value={relationshipPart1}
|
||||||
|
options={Object.values(PrettyRelationshipDefinitions)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="relationship-label">in</div>
|
||||||
|
<div class="relationship-part">
|
||||||
|
<Select
|
||||||
|
disabled
|
||||||
|
options={[relationshipTableIdPrimary]}
|
||||||
|
value={relationshipTableIdPrimary}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="relationship-container">
|
||||||
|
<div class="relationship-part">
|
||||||
|
<Select
|
||||||
|
disabled={linkEditDisabled}
|
||||||
|
bind:value={relationshipPart2}
|
||||||
|
options={Object.values(PrettyRelationshipDefinitions)}
|
||||||
|
getOptionLabel={option => "To " + option.toLowerCase()}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="relationship-label">in</div>
|
||||||
|
<div class="relationship-part">
|
||||||
|
<Select
|
||||||
|
disabled={linkEditDisabled}
|
||||||
|
bind:value={relationshipTableIdSecondary}
|
||||||
|
options={tableOptions}
|
||||||
|
getOptionLabel={table => table.name}
|
||||||
|
getOptionValue={table => table._id}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<Input
|
||||||
|
disabled={linkEditDisabled}
|
||||||
|
label={`Column name in other table`}
|
||||||
|
bind:value={editableColumn.fieldName}
|
||||||
|
error={errors.relatedName}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.relationship-container {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.relationship-part {
|
||||||
|
flex-basis: 60%;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -170,6 +170,11 @@ export const RelationshipType = {
|
||||||
MANY_TO_ONE: "many-to-one",
|
MANY_TO_ONE: "many-to-one",
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export const PrettyRelationshipDefinitions = {
|
||||||
|
MANY: "Many rows",
|
||||||
|
ONE: "One row",
|
||||||
|
}
|
||||||
|
|
||||||
export const ALLOWABLE_STRING_OPTIONS = [
|
export const ALLOWABLE_STRING_OPTIONS = [
|
||||||
FIELDS.STRING,
|
FIELDS.STRING,
|
||||||
FIELDS.OPTIONS,
|
FIELDS.OPTIONS,
|
||||||
|
|
Loading…
Reference in a new issue