bananas-commerce-admin
Version:
What's this, an admin for apes?
58 lines • 3.15 kB
JavaScript
import React, { useState } from "react";
import ShoppingCartOutlinedIcon from "@mui/icons-material/ShoppingCartOutlined";
import Button from "@mui/material/Button";
import Card from "@mui/material/Card";
import CardContent from "@mui/material/CardContent";
import CardHeader from "@mui/material/CardHeader";
import Stack from "@mui/material/Stack";
import { useTheme } from "@mui/material/styles";
import Typography from "@mui/material/Typography";
import { AdapterLuxon } from "@mui/x-date-pickers/AdapterLuxon";
import { DatePicker } from "@mui/x-date-pickers/DatePicker";
import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
import { useSnackbar } from "notistack";
import { useApi } from "../../../contexts/ApiContext";
export const PurchaseCard = () => {
const theme = useTheme();
const api = useApi();
const { enqueueSnackbar } = useSnackbar();
const [startDate, setStartDate] = useState(null);
const [endDate, setEndDate] = useState(null);
const generateReport = () => {
if (startDate === null || endDate === null) {
enqueueSnackbar("You need to enter both a start date and an end date to generate a report", {
variant: "error",
});
return;
}
const operation = api.operations["report.purchase:create"];
const url = new URL(operation.server + operation.endpoint);
url.searchParams.set("start_date", startDate.toISODate());
url.searchParams.set("end_date", endDate.toISODate());
const a = document.createElement("a");
a.href = url.toString();
a.click();
a.remove();
enqueueSnackbar(`Downloading report...`, { variant: "success" });
};
return (React.createElement(Card, { sx: {
maxWidth: 450,
} },
React.createElement(CardHeader, { avatar: React.createElement(ShoppingCartOutlinedIcon, null), sx: {
borderBottomWidth: 1,
borderBottomStyle: "solid",
borderBottomColor: theme.palette.divider,
}, title: React.createElement(Typography, { variant: "h6" },
React.createElement("b", null, "Export Purchases")) }),
React.createElement(CardContent, null,
React.createElement(LocalizationProvider, { adapterLocale: "sv-SE", dateAdapter: AdapterLuxon },
React.createElement(Stack, { gap: 2 },
React.createElement(Typography, null, "Generate and download a report of all confirmed purchases between the two selected dates."),
React.createElement(Stack, { alignItems: "center", direction: "row", gap: 2 },
React.createElement(DatePicker, { label: "Start", onChange: (date) => setStartDate(date) }),
"-",
React.createElement(DatePicker, { label: "End", onChange: (date) => setEndDate(date) })),
React.createElement(Button, { color: "success", variant: "contained", onClick: generateReport }, "Download"))))));
};
export default PurchaseCard;
//# sourceMappingURL=PurchaseCard.js.map