Skip to content
Snippets Groups Projects
Commit 7b0daa34 authored by Julian's avatar Julian
Browse files

Show in slot for disabled markers whether an item is dragged

parent d69d26ef
No related branches found
No related tags found
1 merge request!12Pass dragging information to slot for disabled fields
......@@ -3,7 +3,7 @@
droppable
@dropmove="disabled || loading ? undefined : handleDragOver($event)"
@drop.prevent="disabled || loading ? undefined : handleDrop($event)"
@dragleave="$refs.highlightContainer.style.display = 'none'"
@dragleave="handleDragLeave"
class="grid"
>
<template v-if="loading">
......@@ -56,7 +56,7 @@
:y="disabledField.y"
:key="disabledField.x + '|' + disabledField.y"
>
<slot name="disabledField"></slot>
<slot name="disabledField" :is-dragged-over="isDraggedOver"></slot>
</GridItem>
</template>
<slot></slot>
......@@ -76,6 +76,11 @@ export default {
DragContainer,
},
emits: ["input", "itemChanged"],
data() {
return {
isDraggedOver: false,
};
},
props: {
rows: {
type: Number,
......@@ -182,6 +187,8 @@ export default {
return;
}
this.isDraggedOver = true;
let newPositionValid = true;
for (let x = coords.x; x < coords.x + element.w; x++) {
......@@ -204,6 +211,7 @@ export default {
this.$refs.highlightContainer.style.gridRowEnd = "span " + element.h;
},
handleDrop(event) {
this.isDraggedOver = false;
this.$refs.highlightContainer.style.display = "none";
let data = event.relatedTarget.dataset.transfer;
if (!data) return;
......@@ -267,6 +275,10 @@ export default {
this.$emit("itemChanged", element);
},
handleDragLeave() {
this.isDraggedOver = false;
this.$refs.highlightContainer.style.display = "none";
},
clamp: (min, num, max) => Math.min(Math.max(num, min), max),
getCoords(x, y) {
let rect = this.$el.getBoundingClientRect();
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment