#

whycq

2025-02-27 08824ef346ed8af8eafd6a5480c42dbe0daaf1f2

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
import React, { useState, useRef, useEffect, useMemo } from "react";
import {
    Button,
    useTranslate,
} from 'react-admin';
import { Fab, useMediaQuery } from '@mui/material';
import ContentAdd from '@mui/icons-material/Add';
import { styled } from '@mui/material/styles';
import { Link } from 'react-router-dom';
 
const MyCreateButton = (props) => {
    const translate = useTranslate();
 
    const isSmall = useMediaQuery((theme) =>
        theme.breakpoints.down('md')
    );
 
    return isSmall ? (
        <StyledFab
            color="primary"
            className={CreateButtonClasses.floating}
            aria-label={label && translate(label)}
            onClick={props.onClick}
            {...props}
        >
            {defaultIcon}
        </StyledFab>
    ) : (
        <StyledButton
            className={CreateButtonClasses.floating}
            label={label}
            onClick={props.onClick}
            {...props}
        >
            {defaultIcon}
        </StyledButton>
    );
}
 
const label = 'ra.action.create';
const PREFIX = 'RaCreateButton';
const defaultIcon = <ContentAdd />;
 
export const CreateButtonClasses = {
    root: `${PREFIX}-root`,
    floating: `${PREFIX}-floating`,
};
 
const StyledFab = styled(Fab, {
    name: PREFIX,
    overridesResolver: (_props, styles) => styles.root,
})(({ theme }) => ({
    [`&.${CreateButtonClasses.floating}`]: {
        color: theme.palette.getContrastText(theme.palette.primary.main),
        margin: 0,
        top: 'auto',
        right: 20,
        bottom: 60,
        left: 'auto',
        position: 'fixed',
        zIndex: 1000,
    },
}));
 
const StyledButton = styled(Button, {
    name: PREFIX,
    overridesResolver: (_props, styles) => styles.root,
})({});
 
export default MyCreateButton;