106 lines
No EOL
3 KiB
JavaScript
106 lines
No EOL
3 KiB
JavaScript
/* default menu */
|
|
|
|
import React from 'react';
|
|
import { withStyles } from '@material-ui/core/styles';
|
|
|
|
import Menu from '@material-ui/core/Menu';
|
|
import MenuItem from '@material-ui/core/MenuItem';
|
|
import ListItemIcon from '@material-ui/core/ListItemIcon';
|
|
|
|
import MenuList from '@material-ui/core/MenuList';
|
|
import { green } from '@material-ui/core/colors';
|
|
import { red } from '@material-ui/core/colors';
|
|
import { blue } from '@material-ui/core/colors';
|
|
|
|
import AddCircleIcon from '@material-ui/icons/AddCircle';
|
|
import DeleteForeverIcon from '@material-ui/icons/DeleteForever';
|
|
import EditIcon from '@material-ui/icons/Edit';
|
|
import SearchIcon from '@material-ui/icons/Search';
|
|
import Typography from '@material-ui/core/Typography';
|
|
|
|
const StyledMenu = withStyles({
|
|
paper: {
|
|
border: '1px solid #d3d4d5',
|
|
},
|
|
})((props) => (
|
|
<Menu
|
|
elevation={0}
|
|
getContentAnchorEl={null}
|
|
anchorOrigin={{
|
|
vertical: 'bottom',
|
|
horizontal: 'center',
|
|
}}
|
|
transformOrigin={{
|
|
vertical: 'top',
|
|
horizontal: 'center',
|
|
}}
|
|
{...props}
|
|
/>
|
|
));
|
|
|
|
/*
|
|
const StyledMenuItem = withStyles((theme) => ({
|
|
root: {
|
|
'&:focus': {
|
|
backgroundColor: theme.palette.primary.main,
|
|
'& .MuiListItemIcon-root, & .MuiListItemText-primary': {
|
|
color: theme.palette.common.white,
|
|
},
|
|
},
|
|
},
|
|
}))(MenuItem);
|
|
*/
|
|
|
|
export default function CustomizedMenus(props) {
|
|
const [anchorEl, setAnchorEl] = React.useState(props.anchorref);
|
|
|
|
const handleClick = (event, menu) => {
|
|
setAnchorEl(event.currentTarget);
|
|
props.menuClicked(menu);
|
|
};
|
|
|
|
const handleClose = () => {
|
|
setAnchorEl(null);
|
|
props.menuClosed();
|
|
};
|
|
|
|
return (
|
|
<div>
|
|
|
|
<StyledMenu
|
|
id="customized-menu"
|
|
anchorEl={anchorEl}
|
|
keepMounted
|
|
open={Boolean(anchorEl)}
|
|
onClose={handleClose}
|
|
>
|
|
<MenuList open={Boolean(anchorEl)} id="menu-list-grow" >
|
|
<MenuItem onClick={(event)=>handleClick(event, "add")}>
|
|
<ListItemIcon>
|
|
<AddCircleIcon style={{ color: green[500] }} fontSize="small" />
|
|
</ListItemIcon>
|
|
<Typography variant="inherit">pridať</Typography>
|
|
</MenuItem>
|
|
<MenuItem onClick={(event)=>handleClick(event, "edit")}>
|
|
<ListItemIcon>
|
|
<EditIcon style={{ color: blue[300] }} fontSize="small" />
|
|
</ListItemIcon>
|
|
<Typography variant="inherit">editovať</Typography>
|
|
</MenuItem>
|
|
<MenuItem onClick={(event)=>handleClick(event, "delete")}>
|
|
<ListItemIcon>
|
|
<DeleteForeverIcon style={{ color: red[500] }} fontSize="small" />
|
|
</ListItemIcon>
|
|
<Typography variant="inherit">zmazať</Typography>
|
|
</MenuItem>
|
|
<MenuItem onClick={(event)=>handleClick(event, "find")}>
|
|
<ListItemIcon>
|
|
<SearchIcon style={{ color: blue[200] }} fontSize="default" />
|
|
</ListItemIcon>
|
|
<Typography variant="inherit">hľadať</Typography>
|
|
</MenuItem>
|
|
</MenuList>
|
|
</StyledMenu>
|
|
</div>
|
|
);
|
|
} |