mohiit1502/plaidware-wms-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Feature/wms 42 (#60)

Browse Source 
* Added: transfer list component
* Updated: package.json
* Linted
* Udpated: removed width constrain
* create user role UI changes

Co-authored-by: Llewellyn Dsouza <lledsouza2209@gmail.com>
This commit is contained in:
bhavana-jain
2022-02-21 12:33:46 +05:30
committed by GitHub
parent e6186d7835
commit 68dca0dc34
6 changed files with 319 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

218
src/pages/createUserRole/index.js Normal file
View File

@@ -0,0 +1,218 @@
import React from 'react';
import MDBox from 'components/MDBox';
import DashboardNavbar from 'components/DashboardNavbar';
import Footer from 'components/Footer';
import DashboardLayout from 'layouts/DashboardLayout';
import { makeStyles } from '@mui/styles';
import { Box, Grid } from '@mui/material';
import MDButton from 'components/Button';
import TransferList from 'components/MDTransferList';
import DateTimeInput from 'components/DateTimePicker';
import Switch from 'components/Switch';
import MDTypography from 'components/MDTypography';
import MDInput from 'components/MDInput';
import TextareaAutosize from '@mui/material/TextareaAutosize';
import Typography from '@mui/material/Typography';
const useStyles = makeStyles(() => ({
labelSize: {
fontSize: '16px',
letterSpacing: '0.01em',
color: '#000',
marginBottom: '4px'
},
boxWrap: {
backgroundColor: '#fff',
border: '1px solid #c2c2c2',
borderTop: '3px solid #007aff',
display: 'inline-block',
padding: '12px',
borderRadius: '4px'
},
noLegend: {
display: 'none'
},
fullWidth: {
width: '100%',
borderColor: '#d2d6da',
borderRadius: '0.375rem'
},
switchSpacer: {
margin: '0',
'& .MuiFormControlLabel-root': {
margin: '0'
},
'& .MuiSwitch-root': {
margin: '0'
}
}
}));
function CreateUserRole() {
const classes = useStyles();
return (
<DashboardLayout>
<DashboardNavbar />
<MDBox px={2} py={3}>
<Grid container spacing={2} className={classes.margin}>
<Grid item xs={8} md={8}>
<Grid container spacing={2} className={classes.margin}>
<Grid item xs={12}>
<Box component="div" sx={{}} className={classes.labelSize}>
Warehouse name
</Box>
<MDInput fullWidth name="warehousename" type="text" variant="outlined" />
</Grid>
<Grid item xs={12}>
<Box component="div" className={classes.labelSize}>
Description
</Box>
<TextareaAutosize className={classes.fullWidth} minRows={5} />
</Grid>
<Grid item xs={12}>
<Grid container spacing={2} className={classes.margin}>
<Grid item xs={6}>
<Box component="div" className={classes.labelSize}>
Created By
</Box>
<MDInput fullWidth name="warehousename" type="text" variant="outlined" />
</Grid>
<Grid item xs={6}>
<Box component="div" className={classes.labelSize}>
Date &amp; Time
</Box>
<DateTimeInput />
</Grid>
<Grid item xs={6}>
<Box component="div" className={classes.labelSize}>
Last Updated by
</Box>
<MDInput fullWidth name="warehousename" type="text" variant="outlined" />
</Grid>
<Grid item xs={6}>
<Box component="div" className={classes.labelSize}>
Date &amp; Time
</Box>
<DateTimeInput />
</Grid>
</Grid>
</Grid>
</Grid>
</Grid>
<Grid item xs={4}>
<Box component="div" className={classes.labelSize}>
Choose avatar component here
</Box>
</Grid>
</Grid>
<Grid container spacing={4} sx={{ marginTop: '-6px' }}>
<Grid item xs={12} md={4}>
<MDBox
sx={{
backgroundColor: '#fff',
border: '1px solid #c2c2c2',
borderTop: '7px solid #007aff',
padding: '12px',
borderRadius: '4px'
}}
>
<Typography gutterBottom variant="h6" component="div">
Warehouse
</Typography>
<TransferList />
</MDBox>
</Grid>
<Grid item xs={12} md={4}>
<MDBox
sx={{
backgroundColor: '#fff',
border: '1px solid #c2c2c2',
borderTop: '7px solid #007aff',
padding: '12px',
borderRadius: '4px'
}}
>
<Typography gutterBottom variant="h6" component="div">
Warehouse
</Typography>
<TransferList />
</MDBox>
</Grid>
</Grid>
<Grid container spacing={2} sx={{ marginTop: '12px' }}>
<Grid item xs={12} md={3}>
<MDBox
sx={{
backgroundColor: '#fff',
border: '1px solid #c2c2c2',
borderTop: '7px solid #007aff',
padding: '12px',
borderRadius: '4px'
}}
>
<Typography gutterBottom variant="h6" component="div">
Process
</Typography>
<MDBox
display="flex"
justifyContent="space-between"
alignItems="center"
lineHeight={1}
className={classes.switchSpacer}
>
<MDTypography variant="body2">Sidenav Mini</MDTypography>
<Switch checked />
</MDBox>
</MDBox>
</Grid>
<Grid item xs={12} md={3}>
<MDBox
sx={{
backgroundColor: '#fff',
border: '1px solid #c2c2c2',
borderTop: '7px solid #007aff',
padding: '12px',
borderRadius: '4px'
}}
>
<Typography gutterBottom variant="h6" component="div">
Application
</Typography>
<MDBox
display="flex"
justifyContent="space-between"
alignItems="center"
lineHeight={1}
className={classes.switchSpacer}
>
<MDTypography variant="body2">Sidenav Mini</MDTypography>
<Switch checked />
</MDBox>
</MDBox>
</Grid>
</Grid>
<MDBox
display="flex"
justifyContent="center"
alignItems="center"
lineHeight={1}
sx={{ marginBottom: '15px', marginTop: '24px' }}
>
<MDButton
size="medium"
color="primary"
variant="outlined"
type="submit"
sx={{ marginRight: '15px' }}
>
Cancel
</MDButton>
<MDButton size="medium" color="primary" variant="contained">
Save
</MDButton>
</MDBox>
</MDBox>
<Footer />
</DashboardLayout>
);
}
export default CreateUserRole;