nexus/vuefilemanager
2
0
Fork 0
mirror of https://github.com/VueFileManager/vuefilemanager.git synced 2026-04-20 00:42:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

bulk-operations fix drop of dragged item

Browse Source
This commit is contained in:
Milos Holba
2020-12-02 19:56:54 +01:00
parent 66aad7c488
commit aff2594ef2
9 changed files with 106 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
resources/js/components/FilesView/DragUI.vue
View File

@@ -1,7 +1,5 @@
<template>
<div>
<MultiSelected :title="title" :subtitle="subtitle" id="multi-select-ui" v-show="draged" />
</div>
<MultiSelected :title="title" :subtitle="subtitle" id="multi-select-ui" v-show="dragged" />
</template>
<script>
@@ -15,24 +13,24 @@ import {events} from '@/bus'
computed: {
...mapGetters(['fileInfoDetail']),
title(){
if(this.fileInfoDetail.length > 1 && this.fileInfoDetail.includes(this.dragedItem)) {
if(this.fileInfoDetail.length > 1 && this.fileInfoDetail.includes(this.draggedItem)) {
return this.$t('file_detail.selected_multiple')
}
if((this.fileInfoDetail.length < 2 || !this.fileInfoDetail.includes(this.dragedItem)) && this.dragedItem ) {
return this.dragedItem.name
if((this.fileInfoDetail.length < 2 || !this.fileInfoDetail.includes(this.draggedItem)) && this.draggedItem ) {
return this.draggedItem.name
}
},
subtitle(){
if(this.fileInfoDetail.length > 1 && this.fileInfoDetail.includes(this.dragedItem) ) {
if(this.fileInfoDetail.length > 1 && this.fileInfoDetail.includes(this.draggedItem) ) {
return this.fileInfoDetail.length + ' ' + this.$tc('file_detail.items', this.fileInfoDetail.length)
}
},
},
data () {
return {
draged: false,
dragedItem: undefined
dragged: false,
draggedItem: undefined
}
},
mounted () {
@@ -40,11 +38,13 @@ import {events} from '@/bus'
// Hnadle Drag & Drop Ghost show
events.$on('dragstart', (data) => {
this.draged = true
this.dragedItem = data
setTimeout(() => {
this.dragged = true
}, 50);
this.draggedItem = data
})
events.$on('drop', () => {
this.draged = false
this.dragged = false
})
}

21
resources/js/components/FilesView/FileBrowser.vue
View File

@@ -38,7 +38,7 @@
v-for="item in data"
:key="item.unique_id"
class="file-item"
:class="dragedItems.includes(item) ? 'draged' : '' "
:class="draggedItems.includes(item) ? 'dragged' : '' "
/>
</transition-group>
</div>
@@ -59,7 +59,7 @@
v-for="item in data"
:key="item.unique_id"
class="file-item"
:class="dragedItems.includes(item) ? 'draged' : '' "
:class="draggedItems.includes(item) ? 'dragged' : '' "
/>
</transition-group>
</div>
@@ -137,7 +137,7 @@
isEmpty() {
return this.data.length == 0
},
dragedItems() {
draggedItems() {
//Set opacity for dragged items
if(!this.fileInfoDetail.includes(this.draggingId)){
@@ -264,7 +264,15 @@
@import '@assets/vue-file-manager/_variables';
@import '@assets/vue-file-manager/_mixins';
.draged {
.file-list {
.dragged {
/deep/.is-dragenter {
border: 2px solid transparent;
}
}
}
.dragged {
opacity: 0.5;
}
@@ -275,11 +283,6 @@
}
.draged-clone {
display: none !important;
opacity: 0 !important;
}
.mobile-multi-select {
bottom: 50px !important;
}

2
resources/js/components/FilesView/FileItemGrid.vue
View File

@@ -168,8 +168,6 @@
dragEnter() {
if (this.data.type !== 'folder') return
if(this.fileInfoDetail.includes(this.data)) return
this.area = true
},
dragLeave() {

2
resources/js/components/FilesView/FileItemList.vue
View File

@@ -160,8 +160,6 @@ export default {
dragEnter() {
if (this.data.type !== 'folder') return
if(this.fileInfoDetail.includes(this.data)) return
this.area = true
},
dragLeave() {