change employeee route and restriction
This commit is contained in:
pawan-dot
commit
4ec18b7fb9
@ -50,6 +50,7 @@
|
||||
"draft-js": "^0.11.7",
|
||||
"draft-js-export-html": "^1.4.1",
|
||||
"draft-js-import-html": "^1.4.1",
|
||||
"file-saver": "^2.0.5",
|
||||
"md5": "^2.3.0",
|
||||
"moment": "^2.30.1",
|
||||
"prop-types": "^15.7.2",
|
||||
@ -57,10 +58,11 @@
|
||||
"react": "18.0.0",
|
||||
"react-bootstrap": "^2.7.0",
|
||||
"react-chartjs-2": "^5.2.0",
|
||||
"react-datepicker": "^4.8.0",
|
||||
"react-datepicker": "^4.25.0",
|
||||
"react-dom": "^18.0.0",
|
||||
"react-draft-wysiwyg": "^1.15.0",
|
||||
"react-hot-toast": "^2.4.0",
|
||||
"react-modal": "^3.16.1",
|
||||
"react-qr-code": "^2.0.11",
|
||||
"react-quill": "^2.0.0",
|
||||
"react-redux": "^7.2.9",
|
||||
@ -75,7 +77,8 @@
|
||||
"styled-components": "^6.0.8",
|
||||
"sweetalert": "^2.1.2",
|
||||
"sweetalert2": "^11.4.0",
|
||||
"uuid": "^9.0.1"
|
||||
"uuid": "^9.0.1",
|
||||
"xlsx": "^0.18.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"auto-changelog": "~2.3.0",
|
||||
|
||||
@ -7,22 +7,14 @@
|
||||
* License MIT
|
||||
-->
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1, shrink-to-fit=no"
|
||||
/>
|
||||
<meta
|
||||
name="description"
|
||||
content="CoreUI for React - Open Source Bootstrap Admin Template"
|
||||
/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
|
||||
<meta name="description" content="CoreUI for React - Open Source Bootstrap Admin Template" />
|
||||
<meta name="author" content="Łukasz Holeczek" />
|
||||
<meta
|
||||
name="keyword"
|
||||
content="Bootstrap,Admin,Template,Open,Source,CSS,SCSS,HTML,RWD,Dashboard,React"
|
||||
/>
|
||||
<meta name="keyword" content="Bootstrap,Admin,Template,Open,Source,CSS,SCSS,HTML,RWD,Dashboard,React" />
|
||||
<title>Smellika Admin</title>
|
||||
<!--
|
||||
manifest.json provides metadata used when your web app is added to the
|
||||
@ -30,10 +22,7 @@
|
||||
-->
|
||||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
||||
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"
|
||||
/>
|
||||
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" />
|
||||
<link rel="react" href="https://coreui.io/react/" />
|
||||
|
||||
<!-- <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script> -->
|
||||
@ -66,6 +55,8 @@
|
||||
To begin the development, run `npm start` or `yarn start`.
|
||||
To create a production bundle, use `npm run build` or `yarn build`.
|
||||
-->
|
||||
<script src="https://checkout.razorpay.com/v1/checkout.js"></script>
|
||||
</body>
|
||||
<!-- <script src="/assets/libs/bootstrap/js/bootstrap.bundle.min.js"></script> -->
|
||||
|
||||
</html>
|
||||
15
src/App.js
15
src/App.js
@ -47,10 +47,13 @@ const App = () => {
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
});
|
||||
// console.log(response.data)
|
||||
const data = response.data;
|
||||
if (data.success && data.user.role === "admin") {
|
||||
setUserData(data.user);
|
||||
// console.log("jjjjjjjj", response.data);
|
||||
const data = response?.data;
|
||||
if (
|
||||
data?.success &&
|
||||
(data?.user?.role === "admin" || data?.user?.role === "Employee")
|
||||
) {
|
||||
setUserData(data?.user);
|
||||
} else {
|
||||
setUserData(false);
|
||||
}
|
||||
@ -62,7 +65,6 @@ const App = () => {
|
||||
};
|
||||
getUser();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<HashRouter>
|
||||
<Suspense fallback={loading}>
|
||||
@ -87,7 +89,8 @@ const App = () => {
|
||||
path="/"
|
||||
name="Home"
|
||||
element={
|
||||
userdata?.role === "admin" ? (
|
||||
userdata &&
|
||||
(userdata.role === "admin" || userdata.role === "Employee") ? (
|
||||
<DefaultLayout />
|
||||
) : userdata === false ? (
|
||||
<Login />
|
||||
|
||||
106
src/_nav.js
106
src/_nav.js
@ -24,6 +24,7 @@ import {
|
||||
cilUser,
|
||||
cilAlarm,
|
||||
cilFeaturedPlaylist,
|
||||
cilLocationPin,
|
||||
} from "@coreui/icons";
|
||||
import { CNavGroup, CNavItem, CNavTitle, CTabContent } from "@coreui/react";
|
||||
|
||||
@ -33,59 +34,64 @@ const _nav = [
|
||||
name: "Dashboard",
|
||||
to: "/dashboard",
|
||||
icon: <CIcon icon={cilSpeedometer} customClassName="nav-icon" />,
|
||||
group: "",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Customers",
|
||||
icon: <CIcon icon={cilTennisBall} customClassName="nav-icon" />,
|
||||
to: "/customers-details",
|
||||
group: "Customers",
|
||||
},
|
||||
// {
|
||||
// component: CNavItem,
|
||||
// name: "Design",
|
||||
// icon: <CIcon icon={cibMaterialDesign} customClassName="nav-icon" />,
|
||||
// to: "/design",
|
||||
// },
|
||||
|
||||
{
|
||||
component: CNavGroup,
|
||||
name: "Charts",
|
||||
icon: <CIcon icon={cilCat} customClassName="nav-icon" />,
|
||||
group: "",
|
||||
|
||||
items: [
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "new user day wise",
|
||||
icon: <CIcon icon={cilTennisBall} customClassName="nav-icon" />,
|
||||
to: "/new-user-day-wise",
|
||||
group: "Charts",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Revenue By Product",
|
||||
icon: <CIcon icon={cilTennisBall} customClassName="nav-icon" />,
|
||||
to: "/revenue-by-product",
|
||||
group: "Charts",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Revenue By State",
|
||||
icon: <CIcon icon={cilTennisBall} customClassName="nav-icon" />,
|
||||
to: "/revenue-by-state",
|
||||
group: "Charts",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Revenue By City",
|
||||
icon: <CIcon icon={cilTennisBall} customClassName="nav-icon" />,
|
||||
to: "/revenue-by-city",
|
||||
group: "Charts",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Orders (Day Wise)",
|
||||
icon: <CIcon icon={cilTennisBall} customClassName="nav-icon" />,
|
||||
to: "/orders-day-wise",
|
||||
group: "Charts",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Revenue (Day Wise)",
|
||||
icon: <CIcon icon={cilTennisBall} customClassName="nav-icon" />,
|
||||
to: "/revenue-day-wise",
|
||||
group: "Charts",
|
||||
},
|
||||
],
|
||||
},
|
||||
@ -94,24 +100,29 @@ const _nav = [
|
||||
component: CNavGroup,
|
||||
name: "Product Management",
|
||||
icon: <CIcon icon={cilClipboard} customClassName="nav-icon" />,
|
||||
group: "",
|
||||
|
||||
items: [
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Categories",
|
||||
icon: <CIcon icon={cilCat} customClassName="nav-icon" />,
|
||||
to: "/categories",
|
||||
group: "Product Management",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Products",
|
||||
icon: <CIcon icon={cilClipboard} customClassName="nav-icon" />,
|
||||
to: "/products",
|
||||
group: "Product Management",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "GST Rate",
|
||||
icon: <CIcon icon={cilTablet} customClassName="nav-icon" />,
|
||||
to: "/tax",
|
||||
group: "Product Management",
|
||||
},
|
||||
],
|
||||
},
|
||||
@ -119,12 +130,15 @@ const _nav = [
|
||||
component: CNavGroup,
|
||||
name: "Orders",
|
||||
icon: <CIcon icon={cilCart} customClassName="nav-icon" />,
|
||||
group: "",
|
||||
|
||||
items: [
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "New",
|
||||
icon: <CIcon icon={cilNotes} customClassName="nav-icon" />,
|
||||
to: "/orders/new",
|
||||
group: "Orders",
|
||||
},
|
||||
// {
|
||||
// component: CNavItem,
|
||||
@ -137,24 +151,42 @@ const _nav = [
|
||||
name: "Processing",
|
||||
icon: <CIcon icon={cilNotes} customClassName="nav-icon" />,
|
||||
to: "/orders/processing",
|
||||
group: "Orders",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Dispatched",
|
||||
icon: <CIcon icon={cilNotes} customClassName="nav-icon" />,
|
||||
to: "/orders/dispatched",
|
||||
group: "Orders",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Delivered",
|
||||
icon: <CIcon icon={cilNotes} customClassName="nav-icon" />,
|
||||
to: "/orders/delivered",
|
||||
group: "Orders",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Cancelled",
|
||||
icon: <CIcon icon={cilNotes} customClassName="nav-icon" />,
|
||||
to: "/orders/cancelled",
|
||||
group: "Orders",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "In Store Cash Orders",
|
||||
icon: <CIcon icon={cilNotes} customClassName="nav-icon" />,
|
||||
to: "/inStoreCashOrders/new",
|
||||
group: "Orders",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "In Store QRCode Orders",
|
||||
icon: <CIcon icon={cilNotes} customClassName="nav-icon" />,
|
||||
to: "/InStoreQRCodeOrders/new",
|
||||
group: "Orders",
|
||||
},
|
||||
],
|
||||
},
|
||||
@ -162,49 +194,58 @@ const _nav = [
|
||||
component: CNavGroup,
|
||||
name: "Website Related",
|
||||
icon: <CIcon icon={cilCart} customClassName="nav-icon" />,
|
||||
group: "",
|
||||
|
||||
items: [
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Banner",
|
||||
icon: <CIcon icon={cilImage} customClassName="nav-icon" />,
|
||||
to: "/banner",
|
||||
group: "Website Related",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Register Image",
|
||||
icon: <CIcon icon={cilImage} customClassName="nav-icon" />,
|
||||
to: "/registerImage",
|
||||
group: "Website Related",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Login Image",
|
||||
icon: <CIcon icon={cilImage} customClassName="nav-icon" />,
|
||||
to: "/loginImage",
|
||||
group: "Website Related",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Shop Page Image",
|
||||
icon: <CIcon icon={cilImage} customClassName="nav-icon" />,
|
||||
to: "/shopImage",
|
||||
group: "Website Related",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Testimonials",
|
||||
icon: <CIcon icon={cilCompress} customClassName="nav-icon" />,
|
||||
to: "/testimonials",
|
||||
group: "Website Related",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Contact Requests",
|
||||
icon: <CIcon icon={cilContact} customClassName="nav-icon" />,
|
||||
to: "/contact/request",
|
||||
},
|
||||
// {
|
||||
// component: CNavItem,
|
||||
// name: "Contact Requests",
|
||||
// icon: <CIcon icon={cilContact} customClassName="nav-icon" />,
|
||||
// to: "/contact/request",
|
||||
// group: "Website Related",
|
||||
// },
|
||||
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "SEO and Analytics",
|
||||
icon: <CIcon icon={cilContact} customClassName="nav-icon" />,
|
||||
to: "/seo/request/new",
|
||||
group: "Website Related",
|
||||
},
|
||||
|
||||
{
|
||||
@ -212,12 +253,14 @@ const _nav = [
|
||||
name: "Content ",
|
||||
icon: <CIcon icon={cilText} customClassName="nav-icon" />,
|
||||
to: "/content",
|
||||
group: "Website Related",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Home",
|
||||
icon: <CIcon icon={cilFeaturedPlaylist} customClassName="nav-icon" />,
|
||||
to: "/home",
|
||||
group: "Website Related",
|
||||
},
|
||||
],
|
||||
},
|
||||
@ -225,18 +268,22 @@ const _nav = [
|
||||
component: CNavGroup,
|
||||
name: "Configuration",
|
||||
icon: <CIcon icon={cilAppsSettings} customClassName="nav-icon" />,
|
||||
group: "",
|
||||
|
||||
items: [
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Social Media",
|
||||
icon: <CIcon icon={cilMedicalCross} customClassName="nav-icon" />,
|
||||
to: "/socialmedia",
|
||||
group: "Configuration",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Application Name",
|
||||
icon: <CIcon icon={cilText} customClassName="nav-icon" />,
|
||||
to: "/application/name",
|
||||
group: "Configuration",
|
||||
},
|
||||
|
||||
{
|
||||
@ -244,18 +291,21 @@ const _nav = [
|
||||
name: "Address",
|
||||
icon: <CIcon icon={cilAddressBook} customClassName="nav-icon" />,
|
||||
to: "/address",
|
||||
group: "Configuration",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Logos",
|
||||
icon: <CIcon icon={cilCommand} customClassName="nav-icon" />,
|
||||
to: "/logo",
|
||||
group: "Configuration",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Copyright Message",
|
||||
icon: <CIcon icon={cilText} customClassName="nav-icon" />,
|
||||
to: "/copyright/message",
|
||||
group: "Configuration",
|
||||
},
|
||||
],
|
||||
},
|
||||
@ -264,18 +314,22 @@ const _nav = [
|
||||
component: CNavGroup,
|
||||
name: "Affiliate & Coupons",
|
||||
icon: <CIcon icon={cilCart} customClassName="nav-icon" />,
|
||||
group: "",
|
||||
|
||||
items: [
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Coupons",
|
||||
icon: <CIcon icon={cilNotes} customClassName="nav-icon" />,
|
||||
to: "/affiliate/coupons",
|
||||
group: "Affiliate & Coupons",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Affiliates",
|
||||
icon: <CIcon icon={cilNotes} customClassName="nav-icon" />,
|
||||
to: "/affiliate/affiliates",
|
||||
group: "Affiliate & Coupons",
|
||||
},
|
||||
],
|
||||
},
|
||||
@ -284,19 +338,29 @@ const _nav = [
|
||||
component: CNavGroup,
|
||||
name: "Customer Service",
|
||||
icon: <CIcon icon={cilClipboard} customClassName="nav-icon" />,
|
||||
group: "",
|
||||
|
||||
items: [
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Customer Support",
|
||||
icon: <CIcon icon={cilAlarm} customClassName="nav-icon" />,
|
||||
to: "/support/request",
|
||||
group: "Customer Service",
|
||||
},
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Contact Requests",
|
||||
icon: <CIcon icon={cilUser} customClassName="nav-icon" />,
|
||||
to: "/contact/request",
|
||||
group: "Customer Service",
|
||||
},
|
||||
// {
|
||||
// component: CNavItem,
|
||||
// name: "Email CMS",
|
||||
// icon: <CIcon icon={cilLocationPin} customClassName="nav-icon" />,
|
||||
// to: "/email-cms",
|
||||
// },
|
||||
],
|
||||
},
|
||||
//Blog start
|
||||
@ -305,8 +369,24 @@ const _nav = [
|
||||
name: "Blog",
|
||||
icon: <CIcon icon={cilNotes} customClassName="nav-icon" />,
|
||||
to: "/blogs",
|
||||
group: "Blog",
|
||||
},
|
||||
// Employee
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Employees & Access",
|
||||
icon: <CIcon icon={cilImage} customClassName="nav-icon" />,
|
||||
to: "/employee",
|
||||
group: "Employees & Access",
|
||||
},
|
||||
//Point of Sale start
|
||||
{
|
||||
component: CNavItem,
|
||||
name: "Point of Sale",
|
||||
icon: <CIcon icon={cilNotes} customClassName="nav-icon" />,
|
||||
to: "/pos",
|
||||
group: "Point of Sale",
|
||||
},
|
||||
|
||||
// {
|
||||
// component: CNavGroup,
|
||||
// name: "Blog",
|
||||
|
||||
@ -1,16 +1,56 @@
|
||||
import React, { Suspense } from 'react'
|
||||
import { Navigate, Route, Routes } from 'react-router-dom'
|
||||
import { CContainer, CSpinner } from '@coreui/react'
|
||||
import React, { Suspense, useEffect, useState } from "react";
|
||||
import { Navigate, Route, Routes } from "react-router-dom";
|
||||
import { CContainer, CSpinner } from "@coreui/react";
|
||||
|
||||
// routes config
|
||||
import routes from '../routes'
|
||||
|
||||
import routes from "../routes";
|
||||
import { isAutheticated } from "src/auth";
|
||||
import axios from "axios";
|
||||
import toast from "react-hot-toast";
|
||||
const AppContent = () => {
|
||||
const [userper, setuserper] = useState(null);
|
||||
const token = isAutheticated();
|
||||
|
||||
useEffect(() => {
|
||||
const getUser = async () => {
|
||||
let existanceData = localStorage.getItem("authToken");
|
||||
if (!existanceData) {
|
||||
setuserper(null);
|
||||
} else {
|
||||
try {
|
||||
let response = await axios.get(`/api/v1/user/details`, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
});
|
||||
const data = response?.data;
|
||||
if (
|
||||
data?.success &&
|
||||
(data?.user?.role === "admin" || data?.user?.role === "Employee")
|
||||
) {
|
||||
setuserper(data?.user);
|
||||
} else {
|
||||
setuserper(null);
|
||||
}
|
||||
} catch (err) {
|
||||
setuserper(null);
|
||||
console.log(err);
|
||||
}
|
||||
}
|
||||
};
|
||||
getUser();
|
||||
}, []);
|
||||
const [appRoutes, setAppRoutes] = useState(routes);
|
||||
return (
|
||||
<CContainer lg>
|
||||
<Suspense fallback={<CSpinner color="primary" />}>
|
||||
<Routes>
|
||||
{routes.map((route, idx) => {
|
||||
{appRoutes.map((route, idx) => {
|
||||
if (
|
||||
userper?.role === "admin" ||
|
||||
route.navName?.trim() === "" ||
|
||||
(userper?.accessTo && userper?.accessTo[route?.navName] === true)
|
||||
) {
|
||||
return (
|
||||
route.element && (
|
||||
<Route
|
||||
@ -21,15 +61,14 @@ const AppContent = () => {
|
||||
element={<route.element />}
|
||||
/>
|
||||
)
|
||||
)
|
||||
);
|
||||
}
|
||||
})}
|
||||
<Route path="/" element={<Navigate to="dashboard" replace />} />
|
||||
</Routes>
|
||||
</Suspense>
|
||||
</CContainer>
|
||||
)
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
|
||||
export default React.memo(AppContent)
|
||||
export default React.memo(AppContent);
|
||||
|
||||
@ -27,12 +27,61 @@ const AppSidebar = () => {
|
||||
const dispatch = useDispatch();
|
||||
const unfoldable = useSelector((state) => state.sidebarUnfoldable);
|
||||
const sidebarShow = useSelector((state) => state.sidebarShow);
|
||||
const [navigationItem, setNavigationItem] = useState(navigation);
|
||||
|
||||
const [userdata, setUserData] = useState(null);
|
||||
const token = isAutheticated();
|
||||
console.log("userDatt", userdata);
|
||||
|
||||
useEffect(() => {
|
||||
const getUser = async () => {
|
||||
let existanceData = localStorage.getItem("authToken");
|
||||
if (!existanceData) {
|
||||
// console.log(existanceData.userData)
|
||||
setUserData(false);
|
||||
} else {
|
||||
try {
|
||||
// console.log('requesting user data from server')
|
||||
let response = await axios.get(`/api/v1/user/details`, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
});
|
||||
// console.log(response.data)
|
||||
const data = response.data;
|
||||
if (
|
||||
(data.success && data.user.role === "admin") ||
|
||||
data.user.role === "Employee"
|
||||
) {
|
||||
setUserData(data.user);
|
||||
} else {
|
||||
setUserData(false);
|
||||
}
|
||||
} catch (err) {
|
||||
setUserData(false);
|
||||
console.log(err);
|
||||
}
|
||||
}
|
||||
};
|
||||
getUser();
|
||||
}, []);
|
||||
useEffect(() => {
|
||||
if (userdata && userdata.accessTo) {
|
||||
const filteredNavigation = navigation.filter((item) => {
|
||||
if (userdata.accessTo[item.name]) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
});
|
||||
setNavigationItem(filteredNavigation);
|
||||
} else {
|
||||
setNavigationItem(navigation);
|
||||
}
|
||||
}, [userdata]);
|
||||
|
||||
///----------------------//
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
const token = isAutheticated();
|
||||
|
||||
// urlcreated images
|
||||
const [AppName, setAppName] = useState("");
|
||||
const [HeaderlogoUrl, setHeaderlogoUrl] = useState("");
|
||||
@ -87,7 +136,7 @@ const AppSidebar = () => {
|
||||
</CSidebarBrand>
|
||||
<CSidebarNav>
|
||||
<SimpleBar>
|
||||
<AppSidebarNav items={navigation} />
|
||||
<AppSidebarNav items={navigationItem} />
|
||||
</SimpleBar>
|
||||
</CSidebarNav>
|
||||
<CSidebarToggler
|
||||
|
||||
@ -1,5 +1,10 @@
|
||||
import React from 'react'
|
||||
import { AppContent, AppSidebar, AppFooter, AppHeader } from '../components/index'
|
||||
import React from "react";
|
||||
import {
|
||||
AppContent,
|
||||
AppSidebar,
|
||||
AppFooter,
|
||||
AppHeader,
|
||||
} from "../components/index";
|
||||
|
||||
const DefaultLayout = () => {
|
||||
return (
|
||||
@ -13,7 +18,7 @@ const DefaultLayout = () => {
|
||||
<AppFooter />
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
export default DefaultLayout
|
||||
export default DefaultLayout;
|
||||
|
||||
643
src/routes.js
643
src/routes.js
@ -137,60 +137,168 @@ import { element } from "prop-types";
|
||||
import OrderdayChart from "./views/Charts/OrderDaywise";
|
||||
import RevenueCharts from "./views/Charts/RevenueCharts";
|
||||
import AddCustomer from "./views/customerDetails/addCustomer";
|
||||
import Pos from "./views/PointOfSale/Pos";
|
||||
import InStoreCashOrders from "./views/orders/InStoreCashOrders";
|
||||
import POSViewOrders from "./views/orders/POSViewOrders";
|
||||
import InStoreQRCodeOrders from "./views/orders/InStoreQRCodeOrders";
|
||||
import EmailCms from "./views/CustomerSupport/EmailCMS/EmailCms";
|
||||
import RegistrationEmail from "./views/CustomerSupport/EmailCMS/RegistrationEmail";
|
||||
import Employee from "./views/EmployeeAccess/Employee";
|
||||
import AddEmployee from "./views/EmployeeAccess/addEmployee";
|
||||
import EditEmployee from "./views/EmployeeAccess/editEmployee";
|
||||
import ExportToExcel from "./views/exportExcel";
|
||||
const routes = [
|
||||
{ path: "/", exact: true, name: "Home" },
|
||||
// { path: "/", exact: true, name: "Home", navName: "" },
|
||||
//dashboard
|
||||
|
||||
{ path: "/dashboard", name: "Dashboard", element: Dashboard, navName: "" },
|
||||
{
|
||||
path: "/change_password",
|
||||
name: "Change Password",
|
||||
element: Change_Password,
|
||||
navName: "",
|
||||
},
|
||||
{
|
||||
path: "/profile/edit",
|
||||
name: "Edit Profile",
|
||||
element: EditProfile,
|
||||
navName: "",
|
||||
},
|
||||
{ path: "/profile/edit", name: "Edit Profile", element: EditProfile },
|
||||
// { path: '/profile', name: 'Profile', element: Profile },
|
||||
//------------------Charts Routes------------------------------------
|
||||
{
|
||||
path: "/new-user-day-wise",
|
||||
name: "new user day wise",
|
||||
element: UserCharts,
|
||||
navName: "Charts",
|
||||
},
|
||||
{
|
||||
path: "/revenue-by-product",
|
||||
name: "Revenue By Product",
|
||||
element: ProductrevenueCharts,
|
||||
navName: "Charts",
|
||||
},
|
||||
{
|
||||
path: "/revenue-by-state",
|
||||
name: "Revenue By State",
|
||||
element: StateRevenueCharts,
|
||||
navName: "Charts",
|
||||
},
|
||||
{
|
||||
path: "/revenue-by-city",
|
||||
name: "Revenue By City",
|
||||
element: CityRevenueCharts,
|
||||
navName: "Charts",
|
||||
},
|
||||
{
|
||||
path: "/orders-day-wise",
|
||||
name: "Orders (Day Wise)",
|
||||
element: OrderdayChart,
|
||||
navName: "Charts",
|
||||
},
|
||||
{
|
||||
path: "/revenue-day-wise",
|
||||
name: "Revenue (Day Wise)",
|
||||
element: RevenueCharts,
|
||||
navName: "Charts",
|
||||
},
|
||||
//------------------ End Charts Routes------------------------------------
|
||||
//-----------------------Product Management Routes------------------------------------------------
|
||||
{
|
||||
path: "/products",
|
||||
name: "products",
|
||||
element: Products,
|
||||
navName: "Product Management",
|
||||
},
|
||||
{
|
||||
path: "/product/add",
|
||||
name: "Add products",
|
||||
element: AddProduct,
|
||||
navName: "Product Management",
|
||||
},
|
||||
{
|
||||
path: "/product/edit/:id",
|
||||
name: "Edit products",
|
||||
element: EditProduct,
|
||||
navName: "Product Management",
|
||||
},
|
||||
{
|
||||
path: "/product/view/:id",
|
||||
name: "view products",
|
||||
element: ViewProduct,
|
||||
navName: "Product Management",
|
||||
},
|
||||
{
|
||||
path: "/categories",
|
||||
name: "Categories",
|
||||
element: Categories,
|
||||
navName: "Product Management",
|
||||
},
|
||||
//Gst tax
|
||||
{
|
||||
path: "/tax",
|
||||
name: "Tax Rates",
|
||||
element: Tax,
|
||||
navName: "Product Management",
|
||||
},
|
||||
{
|
||||
path: "/tax/add",
|
||||
name: "Add Tax",
|
||||
element: Addtax,
|
||||
navName: "Product Management",
|
||||
},
|
||||
{
|
||||
path: "/tax/edit/:id",
|
||||
name: "Edit Tax",
|
||||
element: Edittax,
|
||||
navName: "Product Management",
|
||||
},
|
||||
//----------------------- End Product Management Routes------------------------------------------------
|
||||
|
||||
//Product
|
||||
{ path: "/products", name: "products", element: Products },
|
||||
{ path: "/product/add", name: "Add products", element: AddProduct },
|
||||
{ path: "/product/edit/:id", name: "Edit products", element: EditProduct },
|
||||
{ path: "/product/view/:id", name: "view products", element: ViewProduct },
|
||||
//Departure
|
||||
{ path: "/departures", name: "Departures", element: Departures },
|
||||
{ path: "/departure/add", name: "Add Departure", element: AddDeparture },
|
||||
{ path: "/product/edit/:id", name: "Edit products", element: EditProduct },
|
||||
{ path: "/product/view/:id", name: "view products", element: ViewProduct },
|
||||
// { path: "/departures", name: "Departures", element: Departures },
|
||||
// { path: "/departure/add", name: "Add Departure", element: AddDeparture },
|
||||
// { path: "/product/edit/:id", name: "Edit products", element: EditProduct },
|
||||
// { path: "/product/view/:id", name: "view products", element: ViewProduct },
|
||||
|
||||
// Appointments
|
||||
{ path: "/appointments", name: "Appointments", element: Appointments },
|
||||
{
|
||||
path: "/appointment/view/:id",
|
||||
name: "View Appointment",
|
||||
element: ViewAppointment,
|
||||
},
|
||||
{
|
||||
path: "/appointment/edit/:id",
|
||||
name: "Edit Appointment",
|
||||
element: EditAppointment,
|
||||
},
|
||||
{
|
||||
path: "/appointment/new",
|
||||
name: "Add Appointment",
|
||||
element: AddNewAppointment,
|
||||
},
|
||||
|
||||
// { path: "/appointments", name: "Appointments", element: Appointments },
|
||||
// {
|
||||
// path: "/appointment/view/:id",
|
||||
// name: "View Appointment",
|
||||
// element: ViewAppointment,
|
||||
// },
|
||||
// {
|
||||
// path: "/appointment/edit/:id",
|
||||
// name: "Edit Appointment",
|
||||
// element: EditAppointment,
|
||||
// },
|
||||
// {
|
||||
// path: "/appointment/new",
|
||||
// name: "Add Appointment",
|
||||
// element: AddNewAppointment,
|
||||
// },
|
||||
//------------------customers Route-------------------------
|
||||
{
|
||||
path: "/customers-details",
|
||||
name: "User Table",
|
||||
name: "Customers",
|
||||
element: CustomerTable,
|
||||
navName: "Customers",
|
||||
},
|
||||
{
|
||||
path: "/customers-details/:_id",
|
||||
name: "User Table",
|
||||
name: "Customers",
|
||||
element: SingleUserAllDetails,
|
||||
navName: "Customers",
|
||||
},
|
||||
{
|
||||
path: "/add-customer",
|
||||
name: "User Table",
|
||||
name: "Customers",
|
||||
element: AddCustomer,
|
||||
navName: "Customers",
|
||||
},
|
||||
//------------------ End customers Route-------------------------
|
||||
|
||||
// {
|
||||
// path: "/users-address/add",
|
||||
// name: "User Address",
|
||||
@ -203,7 +311,7 @@ const routes = [
|
||||
// },
|
||||
{
|
||||
path: "/users-address/view",
|
||||
name: "view address",
|
||||
name: "Customers",
|
||||
element: viewDetails,
|
||||
},
|
||||
|
||||
@ -229,27 +337,23 @@ const routes = [
|
||||
// element: ViewHealthCareProvider,
|
||||
// },
|
||||
// Categories
|
||||
{
|
||||
path: "/categories",
|
||||
name: "Categories",
|
||||
element: Categories,
|
||||
},
|
||||
|
||||
// Design
|
||||
{
|
||||
path: "/design",
|
||||
name: "Design",
|
||||
element: Design,
|
||||
},
|
||||
{
|
||||
path: "//campaigns",
|
||||
name: "campaigns",
|
||||
element: Campaign,
|
||||
},
|
||||
{
|
||||
path: "//campaign/add",
|
||||
name: "Add Campaigns",
|
||||
element: AddCampaign,
|
||||
},
|
||||
// {
|
||||
// path: "/design",
|
||||
// name: "Design",
|
||||
// element: Design,
|
||||
// },
|
||||
// {
|
||||
// path: "/campaigns",
|
||||
// name: "campaigns",
|
||||
// element: Campaign,
|
||||
// },
|
||||
// {
|
||||
// path: "/campaign/add",
|
||||
// name: "Add Campaigns",
|
||||
// element: AddCampaign,
|
||||
// },
|
||||
// {
|
||||
// path: "/campaigns/edit/:id",
|
||||
// name: "Edit healthcare providers",
|
||||
@ -263,342 +367,461 @@ const routes = [
|
||||
|
||||
// { path: '/franchisee/view/:id', name: 'view franchisee', element: ViewFra },
|
||||
//Contact Requests
|
||||
|
||||
// ----------------Customer Service Routes-------------------------------
|
||||
{
|
||||
path: "/contact/request",
|
||||
name: "Contact Requests",
|
||||
name: "Customer Service",
|
||||
element: ContactRequests,
|
||||
navName: "Customer Service",
|
||||
},
|
||||
{
|
||||
path: "/contact/request/new",
|
||||
name: "AddContact Request",
|
||||
name: "Customer Service",
|
||||
element: AddContactRequest,
|
||||
navName: "Customer Service",
|
||||
},
|
||||
//Support Requests
|
||||
{
|
||||
path: "/email-cms",
|
||||
name: "CustomerSupport Requests",
|
||||
element: EmailCms,
|
||||
navName: "Customer Service",
|
||||
},
|
||||
{
|
||||
path: "/email-cms/registration-email",
|
||||
name: "CustomerSupport Requests",
|
||||
element: RegistrationEmail,
|
||||
navName: "Customer Service",
|
||||
},
|
||||
|
||||
{
|
||||
path: "/support/request",
|
||||
name: "CustomerSupport Requests",
|
||||
name: "Customer Service",
|
||||
element: SupportRequest,
|
||||
navName: "Customer Service",
|
||||
},
|
||||
{
|
||||
path: "/support/request/closed",
|
||||
name: "Closed CustomerSupport Requests",
|
||||
name: "Customer Service",
|
||||
element: SupportRequestClosed,
|
||||
navName: "Customer Service",
|
||||
},
|
||||
{
|
||||
path: "/support/request/closed/:ticketID",
|
||||
name: "Closed CustomerSupport Request view",
|
||||
name: "Customer Service",
|
||||
element: CloseRequestView,
|
||||
navName: "Customer Service",
|
||||
},
|
||||
{
|
||||
path: "/support/request/reply/:ticketID",
|
||||
name: "CustomerSupport Reply",
|
||||
name: "Customer Service",
|
||||
element: SupportReply,
|
||||
navName: "Customer Service",
|
||||
},
|
||||
// Content ---- >
|
||||
|
||||
{
|
||||
path: "/content",
|
||||
name: "Content",
|
||||
element: Content,
|
||||
},
|
||||
{
|
||||
path: "/content/terms-and-conditions",
|
||||
name: "Content",
|
||||
element: EditTermsConditions,
|
||||
},
|
||||
{
|
||||
path: "/content/privacy-policy",
|
||||
name: "Content",
|
||||
element: EditPrivacyPolicy,
|
||||
},
|
||||
{
|
||||
path: "/content/shipping-policy",
|
||||
name: "Content",
|
||||
element: EditShippingPolicy,
|
||||
},
|
||||
{
|
||||
path: "/content/refund-policy",
|
||||
name: "Content",
|
||||
element: EditRefundpolicy,
|
||||
},
|
||||
{
|
||||
path: "/content/about-us",
|
||||
name: "Content",
|
||||
element: EditAboutUs,
|
||||
},
|
||||
|
||||
// Home
|
||||
{
|
||||
path: "/home",
|
||||
name: "Home",
|
||||
element: Home,
|
||||
},
|
||||
{
|
||||
path: "/home/panel-1",
|
||||
name: "EditPanel1",
|
||||
element: EditPanel1,
|
||||
},
|
||||
{
|
||||
path: "/home/panel-2",
|
||||
name: "EditPanel2",
|
||||
element: EditPanel2,
|
||||
},
|
||||
{
|
||||
path: "/home/panel-3",
|
||||
name: "EditPanel3",
|
||||
element: EditPanel3,
|
||||
},
|
||||
{
|
||||
path: "/home/panel-4",
|
||||
name: "EditPanel4",
|
||||
element: Editpanel4,
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// ---------------- End Customer Service Routes-------------------------------
|
||||
|
||||
// { path: '/complaint/view/:id', name: 'view Complain', element: ViewComplaint },
|
||||
//Complaints
|
||||
|
||||
//-------------------------------website related routes----------------------------------
|
||||
{
|
||||
path: "/banner",
|
||||
name: "Banners",
|
||||
element: Banners,
|
||||
navName: "Website Related",
|
||||
},
|
||||
{
|
||||
path: "/registerImage",
|
||||
name: "RegisterImage",
|
||||
element: RegisterImage,
|
||||
navName: "Website Related",
|
||||
},
|
||||
{
|
||||
path: "/loginImage",
|
||||
name: "LoginImage",
|
||||
element: LoginImage,
|
||||
navName: "Website Related",
|
||||
},
|
||||
{
|
||||
path: "/shopImage",
|
||||
name: "ShopImage",
|
||||
element: ShopImage,
|
||||
navName: "Website Related",
|
||||
},
|
||||
{
|
||||
path: "/testimonials",
|
||||
name: "Testimonials",
|
||||
element: Testimonials,
|
||||
navName: "Website Related",
|
||||
},
|
||||
|
||||
{
|
||||
path: "/testimonial/new",
|
||||
name: "AddTestimonial",
|
||||
element: AddTestimonial,
|
||||
navName: "Website Related",
|
||||
},
|
||||
{
|
||||
path: "/testimonial/view/:id",
|
||||
name: "ViewTestimonial",
|
||||
element: ViewTestimonial,
|
||||
navName: "Website Related",
|
||||
},
|
||||
{
|
||||
path: "/testimonial/edit/:id",
|
||||
name: "EditTestimonial",
|
||||
element: EditTestimonial,
|
||||
navName: "Website Related",
|
||||
},
|
||||
//seo
|
||||
{
|
||||
path: "/seo/request/new",
|
||||
name: "seo Request",
|
||||
element: AddSeoRequest,
|
||||
navName: "Website Related",
|
||||
},
|
||||
// Content ---- >
|
||||
{
|
||||
path: "/content",
|
||||
name: "Website Related",
|
||||
element: Content,
|
||||
navName: "Website Related",
|
||||
},
|
||||
{
|
||||
path: "/banner",
|
||||
name: "Banners",
|
||||
element: Banners,
|
||||
path: "/content/terms-and-conditions",
|
||||
name: "Website Related",
|
||||
element: EditTermsConditions,
|
||||
navName: "Website Related",
|
||||
},
|
||||
{
|
||||
path: "/registerImage",
|
||||
name: "RegisterImage",
|
||||
element: RegisterImage,
|
||||
path: "/content/privacy-policy",
|
||||
name: "Website Related",
|
||||
element: EditPrivacyPolicy,
|
||||
navName: "Website Related",
|
||||
},
|
||||
{
|
||||
path: "/loginImage",
|
||||
name: "LoginImage",
|
||||
element: LoginImage,
|
||||
path: "/content/shipping-policy",
|
||||
name: "Website Related",
|
||||
element: EditShippingPolicy,
|
||||
navName: "Website Related",
|
||||
},
|
||||
{
|
||||
path: "/shopImage",
|
||||
name: "ShopImage",
|
||||
element: ShopImage,
|
||||
path: "/content/refund-policy",
|
||||
name: "Website Related",
|
||||
element: EditRefundpolicy,
|
||||
navName: "Website Related",
|
||||
},
|
||||
{
|
||||
path: "/content/about-us",
|
||||
name: "Website Related",
|
||||
element: EditAboutUs,
|
||||
navName: "Website Related",
|
||||
},
|
||||
// Home Pannel website
|
||||
{
|
||||
path: "/home",
|
||||
name: "Home",
|
||||
element: Home,
|
||||
navName: "Website Related",
|
||||
},
|
||||
{
|
||||
path: "/home/panel-1",
|
||||
name: "EditPanel1",
|
||||
element: EditPanel1,
|
||||
navName: "Website Related",
|
||||
},
|
||||
{
|
||||
path: "/home/panel-2",
|
||||
name: "EditPanel2",
|
||||
element: EditPanel2,
|
||||
navName: "Website Related",
|
||||
},
|
||||
{
|
||||
path: "/home/panel-3",
|
||||
name: "EditPanel3",
|
||||
element: EditPanel3,
|
||||
navName: "Website Related",
|
||||
},
|
||||
{
|
||||
path: "/home/panel-4",
|
||||
name: "EditPanel4",
|
||||
element: Editpanel4,
|
||||
navName: "Website Related",
|
||||
},
|
||||
//-------------------------------End website related routes----------------------------------
|
||||
|
||||
//informations
|
||||
{ path: "/informations", name: "Informations", element: Informations },
|
||||
// { path: "/informations", name: "Informations", element: Informations },
|
||||
// {
|
||||
// path: "/information/new",
|
||||
// name: "Add Informations",
|
||||
// element: AddInformations,
|
||||
// },
|
||||
|
||||
//--------------Order Management Routes---------------------------------------
|
||||
{
|
||||
path: "/information/new",
|
||||
name: "Add Informations",
|
||||
element: AddInformations,
|
||||
path: "/orders/new",
|
||||
name: "New Orders",
|
||||
element: NewOrders,
|
||||
navName: "Orders",
|
||||
},
|
||||
{
|
||||
path: "/order/add",
|
||||
name: "add Order",
|
||||
element: AddOrder,
|
||||
navName: "Orders",
|
||||
},
|
||||
{
|
||||
path: "/orders/edit/:id",
|
||||
name: "Edit Order",
|
||||
element: EditOrder,
|
||||
navName: "Orders",
|
||||
},
|
||||
{
|
||||
path: "/orders/:status/:id",
|
||||
name: "View Order",
|
||||
element: ViewOrders,
|
||||
navName: "Orders",
|
||||
},
|
||||
|
||||
//Order Management
|
||||
|
||||
{ path: "/orders/new", name: "New Orders", element: NewOrders },
|
||||
{ path: "/order/add", name: "add Order", element: AddOrder },
|
||||
{ path: "/orders/edit/:id", name: "Edit Order", element: EditOrder },
|
||||
{ path: "/orders/:status/:id", name: "View Order", element: ViewOrders },
|
||||
|
||||
{
|
||||
path: "/orders/processing",
|
||||
name: "Processing Orders",
|
||||
element: ProcessingOrders,
|
||||
navName: "Orders",
|
||||
},
|
||||
{
|
||||
path: "/orders/dispatched",
|
||||
name: "Dispatched Orders",
|
||||
element: DispatchedOrders,
|
||||
navName: "Orders",
|
||||
},
|
||||
{
|
||||
path: "/orders/delivered",
|
||||
name: "Delivered Orders",
|
||||
element: DeliveredOrders,
|
||||
navName: "Orders",
|
||||
},
|
||||
{
|
||||
path: "/orders/cancelled",
|
||||
name: "Cancelled Orders",
|
||||
element: CancelledOrders,
|
||||
navName: "Orders",
|
||||
},
|
||||
{
|
||||
path: "/orders/returned",
|
||||
name: "Returned Orders",
|
||||
element: ReturnedOrders,
|
||||
navName: "Orders",
|
||||
},
|
||||
{
|
||||
path: "/inStoreCashOrders/new",
|
||||
name: "In Store Cash Orders",
|
||||
element: InStoreCashOrders,
|
||||
navName: "Orders",
|
||||
},
|
||||
{
|
||||
path: "/InStoreQRCodeOrders/new",
|
||||
name: "In Store QR Code Orders",
|
||||
element: InStoreQRCodeOrders,
|
||||
navName: "Orders",
|
||||
},
|
||||
{
|
||||
path: "/inStoreOrders/:status/:id",
|
||||
name: "View In Store Cash Orders",
|
||||
element: POSViewOrders,
|
||||
navName: "Orders",
|
||||
},
|
||||
//-------------- End Order Management Routes---------------------------------------
|
||||
|
||||
//----------Point of sale orders Routes-----------------------
|
||||
|
||||
// { path: "/order/:status/:id", name: "View Order", element: ViewOdr },
|
||||
|
||||
//dashboard
|
||||
|
||||
{ path: "/dashboard", name: "Dashboard", element: Dashboard },
|
||||
|
||||
//------------settings------------------------//
|
||||
|
||||
{ path: "/policies", name: "Policies", element: Policies },
|
||||
// { path: "/policies", name: "Policies", element: Policies },
|
||||
|
||||
{ path: "/socialmedia", name: "Social Media", element: Socialmedia },
|
||||
{ path: "/purpose", name: "Purpose", element: Purpose },
|
||||
{ path: "/purpose/add", name: "Add Purpose", element: AddPurpose },
|
||||
//languge
|
||||
// { path: "/purpose", name: "Purpose", element: Purpose },
|
||||
// { path: "/purpose/add", name: "Add Purpose", element: AddPurpose },
|
||||
// //languge
|
||||
|
||||
{ path: "/languages", name: "languages", element: Languages },
|
||||
{ path: "/language/add", name: "Add languages", element: AddLanguage },
|
||||
{ path: "/language/edit/:id", name: "Edit languages", element: EditLanguage },
|
||||
// { path: "/languages", name: "languages", element: Languages },
|
||||
// { path: "/language/add", name: "Add languages", element: AddLanguage },
|
||||
// { path: "/language/edit/:id", name: "Edit languages", element: EditLanguage },
|
||||
//business Type
|
||||
|
||||
{ path: "/business_type", name: "business", element: BusinessType },
|
||||
{
|
||||
path: "/business_type/add",
|
||||
name: "Add business",
|
||||
element: AddBusinessType,
|
||||
},
|
||||
{
|
||||
path: "/business_type/edit/:id",
|
||||
name: "Edit business",
|
||||
element: EditBusinessType,
|
||||
},
|
||||
// { path: "/business_type", name: "business", element: BusinessType },
|
||||
// {
|
||||
// path: "/business_type/add",
|
||||
// name: "Add business",
|
||||
// element: AddBusinessType,
|
||||
// },
|
||||
// {
|
||||
// path: "/business_type/edit/:id",
|
||||
// name: "Edit business",
|
||||
// element: EditBusinessType,
|
||||
// },
|
||||
|
||||
//purpose
|
||||
|
||||
{ path: "/purpose", name: "purpose", element: Purpose },
|
||||
{ path: "/purpose/add", name: "Add purpose", element: AddPurpose },
|
||||
{ path: "/purpose/edit/:id", name: "Edit purpose", element: EditPurpose },
|
||||
// { path: "/purpose", name: "purpose", element: Purpose },
|
||||
// { path: "/purpose/add", name: "Add purpose", element: AddPurpose },
|
||||
// { path: "/purpose/edit/:id", name: "Edit purpose", element: EditPurpose },
|
||||
|
||||
//languge
|
||||
|
||||
//-----------------Configuration Routes-----------------------------------
|
||||
{
|
||||
path: "/socialmedia",
|
||||
name: "Social Media",
|
||||
element: Socialmedia,
|
||||
navName: "Configuration",
|
||||
},
|
||||
|
||||
{
|
||||
path: "/application/name",
|
||||
name: "ApplicationName",
|
||||
element: ApplicationName,
|
||||
navName: "Configuration",
|
||||
},
|
||||
{
|
||||
path: "/copyright/message",
|
||||
name: "Copyright Message",
|
||||
element: CopyrightMessage,
|
||||
navName: "Configuration",
|
||||
},
|
||||
|
||||
{ path: "/address", name: "Address", element: Address },
|
||||
{ path: "/logo", name: "Logo", element: Logo },
|
||||
|
||||
//Taxes
|
||||
{ path: "/tax", name: "Tax Rates", element: Tax },
|
||||
{ path: "/tax/add", name: "Add Tax", element: Addtax },
|
||||
{ path: "/tax/edit/:id", name: "Edit Tax", element: Edittax },
|
||||
// -------------------------------------------//
|
||||
|
||||
{
|
||||
path: "/seo/request/new",
|
||||
name: "seo Request",
|
||||
element: AddSeoRequest,
|
||||
path: "/address",
|
||||
name: "Address",
|
||||
element: Address,
|
||||
navName: "Configuration",
|
||||
},
|
||||
{ path: "/logo", name: "Logo", element: Logo, navName: "Configuration" },
|
||||
//----------------- End Configuration Routes-----------------------------------
|
||||
|
||||
//-----------------Affiliate & Coupons Routes-----------------------------------
|
||||
{
|
||||
path: "/affiliate/coupons",
|
||||
name: "Coupon",
|
||||
element: Coupons,
|
||||
navName: "Affiliate & Coupons",
|
||||
},
|
||||
{
|
||||
path: "/affiliate/affiliates",
|
||||
name: "Affiliate",
|
||||
element: Affiliates,
|
||||
navName: "Affiliate & Coupons",
|
||||
},
|
||||
//
|
||||
//Affiliate Dashboard
|
||||
{ path: "/affiliate/coupons", name: "Coupon", element: Coupons },
|
||||
{ path: "/affiliate/affiliates", name: "Affiliate", element: Affiliates },
|
||||
{
|
||||
path: "/affiliate/coupons/create",
|
||||
name: "Create Coupon",
|
||||
element: CreateCoupon,
|
||||
navName: "Affiliate & Coupons",
|
||||
},
|
||||
{
|
||||
path: "/affiliate/affiliates/create",
|
||||
name: "Create Affiliate",
|
||||
element: CreateAffiliate,
|
||||
navName: "Affiliate & Coupons",
|
||||
},
|
||||
{
|
||||
path: "/affiliate/affiliates/edit/:id",
|
||||
name: "Edit Affiliate",
|
||||
element: EditAffiliate,
|
||||
navName: "Affiliate & Coupons",
|
||||
},
|
||||
{
|
||||
path: "/affiliate/affiliates/pay/:id",
|
||||
name: "Pay Affiliate",
|
||||
element: PayAffiliate,
|
||||
navName: "Affiliate & Coupons",
|
||||
},
|
||||
{
|
||||
path: "/affiliate/affiliates/history/:id",
|
||||
name: "Pay Affiliate",
|
||||
element: AffiliateHistory,
|
||||
navName: "Affiliate & Coupons",
|
||||
},
|
||||
{
|
||||
path: "/affiliate/coupons/edit/:id",
|
||||
name: "Edit Coupon",
|
||||
element: EditCoupon,
|
||||
navName: "Affiliate & Coupons",
|
||||
},
|
||||
{
|
||||
path: "/affiliate/coupons/history/:id",
|
||||
name: "Edit Coupon",
|
||||
element: CouponHistory,
|
||||
navName: "Affiliate & Coupons",
|
||||
},
|
||||
//Blogs Section
|
||||
//----------------- End Affiliate & Coupons Routes-----------------------------------
|
||||
|
||||
//---------- Blog Routes---------------------------------
|
||||
{
|
||||
path: "/blogs",
|
||||
name: "Blogs",
|
||||
element: Blogs,
|
||||
navName: "Blog",
|
||||
},
|
||||
{
|
||||
path: "/blogs/create",
|
||||
name: "Blogs",
|
||||
element: CreateBlog,
|
||||
navName: "Blog",
|
||||
},
|
||||
{
|
||||
path: "/blog/edit/:id",
|
||||
name: "Blogs",
|
||||
element: UpdateBlog,
|
||||
navName: "Blog",
|
||||
},
|
||||
{
|
||||
path: "/blog/view/:id",
|
||||
name: "Blogs",
|
||||
element: ViewBlog,
|
||||
navName: "Blog",
|
||||
},
|
||||
//Charts
|
||||
|
||||
//----------End Blog Routes---------------------------------
|
||||
// ------------------------Employee Routes-----------------------
|
||||
{
|
||||
path: "/new-user-day-wise",
|
||||
name: "new user day wise",
|
||||
element: UserCharts,
|
||||
path: "/employee",
|
||||
name: "Employee",
|
||||
element: Employee,
|
||||
navName: "Employees & Access",
|
||||
},
|
||||
{
|
||||
path: "/revenue-by-product",
|
||||
name: "Revenue By Product",
|
||||
element: ProductrevenueCharts,
|
||||
path: "/add-employee",
|
||||
name: "Employee",
|
||||
element: AddEmployee,
|
||||
navName: "Employees & Access",
|
||||
},
|
||||
{
|
||||
path: "/revenue-by-state",
|
||||
name: "Revenue By State",
|
||||
element: StateRevenueCharts,
|
||||
path: "edit-employee/:id",
|
||||
name: "Employee",
|
||||
element: EditEmployee,
|
||||
navName: "Employees & Access",
|
||||
},
|
||||
// ------------------------ End Employee Routes-----------------------
|
||||
|
||||
//---------Point of Sale Section Routes------------------------
|
||||
{
|
||||
path: "/revenue-by-city",
|
||||
name: "Revenue By City",
|
||||
element: CityRevenueCharts,
|
||||
path: "/pos",
|
||||
name: "Point of Sale",
|
||||
element: Pos,
|
||||
navName: "Point of Sale",
|
||||
},
|
||||
|
||||
// Export to excel
|
||||
{
|
||||
path: "/orders-day-wise",
|
||||
name: "Orders (Day Wise)",
|
||||
element: OrderdayChart,
|
||||
},
|
||||
{
|
||||
path: "/revenue-day-wise",
|
||||
name: "Revenue (Day Wise)",
|
||||
element: RevenueCharts,
|
||||
path: "/exp",
|
||||
name: "Point of Sale",
|
||||
element: ExportToExcel,
|
||||
navName: "Point of Sale",
|
||||
},
|
||||
//--------- End Point of Sale Section Routes------------------------
|
||||
];
|
||||
|
||||
export default routes;
|
||||
|
||||
111
src/views/CustomerSupport/EmailCMS/EmailCms.js
Normal file
111
src/views/CustomerSupport/EmailCMS/EmailCms.js
Normal file
@ -0,0 +1,111 @@
|
||||
import {
|
||||
Button,
|
||||
Paper,
|
||||
Table,
|
||||
TableBody,
|
||||
TableCell,
|
||||
TableContainer,
|
||||
TableHead,
|
||||
TableRow,
|
||||
Typography,
|
||||
} from "@mui/material";
|
||||
import React from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
export default function EmailCms() {
|
||||
const pages = [
|
||||
{
|
||||
name: "New user registration",
|
||||
action: "Edit",
|
||||
path: "/email-cms/registration-email",
|
||||
},
|
||||
{
|
||||
name: "Forgot Password",
|
||||
action: "Edit",
|
||||
path: "#",
|
||||
},
|
||||
{
|
||||
name: "Change Password Notification ",
|
||||
action: "Edit",
|
||||
path: "#",
|
||||
},
|
||||
{
|
||||
name: "New Order",
|
||||
action: "Edit",
|
||||
path: "#",
|
||||
},
|
||||
{
|
||||
name: "Order - Processing",
|
||||
action: "Edit",
|
||||
path: "#",
|
||||
},
|
||||
{
|
||||
name: "Order - Dispatched",
|
||||
action: "Edit",
|
||||
path: "#",
|
||||
},
|
||||
{
|
||||
name: "Order - Delivered",
|
||||
action: "Edit",
|
||||
path: "#",
|
||||
},
|
||||
{
|
||||
name: "Order - Cancelled",
|
||||
action: "Edit",
|
||||
path: "#",
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="main-content">
|
||||
<Typography variant="h6" fontWeight={"bold"}>
|
||||
Email CMS
|
||||
</Typography>
|
||||
<TableContainer component={Paper}>
|
||||
<Table sx={{ minWidth: 650 }} aria-label="simple table">
|
||||
<TableHead>
|
||||
<TableRow>
|
||||
<TableCell style={{ fontWeight: "bold" }}>Page</TableCell>
|
||||
<TableCell style={{ fontWeight: "bold" }} align="right">
|
||||
Action
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
<TableBody>
|
||||
{pages.map((row) => (
|
||||
<TableRow
|
||||
key={row.name}
|
||||
sx={{ "&:last-child td, &:last-child th": { border: 0 } }}
|
||||
>
|
||||
<TableCell component="th" scope="row">
|
||||
{row.name}
|
||||
</TableCell>
|
||||
<TableCell align="right">
|
||||
{" "}
|
||||
<Link to={row.path}>
|
||||
<button
|
||||
style={{
|
||||
color: "white",
|
||||
marginRight: "1rem",
|
||||
}}
|
||||
type="button"
|
||||
className="
|
||||
btn btn-info btn-sm
|
||||
waves-effect waves-light
|
||||
btn-table
|
||||
mt-1
|
||||
mx-1
|
||||
"
|
||||
>
|
||||
{row.action}
|
||||
</button>
|
||||
</Link>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</TableContainer>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
207
src/views/CustomerSupport/EmailCMS/RegistrationEmail.js
Normal file
207
src/views/CustomerSupport/EmailCMS/RegistrationEmail.js
Normal file
@ -0,0 +1,207 @@
|
||||
import { Typography } from "@material-ui/core";
|
||||
import { Box, Button } from "@mui/material";
|
||||
|
||||
import React, { useEffect, useState } from "react";
|
||||
import ReactrichTextEditor from "../../Content/reactrichTextEditor";
|
||||
import ReactQuill from "react-quill";
|
||||
import "react-quill/dist/quill.snow.css";
|
||||
import axios from "axios";
|
||||
import { isAutheticated } from "src/auth";
|
||||
import { useNavigate, useNavigation } from "react-router-dom";
|
||||
|
||||
// const TOOLBAR_OPTIONS = [
|
||||
// [{ header: [1, 2, 3, 4, 5, 6, false] }],
|
||||
// [{ font: [] }],
|
||||
// [{ list: "ordered" }, { list: "bullet" }],
|
||||
// ["bold", "italic", "underline", "strike"],
|
||||
// [{ color: [] }, { background: [] }],
|
||||
// [{ align: [] }],
|
||||
// [{ script: "super" }, { script: "sub" }],
|
||||
// ["undo", "redo"],
|
||||
// ];
|
||||
|
||||
export default function RegistrationEmail() {
|
||||
const [title, setTitle] = useState("Registration Email");
|
||||
const [welcomemsg, setWelcomeMsg] = useState("");
|
||||
const [welcomemsgforDescription, setWelcomeMsgForDescription] = useState("");
|
||||
|
||||
const [subject, setSubject] = useState("");
|
||||
const [description, setDescription] = useState("");
|
||||
const [content, setContent] = useState("");
|
||||
const [added, setAdded] = useState(false);
|
||||
const [olderContent, setOlderContent] = useState("");
|
||||
const [id, setId] = useState(null);
|
||||
|
||||
const token = isAutheticated();
|
||||
|
||||
const getTermsAndConditions = async () => {
|
||||
const response = await axios.get("/api/get-email-data", {
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
});
|
||||
if (response.status === 200) {
|
||||
if (response.data?.registerEmaildata.length === 0) {
|
||||
return;
|
||||
}
|
||||
// console.log(response);
|
||||
// setContent(response?.data?.registerEmaildata[0]?.termsAndContionContent);
|
||||
// setOlderContent(
|
||||
// response?.data?.registerEmaildata[0]?.termsAndContionContent
|
||||
// );
|
||||
setSubject(response?.data?.registerEmaildata[0]?.subject);
|
||||
setDescription(response?.data?.registerEmaildata[0]?.description);
|
||||
setId(response?.data?.registerEmaildata[0]?._id);
|
||||
}
|
||||
};
|
||||
|
||||
const addTermsandConditions = async () => {
|
||||
const response = await axios.post(
|
||||
"/api/register-email",
|
||||
{ subject: subject, description: description },
|
||||
{
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
}
|
||||
);
|
||||
if (response.status == 200) {
|
||||
swal({
|
||||
title: "Congratulations!!",
|
||||
text: response?.data?.message,
|
||||
icon: "success",
|
||||
button: "OK",
|
||||
});
|
||||
}
|
||||
};
|
||||
const handleCancelClick = () => {
|
||||
setAdded(!added);
|
||||
};
|
||||
|
||||
const handleSaveClick = async () => {
|
||||
// if (id === null) {
|
||||
await addTermsandConditions();
|
||||
setAdded(true);
|
||||
// } else {
|
||||
// await updateContent();
|
||||
// setAdded(false);
|
||||
// }
|
||||
|
||||
// Reload terms and conditions
|
||||
// await getTermsAndConditions();
|
||||
};
|
||||
useEffect(() => {
|
||||
// addTermsandConditions();
|
||||
getTermsAndConditions();
|
||||
}, [added]);
|
||||
return (
|
||||
<div>
|
||||
<div style={{ display: "flex" }}>
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
onClick={handleSaveClick}
|
||||
style={{
|
||||
fontWeight: "bold",
|
||||
marginBottom: "1rem",
|
||||
textTransform: "capitalize",
|
||||
marginRight: "5px",
|
||||
}}
|
||||
>
|
||||
Save
|
||||
</Button>
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
onClick={handleCancelClick}
|
||||
style={{
|
||||
fontWeight: "bold",
|
||||
marginBottom: "1rem",
|
||||
textTransform: "capitalize",
|
||||
marginRight: "5px",
|
||||
}}
|
||||
>
|
||||
Cancel
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
<Box style={{ background: "#FFFFFF", color: "black", padding: "1rem" }}>
|
||||
{/* <TextField
|
||||
type="text"
|
||||
value={title}
|
||||
onChange={(e) => setTitle(e.target.value)}
|
||||
variant="outlined"
|
||||
size="small"
|
||||
fullWidth
|
||||
/> */}
|
||||
<Typography
|
||||
style={{ margin: "0.5rem 0rem", fontWeight: "bold" }}
|
||||
variant="h6"
|
||||
>
|
||||
{" "}
|
||||
Email Confiramtion:{" "}
|
||||
</Typography>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="welcomeMsg" className="form-label">
|
||||
Welcome Message*
|
||||
</label>
|
||||
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
style={{ width: "300px" }}
|
||||
id="welcomeMsg"
|
||||
placeholder="Eg: Welcome to "
|
||||
value={welcomemsg}
|
||||
onChange={(e) => setWelcomeMsg(e.target.value)}
|
||||
/>
|
||||
<h6 style={{ fontWeight: "bold", marginTop: "1rem" }}>
|
||||
App Name : Smellika
|
||||
</h6>
|
||||
|
||||
<label htmlFor="title" className="form-label">
|
||||
Subject*
|
||||
</label>
|
||||
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="title"
|
||||
value={subject}
|
||||
onChange={(e) => setSubject(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="welcomeMsgforDes" className="form-label">
|
||||
Welcome Message for Description*
|
||||
</label>
|
||||
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
style={{ width: "300px" }}
|
||||
id="welcomeMsgforDes"
|
||||
placeholder="Eg: Welcome to "
|
||||
value={welcomemsgforDescription}
|
||||
onChange={(e) => setWelcomeMsgForDescription(e.target.value)}
|
||||
/>
|
||||
<label htmlFor="title" className="form-label">
|
||||
Description *
|
||||
</label>
|
||||
<textarea
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="description"
|
||||
rows="10"
|
||||
cols="100"
|
||||
value={description}
|
||||
placeholder="your message..."
|
||||
onChange={(e) => setDescription(e.target.value)}
|
||||
></textarea>
|
||||
</div>
|
||||
</Box>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
454
src/views/EmployeeAccess/Employee.js
Normal file
454
src/views/EmployeeAccess/Employee.js
Normal file
@ -0,0 +1,454 @@
|
||||
import React, { useState, useEffect } from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
import Button from "@material-ui/core/Button";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import axios from "axios";
|
||||
import { isAutheticated } from "src/auth";
|
||||
import swal from "sweetalert";
|
||||
import {
|
||||
Box,
|
||||
FormControl,
|
||||
IconButton,
|
||||
InputLabel,
|
||||
MenuItem,
|
||||
Select,
|
||||
TextField,
|
||||
} from "@mui/material";
|
||||
import SearchIcon from "@mui/icons-material/Search";
|
||||
import Fuse from "fuse.js";
|
||||
import { Typography } from "@material-ui/core";
|
||||
// import OrderDetails from "./orderDetails";
|
||||
const Employee = () => {
|
||||
const token = isAutheticated();
|
||||
const [query, setQuery] = useState("");
|
||||
const navigate = useNavigate();
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [loading1, setLoading1] = useState(true);
|
||||
const [success, setSuccess] = useState(true);
|
||||
const [employee, setemployee] = useState([]);
|
||||
|
||||
const [currentPage, setCurrentPage] = useState(1);
|
||||
const [itemPerPage, setItemPerPage] = useState(10);
|
||||
const [showData, setShowData] = useState(employee);
|
||||
|
||||
const handleShowEntries = (e) => {
|
||||
setCurrentPage(1);
|
||||
setItemPerPage(e.target.value);
|
||||
};
|
||||
useEffect(() => {
|
||||
const loadData = () => {
|
||||
const indexOfLastPost = currentPage * itemPerPage;
|
||||
const indexOfFirstPost = indexOfLastPost - itemPerPage;
|
||||
setShowData(employee.slice(indexOfFirstPost, indexOfLastPost));
|
||||
};
|
||||
loadData();
|
||||
}, [currentPage, itemPerPage, employee]);
|
||||
console.log(employee);
|
||||
|
||||
// const getemployee = async () => {
|
||||
// axios
|
||||
// .get(`/api/v1/admin/employee`, {
|
||||
// headers: {
|
||||
// Authorization: `Bearer ${token}`,
|
||||
// },
|
||||
// })
|
||||
// .then((res) => {
|
||||
// setemployee(res.data.employee);
|
||||
// setLoading(false);
|
||||
// })
|
||||
// .catch((error) => {
|
||||
// swal({
|
||||
// title: error,
|
||||
// text: "please login to access the resource or refresh the page ",
|
||||
// icon: "error",
|
||||
// button: "Retry",
|
||||
// dangerMode: true,
|
||||
// });
|
||||
// setLoading(false);
|
||||
// });
|
||||
// };
|
||||
|
||||
// useEffect(() => {
|
||||
// getemployee();
|
||||
// }, [success]);
|
||||
// console.log(employee);
|
||||
|
||||
// useEffect(() => {
|
||||
// const loadData = () => {
|
||||
// const indexOfLastPost = currentPage * itemPerPage;
|
||||
// const indexOfFirstPost = indexOfLastPost - itemPerPage;
|
||||
// setShowData(employee.slice(indexOfFirstPost, indexOfLastPost));
|
||||
// };
|
||||
// loadData();
|
||||
// }, [currentPage, itemPerPage, employee]);
|
||||
// console.log(employee);
|
||||
|
||||
// const handleDelete = (id) => {
|
||||
// swal({
|
||||
// title: "Are you sure?",
|
||||
// icon: "error",
|
||||
// buttons: {
|
||||
// Yes: { text: "Yes", value: true },
|
||||
// Cancel: { text: "Cancel", value: "cancel" },
|
||||
// },
|
||||
// }).then((value) => {
|
||||
// if (value === true) {
|
||||
// axios
|
||||
// .delete(`/api/user-address/deleteAddress/${id}`, {
|
||||
// headers: {
|
||||
// "Access-Control-Allow-Origin": "*",
|
||||
// Authorization: `Bearer ${token}`,
|
||||
// },
|
||||
// })
|
||||
// .then((res) => {
|
||||
// swal({
|
||||
// title: "Deleted",
|
||||
// text: "Address Deleted successfully!",
|
||||
// icon: "success",
|
||||
// button: "ok",
|
||||
// });
|
||||
// setSuccess((prev) => !prev);
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// swal({
|
||||
// title: "Warning",
|
||||
// text: "Something went wrong!",
|
||||
// icon: "error",
|
||||
// button: "Retry",
|
||||
// dangerMode: true,
|
||||
// });
|
||||
// });
|
||||
// }
|
||||
// });
|
||||
// };
|
||||
|
||||
// get All employee
|
||||
const getemployee = async () => {
|
||||
axios
|
||||
.get(`/api/v1/admin/employee`, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
setemployee(res.data.employee);
|
||||
setLoading(false);
|
||||
})
|
||||
.catch((error) => {
|
||||
swal({
|
||||
title: error,
|
||||
text: "please login to access the resource or refresh the page ",
|
||||
icon: "error",
|
||||
button: "Retry",
|
||||
dangerMode: true,
|
||||
});
|
||||
setLoading(false);
|
||||
});
|
||||
};
|
||||
useEffect(() => {
|
||||
getemployee();
|
||||
}, [success]);
|
||||
console.log(employee);
|
||||
console.log("showdata", showData);
|
||||
// const trueEntries = Object.entries(showData.).filter(
|
||||
// ([key, value]) => value === true
|
||||
// );
|
||||
const renderAccessTo = (accessTo) => {
|
||||
return Object.entries(accessTo)
|
||||
.filter(([key, value]) => value === true)
|
||||
.map(([key, value]) => key)
|
||||
.join(", ");
|
||||
};
|
||||
const handleDelete = async (id) => {
|
||||
try {
|
||||
// Send a DELETE request to your API to delete the employee by ID
|
||||
const res = await axios.delete(`/api/v1/admin/delete-employee/${id}`, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
});
|
||||
// If deletion is successful, update the employee list
|
||||
swal({
|
||||
title: "Congratulations!!",
|
||||
text: res?.data?.message,
|
||||
icon: "success",
|
||||
buttons: "OK",
|
||||
});
|
||||
setemployee(employee.filter((employee) => employee._id !== id));
|
||||
} catch (error) {
|
||||
console.error("Error deleting employee:", error);
|
||||
swal({
|
||||
title: "",
|
||||
text: "Something went wrong!",
|
||||
icon: "error",
|
||||
button: "Retry",
|
||||
dangerMode: true,
|
||||
});
|
||||
}
|
||||
};
|
||||
return (
|
||||
<div className="main-content">
|
||||
<div className="page-content">
|
||||
<div className="container-fluid">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<div
|
||||
className="
|
||||
page-title-box
|
||||
d-flex
|
||||
align-items-center
|
||||
justify-content-between
|
||||
"
|
||||
>
|
||||
<div style={{ fontSize: "22px" }} className="fw-bold">
|
||||
All Employees
|
||||
</div>
|
||||
|
||||
<div className="page-title-right">
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
style={{
|
||||
fontWeight: "bold",
|
||||
marginBottom: "1rem",
|
||||
textTransform: "capitalize",
|
||||
}}
|
||||
onClick={() => {
|
||||
navigate("/add-employee");
|
||||
}}
|
||||
>
|
||||
Add Employee
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row">
|
||||
<div className="col-lg-12">
|
||||
<div className="card">
|
||||
<div className="card-body">
|
||||
<div className="row ml-0 mr-0 mb-10 ">
|
||||
<div className="col-sm-12 col-md-12">
|
||||
<div className="dataTables_length">
|
||||
<label className="w-100">
|
||||
Show
|
||||
<select
|
||||
style={{ width: "10%" }}
|
||||
name=""
|
||||
onChange={(e) => handleShowEntries(e)}
|
||||
className="
|
||||
select-w
|
||||
custom-select custom-select-sm
|
||||
form-control form-control-sm
|
||||
"
|
||||
>
|
||||
<option value="10">10</option>
|
||||
<option value="25">25</option>
|
||||
<option value="50">50</option>
|
||||
<option value="100">100</option>
|
||||
</select>
|
||||
entries
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="table-responsive table-shoot mt-3">
|
||||
<table
|
||||
className="table table-centered table-nowrap"
|
||||
style={{ border: "1px solid" }}
|
||||
>
|
||||
<thead
|
||||
className="thead-info"
|
||||
style={{ background: "rgb(140, 213, 213)" }}
|
||||
>
|
||||
<tr>
|
||||
<th>Employee Name</th>
|
||||
<th>Email</th>
|
||||
|
||||
<th>Access to </th>
|
||||
|
||||
<th>Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{!loading && showData.length === 0 && (
|
||||
<tr className="text-center">
|
||||
<td colSpan="6">
|
||||
<h5>No Data Available</h5>
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
{loading ? (
|
||||
<tr>
|
||||
<td className="text-center" colSpan="6">
|
||||
Loading...
|
||||
</td>
|
||||
</tr>
|
||||
) : (
|
||||
showData.map((employee, i) => {
|
||||
return (
|
||||
<tr key={i}>
|
||||
<td className="text-start">{employee.name}</td>
|
||||
<td>{employee.email}</td>
|
||||
|
||||
<td
|
||||
style={{ maxWidth: "200px" }}
|
||||
className="text-start"
|
||||
>
|
||||
{renderAccessTo(employee.accessTo)}
|
||||
</td>
|
||||
|
||||
<th>
|
||||
<button
|
||||
onClick={() =>
|
||||
navigate(`/edit-employee/${employee._id}`)
|
||||
}
|
||||
style={{
|
||||
color: "white",
|
||||
marginRight: "1rem",
|
||||
}}
|
||||
type="button"
|
||||
className="
|
||||
btn btn-primary btn-sm
|
||||
waves-effect waves-light
|
||||
btn-table
|
||||
mx-1
|
||||
mt-1
|
||||
"
|
||||
>
|
||||
Edit
|
||||
</button>
|
||||
<button
|
||||
style={{
|
||||
color: "white",
|
||||
marginRight: "1rem",
|
||||
}}
|
||||
onClick={() => handleDelete(employee._id)}
|
||||
type="button"
|
||||
className="
|
||||
btn btn-primary btn-sm
|
||||
waves-effect waves-light
|
||||
btn-table
|
||||
mx-1
|
||||
mt-1
|
||||
"
|
||||
>
|
||||
Delete
|
||||
</button>
|
||||
</th>
|
||||
</tr>
|
||||
);
|
||||
})
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div className="row mt-20">
|
||||
<div className="col-sm-12 col-md-6 mb-20">
|
||||
<div
|
||||
className="dataTables_info"
|
||||
id="datatable_info"
|
||||
role="status"
|
||||
aria-live="polite"
|
||||
>
|
||||
Showing {currentPage * itemPerPage - itemPerPage + 1} to{" "}
|
||||
{Math.min(currentPage * itemPerPage, employee.length)}{" "}
|
||||
of {employee.length} entries
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-sm-12 col-md-6">
|
||||
<div className="d-flex">
|
||||
<ul className="pagination ms-auto">
|
||||
<li
|
||||
className={
|
||||
currentPage === 1
|
||||
? "paginate_button page-item previous disabled"
|
||||
: "paginate_button page-item previous"
|
||||
}
|
||||
>
|
||||
<span
|
||||
className="page-link"
|
||||
style={{ cursor: "pointer" }}
|
||||
onClick={() => setCurrentPage((prev) => prev - 1)}
|
||||
>
|
||||
Previous
|
||||
</span>
|
||||
</li>
|
||||
|
||||
{!(currentPage - 1 < 1) && (
|
||||
<li className="paginate_button page-item">
|
||||
<span
|
||||
className="page-link"
|
||||
style={{ cursor: "pointer" }}
|
||||
onClick={(e) =>
|
||||
setCurrentPage((prev) => prev - 1)
|
||||
}
|
||||
>
|
||||
{currentPage - 1}
|
||||
</span>
|
||||
</li>
|
||||
)}
|
||||
|
||||
<li className="paginate_button page-item active">
|
||||
<span
|
||||
className="page-link"
|
||||
style={{ cursor: "pointer" }}
|
||||
>
|
||||
{currentPage}
|
||||
</span>
|
||||
</li>
|
||||
|
||||
{!(
|
||||
(currentPage + 1) * itemPerPage - itemPerPage >
|
||||
employee.length - 1
|
||||
) && (
|
||||
<li className="paginate_button page-item ">
|
||||
<span
|
||||
className="page-link"
|
||||
style={{ cursor: "pointer" }}
|
||||
onClick={() => {
|
||||
setCurrentPage((prev) => prev + 1);
|
||||
}}
|
||||
>
|
||||
{currentPage + 1}
|
||||
</span>
|
||||
</li>
|
||||
)}
|
||||
|
||||
<li
|
||||
className={
|
||||
!(
|
||||
(currentPage + 1) * itemPerPage - itemPerPage >
|
||||
employee.length - 1
|
||||
)
|
||||
? "paginate_button page-item next"
|
||||
: "paginate_button page-item next disabled"
|
||||
}
|
||||
>
|
||||
<span
|
||||
className="page-link"
|
||||
style={{ cursor: "pointer" }}
|
||||
onClick={() => setCurrentPage((prev) => prev + 1)}
|
||||
>
|
||||
Next
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Employee;
|
||||
212
src/views/EmployeeAccess/addEmployee.js
Normal file
212
src/views/EmployeeAccess/addEmployee.js
Normal file
@ -0,0 +1,212 @@
|
||||
import { Box, Button, Typography } from "@mui/material";
|
||||
import React, { useState } from "react";
|
||||
import FormGroup from "@mui/material/FormGroup";
|
||||
import FormControlLabel from "@mui/material/FormControlLabel";
|
||||
import Checkbox from "@mui/material/Checkbox";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import _nav from "src/_nav";
|
||||
import toast from "react-hot-toast";
|
||||
import axios from "axios";
|
||||
|
||||
const AddEmployee = () => {
|
||||
const [employeeName, setEmployeeName] = useState("");
|
||||
const [phone, setPhone] = useState("");
|
||||
const [email, setEmail] = useState("");
|
||||
const navigate = useNavigate();
|
||||
|
||||
const filteredNav = _nav.filter((item) => item.name !== "Employee");
|
||||
const [checkedItems, setCheckedItems] = useState(
|
||||
filteredNav.reduce((acc, item) => {
|
||||
acc[item.name] = false;
|
||||
return acc;
|
||||
}, {})
|
||||
);
|
||||
|
||||
// const filteredEntries = Object.fromEntries(
|
||||
// Object.entries(checkedItems).filter(([key, value]) => value === true)
|
||||
// );
|
||||
// console.log(filteredEntries);
|
||||
const handleCheckboxChange = (name) => (event) => {
|
||||
setCheckedItems({
|
||||
...checkedItems,
|
||||
[name]: event.target.checked,
|
||||
});
|
||||
};
|
||||
|
||||
console.log(checkedItems);
|
||||
const generatePassword = (name, email) => {
|
||||
const combinedStr = (name + email).toLowerCase(); // Convert to lowercase for consistency
|
||||
const specialChars = "@#*!$%^&"; // Define the set of special characters
|
||||
const alphaChars = combinedStr.match(/[a-zA-Z]/g); // Filter out alphabetic characters
|
||||
const digitChars = combinedStr.match(/\d/g); // Filter out digits
|
||||
const filteredChars = combinedStr.match(/[^\W_]/g); // Filter out non-alphanumeric characters
|
||||
let passwordChars = alphaChars.concat(filteredChars); // Combine alphabetic and filtered characters
|
||||
|
||||
// Ensure at least one uppercase letter
|
||||
if (!passwordChars.some((char) => char === char.toUpperCase())) {
|
||||
const uppercaseChar = String.fromCharCode(
|
||||
65 + Math.floor(Math.random() * 26)
|
||||
);
|
||||
passwordChars.push(uppercaseChar);
|
||||
}
|
||||
|
||||
// Ensure at least one digit
|
||||
if (!digitChars || digitChars.length === 0) {
|
||||
const digitChar = Math.floor(Math.random() * 10).toString();
|
||||
passwordChars.push(digitChar);
|
||||
}
|
||||
|
||||
// Insert a random special character at a random position in the password characters array
|
||||
const specialChar = specialChars.charAt(
|
||||
Math.floor(Math.random() * specialChars.length)
|
||||
);
|
||||
const randomIndex = Math.floor(Math.random() * (passwordChars.length + 1));
|
||||
passwordChars.splice(randomIndex, 0, specialChar);
|
||||
|
||||
passwordChars = passwordChars.sort(() => Math.random() - 0.5); // Shuffle the characters
|
||||
// passwordString.charAt(0).toUpperCase() + passwordString.slice(1) + "@";
|
||||
const normalpassword = passwordChars.join("").slice(0, 8); // Take the first 8 characters
|
||||
const passwordWithspecialChar =
|
||||
normalpassword.charAt(0).toUpperCase() + normalpassword.slice(1) + "1@2";
|
||||
return passwordWithspecialChar;
|
||||
};
|
||||
|
||||
const handleFormSubmit = async (e) => {
|
||||
e.preventDefault();
|
||||
console.log("request made");
|
||||
try {
|
||||
if (!employeeName || !email || !phone) {
|
||||
throw new Error("Fill all fields!");
|
||||
}
|
||||
|
||||
// Generate password based on name and email
|
||||
const generatedPassword = generatePassword(employeeName, email);
|
||||
console.log(generatedPassword); // Use generatedPassword instead of generatePassword
|
||||
// Set generated password to user state
|
||||
|
||||
const response = await axios.post("/api/v1/user/register", {
|
||||
// Send user details
|
||||
name: employeeName,
|
||||
email: email,
|
||||
phone: phone,
|
||||
role: "Employee",
|
||||
accessTo: checkedItems,
|
||||
password: generatedPassword, // Send generated password to the backend
|
||||
});
|
||||
console.log(response);
|
||||
if (response.status === 201) {
|
||||
toast.success("Employee Added Successful");
|
||||
// setUserId(response.data.userId);
|
||||
navigate("/employee");
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error?.response);
|
||||
// toast.error(error?.response);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Box style={{ background: "#FFFFFF", color: "black", padding: "1rem" }}>
|
||||
<Typography
|
||||
style={{ margin: "0.5rem 0rem", fontWeight: "bold" }}
|
||||
variant="h6"
|
||||
>
|
||||
{" "}
|
||||
Add Employee:{" "}
|
||||
</Typography>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Employee Name*
|
||||
</label>
|
||||
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="title"
|
||||
placeholder="Eg: Roshan Garg"
|
||||
value={employeeName}
|
||||
onChange={(e) => setEmployeeName(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Phone Number
|
||||
</label>
|
||||
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
id="title"
|
||||
placeholder="Eg: 8516913819"
|
||||
value={phone}
|
||||
onChange={(e) => setPhone(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="welcomeMsgforDes" className="form-label">
|
||||
Email*
|
||||
</label>
|
||||
|
||||
<input
|
||||
type="email"
|
||||
className="form-control"
|
||||
id="welcomeMsgforDes"
|
||||
placeholder="Eg: roshan@gmailcom "
|
||||
value={email}
|
||||
onChange={(e) => setEmail(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
<Box>
|
||||
<label htmlFor="welcomeMsgforDes" className="form-label">
|
||||
Access to*
|
||||
</label>
|
||||
<div>
|
||||
{filteredNav.map((item, index) => (
|
||||
<div key={index}>
|
||||
<Checkbox
|
||||
checked={checkedItems[item.name] || false}
|
||||
onChange={handleCheckboxChange(item.name)}
|
||||
inputProps={{ "aria-label": "controlled" }}
|
||||
/>
|
||||
{item.name}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</Box>
|
||||
<div style={{ display: "flex" }}>
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
onClick={handleFormSubmit}
|
||||
style={{
|
||||
fontWeight: "bold",
|
||||
marginBottom: "1rem",
|
||||
textTransform: "capitalize",
|
||||
marginRight: "5px",
|
||||
}}
|
||||
>
|
||||
Save
|
||||
</Button>
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
onClick={() => navigate("/employee")}
|
||||
style={{
|
||||
fontWeight: "bold",
|
||||
marginBottom: "1rem",
|
||||
textTransform: "capitalize",
|
||||
marginRight: "5px",
|
||||
}}
|
||||
>
|
||||
Cancel
|
||||
</Button>
|
||||
</div>
|
||||
</Box>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default AddEmployee;
|
||||
154
src/views/EmployeeAccess/editEmployee.js
Normal file
154
src/views/EmployeeAccess/editEmployee.js
Normal file
@ -0,0 +1,154 @@
|
||||
import React, { useState, useEffect } from "react";
|
||||
import axios from "axios";
|
||||
import { useNavigate, useParams } from "react-router-dom";
|
||||
import { Box, Button, Typography } from "@mui/material";
|
||||
import Checkbox from "@mui/material/Checkbox";
|
||||
import _nav from "src/_nav";
|
||||
import { isAutheticated } from "src/auth";
|
||||
|
||||
const EditEmployee = () => {
|
||||
const { id } = useParams();
|
||||
const token = isAutheticated();
|
||||
const navigate = useNavigate();
|
||||
|
||||
const [employeeName, setEmployeeName] = useState("");
|
||||
const [phone, setPhone] = useState("");
|
||||
const [checkedItems, setCheckedItems] = useState({});
|
||||
const filteredNav = _nav.filter((item) => item.name !== "Employee");
|
||||
|
||||
const handleCheckboxChange = (name) => (event) => {
|
||||
setCheckedItems({
|
||||
...checkedItems,
|
||||
[name]: event.target.checked,
|
||||
});
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
const getSingleEmployee = async () => {
|
||||
try {
|
||||
const response = await axios.get(`/api/v1/admin/user/${id}`, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
});
|
||||
const { name, phone, accessTo } = response.data.user;
|
||||
setEmployeeName(name);
|
||||
setPhone(phone);
|
||||
setCheckedItems(accessTo);
|
||||
} catch (error) {
|
||||
console.error("Error fetching employee:", error);
|
||||
}
|
||||
};
|
||||
|
||||
getSingleEmployee();
|
||||
}, [id, token]);
|
||||
|
||||
const handleUpdateEmployee = async () => {
|
||||
try {
|
||||
await axios.put(
|
||||
`/api/v1/admin/update-employee/${id}`,
|
||||
{
|
||||
name: employeeName,
|
||||
phone: phone,
|
||||
accessTo: checkedItems,
|
||||
},
|
||||
{
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
}
|
||||
);
|
||||
navigate("/employee");
|
||||
} catch (error) {
|
||||
console.error("Error updating employee:", error);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Box style={{ background: "#FFFFFF", color: "black", padding: "1rem" }}>
|
||||
<Typography
|
||||
style={{ margin: "0.5rem 0rem", fontWeight: "bold" }}
|
||||
variant="h6"
|
||||
>
|
||||
Update Employee
|
||||
</Typography>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="title" className="form-label">
|
||||
Employee Name*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
placeholder="Enter employee name"
|
||||
value={employeeName}
|
||||
onChange={(e) => setEmployeeName(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mb-3">
|
||||
<label htmlFor="phone" className="form-label">
|
||||
Phone Number
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="form-control"
|
||||
placeholder="Enter phone number"
|
||||
value={phone}
|
||||
onChange={(e) => setPhone(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Box>
|
||||
<label htmlFor="accessTo" className="form-label">
|
||||
Access to*
|
||||
</label>
|
||||
<div>
|
||||
{filteredNav.map((item, index) => (
|
||||
<div key={index}>
|
||||
<Checkbox
|
||||
checked={checkedItems[item.name] || false}
|
||||
onChange={handleCheckboxChange(item.name)}
|
||||
inputProps={{ "aria-label": "controlled" }}
|
||||
/>
|
||||
{item.name}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</Box>
|
||||
|
||||
<div style={{ display: "flex" }}>
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
onClick={handleUpdateEmployee}
|
||||
style={{
|
||||
fontWeight: "bold",
|
||||
marginBottom: "1rem",
|
||||
textTransform: "capitalize",
|
||||
marginRight: "5px",
|
||||
}}
|
||||
>
|
||||
Update Employee
|
||||
</Button>
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
onClick={() => navigate("/employee")}
|
||||
style={{
|
||||
fontWeight: "bold",
|
||||
marginBottom: "1rem",
|
||||
textTransform: "capitalize",
|
||||
marginRight: "5px",
|
||||
}}
|
||||
>
|
||||
Cancel
|
||||
</Button>
|
||||
</div>
|
||||
</Box>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default EditEmployee;
|
||||
77
src/views/PointOfSale/AddressSelectionModal.js
Normal file
77
src/views/PointOfSale/AddressSelectionModal.js
Normal file
@ -0,0 +1,77 @@
|
||||
import React from "react";
|
||||
import Modal from "react-modal";
|
||||
|
||||
const AddressSelectionModal = ({ isOpen, onClose, addresses, onSelect }) => {
|
||||
const modalStyle = {
|
||||
overlay: {
|
||||
backgroundColor: "rgba(0, 0, 0, 0.5)",
|
||||
},
|
||||
content: {
|
||||
top: "50%",
|
||||
left: "50%",
|
||||
right: "auto",
|
||||
bottom: "auto",
|
||||
marginRight: "-50%",
|
||||
transform: "translate(-50%, -50%)",
|
||||
maxWidth: "800px",
|
||||
width: "90%",
|
||||
},
|
||||
};
|
||||
|
||||
const tableStyle = {
|
||||
width: "100%",
|
||||
borderCollapse: "collapse",
|
||||
};
|
||||
|
||||
const thTdStyle = {
|
||||
border: "1px solid #ddd",
|
||||
padding: "8px",
|
||||
};
|
||||
|
||||
const thStyle = {
|
||||
...thTdStyle,
|
||||
backgroundColor: "#f2f2f2",
|
||||
};
|
||||
// console.log(addresses);
|
||||
return (
|
||||
<Modal isOpen={isOpen} onRequestClose={onClose} style={modalStyle}>
|
||||
<h2>Select Address</h2>
|
||||
<table style={tableStyle}>
|
||||
<thead>
|
||||
<tr>
|
||||
<th style={thStyle}>First Name</th>
|
||||
<th style={thStyle}>Last Name</th>
|
||||
<th style={thStyle}>Phone Number</th>
|
||||
<th style={thStyle}>Street</th>
|
||||
<th style={thStyle}>City</th>
|
||||
<th style={thStyle}>Postal Code</th>
|
||||
<th style={thStyle}>State</th>
|
||||
{/* Add additional columns as needed */}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{addresses.map((address, index) => (
|
||||
<tr
|
||||
key={index}
|
||||
onClick={() => onSelect(address)}
|
||||
style={{ cursor: "pointer", ...thTdStyle }}
|
||||
>
|
||||
<td>{address.first_Name}</td>
|
||||
<td>{address.last_Name}</td>
|
||||
<td>{address.phone_Number}</td>
|
||||
<td>{address.street}</td>
|
||||
<td>{address.city}</td>
|
||||
<td>{address.postalCode}</td>
|
||||
<td>{address.state}</td>
|
||||
{/* Add additional columns as needed */}
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
<button onClick={onClose}>Close</button>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
export default AddressSelectionModal;
|
||||
|
||||
1242
src/views/PointOfSale/Pos.js
Normal file
1242
src/views/PointOfSale/Pos.js
Normal file
File diff suppressed because it is too large
Load Diff
@ -33,7 +33,7 @@ const Dashboard = () => {
|
||||
//3rd
|
||||
const [product, setProduct] = useState([]);
|
||||
const getAllProduct = async () => {
|
||||
let res = await axios.get(`/api/product/getAll/`, {
|
||||
let res = await axios.get(`/api/product/getAll/user/`, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
|
||||
73
src/views/exportExcel.js
Normal file
73
src/views/exportExcel.js
Normal file
@ -0,0 +1,73 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import * as XLSX from "xlsx";
|
||||
import { saveAs } from "file-saver";
|
||||
import { isAutheticated } from "src/auth";
|
||||
import axios from "axios";
|
||||
|
||||
function ExportToExcel() {
|
||||
const token = isAutheticated();
|
||||
const [newOrdersData, setNewOrdersData] = useState([]);
|
||||
|
||||
const data = [
|
||||
{ name: "John", email: "john@example.com", age: 28 },
|
||||
{ name: "Jane", email: "jane@example.com", age: 32 },
|
||||
// ... more data
|
||||
];
|
||||
useEffect(() => {
|
||||
function getNewOrder() {
|
||||
axios
|
||||
.get(`/api/order/getAll/new`, {
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
const filteredOrders = res.data.order.filter(
|
||||
(order) => order.orderType === "WebSite"
|
||||
);
|
||||
|
||||
setNewOrdersData(filteredOrders);
|
||||
// setLoading(false);
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
// setLoading(false);
|
||||
});
|
||||
}
|
||||
getNewOrder();
|
||||
}, []);
|
||||
|
||||
const exportToExcel = () => {
|
||||
const flattenedData = newOrdersData.map((order) => ({
|
||||
...order,
|
||||
// Flatten shippingInfo object
|
||||
shippingInfo: JSON.stringify(order.shippingInfo),
|
||||
// Concatenate item names into a single string
|
||||
items: order.items.map((item) => item.name).join(", "),
|
||||
}));
|
||||
|
||||
const worksheet = XLSX.utils.json_to_sheet(flattenedData);
|
||||
const workbook = XLSX.utils.book_new();
|
||||
XLSX.utils.book_append_sheet(workbook, worksheet, "Sheet1");
|
||||
|
||||
const excelBuffer = XLSX.write(workbook, {
|
||||
bookType: "xlsx",
|
||||
type: "array",
|
||||
});
|
||||
const blob = new Blob([excelBuffer], {
|
||||
type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8",
|
||||
});
|
||||
|
||||
saveAs(blob, "exportedData.xlsx");
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="App">
|
||||
<button onClick={exportToExcel}>Export as Excel</button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default ExportToExcel;
|
||||
File diff suppressed because it is too large
Load Diff
@ -93,7 +93,7 @@ function EditOrder() {
|
||||
function getProductDetails() {
|
||||
setLoading(true);
|
||||
axios
|
||||
.get(`/api/product/getAll/`, {
|
||||
.get(`/api/product/getAll/admin`, {
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
Authorization: `Bearer ${token}`,
|
||||
|
||||
386
src/views/orders/InStoreCashOrders.js
Normal file
386
src/views/orders/InStoreCashOrders.js
Normal file
@ -0,0 +1,386 @@
|
||||
import React, { useState, useEffect } from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
import axios from "axios";
|
||||
|
||||
import { isAutheticated } from "src/auth";
|
||||
import Button from "@material-ui/core/Button";
|
||||
|
||||
function InStoreCashOrders() {
|
||||
const token = isAutheticated();
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [success, setSuccess] = useState(true);
|
||||
const [newOrdersData, setNewOrdersData] = useState([]);
|
||||
console.log(newOrdersData);
|
||||
|
||||
const [currentPage, setCurrentPage] = useState(1);
|
||||
const [itemPerPage, setItemPerPage] = useState(10);
|
||||
const [showData, setShowData] = useState(newOrdersData);
|
||||
|
||||
const handleShowEntries = (e) => {
|
||||
setCurrentPage(1);
|
||||
setItemPerPage(e.target.value);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
function getNewOrder() {
|
||||
axios
|
||||
.get(`/api/order/getAll/new`, {
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
const filteredOrders = res.data.order.filter(
|
||||
(order) => order.orderType === "PointOfSale" && order.paymentMode === "cod"
|
||||
);
|
||||
|
||||
// Set the filtered orders data
|
||||
setNewOrdersData(filteredOrders);
|
||||
setLoading(false);
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
setLoading(false);
|
||||
});
|
||||
}
|
||||
getNewOrder();
|
||||
}, [success]);
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
const loadData = () => {
|
||||
const indexOfLastPost = currentPage * itemPerPage;
|
||||
const indexOfFirstPost = indexOfLastPost - itemPerPage;
|
||||
setShowData(newOrdersData.slice(indexOfFirstPost, indexOfLastPost));
|
||||
};
|
||||
loadData();
|
||||
}, [currentPage, itemPerPage, newOrdersData]);
|
||||
|
||||
const handleDelete = (id) => {
|
||||
console.log(id);
|
||||
swal({
|
||||
title: "Are you sure?",
|
||||
icon: "error",
|
||||
buttons: {
|
||||
Yes: { text: "Yes", value: true },
|
||||
Cancel: { text: "Cancel", value: "cancel" },
|
||||
},
|
||||
}).then((value) => {
|
||||
if (value === true) {
|
||||
axios
|
||||
.delete(`/api/order/delete/${id}`, {
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
setSuccess((prev) => !prev);
|
||||
})
|
||||
.catch((err) => {
|
||||
swal({
|
||||
title: "Warning",
|
||||
text: err.response.data.message
|
||||
? err.response.data.message
|
||||
: "Something went wrong!",
|
||||
icon: "error",
|
||||
button: "Retry",
|
||||
dangerMode: true,
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="main-content">
|
||||
<div className="page-content">
|
||||
<div className="container-fluid">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<div
|
||||
className="
|
||||
page-title-box
|
||||
d-flex
|
||||
align-items-center
|
||||
justify-content-between
|
||||
"
|
||||
>
|
||||
<div style={{ fontSize: "22px" }} className="fw-bold">
|
||||
New Orders
|
||||
</div>
|
||||
|
||||
{/* <div className="page-title-right">
|
||||
<Link to="/order/add">
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
style={{
|
||||
fontWeight: "bold",
|
||||
marginBottom: "1rem",
|
||||
textTransform: "capitalize",
|
||||
}}
|
||||
>
|
||||
Add Order
|
||||
</Button>
|
||||
</Link>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-lg-12">
|
||||
<div className="card">
|
||||
<div className="card-body">
|
||||
<div className="row ml-0 mr-0 mb-10">
|
||||
<div className="col-sm-12 col-md-12">
|
||||
<div className="dataTables_length">
|
||||
<label className="w-100">
|
||||
Show
|
||||
<select
|
||||
style={{ width: "10%" }}
|
||||
name=""
|
||||
onChange={(e) => handleShowEntries(e)}
|
||||
className="
|
||||
select-w
|
||||
custom-select custom-select-sm
|
||||
form-control form-control-sm
|
||||
"
|
||||
>
|
||||
<option value="10">10</option>
|
||||
<option value="25">25</option>
|
||||
<option value="50">50</option>
|
||||
<option value="100">100</option>
|
||||
</select>
|
||||
entries
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="table-responsive table-shoot mt-3">
|
||||
<table
|
||||
className="table table-centered table-nowrap"
|
||||
style={{ border: "1px solid" }}
|
||||
>
|
||||
<thead
|
||||
className="thead"
|
||||
style={{ background: "rgb(140, 213, 213)" }}
|
||||
>
|
||||
<tr>
|
||||
<th className="text-start">Order ID</th>
|
||||
<th className="text-start">Customer</th>
|
||||
<th className="text-start">Order value</th>
|
||||
<th className="text-start">Order At</th>
|
||||
<th className="text-start">Status</th>
|
||||
<th className="text-start">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{!loading && showData.length === 0 && (
|
||||
<tr className="text-center">
|
||||
<td colSpan="6">
|
||||
<h5>No Data Available</h5>
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
{loading ? (
|
||||
<tr>
|
||||
<td className="text-center" colSpan="6">
|
||||
Loading...
|
||||
</td>
|
||||
</tr>
|
||||
) : (
|
||||
showData.map((order, i) => {
|
||||
return (
|
||||
<tr key={i}>
|
||||
<td className="text-start">{order?.orderID}</td>
|
||||
<td className="text-start">
|
||||
{order?.user?.name}
|
||||
</td>
|
||||
<td className="text-start">
|
||||
₹{order?.total_amount}
|
||||
</td>
|
||||
<td className="text-start">
|
||||
{new Date(order?.createdAt).toLocaleString(
|
||||
"en-IN",
|
||||
{
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
hour: "2-digit",
|
||||
minute: "numeric",
|
||||
hour12: true,
|
||||
}
|
||||
)}
|
||||
</td>
|
||||
<td className="text-start">
|
||||
<span className="badge text-bg-primary text-white">
|
||||
{order?.orderStatus}
|
||||
</span>
|
||||
</td>
|
||||
<td className="text-start">
|
||||
{/* <Link to={`/orders/${order.orderStatus}/${order._id}`}> */}
|
||||
<Link
|
||||
to={`/inStoreOrders/${order.orderStatus}/${order._id}`}
|
||||
>
|
||||
<button
|
||||
style={{ color: "white" }}
|
||||
type="button"
|
||||
className="
|
||||
btn btn-primary btn-sm
|
||||
waves-effect waves-light
|
||||
btn-table
|
||||
ms-2 mt-1
|
||||
"
|
||||
>
|
||||
View
|
||||
</button>
|
||||
</Link>
|
||||
{/* <Link to={`/orders/edit/${order._id}`}>
|
||||
<button
|
||||
style={{ color: "white" }}
|
||||
type="button"
|
||||
className="
|
||||
btn btn-info btn-sm
|
||||
waves-effect waves-light
|
||||
btn-table
|
||||
ms-2 mt-1
|
||||
"
|
||||
>
|
||||
Edit
|
||||
</button>
|
||||
</Link> */}
|
||||
|
||||
{/* <button
|
||||
style={{ color: "white" }}
|
||||
type="button"
|
||||
className="
|
||||
btn btn-danger btn-sm
|
||||
waves-effect waves-light
|
||||
btn-table
|
||||
ms-2 mt-1
|
||||
"
|
||||
onClick={() => handleDelete(order._id)}
|
||||
>
|
||||
Delete
|
||||
</button> */}
|
||||
</td>
|
||||
</tr>
|
||||
);
|
||||
})
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div className="row mt-20">
|
||||
<div className="col-sm-12 col-md-6 mb-20">
|
||||
<div
|
||||
className="dataTables_info"
|
||||
id="datatable_info"
|
||||
role="status"
|
||||
aria-live="polite"
|
||||
>
|
||||
Showing {currentPage * itemPerPage - itemPerPage + 1} to{" "}
|
||||
{Math.min(
|
||||
currentPage * itemPerPage,
|
||||
newOrdersData.length
|
||||
)}{" "}
|
||||
of {newOrdersData.length} entries
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-sm-12 col-md-6">
|
||||
<div className="d-flex">
|
||||
<ul className="pagination ms-auto">
|
||||
<li
|
||||
className={
|
||||
currentPage === 1
|
||||
? "paginate_button page-item previous disabled"
|
||||
: "paginate_button page-item previous"
|
||||
}
|
||||
>
|
||||
<span
|
||||
className="page-link"
|
||||
style={{ cursor: "pointer" }}
|
||||
onClick={() => setCurrentPage((prev) => prev - 1)}
|
||||
>
|
||||
Previous
|
||||
</span>
|
||||
</li>
|
||||
|
||||
{!(currentPage - 1 < 1) && (
|
||||
<li className="paginate_button page-item">
|
||||
<span
|
||||
className="page-link"
|
||||
style={{ cursor: "pointer" }}
|
||||
onClick={(e) =>
|
||||
setCurrentPage((prev) => prev - 1)
|
||||
}
|
||||
>
|
||||
{currentPage - 1}
|
||||
</span>
|
||||
</li>
|
||||
)}
|
||||
|
||||
<li className="paginate_button page-item active">
|
||||
<span
|
||||
className="page-link"
|
||||
style={{ cursor: "pointer" }}
|
||||
>
|
||||
{currentPage}
|
||||
</span>
|
||||
</li>
|
||||
|
||||
{!(
|
||||
(currentPage + 1) * itemPerPage - itemPerPage >
|
||||
newOrdersData.length - 1
|
||||
) && (
|
||||
<li className="paginate_button page-item ">
|
||||
<span
|
||||
className="page-link"
|
||||
style={{ cursor: "pointer" }}
|
||||
onClick={() => {
|
||||
setCurrentPage((prev) => prev + 1);
|
||||
}}
|
||||
>
|
||||
{currentPage + 1}
|
||||
</span>
|
||||
</li>
|
||||
)}
|
||||
|
||||
<li
|
||||
className={
|
||||
!(
|
||||
(currentPage + 1) * itemPerPage - itemPerPage >
|
||||
newOrdersData.length - 1
|
||||
)
|
||||
? "paginate_button page-item next"
|
||||
: "paginate_button page-item next disabled"
|
||||
}
|
||||
>
|
||||
<span
|
||||
className="page-link"
|
||||
style={{ cursor: "pointer" }}
|
||||
onClick={() => setCurrentPage((prev) => prev + 1)}
|
||||
>
|
||||
Next
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default InStoreCashOrders;
|
||||
386
src/views/orders/InStoreQRCodeOrders.js
Normal file
386
src/views/orders/InStoreQRCodeOrders.js
Normal file
@ -0,0 +1,386 @@
|
||||
import React, { useState, useEffect } from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
import axios from "axios";
|
||||
|
||||
import { isAutheticated } from "src/auth";
|
||||
import Button from "@material-ui/core/Button";
|
||||
|
||||
function InStoreQRCodeOrders() {
|
||||
const token = isAutheticated();
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [success, setSuccess] = useState(true);
|
||||
const [newOrdersData, setNewOrdersData] = useState([]);
|
||||
console.log(newOrdersData);
|
||||
|
||||
const [currentPage, setCurrentPage] = useState(1);
|
||||
const [itemPerPage, setItemPerPage] = useState(10);
|
||||
const [showData, setShowData] = useState(newOrdersData);
|
||||
|
||||
const handleShowEntries = (e) => {
|
||||
setCurrentPage(1);
|
||||
setItemPerPage(e.target.value);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
function getNewOrder() {
|
||||
axios
|
||||
.get(`/api/order/getAll/new`, {
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
const filteredOrders = res.data.order.filter(
|
||||
(order) => order.orderType === "PointOfSale" && order.paymentMode === "online"
|
||||
);
|
||||
|
||||
// Set the filtered orders data
|
||||
setNewOrdersData(filteredOrders);
|
||||
setLoading(false);
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
setLoading(false);
|
||||
});
|
||||
}
|
||||
getNewOrder();
|
||||
}, [success]);
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
const loadData = () => {
|
||||
const indexOfLastPost = currentPage * itemPerPage;
|
||||
const indexOfFirstPost = indexOfLastPost - itemPerPage;
|
||||
setShowData(newOrdersData.slice(indexOfFirstPost, indexOfLastPost));
|
||||
};
|
||||
loadData();
|
||||
}, [currentPage, itemPerPage, newOrdersData]);
|
||||
|
||||
const handleDelete = (id) => {
|
||||
console.log(id);
|
||||
swal({
|
||||
title: "Are you sure?",
|
||||
icon: "error",
|
||||
buttons: {
|
||||
Yes: { text: "Yes", value: true },
|
||||
Cancel: { text: "Cancel", value: "cancel" },
|
||||
},
|
||||
}).then((value) => {
|
||||
if (value === true) {
|
||||
axios
|
||||
.delete(`/api/order/delete/${id}`, {
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
setSuccess((prev) => !prev);
|
||||
})
|
||||
.catch((err) => {
|
||||
swal({
|
||||
title: "Warning",
|
||||
text: err.response.data.message
|
||||
? err.response.data.message
|
||||
: "Something went wrong!",
|
||||
icon: "error",
|
||||
button: "Retry",
|
||||
dangerMode: true,
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="main-content">
|
||||
<div className="page-content">
|
||||
<div className="container-fluid">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<div
|
||||
className="
|
||||
page-title-box
|
||||
d-flex
|
||||
align-items-center
|
||||
justify-content-between
|
||||
"
|
||||
>
|
||||
<div style={{ fontSize: "22px" }} className="fw-bold">
|
||||
New Orders
|
||||
</div>
|
||||
|
||||
{/* <div className="page-title-right">
|
||||
<Link to="/order/add">
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
style={{
|
||||
fontWeight: "bold",
|
||||
marginBottom: "1rem",
|
||||
textTransform: "capitalize",
|
||||
}}
|
||||
>
|
||||
Add Order
|
||||
</Button>
|
||||
</Link>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-lg-12">
|
||||
<div className="card">
|
||||
<div className="card-body">
|
||||
<div className="row ml-0 mr-0 mb-10">
|
||||
<div className="col-sm-12 col-md-12">
|
||||
<div className="dataTables_length">
|
||||
<label className="w-100">
|
||||
Show
|
||||
<select
|
||||
style={{ width: "10%" }}
|
||||
name=""
|
||||
onChange={(e) => handleShowEntries(e)}
|
||||
className="
|
||||
select-w
|
||||
custom-select custom-select-sm
|
||||
form-control form-control-sm
|
||||
"
|
||||
>
|
||||
<option value="10">10</option>
|
||||
<option value="25">25</option>
|
||||
<option value="50">50</option>
|
||||
<option value="100">100</option>
|
||||
</select>
|
||||
entries
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="table-responsive table-shoot mt-3">
|
||||
<table
|
||||
className="table table-centered table-nowrap"
|
||||
style={{ border: "1px solid" }}
|
||||
>
|
||||
<thead
|
||||
className="thead"
|
||||
style={{ background: "rgb(140, 213, 213)" }}
|
||||
>
|
||||
<tr>
|
||||
<th className="text-start">Order ID</th>
|
||||
<th className="text-start">Customer</th>
|
||||
<th className="text-start">Order value</th>
|
||||
<th className="text-start">Order At</th>
|
||||
<th className="text-start">Status</th>
|
||||
<th className="text-start">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{!loading && showData.length === 0 && (
|
||||
<tr className="text-center">
|
||||
<td colSpan="6">
|
||||
<h5>No Data Available</h5>
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
{loading ? (
|
||||
<tr>
|
||||
<td className="text-center" colSpan="6">
|
||||
Loading...
|
||||
</td>
|
||||
</tr>
|
||||
) : (
|
||||
showData.map((order, i) => {
|
||||
return (
|
||||
<tr key={i}>
|
||||
<td className="text-start">{order?.orderID}</td>
|
||||
<td className="text-start">
|
||||
{order?.user?.name}
|
||||
</td>
|
||||
<td className="text-start">
|
||||
₹{order?.total_amount}
|
||||
</td>
|
||||
<td className="text-start">
|
||||
{new Date(order?.createdAt).toLocaleString(
|
||||
"en-IN",
|
||||
{
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
hour: "2-digit",
|
||||
minute: "numeric",
|
||||
hour12: true,
|
||||
}
|
||||
)}
|
||||
</td>
|
||||
<td className="text-start">
|
||||
<span className="badge text-bg-primary text-white">
|
||||
{order?.orderStatus}
|
||||
</span>
|
||||
</td>
|
||||
<td className="text-start">
|
||||
{/* <Link to={`/orders/${order.orderStatus}/${order._id}`}> */}
|
||||
<Link
|
||||
to={`/inStoreOrders/${order.orderStatus}/${order._id}`}
|
||||
>
|
||||
<button
|
||||
style={{ color: "white" }}
|
||||
type="button"
|
||||
className="
|
||||
btn btn-primary btn-sm
|
||||
waves-effect waves-light
|
||||
btn-table
|
||||
ms-2 mt-1
|
||||
"
|
||||
>
|
||||
View
|
||||
</button>
|
||||
</Link>
|
||||
{/* <Link to={`/orders/edit/${order._id}`}>
|
||||
<button
|
||||
style={{ color: "white" }}
|
||||
type="button"
|
||||
className="
|
||||
btn btn-info btn-sm
|
||||
waves-effect waves-light
|
||||
btn-table
|
||||
ms-2 mt-1
|
||||
"
|
||||
>
|
||||
Edit
|
||||
</button>
|
||||
</Link> */}
|
||||
|
||||
{/* <button
|
||||
style={{ color: "white" }}
|
||||
type="button"
|
||||
className="
|
||||
btn btn-danger btn-sm
|
||||
waves-effect waves-light
|
||||
btn-table
|
||||
ms-2 mt-1
|
||||
"
|
||||
onClick={() => handleDelete(order._id)}
|
||||
>
|
||||
Delete
|
||||
</button> */}
|
||||
</td>
|
||||
</tr>
|
||||
);
|
||||
})
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div className="row mt-20">
|
||||
<div className="col-sm-12 col-md-6 mb-20">
|
||||
<div
|
||||
className="dataTables_info"
|
||||
id="datatable_info"
|
||||
role="status"
|
||||
aria-live="polite"
|
||||
>
|
||||
Showing {currentPage * itemPerPage - itemPerPage + 1} to{" "}
|
||||
{Math.min(
|
||||
currentPage * itemPerPage,
|
||||
newOrdersData.length
|
||||
)}{" "}
|
||||
of {newOrdersData.length} entries
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-sm-12 col-md-6">
|
||||
<div className="d-flex">
|
||||
<ul className="pagination ms-auto">
|
||||
<li
|
||||
className={
|
||||
currentPage === 1
|
||||
? "paginate_button page-item previous disabled"
|
||||
: "paginate_button page-item previous"
|
||||
}
|
||||
>
|
||||
<span
|
||||
className="page-link"
|
||||
style={{ cursor: "pointer" }}
|
||||
onClick={() => setCurrentPage((prev) => prev - 1)}
|
||||
>
|
||||
Previous
|
||||
</span>
|
||||
</li>
|
||||
|
||||
{!(currentPage - 1 < 1) && (
|
||||
<li className="paginate_button page-item">
|
||||
<span
|
||||
className="page-link"
|
||||
style={{ cursor: "pointer" }}
|
||||
onClick={(e) =>
|
||||
setCurrentPage((prev) => prev - 1)
|
||||
}
|
||||
>
|
||||
{currentPage - 1}
|
||||
</span>
|
||||
</li>
|
||||
)}
|
||||
|
||||
<li className="paginate_button page-item active">
|
||||
<span
|
||||
className="page-link"
|
||||
style={{ cursor: "pointer" }}
|
||||
>
|
||||
{currentPage}
|
||||
</span>
|
||||
</li>
|
||||
|
||||
{!(
|
||||
(currentPage + 1) * itemPerPage - itemPerPage >
|
||||
newOrdersData.length - 1
|
||||
) && (
|
||||
<li className="paginate_button page-item ">
|
||||
<span
|
||||
className="page-link"
|
||||
style={{ cursor: "pointer" }}
|
||||
onClick={() => {
|
||||
setCurrentPage((prev) => prev + 1);
|
||||
}}
|
||||
>
|
||||
{currentPage + 1}
|
||||
</span>
|
||||
</li>
|
||||
)}
|
||||
|
||||
<li
|
||||
className={
|
||||
!(
|
||||
(currentPage + 1) * itemPerPage - itemPerPage >
|
||||
newOrdersData.length - 1
|
||||
)
|
||||
? "paginate_button page-item next"
|
||||
: "paginate_button page-item next disabled"
|
||||
}
|
||||
>
|
||||
<span
|
||||
className="page-link"
|
||||
style={{ cursor: "pointer" }}
|
||||
onClick={() => setCurrentPage((prev) => prev + 1)}
|
||||
>
|
||||
Next
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default InStoreQRCodeOrders;
|
||||
@ -4,13 +4,19 @@ import axios from "axios";
|
||||
|
||||
import { isAutheticated } from "src/auth";
|
||||
import Button from "@material-ui/core/Button";
|
||||
import { cilSearch } from "@coreui/icons";
|
||||
import CIcon from "@coreui/icons-react";
|
||||
import { TextField, FormControl, Select, MenuItem } from "@material-ui/core";
|
||||
import { Typography } from "@material-ui/core";
|
||||
import DatePicker from "react-datepicker";
|
||||
import "react-datepicker/dist/react-datepicker.css";
|
||||
|
||||
function NewOrders() {
|
||||
const token = isAutheticated();
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [success, setSuccess] = useState(true);
|
||||
const [newOrdersData, setNewOrdersData] = useState([]);
|
||||
console.log(newOrdersData);
|
||||
// console.log(newOrdersData);
|
||||
|
||||
const [currentPage, setCurrentPage] = useState(1);
|
||||
const [itemPerPage, setItemPerPage] = useState(10);
|
||||
@ -21,7 +27,6 @@ function NewOrders() {
|
||||
setItemPerPage(e.target.value);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
function getNewOrder() {
|
||||
axios
|
||||
.get(`/api/order/getAll/new`, {
|
||||
@ -31,7 +36,11 @@ function NewOrders() {
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
setNewOrdersData(res.data.order);
|
||||
const filteredOrders = res.data.order.filter(
|
||||
(order) => order.orderType === "WebSite"
|
||||
);
|
||||
|
||||
setNewOrdersData(filteredOrders);
|
||||
setLoading(false);
|
||||
})
|
||||
.catch((err) => {
|
||||
@ -39,17 +48,10 @@ function NewOrders() {
|
||||
setLoading(false);
|
||||
});
|
||||
}
|
||||
getNewOrder();
|
||||
}, [success]);
|
||||
|
||||
useEffect(() => {
|
||||
const loadData = () => {
|
||||
const indexOfLastPost = currentPage * itemPerPage;
|
||||
const indexOfFirstPost = indexOfLastPost - itemPerPage;
|
||||
setShowData(newOrdersData.slice(indexOfFirstPost, indexOfLastPost));
|
||||
};
|
||||
loadData();
|
||||
}, [currentPage, itemPerPage, newOrdersData]);
|
||||
setLoading(true);
|
||||
getNewOrder();
|
||||
}, [token]);
|
||||
|
||||
const handleDelete = (id) => {
|
||||
console.log(id);
|
||||
@ -86,7 +88,94 @@ function NewOrders() {
|
||||
}
|
||||
});
|
||||
};
|
||||
const [searchTerm, setSearchTerm] = useState("");
|
||||
const [searchValue, setsearchValue] = useState("orderId");
|
||||
const handleChange = (event) => {
|
||||
const { name, value } = event.target;
|
||||
if (name === "Search") {
|
||||
setsearchValue(value);
|
||||
}
|
||||
};
|
||||
const formatDate = (dateString) => {
|
||||
const dateArray = dateString.split(" ");
|
||||
const day = dateArray[0];
|
||||
const month = dateArray[1];
|
||||
const year = dateArray[2];
|
||||
const monthNumber = new Date(Date.parse(`${month} 1, 2022`)).getMonth() + 1;
|
||||
return `${year}-${
|
||||
monthNumber < 10 ? "0" + monthNumber : monthNumber
|
||||
}-${day}`;
|
||||
};
|
||||
// const formatDate = (date) => {
|
||||
// const day = ("0" + date.getDate()).slice(-2);
|
||||
// const month = ("0" + (date.getMonth() + 1)).slice(-2);
|
||||
// const year = date.getFullYear();
|
||||
// return `${year}-${month}-${day}`;
|
||||
// };
|
||||
console.log(searchTerm);
|
||||
useEffect(() => {
|
||||
setTimeout(() => {
|
||||
if (searchTerm !== "") {
|
||||
let searchedResult = [];
|
||||
if (searchValue === "orderId") {
|
||||
searchedResult = newOrdersData.filter((item) =>
|
||||
item.orderID.toString().includes(searchTerm)
|
||||
);
|
||||
} else if (searchValue === "Name") {
|
||||
searchedResult = newOrdersData.filter((item) =>
|
||||
item.user?.name
|
||||
.toString()
|
||||
.toLowerCase()
|
||||
.includes(searchTerm.toLowerCase())
|
||||
);
|
||||
} else if (searchValue === "City") {
|
||||
searchedResult = newOrdersData.filter((item) =>
|
||||
item.shippingInfo.city
|
||||
.toString()
|
||||
.toLowerCase()
|
||||
.includes(searchTerm.toLowerCase())
|
||||
);
|
||||
} else if (searchValue === "Amount") {
|
||||
searchedResult = newOrdersData.filter((item) =>
|
||||
item.total_amount.toString().includes(searchTerm)
|
||||
);
|
||||
} else if (searchValue === "OrderDate") {
|
||||
// Format input date
|
||||
const formattedDate = formatDate(searchTerm);
|
||||
|
||||
searchedResult = newOrdersData.filter((item) =>
|
||||
item.createdAt.includes(formattedDate)
|
||||
);
|
||||
} else if (searchValue === "ProductName") {
|
||||
searchedResult = newOrdersData.filter((order) =>
|
||||
order.orderItems.some((item) =>
|
||||
item.name
|
||||
.toString()
|
||||
.toLowerCase()
|
||||
.includes(searchTerm.toLowerCase())
|
||||
)
|
||||
);
|
||||
} else if (searchValue === "MobileNumber") {
|
||||
searchedResult = newOrdersData.filter((item) =>
|
||||
item.shippingInfo.phone_Number.toString().includes(searchTerm)
|
||||
);
|
||||
}
|
||||
|
||||
setShowData(searchedResult);
|
||||
} else {
|
||||
getNewOrder();
|
||||
}
|
||||
}, 100);
|
||||
}, [searchTerm, searchValue, newOrdersData]);
|
||||
|
||||
useEffect(() => {
|
||||
const loadData = () => {
|
||||
const indexOfLastPost = currentPage * itemPerPage;
|
||||
const indexOfFirstPost = indexOfLastPost - itemPerPage;
|
||||
setShowData(newOrdersData.slice(indexOfFirstPost, indexOfLastPost));
|
||||
};
|
||||
loadData();
|
||||
}, [currentPage, itemPerPage, newOrdersData]);
|
||||
return (
|
||||
<div className="main-content">
|
||||
<div className="page-content">
|
||||
@ -127,13 +216,14 @@ function NewOrders() {
|
||||
<div className="col-lg-12">
|
||||
<div className="card">
|
||||
<div className="card-body">
|
||||
<div className="d-flex align-items-center">
|
||||
<div className="row ml-0 mr-0 mb-10">
|
||||
<div className="col-sm-12 col-md-12">
|
||||
<div className="dataTables_length">
|
||||
<label className="w-100">
|
||||
Show
|
||||
<select
|
||||
style={{ width: "10%" }}
|
||||
style={{ width: "50px" }}
|
||||
name=""
|
||||
onChange={(e) => handleShowEntries(e)}
|
||||
className="
|
||||
@ -152,6 +242,112 @@ function NewOrders() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="ml-5 mt-2" style={{ display: "flex" }}>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
marginLeft: "1rem",
|
||||
}}
|
||||
>
|
||||
<Typography
|
||||
style={{
|
||||
display: "flex",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
fontWeight: "bold",
|
||||
marginRight: "1rem",
|
||||
}}
|
||||
>
|
||||
Search by :
|
||||
</Typography>
|
||||
<FormControl>
|
||||
<Select
|
||||
name="Search"
|
||||
value={searchValue}
|
||||
onChange={handleChange}
|
||||
style={{
|
||||
display: "flex",
|
||||
marginBottom: "1rem",
|
||||
width: "120px",
|
||||
height: "2rem",
|
||||
}}
|
||||
>
|
||||
<MenuItem
|
||||
value="orderId"
|
||||
style={{ display: "block", marginLeft: "0.5rem" }}
|
||||
>
|
||||
orderId
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
value="Name"
|
||||
style={{ display: "block", marginLeft: "0.5rem" }}
|
||||
>
|
||||
Name
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
value="City"
|
||||
style={{ display: "block", marginLeft: "0.5rem" }}
|
||||
>
|
||||
City
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
value="Amount"
|
||||
style={{ display: "block", marginLeft: "0.5rem" }}
|
||||
>
|
||||
Amount
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
value="OrderDate"
|
||||
style={{ display: "block", marginLeft: "0.5rem" }}
|
||||
>
|
||||
OrderDate
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
value="ProductName"
|
||||
style={{ display: "block", marginLeft: "0.5rem" }}
|
||||
>
|
||||
ProductName
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
value="MobileNumber"
|
||||
style={{ display: "block", marginLeft: "0.5rem" }}
|
||||
>
|
||||
MobileNumber
|
||||
</MenuItem>
|
||||
</Select>
|
||||
</FormControl>
|
||||
</div>
|
||||
{/* <div>
|
||||
{searchValue === "OrderDate" && (
|
||||
<DatePicker
|
||||
selected={searchTerm}
|
||||
onChange={(date) => setSearchTerm(date)}
|
||||
dateFormat="dd/MM/yyyy"
|
||||
placeholderText="Select a date"
|
||||
/>
|
||||
)}
|
||||
{searchValue !== "OrderDate" && (
|
||||
<TextField
|
||||
type="text"
|
||||
placeholder="Search Here"
|
||||
value={searchTerm}
|
||||
onChange={(e) => setSearchTerm(e.target.value)}
|
||||
/>
|
||||
)}
|
||||
<CIcon icon={cilSearch} size="xl" />
|
||||
</div> */}
|
||||
<div>
|
||||
<TextField
|
||||
type="text"
|
||||
placeholder="Search Here"
|
||||
value={searchTerm}
|
||||
onChange={(e) => setSearchTerm(e.target.value)}
|
||||
/>
|
||||
<CIcon icon={cilSearch} size="xl" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="table-responsive table-shoot mt-3">
|
||||
<table
|
||||
|
||||
945
src/views/orders/POSViewOrders.js
Normal file
945
src/views/orders/POSViewOrders.js
Normal file
@ -0,0 +1,945 @@
|
||||
import React, { useState, useEffect, useRef } from "react";
|
||||
import axios from "axios";
|
||||
import { Link, useNavigate, useParams } from "react-router-dom";
|
||||
import QRCode from "react-qr-code";
|
||||
import { isAutheticated } from "src/auth";
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
import { addItemsToCart } from "src/redux/Actions/cartAction";
|
||||
import toast from "react-hot-toast";
|
||||
import { cibBlackberry } from "@coreui/icons";
|
||||
import Button from "@material-ui/core/Button";
|
||||
|
||||
function POSViewOrders() {
|
||||
const { status, id } = useParams();
|
||||
const [success, setSuccess] = useState(true);
|
||||
|
||||
const { cartItems, subTotal, shippingCharge, tax, shipingInfo, total } =
|
||||
useSelector((state) => state.cart);
|
||||
|
||||
const AllStates = useSelector((state) => state);
|
||||
const getValue = useRef();
|
||||
const getFranchiseeID = useRef();
|
||||
const dispatch = useDispatch();
|
||||
const navigate = useNavigate();
|
||||
const printOrderRef = useRef();
|
||||
const token = isAutheticated();
|
||||
const [productData, setProductData] = useState([]);
|
||||
const [allFranchisee, setAllFranchisee] = useState([]);
|
||||
const [allTax, setAllTax] = useState([]);
|
||||
const [orderDetails, setOrderDetails] = useState();
|
||||
|
||||
const [productDetails, setProductDetails] = useState();
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [orderId, setOrderId] = useState(null);
|
||||
const [orderStatus, setOrderStatus] = useState("");
|
||||
// const [data, setData] = useState({
|
||||
// product_Name: '',
|
||||
// address: '',
|
||||
// quantity: '',
|
||||
// contact_Number: '',
|
||||
// total_Price: '',
|
||||
// })
|
||||
useEffect(() => {
|
||||
const getSingleOrder = async () => {
|
||||
setLoading(true);
|
||||
const res = await axios.get(`/api/order/getOne/${id}`, {
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
});
|
||||
if (res.data) {
|
||||
setLoading(false);
|
||||
setOrderId(res.data?.order?.order_id);
|
||||
setOrderDetails(res.data?.order);
|
||||
console.log(res.data);
|
||||
// let options = {
|
||||
// Franchisee: res.data?.order?.shippingInfo?.Franchisee?._id,
|
||||
// name: res.data?.order?.shippingInfo?.name,
|
||||
|
||||
// contact_Number: res.data?.order?.shippingInfo?.contact_Number,
|
||||
// contact_Person_Name: res.data?.order?.shippingInfo?.contact_Person_Name,
|
||||
// address: res.data?.order?.shippingInfo?.address,
|
||||
// city: res.data?.order?.shippingInfo?.city,
|
||||
// price_Lable: res.data?.order?.shippingInfo?.Franchisee?.price_Lable,
|
||||
// state: res.data?.order?.shippingInfo?.state,
|
||||
// banner: res.data?.order?.shippingInfo?.Franchisee?.banner?.url,
|
||||
// // Franchisee_Url: res?.data?.data?.url
|
||||
// }
|
||||
// dispatch({ type: "addShippingInfo", payload: options });
|
||||
// if (res.data?.order?.orderItems) {
|
||||
// res.data?.order?.orderItems.map((i, ind) => {
|
||||
// dispatch({ type: "addToCart", payload: i });
|
||||
// dispatch({ type: "calculatePrice" });
|
||||
|
||||
// })
|
||||
// }
|
||||
}
|
||||
};
|
||||
getSingleOrder();
|
||||
}, [token]);
|
||||
|
||||
const handleChange = (e) => {
|
||||
if (e.target.type === "text") {
|
||||
setData((prev) => ({ ...prev, [e.target.id]: e.target.value }));
|
||||
} else {
|
||||
if (e.target.value === "") toast.error("please select status");
|
||||
setOrderStatus(e.target.value);
|
||||
}
|
||||
};
|
||||
const handleQuantityChange = (e) => {
|
||||
setData((prev) => ({
|
||||
...prev,
|
||||
quantity: e.target.value,
|
||||
total_Price: productDetails?.base_Price * e.target.value,
|
||||
}));
|
||||
};
|
||||
// ------------------------------------------------------
|
||||
|
||||
const handlechangestatus = () => {
|
||||
if (orderStatus === "dispatched") {
|
||||
swal({
|
||||
title: `Are you sure for ${orderStatus}?`,
|
||||
icon: "warning",
|
||||
content: {
|
||||
element: "div",
|
||||
attributes: {
|
||||
innerHTML:
|
||||
'<input id="input1" placeholder="Enter Courier Name" className="swal2-input" style="margin:3px;height:40px;text-align:center;">' +
|
||||
'<input id="input2" placeholder="Courier Tracking ID" className="swal2-input" style="margin:3px;height:40px;text-align:center;">',
|
||||
},
|
||||
},
|
||||
buttons: {
|
||||
Yes: { text: "Submit", value: true },
|
||||
|
||||
Cancel: { text: "Cancel", value: "cancel" },
|
||||
},
|
||||
}).then((result) => {
|
||||
if (result === true) {
|
||||
// You have the input values, you can use them in your API call
|
||||
const courierName = document.getElementById("input1").value.trim();
|
||||
const TrackingID = document.getElementById("input2").value.trim();
|
||||
|
||||
// Check if values are entered
|
||||
if (courierName === "" || TrackingID === "") {
|
||||
swal({
|
||||
title: "Warning",
|
||||
text: "Please enter values Courier Name And Tracking ID",
|
||||
icon: "warning",
|
||||
button: "Ok",
|
||||
dangerMode: true,
|
||||
});
|
||||
} else {
|
||||
axios
|
||||
.patch(
|
||||
`/api/order/change/status/${id}`,
|
||||
{
|
||||
status: orderStatus,
|
||||
courierName,
|
||||
TrackingID,
|
||||
sendemail: orderDetails?.user?.email,
|
||||
customerName: orderDetails?.user?.name,
|
||||
},
|
||||
{
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
}
|
||||
)
|
||||
.then((res) => {
|
||||
console.log("status");
|
||||
toast.success(
|
||||
`Order status change ${status} to ${orderStatus}`
|
||||
);
|
||||
// setSuccess((prev) => !prev);
|
||||
})
|
||||
.catch((err) => {
|
||||
swal({
|
||||
title: "Warning",
|
||||
text: err.response.data.message
|
||||
? err.response.data.message
|
||||
: "Something went wrong!",
|
||||
icon: "error",
|
||||
button: "Retry",
|
||||
dangerMode: true,
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
// else {
|
||||
// swal.close(); // Close the popup if canceled
|
||||
// }
|
||||
});
|
||||
} else if (orderStatus === "cancelled") {
|
||||
swal({
|
||||
title: `Are you sure for ${orderStatus}?`,
|
||||
icon: "warning",
|
||||
content: {
|
||||
element: "div",
|
||||
attributes: {
|
||||
innerHTML:
|
||||
'<p>Reson for cancellation.?</p><input id="input1" placeholder="Enter Reason for Cancellation" className="swal2-input" style="margin:3px;height:40px;text-align:center;">',
|
||||
},
|
||||
},
|
||||
buttons: {
|
||||
Yes: { text: "Submit", value: true },
|
||||
|
||||
Cancel: { text: "Cancel", value: "cancel" },
|
||||
},
|
||||
}).then((result) => {
|
||||
if (result === true) {
|
||||
// You have the input values, you can use them in your API call
|
||||
const ReasonforCancellation = document
|
||||
.getElementById("input1")
|
||||
.value.trim();
|
||||
|
||||
// Check if values are entered
|
||||
if (ReasonforCancellation === "") {
|
||||
swal({
|
||||
title: "Warning",
|
||||
text: "Please enter Reason for Cancellation",
|
||||
icon: "warning",
|
||||
button: "Ok",
|
||||
dangerMode: true,
|
||||
});
|
||||
} else {
|
||||
axios
|
||||
.patch(
|
||||
`/api/order/change/status/${id}`,
|
||||
{
|
||||
status: orderStatus,
|
||||
ReasonforCancellation,
|
||||
},
|
||||
{
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
}
|
||||
)
|
||||
.then((res) => {
|
||||
console.log("status");
|
||||
toast.success(
|
||||
`Order status change ${status} to ${orderStatus}`
|
||||
);
|
||||
// setSuccess((prev) => !prev);
|
||||
})
|
||||
.catch((err) => {
|
||||
swal({
|
||||
title: "Warning",
|
||||
text: err.response.data.message
|
||||
? err.response.data.message
|
||||
: "Something went wrong!",
|
||||
icon: "error",
|
||||
button: "Retry",
|
||||
dangerMode: true,
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
// else {
|
||||
// swal.close(); // Close the popup if canceled
|
||||
// }
|
||||
});
|
||||
} else if (orderStatus === "delivered") {
|
||||
swal({
|
||||
title: `Are you sure for ${orderStatus}?`,
|
||||
icon: "warning",
|
||||
content: {
|
||||
element: "div",
|
||||
attributes: {
|
||||
innerHTML:
|
||||
'<input id="input1" type="date" placeholder="Delivered ON" className="swal2-input" style="height:40px;text-align:center;">',
|
||||
// '<input id="input2" placeholder="Courier Tracking ID" className="swal2-input" style="margin:3px;height:40px">',
|
||||
},
|
||||
},
|
||||
buttons: {
|
||||
Yes: { text: "Submit", value: true },
|
||||
|
||||
Cancel: { text: "Cancel", value: "cancel" },
|
||||
},
|
||||
}).then((result) => {
|
||||
if (result === true) {
|
||||
// You have the input values, you can use them in your API call
|
||||
const DDate = document.getElementById("input1").value.trim();
|
||||
|
||||
// Check if values are entered
|
||||
if (DDate === "") {
|
||||
swal({
|
||||
title: "Warning",
|
||||
text: "Please enter Delivered Date",
|
||||
icon: "warning",
|
||||
button: "Ok",
|
||||
dangerMode: true,
|
||||
});
|
||||
} else {
|
||||
axios
|
||||
.patch(
|
||||
`/api/order/change/status/${id}`,
|
||||
{
|
||||
status: orderStatus,
|
||||
DDate,
|
||||
},
|
||||
{
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
}
|
||||
)
|
||||
.then((res) => {
|
||||
console.log("status");
|
||||
toast.success(
|
||||
`Order status change ${status} to ${orderStatus}`
|
||||
);
|
||||
// setSuccess((prev) => !prev);
|
||||
})
|
||||
.catch((err) => {
|
||||
swal({
|
||||
title: "Warning",
|
||||
text: err.response.data.message
|
||||
? err.response.data.message
|
||||
: "Something went wrong!",
|
||||
icon: "error",
|
||||
button: "Retry",
|
||||
dangerMode: true,
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
// else {
|
||||
// swal.close(); // Close the popup if canceled
|
||||
// }
|
||||
});
|
||||
} else {
|
||||
swal({
|
||||
title: `Are you sure for ${orderStatus}?`,
|
||||
icon: "warning",
|
||||
|
||||
buttons: {
|
||||
Yes: { text: "Yes", value: true },
|
||||
Cancel: { text: "Cancel", value: "cancel" },
|
||||
},
|
||||
}).then((value) => {
|
||||
if (value === true) {
|
||||
axios
|
||||
.patch(
|
||||
`/api/order/change/status/${id}`,
|
||||
{ status: orderStatus },
|
||||
{
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
}
|
||||
)
|
||||
.then((res) => {
|
||||
console.log("status");
|
||||
toast.success(`order status change ${status} to ${orderStatus}`);
|
||||
// setSuccess((prev) => !prev);
|
||||
})
|
||||
.catch((err) => {
|
||||
swal({
|
||||
title: "Warning",
|
||||
text: err.response.data.message
|
||||
? err.response.data.message
|
||||
: "Something went wrong!",
|
||||
icon: "error",
|
||||
button: "Retry",
|
||||
dangerMode: true,
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
function getBack() {
|
||||
navigate(`/orders/${status}`, { replace: true });
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
{" "}
|
||||
<div className="main-content">
|
||||
<div className="page-content">
|
||||
<div className="container-fluid">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<div
|
||||
className="
|
||||
page-title-box
|
||||
d-flex
|
||||
align-items-center
|
||||
justify-content-between
|
||||
"
|
||||
>
|
||||
<div style={{ fontSize: "22px" }} className="fw-bold">
|
||||
<p> View Order</p>
|
||||
</div>
|
||||
<div className="m-4">
|
||||
{orderDetails?.orderID && (
|
||||
<span>
|
||||
<h6 className="">Order ID : {orderDetails?.orderID}</h6>{" "}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
{orderDetails?.courier_name && (
|
||||
<div className="m-4">
|
||||
<span>
|
||||
<h6 className="">
|
||||
Courier Name: {orderDetails?.courier_name}
|
||||
</h6>{" "}
|
||||
<h6 className="">
|
||||
Tracking ID : {orderDetails?.courier_tracking_id}
|
||||
</h6>
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
{orderDetails?.isDelivered && (
|
||||
<div className="m-4">
|
||||
<span>
|
||||
<h6 className="">Delivered: Yes</h6>{" "}
|
||||
<h6 className="">
|
||||
Delivered Date: {orderDetails?.DeliveredDate}
|
||||
</h6>
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
<div className="page-title-right">
|
||||
{/* <Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
style={{
|
||||
fontWeight: 'bold',
|
||||
marginBottom: '1rem',
|
||||
textTransform: 'capitalize',
|
||||
marginRight: '5px',
|
||||
}}
|
||||
onClick={() => handleSubmit()}
|
||||
disabled={loading}
|
||||
>
|
||||
{loading ? 'Loading' : 'Edit Now'}
|
||||
</Button> */}
|
||||
|
||||
<Link
|
||||
to={
|
||||
orderDetails?.paymentMode === "cod"
|
||||
? `/inStoreCashOrders/${status}`
|
||||
: `/InStoreQRCodeOrders/${status}`
|
||||
}
|
||||
>
|
||||
<Button
|
||||
variant="contained"
|
||||
color="secondary"
|
||||
style={{
|
||||
fontWeight: "bold",
|
||||
marginBottom: "1rem",
|
||||
textTransform: "capitalize",
|
||||
}}
|
||||
>
|
||||
Back
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{loading ? (
|
||||
<div className="d-flex justify-content-center">
|
||||
<div className="spinner-border text-info" role="status">
|
||||
<span className="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="row">
|
||||
<div className="col-lg-7 mt-3">
|
||||
{orderDetails?.shipingInfo !== null && (
|
||||
<div className="card">
|
||||
<div className="card-body">
|
||||
{/* <div className="mt-1">
|
||||
<label className="fw-bold">Select Product:</label>
|
||||
<div className="d-flex">
|
||||
<select
|
||||
className="form-control me-2"
|
||||
// onChange={handleGetSingleProduct}
|
||||
// value={productData?._id}
|
||||
ref={getValue}
|
||||
|
||||
>
|
||||
<option value="" >-----</option>
|
||||
{productData && productData.map((item, index) =>
|
||||
<option key={index} value={item?._id}>{item?.name}</option>
|
||||
)}
|
||||
|
||||
</select>
|
||||
<button className='btn-sm btn-primary' onClick={(e) => handleGetSingleProduct(e)}>Add</button>
|
||||
|
||||
</div>
|
||||
|
||||
</div> */}
|
||||
|
||||
<div className="mt-2">
|
||||
<h6 className="fw-bold">
|
||||
Products : {orderDetails?.orderItems?.length}
|
||||
</h6>
|
||||
<hr />
|
||||
|
||||
{orderDetails?.orderItems &&
|
||||
orderDetails?.orderItems.map(
|
||||
(productDetails, i) => (
|
||||
<div className="my-2">
|
||||
<div
|
||||
className="row"
|
||||
style={{ fontSize: "14px" }}
|
||||
>
|
||||
<div className="col-sm-4">
|
||||
<img
|
||||
src={productDetails?.image[0]?.url}
|
||||
alt={productDetails?.name}
|
||||
style={{
|
||||
width: "100%",
|
||||
objectFit: "contain",
|
||||
maxHeight: "150px",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="col-sm-8">
|
||||
<h6 className="m-0 ms-2">
|
||||
{productDetails?.name}
|
||||
</h6>
|
||||
<div className="row">
|
||||
<div className="col-sm-6">
|
||||
<div
|
||||
className="d-flex justify-content-center mt-3 me-3 "
|
||||
style={{
|
||||
width: "6rem",
|
||||
}}
|
||||
>
|
||||
<span
|
||||
className="px-2 mt-1"
|
||||
style={{}}
|
||||
>
|
||||
{" "}
|
||||
Quantity:{" "}
|
||||
{productDetails?.quantity}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<p className="m-0 mt-3 ms-3">
|
||||
<stong> Subtotal:</stong> ₹
|
||||
{productDetails?.product_Subtotal}
|
||||
</p>
|
||||
<p className="m-0 mt-3 ms-3">
|
||||
<stong> Variant:</stong>{" "}
|
||||
{productDetails?.variant_Name}
|
||||
</p>
|
||||
</div>
|
||||
<div className="col-sm-6">
|
||||
<p className="m-0 mt-3">
|
||||
<stong> Price:</stong> ₹
|
||||
{productDetails?.price}
|
||||
</p>
|
||||
<p className="m-0 mt-3">
|
||||
<stong> GST:</stong> ₹
|
||||
{productDetails?.gst_amount}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr />
|
||||
</div>
|
||||
)
|
||||
)}
|
||||
<div className="m-0 contents-center mt-3 mb-2">
|
||||
<small className="mb-4">Shipping Charge: </small> ₹
|
||||
{orderDetails?.shipping_charge}
|
||||
<br />
|
||||
<span className="mt-2"> Total Order Value: </span> ₹
|
||||
{orderDetails?.total_amount}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="card my-1">
|
||||
<div className="card-body">
|
||||
<label className="fw-bold">Status Timeline :</label>
|
||||
<table
|
||||
className="table table-info table-sm m-0"
|
||||
style={{
|
||||
borderRadius: "8px",
|
||||
borderCollapse: "collapse",
|
||||
overflow: "hidden",
|
||||
}}
|
||||
>
|
||||
<tbody>
|
||||
<tr className="text-center">
|
||||
<th scope="row">Order Placed On</th>
|
||||
<td> : </td>
|
||||
<td>
|
||||
{orderDetails?.createdAt
|
||||
? new Date(
|
||||
orderDetails?.createdAt
|
||||
).toLocaleString("en-IN", {
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
hour: "2-digit",
|
||||
minute: "numeric",
|
||||
hour12: true,
|
||||
})
|
||||
: new Date(
|
||||
productData?.placed_on
|
||||
).toLocaleString("en-IN", {
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
hour: "2-digit",
|
||||
minute: "numeric",
|
||||
hour12: true,
|
||||
})}
|
||||
</td>
|
||||
</tr>
|
||||
<tr className="text-center">
|
||||
<th scope="row" className="text-warning">
|
||||
Processing Started
|
||||
</th>
|
||||
<td className="text-warning"> : </td>
|
||||
<td className="text-warning">
|
||||
{orderDetails?.status_timeline?.processing
|
||||
? new Date(
|
||||
orderDetails?.status_timeline?.processing
|
||||
).toLocaleString("en-IN", {
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
hour: "2-digit",
|
||||
minute: "numeric",
|
||||
hour12: true,
|
||||
})
|
||||
: "-"}
|
||||
</td>
|
||||
</tr>
|
||||
<tr className="text-center">
|
||||
<th scope="row" className="text-primary">
|
||||
Dispatched On
|
||||
</th>
|
||||
<td className="text-primary"> : </td>
|
||||
<td className="text-primary">
|
||||
{orderDetails?.status_timeline?.dispatched
|
||||
? new Date(
|
||||
orderDetails?.status_timeline?.dispatched
|
||||
).toLocaleString("en-IN", {
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
hour: "2-digit",
|
||||
minute: "numeric",
|
||||
hour12: true,
|
||||
})
|
||||
: "-"}
|
||||
</td>
|
||||
</tr>
|
||||
<tr className="text-center">
|
||||
<th scope="row" className="text-success">
|
||||
Delivered On
|
||||
</th>
|
||||
<td className="text-success"> : </td>
|
||||
<td className="text-success">
|
||||
{orderDetails?.status_timeline?.delivered
|
||||
? new Date(
|
||||
orderDetails?.status_timeline?.delivered
|
||||
).toLocaleString("en-IN", {
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
hour: "2-digit",
|
||||
minute: "numeric",
|
||||
hour12: true,
|
||||
})
|
||||
: "-"}
|
||||
</td>
|
||||
</tr>
|
||||
{orderDetails?.status_timeline?.cancelled && (
|
||||
<tr className="text-center">
|
||||
<th scope="row" className="text-danger">
|
||||
Cancelled On
|
||||
</th>
|
||||
<td className="text-danger"> : </td>
|
||||
<td className="text-danger">
|
||||
{orderDetails?.status_timeline?.cancelled
|
||||
? new Date(
|
||||
orderDetails?.status_timeline?.cancelled
|
||||
).toLocaleString("en-IN", {
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
hour: "2-digit",
|
||||
minute: "numeric",
|
||||
hour12: true,
|
||||
})
|
||||
: "-"}
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
{/* <tr className="text-center">
|
||||
<th scope="row">Returned On</th>
|
||||
<td> : </td>
|
||||
<td>
|
||||
{orderDetails?.status_timeline?.returned
|
||||
? new Date(
|
||||
orderDetails?.status_timeline?.returned
|
||||
).toLocaleString("en-IN", {
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
hour: "2-digit",
|
||||
minute: "numeric",
|
||||
hour12: true,
|
||||
})
|
||||
: "-"}
|
||||
</td>
|
||||
</tr> */}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-5 mt-3">
|
||||
<div className="card">
|
||||
<div className="card-body">
|
||||
<div className="mt-1">
|
||||
{orderDetails?.orderStatus !== "cancelled" ? (
|
||||
<h5 className="text-success">
|
||||
Order Status: {orderDetails?.orderStatus}
|
||||
</h5>
|
||||
) : (
|
||||
<>
|
||||
<h5 className="text-danger">
|
||||
Order Status: {orderDetails?.orderStatus}
|
||||
</h5>
|
||||
<p className="text-danger">
|
||||
{" "}
|
||||
Order Cancelled Reason:{" "}
|
||||
{orderDetails?.order_Cancelled_Reason}
|
||||
</p>
|
||||
</>
|
||||
)}
|
||||
{/* order status change */}{" "}
|
||||
<div className="mb-2">
|
||||
{" "}
|
||||
{status !== "cancelled" &&
|
||||
status !== "returned" &&
|
||||
status !== "delivered" && (
|
||||
<div className="mt-1">
|
||||
<label className="fw-bold">
|
||||
Change Status :
|
||||
</label>
|
||||
<div className="row">
|
||||
<div className="col-lg-9">
|
||||
<select
|
||||
className="form-control"
|
||||
onChange={handleChange}
|
||||
value={orderStatus}
|
||||
>
|
||||
{orderDetails?.orderStatus === "new" && (
|
||||
<>
|
||||
<option value="">New</option>
|
||||
<option value="processing">
|
||||
Processing
|
||||
</option>
|
||||
<option value="cancelled">
|
||||
Cancelled
|
||||
</option>
|
||||
</>
|
||||
)}
|
||||
{orderDetails?.orderStatus ===
|
||||
"processing" && (
|
||||
<>
|
||||
<option value="">Processing</option>
|
||||
<option value="dispatched">
|
||||
Dispatch
|
||||
</option>
|
||||
</>
|
||||
)}
|
||||
{orderDetails?.orderStatus ===
|
||||
"dispatched" && (
|
||||
<>
|
||||
<option value="">Dispatch</option>
|
||||
<option value="delivered">
|
||||
Delivered
|
||||
</option>
|
||||
</>
|
||||
)}
|
||||
</select>
|
||||
</div>
|
||||
{orderStatus && (
|
||||
<div className="col-lg-3">
|
||||
<button
|
||||
className="btn btn-primary"
|
||||
onClick={(e) => handlechangestatus(e)}
|
||||
>
|
||||
Update
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{/* */}
|
||||
<label className="fw-bold mt-1">Shipping Info :</label>
|
||||
{/* <div className="d-flex">
|
||||
<select
|
||||
className="form-control me-2"
|
||||
onChange={handleChange}
|
||||
value={orderStatus}
|
||||
ref={getFranchiseeID}
|
||||
disabled={shipingInfo !== null}
|
||||
>
|
||||
<option value="" disabled></option>
|
||||
{allFranchisee && allFranchisee.map((item, index) =>
|
||||
<option key={index} value={item?._id}>{item?.name}</option>
|
||||
)}
|
||||
</select>
|
||||
<button className='btn-sm btn-primary' onClick={(e) => handleGetSingleFrenchisee(e)} >Add</button>
|
||||
</div> */}
|
||||
</div>
|
||||
{orderDetails?.shipingInfo !== null && (
|
||||
<div className="">
|
||||
<div className="row" style={{ fontSize: "14px" }}>
|
||||
{/* <div className="col-sm-4">
|
||||
<img
|
||||
src={
|
||||
orderDetails?.shippingInfo?.Franchisee?.banner
|
||||
?.url
|
||||
}
|
||||
alt={orderDetails?.shippingInfo?.name}
|
||||
// width='100%'
|
||||
style={{
|
||||
width: "100%",
|
||||
objectFit: "contain",
|
||||
maxHeight: "100px",
|
||||
}}
|
||||
/>
|
||||
</div> */}
|
||||
<div className="col-sm-12">
|
||||
<h6 className="m-0 ms-2">
|
||||
Name: {orderDetails?.shippingInfo?.first_Name}{" "}
|
||||
{orderDetails?.shippingInfo?.last_Name}
|
||||
</h6>
|
||||
|
||||
<p className="m-0 ms-2 mt-1">
|
||||
Contact No. :{" "}
|
||||
{orderDetails?.shippingInfo?.phone_Number}
|
||||
</p>
|
||||
<parent className="m-0 ms-2 mt-3">
|
||||
street. : {orderDetails?.shippingInfo?.street}
|
||||
</parent>
|
||||
|
||||
<p className="m-0 ms-2 mt-1">
|
||||
City : {orderDetails?.shippingInfo?.city}
|
||||
</p>
|
||||
<p className="m-0 ms-2 mt-1">
|
||||
State : {orderDetails?.shippingInfo?.state}
|
||||
</p>
|
||||
<p className="m-0 ms-2 mt-1">
|
||||
country : {orderDetails?.shippingInfo?.country}
|
||||
</p>
|
||||
<p className="m-0 ms-2 mt-1">
|
||||
Postal Code. :{" "}
|
||||
{orderDetails?.shippingInfo?.postalCode}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<hr />
|
||||
</div>
|
||||
)}
|
||||
<div className="mt-3">
|
||||
<label>
|
||||
<span className="fw-bold">Payment Status : </span>
|
||||
{orderDetails?.isPaid === false ? (
|
||||
<span className="fw-bold text-danger">
|
||||
Not Paid
|
||||
</span>
|
||||
) : (
|
||||
<span className="fw-bold text-success">Paid</span>
|
||||
)}
|
||||
</label>
|
||||
</div>
|
||||
<div className="">
|
||||
<label>
|
||||
<span className="fw-bold">Payment Mode : </span>
|
||||
{orderDetails?.paymentMode === "online" ? (
|
||||
<span className="fw-bold text-success">ONLINE</span>
|
||||
) : (
|
||||
<span className="fw-bold text-primary">
|
||||
CASH ON DELIVERY
|
||||
</span>
|
||||
)}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div className="">
|
||||
<label>
|
||||
<span className="fw-bold"> Paid At: </span>
|
||||
|
||||
{orderDetails?.paidAt
|
||||
? new Date(orderDetails?.paidAt).toLocaleString(
|
||||
"en-IN",
|
||||
{
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
hour: "2-digit",
|
||||
minute: "numeric",
|
||||
hour12: true,
|
||||
}
|
||||
)
|
||||
: "----"}
|
||||
</label>
|
||||
</div>
|
||||
<div className="">
|
||||
<label>
|
||||
<span className="fw-bold"> Order Created By: </span>
|
||||
{orderDetails?.user?.name}
|
||||
</label>
|
||||
</div>
|
||||
<div className="mt-1">
|
||||
<label>
|
||||
<span className="fw-bold">
|
||||
Razorpay Payment ID :{" "}
|
||||
</span>
|
||||
{orderDetails?.razorpay_payment_id
|
||||
? orderDetails?.razorpay_payment_id
|
||||
: "----"}
|
||||
</label>
|
||||
</div>
|
||||
<div className="">
|
||||
<label>
|
||||
<span className="fw-bold">Razorpay Order ID : </span>
|
||||
{orderDetails?.razorpay_order_id
|
||||
? orderDetails?.razorpay_order_id
|
||||
: "----"}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style={{ display: "none" }}>
|
||||
{/* <PrintOrderDetails productData={productData} ref={printOrderRef} /> */}
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default POSViewOrders;
|
||||
@ -100,8 +100,10 @@ const Login = () => {
|
||||
setLoading({ loading: true });
|
||||
try {
|
||||
const res = await axios.post("/api/v1/user/login/", auth);
|
||||
console.log(res);
|
||||
if (res.data.success == true) {
|
||||
localStorage.setItem("authToken", res.data.token);
|
||||
|
||||
let response = await axios.get(`/api/v1/user/details`, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${res.data.token}`,
|
||||
@ -109,7 +111,7 @@ const Login = () => {
|
||||
});
|
||||
// console.log(response.data)
|
||||
const data = response.data;
|
||||
if (data.user.role === "admin") {
|
||||
if (data.user.role === "admin" || data.user.role === "Employee") {
|
||||
history("/dashboard");
|
||||
setLoading(false);
|
||||
window.location.reload();
|
||||
|
||||
Loading…
Reference in New Issue
Block a user