From 4666a1e3b904a90c79a34e881966559d2a04fd14 Mon Sep 17 00:00:00 2001
From: Hiren Padsala <38140488+hiren1212@users.noreply.github.com>
Date: Mon, 31 Jan 2022 15:32:33 +0530
Subject: [PATCH] feature/wms-28 Warehouse Setup Page Design completed (#35)
* feature/wms-28 Warehouse Setup Page Design completed
* Renamed, linted
---
src/assets/images/InventoryIcon.js | 17 +++++
src/assets/images/LabelIcon.js | 17 +++++
src/assets/images/ProfileCircleIcon.js | 17 +++++
src/assets/images/WarehouseIcon.js | 16 ++++
src/pages/setup/index.js | 102 +++++++++++++++++++++++++
src/routes/index.js | 7 ++
6 files changed, 176 insertions(+)
create mode 100644 src/assets/images/InventoryIcon.js
create mode 100644 src/assets/images/LabelIcon.js
create mode 100644 src/assets/images/ProfileCircleIcon.js
create mode 100644 src/assets/images/WarehouseIcon.js
create mode 100644 src/pages/setup/index.js
diff --git a/src/assets/images/InventoryIcon.js b/src/assets/images/InventoryIcon.js
new file mode 100644
index 0000000..11b5b31
--- /dev/null
+++ b/src/assets/images/InventoryIcon.js
@@ -0,0 +1,17 @@
+import PropTypes from 'prop-types';
+
+const InventoryIcon = ({ width = 25, height = 24, ...props }) => (
+
+
+);
+export default InventoryIcon;
+
+InventoryIcon.propTypes = {
+ width: PropTypes.string,
+ height: PropTypes.string,
+ color: PropTypes.string
+};
diff --git a/src/assets/images/LabelIcon.js b/src/assets/images/LabelIcon.js
new file mode 100644
index 0000000..f53d4c4
--- /dev/null
+++ b/src/assets/images/LabelIcon.js
@@ -0,0 +1,17 @@
+import PropTypes from 'prop-types';
+
+const LabelIcon = ({ width = 25, height = 24, ...props }) => (
+
+
+);
+export default LabelIcon;
+
+LabelIcon.propTypes = {
+ width: PropTypes.string,
+ height: PropTypes.string,
+ color: PropTypes.string
+};
diff --git a/src/assets/images/ProfileCircleIcon.js b/src/assets/images/ProfileCircleIcon.js
new file mode 100644
index 0000000..76cb019
--- /dev/null
+++ b/src/assets/images/ProfileCircleIcon.js
@@ -0,0 +1,17 @@
+import PropTypes from 'prop-types';
+
+const ProfileCircleIcon = ({ width = 25, height = 24, ...props }) => (
+
+
+);
+export default ProfileCircleIcon;
+
+ProfileCircleIcon.propTypes = {
+ width: PropTypes.string,
+ height: PropTypes.string,
+ color: PropTypes.string
+};
diff --git a/src/assets/images/WarehouseIcon.js b/src/assets/images/WarehouseIcon.js
new file mode 100644
index 0000000..b4d95b1
--- /dev/null
+++ b/src/assets/images/WarehouseIcon.js
@@ -0,0 +1,16 @@
+import PropTypes from 'prop-types';
+
+const WarehouseIcon = ({ width = 25, height = 24, ...props }) => (
+
+);
+export default WarehouseIcon;
+
+WarehouseIcon.propTypes = {
+ width: PropTypes.string,
+ height: PropTypes.string,
+ color: PropTypes.string
+};
diff --git a/src/pages/setup/index.js b/src/pages/setup/index.js
new file mode 100644
index 0000000..9771941
--- /dev/null
+++ b/src/pages/setup/index.js
@@ -0,0 +1,102 @@
+import DashboardNavbar from 'components/DashboardNavbar';
+import DashboardLayout from 'layouts/DashboardLayout';
+import { makeStyles } from '@mui/styles';
+import MDBox from 'components/MDBox';
+import { Grid } from '@mui/material';
+import WarehouseIcon from 'assets/images/WarehouseIcon';
+import InventoryIcon from 'assets/images/InventoryIcon';
+import ProfileCircleIcon from 'assets/images/ProfileCircleIcon';
+import LabelIcon from 'assets/images/LabelIcon';
+
+const useStyles = makeStyles({
+ iconSize: {
+ width: '50%',
+ height: '50%',
+ marginBottom: '10px'
+ },
+ margin: {
+ marginBottom: '20px'
+ },
+ centerContent: {
+ display: 'flex',
+ alignItems: 'center',
+ justifyContent: 'center',
+ flexDirection: 'column',
+ marginLeft: '20px',
+ boxShadow: '0px 4px 24px rgba(0, 0, 0, 0.05)',
+ borderRadius: '8px',
+ marginBottom: '20px',
+ cursor: 'pointer !important',
+ '& svg': {
+ '&path': {
+ stroke: '#007AFF !important'
+ }
+ },
+ '&:hover': {
+ backgroundColor: '#007AFF',
+ cursor: 'default',
+ color: 'white',
+ '& svg': {
+ '& path': {
+ stroke: '#fff'
+ }
+ }
+ }
+ }
+});
+
+function SetupHome() {
+ const classes = useStyles();
+ const data = [
+ {
+ name: 'Warehouse',
+ path: '/warehouse',
+ icon:
+ },
+ {
+ name: 'Inventory',
+ path: '/',
+ icon:
+ },
+ {
+ name: 'User & Access',
+ path: '/',
+ icon:
+ },
+ {
+ name: 'Labeling',
+ path: '/',
+ icon:
+ }
+ ];
+ return (
+
+
+
+
+ {data.map((items) => (
+ <>
+
+ white.main,
+ padding: '32px 40px'
+ }}
+ >
+ {items.icon}
+ {items.name}
+
+
+
+ ))}
+
+
+
+ );
+}
+
+export default SetupHome;
diff --git a/src/routes/index.js b/src/routes/index.js
index 69c0c39..4e2fd1a 100644
--- a/src/routes/index.js
+++ b/src/routes/index.js
@@ -45,6 +45,7 @@ import LoginScreen from 'pages/authentication';
// @mui icons
import Icon from '@mui/material/Icon';
import WarehouseScreen from 'pages/warehouse';
+import SetupHome from 'pages/setup';
import LabelingScreen from 'pages/labeling';
// Images
@@ -95,6 +96,12 @@ const protectedRoutes = [
key: 'Setup',
icon: dashboard,
collapse: [
+ {
+ name: 'Setup Home',
+ key: 'warehouse-setup',
+ route: '/warehouse-setup',
+ component:
+ },
{
name: 'Warehouse Design',
key: 'warehouse',