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 -->
<div :class="[
'overflow-y-auto h-full',
isDragging ? 'border-green-500 border-4 border-dashed transition-all duration-300 ease-in-out' : ''
]" @dragover.prevent @dragenter.prevent="enterDrag" @dragleave.prevent="leaveDrag" @drop.prevent="onDrop">
'overflow-y-auto h-full rounded-xl relative',
isDragging ? 'border-green-500 border-4 border-dashed transition-all ease-in-out' : ''
]" @drop.prevent="onDrop">
<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"
@ -95,6 +95,11 @@
{{ file.type === 'directory' ? '-' : formatFileSize(file.size) }}
</div>
</div>
<div class="absolute top-0 left-0 w-full h-full"
@dragenter.prevent="onDragEnter" @dragleave.prevent="onDragLeave">
</div>
</div>
</div>
@ -164,10 +169,12 @@ export default {
const parts = this.breadcrumbParts.slice(0, index + 1);
return '/' + parts.join('/');
},
enterDrag() {
onDragEnter(event) {
event.preventDefault();
this.isDragging = true;
},
leaveDrag() {
onDragLeave(event) {
event.preventDefault();
this.isDragging = false;
},
getBreadcrumbParts() {
@ -214,6 +221,7 @@ export default {
},
async onDrop(event) {
event.preventDefault();
this.isDragging = false;
try {
this.isTransfering = true;