skyouc
5 天以前 27f59f44345d044967e2048f09dbd704f90ce3db
rsf-admin/src/page/components/MyExportButton.jsx
@@ -1,87 +1,88 @@
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,
  useUnselectAll,
} 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,
    ids,
    label = "ra.action.export",
    icon = defaultIcon,
    exporter: customExporter,
    meta,
    ...rest
  } = props;
    const {
        filter,
        filterValues,
        resource,
        sort,
        total,
    } = useListContext();
  const { filter, selectedIds, filterValues, resource, sort, total } = useListContext();
  const unSelect = useUnselectAll(resource);
  const dataProvider = useDataProvider();
  const notify = useNotify();
  const handleClick =
  // useCallback(
    (event) => {
      dataProvider
        .export(resource, {
          sort,
          ids: selectedIds,
          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();
          unSelect();
        })
        .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 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,
        ]
    );
    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;