RMS/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

selected nested sidebar

Browse Source
This commit is contained in:
AminGhasempoor
2024-03-02 15:55:45 +03:30
parent bdf050f2ba
commit 6ac4f7c5f9
8 changed files with 325 additions and 120 deletions
Download Patch File Download Diff File Expand all files Collapse all files

74
src/core/components/SidebarSubitems.jsx Normal file
View File

@@ -0,0 +1,74 @@
import {Collapse, List, ListItem, ListItemButton, ListItemIcon, ListItemText} from "@mui/material";
import {ExpandLess, ExpandMore} from "@mui/icons-material";
const SidebarSubitems = ({subitem, dispatch}) => {
return (
<>
<List disablePadding>
<ListItem disablePadding>
<ListItemButton sx={{
'&.Mui-selected': {
backgroundColor: 'rgba(0, 0, 0, 0.1)',
},
}} selected={subitem.selected} onClick={() => {
dispatch({type: "COLLAPSE_SUB_ITEMS", id: subitem.id})
}}>
<ListItemIcon
sx={{
minWidth: 0,
justifyContent: "center",
color: "primary.main",
width: 40,
height: 24,
pr: 2,
}}
>
{subitem.icon}
</ListItemIcon>
<ListItemText primary={subitem.firstName}/>
{subitem.hasSubitems ? (subitem.showSubitems ? <ExpandLess/> : <ExpandMore/>) : null
}
</ListItemButton>
</ListItem>
</List>
{
subitem.hasSubitems ? (subitem.Subitems.map((subSubitem, index) => {
return (
<Collapse key={index} in={subitem.showSubitems} timeout="auto" mountOnEnter={true} unmountOnExit={true}>
<List disablePadding>
<ListItem disablePadding>
<ListItemButton
onClick={() => {
dispatch({type: "COLLAPSE_SUB_SECOND_ITEMS", id: subSubitem.id})
}}
selected={subSubitem.selected}
sx={{
'&.Mui-selected': {
backgroundColor: 'rgba(0, 0, 0, 0.05)',
},
}}
>
<ListItemIcon
sx={{
minWidth: 0,
justifyContent: "center",
color: "primary.main",
width: 40,
height: 24,
pr: 2,
}}
>
{subSubitem.icon}
</ListItemIcon>
<ListItemText primary={subSubitem.shahrokh}/>
</ListItemButton>
</ListItem>
</List>
</Collapse>
)
})) : null
}
</>
)
}
export default SidebarSubitems