This commit is contained in:
Amirhossein Mahmoodi
2024-07-08 15:45:39 +03:30
parent 20a0b2984c
commit 6288ac926c
14 changed files with 853 additions and 403 deletions

View File

@@ -1,74 +1,75 @@
import {Collapse, List, ListItem, ListItemButton, ListItemIcon, ListItemText} from "@mui/material";
import {ExpandLess, ExpandMore} from "@mui/icons-material";
import { ExpandLess, ExpandMore } from "@mui/icons-material";
import {
Collapse,
List,
ListItem,
ListItemButton,
ListItemIcon,
ListItemText,
} from "@mui/material";
import Link from "next/link";
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
const SidebarSubitems = ({ subitem, dispatch }) => {
return (
<>
<ListItem disablePadding divider>
<ListItemButton
disableGutters
sx={{ py: 1, px: 0.5, pl: 1 }}
selected={subitem.selected}
component={subitem.type === "page" ? Link : null}
href={subitem.type === "page" ? subitem.route : null}
onClick={() => {
dispatch({ type: "COLLAPSE_SUB_ITEMS", id: subitem.id });
}}
>
<ListItemIcon
sx={{
minWidth: 0,
justifyContent: "center",
width: 40,
height: 24,
}}
>
{subitem.icon}
</ListItemIcon>
<ListItemText primary={subitem.label} />
{subitem.hasSubitems ? (
subitem.showSubitems ? (
<ExpandLess />
) : (
<ExpandMore />
)
) : null}
</ListItemButton>
</ListItem>
<Collapse
in={subitem.showSubitems}
timeout="auto"
mountOnEnter={true}
unmountOnExit={true}
>
{subitem.hasSubitems ? (
<List
disablePadding
dense
sx={{
background: "#00000008",
}}
>
{subitem.Subitems.map((subSubitem, index) => {
return (
<SidebarSubitems
key={index}
dispatch={dispatch}
subitem={subSubitem}
/>
);
})}
</List>
) : null}
</Collapse>
</>
);
};
export default SidebarSubitems;