diff --git a/resources/vue/components/courseware/containers/CoursewareAccordionContainer.vue b/resources/vue/components/courseware/containers/CoursewareAccordionContainer.vue index 861db7bd419e6ed82b43d9deb6213569f6119fe9..18e6a4a484493cc8a543255dd0ac9a5f478c3bd4 100644 --- a/resources/vue/components/courseware/containers/CoursewareAccordionContainer.vue +++ b/resources/vue/components/courseware/containers/CoursewareAccordionContainer.vue @@ -59,7 +59,7 @@ :data-section-id="index" > <template #item="{element, index}"> - <li class="cw-block-item cw-block-item-sortable"> + <li class="cw-block-item cw-block-item-sortable" :data-block-id="element.id"> <span :class="{ 'cw-sortable-handle-dragging': isDragging }" class="cw-sortable-handle" diff --git a/resources/vue/components/courseware/containers/CoursewareListContainer.vue b/resources/vue/components/courseware/containers/CoursewareListContainer.vue index fea378a4a98b098bd60ea64e720576c76f42b161..1a8cbf28b97c9c7d31f45494307ea728faf7b706 100644 --- a/resources/vue/components/courseware/containers/CoursewareListContainer.vue +++ b/resources/vue/components/courseware/containers/CoursewareListContainer.vue @@ -44,6 +44,7 @@ <template #item="{element}"> <li class="cw-block-item cw-block-item-sortable" + :data-block-id="element.id" > <span :class="{ 'cw-sortable-handle-dragging': isDragging }" diff --git a/resources/vue/components/courseware/containers/CoursewareTabsContainer.vue b/resources/vue/components/courseware/containers/CoursewareTabsContainer.vue index 7b32bf9254e390002084dd455d435907fec1cd9e..4e3440f0d23e8aad31cbe0fc79f1c14fd998f63f 100644 --- a/resources/vue/components/courseware/containers/CoursewareTabsContainer.vue +++ b/resources/vue/components/courseware/containers/CoursewareTabsContainer.vue @@ -66,7 +66,7 @@ :data-section-id="sectionIndex" > <template #item="{element}"> - <li class="cw-block-item cw-block-item-sortable"> + <li class="cw-block-item cw-block-item-sortable" :data-block-id="element.id"> <span :class="{ 'cw-sortable-handle-dragging': isDragging }" class="cw-sortable-handle" diff --git a/resources/vue/mixins/courseware/container.js b/resources/vue/mixins/courseware/container.js index df3ab09b86e44d7c7e473ce783708751febfa9f8..b1db1b2d92fee7eaaa3a3bffa7f76ed8642e2688 100644 --- a/resources/vue/mixins/courseware/container.js +++ b/resources/vue/mixins/courseware/container.js @@ -39,16 +39,16 @@ const containerMixin = { dropBlock(e) { this.isDragging = false; // implemented by each container type let data = {}; - data.originContainerId = e.from.__vnode.ctx.attrs.containerId; - data.targetContainerId = e.to.__vnode.ctx.attrs.containerId; + data.originContainerId = e.from.dataset.containerId; + data.targetContainerId = e.to.dataset.containerId; if (data.originContainerId === data.targetContainerId) { this.storeSort(); // implemented by each container type } else { - data.originSectionId = e.from.__vnode.ctx.attrs.sectionId; - data.originSectionBlockList = e.from.__vnode.children.map(b => { return b.ctx.attrs.blockId; }); - data.targetSectionId = e.to.__vnode.ctx.attrs.sectionId; - data.targetSectionBlockList = e.to.__vnode.children.map(b => { return b.ctx.attrs.blockId; }); - data.blockId = e.item._underlying_vm_.id; + data.originSectionId = e.from.dataset.sectionId; + data.originSectionBlockList = [...e.from.children].map(b => b.dataset.blockId); + data.targetSectionId = e.to.dataset.sectionId; + data.targetSectionBlockList = [...e.to.children].map(b => b.dataset.blockId); + data.blockId = e.item.dataset.blockId; data.newPos = e.newIndex; const indexInBlockList = data.targetSectionBlockList.findIndex(b => b === data.blockId); data.targetSectionBlockList.splice(data.newPos, 0, data.targetSectionBlockList.splice(indexInBlockList,1)[0]); // move block id to new position