Ehrenamt/ff-admin
2
0
Fork 0
Code Issues 13 Pull requests Projects Releases 25 Packages Wiki Activity Actions

show render or download

Browse source
This commit is contained in:
Julian Krauser 2024-10-20 17:42:19 +02:00
parent f3ffdb1ffd
commit 28ac0a835b
3 changed files with 82 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

39
src/views/admin/club/protocol/ProtocolPrintout.vue
View file

@ -13,6 +13,14 @@
>
<div class="bg-primary p-2 text-white flex flex-row justify-between items-center">
<p>{{ print.title }}</p>
<div class="flex flex-row">
<div>
<ViewfinderCircleIcon class="w-5 h-5 p-1 box-content cursor-pointer" @click="openPdfShow(print.id)" />
</div>
<div>
<ArrowDownTrayIcon class="w-5 h-5 p-1 box-content cursor-pointer" @click="downloadPdf(print.id)" />
</div>
</div>
</div>
<div class="p-2">
<p>Ausdruck Nummer: {{ print.iteration }}</p>
@ -33,12 +41,14 @@
</template>
<script setup lang="ts">
import { defineComponent } from "vue";
import { defineAsyncComponent, defineComponent, markRaw } from "vue";
import { mapActions, mapState } from "pinia";
import Spinner from "@/components/Spinner.vue";
import SuccessCheckmark from "@/components/SuccessCheckmark.vue";
import FailureXMark from "@/components/FailureXMark.vue";
import { useProtocolPrintoutStore } from "@/stores/admin/protocolPrintout";
import { ArrowDownTrayIcon, ViewfinderCircleIcon } from "@heroicons/vue/24/outline";
import { useModalStore } from "@/stores/modal";
</script>
<script lang="ts">
@ -53,7 +63,32 @@ export default defineComponent({
this.fetchProtocolPrintout();
},
methods: {
...mapActions(useProtocolPrintoutStore, ["fetchProtocolPrintout", "createProtocolPrintout"]),
...mapActions(useModalStore, ["openModal"]),
...mapActions(useProtocolPrintoutStore, [
"fetchProtocolPrintout",
"createProtocolPrintout",
"fetchProtocolPrintoutById",
]),
openPdfShow(id: number) {
this.openModal(
markRaw(defineAsyncComponent(() => import("@/components/admin/club/protocol/ProtocolPrintoutViewerModal.vue"))),
id
);
},
downloadPdf(id: number) {
let clickedOn = this.printout.find((p) => p.id == id);
this.fetchProtocolPrintoutById(id)
.then((response) => {
const fileURL = window.URL.createObjectURL(new Blob([response.data]));
const fileLink = document.createElement("a");
fileLink.href = fileURL;
fileLink.setAttribute("download", clickedOn?.title ? clickedOn.title + ".pdf" : "Protokoll.pdf");
document.body.appendChild(fileLink);
fileLink.click();
fileLink.remove();
})
.catch(() => {});
},
},
});
</script>