Fixing solution for issue #63

Author: David-Desmaisons

dist/vuedraggable.js

@@ -1,7 +1,5 @@
 'use strict';
 
-var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
 function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
 
 (function () {
@@ -52,6 +50,7 @@ function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr
     var readonlyProperties = ['Move'].concat(eventsListened, eventsToEmit).map(function (evt) {
       return 'on' + evt;
     });
+    var draggingElement = null;
 
     var props = {
       options: Object,
@@ -200,6 +199,7 @@ function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr
         onDragStart: function onDragStart(evt) {
           this.context = this.getUnderlyingVm(evt.item);
           evt.item._underlying_vm_ = this.clone(this.context.element);
+          draggingElement = evt.item;
         },
         onDragAdd: function onDragAdd(evt) {
           var element = evt.item._underlying_vm_;
@@ -238,12 +238,11 @@ function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr
           if (!relatedContext.element) {
             return 0;
           }
-          var relatedElement = evt.related;
-          var currentDOMIndex = [].concat(_toConsumableArray(evt.to.children)).indexOf(relatedElement);
+          var domChildren = [].concat(_toConsumableArray(evt.to.children));
+          var currentDOMIndex = domChildren.indexOf(evt.related);
           var currentIndex = relatedContext.component.getVmIndex(currentDOMIndex);
-          var incialIndex = relatedContext.index;
-          console.log(currentIndex, incialIndex);
-          return Math.max(currentIndex, incialIndex);
+          var draggedInList = domChildren.indexOf(draggingElement) != -1;
+          return draggedInList ? currentIndex : currentIndex + 1;
         },
         onDragMove: function onDragMove(evt) {
           var onMove = this.move;
@@ -260,6 +259,7 @@ function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr
         },
         onDragEnd: function onDragEnd(evt) {
           this.computeIndexes();
+          draggingElement = null;
         }
       }
     };

dist/vuedraggable.min.js

@@ -33,7 +33,7 @@ <h2>List 1 draggable</h2>
              </draggable>
 
            <h2>List 2 draggable</h2>
-            <draggable class="dragArea" :list="list2" :options="{group:'people'}">
+            <draggable class="dragArea" :list="list2" :options="{group:'people'}" :move="checkMove">
                 <transition-group tag="div" class="dragArea" name="list-complete">
                     <div v-for="(element, index) in list2" :class="{'target': element===targetElement, 'ok':canDrag  , 'ko':!canDrag}" :key="element.name" >
                         {{element.name}}

examples/Cancel.html

@@ -38,6 +38,7 @@
     const eventsListened = ['Start', 'Add', 'Remove', 'Update', 'End']
     const eventsToEmit = ['Choose', 'Sort', 'Filter', 'Clone']
     const readonlyProperties = ['Move', ...eventsListened, ...eventsToEmit].map(evt => 'on'+evt)
+    var draggingElement = null
 
     const props = {
       options: Object,
@@ -181,6 +182,7 @@
         onDragStart (evt) {
           this.context = this.getUnderlyingVm(evt.item)
           evt.item._underlying_vm_ = this.clone(this.context.element)
+          draggingElement = evt.item
         },
 
         onDragAdd (evt) {
@@ -223,11 +225,11 @@
           if (!relatedContext.element){
             return 0
           }
-          const relatedElement = evt.related;
-          const currentDOMIndex = [...evt.to.children].indexOf(relatedElement)
+          const domChildren = [...evt.to.children]
+          const currentDOMIndex = domChildren.indexOf(evt.related)
           const currentIndex = relatedContext.component.getVmIndex(currentDOMIndex)
-          const incialIndex = relatedContext.index
-          return (currentIndex !== incialIndex) ? incialIndex+1 : incialIndex
+          const draggedInList = domChildren.indexOf(draggingElement) != -1
+          return draggedInList? currentIndex : currentIndex+1
         },
 
         onDragMove (evt) {
@@ -246,6 +248,7 @@
 
         onDragEnd (evt) {
           this.computeIndexes()
+          draggingElement = null
         }
       }
     }