Browse Source

Nc fix/select type default value update issue if option is new (#8638)

* fix(nc-gui): update field modal column type search by it displayed name instead of UITypes

* fix(nc-gui): select type default value update issue if we create new column

* fix(nc-gui): refactor select type default value update code

* fix(nc-gui): allow search column type by it's type as well as display text
pull/8645/head
Ramesh Mane 6 months ago committed by GitHub
parent
commit
84fb8299bc
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
  1. 8
      packages/nc-gui/components/smartsheet/column/EditOrAdd.vue
  2. 12
      packages/nc-gui/components/smartsheet/column/SelectOptions.vue
  3. 7
      packages/nc-gui/components/smartsheet/column/UITypesOptionsWithSearch.vue

8
packages/nc-gui/components/smartsheet/column/EditOrAdd.vue

@ -269,6 +269,13 @@ const submitBtnLabel = computed(() => {
loadingLabel: `${isEdit.value && !props.columnLabel ? t('general.updating') : t('general.saving')} ${columnLabel.value}`, loadingLabel: `${isEdit.value && !props.columnLabel ? t('general.updating') : t('general.saving')} ${columnLabel.value}`,
} }
}) })
const filterOption = (input: string, option: { value: UITypes }) => {
return (
option.value.toLowerCase().includes(input.toLowerCase()) ||
(UITypesName[option.value] && UITypesName[option.value].toLowerCase().includes(input.toLowerCase()))
)
}
</script> </script>
<template> <template>
@ -329,6 +336,7 @@ const submitBtnLabel = computed(() => {
class="nc-column-type-input !rounded-lg" class="nc-column-type-input !rounded-lg"
:disabled="isKanban || readOnly || (isEdit && !!onlyNameUpdateOnEditColumns.find((col) => col === formState.uidt))" :disabled="isKanban || readOnly || (isEdit && !!onlyNameUpdateOnEditColumns.find((col) => col === formState.uidt))"
dropdown-class-name="nc-dropdown-column-type border-1 !rounded-lg border-gray-200" dropdown-class-name="nc-dropdown-column-type border-1 !rounded-lg border-gray-200"
:filter-option="filterOption"
@dropdown-visible-change="onDropdownChange" @dropdown-visible-change="onDropdownChange"
@change="onUidtOrIdTypeChange" @change="onUidtOrIdTypeChange"
@dblclick="showDeprecated = !showDeprecated" @dblclick="showDeprecated = !showDeprecated"

12
packages/nc-gui/components/smartsheet/column/SelectOptions.vue

@ -22,7 +22,7 @@ const emit = defineEmits(['update:value'])
const vModel = useVModel(props, 'value', emit) const vModel = useVModel(props, 'value', emit)
const { setAdditionalValidations, validateInfos } = useColumnCreateStoreOrThrow() const { setAdditionalValidations, validateInfos, isEdit } = useColumnCreateStoreOrThrow()
// const { base } = storeToRefs(useBase()) // const { base } = storeToRefs(useBase())
@ -186,7 +186,7 @@ const syncOptions = () => {
return renderA - renderB return renderA - renderB
}) })
.map((op) => { .map((op) => {
const { index: _i, status: _s, ...rest } = op const { status: _s, ...rest } = op
return rest return rest
}) })
} }
@ -221,7 +221,13 @@ const removeRenderedOption = (index: number) => {
} }
const optionChanged = (changedElement: Option) => { const optionChanged = (changedElement: Option) => {
const changedDefaultOptionIndex = defaultOption.value.findIndex((o) => o.id === changedElement.id) const changedDefaultOptionIndex = defaultOption.value.findIndex((o) => {
if (o.id !== undefined && changedElement.id !== undefined) {
return o.id === changedElement.id
} else {
return o.index === changedElement.index
}
})
if (changedDefaultOptionIndex !== -1) { if (changedDefaultOptionIndex !== -1) {
if (vModel.value.uidt === UITypes.SingleSelect) { if (vModel.value.uidt === UITypes.SingleSelect) {

7
packages/nc-gui/components/smartsheet/column/UITypesOptionsWithSearch.vue

@ -13,7 +13,12 @@ const { options } = toRefs(props)
const searchQuery = ref('') const searchQuery = ref('')
const filteredOptions = computed( const filteredOptions = computed(
() => options.value?.filter((c) => c.name.toLowerCase().includes(searchQuery.value.toLowerCase())) ?? [], () =>
options.value?.filter(
(c) =>
c.name.toLowerCase().includes(searchQuery.value.toLowerCase()) ||
(UITypesName[c.name] && UITypesName[c.name].toLowerCase().includes(searchQuery.value.toLowerCase())),
) ?? [],
) )
const inputRef = ref() const inputRef = ref()

Loading…
Cancel
Save