zjj
2 天以前 d086af5559dba52095d23e425be87d8f11f24814
rsf-admin/src/layout/SubMenu.jsx
@@ -1,6 +1,7 @@
import * as React from 'react';
import { ReactElement, ReactNode } from 'react';
import {
    Box,
    List,
    MenuItem,
    ListItemIcon,
@@ -10,21 +11,26 @@
} from '@mui/material';
import ExpandMore from '@mui/icons-material/ExpandMore';
import { useTranslate, useSidebarState } from 'react-admin';
import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';
import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
const SubMenu = (props) => {
    const { handleToggle, isOpen, name, icon, children, dense } = props;
    const translate = useTranslate();
    const [sidebarIsOpen] = useSidebarState();
    const header = (
        <MenuItem dense={dense} onClick={handleToggle} sx={{ display: 'flex', alignItems: 'center' }}>
            <ListItemIcon sx={{ minWidth: 40, color: 'text.secondary', display: 'flex', alignItems: 'center' }}>
                {isOpen ? <ExpandMore /> : icon}
            </ListItemIcon>
            <Typography variant="inherit" color="textSecondary" sx={{ ml: 1, display: 'flex', alignItems: 'center' }}>
                {translate(name)}
            </Typography>
       <MenuItem dense={dense} onClick={handleToggle} sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
            <Box sx={{ display: 'flex', alignItems: 'center', flex: 1 }}>
                <ListItemIcon sx={{ minWidth: 40, color: 'text.secondary', display: 'flex', alignItems: 'center' }}>
                    {icon}
                </ListItemIcon>
                <Typography variant="inherit" color="textSecondary" sx={{ ml: 1, display: 'flex', alignItems: 'center' }}>
                    {translate(name)}
                </Typography>
            </Box>
            <Box sx={{ display: 'flex', alignItems: 'center', minWidth: 24 }}>
                {isOpen ? <KeyboardArrowDownIcon fontSize="small" sx={{color: 'text.secondary'}} /> : <KeyboardArrowRightIcon fontSize="small" sx={{color: 'text.secondary'}} />}
            </Box>
        </MenuItem>
    );
@@ -42,16 +48,21 @@
                    dense={dense}
                    component="div"
                    disablePadding
                    sx={{
                        '& .MuiMenuItem-root': {
                            transition:
                                'padding-left 195ms cubic-bezier(0.4, 0, 0.6, 1) 0ms',
                            paddingLeft: theme =>
                                sidebarIsOpen
                                    ? theme.spacing(4)
                                    : theme.spacing(2),
                        },
                    }}
                    // sx={{
                    //     '& .MuiMenuItem-root': {
                    //         transition:
                    //             'padding-left 195ms cubic-bezier(0.4, 0, 0.6, 1) 0ms',
                    //         paddingLeft: theme =>
                    //             sidebarIsOpen
                    //                 ? theme.spacing(4)
                    //                 : theme.spacing(2),
                    //     },
                    //     // 显示二级菜单的icon
                    //     '& .RaMenuItemLink-icon': {
                    //         visibility: 'visible !important',
                    //         minWidth: '24px'
                    //     }
                    // }}
                >
                    {children}
                </List>