block code editor: fix drag and drop

This commit is contained in:
Simon Vieille 2024-05-24 13:50:37 +02:00
parent b1ea641374
commit a0211026ba
Signed by: deblan
GPG key ID: 579388D585F70417
3 changed files with 98 additions and 90 deletions

View file

@ -817,6 +817,10 @@ label.required::after {
} }
} }
.block-root > .container .builder-add {
margin-top: 0;
}
.block-settings { .block-settings {
padding: 4px; padding: 4px;
margin-top: 10px; margin-top: 10px;

View file

@ -1,6 +1,19 @@
<template> <template>
<Draggable <div
class="block block-root"
v-if="Object.keys(widgets).length && value !== null" v-if="Object.keys(widgets).length && value !== null"
>
<div class="container">
<BuilderBlockCreate
:container="value"
:widgets="widgets"
:openedBlocks="openedBlocks"
:allowedWidgets="[]"
v-if="value.length > 0"
position="top"
/>
</div>
<Draggable
v-model="value" v-model="value"
:key="blockKey" :key="blockKey"
:animation="200" :animation="200"
@ -10,16 +23,7 @@
@end="dragEnd" @end="dragEnd"
handle=".dragger" handle=".dragger"
:class="{'block-show-dropzone': showDragDrop}" :class="{'block-show-dropzone': showDragDrop}"
class="block"
> >
<BuilderBlockCreate
:container="value"
:widgets="widgets"
:openedBlocks="openedBlocks"
:allowedWidgets="[]"
v-if="value.length > 0"
position="top"
/>
<BuilderBlockItem <BuilderBlockItem
v-for="(block, key) in value" v-for="(block, key) in value"
:key="block.id + '-' + key" :key="block.id + '-' + key"
@ -94,6 +98,7 @@
</div> </div>
</dialog> </dialog>
</Draggable> </Draggable>
</div>
</template> </template>
<script> <script>
@ -200,7 +205,6 @@ export default {
} }
} catch (e) { } catch (e) {
console.log(e)
hasError = true hasError = true
} }

View file

@ -27,7 +27,7 @@
type="button" type="button"
class="block-header-item btn btn-sm btn-outline-secondary dragger" class="block-header-item btn btn-sm btn-outline-secondary dragger"
> >
<span class="fa fa-arrows-alt"></span> <span class="fa fa-arrows-alt dragger"></span>
</button> </button>
</div> </div>
@ -40,7 +40,7 @@
class="block-header-item btn btn-sm text-white bg-danger" class="block-header-item btn btn-sm text-white bg-danger"
v-on:click="removeMe(item)" v-on:click="removeMe(item)"
> >
<span class="fa fa-trash"></span> <span class="fa fa-trash dragger"></span>
</button> </button>
</div> </div>
</div> </div>