|
|
@ -224,7 +224,7 @@ onMounted(() => { |
|
|
|
<Transition :name="`slide-${transitionName}`" :duration="transitionDuration" mode="out-in"> |
|
|
|
<Transition :name="`slide-${transitionName}`" :duration="transitionDuration" mode="out-in"> |
|
|
|
<div |
|
|
|
<div |
|
|
|
ref="el" |
|
|
|
ref="el" |
|
|
|
:key="field.title" |
|
|
|
:key="field?.title" |
|
|
|
class="color-transition h-full flex flex-col mt-6 gap-4 w-full max-w-[max(33%,600px)] m-auto" |
|
|
|
class="color-transition h-full flex flex-col mt-6 gap-4 w-full max-w-[max(33%,600px)] m-auto" |
|
|
|
> |
|
|
|
> |
|
|
|
<div v-if="field && !submitted" class="flex flex-col gap-2"> |
|
|
|
<div v-if="field && !submitted" class="flex flex-col gap-2"> |
|
|
@ -239,16 +239,18 @@ onMounted(() => { |
|
|
|
<LazySmartsheetHeaderCell |
|
|
|
<LazySmartsheetHeaderCell |
|
|
|
v-else |
|
|
|
v-else |
|
|
|
:class="field.uidt === UITypes.Checkbox ? 'nc-form-column-label__checkbox' : ''" |
|
|
|
:class="field.uidt === UITypes.Checkbox ? 'nc-form-column-label__checkbox' : ''" |
|
|
|
:column="{ ...field, title: field.label || field.title }" |
|
|
|
:column="{ meta: {}, ...field, title: field.label || field.title }" |
|
|
|
:required="isRequired(field, field.required)" |
|
|
|
:required="isRequired(field, field.required)" |
|
|
|
:hide-menu="true" |
|
|
|
:hide-menu="true" |
|
|
|
/> |
|
|
|
/> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div> |
|
|
|
<div v-if="field.title"> |
|
|
|
<LazySmartsheetVirtualCell |
|
|
|
<LazySmartsheetVirtualCell |
|
|
|
v-if="isVirtualCol(field)" |
|
|
|
v-if="isVirtualCol(field)" |
|
|
|
|
|
|
|
v-model="formState[field.title]" |
|
|
|
class="mt-0 nc-input" |
|
|
|
class="mt-0 nc-input" |
|
|
|
|
|
|
|
:row="{ row: {}, oldRow: {}, rowMeta: {} }" |
|
|
|
:data-cy="`nc-survey-form__input-${field.title.replaceAll(' ', '')}`" |
|
|
|
:data-cy="`nc-survey-form__input-${field.title.replaceAll(' ', '')}`" |
|
|
|
:column="field" |
|
|
|
:column="field" |
|
|
|
/> |
|
|
|
/> |
|
|
@ -316,7 +318,7 @@ onMounted(() => { |
|
|
|
? 'transform translate-y-[2px] translate-x-[2px] after:(!ring !ring-accent !ring-opacity-100)' |
|
|
|
? 'transform translate-y-[2px] translate-x-[2px] after:(!ring !ring-accent !ring-opacity-100)' |
|
|
|
: '', |
|
|
|
: '', |
|
|
|
]" |
|
|
|
]" |
|
|
|
@click="goNext" |
|
|
|
@click="goNext()" |
|
|
|
> |
|
|
|
> |
|
|
|
<Transition name="fade"> |
|
|
|
<Transition name="fade"> |
|
|
|
<span v-if="!v$.localState[field.title]?.$error" class="uppercase text-white">Ok</span> |
|
|
|
<span v-if="!v$.localState[field.title]?.$error" class="uppercase text-white">Ok</span> |
|
|
@ -396,7 +398,7 @@ onMounted(() => { |
|
|
|
" |
|
|
|
" |
|
|
|
class="p-0.5 flex items-center group color-transition" |
|
|
|
class="p-0.5 flex items-center group color-transition" |
|
|
|
data-cy="nc-survey-form__icon-prev" |
|
|
|
data-cy="nc-survey-form__icon-prev" |
|
|
|
@click="goPrevious" |
|
|
|
@click="goPrevious()" |
|
|
|
> |
|
|
|
> |
|
|
|
<MdiChevronLeft :class="isFirst ? 'text-gray-300' : 'group-hover:text-accent'" class="text-2xl md:text-md" /> |
|
|
|
<MdiChevronLeft :class="isFirst ? 'text-gray-300' : 'group-hover:text-accent'" class="text-2xl md:text-md" /> |
|
|
|
</button> |
|
|
|
</button> |
|
|
@ -415,7 +417,7 @@ onMounted(() => { |
|
|
|
" |
|
|
|
" |
|
|
|
class="p-0.5 flex items-center group color-transition" |
|
|
|
class="p-0.5 flex items-center group color-transition" |
|
|
|
data-cy="nc-survey-form__icon-next" |
|
|
|
data-cy="nc-survey-form__icon-next" |
|
|
|
@click="goNext" |
|
|
|
@click="goNext()" |
|
|
|
> |
|
|
|
> |
|
|
|
<MdiChevronRight |
|
|
|
<MdiChevronRight |
|
|
|
:class="[isLast || v$.localState[field.title]?.$error ? 'text-gray-300' : 'group-hover:text-accent']" |
|
|
|
:class="[isLast || v$.localState[field.title]?.$error ? 'text-gray-300' : 'group-hover:text-accent']" |
|
|
|