nexus/vuefilemanager
2
0
Fork 0
mirror of https://github.com/VueFileManager/vuefilemanager.git synced 2026-04-18 08:12:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

upload progressbar UI

Browse Source
This commit is contained in:
Peter Papp
2021-02-07 09:19:28 +01:00
parent e984ae6beb
commit d92bb50a03
4 changed files with 49 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
resources/js/components/FilesView/UploadProgress.vue
View File

@@ -1,20 +1,26 @@
<template>
<transition name="info-panel">
<div v-if="uploadingFilesCount" class="upload-progress">
<div v-if="filesQueue.length > 0" class="upload-progress">
<div class="progress-title">
<!--Is processing-->
<span v-if="isProcessingFile">
<refresh-cw-icon size="12" class="sync-alt"></refresh-cw-icon>
{{ $t('uploading.processing_file') }}
</span>
<span v-if="!isProcessingFile && uploadingFilesCount.total === 1">
{{ $t('uploading.progress_single_upload', {progress: uploadingFileProgress}) }}
<!--Single file upload-->
<span v-if="!isProcessingFile && filesQueue.length === 1">
{{ $t('uploading.progress_single_upload', {progress: 80}) }}
</span>
<span v-if="!isProcessingFile && uploadingFilesCount.total > 1">
{{ $t('uploading.progress', {current:uploadingFilesCount.current, total: uploadingFilesCount.total, progress: uploadingFileProgress}) }}
<!--Multi file upload-->
<span v-if="!isProcessingFile && filesQueue.length > 1">
{{ $t('uploading.progress', {current:'x', total: filesQueue.length, progress: 80}) }}
</span>
</div>
<div class="progress-wrapper">
<ProgressBar :progress="uploadingFileProgress" />
<ProgressBar :progress="80" />
<span @click="cancelUpload" :title="$t('uploading.cancel')" class="cancel-icon">
<x-icon size="16" @click="cancelUpload"></x-icon>
</span>
@@ -38,9 +44,8 @@
},
computed: {
...mapGetters([
'uploadingFileProgress',
'uploadingFilesCount',
'isProcessingFile',
'filesQueue',
])
},
methods: {