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

Merge branch 'develop' into 'feature/profile_and_icons'

Browse Source 
# Conflicts:
#   src/components/layouts/dashboard/headerWithSidebar/index.jsx
#   src/core/components/SidebarMenu.jsx
This commit is contained in:
AmirHossein Mahmoodi
2024-08-19 10:15:36 +00:00
parent 090e6d0b37 63d284a64f
commit 5186b33a28
45 changed files with 848 additions and 430 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/layouts/dashboard/headerWithLogo/HaederBottom/index.jsx
View File

@@ -15,9 +15,9 @@ const HeaderBottom = () => {
alignItems={"center"}
direction={"row"}
>
<Image alt="" priority src={RmsLogo.src} width={65} height={71} />
<Image alt="" priority src={RmsLogo.src} width={50} height={54} />
<Stack alignItems={"center"} spacing={1}>
<Typography variant="h5" sx={{ color: (theme) => theme.palette.primary2.contrastText }}>
<Typography variant="h6" sx={{ color: (theme) => theme.palette.primary2.contrastText }}>
سامانه جامع راهداری
</Typography>
<Typography sx={{ color: (theme) => theme.palette.primary2.contrastText }}>rms.rmto.ir</Typography>

2
src/components/layouts/dashboard/headerWithLogo/HaederTop/index.jsx
View File

@@ -5,7 +5,7 @@ import HeaderLogo from "@/assets/images/headerLogo.png";
const HeaderTop = () => {
return (
<Stack sx={{ p: 2 }}>
<Image alt="" priority src={HeaderLogo.src} width={190} height={44} />
<Image alt="" priority src={HeaderLogo.src} width={140} height={32} />
</Stack>
);
};

2
src/components/layouts/dashboard/headerWithLogo/index.jsx
View File

@@ -4,7 +4,7 @@ import HeaderBottom from "./HaederBottom";
const HeaderWithLogo = () => {
return (
<Stack sx={{ width: '100%', position: 'fixed', zIndex: 1200, background: '#fff' }}>
<Stack sx={{ width: "100%", position: "fixed", zIndex: 1200, background: "#fff" }}>
<HeaderTop />
<HeaderBottom />
</Stack>

54
src/components/layouts/dashboard/headerWithSidebar/HeaderMenu/index.jsx
View File

@@ -1,4 +1,54 @@
const HeaderMenu = () => {
return <>منو</>;
import { ExpandLess, ExpandMore, Link } from "@mui/icons-material";
import { Button, Divider, ListItemIcon, ListItemText, Menu, MenuItem } from "@mui/material";
import NextLink from "next/link";
import { useState } from "react";
const HeaderMenu = ({ menu }) => {
const [anchorEl, setAnchorEl] = useState(null);
const open = Boolean(anchorEl);
const handleClick = (event) => {
setAnchorEl(event.currentTarget);
};
const handleClose = () => {
setAnchorEl(null);
};
return (
<>
<Button
color="inherit"
aria-haspopup="true"
aria-expanded={open ? 'true' : undefined}
onClick={handleClick}
endIcon={open ? <ExpandLess /> : <ExpandMore />}
>
{menu.title}
</Button>
<Menu
anchorEl={anchorEl}
open={open}
onClose={handleClose}
>
{menu.subMenu.flatMap((subMenu, index) => [
...subMenu.map(sub => (
<MenuItem
component={NextLink}
href={sub.href}
key={sub.title}
onClick={handleClose}
>
<ListItemIcon>
<Link fontSize="small" />
</ListItemIcon>
<ListItemText>{sub.title}</ListItemText>
</MenuItem>
)),
index < menu.subMenu.length - 1 && <Divider key={`divider-${index}`} />
])}
</Menu>
</>
);
};
export default HeaderMenu;

19
src/components/layouts/dashboard/headerWithSidebar/index.jsx
View File

@@ -7,8 +7,10 @@ import MuiAppBar from "@mui/material/AppBar";
import { useState } from "react";
import HeaderMenu from "./HeaderMenu";
import moment from "jalali-moment";
import { headerMenu } from "@/core/utils/headerMenu";
const drawerWidth = 300;
const headersHeight = 136
const Main = styled(Stack, { shouldForwardProp: (prop) => prop !== "open" })(({ theme, open }) => ({
flexGrow: 1,
@@ -49,7 +51,7 @@ const DrawerHeader = styled("div")(({ theme }) => ({
alignItems: "center",
padding: theme.spacing(0, 1),
...theme.mixins.toolbar,
minHeight: "48px !important",
minHeight: "40px !important",
justifyContent: "flex-end",
}));
@@ -64,9 +66,11 @@ const HeaderWithSidebar = ({ children }) => {
setOpen(false);
};
return (
<Box sx={{ display: "flex", height: "calc(100% - 163px)", width: "100%", mt: "163px" }}>
<Box sx={{
display: "flex", height: `calc(100% - ${headersHeight}px)`, width: "100%", mt: `${headersHeight}px`
}}>
<AppBar sx={{ position: "fixed", top: "unset" }} elevation={0} open={open}>
<Toolbar variant="dense">
<Toolbar variant="dense" sx={{ minHeight: 40 }}>
<IconButton
color="inherit"
aria-label="open drawer"
@@ -77,7 +81,7 @@ const HeaderWithSidebar = ({ children }) => {
<MenuIcon />
</IconButton>
<Box sx={{ flexGrow: 1, display: { xs: "none", md: "flex" } }}>
<HeaderMenu />
{headerMenu.map(menu => <HeaderMenu key={menu.title} menu={menu} />)}
</Box>
</Toolbar>
</AppBar>
@@ -106,14 +110,17 @@ const HeaderWithSidebar = ({ children }) => {
</IconButton>
</DrawerHeader>
<SidebarMenu />
<Typography textAlign={"center"} variant="caption" sx={{ py: 0.2, fontFamily: "sans-serif" }}>
v{process.env.NEXT_PUBLIC_VERSION}
</Typography>
</Drawer>
<Main open={open} sx={{ height: "100%", width: "100%", overflow: "hidden" }}>
<DrawerHeader />
<Box sx={{ height: "100%", width: "100%", overflowY: "auto", p: 2, overflowX: "hidden" }}>
<Box sx={{ height: "100%", width: "100%", overflowY: "auto", p: 1, overflowX: "hidden" }}>
{children}
</Box>
</Main>
</Box>
);
};
export default HeaderWithSidebar;
export default HeaderWithSidebar;