修复拖拽bug
This commit is contained in:
parent
44d282d225
commit
164f32c3e4
@ -1005,30 +1005,32 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
child.ondragstart = function(e){
|
child.ondragstart = function(e){
|
||||||
let count = _this.selectRowData.length
|
if(_this.fileListScrollTop === 0){
|
||||||
if(_this.selectRowData.length >= 99){
|
let count = _this.selectRowData.length
|
||||||
count = 99
|
if(_this.selectRowData.length >= 99){
|
||||||
|
count = 99
|
||||||
|
}
|
||||||
|
let dragImage = document.getElementById('dragImage');
|
||||||
|
dragImage.src = require(`@/assets/img/move-file/move-file${count}.png`)
|
||||||
|
|
||||||
|
e.dataTransfer.setDragImage(dragImage, 10, 10);
|
||||||
|
|
||||||
|
Bus.$emit('onDragStart', true)
|
||||||
|
// 避免和画矩形选区冲突
|
||||||
|
_this.drawFlag = false
|
||||||
|
let rectangle = document.getElementById('rectangle1')
|
||||||
|
if(rectangle){
|
||||||
|
document.getElementById('v-draw-rectangle').removeChild(rectangle)
|
||||||
|
}
|
||||||
|
|
||||||
|
dragged = e.path[0]
|
||||||
|
draggedIndex = e.path[0].rowIndex
|
||||||
|
// 只有选中的才能拖拽
|
||||||
|
_this.cellMouseIndex = -1
|
||||||
|
// dragged.style.cursor = 'grabbing'
|
||||||
|
dragged.style.borderRadius = '10px'
|
||||||
|
dragBackCorlor = dragged.style.backgroundColor
|
||||||
}
|
}
|
||||||
let dragImage = document.getElementById('dragImage');
|
|
||||||
dragImage.src = require(`@/assets/img/move-file/move-file${count}.png`)
|
|
||||||
|
|
||||||
e.dataTransfer.setDragImage(dragImage, 10, 10);
|
|
||||||
|
|
||||||
Bus.$emit('onDragStart', true)
|
|
||||||
// 避免和画矩形选区冲突
|
|
||||||
_this.drawFlag = false
|
|
||||||
let rectangle = document.getElementById('rectangle1')
|
|
||||||
if(rectangle){
|
|
||||||
document.getElementById('v-draw-rectangle').removeChild(rectangle)
|
|
||||||
}
|
|
||||||
|
|
||||||
dragged = e.path[0]
|
|
||||||
draggedIndex = e.path[0].rowIndex
|
|
||||||
// 只有选中的才能拖拽
|
|
||||||
_this.cellMouseIndex = -1
|
|
||||||
dragged.style.cursor = 'grabbing'
|
|
||||||
dragged.style.borderRadius = '10px'
|
|
||||||
dragBackCorlor = dragged.style.backgroundColor
|
|
||||||
}
|
}
|
||||||
child.ondragend = function(){
|
child.ondragend = function(){
|
||||||
Bus.$emit('onDragStart', false)
|
Bus.$emit('onDragStart', false)
|
||||||
@ -1502,6 +1504,7 @@
|
|||||||
},
|
},
|
||||||
tableBodyScroll(table, e) {
|
tableBodyScroll(table, e) {
|
||||||
this.fileListScrollTop = e.target.scrollTop
|
this.fileListScrollTop = e.target.scrollTop
|
||||||
|
Bus.$emit("fileListScrollTop",this.fileListScrollTop)
|
||||||
let scrollBottom = e.target.scrollHeight-e.target.clientHeight-e.target.scrollTop;
|
let scrollBottom = e.target.scrollHeight-e.target.clientHeight-e.target.scrollTop;
|
||||||
if(scrollBottom < 200){
|
if(scrollBottom < 200){
|
||||||
if(!this.finished){
|
if(!this.finished){
|
||||||
|
|||||||
@ -154,6 +154,8 @@
|
|||||||
pc: true,
|
pc: true,
|
||||||
dragover: false,
|
dragover: false,
|
||||||
isDragStart: false,
|
isDragStart: false,
|
||||||
|
fileListScrollTop: 0,
|
||||||
|
dragoverLoop: null,
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
@ -169,26 +171,42 @@
|
|||||||
let dropbox = document.body
|
let dropbox = document.body
|
||||||
|
|
||||||
document.body.ondragstart = function(e){
|
document.body.ondragstart = function(e){
|
||||||
return e.target.slot === 'jmal';
|
return e.target.slot === 'jmal' && that.fileListScrollTop === 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
dropbox.addEventListener("dragenter", function(e){
|
dropbox.addEventListener("dragenter", function(e){
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
}, false);
|
}, false);
|
||||||
|
|
||||||
dropbox.addEventListener("dragover", function(e){
|
dropbox.addEventListener("dragover", function(e){
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
clearInterval(that.dragoverLoop)
|
||||||
if(!that.isDragStart){
|
if(!that.isDragStart){
|
||||||
that.dragover = true
|
that.dragover = true
|
||||||
}
|
}
|
||||||
|
that.dragoverLoop = setTimeout(function () {
|
||||||
|
that.dragover = false
|
||||||
|
},100)
|
||||||
}, false);
|
}, false);
|
||||||
|
|
||||||
|
dropbox.addEventListener("ondragleave", function(e){
|
||||||
|
e.stopPropagation();
|
||||||
|
e.preventDefault();
|
||||||
|
that.dragover = false
|
||||||
|
}, false);
|
||||||
|
|
||||||
dropbox.addEventListener("drop", function(e){
|
dropbox.addEventListener("drop", function(e){
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
that.dragover = false
|
that.dragover = false
|
||||||
}, false);
|
}, false);
|
||||||
|
|
||||||
|
Bus.$on('fileListScrollTop', fileListScrollTop => {
|
||||||
|
this.fileListScrollTop = fileListScrollTop
|
||||||
|
})
|
||||||
|
|
||||||
Bus.$on('onDragStart', isDragStart => {
|
Bus.$on('onDragStart', isDragStart => {
|
||||||
this.isDragStart = isDragStart
|
this.isDragStart = isDragStart
|
||||||
})
|
})
|
||||||
@ -233,6 +251,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
onFilesAdded(files) {
|
onFilesAdded(files) {
|
||||||
|
if(files.length === 0){
|
||||||
|
return
|
||||||
|
}
|
||||||
this.fileListLength = this.uploader.fileList.length
|
this.fileListLength = this.uploader.fileList.length
|
||||||
const filePaths = this.uploader.filePaths
|
const filePaths = this.uploader.filePaths
|
||||||
const paths = Object.keys(filePaths)
|
const paths = Object.keys(filePaths)
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user