diff --git a/src/Components/Cards/BlueCard.jsx b/src/Components/Cards/BlueCard.jsx new file mode 100644 index 0000000..2e300bd --- /dev/null +++ b/src/Components/Cards/BlueCard.jsx @@ -0,0 +1,41 @@ +import { Box, Stack, Text, } from '@chakra-ui/react' +import React from 'react' +import { MdGroups } from 'react-icons/md' + +function BlueCard() { + return ( + + + + + + + + {item.title} + + + + {item.count} + + + + + + + + {item.linkText} + + + + ) +} + +export default BlueCard \ No newline at end of file diff --git a/src/Components/CutomBreadcrumb.jsx b/src/Components/CutomBreadcrumb.jsx index 994b437..caef079 100644 --- a/src/Components/CutomBreadcrumb.jsx +++ b/src/Components/CutomBreadcrumb.jsx @@ -46,7 +46,9 @@ const CustomBreadcrumb = () => { breadcrumbs.push({ path: currentPath, title: menuItem.title }); } else { // For nested paths without direct match, create a custom breadcrumb title - const customTitle = part.replace(/-/g, " ").replace(/\b\w/g, (c) => c.toUpperCase()); + const customTitle = part + .replace(/-/g, " ") + .replace(/\b\w/g, (c) => c.toUpperCase()); breadcrumbs.push({ path: currentPath, title: customTitle }); } }); @@ -68,7 +70,7 @@ const CustomBreadcrumb = () => { mt={1} borderBottom={"1px dashed #DEE2E6"} > - + Dashboard + */} {breadcrumbs.map((item, index) => ( - - - {/* */} - / - - + + + + / + ))} diff --git a/src/Contexts/GlobalStateProvider.jsx b/src/Contexts/GlobalStateProvider.jsx index b37250d..0ee0621 100644 --- a/src/Contexts/GlobalStateProvider.jsx +++ b/src/Contexts/GlobalStateProvider.jsx @@ -9,7 +9,17 @@ import { HiOutlineReceiptPercent } from "react-icons/hi2"; import { IoMdQrScanner } from "react-icons/io"; import { GrDocumentPdf } from "react-icons/gr"; import { AiOutlineFileGif } from "react-icons/ai"; - +import { MdOutlineNoFood } from "react-icons/md"; +import { LuFuel } from "react-icons/lu"; +import { GoGift } from "react-icons/go"; +import { FaWifi } from "react-icons/fa"; +import { SiBookstack } from "react-icons/si"; +import Food from "../assets/icons/Food.png"; +import Fuel from "../assets/icons/Fuel.png"; +import Gift from "../assets/icons/gift.png"; +import books from "../assets/icons/bookStack.png" +import telecom from "../assets/icons/telecom.png" +import gadget from "../assets/icons/gadget.png" const getRandomDate = (start, end) => { const date = new Date( start.getTime() + Math.random() * (end.getTime() - start.getTime()) @@ -44,238 +54,237 @@ const GlobalStateProvider = ({ children }) => { const [employees, setEmployees] = useState([ { - "id": 1, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 1, + EmpID: "124589", + Name: "Jackson", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, { - "id": 2, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 2, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, { - "id": 3, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 3, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, { - "id": 4, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 4, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, { - "id": 5, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Inactive", + id: 5, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Inactive", }, { - "id": 6, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Inactive", + id: 6, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Inactive", }, { - "id": 7, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 7, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, { - "id": 8, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Inactive", + id: 8, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Inactive", }, { - "id": 9, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 9, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, { - "id": 10, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 10, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, { - "id": 11, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Inactive", + id: 11, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Inactive", }, { - "id": 7, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 7, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, { - "id": 8, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 8, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, { - "id": 9, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 9, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, { - "id": 10, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Inactive", + id: 10, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Inactive", }, { - "id": 11, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 11, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, { - "id": 7, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 7, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, { - "id": 8, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 8, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, { - "id": 9, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 9, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, { - "id": 10, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 10, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, { - "id": 11, - "EmpID": "124589", - "Name": "Status", - "emailAddress": "in***@wdimails.com", - "mobileNumber": "+91 ***8451254", - "Grade": "L1", - "Department": "Sales", - "Role": "Sr. Manager", - "status": "Active", + id: 11, + EmpID: "124589", + Name: "Status", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 ***8451254", + Grade: "L1", + Department: "Sales", + Role: "Sr. Manager", + status: "Active", }, - ] - ) + ]); const [reportsHistory, setReportsHistory] = useState([ { @@ -448,179 +457,515 @@ const GlobalStateProvider = ({ children }) => { }, ]); + // const [department, setDepartment] = useState([ + // { + // "id": 1, + // "department": "FInance", + // "role": "Sr. Manager", + // "createdBy": "Reethik Thota", + // "dateTime": "12 June 2024, 10.00 am", + // "approvedBy": "Pooja Patade", + // }, + // { + // "id": 2, + // "department": "FInance", + // "role": "Sr. Manager", + // "createdBy": "Reethik Thota", + // "dateTime": "12 June 2024, 10.00 am", + // "approvedBy": "Pooja Patade", + // }, + // { + // "id": 3, + // "department": "FInance", + // "role": "Sr. Manager", + // "createdBy": "Reethik Thota", + // "dateTime": "12 June 2024, 10.00 am", + // "approvedBy": "Pooja Patade", + // }, + // { + // "id": 4, + // "department": "FInance", + // "role": "Sr. Manager", + // "createdBy": "Reethik Thota", + // "dateTime": "12 June 2024, 10.00 am", + // "approvedBy": "Pooja Patade", + // }, + // { + // "id": 5, + // "department": "FInance", + // "role": "Sr. Manager", + // "createdBy": "Reethik Thota", + // "dateTime": "12 June 2024, 10.00 am", + // "approvedBy": "Pooja Patade", + // }, + // { + // "id": 6, + // "department": "FInance", + // "role": "Sr. Manager", + // "createdBy": "Reethik Thota", + // "dateTime": "12 June 2024, 10.00 am", + // "approvedBy": "Pooja Patade", + // }, + // { + // "id": 7, + // "department": "FInance", + // "role": "Sr. Manager", + // "createdBy": "Reethik Thota", + // "dateTime": "12 June 2024, 10.00 am", + // "approvedBy": "Pooja Patade", + // }, + // { + // "id": 8, + // "department": "FInance", + // "role": "Sr. Manager", + // "createdBy": "Reethik Thota", + // "dateTime": "12 June 2024, 10.00 am", + // "approvedBy": "Pooja Patade", + // }, + // { + // "id": 9, + // "department": "FInance", + // "role": "Sr. Manager", + // "createdBy": "Reethik Thota", + // "dateTime": "12 June 2024, 10.00 am", + // "approvedBy": "Pooja Patade", + // }, + // { + // "id": 10, + // "department": "FInance", + // "role": "Sr. Manager", + // "createdBy": "Reethik Thota", + // "dateTime": "12 June 2024, 10.00 am", + // "approvedBy": "Pooja Patade", + // }, + // ]); + + // const [roles, setRoles] = useState([ + // { + // "id": 1, + // "role": "Sr Manager", + // "department": "Finance", + // "createdDuration": "11 June 2024, 10 am", + // "createdBy": "Pooja Patade", + // "permissions": "Subadmin", + // "status": "Published", + // }, + // { + // "id": 2, + // "role": "Sr Manager", + // "department": "Finance", + // "createdDuration": "11 June 2024, 10 am", + // "createdBy": "Pooja Patade", + // "permissions": "Subadmin", + // "status": "Published", + // }, + // { + // "id": 3, + // "role": "Sr Manager", + // "department": "Finance", + // "createdDuration": "11 June 2024, 10 am", + // "createdBy": "Pooja Patade", + // "permissions": "Subadmin", + // "status": "Saved as draft", + // }, + // { + // "id": 4, + // "role": "Sr Manager", + // "department": "Finance", + // "createdDuration": "11 June 2024, 10 am", + // "createdBy": "Pooja Patade", + // "permissions": "Subadmin", + // "status": "Published", + // }, + // { + // "id": 5, + // "role": "Sr Manager", + // "department": "Finance", + // "createdDuration": "11 June 2024, 10 am", + // "createdBy": "Pooja Patade", + // "permissions": "Subadmin", + // "status": "Saved as draft", + // }, + // { + // "id": 6, + // "role": "Sr Manager", + // "department": "Finance", + // "createdDuration": "11 June 2024, 10 am", + // "createdBy": "Pooja Patade", + // "permissions": "Subadmin", + // "status": "Saved as draft", + // }, + // { + // "id": 7, + // "role": "Sr Manager", + // "department": "Finance", + // "createdDuration": "11 June 2024, 10 am", + // "createdBy": "Pooja Patade", + // "permissions": "Subadmin", + // "status": "Saved as draft", + // }, + // { + // "id": 8, + // "role": "Sr Manager", + // "department": "Finance", + // "createdDuration": "11 June 2024, 10 am", + // "createdBy": "Pooja Patade", + // "permissions": "Subadmin", + // "status": "Saved as draft", + // }, + // { + // "id": 9, + // "role": "Sr Manager", + // "department": "Finance", + // "createdDuration": "11 June 2024, 10 am", + // "createdBy": "Pooja Patade", + // "permissions": "Subadmin", + // "status": "Published", + // }, + // { + // "id": 10, + // "role": "Sr Manager", + // "department": "Finance", + // "createdDuration": "11 June 2024, 10 am", + // "createdBy": "Pooja Patade", + // "permissions": "Subadmin", + // "status": "Saved as draft", + // }, + // { + // id: 2, + // name: "Travel Reimbursement - Q2 2024", + // lastUpdated: "15-08-2024 02:45 pm", + // reportType: "Expense", + // totalExpense: 1250.0, + // status: "Approved", + // }, + // { + // id: 3, + // name: "Client Meeting Expenses - August 2024", + // lastUpdated: "28-08-2024 09:30 am", + // reportType: "Expense", + // totalExpense: 600.5, + // status: "Fully Reimbursed", + // }, + // { + // id: 4, + // name: "Marketing Campaign - Q3 2024", + // lastUpdated: "10-09-2024 11:00 am", + // reportType: "Expense", + // totalExpense: 2300.0, + // status: "Disapproved", + // }, + // { + // id: 5, + // name: "Team Building Event - September 2024", + // lastUpdated: "22-09-2024 04:20 pm", + // reportType: "Expense", + // totalExpense: 800.0, + // status: "Fully Reimbursed", + // }, + // { + // id: 6, + // name: "Office Renovation - Phase 1", + // lastUpdated: "30-09-2024 03:10 pm", + // reportType: "Expense", + // totalExpense: 4500.0, + // status: "Saved", + // }, + // { + // id: 7, + // name: "Software Licenses - 2024 Renewal", + // lastUpdated: "05-10-2024 01:50 pm", + // reportType: "Expense", + // totalExpense: 3200.0, + // status: "Saved", + // }, + // { + // id: 8, + // name: "Conference Attendance - October 2024", + // lastUpdated: "15-10-2024 09:00 am", + // reportType: "Expense", + // totalExpense: 1500.0, + // status: "Partially Reimbursed", + // }, + // { + // id: 9, + // name: "Holiday Party - December 2024", + // lastUpdated: "20-12-2024 05:30 pm", + // reportType: "Expense", + // totalExpense: 2500.0, + // status: "Saved", + // }, + // { + // id: 10, + // name: "Client Gifts - End of Year 2024", + // lastUpdated: "31-12-2024 02:00 pm", + // reportType: "Expense", + // totalExpense: 1200.0, + // status: "Approved", + // }, + // { + // id: 11, + // name: "Training Programs - January 2025", + // lastUpdated: "15-01-2025 10:30 am", + // reportType: "Expense", + // totalExpense: 900.0, + // status: "Saved", + // }, + // { + // id: 7, + // name: "Software Licenses - 2024 Renewal", + // lastUpdated: "05-10-2024 01:50 pm", + // reportType: "Expense", + // totalExpense: 3200.0, + // status: "Saved", + // }, + // { + // id: 8, + // name: "Conference Attendance - October 2024", + // lastUpdated: "15-10-2024 09:00 am", + // reportType: "Expense", + // totalExpense: 1500.0, + // status: "Partially Reimbursed", + // }, + // { + // id: 9, + // name: "Holiday Party - December 2024", + // lastUpdated: "20-12-2024 05:30 pm", + // reportType: "Expense", + // totalExpense: 2500.0, + // status: "Saved", + // }, + // { + // id: 10, + // name: "Client Gifts - End of Year 2024", + // lastUpdated: "31-12-2024 02:00 pm", + // reportType: "Expense", + // totalExpense: 1200.0, + // status: "Approved", + // }, + // { + // id: 11, + // name: "Training Programs - January 2025", + // lastUpdated: "15-01-2025 10:30 am", + // reportType: "Expense", + // totalExpense: 900.0, + // status: "Saved", + // }, + // { + // id: 7, + // name: "Software Licenses - 2024 Renewal", + // lastUpdated: "05-10-2024 01:50 pm", + // reportType: "Expense", + // totalExpense: 3200.0, + // status: "Saved", + // }, + // { + // id: 8, + // name: "Conference Attendance - October 2024", + // lastUpdated: "15-10-2024 09:00 am", + // reportType: "Expense", + // totalExpense: 1500.0, + // status: "Partially Reimbursed", + // }, + // { + // id: 9, + // name: "Holiday Party - December 2024", + // lastUpdated: "20-12-2024 05:30 pm", + // reportType: "Expense", + // totalExpense: 2500.0, + // status: "Saved", + // }, + // { + // id: 10, + // name: "Client Gifts - End of Year 2024", + // lastUpdated: "31-12-2024 02:00 pm", + // reportType: "Expense", + // totalExpense: 1200.0, + // status: "Approved", + // }, + // { + // id: 11, + // name: "Training Programs - January 2025", + // lastUpdated: "15-01-2025 10:30 am", + // reportType: "Expense", + // totalExpense: 900.0, + // status: "Saved", + // }, + // ]); + const [department, setDepartment] = useState([ { - "id": 1, - "department": "FInance", - "role": "Sr. Manager", - "createdBy": "Reethik Thota", - "dateTime": "12 June 2024, 10.00 am", - "approvedBy": "Pooja Patade", + id: 1, + department: "FInance", + role: "Sr. Manager", + createdBy: "Reethik Thota", + dateTime: "12 June 2024, 10.00 am", + approvedBy: "Pooja Patade", }, { - "id": 2, - "department": "FInance", - "role": "Sr. Manager", - "createdBy": "Reethik Thota", - "dateTime": "12 June 2024, 10.00 am", - "approvedBy": "Pooja Patade", + id: 2, + department: "FInance", + role: "Sr. Manager", + createdBy: "Reethik Thota", + dateTime: "12 June 2024, 10.00 am", + approvedBy: "Pooja Patade", }, { - "id": 3, - "department": "FInance", - "role": "Sr. Manager", - "createdBy": "Reethik Thota", - "dateTime": "12 June 2024, 10.00 am", - "approvedBy": "Pooja Patade", + id: 3, + department: "FInance", + role: "Sr. Manager", + createdBy: "Reethik Thota", + dateTime: "12 June 2024, 10.00 am", + approvedBy: "Pooja Patade", }, { - "id": 4, - "department": "FInance", - "role": "Sr. Manager", - "createdBy": "Reethik Thota", - "dateTime": "12 June 2024, 10.00 am", - "approvedBy": "Pooja Patade", + id: 4, + department: "FInance", + role: "Sr. Manager", + createdBy: "Reethik Thota", + dateTime: "12 June 2024, 10.00 am", + approvedBy: "Pooja Patade", }, { - "id": 5, - "department": "FInance", - "role": "Sr. Manager", - "createdBy": "Reethik Thota", - "dateTime": "12 June 2024, 10.00 am", - "approvedBy": "Pooja Patade", + id: 5, + department: "FInance", + role: "Sr. Manager", + createdBy: "Reethik Thota", + dateTime: "12 June 2024, 10.00 am", + approvedBy: "Pooja Patade", }, { - "id": 6, - "department": "FInance", - "role": "Sr. Manager", - "createdBy": "Reethik Thota", - "dateTime": "12 June 2024, 10.00 am", - "approvedBy": "Pooja Patade", + id: 6, + department: "FInance", + role: "Sr. Manager", + createdBy: "Reethik Thota", + dateTime: "12 June 2024, 10.00 am", + approvedBy: "Pooja Patade", }, { - "id": 7, - "department": "FInance", - "role": "Sr. Manager", - "createdBy": "Reethik Thota", - "dateTime": "12 June 2024, 10.00 am", - "approvedBy": "Pooja Patade", + id: 7, + department: "FInance", + role: "Sr. Manager", + createdBy: "Reethik Thota", + dateTime: "12 June 2024, 10.00 am", + approvedBy: "Pooja Patade", }, { - "id": 8, - "department": "FInance", - "role": "Sr. Manager", - "createdBy": "Reethik Thota", - "dateTime": "12 June 2024, 10.00 am", - "approvedBy": "Pooja Patade", + id: 8, + department: "FInance", + role: "Sr. Manager", + createdBy: "Reethik Thota", + dateTime: "12 June 2024, 10.00 am", + approvedBy: "Pooja Patade", }, { - "id": 9, - "department": "FInance", - "role": "Sr. Manager", - "createdBy": "Reethik Thota", - "dateTime": "12 June 2024, 10.00 am", - "approvedBy": "Pooja Patade", + id: 9, + department: "FInance", + role: "Sr. Manager", + createdBy: "Reethik Thota", + dateTime: "12 June 2024, 10.00 am", + approvedBy: "Pooja Patade", }, { - "id": 10, - "department": "FInance", - "role": "Sr. Manager", - "createdBy": "Reethik Thota", - "dateTime": "12 June 2024, 10.00 am", - "approvedBy": "Pooja Patade", + id: 10, + department: "FInance", + role: "Sr. Manager", + createdBy: "Reethik Thota", + dateTime: "12 June 2024, 10.00 am", + approvedBy: "Pooja Patade", }, ]); const [roles, setRoles] = useState([ { - "id": 1, - "role": "Sr Manager", - "department": "Finance", - "createdDuration": "11 June 2024, 10 am", - "createdBy": "Pooja Patade", - "permissions": "Subadmin", - "status": "Published", + id: 1, + role: "Sr Manager", + department: "Finance", + createdDuration: "11 June 2024, 10 am", + createdBy: "Pooja Patade", + permissions: "Subadmin", + status: "Published", }, { - "id": 2, - "role": "Sr Manager", - "department": "Finance", - "createdDuration": "11 June 2024, 10 am", - "createdBy": "Pooja Patade", - "permissions": "Subadmin", - "status": "Published", + id: 2, + role: "Sr Manager", + department: "Finance", + createdDuration: "11 June 2024, 10 am", + createdBy: "Pooja Patade", + permissions: "Subadmin", + status: "Published", }, { - "id": 3, - "role": "Sr Manager", - "department": "Finance", - "createdDuration": "11 June 2024, 10 am", - "createdBy": "Pooja Patade", - "permissions": "Subadmin", - "status": "Saved as draft", + id: 3, + role: "Sr Manager", + department: "Finance", + createdDuration: "11 June 2024, 10 am", + createdBy: "Pooja Patade", + permissions: "Subadmin", + status: "Saved as draft", }, { - "id": 4, - "role": "Sr Manager", - "department": "Finance", - "createdDuration": "11 June 2024, 10 am", - "createdBy": "Pooja Patade", - "permissions": "Subadmin", - "status": "Published", + id: 4, + role: "Sr Manager", + department: "Finance", + createdDuration: "11 June 2024, 10 am", + createdBy: "Pooja Patade", + permissions: "Subadmin", + status: "Published", }, { - "id": 5, - "role": "Sr Manager", - "department": "Finance", - "createdDuration": "11 June 2024, 10 am", - "createdBy": "Pooja Patade", - "permissions": "Subadmin", - "status": "Saved as draft", + id: 5, + role: "Sr Manager", + department: "Finance", + createdDuration: "11 June 2024, 10 am", + createdBy: "Pooja Patade", + permissions: "Subadmin", + status: "Saved as draft", }, { - "id": 6, - "role": "Sr Manager", - "department": "Finance", - "createdDuration": "11 June 2024, 10 am", - "createdBy": "Pooja Patade", - "permissions": "Subadmin", - "status": "Saved as draft", + id: 6, + role: "Sr Manager", + department: "Finance", + createdDuration: "11 June 2024, 10 am", + createdBy: "Pooja Patade", + permissions: "Subadmin", + status: "Saved as draft", }, { - "id": 7, - "role": "Sr Manager", - "department": "Finance", - "createdDuration": "11 June 2024, 10 am", - "createdBy": "Pooja Patade", - "permissions": "Subadmin", - "status": "Saved as draft", + id: 7, + role: "Sr Manager", + department: "Finance", + createdDuration: "11 June 2024, 10 am", + createdBy: "Pooja Patade", + permissions: "Subadmin", + status: "Saved as draft", }, { - "id": 8, - "role": "Sr Manager", - "department": "Finance", - "createdDuration": "11 June 2024, 10 am", - "createdBy": "Pooja Patade", - "permissions": "Subadmin", - "status": "Saved as draft", + id: 8, + role: "Sr Manager", + department: "Finance", + createdDuration: "11 June 2024, 10 am", + createdBy: "Pooja Patade", + permissions: "Subadmin", + status: "Saved as draft", }, { - "id": 9, - "role": "Sr Manager", - "department": "Finance", - "createdDuration": "11 June 2024, 10 am", - "createdBy": "Pooja Patade", - "permissions": "Subadmin", - "status": "Published", + id: 9, + role: "Sr Manager", + department: "Finance", + createdDuration: "11 June 2024, 10 am", + createdBy: "Pooja Patade", + permissions: "Subadmin", + status: "Published", }, { - "id": 10, - "role": "Sr Manager", - "department": "Finance", - "createdDuration": "11 June 2024, 10 am", - "createdBy": "Pooja Patade", - "permissions": "Subadmin", - "status": "Saved as draft", + id: 10, + role: "Sr Manager", + department: "Finance", + createdDuration: "11 June 2024, 10 am", + createdBy: "Pooja Patade", + permissions: "Subadmin", + status: "Saved as draft", }, ]); @@ -838,54 +1183,241 @@ const GlobalStateProvider = ({ children }) => { }, ]); + // const [reimbursementStatus, setReimbursementStatus] = useState([ + // { + // "reportName": "Jan 12, 2022", + // "reportBy": "in***@wdimails.com", + // "reportAmount": "+91 ***8451254", + // "dateTime": "Sales", + // "orderStatus": "Approved", + // "approver": "Sales", + // "disburser": "Sales", + // }, + // { + // "reportName": "Jan 12, 2022", + // "reportBy": "in***@wdimails.com", + // "reportAmount": "+91 ***8451254", + // "dateTime": "Sales", + // "orderStatus": "Approved", + // "approver": "Sales", + // "disburser": "Sales", + // }, + // { + // "reportName": "Jan 12, 2022", + // "reportBy": "in***@wdimails.com", + // "reportAmount": "+91 ***8451254", + // "dateTime": "Sales", + // "orderStatus": "Approved", + // "approver": "Sales", + // "disburser": "Sales", + // }, + // { + // "reportName": "Jan 12, 2022", + // "reportBy": "in***@wdimails.com", + // "reportAmount": "+91 ***8451254", + // "dateTime": "Sales", + // "orderStatus": "Fully reimbursed", + // "approver": "Sales", + // "disburser": "Sales", + // }, + // { + // "reportName": "Jan 12, 2022", + // "reportBy": "in***@wdimails.com", + // "reportAmount": "+91 ***8451254", + // "dateTime": "Sales", + // "orderStatus": "Fully reimbursed", + // "approver": "Sales", + // "disburser": "Sales", + // } + // ]); const [reimbursementStatus, setReimbursementStatus] = useState([ { - "reportName": "Jan 12, 2022", - "reportBy": "in***@wdimails.com", - "reportAmount": "+91 ***8451254", - "dateTime": "Sales", - "orderStatus": "Approved", - "approver": "Sales", - "disburser": "Sales", + reportName: "Jan 12, 2022", + reportBy: "in***@wdimails.com", + reportAmount: "+91 ***8451254", + dateTime: "Sales", + orderStatus: "Approved", + approver: "Sales", + disburser: "Sales", }, { - "reportName": "Jan 12, 2022", - "reportBy": "in***@wdimails.com", - "reportAmount": "+91 ***8451254", - "dateTime": "Sales", - "orderStatus": "Approved", - "approver": "Sales", - "disburser": "Sales", + reportName: "Jan 12, 2022", + reportBy: "in***@wdimails.com", + reportAmount: "+91 ***8451254", + dateTime: "Sales", + orderStatus: "Approved", + approver: "Sales", + disburser: "Sales", }, { - "reportName": "Jan 12, 2022", - "reportBy": "in***@wdimails.com", - "reportAmount": "+91 ***8451254", - "dateTime": "Sales", - "orderStatus": "Approved", - "approver": "Sales", - "disburser": "Sales", + reportName: "Jan 12, 2022", + reportBy: "in***@wdimails.com", + reportAmount: "+91 ***8451254", + dateTime: "Sales", + orderStatus: "Approved", + approver: "Sales", + disburser: "Sales", }, { - "reportName": "Jan 12, 2022", - "reportBy": "in***@wdimails.com", - "reportAmount": "+91 ***8451254", - "dateTime": "Sales", - "orderStatus": "Fully reimbursed", - "approver": "Sales", - "disburser": "Sales", + reportName: "Jan 12, 2022", + reportBy: "in***@wdimails.com", + reportAmount: "+91 ***8451254", + dateTime: "Sales", + orderStatus: "Fully reimbursed", + approver: "Sales", + disburser: "Sales", }, { - "reportName": "Jan 12, 2022", - "reportBy": "in***@wdimails.com", - "reportAmount": "+91 ***8451254", - "dateTime": "Sales", - "orderStatus": "Fully reimbursed", - "approver": "Sales", - "disburser": "Sales", + reportName: "Jan 12, 2022", + reportBy: "in***@wdimails.com", + reportAmount: "+91 ***8451254", + dateTime: "Sales", + orderStatus: "Fully reimbursed", + approver: "Sales", + disburser: "Sales", }, - ] - ) + ]); + + // const [advanceStatus, setAdvanceStatus] = useState([ + // { + // reportName: "Jan 12, 2022", + // reportBy: "in***@wdimails.com", + // reportAmount: "+91 ***8451254", + // dateTime: "Sales", + // orderStatus: "Approved", + // approver: "Sales", + // disburser: "Sales", + // }, + // { + // reportName: "Jan 12, 2022", + // reportBy: "in***@wdimails.com", + // reportAmount: "+91 ***8451254", + // dateTime: "Sales", + // orderStatus: "Approved", + // approver: "Sales", + // disburser: "Sales", + // }, + // { + // reportName: "Jan 12, 2022", + // reportBy: "in***@wdimails.com", + // reportAmount: "+91 ***8451254", + // dateTime: "Sales", + // orderStatus: "Approved", + // approver: "Sales", + // disburser: "Sales", + // }, + // { + // reportName: "Jan 12, 2022", + // reportBy: "in***@wdimails.com", + // reportAmount: "+91 ***8451254", + // dateTime: "Sales", + // orderStatus: "Fully reimbursed", + // approver: "Sales", + // disburser: "Sales", + // }, + // { + // reportName: "Jan 12, 2022", + // reportBy: "in***@wdimails.com", + // reportAmount: "+91 ***8451254", + // dateTime: "Sales", + // orderStatus: "Fully reimbursed", + // approver: "Sales", + // disburser: "Sales", + // }, + // ]); + + // const [digital, setDigital] = useState([ + // { + // id: 1, + // orderid: "#451245", + // laodStatus: "Fully Loaded", + // dateTime: "10 June 2024, 10am", + // totalvaluation: "₹ 70,000", + // activationStatus: "Active", + // CardDeliveryStatus: "Delivered", + // quantity: "500", + // }, + // { + // id: 2, + // orderid: "#451245", + // laodStatus: "Fully Loaded", + // dateTime: "10 June 2024, 10am", + // totalvaluation: "₹ 70,000", + // activationStatus: "Active", + // CardDeliveryStatus: "Not Delivered", + // quantity: "500", + // }, + // { + // id: 3, + // orderid: "#451245", + // laodStatus: "Fully Loaded", + // dateTime: "10 June 2024, 10am", + // totalvaluation: "₹ 70,000", + // activationStatus: "Activate", + // CardDeliveryStatus: "Delivered", + // quantity: "500", + // }, + // { + // id: 3, + // orderid: "#451245", + // laodStatus: "Fully Loaded", + // dateTime: "10 June 2024, 10am", + // totalvaluation: "₹ 70,000", + // activationStatus: "Partially Active", + // CardDeliveryStatus: "Partially Delivered", + // quantity: "500", + // }, + // { + // id: 4, + // orderid: "#451245", + // laodStatus: "Fully Loaded", + // dateTime: "10 June 2024, 10am", + // totalvaluation: "₹ 70,000", + // activationStatus: "Active", + // CardDeliveryStatus: "Not Delivered", + // quantity: "500", + // }, + // { + // id: 5, + // orderid: "#451245", + // laodStatus: "Fully Loaded", + // dateTime: "10 June 2024, 10am", + // totalvaluation: "₹ 70,000", + // activationStatus: "Partially Active", + // CardDeliveryStatus: "Not Delivered", + // quantity: "500", + // }, + // { + // id: 6, + // orderid: "#451245", + // laodStatus: "Fully Loaded", + // dateTime: "10 June 2024, 10am", + // totalvaluation: "₹ 70,000", + // activationStatus: "Active", + // CardDeliveryStatus: "Delivered", + // quantity: "500", + // }, + // { + // id: 7, + // orderid: "#451245", + // laodStatus: "Fully Loaded", + // dateTime: "10 June 2024, 10am", + // totalvaluation: "₹ 70,000", + // activationStatus: "Activate", + // CardDeliveryStatus: "Delivered", + // quantity: "500", + // }, + // { + // id: 8, + // orderid: "#451245", + // laodStatus: "Fully Loaded", + // dateTime: "10 June 2024, 10am", + // totalvaluation: "₹ 70,000", + // activationStatus: "Activate", + // CardDeliveryStatus: "Delivered", + // quantity: "500", + // }, + // ]); // const [advanceStatus, setAdvanceStatus] = useState([ // { @@ -1031,89 +1563,7 @@ const GlobalStateProvider = ({ children }) => { }, ]) - const [ApplicationStatus, setApplicationStatus] = useState([ - { - EmpID: 124589, - Name: "Pooja Shah", - emailAddress: "in***@wdimails.com", - mobileNumber: "+91 *** 154874", - Department: "Sales", - LoadStatus: "10,000", - ActiveStatus: "Active" - }, - { - EmpID: 124589, - Name: "Pooja Shah", - emailAddress: "in***@wdimails.com", - mobileNumber: "+91 *** 154874", - Department: "Sales", - LoadStatus: "10,000", - ActiveStatus: "Activate" - }, - { - EmpID: 124589, - Name: "Pooja Shah", - emailAddress: "in***@wdimails.com", - mobileNumber: "+91 *** 154874", - Department: "Sales", - LoadStatus: "load Card", - ActiveStatus: "Activate" - }, - { - EmpID: 124589, - Name: "Pooja Shah", - emailAddress: "in***@wdimails.com", - mobileNumber: "+91 *** 154874", - Department: "Sales", - LoadStatus: "10,000", - ActiveStatus: "Active" - }, - { - EmpID: 124589, - Name: "Pooja Shah", - emailAddress: "in***@wdimails.com", - mobileNumber: "+91 *** 154874", - Department: "Sales", - LoadStatus: "load Card", - ActiveStatus: "Activate" - }, - { - EmpID: 124589, - Name: "Pooja Shah", - emailAddress: "in***@wdimails.com", - mobileNumber: "+91 *** 154874", - Department: "Sales", - LoadStatus: "load Card", - ActiveStatus: "Activate" - }, - { - EmpID: 124589, - Name: "Pooja Shah", - emailAddress: "in***@wdimails.com", - mobileNumber: "+91 *** 154874", - Department: "Sales", - LoadStatus: "10,000", - ActiveStatus: "Activate" - }, - { - EmpID: 124589, - Name: "Pooja Shah", - emailAddress: "in***@wdimails.com", - mobileNumber: "+91 *** 154874", - Department: "Sales", - LoadStatus: "10,000", - ActiveStatus: "Activate" - }, - { - EmpID: 124589, - Name: "Pooja Shah", - emailAddress: "in***@wdimails.com", - mobileNumber: "+91 *** 154874", - Department: "Sales", - LoadStatus: "load Card", - ActiveStatus: "Activate" - }, - ]) + const [AdvanceExpenseRequest, setAdvanceExpenseRequest] = useState([ { @@ -1225,6 +1675,211 @@ const GlobalStateProvider = ({ children }) => { "Action": "" }, ]) + const [ApplicationStatus, setApplicationStatus] = useState([ + { + EmpID: 124589, + Name: "Pooja Shah", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 *** 154874", + Department: "Sales", + LoadStatus: "10,000", + ActiveStatus: "Active", + emailAddressMobile: "+91 *** 154874", + MemberSince: "5 July, 2023", + Action: "Activate card", + }, + { + EmpID: 124589, + Name: "Pooja Shah", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 *** 154874", + Department: "Sales", + LoadStatus: "10,000", + ActiveStatus: "Activate", + emailAddressMobile: "in***@wdimails.com", + MemberSince: "5 July, 2023", + Action: "Activate card", + }, + { + EmpID: 124589, + Name: "Pooja Shah", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 *** 154874", + Department: "Sales", + LoadStatus: "load Card", + ActiveStatus: "Activate", + emailAddressMobile: "+91 *** 154874", + MemberSince: "5 July, 2023", + Action: "Load card", + }, + { + EmpID: 124589, + Name: "Pooja Shah", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 *** 154874", + Department: "Sales", + LoadStatus: "10,000", + ActiveStatus: "Active", + emailAddressMobile: "+91 *** 154874", + MemberSince: "5 July, 2023", + Action: "Load card", + }, + { + EmpID: 124589, + Name: "Pooja Shah", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 *** 154874", + Department: "Sales", + LoadStatus: "load Card", + ActiveStatus: "Activate", + emailAddressMobile: "in***@wdimails.com", + MemberSince: "5 July, 2023", + Action: "Load card", + }, + { + EmpID: 124589, + Name: "Pooja Shah", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 *** 154874", + Department: "Sales", + LoadStatus: "load Card", + ActiveStatus: "Activate", + emailAddressMobile: "in***@wdimails.com", + MemberSince: "5 July, 2023", + Action: "Activate card", + }, + { + EmpID: 124589, + Name: "Pooja Shah", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 *** 154874", + Department: "Sales", + LoadStatus: "10,000", + ActiveStatus: "Activate", + emailAddressMobile: "in***@wdimails.com", + MemberSince: "5 July, 2023", + Action: "Activate card", + }, + { + EmpID: 124589, + Name: "Pooja Shah", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 *** 154874", + Department: "Sales", + LoadStatus: "10,000", + ActiveStatus: "Activate", + emailAddressMobile: "in***@wdimails.com", + MemberSince: "5 July, 2023", + Action: "Load card", + }, + { + EmpID: 124589, + Name: "Pooja Shah", + emailAddress: "in***@wdimails.com", + mobileNumber: "+91 *** 154874", + Department: "Sales", + LoadStatus: "load Card", + ActiveStatus: "Activate", + emailAddressMobile: "in***@wdimails.com", + MemberSince: "5 July, 2023", + Action: "Activate card", + }, + ]); + + const [walletProgram, setWalletProgram] = useState( + [ + { + id: 1, + walletName: [{ name: "Food", icon: Food }], + WalletType : "Prefilled", + department :"sales", + status :"Active", + WalletAmount :"₹ 50,000", + CreatedOn :"Jan 12, 2022", + CreatedBy:"Jenny wilson" + }, + { + id: 2, + walletName: [{ name: "Fuel", icon: Fuel }], + WalletType : "Prefilled", + department :"sales", + status :"Active", + WalletAmount :"₹ 50,000", + CreatedOn :"Jan 12, 2022", + CreatedBy:"Jenny wilson" + }, + { + id: 3, + walletName: [{ name: "Gift", icon: Gift }], + WalletType : "Prefilled", + department :"sales", + status :"Active", + WalletAmount :"₹ 50,000", + CreatedOn :"Jan 12, 2022", + CreatedBy:"Jenny wilson" + }, + { + id: 4, + walletName: [{ name: "Telecom", icon: telecom }], + WalletType : "Prefilled", + department :"sales", + status :"Saved as draft", + WalletAmount :"₹ 50,000", + CreatedOn :"Jan 12, 2022", + CreatedBy:"Jenny wilson" + }, + { + id: 5, + walletName: [{ name: "Books & periodicals", icon: books }], + WalletType : "Prefilled", + department :"sales", + status :"Active", + WalletAmount :"₹ 50,000", + CreatedOn :"Jan 12, 2022", + CreatedBy:"Jenny wilson" + }, + { + id: 6, + walletName: [{ name: "Learning & development", icon: books }], + WalletType : "Prefilled", + department :"sales", + status :"Active", + WalletAmount :"₹ 50,000", + CreatedOn :"Jan 12, 2022", + CreatedBy:"Jenny wilson" + }, + { + id: 7, + walletName: [{ name: "Gadget & equipment", icon: gadget }], + WalletType : "Prefilled", + department :"sales", + status :"Active", + WalletAmount :"₹ 50,000", + CreatedOn :"Jan 12, 2022", + CreatedBy:"Jenny wilson" + }, + { + id: 8, + walletName: [{ name: "Telecom", icon: telecom }], + WalletType : "Prefilled", + department :"sales", + status :"Pending", + WalletAmount :"₹ 50,000", + CreatedOn :"Jan 12, 2022", + CreatedBy:"Jenny wilson" + }, + { + id: 9, + walletName: [{ name: "Food", icon: Food }], + WalletType : "Prefilled", + department :"sales", + status :"Pending", + WalletAmount :"₹ 50,000", + CreatedOn :"Jan 12, 2022", + CreatedBy:"Jenny wilson" + }, + ] +); return ( { AdvanceExpenseRequest, setAdvanceExpenseRequest, AdvanceExpenseRequestView, - setAdvanceExpenseRequestView + setAdvanceExpenseRequestView, + walletProgram }} > {children} diff --git a/src/Pages/Onboarding/Header.jsx b/src/Pages/Onboarding/Header.jsx index 83ee191..7f696a2 100644 --- a/src/Pages/Onboarding/Header.jsx +++ b/src/Pages/Onboarding/Header.jsx @@ -20,7 +20,7 @@ const Header = () => { {navLinks.map((link, index) => ( {
{ py={6} px={4} borderRadius={'md'} - minH={"82vh"} + maxH={"82.9vh"} + overflowY={"auto"} + sx={{ + /* Custom scrollbar styling */ + '&::-webkit-scrollbar': { + width: '6px', + }, + '&::-webkit-scrollbar-thumb': { + backgroundColor: '#6311CB', + borderRadius: '6px', + }, + '&::-webkit-scrollbar-track': { + backgroundColor: '#F6F0FF', + }, + }} > @@ -141,6 +155,7 @@ const handleNext = () => { orientation="vertical" h="400" gap="0" + my={"5"} sx={{ '--stepper-accent-color': '#6311CB' }} > {steps.map((step, index) => ( @@ -184,7 +199,21 @@ const handleNext = () => { my={5} boxShadow={'md'} zIndex={2} - minH={"82vh"} + maxH="calc(82vh - 0px)" + overflowY={"auto"} + sx={{ + /* Custom scrollbar styling */ + '&::-webkit-scrollbar': { + width: '6px', + }, + '&::-webkit-scrollbar-thumb': { + backgroundColor: '#6311CB', + borderRadius: '6px', + }, + '&::-webkit-scrollbar-track': { + backgroundColor: '#F6F0FF', + }, + }} > diff --git a/src/Pages/Onboarding/OnboardingSelectPackageModalChild.jsx b/src/Pages/Onboarding/OnboardingSelectPackageModalChild.jsx index fa7a2fa..bef9b63 100644 --- a/src/Pages/Onboarding/OnboardingSelectPackageModalChild.jsx +++ b/src/Pages/Onboarding/OnboardingSelectPackageModalChild.jsx @@ -27,6 +27,8 @@ const OnboardingSelectPackageModalChild = ({isOpen,onClose}) => { }, 3000); }; return ( + + <> diff --git a/src/Pages/OptiFiiExpense/Grid/ActiveCards.jsx b/src/Pages/OptiFiiExpense/Grid/ActiveCards.jsx new file mode 100644 index 0000000..d233589 --- /dev/null +++ b/src/Pages/OptiFiiExpense/Grid/ActiveCards.jsx @@ -0,0 +1,183 @@ +import { Box, Button, Image, Text } from "@chakra-ui/react"; +import React from "react"; +import Food from "../../../assets/icons/Food.png"; +import Fuel from "../../../assets/icons/Fuel.png"; +import Gift from "../../../assets/icons/gift.png"; +import Telecom from "../../../assets/icons/telecom.png"; +import { SlOptionsVertical } from "react-icons/sl"; + +const data = [ + { + icon: Food, + name: "Food", + subtitle: "Created on 12 June 2024", + walletType: "Prefilled", + department: "Sales", + walletamount: "₹ 50,000", + CreatedBy: "Kartikey Gautam", + ApprovedBy: "Manav Sain", + Status: "Active", + }, + { + icon: Fuel, + name: "Fuel", + subtitle: "Created on 12 June 2024", + walletType: "Prefilled", + department: "Sales", + walletamount: "₹ 50,000", + CreatedBy: "Kartikey Gautam", + ApprovedBy: "Manav Sain", + Status: "Active", + }, + { + icon: Gift, + name: "Gift", + subtitle: "Created on 12 June 2024", + walletType: "Prefilled", + department: "Sales", + walletamount: "₹ 50,000", + CreatedBy: "Kartikey Gautam", + ApprovedBy: "Manav Sain", + Status: "Active", + }, + { + icon: Telecom, + name: "Telecom", + subtitle: "Created on 12 June 2024", + walletType: "Prefilled", + department: "Sales", + walletamount: "₹ 50,000", + CreatedBy: "Kartikey Gautam", + ApprovedBy: "Manav Sain", + Status: "Active", + }, +]; + +const ActiveCards = () => { + return ( + + {data.map((item) => { + return ( + + + + + {item?.name} + + {item?.subtitle} + + + + + + + + + + + + + Wallet type + + + {item?.walletType} + + + + + + Department + + + {item?.department} + + + + + + Wallet amount + + + {item?.walletamount} + + + + + + + Created by + + + {item?.CreatedBy} + + + + + + Approved by + + + {item?.ApprovedBy} + + + + + + ); + })} + + ); +}; + +export default ActiveCards; diff --git a/src/Pages/OptiFiiExpense/Grid/Decline.jsx b/src/Pages/OptiFiiExpense/Grid/Decline.jsx new file mode 100644 index 0000000..57ffdea --- /dev/null +++ b/src/Pages/OptiFiiExpense/Grid/Decline.jsx @@ -0,0 +1,183 @@ +import { Box, Button, Image, Text } from "@chakra-ui/react"; +import React from "react"; +import Food from "../../../assets/icons/Food.png"; +import Fuel from "../../../assets/icons/Fuel.png"; +import Gift from "../../../assets/icons/gift.png"; +import Telecom from "../../../assets/icons/telecom.png"; +import { SlOptionsVertical } from "react-icons/sl"; + +const data = [ + { + icon: Food, + name: "Food", + subtitle: "Created on 12 June 2024", + walletType: "Prefilled", + department: "Sales", + walletamount: "₹ 50,000", + CreatedBy: "Kartikey Gautam", + ApprovedBy: "Manav Sain", + Status: "DECLINED", + }, + { + icon: Fuel, + name: "Fuel", + subtitle: "Created on 12 June 2024", + walletType: "Prefilled", + department: "Sales", + walletamount: "₹ 50,000", + CreatedBy: "Kartikey Gautam", + ApprovedBy: "Manav Sain", + Status: "DECLINED", + }, + { + icon: Gift, + name: "Gift", + subtitle: "Created on 12 June 2024", + walletType: "Prefilled", + department: "Sales", + walletamount: "₹ 50,000", + CreatedBy: "Kartikey Gautam", + ApprovedBy: "Manav Sain", + Status: "DECLINED", + }, + { + icon: Telecom, + name: "Telecom", + subtitle: "Created on 12 June 2024", + walletType: "Prefilled", + department: "Sales", + walletamount: "₹ 50,000", + CreatedBy: "Kartikey Gautam", + ApprovedBy: "Manav Sain", + Status: "DECLINED", + }, +]; + +const Decline = () => { + return ( + + {data.map((item) => { + return ( + + + + + {item?.name} + + {item?.subtitle} + + + + + + + + + + + + + Wallet type + + + {item?.walletType} + + + + + + Department + + + {item?.department} + + + + + + Wallet amount + + + {item?.walletamount} + + + + + + + Created by + + + {item?.CreatedBy} + + + + + + Approved by + + + {item?.ApprovedBy} + + + + + + ); + })} + + ); +}; + +export default Decline; diff --git a/src/Pages/OptiFiiExpense/Grid/PendingApproval.jsx b/src/Pages/OptiFiiExpense/Grid/PendingApproval.jsx new file mode 100644 index 0000000..45a49c6 --- /dev/null +++ b/src/Pages/OptiFiiExpense/Grid/PendingApproval.jsx @@ -0,0 +1,185 @@ +import { Box, Button, Image, Text } from "@chakra-ui/react"; +import React from "react"; +import Food from "../../../assets/icons/Food.png"; +import Fuel from "../../../assets/icons/Fuel.png"; +import Gift from "../../../assets/icons/gift.png"; +import Telecom from "../../../assets/icons/telecom.png"; +import { SlOptionsVertical } from "react-icons/sl"; + +const data = [ + { + icon: Food, + name: "Food", + subtitle: "Created on 12 June 2024", + walletType: "Prefilled", + department: "Sales", + walletamount: "₹ 50,000", + CreatedBy: "Kartikey Gautam", + ApprovedBy: "Manav Sain", + Status: "PENDING FOR APPROVAL", + }, + { + icon: Fuel, + name: "Fuel", + subtitle: "Created on 12 June 2024", + walletType: "Prefilled", + department: "Sales", + walletamount: "₹ 50,000", + CreatedBy: "Kartikey Gautam", + ApprovedBy: "Manav Sain", + Status: "PENDING FOR APPROVAL", + }, + { + icon: Gift, + name: "Gift", + subtitle: "Created on 12 June 2024", + walletType: "Prefilled", + department: "Sales", + walletamount: "₹ 50,000", + CreatedBy: "Kartikey Gautam", + ApprovedBy: "Manav Sain", + Status: "PENDING FOR APPROVAL", + }, + { + icon: Telecom, + name: "Telecom", + subtitle: "Created on 12 June 2024", + walletType: "Prefilled", + department: "Sales", + walletamount: "₹ 50,000", + CreatedBy: "Kartikey Gautam", + ApprovedBy: "Manav Sain", + Status: "PENDING FOR APPROVAL", + }, +]; + +const PendingApproval = () => { + return ( + + {data.map((item) => { + return ( + + + + + {item?.name} + + {item?.subtitle} + + + + + + + + + + + + + Wallet type + + + {item?.walletType} + + + + + + Department + + + {item?.department} + + + + + + Wallet amount + + + {item?.walletamount} + + + + + + + Created by + + + {item?.CreatedBy} + + + + + + Approved by + + + {item?.ApprovedBy} + + + + + + ); + })} + + ); +}; + +export default PendingApproval; diff --git a/src/Pages/OptiFiiExpense/OptiFiiExpenseDashboard.jsx b/src/Pages/OptiFiiExpense/OptiFiiExpenseDashboard.jsx index e2a6f18..c677e92 100644 --- a/src/Pages/OptiFiiExpense/OptiFiiExpenseDashboard.jsx +++ b/src/Pages/OptiFiiExpense/OptiFiiExpenseDashboard.jsx @@ -228,6 +228,8 @@ const OptiFiiExpenseDashboard = () => { ))} + + {gridItemsData.map((item, index) => ( diff --git a/src/Pages/OptiFiiExpense/ReimbursementRequest.jsx b/src/Pages/OptiFiiExpense/ReimbursementRequest.jsx index ff4666f..b51c5a7 100644 --- a/src/Pages/OptiFiiExpense/ReimbursementRequest.jsx +++ b/src/Pages/OptiFiiExpense/ReimbursementRequest.jsx @@ -1,15 +1,154 @@ -import { Box } from "@chakra-ui/react"; -import React from "react"; +import { + Box, + Button, + HStack, + Icon, + Checkbox, + Tag, + TagLabel, + Text, + Image, +} from "@chakra-ui/react"; +import React, { useContext, useEffect, useState } from "react"; import MiniHeader from "../../Components/MiniHeader"; +import GlobalStateContext from "../../Contexts/GlobalStateContext"; +import NormalTable from "../../Components/DataTable/NormalTable"; +import { RiDeleteBin5Line } from "react-icons/ri"; +import { AiOutlineEdit } from "react-icons/ai"; +import { FaRegEye } from "react-icons/fa"; +import { PiReceipt } from "react-icons/pi"; +import { MdOutlineNoFood } from "react-icons/md"; +import { OPACITY_ON_LOAD } from "../../Layout/animations"; +import { useNavigate } from "react-router-dom"; + const ReimbursementRequest = () => { + + + const navigate = useNavigate(); + const { employees } = useContext(GlobalStateContext); + const [isLoading, setIsLoading] = useState(false); + + useEffect(() => { + // Set isLoading to true + setIsLoading(true); + + // Simulate a 3-second delay + const timer = setTimeout(() => { + setIsLoading(false); // Set isLoading to false after 3 seconds + }, 500); + + // Cleanup the timer when the component unmounts or when the useEffect re-runs + return () => clearTimeout(timer); + }, []); // Empty dependency array means this effect runs once after the component mounts + + // ===============================[ Table Header ] + const tableHeadRow = [ + "Select", + "Sr. No", + "Name", + "Status", + "Email Address", + "Mobile number", + "Grade", + "Department", + "Role", + "Action", + ]; + + // const extractedArray = reportsHistory.map((item)=>({ })) + + const extractedArray = employees.map((item, index) => ({ + "Sr. No": ( + + {index + 1} + + ), + "Name": item?.Name, + "Email Address": item?.emailAddress, + "Mobile number": item?.mobileNumber, + Grade: item?.Grade, + Department: item?.Department, + Role: item?.Role, + Status: ( + + Dan Abramov + + Pooja Shah + + + ), + Action: ( + + + ), + })); + return ( - - + {/* + /> */} + + + + + + + + + + Food + + + Created by - Reethik Thota + + + + + + Created by - Reethik Thota + + + ₹ 50,000 + + + + + + + ); }; diff --git a/src/Pages/OptiFiiExpense/ReimbursementRequestView.jsx b/src/Pages/OptiFiiExpense/ReimbursementRequestView.jsx new file mode 100644 index 0000000..dd5017d --- /dev/null +++ b/src/Pages/OptiFiiExpense/ReimbursementRequestView.jsx @@ -0,0 +1,275 @@ +import { + Box, + Button, + HStack, + VStack, + Icon, + Checkbox, + Tag, + TagLabel, + Text, + Image, + useDisclosure, + Alert, + CloseButton, + AlertDescription, +} from "@chakra-ui/react"; +import React, { useContext, useEffect, useState } from "react"; +import MiniHeader from "../../Components/MiniHeader"; +import GlobalStateContext from "../../Contexts/GlobalStateContext"; +import NormalTable from "../../Components/DataTable/NormalTable"; +import { RiDeleteBin5Line } from "react-icons/ri"; +import { AiOutlineEdit } from "react-icons/ai"; +import { LiaFileInvoiceSolid } from "react-icons/lia"; +import { PiReceipt } from "react-icons/pi"; +import { MdOutlineNoFood } from "react-icons/md"; +import { OPACITY_ON_LOAD } from "../../Layout/animations"; +import { IoMdCheckmark } from "react-icons/io"; +import { RxCross2 } from "react-icons/rx"; +import PrimaryButton from "../../Components/Buttons/PrimaryButton" +import SecondaryButton from "../../Components/Buttons/SecondaryButton" + +const ReimbursementRequestView = () => { + + const [alertStatus, setAlertStatus] = useState(null); + + const handleApprove = () => { + setAlertStatus('success'); + }; + + const handleReject = () => { + setAlertStatus('error'); + }; + + const { employees } = useContext(GlobalStateContext); + const [isLoading, setIsLoading] = useState(false); + + useEffect(() => { + // Set isLoading to true + setIsLoading(true); + + // Simulate a 3-second delay + const timer = setTimeout(() => { + setIsLoading(false); // Set isLoading to false after 3 seconds + }, 500); + + // Cleanup the timer when the component unmounts or when the useEffect re-runs + return () => clearTimeout(timer); + }, []); // Empty dependency array means this effect runs once after the component mounts + + // ===============================[ Table Header ] + const tableHeadRow = [ + "Select", + "Sr. No", + "Name", + "Email Address", + "Mobile number", + "Grade", + "Department", + "Role", + "Action", + ]; + + // const extractedArray = reportsHistory.map((item)=>({ })) + + const extractedArray = employees.map((item, index) => ({ + "Sr. No": ( + + {index + 1} + + ), + Name: item?.Name, + "Email Address": item?.emailAddress, + "Mobile number": item?.mobileNumber, + Grade: item?.Grade, + Department: item?.Department, + Role: item?.Role, + Action: ( + + + + + + Invoice243 + + + ), + })); + + return ( + + + + + + + {/* */} + {alertStatus === 'success' && ( + + + + + + Approved by giftryt + + + + + )} + + {alertStatus === 'error' && ( + + + + + + Rejected by giftryt + + + + + )} + + + + + + + Approved + + + + By Sr. Manager + + + + + In progress + + + + + Pending + + + By Sr. Manager + + + + + Pending + + + By Sr. Manager + + + + + Pending + + + By Sr. Manager + + + + + + + + + Report number : 1254587841 + + + Reimbursement report 2024 + + + + + Amount to be reimbursed + + + ₹ 50,000 + + + + + + + + Submitted by + + + Dan Abramov + + + Pooja Shah + + + poojashah @wdipl.com + + + + + + Duration - 10 June - 28 June + + + + + Pending approval + + + + + Manav sain + + + manavsain@wdipl.com + + + Dan Abramov + + + + + + + + + + + + + + + ); +}; + +export default ReimbursementRequestView; diff --git a/src/Pages/OptiFiiExpense/WalletProgram.jsx b/src/Pages/OptiFiiExpense/WalletProgram.jsx index d4ace6e..f2f3755 100644 --- a/src/Pages/OptiFiiExpense/WalletProgram.jsx +++ b/src/Pages/OptiFiiExpense/WalletProgram.jsx @@ -22,6 +22,8 @@ import React, { useContext, useEffect, useState } from "react"; import MiniHeader from "../../Components/MiniHeader"; import GlobalStateContext from "../../Contexts/GlobalStateContext"; import NormalTable from "../../Components/DataTable/NormalTable"; +import { CiBoxList } from "react-icons/ci"; +import { BsFillGridFill } from "react-icons/bs"; import { AddIcon, CalendarIcon, @@ -30,7 +32,13 @@ import { SearchIcon, ViewIcon, } from "@chakra-ui/icons"; -import { MdFilterList, MdNotificationsNone, MdOutlineHeadsetMic } from "react-icons/md"; +import { + MdFilterList, + MdNotificationsNone, + MdOutlineHeadsetMic, +} from "react-icons/md"; +import { MdOutlineUnarchive } from "react-icons/md"; + import { RiDeleteBin5Line, RiWallet3Line } from "react-icons/ri"; import { AiOutlineEdit } from "react-icons/ai"; import { FaRegEye } from "react-icons/fa"; @@ -44,12 +52,24 @@ import SecondaryButton from "../../Components/Buttons/SecondaryButton"; import { LuListFilter } from "react-icons/lu"; import { BsFilterRight } from "react-icons/bs"; import pdfIcon from "../../assets/pdfIcon.svg"; -import ExcelIcon from "../../assets/ExcelIcon.svg" +import ExcelIcon from "../../assets/ExcelIcon.svg"; +import ActiveCards from "./Grid/ActiveCards"; +import PendingApproval from "./Grid/PendingApproval"; +import Decline from "./Grid/Decline"; +import { + Tabs, + TabList, + Tab, + TabIndicator, + TabPanels, + TabPanel, +} from "@chakra-ui/react"; const WalletProgram = () => { const { walletProgram } = useContext(GlobalStateContext); const [isLoading, setIsLoading] = useState(false); const [searchTerm, setSearchTerm] = useState(""); + const [showGrid, setShowGird] = useState(true); useEffect(() => { // Set isLoading to true @@ -66,110 +86,77 @@ const WalletProgram = () => { // ===============================[ Table Header ] const tableHeadRow = [ - "Emp ID", - "Name", - "Email Address", - "Mobile number", - "Grade", + "ID", + "Wallet Name", + "Wallet type", "Department", - "Role", "Status", - "Action", + "Wallet amount", + "Created on", + "Created by", ]; // const extractedArray = reportsHistory.map((item)=>({ })) - + walletProgram.map((item) => console.log(item)); const extractedArray = walletProgram.map((item, index) => ({ - "Emp ID": ( - - - - {item?.EmpID} - - + ID: ( + // + + {item?.id} + + // ), - Name: item?.Name, - "Email Address": item?.emailAddress, - "Mobile number": item?.mobileNumber, + "Wallet Name": ( + + {item.walletName[0]?.icon} + + {/* */} + {item?.walletName[0]?.name} + + ), + "Wallet type": item?.WalletType, + Department: item?.mobileNumber, Grade: item?.Grade, - Department: item?.Department, + Department: item?.department, Role: item?.Role, Status: ( {item?.status} ), - Action: ( - - - - - - ), + "Wallet amount": item?.WalletAmount, + "Created on": item?.CreatedOn, + "Created by": item?.CreatedBy, })); return ( @@ -191,7 +178,7 @@ const WalletProgram = () => { alignItems={"center"} w={"100%"} > - + @@ -205,7 +192,17 @@ const WalletProgram = () => { /> - @@ -223,17 +220,21 @@ const WalletProgram = () => { Export - Export as PDF - Export as Excel + + Export as PDF + + + Export as Excel + - } title={"walletProgram"} /> + } title={"Create wallet"} /> - + } @@ -247,7 +248,7 @@ const WalletProgram = () => { Sort - Ascending + Ascending Descending Recently Viewed Recently Added @@ -255,12 +256,12 @@ const WalletProgram = () => { - - + } title={"Pull back funds"} /> - + */} { Recently Added + + + + - + {showGrid ? ( + + ) : ( + + + + + Active wallets + + + Pending for approval + + + Declined wallets + + + + + + + + + + + )} ); diff --git a/src/Pages/OptiFiiGifsAndVouchers/GiftCard.jsx b/src/Pages/OptiFiiGifsAndVouchers/GiftCard.jsx index e9a0d8d..f55a9ba 100644 --- a/src/Pages/OptiFiiGifsAndVouchers/GiftCard.jsx +++ b/src/Pages/OptiFiiGifsAndVouchers/GiftCard.jsx @@ -17,6 +17,7 @@ import { Tag, TagLabel, Text, + useDisclosure, VStack, } from "@chakra-ui/react"; import { @@ -216,21 +217,11 @@ const GiftCard = () => { bgColor="#F9F5FF" left="5.9rem" boxShadow="md" + justifyContent={"center"} > - - - + + + +{users} - - {users} - - ), @@ -356,14 +347,15 @@ const GiftCard = () => { "Sr. no": ( // - - {/* + {/* { rounded={"full"} /> */} - {item?.id} - + {item?.id} + ), "Order ID": ( + { {item?.orderid} + ), "Email Address": item?.emailAddress, "Date & time": item?.dateTime, @@ -448,21 +442,11 @@ const GiftCard = () => { bgColor="#F9F5FF" left="5.9rem" boxShadow="md" + justifyContent={"center"} > - - - + + + +{users} - - {users} - - ), @@ -547,13 +531,12 @@ const GiftCard = () => { bg={index % 2 === 0 ? "#6311cb14" : "#fff"} rounded={"full"} /> */} - {item?.id} ), "Order ID": ( - + { bgColor="#F9F5FF" left="5.9rem" boxShadow="md" + justifyContent={"center"} > - - - + + + +{users} - - {users} - - ), diff --git a/src/Pages/OptiFiiGifsAndVouchers/id/ApplicationStatus.jsx b/src/Pages/OptiFiiGifsAndVouchers/id/ApplicationStatus.jsx index 6cdc2b8..85e0046 100644 --- a/src/Pages/OptiFiiGifsAndVouchers/id/ApplicationStatus.jsx +++ b/src/Pages/OptiFiiGifsAndVouchers/id/ApplicationStatus.jsx @@ -223,6 +223,7 @@ const Employees = () => { return ( { +// return ( +// + +// +// ); +// }; + +// export default ApplicationStatus; +import { + Box, + Button, + Divider, + FormControl, + FormLabel, + HStack, + Icon, + Image, + Input, + InputGroup, + InputLeftElement, + Menu, + MenuButton, + MenuItem, + MenuList, + Radio, + Tag, + TagLabel, + Text, + useDisclosure, + VStack, +} from "@chakra-ui/react"; +import React, { useContext, useEffect, useState } from "react"; +import MiniHeader from "../../../Components/MiniHeader"; +import GlobalStateContext from "../../../Contexts/GlobalStateContext"; +import NormalTable from "../../../Components/DataTable/NormalTable"; +import { + AddIcon, + CalendarIcon, + ChevronDownIcon, + EmailIcon, + SearchIcon, + ViewIcon, +} from "@chakra-ui/icons"; +import { + MdFilterList, + MdNotificationsNone, + MdOutlineHeadsetMic, +} from "react-icons/md"; +import { RiDeleteBin5Line, RiWallet3Line } from "react-icons/ri"; +import { AiOutlineEdit } from "react-icons/ai"; +import { FaRegEye } from "react-icons/fa"; +import { PiReceipt } from "react-icons/pi"; +import { OPACITY_ON_LOAD } from "../../../Layout/animations"; +import { Link } from "react-router-dom"; +import backFund from "../../../assets/backfund.svg"; +import PrimaryButton from "../../../Components/Buttons/PrimaryButton"; +import { FaArrowUpFromBracket } from "react-icons/fa6"; +import SecondaryButton from "../../../Components/Buttons/SecondaryButton"; +import { LuListFilter } from "react-icons/lu"; +import { BsFilterRight } from "react-icons/bs"; +import pdfIcon from "../../../assets/pdfIcon.svg"; +import ExcelIcon from "../../../assets/ExcelIcon.svg"; +import redinfo from "../../../assets/redinfo.png"; +import pooja from "../../../assets/poojaShah.png"; +import { + Modal, + ModalOverlay, + ModalContent, + ModalHeader, + ModalFooter, + ModalBody, + ModalCloseButton, +} from "@chakra-ui/react"; +const DigitalApplicationStatus = () => { + const { ApplicationStatus } = useContext(GlobalStateContext); + const [isLoading, setIsLoading] = useState(false); + const [searchTerm, setSearchTerm] = useState(""); + const { isOpen, onOpen, onClose } = useDisclosure(); + const [mobileNumber, setMobileNumber] = useState(""); + const [otp, setOtp] = useState(new Array(4).fill("")); + const [selectedAction, setSelectedAction] = useState(""); + useEffect(() => { + setIsLoading(true); + + const timer = setTimeout(() => { + setIsLoading(false); + }, 500); + + return () => clearTimeout(timer); + }, []); + + // Table Header + const tableHeadRow = [ + "Emp ID", + "Name", + "Email address/Mobile number", + "Member since", + "Load Status", + "Action", + ]; + + const handleChange = (e, index) => { + const value = e.target.value; + if (/^[0-9]$/.test(value)) { + const newOtp = [...otp]; + newOtp[index] = value; + setOtp(newOtp); + + if (index < 3 && value) { + document.getElementById(`otp-input-${index + 1}`).focus(); + } + } + }; + + const handleGetOtp = () => { + alert("OTP sent to " + mobileNumber); + }; + + // Extracting the array for the table data + const extractedArray = ApplicationStatus.map((item, index) => ({ + "Emp ID": ( + + {item?.EmpID} + + ), + Name: ( + + + + {item?.Name} + + + ), + "Email address/Mobile number": item?.emailAddressMobile, + "Member since": item?.MemberSince, + "Load Status": ( + + {item?.LoadStatus === "10,000" ? ( + {item?.LoadStatus} + ) : item?.LoadStatus === "load Card" ? ( + + + {item?.LoadStatus} + + ) : null} + + ), + Action: ( + + {item?.Action === "Activate card" ? ( + { + setSelectedAction(item?.Action); // Set action to "Activate card" + onOpen(); + }} + > + {item?.Action} + + ) : item?.Action === "Load card" ? ( + { + setSelectedAction(item?.Action); // Set action to "Load card" + onOpen(); + }} + > + {item?.Action} + + ) : null} + + ), + })); + + return ( + + + + + #45152487 + + + Order ID + + + + Order accepted + + + + {/* Table and other UI components */} + + + + {/* Modal for Activate or Load card based on action */} + + + + + {selectedAction === "Load card" ? "Load Card" : "Activate Card"} + + + + {selectedAction === "Activate card" ? ( + + + + Order Id : + + + #451245 + + + + + + + Mobile Number + + + +91 + setMobileNumber(e.target.value)} + maxLength={10} + type="tele" + size={"sm"} + rounded={5} + variant="none" + /> + + + + {/* Mobile Number + + + +91 + setMobileNumber(e.target.value)} + maxLength={10} + type="tel" + variant="none" + width="100%" + h={"40px"} + fontSize="small" + /> + + + */} + + + OTP + + + {otp.map((_, index) => ( + handleChange(e, index)} + maxLength={1} + textAlign="center" + variant="outline" + width="50px" + type="tel" + /> + ))} + + + + ) : ( + + + + Order Id : + + + #451245 + + + + + + + Enter Denomination + + + ₹ + + + + + + )} + + + + + + + + + ); +}; + +export default DigitalApplicationStatus; diff --git a/src/Routes/Routes.js b/src/Routes/Routes.js index e1f6572..97902e1 100644 --- a/src/Routes/Routes.js +++ b/src/Routes/Routes.js @@ -18,8 +18,10 @@ import Roles from "../Pages/ManageHumanResource/ManageDepartmentAndRoles/Roles"; import OptiFiiExpenseDashboard from "../Pages/OptiFiiExpense/OptiFiiExpenseDashboard"; import GiftCard from "../Pages/OptiFiiGifsAndVouchers/GiftCard"; import ApplicationStatus from "../Pages/OptiFiiGifsAndVouchers/id/ApplicationStatus"; +import DigitalApplicationStatus from "../Pages/OptiFiiGifsAndVouchers/id/DigitalApplication"; import GiftDashboard from "../Pages/OptiFiiGifsAndVouchers/GiftDashboard"; import AdvanceExpenseRequestView from "../Pages/OptiFiiExpense/AdvanceExpenseRequestView"; +import ReimbursementRequestView from "../Pages/OptiFiiExpense/ReimbursementRequestView"; export const RouteLink = [ { path: "/", Component: Dashbaord }, { path: "/expenses", Component: Expenses }, @@ -30,6 +32,7 @@ export const RouteLink = [ { path: "/Manage-roles", Component: ManageDepartmentAndRoles }, { path: "/wallet-program", Component: WalletProgram }, { path: "/reimbursement-request", Component: ReimbursementRequest }, + { path: "/reimbursement-request-view", Component: ReimbursementRequestView }, { path: "/advance-expense-request", Component: AdvanceExpenseRequest }, { path: "/advance-expense-request-view", Component: AdvanceExpenseRequestView }, { path: "/optiFii-benefit", Component: OptiFiiTaxBenefit }, @@ -41,6 +44,8 @@ export const RouteLink = [ { path: "/roles", Component: Roles }, { path: "/optiFii-expense-dashboard", Component: OptiFiiExpenseDashboard }, { path: "/gift-card", Component: GiftCard }, + { path: "/gift-card/application-status", Component: ApplicationStatus }, + { path: "/gift-card/digital-application-status", Component: DigitalApplicationStatus }, { path: "/application-status", Component: ApplicationStatus }, diff --git a/src/assets/icons/Food.png b/src/assets/icons/Food.png new file mode 100644 index 0000000..e139003 Binary files /dev/null and b/src/assets/icons/Food.png differ diff --git a/src/assets/icons/Fuel.png b/src/assets/icons/Fuel.png new file mode 100644 index 0000000..41ebbe2 Binary files /dev/null and b/src/assets/icons/Fuel.png differ diff --git a/src/assets/icons/bookStack.png b/src/assets/icons/bookStack.png new file mode 100644 index 0000000..7bed4b2 Binary files /dev/null and b/src/assets/icons/bookStack.png differ diff --git a/src/assets/icons/gadget.png b/src/assets/icons/gadget.png new file mode 100644 index 0000000..426cc3e Binary files /dev/null and b/src/assets/icons/gadget.png differ diff --git a/src/assets/icons/gift.png b/src/assets/icons/gift.png new file mode 100644 index 0000000..4225b22 Binary files /dev/null and b/src/assets/icons/gift.png differ diff --git a/src/assets/icons/telecom.png b/src/assets/icons/telecom.png new file mode 100644 index 0000000..11d43fd Binary files /dev/null and b/src/assets/icons/telecom.png differ diff --git a/src/assets/onboarding_bg.webp b/src/assets/onboarding_bg.webp new file mode 100644 index 0000000..42e6af8 Binary files /dev/null and b/src/assets/onboarding_bg.webp differ