From 491ae5aa24e7f78d0d8b9213118b496a95f2a027 Mon Sep 17 00:00:00 2001
From: Dikshajain39511 <98263148+Dikshajain39511@users.noreply.github.com>
Date: Mon, 24 Jan 2022 16:21:10 +0530
Subject: [PATCH] Feature/wms 19 (#22)

* added:locationLabel changes
* Added: props to component

Co-authored-by: [Diksha] <[diksha39511@gmail.com]>
Co-authored-by: Llewellyn D'souza <lledsouza2209@gmail.com>
---
 src/components/LocationLabel/index.js | 92 +++++++++++++++++++++++++++
 1 file changed, 92 insertions(+)
 create mode 100644 src/components/LocationLabel/index.js

diff --git a/src/components/LocationLabel/index.js b/src/components/LocationLabel/index.js
new file mode 100644
index 0000000..db9f976
--- /dev/null
+++ b/src/components/LocationLabel/index.js
@@ -0,0 +1,92 @@
+// import Box from '@mui/material/Box';
+import { makeStyles } from '@mui/styles';
+import PropTypes from 'prop-types';
+import MDBox from 'components/MDBox';
+import MDTypography from 'components/MDTypography';
+
+const useStyles = makeStyles({
+  bind: {
+    display: 'flex'
+  },
+  size: {
+    fontSize: '12px',
+    textTransform: 'uppercase',
+    textAlign: 'center',
+    marginRight: '15px'
+  },
+  sizePos: {
+    fontSize: '12px',
+    textTransform: 'uppercase',
+    textAlign: 'center'
+  }
+});
+
+function LocationLabel({ area, row, bay, level, position }) {
+  const classes = useStyles();
+  return (
+    <MDBox
+      sx={{
+        width: 381,
+        height: 138,
+
+        backgroundColor: ({ palette: { background } }) => background.default,
+        padding: '32px 40px'
+      }}
+    >
+      <MDTypography variant="h1">
+        <div className={classes.bind}>
+          <div>
+            <MDTypography variant="h6" className={classes.size}>
+              Area
+            </MDTypography>
+            <MDTypography variant="h1" color="black">
+              {area}-
+            </MDTypography>
+          </div>
+          <div>
+            <MDTypography variant="h6" className={classes.size}>
+              Row
+            </MDTypography>
+            <MDTypography variant="h1" color="black">
+              {row}-
+            </MDTypography>
+          </div>
+          <div>
+            <MDTypography variant="h6" className={classes.size}>
+              Bay
+            </MDTypography>
+            <MDTypography variant="h1" color="black">
+              {bay}-
+            </MDTypography>
+          </div>
+          <div>
+            <MDTypography variant="h6" className={classes.size}>
+              Level
+            </MDTypography>
+            <MDTypography variant="h1" color="black">
+              {level}-
+            </MDTypography>
+          </div>
+          <div>
+            <MDTypography variant="h6" className={classes.sizePos}>
+              Pos
+            </MDTypography>
+            <MDTypography variant="h1" color="black">
+              {position}
+            </MDTypography>
+          </div>
+        </div>
+      </MDTypography>
+    </MDBox>
+  );
+}
+
+LocationLabel.propTypes = {
+  area: PropTypes.string.isRequired,
+  row: PropTypes.string.isRequired,
+  bay: PropTypes.string.isRequired,
+  level: PropTypes.string.isRequired,
+  position: PropTypes.string.isRequired
+};
+
+export default LocationLabel;