caojiezi2003/Stackedit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Prevent from drag-dropping in a folder child

Browse Source
This commit is contained in:
benweet 2018-08-19 14:04:43 +01:00
parent 3fc974c14c
commit 0d39ca85fc
3 changed files with 23 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/ExplorerNode.vue
View File

@ -1,9 +1,9 @@
<template> <template>
<div class="explorer-node" :class="{'explorer-node--selected': isSelected, 'explorer-node--folder': node.isFolder, 'explorer-node--open': isOpen, 'explorer-node--trash': node.isTrash, 'explorer-node--temp': node.isTemp, 'explorer-node--drag-target': isDragTargetFolder}" @dragover.prevent @dragenter.stop="node.noDrop || setDragTarget(node.item.id)" @dragleave.stop="isDragTarget && setDragTargetId()" @drop.prevent.stop="onDrop" @contextmenu="onContextMenu"> <div class="explorer-node" :class="{'explorer-node--selected': isSelected, 'explorer-node--folder': node.isFolder, 'explorer-node--open': isOpen, 'explorer-node--trash': node.isTrash, 'explorer-node--temp': node.isTemp, 'explorer-node--drag-target': isDragTargetFolder}" @dragover.prevent @dragenter.stop="node.noDrop || setDragTarget(node)" @dragleave.stop="isDragTarget && setDragTarget()" @drop.prevent.stop="onDrop" @contextmenu="onContextMenu">
<div class="explorer-node__item-editor" v-if="isEditing" :style="{paddingLeft: leftPadding}" draggable="true" @dragstart.stop.prevent> <div class="explorer-node__item-editor" v-if="isEditing" :style="{paddingLeft: leftPadding}" draggable="true" @dragstart.stop.prevent>
<input type="text" class="text-input" v-focus @blur="submitEdit()" @keydown.stop @keydown.enter="submitEdit()" @keydown.esc="submitEdit(true)" v-model="editingNodeName"> <input type="text" class="text-input" v-focus @blur="submitEdit()" @keydown.stop @keydown.enter="submitEdit()" @keydown.esc="submitEdit(true)" v-model="editingNodeName">
</div> </div>
<div class="explorer-node__item" v-else :style="{paddingLeft: leftPadding}" @click="select()" draggable="true" @dragstart.stop="setDragSourceId" @dragend.stop="setDragTargetId()"> <div class="explorer-node__item" v-else :style="{paddingLeft: leftPadding}" @click="select()" draggable="true" @dragstart.stop="setDragSourceId" @dragend.stop="setDragTarget()">
{{node.item.name}} {{node.item.name}}
<icon-provider class="explorer-node__location" v-for="location in node.locations" :key="location.id" :provider-id="location.providerId"></icon-provider> <icon-provider class="explorer-node__location" v-for="location in node.locations" :key="location.id" :provider-id="location.providerId"></icon-provider>
</div> </div>
@ -73,7 +73,6 @@ export default {
}, },
methods: { methods: {
...mapMutations('explorer', [ ...mapMutations('explorer', [
'setDragTargetId',
'setEditingId', 'setEditingId',
]), ]),
...mapActions('explorer', [ ...mapActions('explorer', [
@ -142,7 +141,7 @@ export default {
onDrop() { onDrop() {
const sourceNode = this.$store.getters['explorer/dragSourceNode']; const sourceNode = this.$store.getters['explorer/dragSourceNode'];
const targetNode = this.$store.getters['explorer/dragTargetNodeFolder']; const targetNode = this.$store.getters['explorer/dragTargetNodeFolder'];
this.setDragTargetId(); this.setDragTarget();
if (!sourceNode.isNil if (!sourceNode.isNil
&& !targetNode.isNil && !targetNode.isNil
&& sourceNode.item.id !== targetNode.item.id && sourceNode.item.id !== targetNode.item.id

6
src/components/modals/AboutModal.vue
View File

@ -2,7 +2,7 @@
<modal-inner class="modal__inner-1--about-modal" aria-label="About"> <modal-inner class="modal__inner-1--about-modal" aria-label="About">
<div class="modal__content"> <div class="modal__content">
<div class="logo-background"></div> <div class="logo-background"></div>
<small>© 2013-2018 Dock5 Software<br>v{{version}}</small> <small>© 2013-2018 Dock5 Software Ltd.<br>v{{version}}</small>
<hr> <hr>
StackEdit on <a target="_blank" href="https://github.com/benweet/stackedit/">GitHub</a> StackEdit on <a target="_blank" href="https://github.com/benweet/stackedit/">GitHub</a>
<br> <br>
@ -59,13 +59,11 @@ export default {
.logo-background { .logo-background {
height: 75px; height: 75px;
margin: 0; margin: 0.5em 0;
} }
small { small {
display: block; display: block;
font-size: 0.75em;
opacity: 0.75;
} }
hr { hr {

19
src/store/explorer.js
View File

@ -191,9 +191,24 @@ export default {
openDragTarget: debounceAction(({ state, dispatch }) => { openDragTarget: debounceAction(({ state, dispatch }) => {
dispatch('openNode', state.dragTargetId); dispatch('openNode', state.dragTargetId);
}, 1000), }, 1000),
setDragTarget({ commit, dispatch }, id) { setDragTarget({ commit, getters, dispatch }, node) {
commit('setDragTargetId', id); if (!node) {
commit('setDragTargetId');
} else {
// Make sure target node is not a child of source node
const folderNode = getFolder(node, getters);
const sourceId = getters.dragSourceNode.item.id;
const { nodeMap } = getters;
for (let parentNode = folderNode; parentNode; parentNode = nodeMap[node.item.parentId]) {
if (parentNode.item.id === sourceId) {
commit('setDragTargetId');
return;
}
}
commit('setDragTargetId', node.item.id);
dispatch('openDragTarget'); dispatch('openDragTarget');
}
}, },
}, },
}; };