Mizah/Sharkey
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Use vuedraggable instead of vue-draggable-next

Browse source 
Fix #6852
This commit is contained in:
syuilo 2020-12-05 12:50:09 +09:00
parent b4e5fe7e71
commit af5b4749b0
13 changed files with 148 additions and 92 deletions
Download patch file Download diff file Expand all files Collapse all files

20
src/client/pages/page-editor/page-editor.blocks.vue
View file

@ -1,6 +1,8 @@
<template>
<XDraggable tag="div" :list="blocks" handle=".drag-handle" :group="{ name: 'blocks' }" animation="150" swap-threshold="0.5">
<component v-for="block in blocks" :is="'x-' + block.type" :value="block" @update:value="updateItem" @remove="() => removeItem(block)" :key="block.id" :hpml="hpml"/>
<XDraggable tag="div" v-model="blocks" item-key="id" handle=".drag-handle" :group="{ name: 'blocks' }" animation="150" swap-threshold="0.5">
<template #item="{element}">
<component :is="'x-' + element.type" :value="element" @update:value="updateItem" @remove="() => removeItem(element)" :hpml="hpml"/>
</template>
</XDraggable>
</template>
@ -25,7 +27,7 @@ import * as os from '@/os';
export default defineComponent({
components: {
XDraggable: defineAsyncComponent(() => import('vue-draggable-next').then(x => x.VueDraggableNext)),
XDraggable: defineAsyncComponent(() => import('vuedraggable').then(x => x.default)),
XSection, XText, XImage, XButton, XTextarea, XTextInput, XTextareaInput, XNumberInput, XSwitch, XIf, XPost, XCounter, XRadioButton, XCanvas, XNote
},
@ -39,9 +41,16 @@ export default defineComponent({
},
},
emits: ['update:value'],
computed: {
blocks() {
return this.value;
blocks: {
get() {
return this.value;
},
set(value) {
this.$emit('update:value', value);
}
}
},
@ -57,6 +66,7 @@ export default defineComponent({
},
removeItem(el) {
console.log(el);
const i = this.blocks.findIndex(x => x.id === el.id);
const newValue = [
...this.blocks.slice(0, i),