From fc5128aec109b95c61a88e2f2f17922860e7b26f Mon Sep 17 00:00:00 2001 From: Hiren Padsala <38140488+hiren1212@users.noreply.github.com> Date: Wed, 16 Feb 2022 10:43:23 +0530 Subject: [PATCH] feature/wms-36 complete design of widget label screen (#58) * feature/wms-36 complete design of widget label screen * Linted Co-authored-by: Llewellyn D'souza --- src/assets/images/barcode-number.png | Bin 0 -> 928 bytes src/pages/labellingHome/index.js | 2 +- src/pages/widgetLabel/index.js | 327 +++++++++++++++++++++++++++ src/routes/index.js | 8 + 4 files changed, 336 insertions(+), 1 deletion(-) create mode 100644 src/assets/images/barcode-number.png create mode 100644 src/pages/widgetLabel/index.js diff --git a/src/assets/images/barcode-number.png b/src/assets/images/barcode-number.png new file mode 100644 index 0000000000000000000000000000000000000000..983f1dacbf5db39000d8bc4db4ee6c38a6f9cc9c GIT binary patch literal 928 zcmV;R17G}!P)DxyW3C|X4j)Vioew20~l6x5>MP>UdF*$*fPqD3neL{PWlLQrt2 zg7`qhg^#ahKoPlKwX65#d>~%$xo75_nKR$a9UbLz8Ta@1czJmNU7wzwA{Y!J8jWIS zX9uZN3VVBda5x+o85zOK$_l(*FQ%ubaeRCXg2&^*($W$_p%7}d8sAGMlUQC}#^&ZG zzP`RNF)`7Q@%s9Ti;D})%*?>&^WpLFk;lfz$MOFDj!Y(l?d@$O5()VIejFVg@qHS9 zcz8gyTE)r93Cp5+^YinF#bUU=zQ)_z8x9T*5C{bLx!c=Ye(vYz2f17htE;O#ht^dp zmGJ%jjjO9GR4NtR-QDrCQ&UsCE?Q?@2Yu6LZf*|YaG2LY_sI@!w;P2*f$f#eW_kZ4 z_w4M9*Fdt#u4D(Y5AADfYYXXgnty+OezL6kXKZW?E|-hPo}ZsFIy%bxB7A&&;PUbk z@pzo=SD$l!e$KkchcrGpImv#aJufaUVtsub#bOcr`}7?#yScexzme@}544}d!$YS-JVE})`Oxp zzgcfT?b@weErDlvQQl93_2OhRr6MDOQAFqDN1t1<5b$JUnF7tBqm+0000 } ]; diff --git a/src/pages/widgetLabel/index.js b/src/pages/widgetLabel/index.js new file mode 100644 index 0000000..81b120e --- /dev/null +++ b/src/pages/widgetLabel/index.js @@ -0,0 +1,327 @@ +import { Box, Grid, TableBody, TableCell, TableRow } from '@mui/material'; +import DashboardNavbar from 'components/DashboardNavbar'; +import DashboardLayout from 'layouts/DashboardLayout'; +import { makeStyles } from '@mui/styles'; +import OutlinedInput from '@mui/material/OutlinedInput'; +import MenuItem from '@mui/material/MenuItem'; +import Select from '@mui/material/Select'; +import React from 'react'; +import SearchBar from 'components/SearchBar'; +import BasicTable from 'components/BasicTable'; +import Barcodeimage from 'assets/images/barcode-number.png'; +import MDButton from 'components/Button'; + +const useStyles = makeStyles({ + labelSize: { + fontSize: '16px', + letterSpacing: '0.01em', + color: '#000', + marginBottom: '4px' + }, + customLabel: { + backgroundColor: '#fff' + }, + buttondiv: { + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + margin: '52px 0px' + } +}); +const records = [ + { + warehouse: 'Ipsum', + zone: 'Vivera', + area: 'Nisi', + row: 'Nulla', + label: 'Mauris', + bay: 'Senectus', + barcodenumber: '2085550112', + barcodeimage: Barcodeimage + }, + { + warehouse: 'Ipsum', + zone: 'Vivera', + area: 'Nisi', + row: 'Nulla', + label: 'Mauris', + bay: 'Senectus', + barcodenumber: '2085550112', + barcodeimage: Barcodeimage + }, + { + warehouse: 'Ipsum', + zone: 'Vivera', + area: 'Nisi', + row: 'Nulla', + label: 'Mauris', + bay: 'Senectus', + barcodenumber: '2085550112', + barcodeimage: Barcodeimage + } +]; + +const recordsNew = [ + { + warehouse: 'Ipsum', + zone: 'Vivera', + area: 'Nisi', + barcodenumber: '2085550112', + barcodeimage: Barcodeimage + }, + { + warehouse: 'Ipsum', + zone: 'Vivera', + area: 'Nisi', + barcodenumber: '2085550112', + barcodeimage: Barcodeimage + }, + { + warehouse: 'Ipsum', + zone: 'Vivera', + area: 'Nisi', + barcodenumber: '2085550112', + barcodeimage: Barcodeimage + }, + { + warehouse: 'Ipsum', + zone: 'Vivera', + area: 'Nisi', + barcodenumber: '2085550112', + barcodeimage: Barcodeimage + } +]; + +const headCells = [ + { + id: 'inventory', + label: 'Inventory' + }, + { + id: 'Family', + label: 'Family' + }, + { + id: 'Subfamily', + label: 'Subfamily' + }, + { + id: 'Name', + label: 'Name' + }, + { + id: 'Manufacture', + label: 'Manufacture' + }, + { + id: 'Size', + label: 'Size' + }, + { + id: 'barcode number', + label: 'Barcode number' + }, + { + id: 'Barcode', + label: 'Barcode' + } +]; +const headCellsNew = [ + { + id: 'Inventory Name', + label: 'Inventory Name' + }, + { + id: 'Item Name', + label: 'Item Name' + }, + { + id: 'Item Description', + label: 'Item Description' + }, + { + id: 'Barcode Number', + label: 'Barcode Number' + }, + { + id: 'Barcode', + label: 'Barcode' + } +]; +function WidgetLabel() { + const classes = useStyles(); + const [personName, setPersonName] = React.useState([]); + + const handleChange = (event) => { + const { + target: { value } + } = event; + setPersonName( + // On autofill we get a stringified value. + typeof value === 'string' ? value.split(',') : value + ); + }; + return ( + <> + + + + + + + Select Inventory + + + + + + + + Select Family + + + + + + + + Select Sub Family + + + + + + + + Search Keyword + + + + + + + + + + {records && + records.map((item) => ( + + {item.warehouse} + {item.zone} + {item.area} + {item.row} + {item.label} + {item.bay} + {item.barcodenumber} + + img + + + ))} + + + + + + + {recordsNew && + recordsNew.map((item) => ( + + {item.warehouse} + {item.zone} + {item.area} + {item.barcodenumber} + + img + + + ))} + + + +
+ {'Print Labels'} +
+ + + + ); +} + +export default WidgetLabel; diff --git a/src/routes/index.js b/src/routes/index.js index 7599d94..5ee232e 100644 --- a/src/routes/index.js +++ b/src/routes/index.js @@ -58,6 +58,7 @@ import SetupInventory from 'pages/setupInventory'; import HomeIcon from 'assets/images/HomeIcon'; import SetupIcon from 'assets/images/SetupIcon'; import AddNewProduct from '../pages/addNewProduct'; +import WidgetLabel from 'pages/widgetLabel'; // Images // import profilePicture from 'assets/images/team-3.jpg'; @@ -194,6 +195,13 @@ const protectedRoutes = [ route: '/setup/warehouse/edit-warehouse', hide: true, component: + }, + { + name: 'Widget Label', + key: 'widget-label', + route: '/setup/labeling/widget-label', + hide: true, + component: } ] }