| | |
| | | import * as React from 'react'; |
| | | import { useCallback } from 'react'; |
| | | import DownloadIcon from '@mui/icons-material/GetApp'; |
| | | import * as React from "react"; |
| | | import { useCallback } from "react"; |
| | | import DownloadIcon from "@mui/icons-material/GetApp"; |
| | | import { |
| | | Button, useDataProvider, useNotify, useListContext |
| | | } from 'react-admin'; |
| | | Button, |
| | | useDataProvider, |
| | | useNotify, |
| | | useListContext, |
| | | } from "react-admin"; |
| | | |
| | | const MyExportButton = (props) => { |
| | | const { |
| | | maxResults = 1000, |
| | | onClick, |
| | | label = 'ra.action.export', |
| | | icon = defaultIcon, |
| | | exporter: customExporter, |
| | | meta, |
| | | ...rest |
| | | } = props; |
| | | const { |
| | | maxResults = 1000, |
| | | onClick, |
| | | label = "ra.action.export", |
| | | icon = defaultIcon, |
| | | exporter: customExporter, |
| | | meta, |
| | | ...rest |
| | | } = props; |
| | | |
| | | const { |
| | | filter, |
| | | filterValues, |
| | | resource, |
| | | sort, |
| | | total, |
| | | } = useListContext(); |
| | | const { filter, filterValues, resource, sort, total } = useListContext(); |
| | | |
| | | const dataProvider = useDataProvider(); |
| | | const notify = useNotify(); |
| | | const dataProvider = useDataProvider(); |
| | | const notify = useNotify(); |
| | | |
| | | const handleClick = useCallback( |
| | | event => { |
| | | dataProvider.export(resource, { |
| | | sort, |
| | | filter: filter |
| | | ? { ...filterValues, ...filter } |
| | | : filterValues, |
| | | pagination: { page: 1, perPage: maxResults }, |
| | | meta, |
| | | }).then((res) => { |
| | | const url = window.URL.createObjectURL(new Blob([res.data], { type: res.headers['content-type'] })); |
| | | const link = document.createElement('a'); |
| | | link.href = url; |
| | | link.setAttribute('download', `${resource}.xlsx`); |
| | | document.body.appendChild(link); |
| | | link.click(); |
| | | link.remove(); |
| | | }).catch(error => { |
| | | console.error(error); |
| | | notify('ra.notification.http_error', { type: 'error' }); |
| | | }); |
| | | if (typeof onClick === 'function') { |
| | | onClick(event); |
| | | } |
| | | }, |
| | | [ |
| | | dataProvider, |
| | | filter, |
| | | filterValues, |
| | | maxResults, |
| | | notify, |
| | | onClick, |
| | | resource, |
| | | sort, |
| | | meta, |
| | | ] |
| | | ); |
| | | const handleClick = useCallback( |
| | | (event) => { |
| | | dataProvider |
| | | .export(resource, { |
| | | sort, |
| | | filter: filter ? { ...filterValues, ...filter } : filterValues, |
| | | pagination: { page: 1, perPage: maxResults }, |
| | | meta, |
| | | }) |
| | | .then((res) => { |
| | | const url = window.URL.createObjectURL( |
| | | new Blob([res.data], { type: res.headers["content-type"] }), |
| | | ); |
| | | const link = document.createElement("a"); |
| | | link.href = url; |
| | | link.setAttribute("download", `${resource}.xlsx`); |
| | | document.body.appendChild(link); |
| | | link.click(); |
| | | link.remove(); |
| | | }) |
| | | .catch((error) => { |
| | | console.error(error); |
| | | notify("ra.notification.http_error", { type: "error" }); |
| | | }); |
| | | if (typeof onClick === "function") { |
| | | onClick(event); |
| | | } |
| | | }, |
| | | [ |
| | | dataProvider, |
| | | filter, |
| | | filterValues, |
| | | maxResults, |
| | | notify, |
| | | onClick, |
| | | resource, |
| | | sort, |
| | | meta, |
| | | ], |
| | | ); |
| | | |
| | | return ( |
| | | <Button |
| | | onClick={handleClick} |
| | | label={label} |
| | | disabled={total === 0} |
| | | {...sanitizeRestProps(rest)} |
| | | > |
| | | {icon} |
| | | </Button> |
| | | ); |
| | | return ( |
| | | <Button |
| | | onClick={handleClick} |
| | | label={label} |
| | | disabled={total === 0} |
| | | {...sanitizeRestProps(rest)} |
| | | > |
| | | {icon} |
| | | </Button> |
| | | ); |
| | | }; |
| | | |
| | | const defaultIcon = <DownloadIcon />; |
| | | |
| | | const sanitizeRestProps = ({ |
| | | resource, |
| | | ...rest |
| | | }) => rest; |
| | | const sanitizeRestProps = ({ resource, ...rest }) => rest; |
| | | |
| | | export default MyExportButton; |