diff --git a/client/package.json b/client/package.json index fe48e21..b138b7e 100644 --- a/client/package.json +++ b/client/package.json @@ -22,7 +22,7 @@ "dependencies": { "@fortawesome/fontawesome-free": "^6.2.0", "animejs": "^3.2.0", - "axios": "^0.21.4", + "axios": "^0.24.0", "date-fns": "^2.29.3", "emoji-datasource": "^6.0.1", "eventemitter3": "^4.0.7", diff --git a/client/src/components/files.vue b/client/src/components/files.vue index 1c99496..320df30 100644 --- a/client/src/components/files.vue +++ b/client/src/components/files.vue @@ -19,7 +19,7 @@

{{ download.name }}

-

{{ Math.max(100, Math.round(download.progress / download.size * 100))}}%

+

{{ Math.min(100, Math.round(download.progress / download.size * 100))}}%

t.name).includes(item.name)) { + return + } + const url = `/file?pwd=${this.$accessor.password}&filename=${item.name}` let transfer: FileTransfer = { id: Math.round(Math.random() * 10000), @@ -210,15 +214,16 @@ import { FileTransfer } from '~/neko/types' progress: 0, status: 'pending', axios: null, - // TODO add support for aborting in progress requests, requires axios >=0.22 abortController: null } + transfer.abortController = new AbortController() transfer.axios = this.$http.get(url, { responseType: 'blob', + signal: transfer.abortController.signal, onDownloadProgress: (x) => { transfer.progress = x.loaded - if (x.lengthComputable) { + if (x.lengthComputable && transfer.size !== x.total) { transfer.size = x.total } if (transfer.progress === transfer.size) { @@ -240,9 +245,11 @@ import { FileTransfer } from '~/neko/types' this.$accessor.files.addTransfer(transfer) } - removeTransfer(item: FileTransfer) { - console.log(item) - this.$accessor.files.removeTransfer(item) + removeTransfer(transfer: FileTransfer) { + if (transfer.status !== 'completed') { + transfer.abortController?.abort() + } + this.$accessor.files.removeTransfer(transfer) } fileIcon(file: any) { @@ -261,16 +268,16 @@ import { FileTransfer } from '~/neko/types' case 'mp3': case 'flac': className += 'fa-music' - break; + break case 'webm': case 'mp4': case 'mkv': className += 'fa-film' - break; + break default: className += 'fa-file' } - return className; + return className } fileSize(size: number) {