|
|
|
|
@ -67,7 +67,7 @@
|
|
|
|
|
<button
|
|
|
|
|
v-if="!isFormVisible"
|
|
|
|
|
id="expand_form_button"
|
|
|
|
|
class="btn btn-neutral flex text-white absolute bottom-0 w-full mb-3"
|
|
|
|
|
class="btn btn-neutral flex text-white absolute bottom-0 w-full mb-3 expand-form-button"
|
|
|
|
|
style="width: 96%; margin-left: 2%"
|
|
|
|
|
@click.prevent="[isFormVisible = true, scrollIntoField(currentField)]"
|
|
|
|
|
>
|
|
|
|
|
@ -93,14 +93,14 @@
|
|
|
|
|
<div
|
|
|
|
|
v-show="isFormVisible"
|
|
|
|
|
id="form_container"
|
|
|
|
|
class="shadow-md bg-base-100 absolute bottom-0 w-full border-base-200 border p-4 rounded"
|
|
|
|
|
class="shadow-md bg-base-100 absolute bottom-0 w-full border-base-200 border p-4 rounded form-container"
|
|
|
|
|
:class="{ 'md:bottom-4': isBreakpointMd }"
|
|
|
|
|
:style="{ backgroundColor: backgroundColor }"
|
|
|
|
|
>
|
|
|
|
|
<button
|
|
|
|
|
v-if="!isCompleted"
|
|
|
|
|
id="minimize_form_button"
|
|
|
|
|
class="absolute right-0 top-0"
|
|
|
|
|
class="absolute right-0 top-0 minimize-form-button"
|
|
|
|
|
:class="currentField?.description?.length > 100 ? 'mr-1 mt-1 md:mr-2 md:mt-2': 'mr-2 mt-2 hidden md:block'"
|
|
|
|
|
:title="t('minimize')"
|
|
|
|
|
@click.prevent="minimizeForm"
|
|
|
|
|
@ -119,7 +119,7 @@
|
|
|
|
|
ref="form"
|
|
|
|
|
:action="submitPath"
|
|
|
|
|
method="post"
|
|
|
|
|
class="mx-auto"
|
|
|
|
|
class="mx-auto steps-form"
|
|
|
|
|
:style="{ maxWidth: isBreakpointMd ? '582px' : '' }"
|
|
|
|
|
@submit.prevent="submitStep"
|
|
|
|
|
>
|
|
|
|
|
@ -165,7 +165,7 @@
|
|
|
|
|
v-if="showFieldNames && (currentField.name || currentField.title)"
|
|
|
|
|
:for="currentField.uuid"
|
|
|
|
|
dir="auto"
|
|
|
|
|
class="label text-xl sm:text-2xl py-0 mb-2 sm:mb-3.5"
|
|
|
|
|
class="label text-xl sm:text-2xl py-0 mb-2 sm:mb-3.5 field-name-label"
|
|
|
|
|
:class="{ 'mb-2': !currentField.description }"
|
|
|
|
|
>
|
|
|
|
|
<MarkdownContent
|
|
|
|
|
@ -188,7 +188,7 @@
|
|
|
|
|
<div
|
|
|
|
|
v-if="currentField.description"
|
|
|
|
|
dir="auto"
|
|
|
|
|
class="mb-3 px-1"
|
|
|
|
|
class="mb-3 px-1 field-description-text"
|
|
|
|
|
>
|
|
|
|
|
<MarkdownContent :string="currentField.description" />
|
|
|
|
|
</div>
|
|
|
|
|
@ -226,7 +226,7 @@
|
|
|
|
|
v-if="showFieldNames && (currentField.name || currentField.title)"
|
|
|
|
|
:for="currentField.uuid"
|
|
|
|
|
dir="auto"
|
|
|
|
|
class="label text-xl sm:text-2xl py-0 mb-2 sm:mb-3.5"
|
|
|
|
|
class="label text-xl sm:text-2xl py-0 mb-2 sm:mb-3.5 field-name-label"
|
|
|
|
|
:class="{ 'mb-2': !currentField.description }"
|
|
|
|
|
>
|
|
|
|
|
<MarkdownContent
|
|
|
|
|
@ -245,7 +245,7 @@
|
|
|
|
|
<div
|
|
|
|
|
v-if="currentField.description"
|
|
|
|
|
dir="auto"
|
|
|
|
|
class="mb-3 px-1"
|
|
|
|
|
class="mb-3 px-1 field-description-text"
|
|
|
|
|
>
|
|
|
|
|
<MarkdownContent :string="currentField.description" />
|
|
|
|
|
</div>
|
|
|
|
|
@ -270,7 +270,7 @@
|
|
|
|
|
>
|
|
|
|
|
<label
|
|
|
|
|
:for="option.uuid"
|
|
|
|
|
class="flex items-center space-x-3"
|
|
|
|
|
class="flex items-center space-x-3 radio-label"
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
:id="option.uuid"
|
|
|
|
|
@ -304,7 +304,7 @@
|
|
|
|
|
<div
|
|
|
|
|
v-if="currentField.description"
|
|
|
|
|
dir="auto"
|
|
|
|
|
class="mb-3 px-1"
|
|
|
|
|
class="mb-3 px-1 field-description-text"
|
|
|
|
|
>
|
|
|
|
|
<MarkdownContent :string="currentField.description" />
|
|
|
|
|
</div>
|
|
|
|
|
@ -338,7 +338,7 @@
|
|
|
|
|
>
|
|
|
|
|
<label
|
|
|
|
|
:for="field.uuid"
|
|
|
|
|
class="flex items-center space-x-3"
|
|
|
|
|
class="flex items-center space-x-3 checkbox-label"
|
|
|
|
|
>
|
|
|
|
|
<input
|
|
|
|
|
type="hidden"
|
|
|
|
|
@ -481,7 +481,7 @@
|
|
|
|
|
id="submit_form_button"
|
|
|
|
|
ref="submitButton"
|
|
|
|
|
type="submit"
|
|
|
|
|
class="base-button w-full flex justify-center"
|
|
|
|
|
class="base-button w-full flex justify-center submit-form-button"
|
|
|
|
|
:disabled="isButtonDisabled"
|
|
|
|
|
>
|
|
|
|
|
<span class="flex">
|
|
|
|
|
@ -533,13 +533,13 @@
|
|
|
|
|
v-if="stepFields.length < 80"
|
|
|
|
|
class="flex justify-center mt-3 sm:mt-4 mb-0 sm:mb-1"
|
|
|
|
|
>
|
|
|
|
|
<div class="flex items-center flex-wrap">
|
|
|
|
|
<div class="flex items-center flex-wrap steps-progress">
|
|
|
|
|
<a
|
|
|
|
|
v-for="(step, index) in stepFields"
|
|
|
|
|
:key="step[0].uuid"
|
|
|
|
|
href="#"
|
|
|
|
|
class="inline border border-base-300 h-3 w-3 rounded-full mx-1 mt-1"
|
|
|
|
|
:class="{ 'bg-base-300': index === currentStep, 'bg-base-content': (index < currentStep && stepFields[index].every((f) => !f.required || ![null, undefined, ''].includes(values[f.uuid]))) || isCompleted, 'bg-white': index > currentStep }"
|
|
|
|
|
:class="{ 'bg-base-300 steps-progress-current': index === currentStep, 'bg-base-content': (index < currentStep && stepFields[index].every((f) => !f.required || ![null, undefined, ''].includes(values[f.uuid]))) || isCompleted, 'bg-white': index > currentStep }"
|
|
|
|
|
@click.prevent="isCompleted ? '' : [saveStep(), goToStep(index, true)]"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
|
Alex Turchyn
8 months ago
committed by
GitHub