surya/freeplanet
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Drag & Drop hand made... but don't working with the touch

Browse Source
This commit is contained in:
Paolo Arena
2019-02-19 18:44:48 +01:00
parent ec49343556
commit 1eca13c27f
13 changed files with 259 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
src/components/todos/todo/todo.vue
View File

@@ -10,14 +10,12 @@
<div style="display: none">{{ prior = 0, priorcomplet = false }}</div>
<div class="drag">
<draggable v-model="todos_arr" :options="{draggable:'.myitemdrag'}"
@start="onStart" @end="onEnd" class="dragArea">
<!--<transition-group :name="mytypetransgroup">-->
<div style="display: none">{{counter = 0}} </div>
<div :id="getmyid(mytodo._id)" :key="mytodo._id" v-for="mytodo in todos_arr" class="myitemdrag">
<!--<div v-if="isTodoByElem(mytodo)" style="display: none">{{counter++ = (mytodo.counter === undefined) ? 0: mytodo.counter++}} </div>-->
<div v-if="isTodoByElem(mytodo)" style="display: none">{{counter++, mytodo.counter = counter}} </div>
<!--<draggable v-model="todos_arr" :options="{draggable:'.myitemdrag'}"-->
<!--@start="onStart" @end="onEnd" class="dragArea">-->
<transition-group :name="mytypetransgroup">
<div :id="getmyid(mytodo._id)" v-for="(mytodo, index) in todos_arr" :key="mytodo._id" class="myitemdrag"
draggable="true" @dragstart="dragStart(index, $event)" @dragover.prevent @dragenter="dragEnter(index)"
@dragleave="dragLeave(index)" @dragend="dragEnd" @drop="dragFinish(index, $event)" >
<div v-if="(prior !== mytodo.priority) && !mytodo.completed" :class="getTitlePriority(mytodo.priority)">
<label>{{getPriorityByInd(mytodo.priority)}}</label>
@@ -27,13 +25,15 @@
<div style="display: none">{{ priorcomplet = true }}</div>
</div>
<SingleTodo ref="single" @deleteitem="deleteitem" @eventupdate="updateitem"
@deselectAllRows="deselectAllRows"
@deselectAllRows="deselectAllRows" @onEnd="onEnd"
:itemtodo='mytodo' />
<div :name="`REF${index}`" class="divdrag non-draggato"></div>
<div style="display: none">{{ prior = mytodo.priority, priorcomplet = mytodo.completed }}</div>
</div>
<!--</transition-group>-->
</draggable>
</transition-group>
<!--</draggable>-->
</div>
@@ -42,18 +42,18 @@
:after="[{icon: 'arrow_forward', content: true, handler () {}}]"
v-on:keyup.enter="insertTodo"/>
{{ tmpstrTodos }}
<!--{{ tmpstrTodos }}-->
<div class="flex-item btn-item">
<q-btn class="mybtn" round color="" icon="lock" @click="getArrTodos">Get Todo</q-btn>
<q-btn class="mybtn" round color="" icon="person" @click="setArrTodos">Set Todo</q-btn>
<q-btn class="mybtn" round color="" icon="list" @click="reload_fromServer++">Reload</q-btn>
</div>
<!--<div class="flex-item btn-item">-->
<!--<q-btn class="mybtn" round color="" icon="lock" @click="getArrTodos">Get Todo</q-btn>-->
<!--<q-btn class="mybtn" round color="" icon="person" @click="setArrTodos">Set Todo</q-btn>-->
<!--<q-btn class="mybtn" round color="" icon="list" @click="reload_fromServer++">Reload</q-btn>-->
<!--</div>-->
<!--<q-input v-model="testPao" float-label="testPao"/>-->
<q-input v-model="todos_changed" float-label="todos_changed"/>
<!--&lt;!&ndash;<q-input v-model="testPao" float-label="testPao"/>&ndash;&gt;-->
<!--<q-input v-model="todos_changed" float-label="todos_changed"/>-->
<q-input v-model="reload_fromServer" float-label="reload_fromServer"/>
<!--<q-input v-model="reload_fromServer" float-label="reload_fromServer"/>-->
<!--<div class="flex-item btn-item">-->
<!--&lt;!&ndash;<q-btn class="mybtn" round color="" icon="lock" @click="clicktest()"></q-btn>&ndash;&gt;-->