github/directus
1
1
Fork 0
mirror of https://github.com/directus/directus.git synced 2026-04-03 03:00:39 -04:00
Code Issues Packages Projects Releases Wiki Activity

Fix file drop issue (#428)

Browse Source 
* Fix file drop issue

* Remove stray console log
This commit is contained in:
Rijk van Zanten
2020-04-17 18:41:09 -04:00
committed by GitHub
parent 8c6d57e7c6
commit 6addf415a8
1 changed files with 17 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/views/private/private-view.vue
View File

@@ -1,12 +1,5 @@
<template>
<div
class="private-view"
:class="{ theme, 'drop-effect': showDropEffect }"
@dragenter.prevent="onDragEnter"
@dragover.prevent
@dragleave.prevent="onDragLeave"
@drop.prevent="onDrop"
>
<div class="private-view" :class="{ theme, 'drop-effect': showDropEffect }">
<aside
role="navigation"
aria-label="Module Navigation"
@@ -85,6 +78,7 @@ import NotificationItem from './components/notification-item';
import useNotificationsStore from '@/stores/notifications';
import uploadFiles from '@/utils/upload-files';
import i18n from '@/lang';
import useEventListener from '@/compositions/use-event-listener';
export default defineComponent({
components: {
@@ -124,7 +118,12 @@ export default defineComponent({
provide('drawer-open', drawerOpen);
provide('main-element', contentEl);
const { onDragEnter, onDragLeave, onDrop, showDropEffect } = useFileUpload();
const { onDragEnter, onDragLeave, onDragOver, onDrop, showDropEffect } = useFileUpload();
useEventListener(window, 'dragenter', onDragEnter);
useEventListener(window, 'dragover', onDragOver);
useEventListener(window, 'dragleave', onDragLeave);
useEventListener(window, 'drop', onDrop);
return {
navOpen,
@@ -144,9 +143,10 @@ export default defineComponent({
let dragNotificationID: string;
let fileUploadNotificationID: string;
return { onDragEnter, onDragLeave, onDrop, showDropEffect };
return { onDragEnter, onDragOver, onDragLeave, onDrop, showDropEffect };
function onDragEnter(event: DragEvent) {
event.preventDefault();
if (
event.dataTransfer?.types.indexOf('Files') !== -1 &&
showDropEffect.value === false
@@ -163,7 +163,12 @@ export default defineComponent({
}
}
function onDragLeave() {
function onDragOver(event: DragEvent) {
event.preventDefault();
}
function onDragLeave(event: DragEvent) {
event.preventDefault();
showDropEffect.value = false;
if (dragNotificationID) {
@@ -172,6 +177,7 @@ export default defineComponent({
}
async function onDrop(event: DragEvent) {
event.preventDefault();
showDropEffect.value = false;
if (!event.dataTransfer) return;