loan/expert-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

LFFE-25 Implementation of print layout and Printable Page

Browse Source
This commit is contained in:
AmirHossein Mahmoodi
2023-11-13 13:46:20 +03:30
parent 7a636aed07
commit 2a7707152e
12 changed files with 297 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
src/core/components/PrintablePage.jsx Normal file
View File

@@ -0,0 +1,82 @@
import {Box, Container, Divider, Grid, Paper, Stack, Typography} from '@mui/material';
const PrintablePage = ({children, header, footer}) => (
<>
<Box sx={{width: "100%", height: 8, displayPrint: 'none'}}/>
<Container
sx={{
width: '21cm',
minHeight: '29.7cm',
margin: '0 auto',
backgroundColor: 'white',
p: '16px !important',
pb: footer ? '84px!important' : '',
position: 'relative'
}}
component="article" maxWidth="false">
<Grid container columns={5} sx={{pt: 2, px: 4, display: header ? '' : 'none'}}>
<Grid item xs={1}>
<Box sx={{width: 70}}>
<Box component={'img'} sx={{width: '100%', height: '100%', objectFit: 'contain'}}
src={'/images/logo.png'}/>
</Box>
</Grid>
<Grid item xs={3} sx={{textAlign: 'center'}}>
<Typography sx={{fontFamily: 'Bnazanin'}}>باسمه تعالی</Typography>
<Typography sx={{fontFamily: 'Bnazanin'}}>جمهوری اسلامی ایران</Typography>
<Typography sx={{fontFamily: 'Bnazanin', fontWeight: 'bold'}}>وزارت راه و
شهرسازی</Typography>
<Typography sx={{fontFamily: 'Bnazanin', fontWeight: 'bold'}}>سازمان
راهداری و حمل و نقل جاده
ای</Typography>
</Grid>
<Grid item xs={1}>
<Stack>
<Typography sx={{fontFamily: 'Bnazanin'}}>شماره:</Typography>
<Typography sx={{fontFamily: 'Bnazanin'}}>تاریخ:</Typography>
<Typography sx={{fontFamily: 'Bnazanin'}}>پیوست:</Typography>
</Stack>
</Grid>
</Grid>
<Paper elevation={0} sx={{px: 8}}>
{children}
</Paper>
<Box sx={{
position: 'absolute',
bottom: 0,
left: 0,
width: '100%',
px: 4,
pb: 2,
display: footer ? '' : 'none'
}}>
<Divider sx={{borderStyle: 'double', borderBottomWidth: 3, borderColor: '#000'}}/>
<Stack sx={{my: .5}}>
<Box sx={{textAlign: 'center'}}>
<Typography variant={'caption'} fontWeight={'bold'} component={'span'}
sx={{fontFamily: 'Bnazanin', px: 1}}> آدرس: تهران-بلوار
کشاورز-خیابان فلسطین جنوبی-خیابان
دمشق-پلاک17 </Typography>
<Typography variant={'caption'} fontWeight={'bold'} component={'span'}
sx={{fontFamily: 'Bnazanin', px: 1}}> تلفن: 88-88804379 </Typography>
<Typography variant={'caption'} fontWeight={'bold'} component={'span'}
sx={{fontFamily: 'Bnazanin', px: 1}}> تلفن گویا: 88804400 </Typography>
<Typography variant={'caption'} fontWeight={'bold'} component={'span'}
sx={{fontFamily: 'Bnazanin', px: 1}}> کدپستی: 1416753941 </Typography>
</Box>
<Box sx={{textAlign: 'center'}}>
<Typography variant={'caption'} fontWeight={'bold'} component={'span'}
sx={{fontFamily: 'Bnazanin', px: 2}}>صندوق پستی: 3773-14155</Typography>
<Typography variant={'caption'} fontWeight={'bold'} component={'span'}
sx={{fontFamily: 'Bnazanin', px: 2}}>پست الکترونیک: info@rmto.ir</Typography>
<Typography variant={'caption'} fontWeight={'bold'} component={'span'}
sx={{fontFamily: 'Bnazanin', px: 2}}>سایت الکترونیک: www.rmto.ir</Typography>
</Box>
</Stack>
</Box>
</Container>
<Box sx={{width: "100%", height: 8, displayPrint: 'none'}}/>
</>
);
export default PrintablePage;