KAZ/webtransfer
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

css on dragover

Browse Source
This commit is contained in:
GMrrc 2024-11-21 15:55:02 +01:00
parent 269f4411ff
commit 37d8b4499c
1 changed files with 13 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/FileTable.vue
View File

@ -51,9 +51,9 @@
<!-- Contenu --> <!-- Contenu -->
<div :class="[ <div :class="[
'overflow-y-auto h-full', 'overflow-y-auto h-full rounded-xl relative',
isDragging ? 'border-green-500 border-4 border-dashed transition-all duration-300 ease-in-out' : '' isDragging ? 'border-green-500 border-4 border-dashed transition-all ease-in-out' : ''
]" @dragover.prevent @dragenter.prevent="enterDrag" @dragleave.prevent="leaveDrag" @drop.prevent="onDrop"> ]" @drop.prevent="onDrop">
<div v-for="file in files" :key="file.filename" <div v-for="file in files" :key="file.filename"
class="flex h-16 items-center hover:bg-NcGray rounded-lg border-b last:border-b-0 border-gray-300" class="flex h-16 items-center hover:bg-NcGray rounded-lg border-b last:border-b-0 border-gray-300"
@ -95,6 +95,11 @@
{{ file.type === 'directory' ? '-' : formatFileSize(file.size) }} {{ file.type === 'directory' ? '-' : formatFileSize(file.size) }}
</div> </div>
</div> </div>
<div class="absolute top-0 left-0 w-full h-full"
@dragenter.prevent="onDragEnter" @dragleave.prevent="onDragLeave">
</div>
</div> </div>
</div> </div>
@ -164,10 +169,12 @@ export default {
const parts = this.breadcrumbParts.slice(0, index + 1); const parts = this.breadcrumbParts.slice(0, index + 1);
return '/' + parts.join('/'); return '/' + parts.join('/');
}, },
enterDrag() { onDragEnter(event) {
event.preventDefault();
this.isDragging = true; this.isDragging = true;
}, },
leaveDrag() { onDragLeave(event) {
event.preventDefault();
this.isDragging = false; this.isDragging = false;
}, },
getBreadcrumbParts() { getBreadcrumbParts() {
@ -214,6 +221,7 @@ export default {
}, },
async onDrop(event) { async onDrop(event) {
event.preventDefault(); event.preventDefault();
this.isDragging = false;
try { try {
this.isTransfering = true; this.isTransfering = true;