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

Feature/wms 44 (#37)

Browse Source 
* add new/update inventory

* prop validation in imageupload component

* Linted

* add table to inventory page

* Renamed: ImageUpload - Index to index

* Resolved: route merge conflict

* Resolved: ImageUpload conflicts w/ warehouse page

Co-authored-by: [Diksha] <[diksha39511@gmail.com]>
Co-authored-by: Llewellyn D'souza <lledsouza2209@gmail.com>
This commit is contained in:
Dikshajain39511
2022-02-01 13:26:22 +05:30
committed by GitHub
parent ab4aa065fd
commit 03a9dd5370
5 changed files with 357 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files

238
src/pages/inventory/index.js Normal file
View File

@@ -0,0 +1,238 @@
import DashboardNavbar from 'components/DashboardNavbar';
import Footer from 'components/Footer';
import DashboardLayout from 'layouts/DashboardLayout';
import { Grid, InputLabel } from '@mui/material';
import MDInput from 'components/MDInput';
import ImageUpload from 'components/ImageUpload';
import Switch from 'components/Switch';
import MDTypography from 'components/MDTypography';
import { makeStyles } from '@mui/styles';
import MDBox from 'components/MDBox';
import Dropdown from 'components/Dropdown';
import MDButton from 'components/Button';
import BasicTable from 'components/BasicTable';
const useStyles = makeStyles({
textWrap: {
whiteSpace: 'nowrap',
fontSize: '16px',
fontWeight: '800'
},
gridWrap: {
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center'
},
textSize: {
fontSize: '16px',
color: 'gray',
textAlign: 'justify'
},
btnWrap: {
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center'
},
marginTop: {
marginTop: '54px'
}
});
function InventoryScreen() {
const stockBox = [
{
text: 'Stock Tracking'
},
{
text: 'Replenishment'
},
{
text: 'Alerting'
},
{
text: 'Check In/Out'
},
{
text: 'Maintenance'
},
{
text: 'Location'
}
];
const tableData = [
{
level1: 'Ipsum',
level2: 'Vivera'
},
{
level1: 'Ipsum',
level2: 'Vivera'
}
];
const header = [
{
name: 'Level 1',
prop: 'level1'
},
{
name: 'Level 2',
prop: 'level2'
}
];
const dropdownData = [
{
ID: '1',
displayname: 'Regular, full time'
},
{
ID: '2',
displayname: 'Regular, part time'
},
{
ID: '3',
displayname: 'Contractor- Arise Max'
}
];
const dataInventory = [
{
placeholder: 'Lorem Ipsum',
label: 'Inventory Type'
}
];
const dataLevel = [
{
placeholder: 'Lorem Ipsum',
label: 'Level 1'
},
{
placeholder: 'Lorem Ipsum',
label: 'Level 2'
}
];
const previewImg = [1, 2, 3];
const classes = useStyles();
return (
<DashboardLayout>
<DashboardNavbar />
<MDBox px={5} py={5}>
<MDBox
px={5}
py={5}
sx={{
backgroundColor: '#fff',
justifyContent: 'center',
alignItems: 'center',
display: 'flex'
}}
>
<Grid container spacing={5}>
<Grid item xs={12} sm={6} md={6}>
<Grid container spacing={2}>
<Grid item xs={12} sm={12} md={12}>
<InputLabel sx={{ pb: 2 }} id="demo-simple-select-label">
Inventory Name
</InputLabel>
<MDInput sx={{ width: '100%' }} />
</Grid>
{dataInventory &&
dataInventory.map((item, index) => (
<Grid item xs={12} sm={12} md={12} key={index}>
<Dropdown items={item} dropdownData={dropdownData} />
</Grid>
))}
<Grid item xs={12} sm={12} md={12}>
<InputLabel sx={{ pb: 2 }} id="demo-simple-select-label">
Widget Name
</InputLabel>
<MDInput sx={{ width: '100%' }} />
</Grid>
</Grid>
<MDBox sx={{ my: 4 }}>
<MDTypography variant="h5">Policies</MDTypography>
<MDTypography className={classes.textSize}>
Egestas pulvinar ornare vulputate porttitor consectetur condimentum at tellus
quis. Leo pellentesque ipsum, a purus dignissim aliquam, orci. Elementum
ullamcorper a sit eleifend ante ullamcorper ornare mi pharetra.
</MDTypography>
</MDBox>
<MDBox
mr={{ xs: 0, xl: 8 }}
sx={{
width: '40%',
padding: '12.5px 10px',
backgroundColor: '#fff',
border: 'solid 0.5px #c4c4c4',
borderRadius: '4px',
my: 5
}}
>
<div className={classes.wrap}>
{stockBox.map((item) => (
<>
<div className={classes.gridWrap}>
<MDTypography className={classes.textWrap}>{item.text}</MDTypography>
<Switch />
</div>
</>
))}
</div>
</MDBox>
</Grid>
<Grid item xs={12} sm={6} md={6}>
<ImageUpload heading="Upload Inventory Images" previewImg={previewImg} />
</Grid>
<Grid item xs={12} sm={12} md={12}>
<Grid container spacing={1}>
{dataLevel &&
dataLevel.map((item, index) => (
<Grid item xs={12} sm={6} md={4} key={index}>
<Dropdown items={item} dropdownData={dropdownData} />
</Grid>
))}
<Grid item xs={12} sm={6} md={4}>
<MDButton color="primary" circular="true" className={classes.marginTop}>
{'add hierarchy level'}
</MDButton>
</Grid>
</Grid>
</Grid>
<Grid item xs={12} sm={12} md={12}>
<MDBox
sx={{
backgroundColor: '#E5E5E5',
width: '98%',
padding: '9px'
}}
>
<MDTypography>Widget hierarchy</MDTypography>
<BasicTable
className={classes.margin}
data={tableData}
header={header}
backgroundColor="#E5E5E5"
/>
</MDBox>
</Grid>
<MDBox sx={{ ml: 'auto', mr: 'auto', mt: 3 }}>
<MDButton sx={{ ml: 3 }} color="error" variant="outlined">
{'CANCEL'}
</MDButton>
<MDButton sx={{ ml: 3 }} color="primary" variant="outlined">
{'SAVE'}
</MDButton>
<MDButton sx={{ ml: 3 }} color="primary">
{'ADD ITEMS'}
</MDButton>
</MDBox>
</Grid>
</MDBox>
</MDBox>
<Footer />
</DashboardLayout>
);
}
export default InventoryScreen;