block code editor: allow to add block on the top
This commit is contained in:
parent
246c249d3e
commit
b1ea641374
|
@ -805,10 +805,16 @@ label.required::after {
|
|||
}
|
||||
}
|
||||
|
||||
.builder-add .btn {
|
||||
font-size: 12px;
|
||||
line-height: 14px;
|
||||
padding: 3px 5px;
|
||||
.builder-add {
|
||||
&-top {
|
||||
margin-top: 7px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
font-size: 12px;
|
||||
line-height: 14px;
|
||||
padding: 3px 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.block-settings {
|
||||
|
@ -821,7 +827,7 @@ label.required::after {
|
|||
}
|
||||
}
|
||||
|
||||
.block[class*="block-depth"] .block {
|
||||
.block .block {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
|
|
|
@ -12,6 +12,14 @@
|
|||
:class="{'block-show-dropzone': showDragDrop}"
|
||||
class="block"
|
||||
>
|
||||
<BuilderBlockCreate
|
||||
:container="value"
|
||||
:widgets="widgets"
|
||||
:openedBlocks="openedBlocks"
|
||||
:allowedWidgets="[]"
|
||||
v-if="value.length > 0"
|
||||
position="top"
|
||||
/>
|
||||
<BuilderBlockItem
|
||||
v-for="(block, key) in value"
|
||||
:key="block.id + '-' + key"
|
||||
|
@ -30,6 +38,7 @@
|
|||
:widgets="widgets"
|
||||
:openedBlocks="openedBlocks"
|
||||
:allowedWidgets="[]"
|
||||
position="bottom"
|
||||
/>
|
||||
<div>
|
||||
<button
|
||||
|
|
|
@ -42,7 +42,7 @@
|
|||
</style>
|
||||
|
||||
<template>
|
||||
<div class="builder-add">
|
||||
<div class="builder-add" :class="{'builder-add-top': position === 'top'}">
|
||||
<button type="button" class="btn btn-secondary" v-on:click="togglePicker">
|
||||
<span class="fa fa-plus"></span>
|
||||
</button>
|
||||
|
@ -106,7 +106,11 @@ export default {
|
|||
openedBlocks: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
position: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
@ -129,10 +133,14 @@ export default {
|
|||
children: [],
|
||||
}
|
||||
|
||||
this.container.push(block)
|
||||
this.openedBlocks[block.id] = true
|
||||
if (this.position === 'bottom') {
|
||||
this.container.push(block)
|
||||
} else {
|
||||
this.container.unshift(block)
|
||||
}
|
||||
|
||||
this.$emit('updateContainer', this.container)
|
||||
this.openedBlocks[block.id] = true
|
||||
this.togglePicker()
|
||||
},
|
||||
makeId() {
|
||||
|
|
|
@ -59,6 +59,17 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="widget.isContainer" class="container">
|
||||
<BuilderBlockCreate
|
||||
:container="item.children"
|
||||
:widgets="widgets"
|
||||
:openedBlocks="openedBlocks"
|
||||
:allowedWidgets="widget.widgets"
|
||||
v-if="item.children.length > 0"
|
||||
position="top"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Draggable
|
||||
v-if="widget.isContainer"
|
||||
v-model="item.children"
|
||||
|
@ -90,6 +101,7 @@
|
|||
:widgets="widgets"
|
||||
:openedBlocks="openedBlocks"
|
||||
:allowedWidgets="widget.widgets"
|
||||
position="bottom"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue