Skip to content

Commit b08a34c

Browse files
Adjust offset handling
1 parent 22b4432 commit b08a34c

File tree

6 files changed

+130
-20
lines changed

6 files changed

+130
-20
lines changed

dist/vuedraggable.js

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -314,10 +314,9 @@ function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr
314314
return context;
315315
},
316316
getVmIndex: function getVmIndex(domIndex) {
317-
var correctedDomIndex = domIndex + this.headerOffset;
318317
var indexes = this.visibleIndexes;
319318
var numberIndexes = indexes.length;
320-
return correctedDomIndex > numberIndexes - 1 ? numberIndexes : indexes[correctedDomIndex];
319+
return domIndex > numberIndexes - 1 ? numberIndexes : indexes[domIndex];
321320
},
322321
getComponent: function getComponent() {
323322
return this.$slots.default[0].componentInstance;
@@ -362,14 +361,25 @@ function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr
362361
this.emitChanges({ removed: removed });
363362
},
364363
onDragUpdate: function onDragUpdate(evt) {
364+
console.log(evt.newIndex, evt.oldIndex);
365+
this.updateEvenemt(evt);
366+
console.log(evt.newIndex, evt.oldIndex);
365367
removeNode(evt.item);
366368
insertNodeAt(evt.from, evt.item, evt.oldIndex);
369+
throw new Error();
367370
var oldIndex = this.context.index;
368371
var newIndex = this.getVmIndex(evt.newIndex);
369372
this.updatePosition(oldIndex, newIndex);
370373
var moved = { element: this.context.element, oldIndex: oldIndex, newIndex: newIndex };
371374
this.emitChanges({ moved: moved });
372375
},
376+
updateEvenemt: function updateEvenemt(evt) {
377+
this.updateProperty(evt, 'newIndex');
378+
this.updateProperty(evt, 'oldIndex');
379+
},
380+
updateProperty: function updateProperty(evt, propertyName) {
381+
evt.hasOwnProperty(propertyName) && (evt[propertyName] += this.headerOffset);
382+
},
373383
computeFutureIndex: function computeFutureIndex(relatedContext, evt) {
374384
if (!relatedContext.element) {
375385
return 0;

dist/vuedraggable.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

examples/Two_Lists_Clone_slots.html

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
<!doctype html>
2+
<html class="no-js" lang="">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="x-ua-compatible" content="ie=edge">
6+
<title>Example two lists clone</title>
7+
<meta name="description" content="">
8+
<meta name="viewport" content="width=device-width, initial-scale=1">
9+
10+
<link rel="stylesheet" href="css/main.css">
11+
</head>
12+
<body>
13+
14+
<div id="main">
15+
<h1>Vue Dragable</h1>
16+
17+
<div class="drag">
18+
<h2>List 1 v-dragable-for</h2>
19+
<draggable id="list1" :list="list1" class="dragArea" :options="{draggable:'.item-d', group:{name:'people'}}" @change="log">
20+
<div v-for="(element, index) in list1" :key="index" class="item-d">
21+
{{element.name}} {{index}}
22+
</div>
23+
<div slot="header">
24+
Header here
25+
</div>
26+
</draggable>
27+
28+
<h2>List 2 v-dragable-for</h2>
29+
<draggable id="list2" :list="list2" class="dragArea" :options="{draggable:'.item-d',group:'people'}" @change="log">
30+
<div v-for="(element, index) in list2" :key="index" class="item-d">{{element.name}}</div>
31+
</draggable>
32+
</div>
33+
34+
<div class="normal">
35+
<h2>List 1 v-for</h2>
36+
<div>
37+
<div v-for="(element, index) in list1" :key="index">{{element.name}}</div>
38+
</div>
39+
40+
<h2>List 2 v-for</h2>
41+
<div>
42+
<div v-for="(element, index) in list2" :key="index">{{element.name}}</div>
43+
</div>
44+
</div>
45+
46+
<a href="index.html">See basic example</a>
47+
<a href="Two_Lists.html">See 2 lists example</a>
48+
<a href="Two_Lists_Clone_If.html">See clone v-if element example</a>
49+
50+
51+
</div>
52+
<script type="text/javascript" src="libs\vue\dist\vue.js"></script>
53+
<script type="text/javascript" src="libs\Sortable\Sortable.js"></script>
54+
<script type="text/javascript" src="src\vuedraggable.js"></script>
55+
<script type="text/javascript" src="script\complex.js"></script>
56+
57+
</body>
58+
</html>

0 commit comments

Comments
 (0)