|
|
|
@ -388,7 +388,7 @@ watch(view, (nextView) => {
|
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<template> |
|
|
|
|
<a-row v-if="submitted" class="h-full" data-pw="nc-form-wrapper-submit"> |
|
|
|
|
<a-row v-if="submitted" class="h-full" data-nc="nc-form-wrapper-submit"> |
|
|
|
|
<a-col :span="24"> |
|
|
|
|
<div v-if="formViewData" class="items-center justify-center text-center mt-2"> |
|
|
|
|
<a-alert type="success"> |
|
|
|
@ -408,7 +408,7 @@ watch(view, (nextView) => {
|
|
|
|
|
</a-col> |
|
|
|
|
</a-row> |
|
|
|
|
|
|
|
|
|
<a-row v-else class="h-full flex" data-pw="nc-form-wrapper"> |
|
|
|
|
<a-row v-else class="h-full flex" data-nc="nc-form-wrapper"> |
|
|
|
|
<a-col v-if="isEditable" :span="8" class="shadow p-2 md:p-4 h-full overflow-auto scrollbar-thin-dull nc-form-left-drawer"> |
|
|
|
|
<div class="flex flex-wrap gap-2"> |
|
|
|
|
<div class="flex-1 text-lg"> |
|
|
|
@ -420,7 +420,7 @@ watch(view, (nextView) => {
|
|
|
|
|
v-if="hiddenColumns.length" |
|
|
|
|
type="button" |
|
|
|
|
class="nc-form-add-all color-transition bg-white transform hover:(text-primary ring ring-accent ring-opacity-100) active:translate-y-[1px] px-2 py-1 shadow-md rounded" |
|
|
|
|
data-pw="nc-form-add-all" |
|
|
|
|
data-nc="nc-form-add-all" |
|
|
|
|
@click="addAllColumns" |
|
|
|
|
> |
|
|
|
|
<!-- Add all --> |
|
|
|
@ -431,7 +431,7 @@ watch(view, (nextView) => {
|
|
|
|
|
v-if="localColumns.length" |
|
|
|
|
type="button" |
|
|
|
|
class="nc-form-remove-all color-transition bg-white transform hover:(text-primary ring ring-accent ring-opacity-100) active:translate-y-[1px] px-2 py-1 shadow-md rounded" |
|
|
|
|
data-pw="nc-form-remove-all" |
|
|
|
|
data-nc="nc-form-remove-all" |
|
|
|
|
@click="removeAllColumns" |
|
|
|
|
> |
|
|
|
|
<!-- Remove all --> |
|
|
|
@ -453,7 +453,7 @@ watch(view, (nextView) => {
|
|
|
|
|
<a-card |
|
|
|
|
size="small" |
|
|
|
|
class="!border-0 color-transition cursor-pointer item hover:(bg-primary ring-1 ring-accent ring-opacity-100) bg-opacity-10 !rounded !shadow-lg" |
|
|
|
|
:data-pw="`nc-form-hidden-column-${element.label || element.title}`" |
|
|
|
|
:data-nc="`nc-form-hidden-column-${element.label || element.title}`" |
|
|
|
|
@mousedown="moved = false" |
|
|
|
|
@mousemove="moved = false" |
|
|
|
|
@mouseup="handleMouseUp(element, index)" |
|
|
|
@ -481,7 +481,7 @@ watch(view, (nextView) => {
|
|
|
|
|
<template #footer> |
|
|
|
|
<div |
|
|
|
|
class="my-4 select-none border-dashed border-2 border-gray-400 py-3 text-gray-400 text-center nc-drag-n-drop-to-hide" |
|
|
|
|
data-pw="nc-drag-n-drop-to-hide" |
|
|
|
|
data-nc="nc-drag-n-drop-to-hide" |
|
|
|
|
> |
|
|
|
|
<!-- Drag and drop fields here to hide --> |
|
|
|
|
{{ $t('msg.info.dragDropHide') }} |
|
|
|
@ -539,7 +539,7 @@ watch(view, (nextView) => {
|
|
|
|
|
hide-details |
|
|
|
|
placeholder="Form Title" |
|
|
|
|
:bordered="false" |
|
|
|
|
data-pw="nc-form-heading" |
|
|
|
|
data-nc="nc-form-heading" |
|
|
|
|
@blur="updateView" |
|
|
|
|
@keydown.enter="updateView" |
|
|
|
|
/> |
|
|
|
@ -559,7 +559,7 @@ watch(view, (nextView) => {
|
|
|
|
|
:placeholder="$t('msg.info.formDesc')" |
|
|
|
|
:bordered="false" |
|
|
|
|
:disabled="!isEditable" |
|
|
|
|
data-pw="nc-form-sub-heading" |
|
|
|
|
data-nc="nc-form-sub-heading" |
|
|
|
|
@blur="updateView" |
|
|
|
|
@click="updateView" |
|
|
|
|
/> |
|
|
|
@ -589,7 +589,7 @@ watch(view, (nextView) => {
|
|
|
|
|
'bg-primary bg-opacity-5 ring-0.5 ring-accent ring-opacity-100': activeRow === element.title, |
|
|
|
|
}, |
|
|
|
|
]" |
|
|
|
|
data-pw="nc-form-fields" |
|
|
|
|
data-nc="nc-form-fields" |
|
|
|
|
@click="activeRow = element.title" |
|
|
|
|
> |
|
|
|
|
<div |
|
|
|
@ -598,7 +598,7 @@ watch(view, (nextView) => {
|
|
|
|
|
> |
|
|
|
|
<MdiEyeOffOutline |
|
|
|
|
class="opacity-0 nc-field-remove-icon" |
|
|
|
|
data-pw="nc-field-remove-icon" |
|
|
|
|
data-nc="nc-field-remove-icon" |
|
|
|
|
@click.stop="hideColumn(index)" |
|
|
|
|
/> |
|
|
|
|
</div> |
|
|
|
@ -607,7 +607,7 @@ watch(view, (nextView) => {
|
|
|
|
|
<div class="flex gap-2 items-center"> |
|
|
|
|
<span |
|
|
|
|
class="text-gray-500 mr-2 nc-form-input-required" |
|
|
|
|
data-pw="nc-form-input-required" |
|
|
|
|
data-nc="nc-form-input-required" |
|
|
|
|
@click=" |
|
|
|
|
() => { |
|
|
|
|
element.required = !element.required |
|
|
|
@ -631,7 +631,7 @@ watch(view, (nextView) => {
|
|
|
|
|
v-model:value="element.label" |
|
|
|
|
type="text" |
|
|
|
|
class="form-meta-input nc-form-input-label" |
|
|
|
|
data-pw="nc-form-input-label" |
|
|
|
|
data-nc="nc-form-input-label" |
|
|
|
|
:placeholder="$t('msg.info.formInput')" |
|
|
|
|
@change="updateColMeta(element)" |
|
|
|
|
> |
|
|
|
@ -643,7 +643,7 @@ watch(view, (nextView) => {
|
|
|
|
|
v-model:value="element.description" |
|
|
|
|
type="text" |
|
|
|
|
class="form-meta-input text-sm nc-form-input-help-text" |
|
|
|
|
data-pw="nc-form-input-help-text" |
|
|
|
|
data-nc="nc-form-input-help-text" |
|
|
|
|
:placeholder="$t('msg.info.formHelpText')" |
|
|
|
|
@change="updateColMeta(element)" |
|
|
|
|
/> |
|
|
|
@ -656,7 +656,7 @@ watch(view, (nextView) => {
|
|
|
|
|
:column="{ ...element, title: element.label || element.title }" |
|
|
|
|
:required="isRequired(element, element.required)" |
|
|
|
|
:hide-menu="true" |
|
|
|
|
data-pw="nc-form-input-label" |
|
|
|
|
data-nc="nc-form-input-label" |
|
|
|
|
/> |
|
|
|
|
|
|
|
|
|
<LazySmartsheetHeaderCell |
|
|
|
@ -664,7 +664,7 @@ watch(view, (nextView) => {
|
|
|
|
|
:column="{ ...element, title: element.label || element.title }" |
|
|
|
|
:required="isRequired(element, element.required)" |
|
|
|
|
:hide-menu="true" |
|
|
|
|
data-pw="nc-form-input-label" |
|
|
|
|
data-nc="nc-form-input-label" |
|
|
|
|
/> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
@ -679,7 +679,7 @@ watch(view, (nextView) => {
|
|
|
|
|
:row="row" |
|
|
|
|
class="nc-input" |
|
|
|
|
:class="`nc-form-input-${element.title.replaceAll(' ', '')}`" |
|
|
|
|
:data-pw="`nc-form-input-${element.title.replaceAll(' ', '')}`" |
|
|
|
|
:data-nc="`nc-form-input-${element.title.replaceAll(' ', '')}`" |
|
|
|
|
:column="element" |
|
|
|
|
@click.stop.prevent |
|
|
|
|
/> |
|
|
|
@ -695,14 +695,14 @@ watch(view, (nextView) => {
|
|
|
|
|
v-model="formState[element.title]" |
|
|
|
|
class="nc-input" |
|
|
|
|
:class="`nc-form-input-${element.title.replaceAll(' ', '')}`" |
|
|
|
|
:data-pw="`nc-form-input-${element.title.replaceAll(' ', '')}`" |
|
|
|
|
:data-nc="`nc-form-input-${element.title.replaceAll(' ', '')}`" |
|
|
|
|
:column="element" |
|
|
|
|
:edit-enabled="true" |
|
|
|
|
@click.stop.prevent |
|
|
|
|
/> |
|
|
|
|
</a-form-item> |
|
|
|
|
|
|
|
|
|
<div class="text-gray-500 text-xs" pw-data="nc-form-input-help-text-label">{{ element.description }}</div> |
|
|
|
|
<div class="text-gray-500 text-xs" data-nc="nc-form-input-help-text-label">{{ element.description }}</div> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
@ -717,7 +717,7 @@ watch(view, (nextView) => {
|
|
|
|
|
</Draggable> |
|
|
|
|
|
|
|
|
|
<div class="justify-center flex mt-6"> |
|
|
|
|
<button type="submit" class="uppercase scaling-btn nc-form-submit" data-pw="nc-form-submit" @click="submitForm"> |
|
|
|
|
<button type="submit" class="uppercase scaling-btn nc-form-submit" data-nc="nc-form-submit" @click="submitForm"> |
|
|
|
|
{{ $t('general.submit') }} |
|
|
|
|
</button> |
|
|
|
|
</div> |
|
|
|
@ -739,7 +739,7 @@ watch(view, (nextView) => {
|
|
|
|
|
:rows="3" |
|
|
|
|
hide-details |
|
|
|
|
class="nc-form-after-submit-msg" |
|
|
|
|
data-pw="nc-form-after-submit-msg" |
|
|
|
|
data-nc="nc-form-after-submit-msg" |
|
|
|
|
@change="updateView" |
|
|
|
|
/> |
|
|
|
|
|
|
|
|
@ -752,7 +752,7 @@ watch(view, (nextView) => {
|
|
|
|
|
v-e="[`a:form-view:submit-another-form`]" |
|
|
|
|
size="small" |
|
|
|
|
class="nc-form-checkbox-submit-another-form" |
|
|
|
|
data-pw="nc-form-checkbox-submit-another-form" |
|
|
|
|
data-nc="nc-form-checkbox-submit-another-form" |
|
|
|
|
@change="updateView" |
|
|
|
|
/> |
|
|
|
|
<span class="ml-4">{{ $t('msg.info.submitAnotherForm') }}</span> |
|
|
|
@ -765,7 +765,7 @@ watch(view, (nextView) => {
|
|
|
|
|
v-e="[`a:form-view:show-blank-form`]" |
|
|
|
|
size="small" |
|
|
|
|
class="nc-form-checkbox-show-blank-form" |
|
|
|
|
data-pw="nc-form-checkbox-show-blank-form" |
|
|
|
|
data-nc="nc-form-checkbox-show-blank-form" |
|
|
|
|
@change="updateView" |
|
|
|
|
/> |
|
|
|
|
|
|
|
|
@ -778,7 +778,7 @@ watch(view, (nextView) => {
|
|
|
|
|
v-e="[`a:form-view:email-me`]" |
|
|
|
|
size="small" |
|
|
|
|
class="nc-form-checkbox-send-email" |
|
|
|
|
data-pw="nc-form-checkbox-send-email" |
|
|
|
|
data-nc="nc-form-checkbox-send-email" |
|
|
|
|
@change="onEmailChange" |
|
|
|
|
/> |
|
|
|
|
|
|
|
|
|