Browse Source

fix: clear icon for year field

pull/6323/head
DarkPhoenix2704 1 year ago
parent
commit
d566cf62a4
  1. 7
      packages/nc-gui/components/cell/YearPicker.vue
  2. 5
      packages/nc-gui/components/smartsheet/column/DefaultValue.vue

7
packages/nc-gui/components/cell/YearPicker.vue

@ -54,7 +54,7 @@ const localState = computed({
} }
if (val?.isValid()) { if (val?.isValid()) {
emit('update:modelValue', Number(val.format('YYYY'))) emit('update:modelValue', val.format('YYYY'))
} }
}, },
}) })
@ -76,7 +76,7 @@ watch(
const placeholder = computed(() => { const placeholder = computed(() => {
if (isEditColumn.value && modelValue === null) { if (isEditColumn.value && modelValue === null) {
return '(Optional)' return 'Select default year (Optional)'
} else if (modelValue === null && showNull.value) { } else if (modelValue === null && showNull.value) {
return 'NULL' return 'NULL'
} else if (isYearInvalid.value) { } else if (isYearInvalid.value) {
@ -110,12 +110,13 @@ useSelectedCellKeyupListener(active, (e: KeyboardEvent) => {
class="!w-full !px-1 !border-none" class="!w-full !px-1 !border-none"
:class="{ 'nc-null': modelValue === null && showNull }" :class="{ 'nc-null': modelValue === null && showNull }"
:placeholder="placeholder" :placeholder="placeholder"
:allow-clear="!readOnly && !localState && !isPk" :allow-clear="(!readOnly && !localState && !isPk) || isEditColumn"
:input-read-only="true" :input-read-only="true"
:open="(readOnly || (localState && isPk)) && !active && !editable ? false : open" :open="(readOnly || (localState && isPk)) && !active && !editable ? false : open"
:dropdown-class-name="`${randomClass} nc-picker-year ${open ? 'active' : ''}`" :dropdown-class-name="`${randomClass} nc-picker-year ${open ? 'active' : ''}`"
@click="open = (active || editable) && !open" @click="open = (active || editable) && !open"
@change="open = (active || editable) && !open" @change="open = (active || editable) && !open"
@ok="open = !open"
> >
<template #suffixIcon></template> <template #suffixIcon></template>
</a-date-picker> </a-date-picker>

5
packages/nc-gui/components/smartsheet/column/DefaultValue.vue

@ -21,7 +21,7 @@ const rowRef = ref({
const cdfValue = computed({ const cdfValue = computed({
get: () => { get: () => {
if (vModel.value.uidt === UITypes.MultiSelect || vModel.value.uidt === UITypes.SingleSelect) { if (vModel.value.uidt === UITypes.MultiSelect || vModel.value.uidt === UITypes.SingleSelect) {
return (vModel.value.cdf ?? '').replace(/^'|'$/g, '') return (vModel.value.cdf ?? '').replaceAll("'", '')
} else if ( } else if (
vModel.value.uidt === UITypes.SingleLineText || vModel.value.uidt === UITypes.SingleLineText ||
vModel.value.uidt === UITypes.LongText || vModel.value.uidt === UITypes.LongText ||
@ -33,7 +33,7 @@ const cdfValue = computed({
vModel.value.uidt === UITypes.Year || vModel.value.uidt === UITypes.Year ||
vModel.value.uidt === UITypes.Date vModel.value.uidt === UITypes.Date
) { ) {
return (vModel.value.cdf ?? '').replace(/^'|'$/g, '') return (vModel.value.cdf ?? '').replace(/^'/, '').replace(/'$/, '')
} }
return vModel.value.cdf return vModel.value.cdf
}, },
@ -52,6 +52,7 @@ useProvideSmartsheetRowStore(vModel, rowRef)
<LazySmartsheetCell :column="vModel" :model-value="cdfValue" :edit-enabled="true" /> <LazySmartsheetCell :column="vModel" :model-value="cdfValue" :edit-enabled="true" />
<component <component
:is="iconMap.close" :is="iconMap.close"
v-if="vModel.uidt !== UITypes.Year"
class="w-4 h-4 cursor-pointer rounded-full !text-black-500 text-gray-500 cursor-pointer hover:bg-gray-50" class="w-4 h-4 cursor-pointer rounded-full !text-black-500 text-gray-500 cursor-pointer hover:bg-gray-50"
@click="cdfValue = null" @click="cdfValue = null"
/> />

Loading…
Cancel
Save