Connect download pdf endpoint to frontend

This commit is contained in:
Dana Lambert 2021-11-18 11:18:18 +13:00
parent c63dbeae61
commit 04b391ceb7
2 changed files with 21 additions and 7 deletions

View file

@ -52,14 +52,24 @@ export default function ResultsStep(props) {
})
}
const downloadCSV = () => {
PlantRepository.getPlantsCSV(props.filters).then(response => {
const url = window.URL.createObjectURL(new Blob([response.data], {type : 'text/csv'}));
const download = (response, fileType, fileName) => {
const url = window.URL.createObjectURL(new Blob([response.data], {type : fileType }));
const link = document.createElement('a');
link.href = url;
link.setAttribute('download', 'plants.csv');
link.setAttribute('download', fileName);
document.body.appendChild(link);
link.click();
}
const downloadCSV = () => {
PlantRepository.getPlantsCSV(props.filters).then(response => {
download(response, "text/csv", "plants.csv")
})
}
const downloadPDF = () => {
PlantRepository.getPlantsPDF(props.filters).then(response => {
download(response, "application/pdf", "planting_guide.pdf")
})
}
@ -68,7 +78,7 @@ export default function ResultsStep(props) {
<Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }} className="pb-4">
<Typography variant='h5'>Plant List Results</Typography>
<Stack spacing={2} direction="row" justifyContent="end">
<Button variant="contained">Download PDF</Button>
<Button variant="contained" onClick={() => downloadPDF()}>Download PDF</Button>
<Button variant="contained" onClick={() => downloadCSV()}>Download CSV</Button>
</Stack>
</Box>

View file

@ -8,6 +8,10 @@ const PlantRepository = {
getPlantsCSV(filters) {
return Repository.get('/download/csv/', { params: filters })
},
getPlantsPDF(filters) {
return Repository.get('/download/pdf/', { params: filters, responseType: 'arraybuffer' })
}
}