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

debug header flow by mohammad

Browse Source
This commit is contained in:
Mohammad Jalali
2024-01-30 13:48:38 +03:30
parent 21c5e5919b
commit d89e86813d
3 changed files with 18 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/app/(withAuth)/dashboard/template.js
View File

@@ -1,19 +1,15 @@
import {Stack} from "@mui/material"; import {Box, Stack} from "@mui/material";
import HeaderWithLogo from "@/components/layouts/dashboard/headerWithLogo"; import HeaderWithLogo from "@/components/layouts/dashboard/headerWithLogo";
import HeaderWithSidebar from "@/components/layouts/dashboard/headerWithSidebar"; import HeaderWithSidebar from "@/components/layouts/dashboard/headerWithSidebar";
const headerHeight = {
header1: 50,
header2: 50
}
const offsetHeaders = headerHeight.header1 + headerHeight.header2
const Template = ({children}) => { const Template = ({children}) => {
return (<Stack> return (<Stack>
<HeaderWithLogo headerHeight={headerHeight}/> <HeaderWithLogo/>
<HeaderWithSidebar offsetHeaders={offsetHeaders}> <Box>
{children} <HeaderWithSidebar>
</HeaderWithSidebar> {children}
</HeaderWithSidebar>
</Box>
</Stack>) </Stack>)
} }

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

@@ -1,9 +1,9 @@
import {Box} from "@mui/material"; import {Box, Stack} from "@mui/material";
const HeaderWithLogo = ({headerHeight}) => { const HeaderWithLogo = () => {
return (<> return (<Stack>
<Box sx={{position: 'fixed', height: headerHeight.header1, top: 0}}>header1</Box> <Box>header1</Box>
<Box sx={{position: 'fixed', height: headerHeight.header2, top: headerHeight.header1}}>header2</Box> <Box>header2</Box>
</>) </Stack>)
} }
export default HeaderWithLogo export default HeaderWithLogo

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

@@ -36,7 +36,7 @@ const DrawerHeader = styled('div')(({theme}) => ({
...theme.mixins.toolbar, justifyContent: 'flex-end', ...theme.mixins.toolbar, justifyContent: 'flex-end',
})); }));
const HeaderWithSidebar = ({children, offsetHeaders}) => { const HeaderWithSidebar = ({children}) => {
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
const handleDrawerOpen = () => { const handleDrawerOpen = () => {
@@ -47,7 +47,7 @@ const HeaderWithSidebar = ({children, offsetHeaders}) => {
setOpen(false); setOpen(false);
}; };
return (<Box sx={{display: 'flex'}}> return (<Box sx={{display: 'flex'}}>
<AppBar sx={{position: 'fixed', top: offsetHeaders}} elevation={0} open={open}> <AppBar sx={{position: 'fixed', top: "unset"}} elevation={0} open={open}>
<Toolbar> <Toolbar>
<IconButton <IconButton
color="inherit" color="inherit"
@@ -68,9 +68,9 @@ const HeaderWithSidebar = ({children, offsetHeaders}) => {
width: drawerWidth, flexShrink: 0, '& .MuiDrawer-paper': { width: drawerWidth, flexShrink: 0, '& .MuiDrawer-paper': {
width: drawerWidth, width: drawerWidth,
boxSizing: 'border-box', boxSizing: 'border-box',
top: offsetHeaders,
borderTop: 1, borderTop: 1,
borderTopColor: 'divider' borderTopColor: 'divider',
top: "unset"
}, },
}} }}
variant="persistent" variant="persistent"
@@ -83,7 +83,7 @@ const HeaderWithSidebar = ({children, offsetHeaders}) => {
</IconButton> </IconButton>
</DrawerHeader> </DrawerHeader>
</Drawer> </Drawer>
<Main elevation={0} sx={{mt: `${offsetHeaders}px`}} open={open}> <Main elevation={0} open={open}>
<DrawerHeader/> <DrawerHeader/>
{children} {children}
</Main> </Main>