1
0
Fork 0
mirror of synced 2024-09-20 11:27:56 +12:00

Improve table condition editor handling of value types and missing values

This commit is contained in:
Andrew Kingston 2024-07-22 09:21:46 +01:00
parent 27789a59d1
commit d774e30a0a
No known key found for this signature in database

View file

@ -53,17 +53,8 @@
$: count = value?.length
$: conditionText = `${count || "No"} condition${count !== 1 ? "s" : ""} set`
$: type = componentInstance.columnType
$: invalidType = Constants.BannedSearchTypes.includes(type)
$: valueTypeOptions = [
{
label: "Binding",
value: FieldType.STRING,
},
{
label: "Value",
value: type,
},
]
$: valueTypeOptions = getValueTypeOptions(type)
$: hasValueOption = type !== FieldType.STRING
$: operatorOptions = QueryUtils.getValidOperatorsForType({
type,
@ -72,6 +63,22 @@
formulaType: FormulaType.STATIC,
})
const getValueTypeOptions = type => {
let options = [
{
label: "Binding",
value: FieldType.STRING,
},
]
if (type !== FieldType.STRING) {
options.push({
label: "Value",
value: type,
})
}
return options
}
const openDrawer = () => {
tempValue = cloneDeep(value || [])
drawer.show()
@ -87,7 +94,7 @@
id: generate(),
target: targetOptions[0].value,
metadataKey: conditionOptions[0].value,
operator: Constants.OperatorOptions.Equals.value,
operator: operatorOptions[0]?.value,
valueType: FieldType.STRING,
}
tempValue = [...tempValue, condition]
@ -158,6 +165,7 @@
<div
class="condition"
class:update={condition.action === "update"}
class:with-value-option={hasValueOption}
animate:flip={{ duration: flipDuration }}
>
<div
@ -191,13 +199,16 @@
bind:value={condition.operator}
on:change={e => onOperatorChange(condition, e.detail)}
/>
<Select
disabled={condition.noValue || condition.operator === "oneOf"}
options={valueTypeOptions}
bind:value={condition.valueType}
placeholder={null}
on:change={() => onValueTypeChange(condition)}
/>
{#if hasValueOption}
<Select
disabled={condition.noValue ||
condition.operator === "oneOf"}
options={valueTypeOptions}
bind:value={condition.valueType}
placeholder={null}
on:change={() => onValueTypeChange(condition)}
/>
{/if}
{#if type === FieldType.DATETIME && condition.valueType === type}
<DatePicker
placeholder="Value"
@ -259,8 +270,11 @@
}
.condition {
display: grid;
grid-template-columns: auto auto 1fr 1fr auto auto auto 1fr 1fr 1fr auto auto;
grid-template-columns: auto auto 1fr 1fr auto auto auto 1fr 1fr auto auto;
align-items: center;
grid-column-gap: var(--spacing-l);
}
.condition.with-value-option {
grid-template-columns: auto auto 1fr 1fr auto auto auto 1fr 1fr 1fr auto auto;
}
</style>