From c9cc0d3d5dd3dc69147794299e6e8785f740c231 Mon Sep 17 00:00:00 2001 From: Ramires Viana <59319979+ramiresviana@users.noreply.github.com> Date: Wed, 8 Jul 2020 14:12:33 +0000 Subject: [PATCH] refactor: upload vuex module --- frontend/src/components/files/Listing.vue | 2 +- frontend/src/store/getters.js | 6 ++-- frontend/src/store/index.js | 12 +++----- frontend/src/store/modules/upload.js | 34 +++++++++++++++++++++++ frontend/src/store/mutations.js | 23 --------------- frontend/src/utils/upload.js | 18 ++++++------ 6 files changed, 51 insertions(+), 44 deletions(-) create mode 100644 frontend/src/store/modules/upload.js diff --git a/frontend/src/components/files/Listing.vue b/frontend/src/components/files/Listing.vue index c846e2e9..d34d2f10 100644 --- a/frontend/src/components/files/Listing.vue +++ b/frontend/src/components/files/Listing.vue @@ -103,7 +103,7 @@ export default { } }, computed: { - ...mapState(['req', 'selected', 'user', 'show', 'uploading']), + ...mapState(['req', 'selected', 'user', 'show']), nameSorted () { return (this.req.sorting.by === 'name') }, diff --git a/frontend/src/store/getters.js b/frontend/src/store/getters.js index 3188ea41..0f9925f4 100644 --- a/frontend/src/store/getters.js +++ b/frontend/src/store/getters.js @@ -5,12 +5,12 @@ const getters = { isEditor: (state, getters) => getters.isFiles && (state.req.type === 'text' || state.req.type === 'textImmutable'), selectedCount: state => state.selected.length, progress : state => { - if (state.uploading.progress.length == 0) { + if (state.upload.progress.length == 0) { return 0; } - let sum = state.uploading.progress.reduce((acc, val) => acc + val) - return Math.ceil(sum / state.uploading.size * 100); + let sum = state.upload.progress.reduce((acc, val) => acc + val) + return Math.ceil(sum / state.upload.size * 100); } } diff --git a/frontend/src/store/index.js b/frontend/src/store/index.js index 0529d89e..3662d3a6 100644 --- a/frontend/src/store/index.js +++ b/frontend/src/store/index.js @@ -2,6 +2,7 @@ import Vue from 'vue' import Vuex from 'vuex' import mutations from './mutations' import getters from './getters' +import upload from './modules/upload' Vue.use(Vuex) @@ -22,18 +23,13 @@ const state = { show: null, showShell: false, showMessage: null, - showConfirm: null, - uploading: { - id: 0, - count: 0, - size: 0, - progress: [] - } + showConfirm: null } export default new Vuex.Store({ strict: true, state, getters, - mutations + mutations, + modules: { upload } }) diff --git a/frontend/src/store/modules/upload.js b/frontend/src/store/modules/upload.js new file mode 100644 index 00000000..c1378d9a --- /dev/null +++ b/frontend/src/store/modules/upload.js @@ -0,0 +1,34 @@ +import Vue from 'vue' + +const state = { + id: 0, + count: 0, + size: 0, + progress: [] +} + +const mutations = { + incrementId: (state) => { + state.id = state.id + 1 + }, + incrementSize: (state, value) => { + state.size = state.size + value + }, + incrementCount: (state) => { + state.count = state.count + 1 + }, + decreaseCount: (state) => { + state.count = state.count - 1 + }, + setProgress(state, { id, loaded }) { + Vue.set(state.progress, id, loaded) + }, + reset: (state) => { + state.id = 0 + state.size = 0 + state.count = 0 + state.progress = [] + } +} + +export default { state, mutations, namespaced: true } \ No newline at end of file diff --git a/frontend/src/store/mutations.js b/frontend/src/store/mutations.js index 595406a6..579edbec 100644 --- a/frontend/src/store/mutations.js +++ b/frontend/src/store/mutations.js @@ -1,4 +1,3 @@ -import Vue from 'vue' import * as i18n from '@/i18n' import moment from 'moment' @@ -83,28 +82,6 @@ const mutations = { resetClipboard: (state) => { state.clipboard.key = '' state.clipboard.items = [] - }, - - uploadingIncrementId: (state) => { - state.uploading.id = state.uploading.id + 1 - }, - uploadingIncrementSize: (state, value) => { - state.uploading.size = state.uploading.size + value - }, - uploadingIncrementCount: (state) => { - state.uploading.count = state.uploading.count + 1 - }, - uploadingDecreaseCount: (state) => { - state.uploading.count = state.uploading.count - 1 - }, - uploadigSetProgress(state, { id, loaded }) { - Vue.set(state.uploading.progress, id, loaded) - }, - uploadingReset: (state) => { - state.uploading.id = 0 - state.uploading.size = 0 - state.uploading.count = 0 - state.uploading.progress = [] } } diff --git a/frontend/src/utils/upload.js b/frontend/src/utils/upload.js index f1921953..32b32fa9 100644 --- a/frontend/src/utils/upload.js +++ b/frontend/src/utils/upload.js @@ -102,14 +102,14 @@ export function scanFiles(dt) { } export function handleFiles(files, path, overwrite = false) { - if (store.state.uploading.count == 0) { + if (store.state.upload.count == 0) { buttons.loading('upload') } let promises = [] let onupload = (id) => (event) => { - store.commit('uploadigSetProgress', { id, loaded: event.loaded }) + store.commit('upload/setProgress', { id, loaded: event.loaded }) } for (let i = 0; i < files.length; i++) { @@ -119,14 +119,14 @@ export function handleFiles(files, path, overwrite = false) { let filename = (file.fullPath !== undefined) ? file.fullPath : file.name let filenameEncoded = url.encodeRFC5987ValueChars(filename) - let id = store.state.uploading.id + let id = store.state.upload.id - store.commit('uploadingIncrementSize', file.size) - store.commit('uploadingIncrementId') - store.commit('uploadingIncrementCount') + store.commit('upload/incrementSize', file.size) + store.commit('upload/incrementId') + store.commit('upload/incrementCount') let promise = api.post(path + filenameEncoded, file, overwrite, throttle(onupload(id), 100)).finally(() => { - store.commit('uploadingDecreaseCount') + store.commit('upload/decreaseCount') }) promises.push(promise) @@ -145,14 +145,14 @@ export function handleFiles(files, path, overwrite = false) { } let finish = () => { - if (store.state.uploading.count > 0) { + if (store.state.upload.count > 0) { return } buttons.success('upload') store.commit('setReload', true) - store.commit('uploadingReset') + store.commit('upload/reset') } Promise.all(promises)