employee section ui is done
This commit is contained in:
roshangarg
parent
8ce42aeb2d
commit
a7122792fa
21
src/_nav.js
21
src/_nav.js
@ -24,6 +24,7 @@ import {
|
|||||||
cilUser,
|
cilUser,
|
||||||
cilAlarm,
|
cilAlarm,
|
||||||
cilFeaturedPlaylist,
|
cilFeaturedPlaylist,
|
||||||
|
cilLocationPin,
|
||||||
} from "@coreui/icons";
|
} from "@coreui/icons";
|
||||||
import { CNavGroup, CNavItem, CNavTitle, CTabContent } from "@coreui/react";
|
import { CNavGroup, CNavItem, CNavTitle, CTabContent } from "@coreui/react";
|
||||||
|
|
||||||
@ -40,12 +41,7 @@ const _nav = [
|
|||||||
icon: <CIcon icon={cilTennisBall} customClassName="nav-icon" />,
|
icon: <CIcon icon={cilTennisBall} customClassName="nav-icon" />,
|
||||||
to: "/customers-details",
|
to: "/customers-details",
|
||||||
},
|
},
|
||||||
// {
|
|
||||||
// component: CNavItem,
|
|
||||||
// name: "Design",
|
|
||||||
// icon: <CIcon icon={cibMaterialDesign} customClassName="nav-icon" />,
|
|
||||||
// to: "/design",
|
|
||||||
// },
|
|
||||||
{
|
{
|
||||||
component: CNavGroup,
|
component: CNavGroup,
|
||||||
name: "Charts",
|
name: "Charts",
|
||||||
@ -297,6 +293,12 @@ const _nav = [
|
|||||||
icon: <CIcon icon={cilUser} customClassName="nav-icon" />,
|
icon: <CIcon icon={cilUser} customClassName="nav-icon" />,
|
||||||
to: "/contact/request",
|
to: "/contact/request",
|
||||||
},
|
},
|
||||||
|
// {
|
||||||
|
// component: CNavItem,
|
||||||
|
// name: "Email CMS",
|
||||||
|
// icon: <CIcon icon={cilLocationPin} customClassName="nav-icon" />,
|
||||||
|
// to: "/email-cms",
|
||||||
|
// },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
//Blog start
|
//Blog start
|
||||||
@ -306,6 +308,13 @@ const _nav = [
|
|||||||
icon: <CIcon icon={cilNotes} customClassName="nav-icon" />,
|
icon: <CIcon icon={cilNotes} customClassName="nav-icon" />,
|
||||||
to: "/blogs",
|
to: "/blogs",
|
||||||
},
|
},
|
||||||
|
// Employee
|
||||||
|
{
|
||||||
|
component: CNavItem,
|
||||||
|
name: "Employee",
|
||||||
|
icon: <CIcon icon={cilImage} customClassName="nav-icon" />,
|
||||||
|
to: "/employee",
|
||||||
|
},
|
||||||
|
|
||||||
// {
|
// {
|
||||||
// component: CNavGroup,
|
// component: CNavGroup,
|
||||||
|
|||||||
@ -137,6 +137,10 @@ import { element } from "prop-types";
|
|||||||
import OrderdayChart from "./views/Charts/OrderDaywise";
|
import OrderdayChart from "./views/Charts/OrderDaywise";
|
||||||
import RevenueCharts from "./views/Charts/RevenueCharts";
|
import RevenueCharts from "./views/Charts/RevenueCharts";
|
||||||
import AddCustomer from "./views/customerDetails/addCustomer";
|
import AddCustomer from "./views/customerDetails/addCustomer";
|
||||||
|
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";
|
||||||
const routes = [
|
const routes = [
|
||||||
{ path: "/", exact: true, name: "Home" },
|
{ path: "/", exact: true, name: "Home" },
|
||||||
{
|
{
|
||||||
@ -275,6 +279,16 @@ const routes = [
|
|||||||
element: AddContactRequest,
|
element: AddContactRequest,
|
||||||
},
|
},
|
||||||
//Support Requests
|
//Support Requests
|
||||||
|
// {
|
||||||
|
// path: "/email-cms",
|
||||||
|
// name: "CustomerSupport Requests",
|
||||||
|
// element: EmailCms,
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// path: "/email-cms/registration-email",
|
||||||
|
// name: "CustomerSupport Requests",
|
||||||
|
// element: RegistrationEmail,
|
||||||
|
// },
|
||||||
|
|
||||||
{
|
{
|
||||||
path: "/support/request",
|
path: "/support/request",
|
||||||
@ -334,17 +348,17 @@ const routes = [
|
|||||||
path: "/home",
|
path: "/home",
|
||||||
name: "Home",
|
name: "Home",
|
||||||
element: Home,
|
element: Home,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/home/panel-1",
|
path: "/home/panel-1",
|
||||||
name: "EditPanel1",
|
name: "EditPanel1",
|
||||||
element: EditPanel1,
|
element: EditPanel1,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/home/panel-2",
|
path: "/home/panel-2",
|
||||||
name: "EditPanel2",
|
name: "EditPanel2",
|
||||||
element: EditPanel2,
|
element: EditPanel2,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/home/panel-3",
|
path: "/home/panel-3",
|
||||||
name: "EditPanel3",
|
name: "EditPanel3",
|
||||||
@ -354,12 +368,7 @@ const routes = [
|
|||||||
path: "/home/panel-4",
|
path: "/home/panel-4",
|
||||||
name: "EditPanel4",
|
name: "EditPanel4",
|
||||||
element: Editpanel4,
|
element: Editpanel4,
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// { path: '/complaint/view/:id', name: 'view Complain', element: ViewComplaint },
|
// { path: '/complaint/view/:id', name: 'view Complain', element: ViewComplaint },
|
||||||
//Complaints
|
//Complaints
|
||||||
@ -568,6 +577,17 @@ const routes = [
|
|||||||
name: "Blogs",
|
name: "Blogs",
|
||||||
element: ViewBlog,
|
element: ViewBlog,
|
||||||
},
|
},
|
||||||
|
// Employee
|
||||||
|
{
|
||||||
|
path: "/employee",
|
||||||
|
name: "Employee",
|
||||||
|
element: Employee,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: "/add-employee",
|
||||||
|
name: "Employee",
|
||||||
|
element: AddEmployee,
|
||||||
|
},
|
||||||
//Charts
|
//Charts
|
||||||
{
|
{
|
||||||
path: "/new-user-day-wise",
|
path: "/new-user-day-wise",
|
||||||
|
|||||||
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>
|
||||||
|
);
|
||||||
|
}
|
||||||
479
src/views/EmployeeAccess/Employee.js
Normal file
479
src/views/EmployeeAccess/Employee.js
Normal file
@ -0,0 +1,479 @@
|
|||||||
|
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 [users, setUsers] = useState([]);
|
||||||
|
|
||||||
|
const [currentPage, setCurrentPage] = useState(1);
|
||||||
|
const [itemPerPage, setItemPerPage] = useState(10);
|
||||||
|
const [showData, setShowData] = useState(users);
|
||||||
|
|
||||||
|
const handleShowEntries = (e) => {
|
||||||
|
setCurrentPage(1);
|
||||||
|
setItemPerPage(e.target.value);
|
||||||
|
};
|
||||||
|
|
||||||
|
// const getUsers = async () => {
|
||||||
|
// axios
|
||||||
|
// .get(`/api/v1/admin/users`, {
|
||||||
|
// headers: {
|
||||||
|
// Authorization: `Bearer ${token}`,
|
||||||
|
// },
|
||||||
|
// })
|
||||||
|
// .then((res) => {
|
||||||
|
// setUsers(res.data.users);
|
||||||
|
// 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(() => {
|
||||||
|
// getUsers();
|
||||||
|
// }, [success]);
|
||||||
|
// console.log(users);
|
||||||
|
|
||||||
|
// useEffect(() => {
|
||||||
|
// const loadData = () => {
|
||||||
|
// const indexOfLastPost = currentPage * itemPerPage;
|
||||||
|
// const indexOfFirstPost = indexOfLastPost - itemPerPage;
|
||||||
|
// setShowData(users.slice(indexOfFirstPost, indexOfLastPost));
|
||||||
|
// };
|
||||||
|
// loadData();
|
||||||
|
// }, [currentPage, itemPerPage, users]);
|
||||||
|
// console.log(users);
|
||||||
|
|
||||||
|
// 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,
|
||||||
|
// });
|
||||||
|
// });
|
||||||
|
// }
|
||||||
|
// });
|
||||||
|
// };
|
||||||
|
|
||||||
|
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((user, i) => {
|
||||||
|
// return (
|
||||||
|
// <tr key={i}>
|
||||||
|
// <td className="text-start">{user.name}</td>
|
||||||
|
// <td>{user._id}</td>
|
||||||
|
|
||||||
|
// <td className="text-start">
|
||||||
|
// {new Date(user.createdAt).toLocaleString(
|
||||||
|
// "en-IN",
|
||||||
|
// {
|
||||||
|
// weekday: "short",
|
||||||
|
// month: "short",
|
||||||
|
// day: "numeric",
|
||||||
|
// year: "numeric",
|
||||||
|
// hour: "numeric",
|
||||||
|
// minute: "numeric",
|
||||||
|
// hour12: true,
|
||||||
|
// }
|
||||||
|
// )}
|
||||||
|
// </td>
|
||||||
|
// {loading1 && (
|
||||||
|
// <>
|
||||||
|
// <td className="text-start">loading...</td>
|
||||||
|
// <td className="text-start">loading...</td>
|
||||||
|
// </>
|
||||||
|
// )}
|
||||||
|
|
||||||
|
// <OrderDetails
|
||||||
|
// _id={user?._id}
|
||||||
|
// setLoading1={setLoading1}
|
||||||
|
// />
|
||||||
|
|
||||||
|
// <td className="text-start">
|
||||||
|
// {/* <Link
|
||||||
|
// to={`/users-address/view/${userAddress._id}`}
|
||||||
|
// >
|
||||||
|
// <button
|
||||||
|
// style={{
|
||||||
|
// color: "white",
|
||||||
|
// marginRight: "1rem",
|
||||||
|
// }}
|
||||||
|
// type="button"
|
||||||
|
// className="
|
||||||
|
// btn btn-primary btn-sm
|
||||||
|
// waves-effect waves-light
|
||||||
|
// btn-table
|
||||||
|
// mx-1
|
||||||
|
// mt-1
|
||||||
|
// "
|
||||||
|
// >
|
||||||
|
// View
|
||||||
|
// </button>
|
||||||
|
// </Link>
|
||||||
|
// <Link
|
||||||
|
// to={`/users-address/edit/${userAddress._id}`}
|
||||||
|
// >
|
||||||
|
// <button
|
||||||
|
// style={{
|
||||||
|
// color: "white",
|
||||||
|
// marginRight: "1rem",
|
||||||
|
// }}
|
||||||
|
// type="button"
|
||||||
|
// className="
|
||||||
|
// btn btn-info btn-sm
|
||||||
|
// waves-effect waves-light
|
||||||
|
// btn-table
|
||||||
|
// mt-1
|
||||||
|
// mx-1
|
||||||
|
// "
|
||||||
|
// >
|
||||||
|
// Edit
|
||||||
|
// </button>
|
||||||
|
// </Link>
|
||||||
|
// <Link
|
||||||
|
// to={"#"}
|
||||||
|
// style={{
|
||||||
|
// marginRight: "1rem",
|
||||||
|
// }}
|
||||||
|
// >
|
||||||
|
// <button
|
||||||
|
// style={{ color: "white" }}
|
||||||
|
// type="button"
|
||||||
|
// className="
|
||||||
|
// btn btn-danger btn-sm
|
||||||
|
// waves-effect waves-light
|
||||||
|
// btn-table
|
||||||
|
// mt-1
|
||||||
|
// mx-1
|
||||||
|
|
||||||
|
// "
|
||||||
|
// onClick={() => {
|
||||||
|
// handleDelete(userAddress._id);
|
||||||
|
// }}
|
||||||
|
// >
|
||||||
|
// Delete
|
||||||
|
// </button>
|
||||||
|
// </Link> */}
|
||||||
|
// <Link to={`/customers-details/${user?._id}`}>
|
||||||
|
// <button
|
||||||
|
// type="button"
|
||||||
|
// className="mt-1 btn btn-info btn-sm waves-effect waves-light btn-table ml-2"
|
||||||
|
// >
|
||||||
|
// View
|
||||||
|
// </button>
|
||||||
|
// </Link>
|
||||||
|
// </td>
|
||||||
|
// </tr>
|
||||||
|
// );
|
||||||
|
// })
|
||||||
|
<tr>
|
||||||
|
<th>Roshan Garg</th>
|
||||||
|
<th>roshan@gmail.com</th>
|
||||||
|
{/* <th>Profile Image</th> */}
|
||||||
|
<th>dashboard</th>
|
||||||
|
|
||||||
|
{/* <th>Last Purchase</th>
|
||||||
|
<th>Orders</th> */}
|
||||||
|
<th>
|
||||||
|
<button
|
||||||
|
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",
|
||||||
|
}}
|
||||||
|
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, users.length)} of{" "}
|
||||||
|
{users.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 >
|
||||||
|
users.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 >
|
||||||
|
users.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;
|
||||||
123
src/views/EmployeeAccess/addEmployee.js
Normal file
123
src/views/EmployeeAccess/addEmployee.js
Normal file
@ -0,0 +1,123 @@
|
|||||||
|
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";
|
||||||
|
|
||||||
|
const AddEmployee = () => {
|
||||||
|
const [employeeName, setEmployeeName] = useState("");
|
||||||
|
const [email, setEmail] = useState("");
|
||||||
|
const navigate = useNavigate();
|
||||||
|
const [checkedItems, setCheckedItems] = useState({});
|
||||||
|
const filteredNav = _nav.filter((item) => item.name !== "Employee");
|
||||||
|
const handleCheckboxChange = (name) => (event) => {
|
||||||
|
setCheckedItems({
|
||||||
|
...checkedItems,
|
||||||
|
[name]: event.target.checked,
|
||||||
|
});
|
||||||
|
};
|
||||||
|
console.log(checkedItems);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<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"
|
||||||
|
>
|
||||||
|
{" "}
|
||||||
|
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="welcomeMsgforDes" className="form-label">
|
||||||
|
Email*
|
||||||
|
</label>
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="email"
|
||||||
|
className="form-control"
|
||||||
|
// style={{ width: "300px" }}
|
||||||
|
id="welcomeMsgforDes"
|
||||||
|
placeholder="Eg: rosham@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={handleSaveClick}
|
||||||
|
style={{
|
||||||
|
fontWeight: "bold",
|
||||||
|
marginBottom: "1rem",
|
||||||
|
textTransform: "capitalize",
|
||||||
|
marginRight: "5px",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Save
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
variant="contained"
|
||||||
|
color="primary"
|
||||||
|
// onClick={handleCancelClick}
|
||||||
|
onClick={() => navigate("/employee")}
|
||||||
|
style={{
|
||||||
|
fontWeight: "bold",
|
||||||
|
marginBottom: "1rem",
|
||||||
|
textTransform: "capitalize",
|
||||||
|
marginRight: "5px",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Cancel
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</Box>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default AddEmployee;
|
||||||
Loading…
Reference in New Issue
Block a user