3.3 Add schedule export on frontend

This commit is contained in:
adam-skowronek 2022-11-04 01:34:00 +01:00
parent 0cc9482878
commit c29c2a9236
2 changed files with 31 additions and 2 deletions

View File

@ -126,3 +126,11 @@ export const assignSupervisor = ({
},
)
}
export const downloadSchedule = (scheduleId: number) =>
axiosInstance.post(
`http://127.0.0.1:5000/api/coordinator/examination_schedule/${scheduleId}/download/`,
{
responseType: 'blob',
},
)

View File

@ -2,7 +2,7 @@ import { Calendar, luxonLocalizer, Views } from 'react-big-calendar'
import { DateTime, Settings } from 'luxon'
import { useCallback, useState } from 'react'
import { useMutation, useQuery } from 'react-query'
import { createEvent, getEvents } from '../../api/schedule'
import { createEvent, downloadSchedule, getEvents } from '../../api/schedule'
import { useParams } from 'react-router-dom'
import Modal from 'react-modal'
import { useForm } from 'react-hook-form'
@ -84,6 +84,21 @@ const Schedule = () => {
createEvent(data),
)
const { mutate: mutateDownload } = useMutation(
'downloadSchedule',
(scheduleId: number) => downloadSchedule(scheduleId),
{
onSuccess: (res) => {
const url = window.URL.createObjectURL(new Blob([res.data]))
const link = document.createElement('a')
link.href = url
link.setAttribute('download', 'harmonogram.pdf')
document.body.appendChild(link)
link.click()
},
},
)
const handleSelectSlot = async (event: any) => {
setSelectedDate(event)
if (view === Views.MONTH) {
@ -139,7 +154,13 @@ const Schedule = () => {
}
return (
<div>
<div className="flex flex-col">
<button
className="btn btn-success btn-xs md:btn-md self-end mb-4"
onClick={() => mutateDownload(Number(id))}
>
Eksportuj harmonogram
</button>
<Calendar
localizer={luxonLocalizer(DateTime)}
startAccessor="start"