fix: display newsletter progress in client
This commit is contained in:
parent
52a35be6c5
commit
a8e2b05d8e
6 changed files with 72 additions and 40 deletions
|
@ -1,8 +1,9 @@
|
|||
import { defineStore } from "pinia";
|
||||
import { http, newEventSource } from "@/serverCom";
|
||||
import { http, newEventSource, streamingFetch } from "@/serverCom";
|
||||
import { useNewsletterStore } from "./newsletter";
|
||||
import type { AxiosResponse } from "axios";
|
||||
import type { EventSourcePolyfill } from "event-source-polyfill";
|
||||
import { useNotificationStore, type NotificationType } from "../../../notification";
|
||||
|
||||
export const useNewsletterPrintoutStore = defineStore("newsletterPrintout", {
|
||||
state: () => {
|
||||
|
@ -12,10 +13,10 @@ export const useNewsletterPrintoutStore = defineStore("newsletterPrintout", {
|
|||
printing: undefined as undefined | "loading" | "success" | "failed",
|
||||
sending: undefined as undefined | "loading" | "success" | "failed",
|
||||
sendingPreview: undefined as undefined | "loading" | "success" | "failed",
|
||||
pdfProgessSource: undefined as undefined | EventSourcePolyfill,
|
||||
mailProgessSource: undefined as undefined | EventSourcePolyfill,
|
||||
pdfSourceMessages: [] as Array<Object>,
|
||||
mailSourceMessages: [] as Array<Object>,
|
||||
pdfPrintingAbort: undefined as undefined | AbortController,
|
||||
mailSendingAbort: undefined as undefined | AbortController,
|
||||
};
|
||||
},
|
||||
actions: {
|
||||
|
@ -63,6 +64,7 @@ export const useNewsletterPrintoutStore = defineStore("newsletterPrintout", {
|
|||
});
|
||||
},
|
||||
createNewsletterPrintout() {
|
||||
this.subscribePdfPrintingProgress();
|
||||
this.printing = "loading";
|
||||
const newsletterId = useNewsletterStore().activeNewsletter;
|
||||
if (newsletterId == null) return;
|
||||
|
@ -78,10 +80,12 @@ export const useNewsletterPrintoutStore = defineStore("newsletterPrintout", {
|
|||
.finally(() => {
|
||||
setTimeout(() => {
|
||||
this.printing = undefined;
|
||||
this.pdfPrintingAbort?.abort();
|
||||
}, 1500);
|
||||
});
|
||||
},
|
||||
createNewsletterSend() {
|
||||
this.subscribeMailSendingProgress();
|
||||
this.sending = "loading";
|
||||
const newsletterId = useNewsletterStore().activeNewsletter;
|
||||
if (newsletterId == null) return;
|
||||
|
@ -96,32 +100,47 @@ export const useNewsletterPrintoutStore = defineStore("newsletterPrintout", {
|
|||
.finally(() => {
|
||||
setTimeout(() => {
|
||||
this.sending = undefined;
|
||||
this.mailSendingAbort?.abort();
|
||||
}, 1500);
|
||||
});
|
||||
},
|
||||
subscribePdfPrintingProgress() {
|
||||
// const newsletterId = useNewsletterStore().activeNewsletter;
|
||||
// if (this.pdfProgessSource != undefined) return;
|
||||
// this.pdfProgessSource = newEventSource(`/admin/newsletter/${newsletterId}/printoutprogress`);
|
||||
// this.pdfProgessSource.onmessage = (event) => {
|
||||
// console.log("pdf", event);
|
||||
// };
|
||||
async subscribePdfPrintingProgress() {
|
||||
this.pdfSourceMessages = [];
|
||||
const newsletterId = useNewsletterStore().activeNewsletter;
|
||||
const notificationStore = useNotificationStore();
|
||||
this.pdfPrintingAbort = new AbortController();
|
||||
for await (let chunk of streamingFetch(
|
||||
`/admin/newsletter/${newsletterId}/printoutprogress`,
|
||||
this.pdfPrintingAbort
|
||||
)) {
|
||||
chunk.split("//").forEach((r) => {
|
||||
if (r.trim() != "") {
|
||||
let data = JSON.parse(r);
|
||||
this.pdfSourceMessages.push(data);
|
||||
let type: NotificationType = "info";
|
||||
if (data.factor == "failed") type = "error";
|
||||
notificationStore.push(`Druck: ${data.iteration}/${data.total}`, `${data.msg}`, type);
|
||||
}
|
||||
});
|
||||
this.fetchNewsletterPrintout();
|
||||
}
|
||||
},
|
||||
subscribeMailSendingProgress() {
|
||||
// const newsletterId = useNewsletterStore().activeNewsletter;
|
||||
// if (this.mailProgessSource != undefined) return;
|
||||
// this.mailProgessSource = newEventSource(`/admin/newsletter/${newsletterId}/sendprogress`);
|
||||
// this.mailProgessSource.onmessage = (event) => {
|
||||
// console.log("mail", event);
|
||||
// };
|
||||
},
|
||||
unsubscribePdfPrintingProgress() {
|
||||
this.pdfProgessSource?.close();
|
||||
this.pdfProgessSource = undefined;
|
||||
},
|
||||
unsubscribeMailSendingProgress() {
|
||||
this.mailProgessSource?.close();
|
||||
this.mailProgessSource = undefined;
|
||||
async subscribeMailSendingProgress() {
|
||||
this.mailSourceMessages = [];
|
||||
const newsletterId = useNewsletterStore().activeNewsletter;
|
||||
const notificationStore = useNotificationStore();
|
||||
this.mailSendingAbort = new AbortController();
|
||||
for await (let chunk of streamingFetch(`/admin/newsletter/${newsletterId}/sendprogress`, this.mailSendingAbort)) {
|
||||
chunk.split("//").forEach((r) => {
|
||||
if (r.trim() != "") {
|
||||
let data = JSON.parse(r);
|
||||
this.mailSourceMessages.push(data);
|
||||
let type: NotificationType = "info";
|
||||
if (data.factor == "failed") type = "error";
|
||||
notificationStore.push(`Mailversand: ${data.iteration}/${data.total}`, `${data.msg}`, type);
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue