Fix error display during upload after refactor

This commit is contained in:
Kloon ImKloon 2023-09-07 15:48:05 +02:00
parent 808cd1d20e
commit 856de2a69c
No known key found for this signature in database
GPG Key ID: CCF1C86A995C5B6A
2 changed files with 14 additions and 4 deletions

View File

@ -19,6 +19,7 @@ export const useUploadStore = defineStore("upload", {
progress: [], progress: [],
queue: [], queue: [],
uploads: {}, uploads: {},
error: null,
}), }),
getters: { getters: {
// user and jwt getter removed, no longer needed // user and jwt getter removed, no longer needed
@ -68,6 +69,9 @@ export const useUploadStore = defineStore("upload", {
// Vue.set(this.progress, id, loaded); // Vue.set(this.progress, id, loaded);
this.progress[id] = loaded; this.progress[id] = loaded;
}, },
setError(error) {
this.error = error;
},
reset() { reset() {
this.id = 0; this.id = 0;
this.sizes = []; this.sizes = [];
@ -130,8 +134,7 @@ export const useUploadStore = defineStore("upload", {
this.moveJob(); this.moveJob();
if (item.file.isDir) { if (item.file.isDir) {
// TODO: find a way to display notification await api.post(item.path).catch(this.setError);
await api.post(item.path).catch(console.error);
} else { } else {
let onUpload = throttle( let onUpload = throttle(
(event) => (event) =>
@ -143,10 +146,9 @@ export const useUploadStore = defineStore("upload", {
{ leading: true, trailing: false } { leading: true, trailing: false }
); );
// TODO: find a way to display notification
await api await api
.post(item.path, item.file, item.overwrite, onUpload) .post(item.path, item.file, item.overwrite, onUpload)
.catch(console.error); .catch(this.setError);
} }
this.finishUpload(item); this.finishUpload(item);

View File

@ -25,6 +25,7 @@ import { files as api } from "@/api";
import { mapState, mapActions, mapWritableState } from "pinia"; import { mapState, mapActions, mapWritableState } from "pinia";
import { useFileStore } from "@/stores/file"; import { useFileStore } from "@/stores/file";
import { useLayoutStore } from "@/stores/layout"; import { useLayoutStore } from "@/stores/layout";
import { useUploadStore } from "@/stores/upload";
import HeaderBar from "@/components/header/HeaderBar.vue"; import HeaderBar from "@/components/header/HeaderBar.vue";
import Breadcrumbs from "@/components/Breadcrumbs.vue"; import Breadcrumbs from "@/components/Breadcrumbs.vue";
@ -52,6 +53,7 @@ export default {
width: window.innerWidth, width: window.innerWidth,
}; };
}, },
inject: ["$showError"],
computed: { computed: {
...mapWritableState(useFileStore, [ ...mapWritableState(useFileStore, [
"req", "req",
@ -62,6 +64,9 @@ export default {
]), ]),
...mapState(useLayoutStore, ["show", "showShell"]), ...mapState(useLayoutStore, ["show", "showShell"]),
...mapWritableState(useLayoutStore, ["loading"]), ...mapWritableState(useLayoutStore, ["loading"]),
...mapState(useUploadStore, {
uploadError: "error",
}),
currentView() { currentView() {
if (this.req.type == undefined) { if (this.req.type == undefined) {
return null; return null;
@ -89,6 +94,9 @@ export default {
this.fetchData(); this.fetchData();
} }
}, },
uploadError(newValue, oldValue) {
newValue && newValue !== oldValue && this.$showError(this.uploadError);
},
}, },
mounted() { mounted() {
this.isFiles = true; this.isFiles = true;