Resolve field width issues
This commit is contained in:
parent
a4b7bfdbe4
commit
017af5b847
|
|
@ -46,7 +46,7 @@
|
||||||
:list="currentFields"
|
:list="currentFields"
|
||||||
group="form-elements"
|
group="form-elements"
|
||||||
item-key="id"
|
item-key="id"
|
||||||
class="grid grid-cols-12 gap-x-3 relative transition-all w-full"
|
class="grid grid-cols-12 relative transition-all w-full"
|
||||||
:class="{'rounded-md bg-blue-50':draggingNewBlock}"
|
:class="{'rounded-md bg-blue-50':draggingNewBlock}"
|
||||||
ghost-class="ghost-item"
|
ghost-class="ghost-item"
|
||||||
:animation="200"
|
:animation="200"
|
||||||
|
|
@ -450,12 +450,12 @@ export default {
|
||||||
return (new FormLogicPropertyResolver(field, this.dataFormValue)).isHidden()
|
return (new FormLogicPropertyResolver(field, this.dataFormValue)).isHidden()
|
||||||
},
|
},
|
||||||
getTargetFieldIndex(currentFieldPageIndex){
|
getTargetFieldIndex(currentFieldPageIndex){
|
||||||
let targetIndex = 0;
|
let targetIndex = 0
|
||||||
if (this.currentFieldGroupIndex > 0) {
|
if (this.currentFieldGroupIndex > 0) {
|
||||||
for (let i = 0; i < this.currentFieldGroupIndex; i++) {
|
for (let i = 0; i < this.currentFieldGroupIndex; i++) {
|
||||||
targetIndex += this.fieldGroups[i].length;
|
targetIndex += this.fieldGroups[i].length
|
||||||
}
|
}
|
||||||
targetIndex += currentFieldPageIndex;
|
targetIndex += currentFieldPageIndex
|
||||||
} else {
|
} else {
|
||||||
targetIndex = currentFieldPageIndex
|
targetIndex = currentFieldPageIndex
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,7 @@
|
||||||
:class="[
|
:class="[
|
||||||
getFieldWidthClasses(field),
|
getFieldWidthClasses(field),
|
||||||
{
|
{
|
||||||
'group/nffield hover:bg-gray-100/50 relative hover:z-10 w-[calc(100%+30px)] mx-[-15px] px-[15px] transition-colors hover:border-gray-200 dark:hover:bg-gray-900 border-dashed border border-transparent box-border dark:hover:border-blue-900 rounded-md':adminPreview,
|
'group/nffield hover:bg-gray-100/50 relative hover:z-10 mx-[-15px] px-[15px] transition-colors hover:border-gray-200 dark:hover:bg-gray-900 border-dashed border border-transparent box-border dark:hover:border-blue-900 rounded-md':adminPreview,
|
||||||
'bg-blue-50 hover:!bg-blue-50 dark:bg-gray-800 rounded-md': beingEdited
|
'bg-blue-50 hover:!bg-blue-50 dark:bg-gray-800 rounded-md': beingEdited
|
||||||
}]"
|
}]"
|
||||||
>
|
>
|
||||||
|
|
@ -248,7 +248,7 @@ export default {
|
||||||
this.workingFormStore.openAddFieldSidebar(this.field)
|
this.workingFormStore.openAddFieldSidebar(this.field)
|
||||||
},
|
},
|
||||||
getFieldWidthClasses(field) {
|
getFieldWidthClasses(field) {
|
||||||
if (!field.width || field.width === 'full') return 'col-span-full'
|
if (!field.width || field.width === 'full') return 'col-span-full w-full'
|
||||||
else if (field.width === '1/2') {
|
else if (field.width === '1/2') {
|
||||||
return 'w-full sm:col-span-6 col-span-full'
|
return 'w-full sm:col-span-6 col-span-full'
|
||||||
} else if (field.width === '1/3') {
|
} else if (field.width === '1/3') {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue