vignesh
/
PozoApp-retail-designChanges
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

deisgn changes code

This commit is contained in:
Your Name 2025-11-13 09:54:22 +05:30
parent 8a90b01c38
commit 066990e8aa
1453 changed files with 719274 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
.eslintrc.cjs Normal file
View File

@ -0,0 +1,20 @@
module.exports = {
root: true,
env: { browser: true, es2020: true },
extends: [
"eslint:recommended",
"plugin:react/recommended",
"plugin:react/jsx-runtime",
"plugin:react-hooks/recommended",
],
ignorePatterns: ["dist", ".eslintrc.cjs"],
parserOptions: { ecmaVersion: "latest", sourceType: "module" },
settings: { react: { version: "18.2" } },
plugins: ["react-refresh"],
rules: {
"react-refresh/only-export-components": [
"warn",
{ allowConstantExport: true },
],
},
};

24
.gitignore vendored Normal file
View File

@ -0,0 +1,24 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
dist
dist-ssr
*.local
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

93
index.html Normal file
View File

@ -0,0 +1,93 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" href="/fav.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
rel="preload"
as="font"
href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,400;0,500;0,600;0,700;1,200&display=swap"
rel="stylesheet"
/>
<link
href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Manrope:wght@200;300;400;500;600;700;800&family=Montserrat:wght@400;500;600;700&family=Poppins:ital,wght@1,200&display=swap"
/>
<link
href="https://fonts.googleapis.com/css2?family=Arimo:ital,wght@0,400..700;1,400..700&family=Crimson+Pro:ital,wght@0,200..900;1,200..900&family=Dhurjati&family=Diplomata+SC&family=Inconsolata:wght@200..900&family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&family=Lexend+Zetta:wght@200;300;400;500;700&family=Libre+Franklin:ital,wght@0,100..900;1,100..900&family=Podkova:wght@400..800&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto+Slab:wght@200;300;400;500;600;700&family=VT323&family=Cute+Font&family=Kumar+One&family=Lemon&family=Lily+Script+One&family=M+PLUS+Rounded+1c&family=Maiden+Orange&family=Kode+Mono:wght@400..700&display=swap"
rel="stylesheet"
/>
<link
href="https://fonts.googleapis.com/css2?family=Fredoka:wght@300..700&display=swap"
rel="stylesheet"
/>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Freeman&display=swap"
rel="stylesheet"
/>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Concert+One&display=swap"
rel="stylesheet"
/>
<link
href="https://fonts.googleapis.com/css2?family=Calistoga&display=swap"
rel="stylesheet"
/>
<link
href="https://fonts.googleapis.com/css2?family=Calistoga&display=swap"
rel="stylesheet"
/>
<!-- <link href="https://vjs.zencdn.net/8.3.0/video-js.css" rel="stylesheet" /> -->
<!-- <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet"> -->
<title>Pozo Retail Software</title>
<!-- mohan -->
<!-- <script>
// Disable right-click menu and common hotkeys
document.addEventListener("contextmenu", (event) => event.preventDefault());
document.addEventListener("keydown", (event) => {
if (
(event.ctrlKey && event.shiftKey && ["I", "J", "C"].includes(event.key.toUpperCase())) ||
(event.ctrlKey && ["U", "S"].includes(event.key.toUpperCase())) ||
event.key === "F12"
) {
event.preventDefault();
return false;
}
});
</script> -->
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.jsx"></script>
<script
type="module"
href="@import url('https://fonts.googleapis.com/css2?family=Calistoga&display=swap')"
></script>
<!-- <script src="https://vjs.zencdn.net/8.3.0/video.min.js"></script> -->
<!-- <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script> -->
</body>
<!-- <iframe id="ifmcontentstoprint" style="
height: 0px;
width: 0px;
position: absolute;
padding: 0px;
margin: 0px;
/* font-family: 'Poppins', sans-serif; */
"></iframe> -->
</html>

12123
package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

94
package.json Normal file
View File

@ -0,0 +1,94 @@
{
"name": "retail-application",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "node --max-old-space-size=4096 node_modules/vite/bin/vite.js build",
"lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
"preview": "vite preview",
"format": "prettier --write ."
},
"dependencies": {
"@ant-design/plots": "^1.2.6",
"@autocomplete/material-ui": "0.0.17",
"@dnd-kit/core": "^6.3.1",
"@dnd-kit/sortable": "^10.0.0",
"@emotion/react": "^11.11.4",
"@emotion/styled": "^11.11.5",
"@material-ui/lab": "^4.0.0-alpha.61",
"@mui/material": "^5.15.18",
"@reduxjs/toolkit": "^1.9.5",
"antd": "^5.17.4",
"antd-img-crop": "^4.22.0",
"aos": "^2.3.4",
"axios": "^1.7.2",
"browser-image-compression": "^2.0.2",
"classnames": "^2.5.1",
"cropperjs": "^1.6.2",
"crypto-js": "^4.1.1",
"date-fns": "^4.1.0",
"devtools-detect": "^4.0.2",
"exceljs": "^4.3.0",
"google-maps-react": "^2.0.6",
"highcharts": "^11.4.3",
"highcharts-react-official": "^3.2.1",
"history": "^5.3.0",
"html2canvas": "^1.4.1",
"html2pdf": "^0.0.11",
"html2pdf.js": "^0.10.3",
"html5-qrcode": "^2.3.8",
"jquery": "^3.7.1",
"js-cookie": "^3.0.5",
"jsbarcode": "^3.11.6",
"jspdf": "^3.0.3",
"lucide-react": "^0.536.0",
"material-ui": "^0.15.0",
"moment": "^2.30.1",
"mui-autocomplete": "^2.0.1",
"number-to-words": "^1.2.4",
"pdf-lib": "^1.17.1",
"qrcode": "^1.5.3",
"qrcode.react": "^4.2.0",
"react": "^18.3.1",
"react-beautiful-dnd": "^13.1.1",
"react-color": "^2.19.3",
"react-countup": "^6.5.3",
"react-device-detect": "^2.2.3",
"react-devtools": "^1.0.5",
"react-dom": "^18.3.1",
"react-icons": "^4.12.0",
"react-qr-code": "^2.0.13",
"react-redux": "^8.1.2",
"react-router-dom": "^6.23.1",
"react-select": "^5.8.0",
"react-signature-canvas": "^1.0.7",
"react-speech-recognition": "^3.10.0",
"react-timer-hook": "^3.0.7",
"react-transition-group": "^4.4.5",
"string-similarity": "^4.0.4",
"tesseract.js": "^6.0.0",
"universal-cookie": "^8.0.1",
"webfontloader": "^1.6.28",
"xlsx": "^0.18.5",
"zustand": "^5.0.8"
},
"devDependencies": {
"@types/react": "^18.3.3",
"@types/react-dom": "^18.3.0",
"@vitejs/plugin-react": "^4.3.0",
"eslint": "^8.57.0",
"eslint-plugin-react": "^7.34.2",
"eslint-plugin-react-hooks": "^4.6.2",
"eslint-plugin-react-refresh": "^0.4.7",
"prettier": "^3.5.3",
"rollup-plugin-obfuscator": "^1.1.0",
"rollup-plugin-terser": "^7.0.2",
"sass": "^1.77.2",
"terser": "^5.31.3",
"vite": "^4.5.3",
"vite-plugin-obfuscator": "^1.0.5",
"vite-plugin-remove-console": "^2.2.0"
}
}

1
public/vite.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

27
src/.env.development Normal file
View File

@ -0,0 +1,27 @@
ENV_BASE_URL='/'
ENV_COMMON_BASE_URL='http://192.168.1.16:3000/'
# ENV_API_URL='http://192.168.1.25:8001'
# ENV_API_URL='http://api.pozo.co.in/Retailapi_UnderTest'
# ENV_API_URL_COMMON='http://api.pozo.co.in/Pozocommonapi_UnderTest'
# ENV_API_URL='http://192.168.1.37:8010'
# ENV_API_URL_COMMON='http://192.168.1.37'
ENV_API_URL='http://192.168.1.37:8012'
ENV_API_URL_COMMON='http://192.168.1.37:8013'
ENV_API_URL_TOKEN='http://192.168.1.37:8001'
# ENV_API_URL='https://www.pozo.dev/pozo-retail-api'
# ENV_API_URL_COMMON='https://www.pozo.dev/pozo-common-api'
# ENV_API_URL_TOKEN='https://www.pozo.dev/JwtToken'
ENV_IMAGE_UPLOAD_API_URL="https://api.pozo.app/pozo-common-image-api/"
ENV_SECRET_KEY="3a939a2eed2cca4b64cd47f51b23b135b2b9b765273f695d47682ea803c8429d"
ENV_URL_SECRET_KEY="f2ef79b8b2d4fc1cc569726a5a753552257b4ff2872d6a71cf3119bce3f07c1b"
ENV_MAIN_BASE_URL='http://192.168.1.22:3015/'
ENV_SIGNALR_SERVER_URL='https://www.pozo.dev/'
ENV_IFSC_API_URL = "https://ifsc.razorpay.com"
ENV_PAYMENT_DEVICE_URL='https://pozo.dev/PaymentDevice/PaymentDevice/api/upload-transaction'
ENV_PAYMENT_STATUS_GET_URL='https://pozo.dev/PaymentDevice/PaymentDevice/api/get-transaction-status'
ENV_ANDROID_PRINTER= 'https://pozo.app/downloads/resources/POZO%20Printer.apk'
ENV_ANDROID_KIOSK= 'https://pozo.app/downloads/resources/POZO%20KIOSK.apk'
ENV_ANDROID_HANDHELD= 'https://pozo.dev/downloads/resources/Handheld.apk'
ENV_ANDROID_BILLING= 'https://pozo.dev/downloads/resources/PozoBillingApp.apk'
ENV_EMAIL_API='http://192.168.1.37:8014'

65
src/.env.production Normal file
View File

@ -0,0 +1,65 @@
#221 server
# ENV_BASE_URL='/apps/retail/'
# ENV_COMMON_BASE_URL='http://pozo.co.in'
# ENV_API_URL='http://api.pozo.co.in/Retailapi_UnderTest'
# ENV_API_URL_COMMON='http://api.pozo.co.in/Pozocommonapi_UnderTest'
# # ENV_API_URL='http://api.pozo.co.in/Retailapi/'
# # ENV_API_URL_COMMON='http://api.pozo.co.in/Pozocommonapi'
# ENV_IMAGE_UPLOAD_API_URL="https://api.pozo.app/pozo-common-image-api/"
# ENV_SECRET_KEY="3a939a2eed2cca4b64cd47f51b23b135b2b9b765273f695d47682ea803c8429d"
# ENV_URL_SECRET_KEY="f2ef79b8b2d4fc1cc569726a5a753552257b4ff2872d6a71cf3119bce3f07c1b"
# ENV_MAIN_BASE_URL='http://pozo.co.in/apps/retail/'
# ENV_CUSTOM_PAYMENT_URL='https://pozo.app/CustomPaymentGateway/CustomPaymentGateway'
# ENV_IFSC_API_URL = "https://ifsc.razorpay.com"
# ENV_ANDROID_HANDHELD= 'https://pozo.app/downloads/resources/Handheld.apk'
# live Server (173 server)
# ENV_BASE_URL='/apps/retail/'
# ENV_COMMON_BASE_URL='https://pozo.app'
# ENV_API_URL='https://api.pozo.app/pozo-retail-api'
# ENV_API_URL_COMMON='https://api.pozo.app/pozo-common-api'
# ENV_API_URL_TOKEN='https://api.pozo.app/JwtToken'
# ENV_IMAGE_UPLOAD_API_URL="https://api.pozo.app/pozo-common-image-api/"
# ENV_SECRET_KEY="3a939a2eed2cca4b64cd47f51b23b135b2b9b765273f695d47682ea803c8429d"
# ENV_URL_SECRET_KEY="f2ef79b8b2d4fc1cc569726a5a753552257b4ff2872d6a71cf3119bce3f07c1b"
# ENV_MAIN_BASE_URL='https://pozo.app/apps/retail/'
# ENV_CUSTOM_PAYMENT_URL='https://pozo.app/CustomPaymentGateway/CustomPaymentGateway'
# ENV_IFSC_API_URL = "https://ifsc.razorpay.com"
# ENV_PAYMENT_DEVICE_URL='https://pozo.app/PaymentDevice/PaymentDevice/api/upload-transaction'
# ENV_PAYMENT_STATUS_GET_URL='https://pozo.app/PaymentDevice/PaymentDevice/api/get-transaction-status'
# ENV_ANDROID_PRINTER= 'https://pozo.app/downloads/resources/POZO%20Printer.apk'
# ENV_ANDROID_KIOSK= 'https://pozo.app/downloads/resources/POZO%20KIOSK.apk'
# ENV_ANDROID_HANDHELD= 'https://pozo.app/downloads/resources/Handheld.apk'
# ENV_ANDROID_BILLING= 'https://pozo.app/downloads/resources/PozoApp.apk'
# ENV_EMAIL_API='https://api.pozo.app/pozo-sms-email-template-api'
# ENV_SIGNALR_SERVER_URL='https://api.pozo.app/'
#(172 server)
ENV_BASE_URL='/apps/retail/'
ENV_COMMON_BASE_URL='https://pozo.dev'
ENV_API_URL='https://www.pozo.dev/pozo-retail-api'
ENV_API_URL_COMMON='https://www.pozo.dev/pozo-common-api'
ENV_API_URL_TOKEN='https://www.pozo.dev/JwtToken'
ENV_IMAGE_UPLOAD_API_URL="https://www.pozo.dev/pozo-common-image-api"
ENV_SECRET_KEY="3a939a2eed2cca4b64cd47f51b23b135b2b9b765273f695d47682ea803c8429d"
ENV_URL_SECRET_KEY="f2ef79b8b2d4fc1cc569726a5a753552257b4ff2872d6a71cf3119bce3f07c1b"
ENV_MAIN_BASE_URL='https://pozo.dev/apps/retail/'
ENV_SIGNALR_SERVER_URL='https://www.pozo.dev/'
ENV_CUSTOM_PAYMENT_URL='https://pozo.app/CustomPaymentGateway/CustomPaymentGateway'
ENV_IFSC_API_URL = "https://ifsc.razorpay.com"
ENV_PAYMENT_DEVICE_URL='https://pozo.dev/PaymentDevice/PaymentDevice/api/upload-transaction'
ENV_PAYMENT_STATUS_GET_URL='https://pozo.dev/PaymentDevice/PaymentDevice/api/get-transaction-status'
# ENV_PAYMENT_DEVICE_URL='https://www.plutuscloudserviceuat.in:8201/API/CloudBasedIntegration/V1/UploadBilledTransaction'
# ENV_PAYMENT_STATUS_GET_URL='https://www.plutuscloudserviceuat.in:8201/API/CloudBasedIntegration/V1/GetCloudBasedTxnStatus'
ENV_ANDROID_PRINTER= 'https://pozo.dev/downloads/resources/POZO%20Printer.apk'
ENV_ANDROID_KIOSK= 'https://pozo.dev/downloads/resources/POZO%20KIOSK.apk'
ENV_ANDROID_HANDHELD= 'https://pozo.dev/downloads/resources/Handheld.apk'
ENV_ANDROID_BILLING= 'https://pozo.dev/downloads/resources/PozoApp.apk'
ENV_EMAIL_API='https://www.pozo.dev/pozo-sms-email-template-api'

7
src/.prettierrc Normal file
View File

@ -0,0 +1,7 @@
{
"semi": true,
"singleQuote": true,
"printWidth": 80,
"tabWidth": 2,
"trailingComma": "es5"
}

254
src/App.jsx Normal file
View File

@ -0,0 +1,254 @@
// AppRoutes.jsx
import React, { useEffect, useState, useRef } from 'react';
import { Routes, Route } from 'react-router-dom';
import { useNavigate } from 'react-router-dom';
import { useDispatch, useSelector } from 'react-redux';
import ProtectedRoutes from './ProtectedRoutes';
import SelfBooking from './Pages/SelfBooking/SelfBooking.jsx';
import { isMobile, isIOS } from 'react-device-detect';
// const { routesConfig }=lazy(()=>import('./routesConfig'));
import { routesConfig } from './routesConfig';
import {
ChangeAppExpDateData,
changeHeightforExpDate,
getAppSubscriptionDate,
GlobalItemCard,
} from './Features/BookingScreen/BookingData/BookingData.js';
import {
checkSession,
GenerateLogout,
} from './Features/BrachLogin/BranchLogin.js';
import {
clearSession,
getSession,
TokendecryptedValuesFun,
} from './Services/Others.js';
import devtools from 'devtools-detect';
import KisokSelBooking from './Pages/SelfBooking/KisokSelBooking.jsx';
import IndividualBooking from './Pages/SelfBooking/IndividualBooking.jsx';
const commonSubDir = import.meta.env.ENV_COMMON_BASE_URL;
const subDirectory = import.meta.env.ENV_BASE_URL;
const AppRoutes = () => {
const navigate = useNavigate();
const dispatch = useDispatch();
const ItemCard = useSelector(GlobalItemCard);
const [remainingDays, setRemainingDays] = useState(null);
const prevRemainingDays = useRef(null);
const [sessionData, setSessionData] = useState(null);
const [devToolsOpen, setDevToolsOpen] = useState(false);
useEffect(() => {
const handlePopState = (e) => {
const SessionId = getSession('SessionId');
if (!SessionId) {
alert(
'Session invalid and Unauthorized action detected. Redirecting to login...'
);
clearSession();
window.location.replace(`${commonSubDir}`);
} else {
window.history.go(1);
}
};
// Add event listener on mount
window.addEventListener('popstate', handlePopState);
// Clean up the event listener on unmount
return () => {
window.removeEventListener('popstate', handlePopState);
};
}, []);
//cmd it start
// useEffect(() => {
// sessionCheckFun()
// }, [navigate, ItemCard]);
//cmd it End
useEffect(() => {
const loadSessionData = () => {
const CompId = getSession('CompId');
const AppId = getSession('AppId');
const BranchId = getSession('BranchId');
const UserType = getSession('UserType');
console.log('loadSessionData:', CompId, AppId, BranchId, UserType);
if (CompId && AppId && BranchId) {
setSessionData({ CompId, AppId, BranchId, UserType });
return true; // Indicate that session data is available
}
return false; // Indicate that session data is not yet available
};
if (!loadSessionData()) {
const interval = setInterval(() => {
if (loadSessionData()) {
clearInterval(interval); // Stop checking once data is available
}
}, 1000);
return () => clearInterval(interval); // Cleanup interval on unmount
}
}, []);
useEffect(() => {
const fetchExpDate = async () => {
if (!sessionData) {
console.log('Session data not available, skipping API call...');
return;
}
try {
const { CompId, AppId, BranchId, UserType } = sessionData;
const data = { CompId, BranchId, AppId };
let res = await dispatch(getAppSubscriptionDate(data)).unwrap();
if (res?.data?.statusCode === 1 && res?.data?.data?.length > 0) {
const expData = res?.data?.data?.[0];
if (prevRemainingDays.current !== expData.RemainingDays) {
prevRemainingDays.current = expData.RemainingDays;
setRemainingDays(expData.RemainingDays);
dispatch(ChangeAppExpDateData(expData));
dispatch(changeHeightforExpDate(expData.RemainingDays));
if (
expData.RemainingDays < 1 &&
expData.RemainingHours < 1 &&
expData.RemainingMinutes < 1 &&
expData.RemainingSeconds < 1
) {
if (
UserType !== 'Super Admin' ||
UserType !== 'Super Admin User'
) {
console.log('Subscription expired, logging out...');
alert(
'Subscription expired, logging out. Redirecting to login...'
);
Logout();
}
}
}
} else {
console.log('No subscription data found, logging out...');
alert(
'No subscription data found, logging out. Redirecting to login...'
);
Logout();
}
} catch (error) {
console.error('Error fetching subscription data:', error);
}
};
if (remainingDays === null) {
fetchExpDate();
}
const interval = setInterval(fetchExpDate, 60 * 60 * 1000);
return () => clearInterval(interval);
}, [sessionData, remainingDays]);
const Logout = async () => {
const UserId = getSession('UserId');
const status = 'N';
try {
const res = await dispatch(GenerateLogout({ UserId, status })).unwrap();
if (res?.data?.statusCode === 1) {
sessionStorage.clear();
window.location.replace(`${commonSubDir}`);
}
} catch (error) {
console.error('Logout failed:', error);
}
};
// mohan
// useEffect(() => {
// if (isMobile || isIOS) {
// console.log("📱 Mobile/iOS device → skipping DevTools detection");
// return;
// }
// const checkDevTools = setInterval(() => {
// if (devtools.isOpen && !devToolsOpen) {
// setDevToolsOpen(true);
// document.body.innerHTML =
// "<h1 style='color: red; text-align: center;'>Close Inspect to continue using the application.</h1>";
// }
// else if (!devtools.isOpen && devToolsOpen) {
// setDevToolsOpen(false);
// setTimeout(() => {
// window.location.reload();
// }, 100);
// clearInterval(checkDevTools);
// }
// if (!devtools.isOpen) {
// let before = performance.now();
// let after = performance.now();
// let executionDelay = after - before;
// if (executionDelay > 100) {
// setDevToolsOpen(true);
// document.body.innerHTML =
// "<h1 style='color: red; text-align: center;'>Close Inspect to continue using the application.</h1>";
// } else {
// setDevToolsOpen(false);
// }
// }
// }, 1000);
// return () => clearInterval(checkDevTools);
// }, [devToolsOpen]);
const sessionCheckFun = async () => {
const UserId = getSession('UserId');
const sessionId = getSession('SessionId');
const IsLogout = getSession('Mode');
let encryptedLoginType = TokendecryptedValuesFun(
sessionStorage.getItem('LoginType')
);
if (encryptedLoginType != 'Kiosk') {
const res = await dispatch(checkSession({ UserId, sessionId })).unwrap();
if (res?.data?.statusCode === 1) {
if (res?.data?.response === 'False') {
if (IsLogout !== 'Logout') {
alert('Session invalid. Redirecting to login...');
}
clearSession();
window.location.replace(commonSubDir);
}
}
}
};
return (
<Routes>
<Route
path={`${subDirectory}selfBooking/:SelfBookingId`}
element={<SelfBooking />}
/>
<Route
path={`${subDirectory}kioskSelfBooking`}
element={<KisokSelBooking />}
/>
<Route
path={`${subDirectory}kiosk-individual-self-booking`}
element={<IndividualBooking />}
/>
<Route
path="/*"
element={<ProtectedRoutes routesConfig={routesConfig} />}
/>
</Routes>
);
};
export default AppRoutes;

125
src/AuthContext.jsx Normal file
View File

@ -0,0 +1,125 @@
// AuthContext.jsx
import React, { createContext, useContext, useState, useEffect } from 'react';
import { useDispatch } from 'react-redux';
import { getSession } from './Services/Others';
import {
getEmpAccesData,
getSAdminUserAccesData,
PricingAppPricingName,
} from './Features/BrachLogin/BranchLogin.js';
import { changePricingAppPricingName } from './Features/ThemeChange/ThemeChange.js';
import { FeatureAddon } from './Features/BookingScreen/BookingData/BookingData.js';
export const AuthContext = createContext();
export const useAuth = () => useContext(AuthContext);
export const AuthProvider = ({ children }) => {
const AppId = getSession('AppId');
const CompId = getSession('CompId');
const BranchId = getSession('BranchId');
const UserId = getSession('UserId');
const UserType = getSession('UserType');
const dispatch = useDispatch();
const [Access, setAccess] = useState([]);
const [SadminuserAccess, setSadminuserAccess] = useState([]);
const [FeatureAddonData, setFeatureAddonData] = useState([]);
const [ProORAdvance, setProORAdvance] = useState(false);
const [Advance, setAdvance] = useState(false);
const [freeProductsCount, setFreeProductsCount] = useState(0);
let featureaddDetails = FeatureAddonData?.FeatureDtls || [];
useEffect(() => {
getPricingName();
if (UserType !== 'Super Admin' && UserType !== 'Super Admin User') {
getFeatureAddonData();
}
}, []);
useEffect(() => {
if (UserType === 'Employee') {
getEmpAccess();
}
if (UserType === 'Super Admin User') {
getSadminUserAccess();
}
}, [UserType]);
const getPricingName = async () => {
if (!AppId || !UserId) return;
const data = {
appId: AppId,
userId: UserId,
};
try {
const response = await dispatch(PricingAppPricingName(data)).unwrap();
const responseData = response?.data;
if (responseData?.statusCode !== 1) return setAdvance(false);
const pricingData = responseData?.data;
await dispatch(changePricingAppPricingName(pricingData));
const hasAdvance = pricingData.some(
(item) => item.PricingName === 'Premium'
);
setAdvance(hasAdvance);
const hasProOrAdvance =
hasAdvance || pricingData.some((item) => item.PricingName === 'Customized');
setProORAdvance(hasProOrAdvance);
} catch (error) {
console.error('Error fetching pricing name:', error);
}
};
const getEmpAccess = async () => {
let data = {
UserId: UserId,
AppId: AppId,
CompId: CompId,
BranchId: BranchId,
};
const response = await dispatch(getEmpAccesData(data)).unwrap();
if (response?.data?.statusCode === 1) {
setAccess(response?.data?.data?.[0]?.EmpAccessDetails);
}
};
const getSadminUserAccess = async () => {
let data = {
UserId: UserId,
AppId: AppId,
};
const response = await dispatch(getSAdminUserAccesData(data)).unwrap();
if (response?.data?.statusCode === 1) {
setSadminuserAccess(response?.data?.data?.[0]?.AppMenuAccessDetails);
}
};
const getFeatureAddonData = async () => {
let featureAddon = await dispatch(
FeatureAddon({ AppId: AppId, UserId: UserId })
).unwrap();
if (featureAddon?.data?.statusCode === 1) {
await setFeatureAddonData(
featureAddon?.data?.data?.[0]?.FeatAddonHdr?.[0]
);
} else {
await setFeatureAddonData([]);
}
};
return (
<AuthContext.Provider
value={{
UserType,
Access,
SadminuserAccess,
Advance,
ProORAdvance,
featureaddDetails,
freeProductsCount,
setFreeProductsCount,
}}
>
{children}
</AuthContext.Provider>
);
};

165
src/Components/Calendar/Calendar.jsx Normal file
View File

@ -0,0 +1,165 @@
import { useState } from 'react';
import {
format,
startOfWeek,
addDays,
isSameDay,
setMonth,
setYear,
getWeeksInMonth,
startOfMonth,
differenceInCalendarWeeks,
addWeeks,
subWeeks
} from 'date-fns';
import './Calendar.scss';
import { HiDotsHorizontal } from "react-icons/hi";
import { FiChevronLeft, FiChevronRight } from 'react-icons/fi';
const Calendar = () => {
// To match the image, set the date to Saturday, May 3, 2025
const initialDate = new Date('2025-06-29T12:00:00');
const [currentDate, setCurrentDate] = useState(initialDate);
const [showYearPicker, setShowYearPicker] = useState(false);
const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
const handleMonthClick = (monthIndex) => {
const newDate = setMonth(currentDate, monthIndex);
setCurrentDate(newDate);
};
const handleDayClick = (day) => {
setCurrentDate(day);
};
const toggleYearPicker = () => {
setShowYearPicker(!showYearPicker);
};
const handleYearChange = (year) => {
const newDate = setYear(currentDate, year);
setCurrentDate(newDate);
setShowYearPicker(false);
};
const handlePrevWeek = () => {
setCurrentDate(subWeeks(currentDate, 1));
};
const handleNextWeek = () => {
setCurrentDate(addWeeks(currentDate, 1));
};
const renderDays = () => {
const weekStart = startOfWeek(currentDate, { weekStartsOn: 0 }); // Sunday
const days = [];
for (let i = 0; i < 5; i++) {
days.push(addDays(weekStart, i));
}
// Hardcoded event dots to match UI
const eventDays = {
'29': ['yellow', 'orange'],
'30': ['yellow'],
};
return days.map((day) => (
<div
key={day}
className={`calendar-day-item ${isSameDay(day, currentDate) ? 'active' : ''}`}
onClick={() => handleDayClick(day)}
>
<div className="event-dots-container">
{(eventDays[format(day, 'd')] || []).map((color, index) => (
<div key={index} className={`event-dot ${color}`}></div>
))}
</div>
<div className={`day-number ${isSameDay(day, currentDate) ? 'active' : ''}`} >
{format(day, 'd')}</div>
<div
// className="day-name"
className={`day-name ${isSameDay(day, currentDate) ? 'active' : ''}`}
>{format(day, 'EEE')}</div>
</div>
));
};
const renderPagination = () => {
const monthStart = startOfMonth(currentDate);
const totalWeeks = getWeeksInMonth(currentDate, { weekStartsOn: 0 });
const currentWeek = differenceInCalendarWeeks(currentDate, monthStart, { weekStartsOn: 0 });
return Array.from({ length: totalWeeks }, (_, i) => (
<span key={i} className={`pagination-dot ${i === currentWeek ? 'active-dot' : ''}`}></span>
));
};
const renderYearPicker = () => {
const currentYear = currentDate.getFullYear();
const years = Array.from({ length: 10 }, (_, i) => currentYear - 5 + i);
return (
<div className="year-picker">
{years.map(year => (
<div
key={year}
className={`year-item ${year === currentYear ? 'active' : ''}`}
onClick={() => handleYearChange(year)}
>
{year}
</div>
))}
</div>
);
};
return (
<div className="calendar-widget-wrapper">
<div className="calendar-header">
<div className="calendar-title-main">Calendar for Bills & Events</div>
<div className="calendar-event-notes">
Pending bills due tomorrow<br />
Scheduled delivery/purchase<br />
Staff birthdays/notes
</div>
</div>
<div className="calendar-body-content">
{showYearPicker ? (
renderYearPicker()
) : (
<>
<div className="calendar-controls">
<div className="calendar-year-display">{format(currentDate, 'yyyy')}</div>
<button className="calendar-more-btn" onClick={toggleYearPicker}><HiDotsHorizontal /></button>
</div>
<div className="calendar-months-nav">
{months.slice(0, 6).map((month, index) => (
<button
key={month}
className={`month-nav-btn ${currentDate.getMonth() === index ? 'active' : ''}`}
onClick={() => handleMonthClick(index)}
>
{month}
</button>
))}
</div>
<div className="calendar-week-view">
<button className="week-nav-btn prev" onClick={handlePrevWeek}>
<FiChevronLeft />
</button>
<div className="calendar-days-grid">{renderDays()}</div>
<button className="week-nav-btn next" onClick={handleNextWeek}>
<FiChevronRight />
</button>
</div>
{/* <div className="calendar-pagination-dots">
{renderPagination()}
</div> */}
</>
)}
</div>
</div>
);
};
export default Calendar;

451
src/Components/Calendar/Calendar.scss Normal file
View File

@ -0,0 +1,451 @@
.calendar-widget-wrapper {
border-radius: 12px;
padding: 18px;
width: 100%;
height: 100%;
font-family: 'Poppins', sans-serif;
display: flex;
flex-direction: column;
flex: 1.2;
/* Makes it slightly wider than other widgets */
}
.calendar-header {
display: flex;
justify-content: space-between;
margin-bottom: 12px;
}
.calendar-title-main {
font-weight: 500;
font-size: 14px;
color: #222;
}
.calendar-event-notes {
font-size: 12px;
color: #888;
text-align: right;
line-height: 1.4;
}
.calendar-body-content {
background: #ffffff;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
border-radius: 10px;
padding: 16px;
flex-grow: 1;
position: relative;
height: 37vh;
overflow: auto;
}
.calendar-controls {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 12px;
}
.calendar-year-display {
font-size: 24px;
font-weight: 600;
color: #222;
}
.calendar-more-btn {
background: none;
border: none;
cursor: pointer;
font-size: 24px;
color: #888;
}
.calendar-months-nav {
display: flex;
justify-content: space-between;
margin-bottom: 16px;
padding-bottom: 8px;
border-bottom: 1px solid #e6eaf0;
}
.month-nav-btn {
background: none;
border: none;
cursor: pointer;
font-size: 15px;
color: #888;
font-weight: 500;
padding: 4px 8px;
border-radius: 6px;
&.active {
background: #e3f2fd;
color: #1976d2;
font-weight: 600;
}
}
.calendar-days-grid {
display: flex;
justify-content: space-between;
gap: 8px;
width: 95%;
}
.calendar-day-item {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 8px 4px;
border-radius: 10px;
background: #fff;
cursor: pointer;
position: relative;
min-height: 70px;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
transition: all 0.2s ease-in-out;
border: 1px solid #EEEEEE;;
&.active {
background: #1976d2;
color: #fff;
font-weight: 600;
}
}
.event-dots-container {
position: absolute;
top: 6px;
display: flex;
gap: 3px;
}
.event-dot {
width: 5px;
height: 5px;
border-radius: 50%;
&.yellow {
background: #ffca28;
}
&.orange {
background: #ff9800;
}
}
.day-number {
font-size: 20px;
font-weight: 600;
color: #333;
&.active{
color: #fff;
}
}
.day-name {
font-size: 12px;
color: #888;
&.active{
color: #fff;
}
}
.calendar-pagination-dots {
display: flex;
justify-content: center;
align-items: center;
gap: 6px;
margin-top: 16px;
.pagination-dot {
width: 6px;
height: 6px;
border-radius: 50%;
background: #d0d0d0;
transition: all 0.3s ease;
&.active-dot {
background: #1976d2;
width: 18px;
border-radius: 4px;
}
}
}
.modal-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
.modal {
background: white;
border-radius: 12px;
padding: 2rem;
width: 90%;
max-width: 400px;
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
h3 {
margin: 0 0 1.5rem 0;
color: #2d3748;
}
.event-input {
width: 100%;
padding: 0.75rem;
border: 2px solid #e2e8f0;
border-radius: 6px;
font-size: 1rem;
margin-bottom: 1rem;
transition: border-color 0.2s ease;
&:focus {
outline: none;
border-color: #667eea;
}
}
.event-type-select {
width: 100%;
padding: 0.75rem;
border: 2px solid #e2e8f0;
border-radius: 6px;
font-size: 1rem;
margin-bottom: 1.5rem;
background: white;
cursor: pointer;
&:focus {
outline: none;
border-color: #667eea;
}
}
.modal-actions {
display: flex;
gap: 1rem;
justify-content: flex-end;
.cancel-btn {
padding: 0.75rem 1.5rem;
border: 2px solid #e2e8f0;
background: white;
color: #4a5568;
border-radius: 6px;
cursor: pointer;
font-weight: 500;
transition: all 0.2s ease;
&:hover {
border-color: #cbd5e0;
background: #f7fafc;
}
}
.save-btn {
padding: 0.75rem 1.5rem;
background: #667eea;
color: white;
border: none;
border-radius: 6px;
cursor: pointer;
font-weight: 500;
transition: background-color 0.2s ease;
&:hover {
background: #5a67d8;
}
}
}
}
}
.year-picker {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100%;
overflow-y: auto;
gap: 8px;
}
.year-item {
font-size: 18px;
font-weight: 500;
color: #888;
cursor: pointer;
padding: 4px 16px;
border-radius: 6px;
transition: all 0.2s ease;
&:hover {
background: #e3f2fd;
color: #1976d2;
}
&.active {
background: #1976d2;
color: #fff;
font-weight: 600;
}
}
.calendar-week-view {
display: flex;
align-items: center;
gap: 8px;
margin-top: 16px;
justify-content: space-between;
}
.week-nav-btn {
background: #f0f2f5;
border: none;
border-radius: 50%;
width: 28px;
height: 28px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
color: #555;
font-size: 20px;
transition: all 0.2s ease;
&:hover {
background: #e4e6e9;
transform: scale(1.05);
}
}
// Responsive design
@media (max-width: 768px) {
.calendar-container {
margin: 1rem;
padding: 1rem;
}
.calendar-header {
.header-top {
flex-direction: column;
gap: 1rem;
align-items: stretch;
.header-controls {
justify-content: space-between;
}
}
.calendar-title {
font-size: 1.125rem;
}
}
.calendar-body {
.year-header {
.year {
font-size: 2rem;
}
}
.month-navigation {
.month-tab {
padding: 0.625rem 0.75rem;
font-size: 0.8125rem;
}
}
.week-view {
gap: 0.375rem;
.day-card {
padding: 0.75rem 0.5rem;
min-height: 70px;
.date-number {
font-size: 1.25rem;
}
.day-name {
font-size: 0.6875rem;
}
}
}
.month-view {
.month-grid {
gap: 0.25rem;
.month-day {
min-height: 60px;
padding: 0.25rem;
}
}
}
.navigation-controls {
.current-period {
font-size: 1rem;
}
}
}
}
@media (max-width: 480px) {
.calendar-header {
.calendar-title {
font-size: 1rem;
}
.calendar-legend {
.legend-item {
font-size: 0.8125rem;
}
}
}
.calendar-body {
.year-header {
.year {
font-size: 1.75rem;
}
}
.week-view {
.day-card {
padding: 0.5rem 0.25rem;
min-height: 60px;
.date-number {
font-size: 1.125rem;
}
.day-name {
font-size: 0.625rem;
}
}
}
.month-view {
.month-grid {
.month-day {
min-height: 50px;
}
}
}
}
}

59
src/Components/CalendarDropdown.jsx Normal file
View File

@ -0,0 +1,59 @@
import React, { useState, useRef, useEffect } from "react";
import { FiCalendar } from "react-icons/fi";
import { MdKeyboardArrowDown } from "react-icons/md";
const RANGE_OPTIONS = [
{ label: 'Today', value: 'today' },
{ label: 'This Week', value: 'week' },
{ label: 'This Month', value: 'month' },
{ label: 'This Year', value: 'year' },
];
const CalendarDropdown = ({ value, onChange }) => {
const [open, setOpen] = useState(false);
const ref = useRef();
useEffect(() => {
function handleClickOutside(event) {
if (ref.current && !ref.current.contains(event.target)) {
setOpen(false);
}
}
document.addEventListener('mousedown', handleClickOutside);
return () => document.removeEventListener('mousedown', handleClickOutside);
}, []);
const selected = RANGE_OPTIONS.find(opt => opt.value === value) || RANGE_OPTIONS[0];
return (
<div ref={ref} style={{ position: 'relative' }}>
<button
className="calendar-btn"
onClick={() => setOpen(o => !o)}
type="button"
>
<FiCalendar style={{ marginRight: 4 }} />
{selected.label}
<MdKeyboardArrowDown style={{ marginLeft: 2 }} />
</button>
{open && (
<div className="calendar-dropdown">
{RANGE_OPTIONS.map(option => (
<div
key={option.value}
className={`calendar-dropdown-item${selected.value === option.value ? ' selectedd' : ''}`}
onClick={() => {
onChange(option.value);
setOpen(false);
}}
>
{option.label}
</div>
))}
</div>
)}
</div>
);
};
export default CalendarDropdown;

68
src/Components/Chart/Chart.js vendored Normal file
View File

@ -0,0 +1,68 @@
import React from 'react';
import { Column } from '@ant-design/plots';
const DemoColumn = () => {
const data = [
{
type: '家具家电',
sales: 38,
},
{
type: '粮油副食',
sales: 52,
},
{
type: '生鲜水果',
sales: 61,
},
{
type: '美容洗护',
sales: 145,
},
{
type: '母婴用品',
sales: 48,
},
{
type: '进口食品',
sales: 38,
},
{
type: '食品饮料',
sales: 38,
},
{
type: '家庭清洁',
sales: 38,
},
];
const config = {
data,
xField: 'type',
yField: 'sales',
label: {
position: 'middle',
style: {
fill: '#FFFFFF',
opacity: 0.6,
},
},
xAxis: {
label: {
autoHide: true,
autoRotate: false,
},
},
meta: {
type: {
alias: '类别',
},
sales: {
alias: '销售额',
},
},
};
return React.createElement(Column, config);
};
export default DemoColumn;

20
src/Components/Chart/LiquidChart.js Normal file
View File

@ -0,0 +1,20 @@
import React from 'react';
import { Liquid } from '@ant-design/plots';
const DemoLiquid = () => {
const config = {
percent: 0.25,
shape: 'rect',
outline: {
border: 2,
distance: 4,
},
wave: {
length: 128,
},
};
return React.createElement(Liquid, config);
};
export default DemoLiquid;

17
src/Components/Drawer/Drawer.jsx Normal file
View File

@ -0,0 +1,17 @@
import { Drawer } from 'antd';
export const Drawers = ({ open, placement, title, children, onClose }) => {
return (
<>
<Drawer
title={title}
placement={placement}
onClose={onClose}
open={open}
key={placement}
>
{children}
</Drawer>
</>
);
};

22
src/Components/Forms/Buttons.jsx Normal file
View File

@ -0,0 +1,22 @@
import { Button } from 'antd';
import './main.scss';
import { forwardRef } from 'react'; //Add for shifayath
const Buttons = forwardRef(
({ buttonText, handleSubmit, icon, disabled, htmlType, prefix }, ref) => (
<Button
ref={ref}
type="primary"
className="primary_Button"
onClick={handleSubmit}
htmlType={htmlType ? 'submit' : ''}
disabled={disabled ? disabled : false}
>
{prefix}
{buttonText}
{icon}
</Button>
)
);
export default Buttons;

54
src/Components/Forms/CheckBoxGroups.jsx Normal file
View File

@ -0,0 +1,54 @@
import { Checkbox, Divider } from 'antd';
import { useState } from 'react';
const CheckboxGroup = Checkbox.Group;
export const CheckBoxGroup = ({
fieldState,
fieldApi,
faClass,
style,
ListOfCheckBox,
defaultCheckedList,
...props
}) => {
const plainOptions = ListOfCheckBox;
const {
field,
onBlur,
initialValue,
forwardedRef,
className,
content,
...rest
} = props.props;
const [checkedList, setCheckedList] = useState(defaultCheckedList);
const [indeterminate, setIndeterminate] = useState(true);
const [checkAll, setCheckAll] = useState(false);
const onChange = (list) => {
setCheckedList(list);
setIndeterminate(!!list?.length && list?.length < plainOptions?.length);
setCheckAll(list?.length === plainOptions?.length);
};
const onCheckAllChange = (e) => {
setCheckedList(e.target.checked ? plainOptions : []);
setIndeterminate(false);
setCheckAll(e.target.checked);
};
return (
<>
<Checkbox
indeterminate={indeterminate}
onChange={onCheckAllChange}
checked={checkAll}
>
Check all
</Checkbox>
<Divider />
<CheckboxGroup
options={plainOptions}
value={checkedList}
onChange={onChange}
/>
</>
);
};

522
src/Components/Forms/CropUpload.jsx Normal file
View File

@ -0,0 +1,522 @@
import React, { useState, useEffect, useCallback } from 'react';
import { Upload, Modal } from 'antd';
import { uploadImage } from '../../Features/upload/upload';
import { useDispatch } from 'react-redux';
import ImageCropper from '../../Components/Forms/Cropper2.jsx';
import ShapeCropper from './ShapeCropper.jsx';
import { PiCropBold } from 'react-icons/pi';
import { FiPenTool } from 'react-icons/fi';
import { DefaultModal } from '../../Components/Modal/DefaultModal.jsx';
import '../../Styles/Product/Product.scss';
import { Messages } from '../Notifications/Messages.jsx';
const allowedTypes = [
'image/jpeg',
'image/png',
'image/webp',
'image/svg+xml',
'image/gif',
'image/avif',
];
const CropUpload = ({
updateImageUrl,
ImageLink,
onlineImage,
isProductList = {},
handleClose = () => {}
}) => {
const dispatch = useDispatch();
const [messageType, setMessageType] = useState(null);
const [messageData, setMessageData] = useState(null);
const [fileList, setFileList] = useState([]);
const [previewVisible, setPreviewVisible] = useState(false);
const [previewImage, setPreviewImage] = useState('');
const [editImageOpen, setEditImageOpen] = useState(false);
const [croppedImage, setCroppedImage] = useState(null);
const [shapedImage, setShapedImage] = useState(false);
const [cropImage, setCropImage] = useState(false);
const [shapedData, setShapedData] = useState(null);
const [resizedImageUrl, setResizedImageUrl] = useState('');
useEffect(() => {
if (ImageLink != '' && ImageLink != null) {
updateImageUrl(ImageLink);
setFileList([
{
uid: `${Date.now()}-${Math.random()}`, // Ensures uniqueness
name: `image${Date.now()}-${Math.random()}.png`,
status: 'done',
url: ImageLink,
},
]);
} else {
updateImageUrl();
// setFileList([]);
// handleRemove()
}
}, [ImageLink]);
useEffect(() => {
if (ImageLink != '' && ImageLink != null) {
if (Object.keys(isProductList)?.length > 0) {
const { isProductListPutapi } = isProductList;
if (isProductListPutapi) {
setFileList([
{
uid: `${Date.now()}-${Math.random()}`, // Ensures uniqueness
name: `image${Date.now()}-${Math.random()}.png`,
status: 'done',
url: ImageLink,
},
]);
} else {
setFileList([]);
}
} else {
// setFileList([]);
}
} else {
// setFileList([]);
}
}, []);
useEffect(() => {
if (onlineImage !== '' && onlineImage != null && onlineImage != undefined) {
setEditImageOpen(true);
handleResizeImage(onlineImage);
} else {
setShapedImage(false);
setCropImage(false);
}
}, [onlineImage]);
useEffect(() => {
if (fileList.length > 0) {
const imageUrl = fileList?.[0]?.url;
if (imageUrl !== '' && imageUrl !== null && imageUrl !== undefined) {
handleResizeImage(imageUrl);
} else {
setShapedImage(false);
setCropImage(false);
}
}
}, [fileList]);
const handleResizeImage = async (imageUrl) => {
try {
const resizedImageUrl = await resizeImage(imageUrl, 300, 150);
setResizedImageUrl(resizedImageUrl);
} catch (error) {
console.error('Error resizing image:', error);
}
};
const SetDefault = async () => {
setEditImageOpen(false);
setCroppedImage(null);
setShapedData(null);
setShapedImage(false);
setCropImage(false);
updateImageUrl(
onlineImage !== '' && onlineImage != null
? onlineImage
: fileList?.[0]?.['url'] != '' && fileList?.[0]?.['url'] != null
? fileList?.[0]?.['url']
: ''
);
if (Object.keys(isProductList)?.length > 0) {
const { isProductListPutapi, record, imagePutFunction } = isProductList;
if (isProductListPutapi) {
imagePutFunction(
onlineImage !== '' && onlineImage != null
? onlineImage
: fileList?.[0]?.['url'] != '' && fileList?.[0]?.['url'] != null
? fileList?.[0]?.['url']
: '',
record
);
handleClose();
setMessageData("Image updated successfully");
setMessageType("success");
}
}
};
const handleEditImageCancle = () => {
setCroppedImage(null);
setShapedData(null);
setEditImageOpen(false);
updateImageUrl('');
setFileList([]);
setShapedImage(false);
setCropImage(false);
};
const handleSubmit = async () => {
const base64 = croppedImage;
const byteCharacters = atob(base64?.split(',')[1]);
const byteNumbers = new Array(byteCharacters.length);
for (let i = 0; i < byteCharacters.length; i++) {
byteNumbers[i] = byteCharacters.charCodeAt(i);
}
const byteArray = new Uint8Array(byteNumbers);
const blob = new Blob([byteArray], { type: 'image/png' });
const file = new File([blob], 'cropped_image.png', { type: 'image/png' });
try {
await handleUpload({
file,
onSuccess: () => console.log('Upload successful'),
onError: () => console.error('Upload failed'),
});
setEditImageOpen(false);
await setCroppedImage(null);
setShapedImage(false);
setCropImage(false);
handleClose();
setMessageData("Image updated successfully");
setMessageType("success");
} catch (error) {
console.error('Error in handleUpload:', error);
}
};
const handleShapeSubmit = async () => {
const base64 = shapedData[0];
const byteCharacters = atob(base64?.split(',')[1]);
const byteNumbers = new Array(byteCharacters.length);
for (let i = 0; i < byteCharacters.length; i++) {
byteNumbers[i] = byteCharacters.charCodeAt(i);
}
const byteArray = new Uint8Array(byteNumbers);
const blob = new Blob([byteArray], { type: 'image/png' });
const file = new File([blob], 'cropped_image.png', { type: 'image/png' });
try {
await handleUpload({
file,
onSuccess: () => console.log('Upload successful'),
onError: () => console.error('Upload failed'),
});
setEditImageOpen(false);
await setShapedData(null);
setShapedImage(false);
setCropImage(false);
handleClose();
setMessageData("Image updated successfully");
setMessageType("success");
} catch (error) {
console.error('Error in handleUpload:', error);
}
};
const handleCancel = () => setPreviewVisible(false);
const onChange = async ({ fileList: newFileList }) => {
setFileList(newFileList);
if (Object.keys(isProductList)?.length > 0) {
const { isProductListPutapi } = isProductList;
if (isProductListPutapi && newFileList?.[0]?.originFileObj) {
const file = newFileList[0].originFileObj;
try {
const res = await dispatch(uploadImage(file)).unwrap();
if (res?.data?.status) {
updateImageUrl(res?.data?.image);
if (res?.data?.image) {
setFileList([
{
uid: `${Date.now()}-${Math.random()}`, // Ensures uniqueness
name: `image${Date.now()}-${Math.random()}.png`,
status: 'done',
url: res?.data?.image,
},
]);
}
}
} catch (error) {
console.error('Image upload failed:', error);
}
}
}
if (newFileList?.length > 0) {
setEditImageOpen(true);
}
};
const onPreview = async (file) => {
let src = file.url;
if (!src) {
src = await new Promise((resolve) => {
const reader = new FileReader();
reader.readAsDataURL(file.originFileObj);
reader.onload = () => resolve(reader.result);
});
}
setPreviewImage(src);
setPreviewVisible(true);
};
const handleCrop = (croppedData) => {
setCroppedImage(croppedData);
};
const handleShape = (shapedData) => {
setShapedData(shapedData);
};
const handleUpload = async ({ file, onSuccess, onError }) => {
try {
if (!file) {
console.error('File object is null or undefined.');
onError();
return;
}
const data = await dispatch(uploadImage(file)).unwrap();
if (data?.data?.status) {
if (Object.keys(isProductList)?.length > 0) {
const { isProductListPutapi, record, imagePutFunction } =
isProductList;
if (isProductListPutapi) {
imagePutFunction(data?.data?.image, record);
setFileList([{ url: data?.data?.image }]);
onSuccess(); // Trigger onSuccess to indicate a successful upload
setCroppedImage(null);
setShapedData(null);
} else {
updateImageUrl(data?.data?.image);
setFileList([{ url: data?.data?.image }]);
onSuccess(); // Trigger onSuccess to indicate a successful upload
setCroppedImage(null);
setShapedData(null);
}
} else {
updateImageUrl(data?.data?.image);
setFileList([{ url: data?.data?.image }]);
onSuccess(); // Trigger onSuccess to indicate a successful upload
setCroppedImage(null);
setShapedData(null);
}
} else {
console.error('API request was not successful:', data?.data?.error);
onError(); // Trigger onError to indicate a failed upload
}
} catch (error) {
console.error('Error calling API:', error);
onError(); // Trigger onError in case of an error
}
};
const handleRemove = () => {
if (Object.keys(isProductList)?.length > 0) {
const { isProductListPutapi, record, imagePutFunction } = isProductList;
if (isProductListPutapi) {
imagePutFunction('', record);
}
}
updateImageUrl('');
setEditImageOpen(false);
setShapedImage(false);
setCropImage(false);
};
const handleShapeCrop = () => {
setShapedImage(true);
setCropImage(false);
setCroppedImage(null);
};
const handleCropTool = () => {
setCropImage(true);
setShapedImage(false);
setShapedData(null);
};
function resizeImage(imageUrl, width, height) {
if (!imageUrl) {
// Handle the case where imageUrl is null or undefined
console.error('Image URL is null or undefined.');
return Promise.reject('Image URL is null or undefined.');
}
return new Promise((resolve, reject) => {
const img = new Image();
img.crossOrigin = 'anonymous'; // Set crossOrigin to handle cross-origin images
img.onload = function () {
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
canvas.width = width;
canvas.height = height;
ctx.drawImage(img, 0, 0, width, height);
const resizedImageUrl = canvas.toDataURL();
resolve(resizedImageUrl);
};
img.onerror = function (error) {
reject(error);
};
img.src = imageUrl;
});
}
const beforeUpload = (file) => {
const isAllowed = allowedTypes.includes(file.type);
if (!isAllowed) {
Modal.error({
title: 'Invalid File Type',
content:
'Only JPG, JPEG, PNG, WEBP, SVG, GIF, and AVIF files are allowed.',
});
}
return isAllowed || Upload.LIST_IGNORE; // prevents adding to fileList if invalid
};
const onComplete = useCallback(() => {
setMessageData(null);
setMessageType(null);
}, []);
return (
<>
<Messages
messageType={messageType}
messageData={messageData}
onComplete={onComplete}
/>
<div
className={
Object.keys(isProductList)?.length > 0
? fileList.length > 0
? 'cropUploadFieldSmall'
: 'cropUploadFieldSmallNoData'
: ''
}
>
<Upload
action="https://run.mocky.io/v3/435e224c-44fb-4773-9faf-380c5e6a2188"
listType="picture-card"
fileList={fileList}
customRequest={handleUpload} // Use customRequest to handle the upload process manually
onChange={onChange}
onPreview={onPreview}
onRemove={handleRemove}
beforeUpload={beforeUpload}
>
{fileList.length < 1 && '+ Upload'}
</Upload>
</div>
<Modal visible={previewVisible} onCancel={handleCancel} footer={null}>
<img alt="Preview" style={{ width: '100%' }} src={previewImage} />
</Modal>
<DefaultModal
title="Edit Image"
width={800}
open={editImageOpen}
footer={
(cropImage && croppedImage === null) ||
(shapedImage && shapedData === null)
? false
: true
}
buttonText="SUBMIT"
children={
<>
<div className="shape-crop">
{!croppedImage && !cropImage && !shapedImage && (
<div>
<img
src={
onlineImage !== '' && onlineImage != null
? onlineImage
: fileList?.[0]?.['url'] != '' &&
fileList?.[0]?.['url'] != null
? fileList?.[0]?.['url']
: ''
}
style={{ width: '200px', height: '100px' }}
alt="Edit Image"
/>
</div>
)}
<div className="shape-crop-div">
<div
className="crop-button"
style={{ backgroundColor: cropImage && '#52c41a' }}
onClick={() => handleCropTool()}
>
<div>
<PiCropBold className="crop-icon" />
</div>
<div>Crop Tool</div>
</div>
<div
className="crop-button"
style={{ backgroundColor: shapedImage && '#52c41a' }}
onClick={() => handleShapeCrop()}
>
<div>
<FiPenTool className="crop-icon" />
</div>
<div>Pen Tool</div>
</div>
</div>
<div>
{cropImage && (
<ImageCropper
imageUrl={
onlineImage !== '' && onlineImage != null
? onlineImage
: fileList?.[0]?.['url'] != '' &&
fileList?.[0]?.['url'] != null
? fileList?.[0]?.['url']
: ''
}
onCrop={handleCrop}
/>
)}
{croppedImage && cropImage && (
<div
style={{
display: 'flex',
alignItems: 'center',
flexDirection: 'column',
gap: '2rem',
}}
>
<h4 style={{ marginLeft: '-33rem' }}>
Cropped Image Preview
</h4>
<img
src={croppedImage}
alt="Cropped Image"
style={{ width: '200px', height: '100px' }}
/>
</div>
)}
{shapedImage && (
<ShapeCropper
imageUrl={
resizedImageUrl !== '' && resizedImageUrl !== null
? resizedImageUrl
: ''
}
onShape={handleShape}
/>
)}
</div>
</div>
</>
}
handleSubmit={
croppedImage == null && shapedData == null
? SetDefault
: croppedImage != null
? handleSubmit
: handleShapeSubmit
}
handleCancel={handleEditImageCancle}
/>
</>
);
};
export default CropUpload;

78
src/Components/Forms/Cropper2.jsx Normal file
View File

@ -0,0 +1,78 @@
import React, { useRef, useEffect, useState } from 'react';
import Cropper from 'cropperjs';
import 'cropperjs/dist/cropper.css';
import { Button, Slider } from 'antd';
const ImageCropper = ({ imageUrl, onCrop }) => {
const imageRef = useRef(null);
const [cropper, setCropper] = useState(null);
const [rotation, setRotation] = useState(0);
useEffect(() => {
if (imageRef.current && imageUrl) {
if (cropper) {
cropper.replace(imageUrl);
} else {
const newCropper = new Cropper(imageRef.current, {});
setCropper(newCropper);
}
}
return () => {
if (cropper) {
cropper.destroy();
}
};
}, [imageUrl]); // Watch for changes in imageUrl
useEffect(() => {
if (cropper) {
cropper.rotateTo(rotation);
}
}, [rotation]); // Watch for changes in rotation
const handleCrop = () => {
if (cropper) {
const croppedData = cropper.getCroppedCanvas().toDataURL();
onCrop(croppedData);
}
};
const handleRotationChange = (value) => {
setRotation(value);
};
return (
<div
style={{
display: 'flex',
alignItems: 'center',
flexDirection: 'column',
gap: '2rem',
}}
>
<img
ref={imageRef}
src={imageUrl}
alt="Crop Preview"
style={{ width: '300px', height: '150px' }}
/>
<div style={{ display: 'flex', alignItems: 'center', gap: '1rem' }}>
<Button danger onClick={handleCrop}>
Crop Image
</Button>
<span>Rotation: {rotation}°</span>
<Slider
min={0}
max={360}
step={1}
value={rotation}
onChange={handleRotationChange}
style={{ width: '200px' }}
/>
</div>
</div>
);
};
export default ImageCropper;

42
src/Components/Forms/DatePicker.jsx Normal file
View File

@ -0,0 +1,42 @@
import { DatePicker, Space } from 'antd';
export const DatePic = ({ fieldState, ...props }) => {
const { value } = fieldState;
const {
required,
field,
onChange,
onBlur,
canSelectPast,
initialValue,
forwardedRef,
min,
className,
content,
faClass,
icon,
...rest
} = props;
const disabledDate = (current) => {
var date = new Date();
date.setDate(date.getDate() + 1);
return current.valueOf() <= date.setDate(date.getDate() - 2);
};
return (
<Space direction="vertical">
<DatePicker
{...rest}
id={field}
type="date"
ref={forwardedRef}
required={required}
value={value}
disabledDate={canSelectPast ? '' : disabledDate}
format="DD-MM-YYYY"
onChange={onChange}
inputReadOnly={true}
/>
</Space>
);
};

44
src/Components/Forms/DatePickerEmpMaster.jsx Normal file
View File

@ -0,0 +1,44 @@
import { DatePicker, Space } from 'antd';
import dayjs from 'dayjs';
import customParseFormat from 'dayjs/plugin/customParseFormat';
import FloatLabel from './FloatLabel/index.jsx';
dayjs.extend(customParseFormat);
export const DatePic = ({
onChange,
label,
isOnChange,
canSelectPast,
valueData,
}) => {
const disabledDate = (current) => {
const today = dayjs().startOf('day');
if (canSelectPast === undefined) {
return false;
} else if (canSelectPast) {
return current && current > today;
} else {
return current && current < today;
}
};
return (
<Space direction="vertical">
<FloatLabel label={label} isOnChange={isOnChange}>
<DatePicker
style={{ height: '49px' }}
format="DD-MM-YYYY"
value={
valueData != undefined
? dayjs(valueData, 'YYYY-MM-DDTHH:mm:ss')
: ''
}
disabledDate={disabledDate}
onChange={onChange}
inputReadOnly={true}
/>
</FloatLabel>
</Space>
);
};

58
src/Components/Forms/DatePickerProduct.jsx Normal file
View File

@ -0,0 +1,58 @@
import { DatePicker, Space } from 'antd';
import dayjs from 'dayjs';
import customParseFormat from 'dayjs/plugin/customParseFormat';
dayjs.extend(customParseFormat);
export const DatePicProd = ({
onChange,
canSelectPast,
valueData,
disabled,
cancelFuture,
minDate,
dontallowfeature,
}) => {
const disabledDate = (current) => {
var date = new Date();
date.setDate(date.getDate() + 1);
return current.valueOf() <= date.setDate(date.getDate() - 2);
};
const disabledFutureDate = (current) => {
// Can not select days before today and today
return current && current > dayjs().endOf('day');
};
const disabledMinDate = (current) => {
if (minDate) {
return (
current &&
current < dayjs(minDate, 'YYYY-MM-DDTHH:mm:ss').startOf('day')
);
}
return false;
};
return (
<Space direction="vertical">
<DatePicker
format="DD-MM-YYYY"
value={valueData ? dayjs(valueData, 'YYYY-MM-DDTHH:mm:ss') : ''}
disabledDate={(current) => {
if (dontallowfeature) {
return current && current > dayjs().endOf('day');
} else if (canSelectPast) {
if (cancelFuture) {
return disabledFutureDate(current) || disabledMinDate(current);
}
return disabledMinDate(current);
}
return disabledDate(current) || disabledMinDate(current);
}}
disabled={disabled}
onChange={onChange}
inputReadOnly={true}
/>
</Space>
);
};

194
src/Components/Forms/DropDown.jsx Normal file
View File

@ -0,0 +1,194 @@
import { Select } from 'antd';
import classnames from 'classnames';
import FloatLabel from './FloatLabel/index';
import React, { forwardRef, useEffect, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import {
changeDropDownStatus,
GlobalfocusStatusCust,
} from '../../Features/BookingScreen/BookingData/BookingData';
import { validateSafeInput } from '../../Services/Others';
export const DropDowns = forwardRef((props, ref) => {
const {
options,
onChangeFunction,
isOnchanges,
className,
defaultValue,
disabled,
alphabetfilter,
label,
valueData,
labelChange,
...rest
} = props;
const [isOnChangeState, setIsOnChangeState] = useState(isOnchanges);
const dispatch = useDispatch();
const selectStatuscust = useSelector(GlobalfocusStatusCust);
useEffect(() => {
setIsOnChangeState(isOnchanges);
}, [isOnchanges]);
const handleMouseEnter = () => {
dispatch(changeDropDownStatus(true));
};
const handleChangeStatus = () => {
dispatch(changeDropDownStatus(false));
setIsOnChangeState(true);
};
return (
<div onMouseEnter={handleMouseEnter}>
<FloatLabel
ref={ref}
label={label}
value={valueData ?? ''}
isOnChange={valueData != null ? true : isOnChangeState}
>
<Select
{...rest}
showSearch
style={{ width: 250 }}
defaultValue={defaultValue ?? null}
optionFilterProp="children"
filterOption={
props.filterOption !== undefined
? props.filterOption
: !labelChange
? (input, option) =>
(option?.label ?? '')
?.toLowerCase()
?.includes(input?.toLowerCase())
: null
}
filterSort={
!labelChange
? (a, b) =>
alphabetfilter === 'No'
? parseInt(a.value, 10) - parseInt(b.value, 10)
: (a?.label ?? '')
?.toLowerCase()
?.localeCompare((b?.label ?? '')?.toLowerCase())
: null
}
value={valueData}
onChange={(e) => {
onChangeFunction(e);
handleChangeStatus();
}}
options={options}
className={classnames(className)}
disabled={disabled}
// getPopupContainer={(triggerNode) => triggerNode.parentNode}
getPopupContainer={(triggerNode) => document.body}
/>
</FloatLabel>
</div>
);
});
// export const DropDowns = forwardRef(({ options, onChangeFunction, isOnchanges, className, defaultValue, disabled, numberOpt, alphabetfilter, ...props },ref) => {
// const [inpValue, setInputValue] = useState('')
// const [isOnchange, setisOnchange] = useState(isOnchanges)
// const dispatch = useDispatch();
// const selectStatuscust = useSelector(GlobalfocusStatusCust);
// useEffect(() => {
// setisOnchange(isOnchanges)
// }, [isOnchanges])
// const changeStatus = () => {
// dispatch(changeDropDownStatus(false))
// setisOnchange(true)
// }
// const {
// field,
// onChange,
// label,
// onBlur,
// forwardedRef,
// required,
// valueData,
// labelChange,
// ...rest
// } = props;
// const MouseFunction = async (e) => {
// dispatch(changeDropDownStatus(e))
// }
// const openMenuClick = async () => {
// // await dispatch(changefocusStatusCustMouse(true));
// }
// // const HandleClick = async (e) => {
// // MouseFunction(false)
// // if (!e) {
// // dispatch(changefocusStatusCust(!selectStatuscust));
// // }
// // };
// return (
// <div onMouseEnter={() => MouseFunction(true)}
// // onMouseLeave={() => MouseFunction(false)}
// // last i commet this one
// onClick={() => openMenuClick()}>
// <FloatLabel
// label={label}
// value={inpValue}
// isOnChange={valueData != null ? true : isOnchange}
// >
// <Select
// showSearch
// ref={ref}
// style={{
// width: 250
// }}
// defaultValue={defaultValue ? defaultValue : null}
// optionFilterProp="children"
// filterOption={
// !labelChange
// ? (input, option) =>
// (option?.label ?? '')
// .toLowerCase()
// .includes(input?.toLowerCase())
// : null
// }
// filterSort={
// !labelChange
// ? (optionA, optionB) => {
// if (alphabetfilter === "No") {
// return parseInt(optionA.value, 10) - parseInt(optionB.value, 10);
// } else {
// return (optionA?.label ?? '')
// ?.toLowerCase()
// ?.localeCompare((optionB?.label ?? '').toLowerCase());
// }
// }
// : null
// }
// value={valueData}
// onChange={(e) => {
// onChangeFunction(e);
// changeStatus();
// }}
// onSelect={(e) => changeStatus(e)}
// options={options}
// className={classnames(` ${className}`)}
// disabled={disabled ? true : false}
// // onMenuClose={() => HandleClick(false)}
// />
// </FloatLabel>
// </div>
// )
// });

101
src/Components/Forms/DropDown1.jsx Normal file
View File

@ -0,0 +1,101 @@
import { Select } from 'antd';
import classnames from 'classnames';
import FloatLabel from './FloatLabel/index';
import React, { useEffect, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import {
changeDropDownStatus,
GlobalfocusStatusCust,
} from '../../Features/BookingScreen/BookingData/BookingData';
export const DropDowns1 = ({
options,
onChangeFunction,
isOnchanges,
className,
defaultValue,
disabled,
numberOpt,
alphabetfilter,
labelChange,
valueData,
label,
...props
}) => {
const [inpValue, setInputValue] = useState('');
const [isOnchange, setisOnchange] = useState(isOnchanges);
const dispatch = useDispatch();
const selectStatuscust = useSelector(GlobalfocusStatusCust);
useEffect(() => {
setisOnchange(isOnchanges);
}, [isOnchanges]);
const changeStatus = () => {
dispatch(changeDropDownStatus(false));
setisOnchange(true);
};
const MouseFunction = (e) => {
dispatch(changeDropDownStatus(e));
};
const openMenuClick = () => {
// You can add logic here if needed
};
return (
<div
onMouseEnter={() => MouseFunction(true)}
// onMouseLeave={() => MouseFunction(false)} // uncomment if needed
onClick={() => openMenuClick()}
>
<FloatLabel
label={label}
value={inpValue}
isOnChange={valueData != null ? true : isOnchange}
>
<Select
showSearch
style={{ width: 250 }}
defaultValue={defaultValue ?? null}
optionFilterProp="children"
filterOption={
!labelChange
? (input, option) => {
// Use searchLabel if available, else empty string (to avoid errors)
const target = option?.searchLabel ?? '';
return target?.toLowerCase().includes(input?.toLowerCase());
}
: null
}
filterSort={
!labelChange
? (optionA, optionB) => {
if (alphabetfilter === 'No') {
return (
parseInt(optionA.value, 10) - parseInt(optionB.value, 10)
);
} else {
const a = optionA?.searchLabel ?? '';
const b = optionB?.searchLabel ?? '';
return a?.toLowerCase()?.localeCompare(b?.toLowerCase());
}
}
: null
}
value={valueData}
onChange={(e) => {
onChangeFunction(e);
changeStatus();
}}
onSelect={(e) => changeStatus(e)}
options={options}
className={classnames(className)}
disabled={!!disabled}
{...props}
/>
</FloatLabel>
</div>
);
};

61
src/Components/Forms/FilterSearch.jsx Normal file
View File

@ -0,0 +1,61 @@
import { Select } from 'antd';
import classnames from 'classnames';
import FloatLabel from './FloatLabel/index';
import React, { useState } from 'react';
export const FilterButton = ({
options,
onChangeFunction,
isOnchanges,
className,
defaultValue,
disabled,
onSearch,
onSearchChange,
...props
}) => {
const [inpValue, setInputValue] = useState('');
const [isOnchange, setisOnchange] = useState(isOnchanges);
const changeStatus = async () => {
await setisOnchange(true);
};
const {
field,
onChange,
label,
onBlur,
forwardedRef,
required,
valueData,
...rest
} = props;
return (
<FloatLabel label={label} value={inpValue} isOnChange={isOnchange}>
<Select
showSearch
style={{
width: 220,
}}
defaultValue={defaultValue ? defaultValue : null}
optionFilterProp="children"
filterOption={(input, option) => (option?.label ?? '')?.includes(input)}
filterSort={(optionA, optionB) =>
(optionA?.label ?? '')
?.toLowerCase()
?.localeCompare((optionB?.label ?? '')?.toLowerCase())
}
value={valueData}
onChange={(e) => onChangeFunction(e)}
onSelect={(e) => changeStatus(e)}
options={options}
className={classnames(` ${className}`)}
disabled={disabled ? true : false}
/>
</FloatLabel>
);
};
export default FilterButton;

24
src/Components/Forms/FloatLabel/index.css Normal file
View File

@ -0,0 +1,24 @@
.float-label {
position: relative;
margin-bottom: 12px;
}
.label {
font-size: 14px !important;
font-weight: normal;
position: absolute;
pointer-events: none;
left: 12px;
font-family: Arial, Helvetica, sans-serif;
top: 14px;
transition: 0.2s ease all;
}
.label-float {
font-size: 12px !important;
top: 2px;
left: 12px;
font-style: normal;
color: #007eb5;
z-index: 23;
}

25
src/Components/Forms/FloatLabel/index.jsx Normal file
View File

@ -0,0 +1,25 @@
import React, { useState } from 'react';
import './index.css';
const FloatLabel = (props) => {
const [focus, setFocus] = useState(false);
const { children, label, value, isOnChange } = props;
const labelClass =
focus || (value && value?.length !== 0) || isOnChange
? 'label label-float'
: 'label';
return (
<div
className="float-label"
onBlur={() => setFocus(false)}
onFocus={() => setFocus(true)}
>
{children}
<label className={labelClass}>{label}</label>
</div>
);
};
export default FloatLabel;

108
src/Components/Forms/InputField.jsx Normal file
View File

@ -0,0 +1,108 @@
// import React, {useState } from "react";
// import { Input} from "antd";
// import FloatLabel from "./FloatLabel/index.jsx";
// import "./main.scss";
// export const InputField = ({...props}) => {
// const [inpValue , setInputValue] = useState('')
// const {
// onChange,
// isOnChange,
// onBlur,
// onKeyUp,
// label,
// disable=false,
// ...rest
// } = props;
// return (
// <div className="example">
// <FloatLabel
// label={label}
// value = {inpValue}
// isOnChange= {isOnChange}
// >
// <Input
// disabled={disable}
// {...rest}
// onChange={(e) => {
// setInputValue(e?.target?.value)
// if (onChange) {
// onChange(e);
// }
// }}
// onBlur={(e) => {
// if (onBlur) {
// onBlur(e);
// }
// }}
// onKeyUp={(e) => {
// if (onKeyUp) {
// onKeyUp(e);
// }
// }}
// autoComplete="Off"
// />
// </FloatLabel>
// </div>
// );
// };
import React, {
forwardRef,
useImperativeHandle,
useRef,
useState,
} from 'react';
import { Input } from 'antd';
import FloatLabel from './FloatLabel/index.jsx';
import './main.scss';
// Last changes for shigfayath
export const InputField = forwardRef((props, outerRef) => {
const [inpValue, setInputValue] = useState('');
const inputRef = useRef(null);
const wrapperRef = useRef(null);
const {
onChange,
isOnChange,
onBlur,
onKeyUp,
label,
disable = false,
...rest
} = props;
useImperativeHandle(outerRef, () => wrapperRef.current);
return (
<div className="example" ref={wrapperRef}>
<FloatLabel label={label} value={inpValue} isOnChange={isOnChange}>
<Input
ref={inputRef}
disabled={disable}
{...rest}
onChange={(e) => {
setInputValue(e?.target?.value);
if (onChange) {
onChange(e);
}
}}
onBlur={(e) => {
if (onBlur) {
onBlur(e);
}
}}
onKeyUp={(e) => {
if (onKeyUp) {
onKeyUp(e);
}
}}
autoComplete="Off"
/>
</FloatLabel>
</div>
);
});

20
src/Components/Forms/RadioBtn.scss Normal file
View File

@ -0,0 +1,20 @@
.ant-radio-wrapper .ant-radio-checked .ant-radio-inner {
border-color: #000000;
background-color: #000000;
}
.ant-radio-wrapper .ant-radio-inner {
box-sizing: border-box;
position: relative;
inset-block-start: 0;
inset-inline-start: 0;
display: block;
width: 16px;
height: 16px;
background-color: #ffffff;
border-color: #000000;
border-style: solid;
border-width: 1px;
border-radius: 50%;
transition: all 0.2s;
}

54
src/Components/Forms/RadioGroup.jsx Normal file
View File

@ -0,0 +1,54 @@
import { Radio } from 'antd';
import { useEffect, useState } from 'react';
import './RadioBtn.scss';
export const RadioGrpButton = ({ fieldState, style, ...props }) => {
const {
field,
onBlur,
initialValue,
forwardedRef,
onClickFunction,
className,
onSelectFuntion,
content,
Header,
defaultSelect,
disabled,
...rest
} = props;
const [value, setValue] = useState(defaultSelect);
const onChange = (e) => {
setValue(e?.target?.value);
if (onSelectFuntion) {
onSelectFuntion(e?.target?.value);
}
};
const onClickfun = (e) => {
if (onClickFunction) {
onClickFunction(e?.target?.value);
}
};
useEffect(() => {
setValue(defaultSelect);
}, [props]);
return (
<div>
<p style={{ paddingBottom: '10px', fontWeight: '500' }}>{Header}</p>
<Radio.Group onChange={onChange} value={value}>
{content?.map((key, index) => (
<Radio
value={key.value}
key={index}
onClick={(e) => onClickfun(e)}
disabled={disabled ? disabled : false}
>
{key.label}
</Radio>
))}
</Radio.Group>
</div>
);
};

25
src/Components/Forms/Radiobtn.jsx Normal file
View File

@ -0,0 +1,25 @@
import { Radio } from 'antd';
export const RadioButton = ({ faClass, style, ...props }) => {
const { onChange, onBlur, ...rest } = props;
return (
<Radio
{...rest}
name={props.props.name}
value={props.props.value}
onChange={(e) => {
if (onChange) {
onChange(e);
}
}}
onBlur={(e) => {
if (onBlur) {
onBlur(e);
}
}}
>
{props.props.label}
</Radio>
);
};

34
src/Components/Forms/ScannerInputField.jsx Normal file
View File

@ -0,0 +1,34 @@
import React, { useState } from 'react';
import { Input } from 'antd';
import FloatLabel from './FloatLabel/index.jsx';
import './main.scss';
export const ScannerInputField = ({ ...props }) => {
const [inpValue, setInputValue] = useState('');
const {
onChange,
isOnChange,
label,
valueData,
...rest
} = props;
return (
<div className="example">
<FloatLabel label={label} value={inpValue} isOnChange={isOnChange}>
<Input
{...rest}
onChange={(e) => {
setInputValue(e?.target?.value);
if (onChange) {
onChange(e);
}
}}
/>
</FloatLabel>
</div>
);
};

22
src/Components/Forms/Search.jsx Normal file
View File

@ -0,0 +1,22 @@
import { Input } from 'antd';
import { SearchOutlined } from '@ant-design/icons';
import './main.scss';
import React from 'react';
export const Search = React.forwardRef(({ placeholder, onSearch, onSearchChange, value }, ref) => {
return (
<Input
ref={ref}
maxLength={50}
value={value}
className="searchDiv"
placeholder={placeholder}
prefix={<SearchOutlined style={{ color: '#999' }} />}
onPressEnter={onSearch}
onChange={onSearchChange}
/>
)
})
export default Search;

244
src/Components/Forms/ShapeCropper.jsx Normal file
View File

@ -0,0 +1,244 @@
import React, { useEffect, useRef, useState, useCallback } from 'react';
import { ReloadOutlined, EyeOutlined, DeleteFilled } from '@ant-design/icons';
import { Messages } from '../../Components/Notifications/Messages';
import TooltipWrapper from '../../Components/Tooltip/Tooltip';
import { isMobile } from 'react-device-detect';
const ShapeCropper = ({ imageUrl, onShape }) => {
const canvasRef = useRef(null);
const imgRef = useRef(null);
const [messageType, setMessageType] = useState(null);
const [messageData, setMessageData] = useState(null);
const [points, setPoints] = useState([]);
const [imageLoaded, setImageLoaded] = useState(false);
const [clippedImages, setClippedImages] = useState([]);
const [definingClippingPath, setDefiningClippingPath] = useState(false);
const [isPreview, setIsPreview] = useState(false);
useEffect(() => {
setPoints([]);
setClippedImages([]);
setDefiningClippingPath(true);
setImageLoaded(false);
const canvas = canvasRef.current;
const ctx = canvas.getContext('2d');
const img = new Image();
img.crossOrigin = 'anonymous';
img.onload = () => {
imgRef.current = img;
canvas.width = img.width;
canvas.height = img.height;
ctx.drawImage(img, 0, 0);
setImageLoaded(true);
};
img.src = imageUrl;
return () => {
ctx.clearRect(0, 0, canvas.width, canvas.height);
setPoints([]);
setClippedImages([]);
setImageLoaded(false);
setDefiningClippingPath(true);
};
}, [imageUrl]);
useEffect(() => {
if (imageLoaded && definingClippingPath) {
const canvas = canvasRef.current;
const ctx = canvas.getContext('2d');
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.drawImage(imgRef.current, 0, 0);
drawClippingPath(ctx);
}
}, [imageLoaded, definingClippingPath, points]);
useEffect(() => {
if (clippedImages.length > 0) {
onShape(clippedImages);
}
}, [clippedImages]);
const onComplete = useCallback(() => {
setMessageData(null);
setMessageType(null);
}, []);
const handleMouseDown = (e) => {
e.preventDefault();
e.stopPropagation();
const rect = canvasRef.current.getBoundingClientRect();
const mx = e.clientX - rect.left;
const my = e.clientY - rect.top;
if (
points.length > 1 &&
Math.abs(mx - points[0].x) < 10 &&
Math.abs(my - points[0].y) < 10
) {
clipIt();
setDefiningClippingPath(false);
} else {
setPoints([...points, { x: mx, y: my }]);
}
};
const drawClippingPath = (ctx) => {
ctx.strokeStyle = '#ff4d4f';
ctx.beginPath();
if (points.length > 0) {
ctx.moveTo(points[0].x, points[0].y);
for (let i = 1; i < points.length; i++) {
ctx.lineTo(points[i].x, points[i].y);
}
ctx.lineTo(points[0].x, points[0].y);
}
ctx.stroke();
if (points.length > 0) {
ctx.beginPath();
ctx.arc(points[0].x, points[0].y, 10, 0, Math.PI * 2);
ctx.stroke();
}
};
const clipIt = () => {
const canvas = canvasRef.current;
const ctx = canvas.getContext('2d');
const minX = Math.min(...points.map((point) => point.x));
const minY = Math.min(...points.map((point) => point.y));
const maxX = Math.max(...points.map((point) => point.x));
const maxY = Math.max(...points.map((point) => point.y));
const width = maxX - minX;
const height = maxY - minY;
const clippedCanvas = document.createElement('canvas');
clippedCanvas.width = width;
clippedCanvas.height = height;
const clippedCtx = clippedCanvas.getContext('2d');
clippedCtx.drawImage(
imgRef.current,
minX,
minY,
width,
height,
0,
0,
width,
height
);
setMessageType('success');
setMessageData('Image Cropped Successfully');
setClippedImages((prevImages) => [
...prevImages,
clippedCanvas.toDataURL(),
]);
setPoints([]);
};
const setReset = () => {
if (points?.length > 0) {
setPoints([]);
onShape(null);
const canvas = canvasRef.current;
const ctx = canvas.getContext('2d');
ctx.clearRect(0, 0, canvas.width, canvas.height);
} else {
setMessageType('error');
setMessageData('No Clipping Region');
}
};
const setPreview = () => {
if (clippedImages?.length > 0) {
setIsPreview(!isPreview);
} else {
setMessageType('error');
setMessageData('No Image Found To Preview');
}
};
const setRemove = () => {
if (clippedImages?.length > 0) {
setClippedImages([]);
setPoints([]);
setIsPreview(false);
setDefiningClippingPath(true);
onShape(null);
} else {
setMessageType('error');
setMessageData('No Image Found To Remove');
}
};
return (
<div className="shape-crop">
<Messages
messageType={messageType}
messageData={messageData}
onComplete={onComplete}
/>
<h4>
Click to outline clipping region. Click back in starting circle to
complete the clip.
</h4>
<div className="shape-crop-subdiv">
<div>
<canvas
ref={canvasRef}
width={300}
height={150}
style={{ border: '1px solid black' }}
onMouseDown={handleMouseDown}
></canvas>
</div>
<div>
{isPreview &&
clippedImages?.map((image, index) => (
<img
key={index}
src={image}
alt={`Clipped image ${index}`}
style={{ width: '200px', height: '100px' }}
/>
))}
</div>
</div>
<div className="shape-crop-subdiv">
<div>
<TooltipWrapper title={'Reset'} isMobile={isMobile}>
<ReloadOutlined
className="shape-reset"
onClick={() => setReset()}
/>
</TooltipWrapper>
</div>
<div>
<TooltipWrapper title={'Preview'} isMobile={isMobile}>
<EyeOutlined
className="shape-preview"
onClick={() => setPreview()}
/>
</TooltipWrapper>
</div>
<div>
<TooltipWrapper title={'Remove'} isMobile={isMobile}>
<DeleteFilled
className="shape-delete"
onClick={() => setRemove()}
/>
</TooltipWrapper>
</div>
</div>
</div>
);
};
export default ShapeCropper;

5
src/Components/Forms/Switch.jsx Normal file
View File

@ -0,0 +1,5 @@
import { Switch } from 'antd';
export const Toggle = ({ defaultChecked, functionName }) => {
return <Switch defaultChecked={defaultChecked} onChange={functionName} />;
};

40
src/Components/Forms/TextArea.jsx Normal file
View File

@ -0,0 +1,40 @@
import React, { useEffect, useState } from 'react';
import { Input } from 'antd';
import FloatLabel from './FloatLabel/index.jsx';
import './main.scss';
export const TextAreaInput = ({ ...props }) => {
const [inpValue, setInputValue] = useState(props?.defaultValue || '');
const { TextArea } = Input;
useEffect(() => {
setInputValue(props?.defaultValue);
}, [props?.defaultValue]);
const { onChange, isOnChange, onBlur, label,width = false, ...rest } = props;
return (
<div className={width? "" : "example"} style={{ width: width ? '100%' : 'auto' }}>
<FloatLabel label={label} value={inpValue} isOnChange={isOnChange}>
<TextArea
{...rest}
onChange={(e) => {
setInputValue(e?.target?.value);
if (onChange) {
onChange(e);
}
}}
onBlur={(e) => {
if (onBlur) {
onBlur(e);
}
}}
/>
</FloatLabel>
</div>
);
};
export default TextAreaInput;

23
src/Components/Forms/TimePicker.jsx Normal file
View File

@ -0,0 +1,23 @@
import { TimePicker } from 'antd';
import dayjs from 'dayjs';
import customParseFormat from 'dayjs/plugin/customParseFormat';
import FloatLabel from './FloatLabel/index.jsx';
import './main.scss';
dayjs.extend(customParseFormat);
export const TimePickers = ({ label, isOnChange, onChange, valueData }) => (
<div className="example">
<FloatLabel label={label} isOnChange={isOnChange}>
<TimePicker
className="TimePickerDiv"
use12Hours
format="h:mm a"
onChange={onChange}
value={valueData != undefined ? dayjs(valueData, 'HH:mm:ss') : ''}
inputReadOnly={true}
/>
</FloatLabel>
</div>
);
export default TimePickers;

19
src/Components/Forms/TimePickerProduct.jsx Normal file
View File

@ -0,0 +1,19 @@
import { TimePicker } from 'antd';
import './main.scss';
import dayjs from 'dayjs';
import customParseFormat from 'dayjs/plugin/customParseFormat';
dayjs.extend(customParseFormat);
export const TimePickers = ({ onChange, valueData }) => (
<div>
<TimePicker
use12Hours
format="h:mm a"
onChange={onChange}
value={valueData != undefined ? dayjs(valueData, 'HH:mm:ss') : ''}
inputReadOnly={true}
/>
</div>
);
export default TimePickers;

131
src/Components/Forms/Upload.jsx Normal file
View File

@ -0,0 +1,131 @@
import { useEffect, useState } from 'react';
import { useDispatch } from 'react-redux';
import { Modal, Upload } from 'antd';
import { PlusOutlined } from '@ant-design/icons';
import { uploadImage } from '../../Features/upload/upload';
const allowedTypes = [
'image/jpeg',
'image/png',
'image/webp',
'image/svg+xml',
'image/gif',
'image/avif',
];
const getBase64 = (file) =>
new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = (error) => reject(error);
});
const App = ({ singleImage, updateImageUrl, ImageLink = '', listType }) => {
const dispatch = useDispatch();
const [previewOpen, setPreviewOpen] = useState(false);
const [previewImage, setPreviewImage] = useState('');
const [previewTitle, setPreviewTitle] = useState('');
const [fileList, setFileList] = useState([]);
useEffect(() => {
// Inside Imageupload.jsx
const safeLink = typeof ImageLink === 'string' ? ImageLink : '';
if (safeLink != '' && safeLink != null) {
setFileList([{ url: safeLink }]);
} else {
setFileList([]);
}
}, [ImageLink]);
const handleCancel = () => setPreviewOpen(false);
const handlePreview = async (file) => {
if (!file.url && !file.preview) {
file.preview = await getBase64(file.originFileObj);
}
setPreviewImage(file.url || file.preview);
setPreviewOpen(true);
setPreviewTitle(
file.name || file.url.substring(file.url.lastIndexOf('/') + 1)
);
};
const handleRemove = () => {
updateImageUrl('');
};
const handleChange = async ({ fileList: newFileList }) => {
if (newFileList?.length > 0) {
let data = await dispatch(
uploadImage(newFileList[0].originFileObj)
).unwrap();
if (data?.data?.status) {
updateImageUrl(data?.data?.image);
setFileList([{ url: data?.data?.image }]);
}
} else {
updateImageUrl('');
setFileList(newFileList);
}
};
const beforeUpload = (file) => {
const isAllowed = allowedTypes.includes(file.type);
if (!isAllowed) {
Modal.error({
title: 'Invalid File Type',
content:
'Only JPG, JPEG, PNG, WEBP, SVG, GIF, and AVIF files are allowed.',
});
}
return isAllowed || Upload.LIST_IGNORE; // prevents adding to fileList if invalid
};
const uploadButton = (
<div>
<PlusOutlined />
<div
style={{
marginTop: 8,
}}
className="uploadText"
>
Upload
</div>
</div>
);
return (
<>
<Upload
action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
listType={listType ? listType : 'picture-circle'}
fileList={fileList}
onPreview={handlePreview}
onChange={handleChange}
onRemove={handleRemove}
beforeUpload={beforeUpload}
>
{singleImage && fileList?.length == 0
? uploadButton
: !singleImage && fileList?.length <= 8
? uploadButton
: null}
</Upload>
<Modal
open={previewOpen}
title={''}
footer={null}
onCancel={handleCancel}
>
<img
alt="example"
style={{
width: '100%',
}}
src={previewImage}
/>
</Modal>
</>
);
};
export default App;

63
src/Components/Forms/VideoUpload.jsx Normal file
View File

@ -0,0 +1,63 @@
import React, { useEffect, useRef, useState } from 'react';
import { useDispatch } from 'react-redux';
import { uploadImage } from '../../Features/upload/upload';
import videoBg from '../../Images/TemplateImages/videobg.svg';
import './VideoUpload.scss';
export default function VideoInput({ updateVideoUrl, videoUrl }) {
const inputRef = useRef();
const dispatch = useDispatch();
const [source, setSource] = useState();
useEffect(() => {
if (videoUrl) {
setSource(videoUrl);
} else {
if (inputRef?.current) {
inputRef?.current?.value = null;
}
setSource();
}
}, [videoUrl]);
const handleFileChange = async (event) => {
let file = event.target.files[0];
if (event.target.files?.length > 0) {
let data = await dispatch(uploadImage(file)).unwrap();
if (data?.data?.status) {
updateVideoUrl(data?.data?.image);
setSource(data?.data?.image);
}
} else {
updateVideoUrl('');
setSource('');
}
};
const handleChoose = (event) => {
inputRef?.current?.click();
};
return (
<div>
<input
ref={inputRef}
className="VideoInput_input"
type="file"
onChange={handleFileChange}
accept=".mov,.mp4"
/>
{!source && (
<button
type="button"
style={{ backgroundColor: '#cfcfcf', borderColor: '#cfcfcf' }}
onClick={handleChoose}
>
<img src={videoBg} style={{ width: '150px', height: '85px' }}></img>
</button>
)}
{source && <video className="VideoInput_video" controls src={source} />}
</div>
);
}

18
src/Components/Forms/VideoUpload.scss Normal file
View File

@ -0,0 +1,18 @@
.VideoInput_input {
display: none;
}
.VideoInput_video {
display: block;
margin: 0;
height: 85px;
width: 150px;
}
.VideoInput_footer {
background: #eee;
width: 100%;
min-height: 40px;
line-height: 40px;
text-align: center;
}

39
src/Components/Forms/inputFiledCustom.jsx Normal file
View File

@ -0,0 +1,39 @@
import React, { useState } from 'react';
import { Input } from 'antd';
import FloatLabel from './FloatLabel/index.jsx';
import './main.scss';
export const InputFieldCustom = ({ ...props }) => {
const [inpValue, setInputValue] = useState('');
const { onChange, isOnChange, onBlur, label, ...rest } = props;
return (
<div
className={'CustomInputField'}
style={{ marginLeft: '-40px', width: '70px', fontSize: '14px' }}
>
<FloatLabel
label={label}
value={inpValue}
isOnChange={isOnChange}
style={{ width: '12px !important' }}
>
<Input
{...rest}
onChange={(e) => {
setInputValue(e?.target?.value);
if (onChange) {
onChange(e);
}
}}
onBlur={(e) => {
if (onBlur) {
onBlur(e);
}
}}
autoComplete="Off"
/>
</FloatLabel>
</div>
);
};

922
src/Components/Forms/main.scss Normal file
View File

@ -0,0 +1,922 @@
.example {
width: var(--INPUT_FIELD_WIDTH);
}
.ant-input {
padding: 18px 14px 6px 11px;
font-size: 16px;
font-weight: 490;
color: #000;
}
.ant-input:hover {
padding: 18px 14px 6px 11px;
font-size: 16px;
border: var(--DEFAULT_SELECTED_COLOR) solid 1px;
}
.ant-input:focus {
padding: 18px 14px 6px 11px;
font-size: 16px;
border: var(--DEFAULT_SELECTED_COLOR) solid 1px;
}
.ant-select .ant-select-selector {
padding: 16px 10px 4px 11px;
}
.ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
padding: 8px 10px 4px 11px;
height: 53px;
font-size: 16px;
padding: 10px;
font-weight: 600;
}
.ant-select .ant-select-selector {
padding: 16px 10px 4px 11px;
}
.ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
padding: 8px 10px 4px 11px;
height: 48px;
font-size: 16px;
padding: 10px;
font-weight: 600;
}
.ant-select-single .ant-select-selector .ant-select-selection-search {
top: 16px;
font-size: 16px;
}
:where(.css-dev-only-do-not-override-1fviqcj).ant-select-dropdown .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
color: rgba(255, 255, 255, 0.88);
font-weight: 600;
background-color: var(--PRIMARY_BUTTON_BG_COLOR);
}
.primary_Button {
width: 170px;
height: 42px;
background-color: var(--PRIMARY_BUTTON_BG_COLOR) !important;
color: #fff;
font-family: var(--HEADING_FONT_FAMILY);
font-style: normal;
font-weight: 500;
font-size: 14px;
border-radius: 8px;
display: flex;
letter-spacing: 0.5px;
justify-content: space-between;
align-items: center;
z-index: 2;
}
.primary_Button {
border: 1px solid;
overflow: hidden;
span {
z-index: 20;
}
&:after {
background: #fff;
content: '';
height: 155px;
left: -75px;
opacity: 0.2;
position: absolute;
top: -50px;
transform: rotate(35deg);
transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
width: 50px;
z-index: -10;
}
}
.primary_Button:hover {
&:after {
left: 120%;
transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
}
}
.primary_Button:focus {
border: 1.8px solid var(--PRIMARY_BUTTON_BG_COLOR);
background-color: #ffffff !important;
color: #901d77;
font-weight: 600;
font-size: 14px;
}
.primary_Button:focus:hover {
border: 1.8px solid var(--PRIMARY_BUTTON_BG_COLOR);
background-color: white !important;
color: var(--PRIMARY_BUTTON_BG_COLOR);
font-weight: 600;
font-size: 14px;
}
.secondary_Button {
width: 170px;
height: 42px;
background-color: black !important;
color: #fff;
font-family: var(--HEADING_FONT_FAMILY);
font-style: normal;
font-weight: 500;
font-size: 14px;
border-radius: 8px;
display: flex;
letter-spacing: 0.5px;
justify-content: space-between;
align-items: center;
z-index: 2;
}
.secondary_Button {
border: 1px solid;
overflow: hidden;
span {
z-index: 20;
}
&:after {
background: #fff;
content: '';
height: 155px;
left: -75px;
opacity: 0.2;
position: absolute;
top: -50px;
transform: rotate(35deg);
transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
width: 50px;
z-index: -10;
}
}
.secondary_Button:hover {
&:after {
left: 120%;
transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
}
}
.secondary_Button:focus {
border: 1.8px solid var(--PRIMARY_BUTTON_BG_COLOR);
background-color: #ffffff !important;
color: #901d77;
font-weight: 600;
font-size: 14px;
}
.secondary_Button:focus:hover {
border: 1.8px solid var(--PRIMARY_BUTTON_BG_COLOR);
background-color: white !important;
color: var(--PRIMARY_BUTTON_BG_COLOR);
font-weight: 600;
font-size: 14px;
}
.tertiary_Button {
width: 180px;
height: 42px;
background-color: var(--THIRD_BUTTON_BG_COLOR) !important;
color: #ffffff;
font-family: var(--HEADING_FONT_FAMILY);
font-style: normal;
font-weight: 400;
font-size: 14;
line-height: 18px;
border-radius: 8px;
display: flex;
letter-spacing: 0.5px;
justify-content: center;
align-items: center;
z-index: 2;
// left: 200px;
}
.tertiary_Button {
overflow: hidden;
span {
z-index: 20;
}
&:after {
content: "";
height: 155px;
left: -15px;
opacity: 0.2;
position: absolute;
top: -50px;
transform: rotate(35deg);
transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
width: 50px;
z-index: -10;
}
}
.tertiary_Button:hover {
background-color: #000000 !important;
border-color: #fff !important;
font-weight: 500;
&:after {
left: 120%;
transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
}
}
// .tertiary_Button{
// width: 100px;
// height:30px;
// background-color: var(--THIRD_BUTTON_BG_COLOR) !important;
// color:#fff;
// font-family: var( --HEADING_FONT_FAMILY );
// font-style: normal;
// font-weight: 400;
// font-size: 14;
// line-height: 18px;
// border-radius:8px;
// display: flex;
// letter-spacing: 0.5px;
// justify-content:center;
// align-items: center;
// z-index:2;
// left: 450px;
// }
// .tertiary_Button {
// border: 1px solid;
// overflow: hidden;
// span {
// z-index: 20;
// }
// &:after {
// content: "";
// height: 155px;
// left: -15px;
// opacity: .2;
// position: absolute;
// top: -50px;
// transform: rotate(35deg);
// transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
// width: 50px;
// z-index: -10;
// }
// }
// .tertiary_Button:hover {
// &:after {
// left: 120%;
// transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
// }
// }
Button:disabled,
Button[disabled] {
width: 170px;
height: 45px;
background-color: grey;
color: #fff;
font-family: var(--HEADING_FONT_FAMILY);
font-style: normal;
font-weight: 500;
font-size: 14px;
border-radius: 8px;
display: flex;
letter-spacing: 0.5px;
justify-content: space-between;
align-items: center;
z-index: 2;
}
.primary_Button {
background-color: var(--ERROR_COLOR);
color: white;
padding: 15px;
}
.ant-btn-primary:disabled,
.ant-btn-primary:disabled {
width: 170px;
height: 45px;
background-color: grey !important;
color: #fff;
font-family: var(--HEADING_FONT_FAMILY);
font-style: normal;
font-weight: 500;
font-size: 14px;
border-radius: 8px;
display: flex;
letter-spacing: 0.5px;
justify-content: space-between;
align-items: center;
z-index: 2;
}
.ant-btn-primary:disabled {
height: 25px;
background-color: white !important;
color: #fff;
font-family: var(--HEADING_FONT_FAMILY);
font-style: normal;
font-weight: 500;
font-size: 10px;
border-radius: 8px;
display: flex;
letter-spacing: 0.5px;
justify-content: center;
z-index: 2;
}
.ant-btn-primary:disabled {
background-color: var(--ERROR_COLOR);
color: #858585;
}
.ant-picker-dropdown .ant-picker-cell-in-view.ant-picker-cell-today .ant-picker-cell-inner::before {
position: absolute;
top: 0;
inset-inline-end: 0;
bottom: 0;
inset-inline-start: 0;
z-index: 1;
border: 1px solid var(--PRIMARY_BUTTON_BG_COLOR);
border-radius: 4px;
}
.ant-picker-dropdown .ant-picker-cell-in-view.ant-picker-cell-selected .ant-picker-cell-inner,
:where(.css-dev-only-do-not-override-1fviqcj).ant-picker-dropdown .ant-picker-cell-in-view.ant-picker-cell-range-start .ant-picker-cell-inner,
:where(.css-dev-only-do-not-override-1fviqcj).ant-picker-dropdown .ant-picker-cell-in-view.ant-picker-cell-range-end .ant-picker-cell-inner {
color: #fff;
background: #901d77;
}
.ant-picker-dropdown .ant-picker-today-btn {
color: var(--DEFAULT_SELECTED_COLOR);
}
.ant-checkbox .ant-checkbox-inner {
box-sizing: border-box;
position: relative;
top: 0;
inset-inline-start: 0;
display: block;
width: 16px;
height: 16px;
direction: ltr;
background-color: #ffffff;
border: 1px solid #000;
border-radius: 4px;
border-collapse: separate;
transition: all 0.3s;
}
.ant-checkbox-checked .ant-checkbox-inner {
background-color: #000;
border-color: #000;
}
.ant-pagination .ant-pagination-item-active {
font-weight: 600;
background-color: #ffffff;
border-color: #000000;
}
.ant-pagination .ant-pagination-item-active a {
color: #000000;
}
.ant-table-wrapper .ant-table-thead>tr>th,
.ant-table-wrapper .ant-table-thead>tr>td {
position: relative;
font-weight: 600;
text-align: start;
font-size: 12px;
color: rgb(118, 118, 118);
background: #fafafa;
border-bottom: 1px solid #f0f0f0;
}
.ant-checkbox-wrapper:not(.ant-checkbox-wrapper-disabled):hover .ant-checkbox-checked:not(.ant-checkbox-disabled) .ant-checkbox-inner {
background-color: #000000;
border-color: transparent;
}
.ant-checkbox-wrapper:not(.ant-checkbox-wrapper-disabled):hover .ant-checkbox-inner,
:where(.css-dev-only-do-not-override-1fviqcj).ant-checkbox:not(.ant-checkbox-disabled):hover .ant-checkbox-inner {
border-color: #000000;
}
.ant-switch.ant-switch-checked {
background: var(--SELECTED_COLOR);
}
.ant-switch.ant-switch-checked:hover:not(.ant-switch-disabled) {
background: var(--SELECTED_COLOR);
}
.ant-table-wrapper .ant-table-thead>tr>th,
.ant-table-wrapper .ant-table-thead>tr>td {
position: relative;
color: rgba(64, 64, 64, 0.88);
font-weight: 600;
text-transform: uppercase;
text-align: start;
background: none;
border-bottom: 1px solid #f0f0f0;
font-family: var(--HEADING_FONT_FAMILY);
transition: background 0.2s ease;
transition-duration: 0.6s;
}
.ant-table-wrapper .ant-table {
box-sizing: border-box;
margin: 0;
padding: 0;
color: rgb(14 14 14 / 88%);
font-size: 14px;
line-height: 1.5714285714285714;
list-style: none;
font-family: var(--HEADING_FONT_FAMILY);
background: none;
background-color: rgba(255, 255, 255, 0.036);
border-radius: 5px;
transition-duration: 0.6s;
}
.ant-table-wrapper table {
width: 100%;
text-align: start;
border-radius: 8px 8px 0 0;
border-collapse: separate;
border-spacing: 0;
}
.ant-table-wrapper .ant-table:hover {
box-sizing: border-box;
margin: 0;
padding: 0;
color: rgb(14 14 14 / 88%);
font-size: 14px;
line-height: 1.5714285714;
list-style: none;
border-radius: 8px 8px 0 0;
transition-duration: 0.6s;
}
.ant-table-cell-row-hover {
font-size: 14px;
font-weight: 600;
transition-duration: 0.6s;
}
.ant-table-wrapper .ant-table-pagination-right {
justify-content: flex-start;
}
.ant-pagination .ant-pagination-item {
display: inline-block;
min-width: 32px;
height: 32px;
margin-inline-end: 8px;
font-family:
-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',
Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
'Segoe UI Symbol', 'Noto Color Emoji';
line-height: 30px;
text-align: center;
vertical-align: middle;
list-style: none;
background-color: white;
border-radius: 6px;
outline: 0;
cursor: pointer;
user-select: none;
}
.ant-menu .ant-menu-item .ant-menu-item-icon,
.ant-menu .ant-menu-submenu-title .ant-menu-item-icon,
:where(.css-dev-only-do-not-override-1fviqcj).ant-menu .ant-menu-item .anticon,
:where(.css-dev-only-do-not-override-1fviqcj).ant-menu .ant-menu-submenu-title .anticon {
min-width: 14px;
font-size: 20px;
position: relative;
top: 13px;
transition:
font-size 0.2s cubic-bezier(0.215, 0.61, 0.355, 1),
margin 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
color 0.3s;
}
:where(.css-2i2tap).ant-menu-vertical>.ant-menu-submenu>.ant-menu-submenu-title {
align-items: center;
}
:where(.css-zg0ahe).ant-menu-vertical>.ant-menu-submenu>.ant-menu-submenu-title {
align-items: center;
}
.ant-menu-light,
.ant-menu-light>.ant-menu {
color: rgba(0, 0, 0, 0.88);
background: none;
//dhana
// padding: 1vw 0vh;
//
}
.ant-form-item .ant-form-item-explain-error {
color: var(--ERROR_COLOR);
position: relative;
}
.ant-table-cell {
background: #fafafa7a;
//vicky
padding: 1px 8px !important;
}
.ant-input-affix-wrapper>input.ant-input {
font-size: inherit;
border: none;
border-radius: 0;
outline: none;
transition-duration: 0.6s;
}
.ant-input-affix-wrapper:not(.ant-input-affix-wrapper-disabled):hover {
border-color: #4096ff;
border-inline-end-width: 1px;
background-color: none;
z-index: 0;
transition-duration: 0.6s;
}
.ant-input-affix-wrapper {
position: relative;
display: inline-flex;
width: 100%;
min-width: 0;
color: rgba(0, 0, 0, 0.88);
height: 50px;
line-height: 1.5714285714285714;
background-color: #ffffff;
background-image: none;
border-width: 1px;
border-style: solid;
border-color: #acacac;
border-radius: 6px;
font-size: 16px;
transition: all 0.2s;
}
.ant-input-affix-wrapper>input.ant-input {
font-size: inherit;
border: none;
border-radius: 0;
outline: none;
}
.ant-input-affix-wrapper>input.ant-input {
font-size: inherit;
border: none;
padding: 23px 2px;
padding-top: 1rem;
border-radius: 0;
outline: none;
}
.ant-upload-drag-icon {
color: #000;
}
.ant-upload-text {
font-family: var(--HEADING_FONT_FAMILY);
}
.ant-upload-hint {
font-family: var(--PARA_FONT_FAMILY);
}
.ant-upload-wrapper .ant-upload-drag p.ant-upload-drag-icon .anticon {
color: #6a6a6a;
font-size: 48px;
}
.ant-table table {
border-spacing: 0 10px;
transition-duration: 0.6s;
}
.ant-table-wrapper .ant-table-tbody>tr.ant-table-row>td,
.ant-table-wrapper .ant-table-tbody>tr>th.ant-table-cell-row>td.ant-table-cell-row {
background: #ffffff8e;
box-shadow: rgba(100, 100, 111, 0.018) 0px 7px 29px 0px;
}
.ant-table-wrapper .ant-table-tbody>tr.ant-table-row:hover>td,
.ant-table-wrapper .ant-table-tbody>tr>th.ant-table-cell-row-hover>td.ant-table-cell-row-hover {
background: rgb(224, 223, 223);
font-size: 15px;
transition-duration: 0.6s;
// transform: translateY(-8px);
}
.ant-modal .ant-modal-content {
position: relative;
background-color: #ffffff;
background-clip: padding-box;
border: 0;
font-family: var(--HEADING_FONT_FAMILY);
border-radius: 8px;
box-shadow:
0 6px 16px 0 rgba(0, 0, 0, 0.08),
0 3px 6px -4px rgba(0, 0, 0, 0.12),
0 9px 28px 8px rgba(0, 0, 0, 0.05);
pointer-events: auto;
padding: 54px 54px;
color: #000;
max-height: 98vh;
overflow: auto;
}
.ant-modal-footer {
position: relative;
display: flex;
justify-content: flex-end;
}
.ant-modal-root .ant-modal-mask {
backdrop-filter: blur(10px);
}
.ant-pagination .ant-pagination-next {
font-family: Arial, Helvetica, sans-serif;
outline: 1;
background-color: #fff;
}
.ant-pagination .ant-pagination-prev,
.ant-pagination .ant-pagination-next {
font-family: Arial, Helvetica, sans-serif;
background-color: #fff;
}
.ant-pagination .ant-pagination-item {
min-width: 32px;
height: 32px;
margin-inline-end: 8px;
font-family:
-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',
Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
'Segoe UI Symbol', 'Noto Color Emoji';
line-height: 30px;
text-align: center;
vertical-align: middle;
list-style: none;
background-color: white;
border-radius: 6px;
outline: 0;
cursor: pointer;
user-select: none;
}
.ant-pagination .ant-pagination-jump-next .ant-pagination-item-container .ant-pagination-item-ellipsis {
position: absolute;
top: 0;
inset-inline-end: 0;
bottom: 0;
inset-inline-start: 0;
margin: auto;
color: rgba(0, 0, 0, 0.25);
font-family: Arial, Helvetica, sans-serif;
letter-spacing: 2px;
text-align: center;
text-indent: 0.13em;
opacity: 1;
transition: all 0.2s;
}
.ant-pagination .ant-pagination-jump-next .ant-pagination-item-container .ant-pagination-item-link-icon {
color: var(--ERROR_COLOR);
font-size: 12px;
opacity: 0;
transition: all 0.2s;
display: none;
}
.ant-select-single.ant-select-show-arrow .ant-select-selection-item,
.ant-select-single.ant-select-show-arrow .ant-select-selection-placeholder {
padding-inline-end: 18px;
text-align: initial;
}
.ant-select-single.ant-select-show-arrow .ant-select-selection-item,
.ant-select-single.ant-select-show-arrow .ant-select-selection-placeholder {
padding-inline-end: 59px;
text-align: initial;
font-size: 14px;
color: #626262;
font-weight: 400;
font-family: 'Poppins', sans-serif;
padding-top: 16px;
}
.ant-select .ant-select-arrow {
display: flex;
align-items: center;
color: rgba(0, 0, 0, 0.517);
font-style: normal;
line-height: 1;
text-align: center;
text-transform: none;
vertical-align: -0.125em;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
position: absolute;
top: 50%;
inset-inline-start: auto;
inset-inline-end: 11px;
height: 110p;
margin-top: -6px;
font-size: 16px;
pointer-events: none;
}
.ant-select:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-search-input {
padding: 0;
border: none;
height: 20px;
font-size: 16px;
position: relative;
bottom: 0.5rem;
appearance: none;
}
.ant-table-wrapper .ant-table-column-sorter {
margin-inline-start: 4px;
color: rgba(0, 0, 0, 0.29);
font-size: 0;
transition: color 0.3s;
}
.ant-input:disabled {
color: #000;
}
.ant-form-item-row .ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-textarea-affix-wrapper {
height: 100%;
}
.ant-input-search-button {
display: none;
}
.ant-input-search {
width: var(--INPUT_FIELD_WIDTH) !important;
}
.searchDiv .ant-input {
padding: 0.25rem 0.5rem;
border-radius: 0.25rem !important;
width: 100%;
height: 45px;
font-size: 14px;
}
.radio-buttons {
display: flex;
justify-content: center;
align-items: center;
}
.download-link {
background: none;
border: none;
color: #1292ee;
cursor: pointer;
button {
border: none;
background-color: #dadadaff;
padding: 10px 16px;
width: max-content;
cursor: pointer;
gap: 4px;
align-items: flex-start;
display: flex;
border-radius: 8px;
opacity: 1;
}
span {
font-family: "Poppins";
font-size: 14px;
font-weight: 400;
}
}
.configMsrMainDiv {
display: flex;
flex-direction: column;
column-gap: 1rem;
flex-wrap: wrap;
}
.configMsrSubDiv {
display: flex;
flex-direction: row;
gap: 1rem;
flex-wrap: wrap;
}
.configMsrSubDiv .ant-form-item .ant-form-item-explain-error {
position: relative;
left: 1rem;
top: 1rem;
}
.shape-crop {
display: flex;
flex-wrap: wrap;
flex-direction: column;
gap: 1rem;
}
.shape-crop-subdiv {
display: flex;
flex-wrap: wrap;
flex-direction: row;
gap: 2.5rem;
}
.shape-crop-div {
display: flex;
flex-wrap: wrap;
flex-direction: row;
gap: 1rem;
}
.shape-reset {
font-size: 25px;
color: var(--SELECTED_COLOR);
}
.shape-preview {
font-size: 25px;
color: var(--DEFAULT_SELECTED_COLOR);
}
.shape-delete {
font-size: 25px;
color: var(--ERROR_COLOR);
}
.crop-icon {
font-size: 20px;
// color: var(--DEFAULT_SELECTED_COLOR);
}
.crop-button {
display: flex;
flex-direction: row;
gap: 0.5rem;
width: 110px;
background-color: var(--DEFAULT_SELECTED_COLOR);
font-size: 14px;
color: white;
border-radius: 5px;
padding: 6px 2px 1px 10px;
font-weight: 400;
}
.viewerExcelupload {
.ant-table-wrapper .ant-table-pagination.ant-pagination {
position: sticky;
bottom: 0;
z-index: 10;
background: white;
padding-top: 10px;
}
}
.formSearch {
.ant-input-affix-wrapper {
height: 42px !important;
}
.searchDiv .ant-input {
height: unset !important;
}
}

23
src/Components/Forms/tertiaryButton.jsx Normal file
View File

@ -0,0 +1,23 @@
import { Button } from 'antd';
import './main.scss';
const TertiaryButton = ({
buttonText,
handleSubmit,
icon,
htmlType,
disabled,
}) => (
<Button
type="primary"
className="tertiary_Button"
onClick={handleSubmit}
htmlType={htmlType ? 'submit' : ''}
disabled={disabled ? disabled : false}
>
{buttonText}
{icon}
</Button>
);
export default TertiaryButton;

21
src/Components/Loader/Loader.jsx Normal file
View File

@ -0,0 +1,21 @@
import React from 'react';
import './Loader.scss';
const Loader = () => {
const text = 'POZO';
return (
<div className="modern-loader-wrapper">
<div className="modern-balls-loader">
{text.split('').map((char, i) => (
<span className="modern-ball" key={i} style={{ animationDelay: `${i * 0.18}s` }}>{char}</span>
))}
</div>
<div className="modern-progress-bar">
<div className="modern-progress-fill"></div>
</div>
</div>
);
};
export default Loader;

129
src/Components/Loader/Loader.scss Normal file
View File

@ -0,0 +1,129 @@
.custom-loader-wrapper {
display: flex;
align-items: center;
justify-content: center;
display: flex;
flex-direction: column;
gap: 6px;
position: absolute;
right: 0;
left: 0;
top: 40%;
}
.Processing {
color: #007aff;
font-size: 11px;
font-weight: 500;
font-family: "Poppins", sans-serif;
}
.modern-loader-wrapper {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 180px;
width: 100%;
gap: 1.2rem;
position: absolute;
top: 35%;
}
.modern-balls-loader {
display: flex;
gap: 0.6rem;
margin-bottom: 0.5rem;
font-family: "Poppins",sans-serif;
}
.modern-ball {
display: flex;
align-items: center;
justify-content: center;
width: 3.5rem;
height: 3.5rem;
border-radius: 20%;
font-size: 1.7rem;
font-weight: 700;
color: #f7f7f7;
background: linear-gradient(145deg, #007aff 60%, #00c6fb 100%);
box-shadow: 0 6px 18px 0 rgba(0, 122, 255, 0.18), 0 1px 0 #fff;
animation: modern-bounce 1.2s infinite cubic-bezier(0.4, 0.7, 0.6, 1);
animation-fill-mode: both;
text-shadow: 0 2px 8px rgba(0, 0, 0, 0.10);
}
.modern-ball:nth-child(1) {
background: linear-gradient(145deg, #007aff 60%, #007aff 100%);
}
.modern-ball:nth-child(2) {
background: linear-gradient(145deg, #00c6fb 60%, #00c6fb 100%);
}
.modern-ball:nth-child(3) {
background: linear-gradient(145deg, #007aff 60%, #007aff 100%);
}
.modern-ball:nth-child(4) {
background: linear-gradient(145deg, #00c6fb 60%, #00c6fb 100%);
}
@keyframes modern-bounce {
0%,
100% {
transform: translateY(0) scale(1);
box-shadow: 0 6px 18px 0 rgba(0, 122, 255, 0.18);
}
30% {
transform: translateY(-12px) scale(1);
box-shadow: 0 16px 32px 0 rgba(0, 122, 255, 0.10);
}
50% {
transform: translateY(0) scale(1);
}
}
.modern-progress-bar {
width: 250px;
height: 7px;
background: #e3f1ff;
border-radius: 6px;
overflow: hidden;
margin-top: 0.5rem;
box-shadow: 0 1px 4px 0 rgba(0, 122, 255, 0.08);
}
.modern-progress-fill {
height: 100%;
width: 0%;
background: linear-gradient(90deg, #007aff 0%, #00c6fb 100%);
border-radius: 6px;
animation: modern-progress-move 3s infinite linear;
}
@keyframes modern-progress-move {
0% {
width: 0%;
}
70% {
width: 100%;
}
100% {
width: 0%;
}
}
.custom-loader {
display: none;
}
.wave-loader-wrapper {
min-height: 120px;
}

46
src/Components/Loading/Loader.jsx Normal file
View File

@ -0,0 +1,46 @@
import * as React from 'react';
import './style.css';
import loadgif from '../../Images/spin3.gif';
const styles = {
text: {
marginTop: 52,
color: '#888',
marginLeft: 6,
},
spinner: {
backgroundColor: 'rgba(255, 255, 255, 0.5)',
width: '100%',
height: '100%',
top: 0,
left: 0,
zIndex: 99999999999999999,
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
},
};
export const Loader = ({
loading,
text = 'Loading..',
fullPage,
containerStyle,
textStyle,
}) => {
if (!loading) {
return null;
}
const mergedContainerStyle = {
...styles.spinner,
...containerStyle,
position: fullPage ? 'fixed' : 'absolute',
};
return (
<div style={mergedContainerStyle}>
<div>
<img src={loadgif} className="loadgif" />
</div>
</div>
);
};

26
src/Components/Loading/style.css Normal file
View File

@ -0,0 +1,26 @@
@keyframes react-overlay-loader-spinner {
to {
transform: rotate(360deg);
}
}
.react-overlay-loader-spinner:before {
content: '';
box-sizing: border-box;
position: absolute;
top: 50%;
left: 50%;
width: 40px;
height: 40px;
margin-top: -30px;
margin-left: -20px;
border-radius: 50%;
border: 3px solid #eee;
border-top-color: #07d;
animation: react-overlay-loader-spinner 0.8s linear infinite;
}
.loadgif {
width: 570px;
height: 320px;
}

89
src/Components/MapView/MapView.jsx Normal file
View File

@ -0,0 +1,89 @@
import React, { Component } from 'react';
import { Map, Marker, GoogleApiWrapper } from 'google-maps-react';
class MapView extends Component {
constructor(props) {
super(props);
this.state = {
fields: props.prevlca ? { location: props.prevlca } : { location: {} },
currentLocation: props.prevlca ? props.prevlca : false,
};
}
async componentDidMount() {
if (Object.keys(this.state.fields.location)?.length === 0) {
const { lat, lng } = await this.getcurrentLocation();
this.setState((prev) => ({
fields: {
...prev.fields,
location: {
lat,
lng,
},
},
currentLocation: {
lat,
lng,
},
}));
}
}
getcurrentLocation() {
if (navigator && navigator.geolocation) {
return new Promise((resolve, reject) => {
navigator.geolocation.getCurrentPosition((pos) => {
const coords = pos.coords;
resolve({
lat: coords.latitude,
lng: coords.longitude,
});
});
});
}
return {
lat: 0.0,
lng: 0,
};
}
addMarker = (location, map) => {
this.setState({
fields: { location: { lat: location.lat(), lng: location.lng() } },
});
map.panTo(location);
this.props.onMarkerClick(location);
};
render() {
const { lat = 0, lng = 0 } = this.state.fields.location;
// var bounds = new this.props.google.maps.LatLngBounds();
return (
<div>
<Map
google={this.props.google}
style={{
width: '100%',
height: '100%',
}}
initialCenter={{ lat: lat || 0, lng: lng || 0 }}
center={{ lat: lat || 0, lng: lng || 0 }}
zoom={14}
mapTypeId="roadmap"
onClick={(t, map, c) => {
this.addMarker(c.latLng, map);
}}
// bounds={bounds}
>
<Marker
tooltip={true}
name="Your Position"
position={this.state.fields.location}
onClick={this.props.onMarkerClick}
/>
</Map>
</div>
);
}
}
export default GoogleApiWrapper({
apiKey: 'AIzaSyB6w_WDy6psJ5HPX15Me1-o6CkS5jTYWnE',
})(MapView);

432
src/Components/Menu/PozoMenu.jsx Normal file
View File

@ -0,0 +1,432 @@
import React, { useState, useRef, useEffect } from 'react';
import { AppstoreOutlined, MailOutlined, SettingOutlined, } from '@ant-design/icons';
import { FaCaretRight } from "react-icons/fa";
import './PozoMenu.scss';
const PozoMenu = ({ items = [], mode = "vertical", style = {}, onClick, collapse = false, selectedKey: propSelectedKey, isBottomMenu = false }) => {
const [openKeys, setOpenKeys] = useState([]);
const [selectedKey, setSelectedKey] = useState('');
const [dropdownPositions, setDropdownPositions] = useState({});
console.log(dropdownPositions, "dropdownPositions")
const [isMobile, setIsMobile] = useState(window.innerWidth <= 768);
const menuRef = useRef();
// Update selected key when prop changes
useEffect(() => {
if (propSelectedKey !== undefined) {
setSelectedKey(propSelectedKey);
}
}, [propSelectedKey]);
// Close dropdown when clicking outside, window resize, or scroll
useEffect(() => {
const handleClickOutside = (event) => {
if (menuRef.current && !menuRef.current.contains(event.target)) {
setOpenKeys([]);
setDropdownPositions({});
}
};
const handleResize = () => {
// Update mobile detection
setIsMobile(window.innerWidth <= 768);
// Recalculate positions on window resize
if (openKeys.length > 0) {
setOpenKeys([]);
setDropdownPositions({});
}
};
const handleScroll = () => {
// 🎯 FIXED: Recalculate positions on scroll to maintain proper positioning
if (openKeys.length > 0) {
// Find all currently open menu elements and recalculate their positions
const newPositions = {};
openKeys.forEach(key => {
const element = document.querySelector(`[data-menu-key="${key}"]`);
if (element) {
const level = key.split('-').length - 1;
newPositions[key] = calculatePosition(element, level);
}
});
setDropdownPositions(prev => ({ ...prev, ...newPositions }));
}
};
document.addEventListener('mousedown', handleClickOutside);
window.addEventListener('resize', handleResize);
window.addEventListener('scroll', handleScroll, true); // Capture scroll events
return () => {
document.removeEventListener('mousedown', handleClickOutside);
window.removeEventListener('resize', handleResize);
window.removeEventListener('scroll', handleScroll, true);
};
}, [openKeys]);
// 🎯 FIXED: Smart positioning calculation - exactly like your image behavior
const calculatePosition = (element, level = 0) => {
const rect = element.getBoundingClientRect();
const viewportWidth = window.innerWidth;
const viewportHeight = window.innerHeight;
const scrollX = window.pageXOffset || document.documentElement.scrollLeft;
const scrollY = window.pageYOffset || document.documentElement.scrollTop;
// Dynamic dropdown dimensions - responsive
const dropdownWidth = isMobile
? Math.min(280, viewportWidth - 20)
: (level > 0 ? 220 : 250);
const dropdownHeight = Math.min(
isMobile ? viewportHeight * 0.5 : 400,
viewportHeight * 0.6
);
const gap = isMobile ? 2 : 4;
const edgePadding = isMobile ? 10 : 8;
// Calculate available space on both sides
const spaceRight = viewportWidth - rect.right;
const spaceLeft = rect.left;
const spaceNeeded = dropdownWidth + gap + edgePadding;
let position = {
top: rect.top + scrollY,
left: rect.right + gap + scrollX,
direction: 'right',
verticalDirection: 'down'
};
// 🎯 FIXED: HORIZONTAL POSITIONING - Exactly like your images
if (level === 0) {
console.log('🎯 Space Analysis:', {
spaceRight,
spaceLeft,
spaceNeeded,
elementPosition: { left: rect.left, right: rect.right }
});
if (spaceRight >= spaceNeeded) {
// Image 1: Enough space on right - open to RIGHT
position.left = rect.right + gap + scrollX;
position.direction = 'right';
console.log('✅ Opening RIGHT - space available');
} else if (spaceLeft >= spaceNeeded) {
// Image 2: No space on right, space on left - open to LEFT
position.left = rect.left - dropdownWidth - gap + scrollX;
position.direction = 'left';
console.log('✅ Opening LEFT - no space on right');
} else {
// Edge case: Limited space on both sides
if (spaceRight >= spaceLeft) {
position.left = viewportWidth - dropdownWidth - edgePadding + scrollX;
position.direction = 'right-edge';
} else {
position.left = edgePadding + scrollX;
position.direction = 'left-edge';
}
console.log('⚠️ Edge positioning applied');
}
} else {
// Nested menu positioning
const parentKeys = Object.keys(dropdownPositions);
const parentDirection = parentKeys.length > 0
? dropdownPositions[parentKeys[level - 1]]?.direction || 'right'
: 'right';
if (parentDirection.includes('right')) {
if (spaceRight >= spaceNeeded) {
position.left = rect.right + gap + scrollX;
position.direction = 'right';
} else {
position.left = rect.left - dropdownWidth - gap + scrollX;
position.direction = 'left';
}
} else {
if (spaceLeft >= spaceNeeded) {
position.left = rect.left - dropdownWidth - gap + scrollX;
position.direction = 'left';
} else {
position.left = rect.right + gap + scrollX;
position.direction = 'right';
}
}
}
// 🎯 FIXED: VERTICAL POSITIONING
const spaceBelow = viewportHeight - rect.bottom;
const spaceAbove = rect.top;
if (isBottomMenu && level === 0) {
if (spaceAbove >= dropdownHeight + edgePadding) {
position.top = rect.top - dropdownHeight - gap + scrollY;
position.verticalDirection = 'up';
} else {
position.top = rect.bottom + gap + scrollY;
position.verticalDirection = 'down';
}
} else {
if (spaceBelow >= dropdownHeight + edgePadding) {
position.top = rect.top + scrollY;
position.verticalDirection = 'down';
} else if (spaceAbove >= dropdownHeight + edgePadding) {
position.top = rect.bottom - dropdownHeight + scrollY;
position.verticalDirection = 'up';
} else {
position.top = Math.max(edgePadding, (viewportHeight - dropdownHeight) / 2) + scrollY;
position.verticalDirection = 'center';
}
}
// 🎯 FIXED: Final boundary checks
position.left = Math.max(
edgePadding + scrollX,
Math.min(position.left, viewportWidth - dropdownWidth - edgePadding + scrollX)
);
position.top = Math.max(
edgePadding + scrollY,
Math.min(position.top, viewportHeight - dropdownHeight - edgePadding + scrollY)
);
// Store dimensions for reference
position.width = dropdownWidth;
position.height = dropdownHeight;
console.log('🎯 FIXED Position:', {
clicked: { top: rect.top, left: rect.left, right: rect.right, bottom: rect.bottom },
spaces: { right: spaceRight, left: spaceLeft, above: spaceAbove, below: spaceBelow },
calculated: position,
direction: position.direction
});
return position;
};
// Handle menu item click
const handleMenuClick = (item, event, parentKeys = []) => {
event.stopPropagation();
if (item.children && item.children.length > 0) {
// Has children - toggle submenu
const itemKey = item.key;
const isOpen = openKeys.includes(itemKey);
if (isOpen) {
// Close this submenu and all its children
setOpenKeys(prev => prev.filter(key => {
// Keep only keys that are not this item or its descendants
return !key.startsWith(itemKey) && key !== itemKey;
}));
setDropdownPositions(prev => {
const newPos = { ...prev };
Object.keys(newPos).forEach(key => {
if (key.startsWith(itemKey) || key === itemKey) {
delete newPos[key];
}
});
return newPos;
});
} else {
// Close all submenus at the same level or deeper
const currentPath = [...parentKeys, itemKey];
const newOpenKeys = openKeys.filter(key => {
// Keep only parent keys in the current path
return currentPath.some(pathKey => key === pathKey) ||
currentPath.every((pathKey, index) => {
const keyParts = key.split('-');
const pathParts = pathKey.split('-');
return index < keyParts.length && keyParts[index] === pathParts[index];
});
});
// Add current item to open keys
newOpenKeys.push(itemKey);
// Calculate position and add to dropdown positions
const position = calculatePosition(event.currentTarget, parentKeys.length);
console.log('🎯 Setting position for', itemKey, ':', position);
setDropdownPositions(prev => {
// Remove positions for closed items
const newPos = {};
newOpenKeys.forEach(key => {
if (prev[key]) newPos[key] = prev[key];
});
newPos[itemKey] = position;
console.log('🎯 Updated dropdown positions:', newPos);
return newPos;
});
setOpenKeys(newOpenKeys);
}
} else {
// No children - select item and close all dropdowns
setSelectedKey(item.key);
setOpenKeys([]);
setDropdownPositions({});
// Trigger onClick callback if provided
if (onClick) {
onClick({
key: item.key,
keyPath: [...parentKeys, item.key],
item: item,
domEvent: event
});
}
console.log('Menu item clicked:', {
key: item.key,
keyPath: [...parentKeys, item.key],
label: item.label
});
}
};
// Check if item is selected
const isSelected = (key) => selectedKey === key;
// Check if item is open
const isOpen = (key) => openKeys.includes(key);
// Check if item is in active path (has selected child)
const isInActivePath = (item, parentKeys = []) => {
if (!item.children) return false;
const checkChildren = (children, currentPath) => {
return children.some(child => {
const childPath = [...currentPath, child.key];
if (child.key === selectedKey) return true;
if (child.children) {
return checkChildren(child.children, childPath);
}
return false;
});
};
return checkChildren(item.children, [...parentKeys, item.key]);
};
const menuRefs = useRef({});
const submenuRefs = useRef({});
const [positions, setPositions] = useState({});
const renderMenuItems = (items, parentKeys = [], level = 0) => {
return items.map((item) => {
if (!item) return null;
const hasChildren = item.children && item.children.length > 0;
const isItemSelected = isSelected(item.key);
const isItemOpen = isOpen(item.key);
const isItemInActivePath = isInActivePath(item, parentKeys);
const currentKeys = [...parentKeys, item.key];
return (
<div
key={item.key}
className="pozo-menu-item-wrapper"
ref={(el) => {
if (el) menuRefs.current[item.key] = el;
}}
>
<div
className={`pozo-menu-item ${isItemSelected ? 'selected' : ''} ${isItemOpen ? 'open' : ''} ${isItemInActivePath ? 'active-path' : ''} ${hasChildren ? 'has-children' : ''} ${item.type === 'group' ? 'group-item' : ''}`}
onClick={(e) => handleMenuClick(item, e, parentKeys)}
data-menu-key={item.key}
style={{ justifyContent: "flex-start" }}
>
{item.icon && (
<span className="pozo-menu-icon" style={{ fontSize: collapse ? "1.3rem" : "" }}>
{item.icon}
</span>
)}
{!collapse && <span className="pozo-menu-label">{item.label}</span>}
{hasChildren && !collapse && (
// <span className="pozo-menu-arrow"><FaCaretRight /></span>
<span className={`${isItemOpen ? "open " : ""}pozo-menu-arrow`}>
<FaCaretRight />
</span>
)}
</div>
{hasChildren && isItemOpen && !collapse && (
<div
ref={(el) => {
if (el) submenuRefs.current[item.key] = el;
}}
className={`pozo-dropdown-submenu ${level > 0 ? 'nested-submenu' : ''}`}
style={{
position: 'fixed',
top: (() => {
const defaultTop = positions[item.key]?.top || 0;
const submenuHeight =
submenuRefs.current[item.key]?.getBoundingClientRect()?.height || 0;
const screenHeight = window.innerHeight;
// ✅ If submenu would overflow screen bottom, adjust top
if (defaultTop + submenuHeight > screenHeight) {
return Math.max(
8, // padding from top
screenHeight - submenuHeight - 8
);
}
return defaultTop;
})(),
left: positions[item.key]?.left + 5 || 0,
// width: 220,
width: 200,
maxHeight: 400,
zIndex: 1000 + level
}}
>
<div className="pozo-submenu-content">
{renderMenuItems(item.children, currentKeys, level + 1)}
</div>
</div>
)}
</div>
);
});
};
// ✅ Compute positions after render
useEffect(() => {
const updated = {};
for (const [key, el] of Object.entries(menuRefs.current)) {
if (el && typeof el.getBoundingClientRect === "function") {
const rect = el.getBoundingClientRect();
updated[key] = {
top: rect.top + window.scrollY,
left: rect.right + window.scrollX
};
}
}
Object.entries(submenuRefs.current).forEach(([key, el]) => {
if (el) {
const height = el.getBoundingClientRect().height;
console.log(`Total submenu height for ${key}:`, height);
}
});
setPositions(updated);
}, [items, openKeys]);
console.log(submenuRefs, "menuRef")
return (
<div
className={`pozo-menu pozo-menu-${mode}`}
style={style}
>
<div className="pozo-menu-content" ref={menuRef}>
{renderMenuItems(items)}
</div>
</div>
);
};
export default PozoMenu;

450
src/Components/Menu/PozoMenu.scss Normal file
View File

@ -0,0 +1,450 @@
// PozoMenu Component Styles - Integrated with SideMenuPozo
.pozo-menu {
font-family: "Poppins", sans-serif !important;
background: transparent;
border-radius: 0;
box-shadow: none;
overflow: hidden;
user-select: none;
@media (max-width: 500px) {
overflow: scroll;
}
&.pozo-menu-vertical {
width: 100% !important;
min-height: auto;
}
&.pozo-menu-horizontal {
width: 100%;
display: flex;
flex-direction: row;
}
}
.pozo-menu-content {
padding: 0;
display: flex;
flex-direction: column;
gap: 0.1rem;
}
.pozo-menu-item-wrapper {
position: relative;
}
.pozo-menu-item {
display: flex;
align-items: center;
justify-content: center;
padding: 8px 8px;
cursor: pointer;
transition:
background 0.2s,
color 0.2s;
border-radius: 8px;
margin: 1px 3px;
font-size: 13px;
font-weight: 500;
color: #ffffff;
position: relative;
min-height: 38px;
font-family: "Poppins", sans-serif !important;
&:hover:not(.selected):not(.active-path) {
background: #394588;
}
&.selected {
background: #050d36 !important;
color: #ffffff !important;
border-right: 3px solid #ffffff;
font-weight: 600;
border-radius: 6px;
border: none !important;
.pozo-menu-icon {
color: #23bbff !important;
}
.pozo-menu-label {
color: #ffffff !important;
}
.pozo-menu-arrow {
color: #ffffff !important;
}
}
&.open {
background: #050d36 !important;
color: #23bbff;
border-right: 2px solid #23bbff;
font-weight: 600;
width: 95%;
}
&.active-path {
background: #050d36 !important;
color: #ffffff !important;
font-weight: 600;
border-radius: 6px;
.pozo-menu-icon {
color: #23bbff !important;
}
.pozo-menu-label {
color: #ffffff !important;
}
.pozo-menu-arrow {
color: #ffffff !important;
}
}
&.has-children {
&:after {
content: "";
position: absolute;
right: 16px;
top: 50%;
transform: translateY(-50%);
width: 0;
height: 0;
}
}
&.group-item {
font-weight: 600;
color: #666;
font-size: 12px;
text-transform: uppercase;
letter-spacing: 0.5px;
padding: 8px 16px;
background: #fafafa;
margin: 4px 8px;
&:hover {
background: #fafafa;
color: #666;
cursor: default;
}
}
}
.pozo-menu-icon {
margin-right: 0.3rem;
font-size: 1.3rem;
min-width: 24px;
display: flex;
justify-content: center;
align-items: center;
@media (max-width: 500px) {
font-size: 1rem !important;
margin-right: 0;
}
}
.pozo-menu-label {
flex: 1;
color: #ffffff;
font-size: 12px;
font-weight: 500;
word-break: break-word;
line-height: 1.2;
font-family: "Poppins", sans-serif !important;
}
.pozo-menu-arrow {
margin-left: auto;
font-size: 12px;
display: flex;
align-items: center;
transition: transform 0.2s ease;
color: #999;
}
@media (max-width: 768px) {
.open.pozo-menu-arrow {
transform: rotate(90deg);
}
}
// Dropdown Submenu Styles - SideMenuPozo Style
.pozo-dropdown-submenu {
position: fixed !important;
background: #23378a;
border-radius: 12px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
border: none;
min-width: 200px;
max-width: 300px;
max-height: 54vh;
overflow-y: auto;
animation: dropdownFadeIn 0.2s ease;
scrollbar-width: thin;
z-index: 1050 !important;
// Ensure no transform interference
transform: none !important;
margin: 0 !important;
&.nested-submenu {
background: #23378a;
border-radius: 10px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
padding: 0.2rem 0 0.5rem 0;
width: 200px;
z-index: 10001 !important;
margin-left: -3px !important;
@media (max-width: 768px) {
background-color: #040716;
}
}
&::-webkit-scrollbar {
width: 6px;
}
&::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 3px;
}
&::-webkit-scrollbar-thumb {
background: #c1c1c1;
border-radius: 3px;
}
&::-webkit-scrollbar-thumb:hover {
background: #a8a8a8;
}
}
.pozo-submenu-content {
padding: 0.2rem 0 0.5rem 0;
.pozo-menu-item {
margin: 1px 8px;
padding: 0.5rem 0.7rem;
font-size: 1rem;
font-weight: 500;
border-radius: 6px;
background: transparent;
transition:
background 0.18s,
color 0.18s;
&:hover:not(.selected):not(.active-path) {
background: #394588;
color: #182147;
font-weight: 600;
}
&.selected {
background: #050d36 !important;
color: #ffffff !important;
font-weight: 600;
border-radius: 6px;
border-left: 3px solid #ffffff;
.pozo-menu-icon {
color: #ffffff !important;
}
.pozo-menu-label {
color: #ffffff !important;
}
.pozo-menu-arrow {
color: #ffffff !important;
}
}
&.active-path {
background: #050d36 !important;
color: #ffffff !important;
font-weight: 600;
border-radius: 6px;
.pozo-menu-icon {
color: #23bbff !important;
}
.pozo-menu-label {
color: #ffffff !important;
}
.pozo-menu-arrow {
color: #ffffff !important;
}
}
&.group-item {
background: transparent;
border-bottom: none;
margin: 0;
border-radius: 6px;
&:hover {
background: transparent;
color: #fff;
}
}
}
}
// Inline Submenu Styles
.pozo-inline-submenu {
background: #fafafa;
border-left: 2px solid #e8e8e8;
margin-left: 20px;
border-radius: 0 6px 6px 0;
.pozo-menu-item {
margin: 1px 4px;
padding: 8px 12px;
font-size: 13px;
background: transparent;
&:hover {
background: #f0f8ff;
}
&.selected {
background: #e6f7ff;
border-left: 2px solid #1890ff;
}
}
}
// Animation
@keyframes dropdownFadeIn {
from {
opacity: 0;
transform: translateY(-10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
// Bottom menu positioning
.bottom-menu {
.pozo-dropdown-submenu {
// Remove transform for bottom menu - use calculated position
transform: none !important;
margin-top: 0 !important;
}
}
// Responsive Design
@media (max-width: 900px) {
.pozo-dropdown-submenu {
// left: 70px !important;
// min-width: 180px;
// max-width: calc(100vw - 80px);
}
.pozo-dropdown-submenu.nested-submenu {
// left: 70px !important;
}
.bottom-menu .pozo-dropdown-submenu {
left: 70px !important;
}
}
@media (max-width: 768px) {
.pozo-menu {
&.pozo-menu-vertical {
width: 100%;
}
}
.pozo-dropdown-submenu {
// min-width: 160px;
// max-width: calc(50vw - 20px);
// left: 30% !important;
// right: 10px !important;
position: unset !important;
width: 100% !important;
min-width: unset !important;
max-width: unset !important;
background-color: #050d36c4;
// border-top: 1px solid #23bbff;
margin-top: 2px !important;
}
.pozo-menu-item {
padding: 10px 12px;
font-size: 15px;
margin: 1px 3px !important;
}
}
@media (max-width: 500px) {
.pozo-menu-item {
// padding: 8px 8px;
padding: 6px 4px 6px 6px;
font-size: 15px;
}
.pozo-menu-label {
font-size: 11px !important;
margin-top: 2px;
}
}
// Dark Theme Support
.pozo-menu.dark-theme {
background: #001529;
color: #fff;
.pozo-menu-item {
color: rgba(255, 255, 255, 0.85);
&:hover {
background: #1890ff;
color: #fff;
}
&.selected {
background: #1890ff;
color: #fff;
border-left-color: #fff;
}
&.group-item {
background: #002140;
color: rgba(255, 255, 255, 0.65);
}
}
.pozo-dropdown-submenu {
background: #001529;
border-color: #303030;
}
.pozo-inline-submenu {
background: #002140;
border-left-color: #303030;
}
}
// High Contrast Mode
@media (prefers-contrast: high) {
.pozo-menu-item {
border: 1px solid transparent;
&:hover {
border-color: #1890ff;
}
&.selected {
border-color: #1890ff;
border-width: 2px;
}
}
}

275
src/Components/Menu/SideMenu.jsx Normal file
View File

@ -0,0 +1,275 @@
import { useContext, useEffect, useState } from 'react';
import { useNavigate } from 'react-router-dom';
import { useDispatch } from 'react-redux';
import { Menu } from 'antd';
import {
changePreviewComponents,
changeSelectedPrintdummyData,
getTemplate,
} from '../../Features/ThemeChange/ThemeChange';
import {
changeBookingType,
changeOrderCardDetails,
changeReorderHoldDetails,
changeProductCategorie,
changeCustomerID,
changeSelectedCustId,
changeSelectedOption,
ChangeOverAllDiscSales,
ChangeOverAllDiscEstimate,
changeSummeryTotalAmount,
changeSearchedData,
changeBtoBQuickProductTransfer,
changeTipAmount,
changeCommonPaymentOptions,
GlobalDineinDefault,
} from '../../Features/BookingScreen/BookingData/BookingData';
import {
changeWholeSaleAuctionSelectedData,
changeWholeSaleGradeListData,
} from '../../Features/WholeSale/WholesaleData';
import { GiHamburgerMenu } from 'react-icons/gi';
import './sideMenu.scss';
import { getSession } from '../../Services/Others';
import { ChangeTotalAmount } from '../../Features/ExteraCharges/ExtraCharges';
import * as Offer from '../../Features/Offer/Offer';
import { AuthContext } from '../../AuthContext';
import { useSelector } from 'react-redux';
const subDirectory = import.meta.env.BASE_URL;
export const getItem = (label, key, icon, children, ariaExpanded = false) => {
return {
key,
icon,
children,
label,
};
};
export const getsubItem = (
label,
key,
icon,
children,
ariaExpanded = false
) => {
return {
key,
icon,
children,
label,
};
};
const SideMenu = ({ mode, theme, items }) => {
const { freeProductsCount, setFreeProductsCount } = useContext(AuthContext);
const [collapsed, setCollapsed] = useState(true);
const [width, setWidth] = useState(window.innerWidth);
const [openKeys, setOpenKeys] = useState([]);
const [clickedKeys, setClickedKeys] = useState([]);
const dispatch = useDispatch();
const navigate = useNavigate();
const CompId = getSession('CompId');
const BranchId = getSession('BranchId');
const AppId = getSession('AppId');
const DineinDefault = useSelector(GlobalDineinDefault);
const handleMouseEnter = (e) => {
const key = e.key;
if (!openKeys.includes(key)) {
setOpenKeys((prev) => [...prev, key]);
}
};
const handleMouseLeave = (e) => {
const key = e.key;
// Only remove the key if it wasn't clicked
if (!clickedKeys.includes(key)) {
setOpenKeys((prev) => prev.filter((k) => k !== key));
}
};
const handleSubMenuClick = ({ key }) => {
// Toggle clicked state
setClickedKeys((prev) => {
if (prev.includes(key)) {
// If already clicked, remove it and close the menu
setOpenKeys((openKeys) => openKeys.filter((k) => k !== key));
return prev.filter((k) => k !== key);
}
// If not clicked, add it and keep menu open
return [...prev, key];
});
};
const handleMenuItemClick = (e) => {
if(DineinDefault&& e.key == `${subDirectory}sales` ){
navigatefun(`${subDirectory}sales/dine-in`);
// setOpenKeys([]);
}else{
navigatefun(e.key);
}
};
const handleClickOutside = (e) => {
if (!e.target.closest('.ant-menu')) {
setOpenKeys([]);
setClickedKeys([]);
}
};
useEffect(() => {
document.addEventListener('click', handleClickOutside);
return () => {
document.removeEventListener('click', handleClickOutside);
};
}, []);
const navigatefun = async (e) => {
try {
dispatch(changePreviewComponents({}));
dispatch(changeSelectedPrintdummyData(false));
dispatch(changeWholeSaleGradeListData([]));
dispatch(changeWholeSaleAuctionSelectedData([]));
dispatch(changeCommonPaymentOptions([]));
dispatch(
changeBtoBQuickProductTransfer({
action: false,
selectedProducts: [],
})
);
if (e == `${subDirectory}sales/dine-in`) {
dispatch(changeTipAmount(0));
dispatch(changeBookingType('Dine In'));
dispatch(changeOrderCardDetails([]));
dispatch(changeReorderHoldDetails({}));
dispatch(changeProductCategorie(null));
dispatch(changeCustomerID(null));
dispatch(changeSelectedCustId(null));
dispatch(changeSelectedOption(null));
dispatch(ChangeOverAllDiscSales(0));
dispatch(ChangeOverAllDiscEstimate(0));
dispatch(Offer.changeSalesWiseOfferAmount(0));
dispatch(Offer.changeOverallOfferAmount(0));
dispatch(changeSummeryTotalAmount(0));
dispatch(Offer.changeOrderOfferDetail([]));
// await dispatch(Offer.changeFreeProductCount(0));
setFreeProductsCount(0);
dispatch(Offer.changeloyaltyPointsDiscountAmount(0));
dispatch(ChangeTotalAmount([]));
}
if (e == `${subDirectory}sales`) {
// await dispatch(getTemplate({ CompId, BranchId, AppId })).unwrap();
dispatch(changeTipAmount(0));
dispatch(changeSearchedData(''));
dispatch(changeBookingType('TakeAway'));
dispatch(changeOrderCardDetails([]));
dispatch(changeReorderHoldDetails({}));
dispatch(changeProductCategorie(null));
dispatch(changeCustomerID(null));
dispatch(changeSelectedCustId(null));
dispatch(changeSelectedOption(null));
dispatch(ChangeOverAllDiscSales(0));
dispatch(ChangeOverAllDiscEstimate(0));
dispatch(Offer.changeSalesWiseOfferAmount(0));
dispatch(Offer.changeOverallOfferAmount(0));
dispatch(changeSummeryTotalAmount(0));
dispatch(Offer.changeOrderOfferDetail([]));
// dispatch(Offer.changeFreeProductCount(0));
setFreeProductsCount(0);
dispatch(Offer.changeloyaltyPointsDiscountAmount(0));
dispatch(Offer.changeCoupenCodeAmount(0));
dispatch(ChangeTotalAmount([]));
}
if (e == `${subDirectory}saleslayouts/print-selection`) {
dispatch(changeSelectedPrintdummyData(true));
}
// if(e==`${subDirectory}kiosksales`){
// const elem = document.documentElement;
// if (elem.requestFullscreen) {
// elem.requestFullscreen();
// } else if (elem.mozRequestFullScreen) { // Firefox
// elem.mozRequestFullScreen();
// } else if (elem.webkitRequestFullscreen) { // Chrome, Safari and Opera
// elem.webkitRequestFullscreen();
// } else if (elem.msRequestFullscreen) { // IE/Edge
// elem.msRequestFullscreen();
// }
// }else{
// if (document.exitFullscreen) {
// document.exitFullscreen();
// } else if (document.mozCancelFullScreen) { // Firefox
// document.mozCancelFullScreen();
// } else if (document.webkitExitFullscreen) { // Chrome, Safari and Opera
// document.webkitExitFullscreen();
// } else if (document.msExitFullscreen) { // IE/Edge
// document.msExitFullscreen();
// }
// }
navigate(e);
} catch (error) {
console.error('Navigation failed:', error);
}
};
const toggleCollapsed = () => {
setCollapsed(!collapsed);
};
useEffect(() => {
function handleResize() {
setWidth(window.innerWidth);
}
window.addEventListener('resize', handleResize);
return () => window.removeEventListener('resize', handleResize);
}, [width]);
useEffect(() => {
width < 768 && setCollapsed(true);
width > 768 && setCollapsed(false);
}, [width < 768]);
return (
<>
<div style={{ display: 'flex', justifyContent: 'center' }}>
<button
onClick={toggleCollapsed}
style={{
position: 'fixed',
top: '5px',
border: 'none',
}}
>
{collapsed ? (
<GiHamburgerMenu />
) : (
<GiHamburgerMenu style={{ fontSize: '20px' }} />
)}
</button>
</div>
<div style={{ display: 'flex', justifyContent: 'center' }}>
{/* <img className="sidebarlogo" src={Logo} style={{width:"2rem",}} alt="" /> */}
<p className="sidebarlogo">POZO</p>
</div>
<Menu
className={collapsed ? 'sideMenuantd2' : 'sideMenuantd'}
defaultSelectedKeys={['1']}
openKeys={openKeys}
onOpenChange={setOpenKeys}
onClick={handleMenuItemClick}
onTitleClick={handleSubMenuClick}
inlineCollapsed={collapsed}
mode={mode}
theme={theme}
items={items}
onMouseEnter={(e) => handleMouseEnter(e)}
onMouseLeave={(e) => handleMouseLeave(e)}
triggerSubMenuAction="click"
/>
</>
);
};
export default SideMenu;

444
src/Components/Menu/SideMenuPozo.jsx Normal file
View File

@ -0,0 +1,444 @@
import React, { useState, useEffect, useRef } from 'react';
import { useNavigate, useLocation } from 'react-router-dom';
import { useSelector } from 'react-redux';
import {
FaBars, FaThLarge, FaHome, FaCog, FaChartBar, FaFileAlt,
FaMobileAlt, FaSignOutAlt, FaSignInAlt, FaArrowRight,
FaCaretRight
} from 'react-icons/fa';
import { MdSettings, MdOutlineReport, MdOutlineHome, MdOutlineKeyboardArrowDown, MdOutlineKeyboardArrowRight, } from 'react-icons/md';
import { BiLogOut, BiLogIn } from 'react-icons/bi';
import { AiOutlineAppstore, AiOutlineSetting, AiOutlineBarChart, AiOutlineFileText } from 'react-icons/ai';
import { GiHamburgerMenu } from 'react-icons/gi';
import './SideMenuPozo.scss';
import { FaCaretDown } from "react-icons/fa";
import { useDispatch } from 'react-redux';
import { useContext } from 'react';
import { AuthContext } from '../../AuthContext';
import PozoMenu from './PozoMenu';
import { getSession } from '../../Services/Others';
import {
changePreviewComponents,
changeSelectedPrintdummyData,
getTemplate,
} from '../../Features/ThemeChange/ThemeChange';
import {
changeBookingType,
changeOrderCardDetails,
changeReorderHoldDetails,
changeProductCategorie,
changeCustomerID,
changeSelectedCustId,
changeSelectedOption,
ChangeOverAllDiscSales,
ChangeOverAllDiscEstimate,
changeSummeryTotalAmount,
changeSearchedData,
changeBtoBQuickProductTransfer,
changeTipAmount,
GlobalDineinDefault,
} from '../../Features/BookingScreen/BookingData/BookingData';
import {
changeWholeSaleAuctionSelectedData,
changeWholeSaleGradeListData,
} from '../../Features/WholeSale/WholesaleData';
import { ChangeTotalAmount } from '../../Features/ExteraCharges/ExtraCharges';
import * as Offer from '../../Features/Offer/Offer';
import { FiMenu } from 'react-icons/fi';
import POZOMIND from "../../Images/PozomindWLogo.png";
import { ChangeFullFreeProductList, changeFullOfferAppliedProducts, changeLoyaltyConsumedQuantities } from '../../Features/Offer/Offernew/BookingOffernew';
const subDirectory = import.meta.env.BASE_URL;
// Filter functions (copied from AppPage.jsx)
function filterMenuItems(menu, configList) {
if (!Array.isArray(menu)) return [];
return menu.filter((item) => {
if (!item) return false;
if (item.label === "Sign Out") return true;
// For nested children, filter recursively
let filteredChildren = item.children ? filterMenuItems(item.children, configList) : undefined;
// Employee access: ConfigName
const config = configList?.find(
(config) => config.ConfigName === item.label && config.ReadAccess === 'Y'
);
// If this item or any of its children are accessible, include it
return (config || (filteredChildren && filteredChildren.length > 0));
}).map(item => ({
...item,
children: item.children ? filterMenuItems(item.children, configList) : undefined
}));
}
function filterSadminUserMenuItems(menu, configList) {
if (!Array.isArray(menu)) return [];
return menu.filter((item) => {
if (!item) return false;
if (item.label === "Sign Out") return true;
let filteredChildren = item.children ? filterSadminUserMenuItems(item.children, configList) : undefined;
// Super admin user access: MenuName
const config = configList?.find(
(config) => config.MenuName === item.label && config.ReadAccess === 'Y'
);
return (config || (filteredChildren && filteredChildren.length > 0));
}).map(item => ({
...item,
children: item.children ? filterSadminUserMenuItems(item.children, configList) : undefined
}));
}
// Capitalize helper
function capitalizeWords(str) {
if (typeof str !== 'string') return '';
return str.replace(/\w\S*/g, (txt) => txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase());
}
// Recursively capitalize all menu item labels, filtering out falsy items and items without a label
function capitalizeMenuLabels(items) {
return (items || [])
.filter(item => item && typeof item.label === 'string' && item.label.trim() !== '')
.map(item => ({
...item,
label: capitalizeWords(item.label),
children: item.children ? capitalizeMenuLabels(item.children) : undefined
}));
}
const SideMenuPozo = ({ items = [] }) => {
const { freeProductsCount, setFreeProductsCount, UserType, Access, SadminuserAccess } = useContext(AuthContext);
const dispatch = useDispatch();
const navigate = useNavigate();
const location = useLocation();
const [openKeys, setOpenKeys] = useState([]);
const [collapsed, setCollapsed] = useState(window.innerWidth < 768);
const [dropdownPosition, setDropdownPosition] = useState({});
const menuRef = useRef();
const CompId = getSession('CompId');
const BranchId = getSession('BranchId');
const AppId = getSession('AppId');
const DineinDefault = useSelector(GlobalDineinDefault);
const [collapse, setCollapse] = useState(false);
useEffect(() => {
const handleResize = () => {
setCollapse(window.innerWidth < 768);
};
window.addEventListener('resize', handleResize);
return () => window.removeEventListener('resize', handleResize);
}, []);
useEffect(() => {
const handleResize = () => {
setCollapsed(window.innerWidth < 768);
};
window.addEventListener('resize', handleResize);
return () => window.removeEventListener('resize', handleResize);
}, []);
useEffect(() => {
const handleClickOutside = (e) => {
if (menuRef.current && !menuRef.current.contains(e.target)) {
setOpenKeys([]);
setDropdownPosition({});
}
};
document.addEventListener('mousedown', handleClickOutside);
return () => document.removeEventListener('mousedown', handleClickOutside);
}, []);
useEffect(() => {
const handleClickOutside = (event) => {
if (window.innerWidth < 768) {
if (menuRef.current && !menuRef.current.contains(event.target)) {
setCollapse(true);
}
}
};
document.addEventListener("mousedown", handleClickOutside);
return () => document.removeEventListener("mousedown", handleClickOutside);
}, []);
// Debug current pathname
useEffect(() => {
console.log('Current pathname:', location.pathname);
}, [location.pathname]);
const isSelected = (key) => location.pathname === key;
const isOpen = (key) => openKeys.includes(key);
// Check if any child of this item is selected (for parent menu highlighting)
const hasSelectedChild = (item) => {
if (!item.children) return false;
return item.children.some(child => {
if (child.children) {
return hasSelectedChild(child);
}
return location.pathname === child.key;
});
};
// Check if a dropdown item is currently selected
const isDropdownItemSelected = (item) => {
return location.pathname === item.key;
};
const navigatefun = async (e) => {
dispatch(changePreviewComponents({}));
dispatch(changeSelectedPrintdummyData(false));
dispatch(changeWholeSaleGradeListData([]));
dispatch(changeWholeSaleAuctionSelectedData([]));
dispatch(
changeBtoBQuickProductTransfer({
action: false,
selectedProducts: [],
})
);
if (e == `${subDirectory}sales/dine-in`) {
dispatch(changeTipAmount(0));
dispatch(changeBookingType('Dine In'));
dispatch(changeOrderCardDetails([]));
dispatch(changeReorderHoldDetails({}));
dispatch(changeProductCategorie(null));
dispatch(changeCustomerID(null));
dispatch(changeSelectedCustId(null));
dispatch(changeSelectedOption(null));
dispatch(ChangeOverAllDiscSales(0));
dispatch(ChangeOverAllDiscEstimate(0));
dispatch(Offer.changeSalesWiseOfferAmount(0));
dispatch(Offer.changeOverallOfferAmount(0));
dispatch(changeSummeryTotalAmount(0));
dispatch(Offer.changeOrderOfferDetail([]));
setFreeProductsCount(0);
dispatch(Offer.changeloyaltyPointsDiscountAmount(0));
dispatch(ChangeTotalAmount([]));
dispatch(ChangeFullFreeProductList([]));
dispatch(changeFullOfferAppliedProducts([]));
dispatch(changeLoyaltyConsumedQuantities({}))
}
if (e == `${subDirectory}sales`) {
dispatch(changeTipAmount(0));
dispatch(changeSearchedData(''));
dispatch(changeBookingType('TakeAway'));
dispatch(changeOrderCardDetails([]));
dispatch(changeReorderHoldDetails({}));
dispatch(changeProductCategorie(null));
dispatch(changeCustomerID(null));
dispatch(changeSelectedCustId(null));
dispatch(changeSelectedOption(null));
dispatch(ChangeOverAllDiscSales(0));
dispatch(ChangeOverAllDiscEstimate(0));
dispatch(Offer.changeSalesWiseOfferAmount(0));
dispatch(Offer.changeOverallOfferAmount(0));
dispatch(changeSummeryTotalAmount(0));
dispatch(Offer.changeOrderOfferDetail([]));
setFreeProductsCount(0);
dispatch(Offer.changeloyaltyPointsDiscountAmount(0));
dispatch(Offer.changeCoupenCodeAmount(0));
dispatch(ChangeFullFreeProductList([]));
dispatch(changeFullOfferAppliedProducts([]));
dispatch(ChangeTotalAmount([]));
dispatch(changeLoyaltyConsumedQuantities({}))
}
if (e == `${subDirectory}saleslayouts/print-selection`) {
dispatch(changeSelectedPrintdummyData(true));
}
navigate(e);
};
const handleMenuClick = (item, parentKeys = [], event, level = 0) => {
if (item.children) {
if (openKeys.includes(item.key)) {
setOpenKeys(openKeys.filter(k => k !== item.key));
const newPositions = { ...dropdownPosition };
delete newPositions[item.key];
setDropdownPosition(newPositions);
} else {
// For top level (level 0), close all other open menus
// For nested levels, keep parent chain but close siblings
let newOpenKeys;
if (level === 0) {
// Close all other top-level menus
newOpenKeys = [];
} else {
// Keep only the parent chain, remove siblings
newOpenKeys = openKeys.filter(key => {
// Keep if it's in the parent chain
return parentKeys.includes(key);
});
}
// Calculate position for dropdown
const rect = event.currentTarget.getBoundingClientRect();
let position;
if (level === 0) {
position = {
top: rect.top,
left: collapsed ? rect.right + 1 : 10
};
} else {
position = {
top: rect.top,
left: rect.right + 1
};
}
setDropdownPosition(prev => ({ ...prev, [item.key]: position }));
setOpenKeys([...newOpenKeys, item.key]);
}
} else {
if (DineinDefault && item.key == `${subDirectory}sales`) {
navigatefun(`${subDirectory}sales/dine-in`);
setOpenKeys([]);
}
else {
navigatefun(item.key);
setOpenKeys([]);
}
}
};
console.log(items, Access, "Employee items")
// Filter menu items based on access
let filteredMenuItems = (items || []).filter(Boolean);
if (UserType === 'Employee' && Array.isArray(Access) && Access.length > 0) {
filteredMenuItems = filterMenuItems(filteredMenuItems, Access);
} else if (UserType === 'Super Admin User' && Array.isArray(SadminuserAccess) && SadminuserAccess.length > 0) {
filteredMenuItems = filterSadminUserMenuItems(filteredMenuItems, SadminuserAccess);
}
// Capitalize all labels, filter out items without a label
const menuItemsWithCapitalizedLabels = capitalizeMenuLabels(filteredMenuItems);
const bottomKeys = ['Support', 'Settings', 'Download', 'Sign Out'];
const bottomMenuItems = menuItemsWithCapitalizedLabels.filter(item =>
bottomKeys.includes(item.label)
);
const mainMenuItems = menuItemsWithCapitalizedLabels.filter(item =>
!bottomKeys.includes(item.label)
);
// Recursive render for menu and submenus
const renderMenuItems = (items, parentKeys = [], level = 0) => (
<div className={`side-menu-list${level > 0 ? ' nested-list' : ''}`}>
{(items || []).filter(Boolean).map((item) => (
<div key={item.key}>
<div
className={`${level > 0 ? 'dropdown-submenu-item' : 'menu-item'}${isSelected(item.key) || (level === 0 && hasSelectedChild(item)) ? ' selecteded' : ''}${isOpen(item.key) ? ' open' : ''}${item.children ? ' has-children' : ''}`}
onClick={(e) => { e.stopPropagation(); handleMenuClick(item, parentKeys, e, level); }}
// style={{ paddingLeft: `${level * 10 + 1}px` }}
>
{item.icon && level === 0 && <span className='menu-icon' style={{
fontSize: collapse ? "1.5rem" : ""
}}>{item.icon}</span>}
{!collapse && <span className='menu-label'>{item.label}</span>}
{!collapse && <span className='menu-labelDot'>{isDropdownItemSelected(item) ? '●' : ''}</span>}
{item.children && !collapse && (
<span className='menu-arrow'>
{level === 0 ? <FaCaretRight size={14} /> : <MdOutlineKeyboardArrowRight />}
</span>
)}
</div>
{item.children && isOpen(item.key) && !collapse && (
<div
className={`dropdown-submenu${level > 0 ? ' nested' : ''}`}
>
{renderMenuItems(item.children, [...parentKeys, item.key], level + 1)}
</div>
)}
</div>
))}
</div>
);
// Custom onClick handler for PozoMenu
const handlePozoMenuClick = (e) => {
console.log('PozoMenu clicked:', e);
navigatefun(e.key);
};
// Get current selected key based on location
const getCurrentSelectedKey = () => {
return location.pathname;
};
const isMobile = /Mobi|Android|iPhone|iPad|iPod/i.test(navigator.userAgent);
const isAndroid = /Android/i.test(navigator.userAgent);
return (
<div className={`SideMenuPozo-Master${collapse ? ' collapsed' : ''}`} ref={menuRef}
style={{ height: isMobile ? "88%" : "" }}
>
<div style={{
width: "100%", display: "flex", flexDirection: "column", gap: "10px",
height: "68vh", overflow: "auto"
}}>
<div className="paypreLogoDiv">
<div className="shopNameNav" style={{ width: "100%" }}>
<div style={{
display: "flex", flexDirection: "row",
alignItems: "center", gap: "4px", padding: "0px 10px", justifyContent: "space-between"
}}>
<FiMenu
size={26}
onClick={() => setCollapse((prev) => !prev)}
style={{ cursor: 'pointer' }}
/>
{collapse ? "" :
// <img src={POZOMIND} alt="PozoMindLogo" width="80px" height={"45px"} className='PozoMindLogo' />
<div>
PozoApp
</div>
}
</div>
{/* <div> */}
{/* <div>{branchName}</div> */}
<p>{/* {'Palacode'} , {'Tamilnadu'} , {'India'} */}</p>
{/* </div> */}
</div>
</div>
{/* Top Menu using PozoMenu */}
<div className='top-menu'>
<PozoMenu
items={mainMenuItems}
mode="vertical"
collapse={collapse}
selectedKey={getCurrentSelectedKey()}
style={{
width: collapse ? '60px' : '200px',
background: 'transparent',
boxShadow: 'none'
}}
onClick={handlePozoMenuClick}
/>
</div>
</div>
{/* Bottom Menu using PozoMenu */}
<div className='bottom-menu' style={{
height: isMobile ? "30vh" : ""
}}>
<PozoMenu
items={bottomMenuItems}
mode="vertical"
collapse={collapse}
selectedKey={getCurrentSelectedKey()}
isBottomMenu={true}
style={{
width: collapse ? '60px' : '200px',
background: 'transparent',
boxShadow: 'none'
}}
onClick={handlePozoMenuClick}
/>
</div>
</div>
);
};
export default SideMenuPozo;

408
src/Components/Menu/SideMenuPozo.scss Normal file
View File

@ -0,0 +1,408 @@
.SideMenuPozo-Master {
// width: 12vw;
// width: 200px;
width: 160px;
height: 100vh;
overflow: hidden;
background-color: #23378a;
padding: 0rem 3px 0 0px;
transition: width 0.2s;
font-family: 'Poppins', sans-serif !important;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: space-between;
@media (max-width: 500px) {
width: 150px;
overflow: auto;
// padding-bottom: 3rem;
// position: fixed;
left: 0;
top: 0;
height: 100vh !important;
z-index: 10000;
}
@media (max-width: 768px) {
overflow: auto;
}
}
.SideMenuPozo-Master.collapsed {
width: 45px;
min-width: 45px;
position: unset;
@media (max-width: 500px) {
width: 9vw;
}
}
.side-menu-header {
display: flex;
align-items: center;
gap: 0.5rem;
margin-bottom: 1.5rem;
}
.hamburger-btn {
background: none;
border: none;
color: #fff;
font-size: 1.5rem;
cursor: pointer;
margin-right: 0.5rem;
}
.side-menu-logo {
color: #fff;
font-weight: 700;
font-size: 1.2rem;
letter-spacing: 2px;
}
.side-menu {
display: flex;
flex-direction: column;
gap: 1rem;
}
.menu-item {
color: #fff;
padding: 10px 8px;
border-radius: 8px;
cursor: pointer;
font-size: 1rem;
transition:
background 0.2s,
color 0.2s;
position: relative;
display: flex;
align-items: center;
min-height: 38px;
font-family: 'Poppins', sans-serif !important;
@media (max-width: 500px) {
flex-direction: column;
}
}
.menu-item.selecteded,
.menu-item.open {
// background: #25306a;
background: #050d36;
color: #23bbff;
border-right: 2px solid #23bbff;
font-weight: 600;
}
.menu-item:hover {
background: #394588;
}
.menu-icon {
margin-right: 0.3rem;
font-size: 1.3rem;
min-width: 24px;
display: flex;
justify-content: center;
}
.menu-label {
flex: 1;
color: #ffffff;
font-size: 13px;
font-weight: 500;
word-break: break-word;
max-width: 140px;
line-height: 1.2;
font-family: 'Poppins', sans-serif !important;
@media (max-width: 500px) {
font-size: 8px !important;
margin-top: 2px;
}
}
.side-menu-wrapper {
display: flex;
flex-direction: column;
height: 95vh; // Full screen height
overflow: hidden;
}
.side-menu {
display: flex;
flex-direction: column;
height: 100%;
}
.top-menu {
// flex: 1 1 auto;
overflow: hidden; // Prevent scroll
display: flex;
flex-direction: column;
width: 100%;
}
.bottom-menu {
flex-shrink: 0;
padding: 10px 0;
width: 100%;
// height: 32vh;
max-height: 30vh;
overflow: auto;
// padding-bottom: 5rem;
}
.menu-arrow {
margin-left: auto;
font-size: 1.2rem;
display: flex;
align-items: center;
}
.submenu {
margin-left: 2.2rem;
display: flex;
flex-direction: column;
gap: 0.3rem;
}
.submenu-item {
color: #fff;
padding: 0.5rem 0.7rem;
border-radius: 6px;
font-size: 0.95rem;
cursor: pointer;
transition: background 0.2s;
}
.submenu-item:hover {
background: #2e397a;
}
.floating-submenu {
display: none !important;
}
.floating-submenu-item {
display: none !important;
}
.reports-parent {
position: relative;
}
// Dropdown submenu styles
.dropdown-submenu {
// position: fixed;
position: absolute;
margin-top: -2rem;
width: 200px;
background: #23378a;
color: #fff;
border-radius: 12px 12px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
// padding: 0.2rem 0 0.5rem 0;
z-index: 9999;
display: flex;
flex-direction: column;
gap: 0.2rem;
opacity: 1;
transform: translateY(0);
transition:
max-height 0.2s ease,
opacity 0.2s;
animation: dropdown-fade-in 0.2s;
// max-height: 350px;
// overflow: auto;
// left: 202px;
left: 12.7rem;
top: auto;
bottom: auto;
}
@keyframes dropdown-fade-in {
from {
opacity: 0;
transform: translateY(-10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.dropdown-submenu.nested {
background: #23378a;
border-radius: 10px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
padding: 0.2rem 0 0.5rem 0;
// position: fixed !important;
width: 200px;
z-index: 10000;
left: 12.7rem;
}
.side-menu-list.nested-list {
padding-left: 0;
height: max-content;
max-height: 54vh;
overflow: auto;
scrollbar-width: thin;
}
.side-menu-list {
margin: 3px 3px;
overflow: auto;
display: flex;
flex-direction: column;
gap: 0.1rem;
}
.dropdown-submenu-item {
color: #fff;
padding: 0.5rem 0.7rem;
border-radius: 6px;
font-size: 1rem;
font-weight: 500;
cursor: pointer;
display: flex;
align-items: center;
justify-content: flex-start;
transition:
background 0.18s,
color 0.18s;
background: transparent;
}
.dropdown-submenu-item:hover {
background: #394588;
color: #182147;
font-weight: 600;
}
.dropdown-submenu-item .open {
background: #050d36;
color: #182147;
font-weight: 600;
border-radius: 10px;
border-left: 3px solid #23bbff;
}
.dropdown-submenu-item.selecteded {
background: #050d36;
color: #182147;
font-weight: 600;
border-radius: 10px;
}
.dropdown-submenu-item.selecteded {
border-left: 3px solid #394588;
position: relative;
}
// .dropdown-submenu-item.selecteded::after {
// content: '';
// position: absolute;
// right: 8px;
// top: 50%;
// transform: translateY(-50%);
// width: 6px;
// height: 6px;
// background: #23bbff;
// border-radius: 50%;
// }
.menu-item.has-children {
position: relative;
}
@media (max-width: 900px) {
.dropdown-submenu {
left: 70px;
}
}
.bottom-menu {
.side-menu-list.nested-list {
max-height: 85vh;
}
.dropdown-submenu {
bottom: 8px;
}
}
.menu-labelDot {
position: absolute;
right: 15px;
color: #23bbff;
font-size: 14px;
}
.menu-item.open.has-children,
.dropdown-submenu-item.open.has-children {
background-color: #050d36 !important;
border-right: 2px solid #23bbff;
}
.menu-item.selecteded,
.dropdown-submenu-item.selecteded {
background-color: #050d36 !important;
color: #fff !important;
}
.shopNameNav {
display: flex;
flex-direction: row;
align-items: center;
text-transform: capitalize;
gap: 0;
gap: 10px;
div {
font-size: 18px;
font-weight: 500;
display: flex;
align-items: center;
gap: 12px;
@media (max-width: 499px) {
font-size: 14px !important;
svg {
width: 20px;
}
}
}
div:nth-child(2) {
font-size: 22px;
font-weight: 500;
display: unset;
font-family: "Poppins";
letter-spacing: -1.2px;
}
p {
font-size: 10px;
font-weight: 400;
letter-spacing: 0.3px;
@media (max-width: 499px) {
font-size: 7px !important;
}
}
img {
padding-right: 1rem;
@media (max-width: 499px) {
width: 100px;
}
}
}

196
src/Components/Menu/sideMenu.scss Normal file
View File

@ -0,0 +1,196 @@
.ant-menu-title-content {
flex-direction: column;
display: flex;
// shifayath
// align-items: center;
//
font-size: 12px;
}
.ant-menu-vertical > .ant-menu-submenu > .ant-menu-submenu-title {
height: 57px;
line-height: 35px;
font-size: 12px;
font-weight: 600;
display: flex;
flex-direction: column;
// align-items: center;
row-gap: 0.5rem;
}
@media (max-width: 500px) {
.sideNaveParent {
// width: 16vw;
position: relative;
z-index: 100;
}
}
.sideNaveParent .ant-menu-submenu > .ant-menu-submenu-title {
height: 57px;
line-height: 35px;
font-size: 12px;
font-weight: 600;
display: flex;
flex-direction: column;
align-items: center;
row-gap: 0.5rem;
padding-inline-end: 15px;
}
.ant-menu-vertical > .ant-menu-submenu > .ant-menu-submenu-title:hover {
font-size: 12px;
font-weight: 600;
color: var(--PRIMARY_BUTTON_BG_COLOR) !important;
}
:where(.css-dev-only-do-not-override-2i2tap).ant-menu-vertical
> .ant-menu-submenu
> .ant-menu-submenu-title {
align-items: center;
}
:where(.css-2i2tap).ant-menu-vertical
> .ant-menu-submenu
> .ant-menu-submenu-title {
align-items: center;
}
.ant-menu-vertical > .ant-menu-item {
// line-height: 35px;
line-height: 30px;
font-size: 12px;
font-weight: 600;
// height: 70px;
// height: 57px;
height: 50px;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
row-gap: 0.5rem;
margin-inline: 0px;
margin-block: 0px;
}
.ant-menu-vertical > .ant-menu-item:hover {
font-size: 12px;
font-weight: 700;
color: var(--PRIMARY_BUTTON_BG_COLOR) !important;
}
.ant-menu-light .ant-menu-submenu-selected > .ant-menu-submenu-title,
.ant-menu-light
> .ant-menu
.ant-menu-submenu-selected
> .ant-menu-submenu-title {
color: var(--PRIMARY_BUTTON_BG_COLOR) !important;
}
.ant-menu-light .ant-menu-item-selected,
.ant-menu-light > .ant-menu .ant-menu-item-selected {
color: var(--PRIMARY_BUTTON_BG_COLOR) !important;
}
.ant-menu-light .ant-menu-item-selected,
.ant-menu-light > .ant-menu .ant-menu-item-selected {
color: var(--PRIMARY_BUTTON_BG_COLOR) !important;
}
.ant-menu-light .ant-menu-item-selected,
.ant-menu-light > .ant-menu .ant-menu-item-selected {
background-color: #f4eaf2;
}
.ant-menu .ant-menu-item .ant-menu-item-icon svg {
font-size: 25px;
}
.sideNaveParent .ant-menu .ant-menu-submenu-arrow {
top: 40%;
}
.ant-menu .ant-menu-submenu-title .ant-menu-item-icon svg {
font-size: 25px;
// align-items: center;
}
.ant-menu .ant-menu-item .ant-menu-item-icon + span {
margin-inline-start: 0px;
}
.ant-menu-light,
.ant-menu-light > .ant-menu {
color: rgba(92, 92, 92, 0.88);
background: none;
padding: 2px;
top: 1rem;
justify-content: center;
}
.menuLogos {
fill: #ff4d4f;
background: #ff4d4f;
}
.ant-menu-submenu {
// max-height: 60vh !important;
// june 26
max-height: 56vh !important;
overflow: auto !important;
}
.sideMenuantd {
width: 9vw !important;
height: 100%;
padding: 0px;
padding-inline: 0px;
padding-inline-end: 0px;
padding-left: 0px;
}
.sideMenuantd2 {
width: 5vw !important;
height: 100%;
padding: 0px;
padding-inline: 0px;
padding-inline-end: 0px;
padding-left: 0px;
}
.sidebarlogo {
// margin-bottom: 1rem;
font-weight: 600;
}
@media screen and (max-width: 768px) {
.sideMenuantd {
width: 25vw !important;
height: 100%;
padding: 0px;
padding-inline: 0px;
padding-inline-end: 0px;
padding-left: 0px;
}
.sideMenuantd2 {
width: 10vw !important;
// width: 5rem !important;
height: 100%;
padding: 0px;
padding-inline: 0px;
padding-inline-end: 0px;
padding-left: 0px;
}
.sidebarlogo {
transform: rotate(-90deg);
}
}
@media screen and (max-width: 499px) {
.sideMenuantd2 {
width: 3rem !important;
// width: 5rem !important;
height: 100%;
padding: 0px;
padding-inline: 0px;
padding-inline-end: 0px;
padding-left: 0px;
}
}

46
src/Components/MenuBar/SideMenu.jsx Normal file
View File

@ -0,0 +1,46 @@
import React from 'react';
import { Layout, Menu, theme } from 'antd';
const { Sider } = Layout;
export const SideMenu = ({ items }) => {
items?.map((icon, index) => ({
key: String(index + 1),
icon: React.createElement(
'img',
{ src: icon['menuicon'], height: '200px', width: '300px' },
null
),
label: icon['menuname'],
}));
return (
<Layout hasSider>
<Sider
style={{
overflow: 'auto',
height: '100vh',
position: 'fixed',
left: 0,
top: 0,
bottom: 0,
backgroundColor: '#dbe8f5',
}}
>
<div
style={{
height: 32,
margin: 16,
}}
/>
<Menu
theme="white"
style={{ color: 'black' }}
mode="inline"
defaultSelectedKeys={['4']}
items={items}
/>
</Sider>
</Layout>
);
};

65
src/Components/Modal/DefaultModal.jsx Normal file
View File

@ -0,0 +1,65 @@
import { useEffect } from 'react';
import { Modal } from 'antd';
import Buttons from '../Forms/Buttons';
import { ArrowRightOutlined, CloseOutlined } from '@ant-design/icons';
export const DefaultModal = ({
open,
title,
handleCancel,
children,
footer,
handleSubmit,
width,
destroyOnClose,
buttonText,
maskTransitionName,
transitionName,
className,
}) => {
// Close modal on pressing 'Escape'
useEffect(() => {
const handleKeyDown = (event) => {
if (event.key === 'Escape' && open) {
handleCancel();
}
};
window.addEventListener('keydown', handleKeyDown);
return () => window.removeEventListener('keydown', handleKeyDown);
}, [open, handleCancel]);
return (
<>
<Modal
destroyOnClose={destroyOnClose ? destroyOnClose : false}
open={open}
title={title}
top={0}
width={width ? width : 700}
maskTransitionName={maskTransitionName}
transitionName={transitionName}
className={className}
centered
closeIcon={<CloseOutlined onClick={handleCancel} />}
onCancel={handleCancel} // Handles default close (mask clicks, close icon)
footer={
footer
? [
<Buttons
buttonText={buttonText ? buttonText : 'SUBMIT'}
color="901D77"
icon={<ArrowRightOutlined />}
handleSubmit={handleSubmit}
>
{buttonText}
</Buttons>,
]
: footer
}
maskClosable={true} // Ensures clicking outside closes the modal
>
{children}
</Modal>
</>
);
};

97
src/Components/Modal/Modal.jsx Normal file
View File

@ -0,0 +1,97 @@
import React, { useState } from 'react';
import { Modal, Button } from 'antd';
import { ImportOutlined, ExportOutlined } from '@ant-design/icons';
import * as XLSX from 'xlsx';
import { saveAs } from 'file-saver';
const [excelData, setExcelData] = useState(null);
const [excelFile, setExcelFile] = useState(null);
const [excelFileError, setExcelFileError] = useState(null);
const handleFile = (e) => {
let selectedFile = e.target.files[0];
if (selectedFile) {
if (selectedFile && fileType.includes(selectedFile.type)) {
let reader = new FileReader();
reader.readAsArrayBuffer(selectedFile);
reader.onload = (e) => {
setExcelFileError(null);
setExcelFile(e.target.result);
};
} else {
setExcelFileError('Please select only excel file types');
setExcelFile(null);
}
} else {
console.log('Please select a file');
}
};
const handleSubmit = (e) => {
e.preventDefault();
if (excelFile !== null) {
const workbook = XLSX.read(excelFile, { type: 'buffer' });
const worksheetName = workbook.SheetNames[0];
const worksheet = workbook.Sheets[worksheetName];
const data = XLSX.utils.sheet_to_json(worksheet);
setExcelData(data);
} else {
setExcelData(null);
}
};
const handleExport = () => {
if (excelData !== null) {
const worksheet = XLSX.utils.json_to_sheet(excelData);
const workbook = XLSX.utils.book_new();
XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1');
const excelBuffer = XLSX.write(workbook, {
bookType: 'xlsx',
type: 'array',
});
const excelData = new Blob([excelBuffer], {
type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
});
saveAs(excelData, 'exported_data.xlsx');
}
};
const Modals = ({ open, title, handleCancel, children, footer }) => {
return (
<Modal
visible={open}
title={title}
onCancel={handleCancel}
footer={
footer
? [
<Button key="submit" type="primary" onClick={handleSubmit}>
Submit
</Button>,
<Button key="cancel" onClick={handleCancel}>
Cancel
</Button>,
]
: footer
}
>
{children}
<div>
<h4>Import Excel</h4>
<input type="file" onChange={handleFile} />
{excelFileError && <div className="error">{excelFileError}</div>}
<Button type="primary" icon={<ImportOutlined />} onClick={handleSubmit}>
Import
</Button>
</div>
<div>
<h4>Export Excel</h4>
<Button type="primary" icon={<ExportOutlined />} onClick={handleExport}>
Export
</Button>
</div>
</Modal>
);
};
export default Modals;

28
src/Components/Notifications/Messages.jsx Normal file
View File

@ -0,0 +1,28 @@
import { useEffect } from 'react';
import { message } from 'antd';
export const Messages = ({
messageType,
messageData,
duration,
onComplete,
}) => {
const [messageApi, contextHolder] = message.useMessage();
useEffect(() => {
if (messageType)
messageApi
.open({
type: messageType,
content: messageData,
duration: duration ? duration : 3,
})
.then(() => {
if (onComplete) {
onComplete();
}
});
}, [messageType]);
return <>{contextHolder}</>;
};

22
src/Components/Tables/ReprintTable.jsx Normal file
View File

@ -0,0 +1,22 @@
import { Table } from 'antd';
export const ReprintTables = ({ columns, data, onChange, pagination }) => {
return (
<>
<Table
columns={columns}
dataSource={data}
onChange={onChange}
pagination={
pagination
? false
: {
defaultPageSize: 10,
showSizeChanger: false,
hideOnSinglePage: true,
}
}
/>
</>
);
};

43
src/Components/Tables/Table.jsx Normal file
View File

@ -0,0 +1,43 @@
import { Table } from 'antd';
export const Tables = ({
columns,
data,
onChange,
pagination,
rowSelection,
rowClassName,
summary,
}) => {
return (
<>
<Table
columns={columns}
dataSource={data}
onChange={onChange}
summary={summary ? summary : null}
rowSelection={rowSelection ? rowSelection : null}
pagination={
pagination
? {
onChange: pagination,
defaultPageSize: 10,
showSizeChanger: false,
hideOnSinglePage: true,
}
: false
}
rowClassName={rowClassName}
// pagination={
// pagination
// ? pagination
// : {
// defaultPageSize: 10,
// showSizeChanger: false,
// hideOnSinglePage: true,
// }
// }
/>
</>
);
};

16
src/Components/Tooltip/Tooltip.jsx Normal file
View File

@ -0,0 +1,16 @@
import React from 'react';
import { Tooltip } from 'antd';
const TooltipWrapper = ({ children, title, isMobile, placement, onClick }) => {
if (isMobile) {
return children; // If isMobile is true, just render the children without a Tooltip
}
return (
<Tooltip title={title} placement={placement} onClick={onClick}>
{children}
</Tooltip>
); // Otherwise, wrap the children in Tooltip
};
export default TooltipWrapper;

162
src/Components/WeightScale/weightScale.jsx Normal file
View File

@ -0,0 +1,162 @@
import React, { Component } from 'react';
import { FaWeight } from 'react-icons/fa';
class WeightScale extends Component {
constructor(props) {
super(props);
this.state = {
Finalresult: '',
result: '',
amtPerGram: 0,
finalData: [],
portValdata: null,
};
}
// this.myfun
componentDidMount = async () => {
this.portfun(this.props.portval);
if (this.props.WeightScale === false) {
await port.close({ baudRate: 9600 });
port.close(() => {
connected = false;
});
}
};
portfun = async (e) => {
if (e === null) {
const port = await navigator.serial.requestPort();
if (port) {
await this.props.setportfun(port);
await this.myfun(port);
} else {
console.log('portnot closed', port);
}
} else {
this.props.setportfun(e);
this.myfun(e);
}
};
isFloat = (value) => {
const numericValue = parseFloat(value);
return !Number.isNaN(numericValue) && !Number.isInteger(numericValue);
};
myfun = async (port) => {
// const port = await navigator.serial.requestPort();
if (port.readable === null) {
await port.open({ baudRate: 9600 });
}
while (port.readable) {
if (!port.readable.locked) {
const reader = port.readable.getReader();
try {
while (true) {
const { value, done } = await reader.read();
if (done) {
reader.releaseLock();
break;
}
if (value) {
await this.setState({
result: await new TextDecoder('utf-8').decode(value),
});
if (
this.isFloat(new TextDecoder('utf-8').decode(value)) === true
) {
await this.props.testfun(
new TextDecoder('utf-8').decode(value)
);
}
if (this.props.portclose === false) {
reader.cancel();
await port.close({ baudRate: 9600 });
port.close(() => {
connected = false;
});
}
}
}
} catch (error) {
if (error.message === 'The device has been lost.') {
this.props.msg({ type: 'error', msg: 'Weight Scale disconnect' });
// Optionally, you can attempt to reopen the port or take other actions
}
}
} else {
break;
}
}
};
openport = async () => {
const port = await navigator.serial.requestPort();
if (port) {
this.props.setportfun(port);
}
if (port.readable === null) {
await port.open({ baudRate: 9600 });
}
while (port.readable) {
if (!port.readable.locked) {
const reader = port.readable.getReader();
try {
while (true) {
const { value, done } = await reader.read();
if (done) {
reader.releaseLock();
break;
}
if (value) {
await this.setState({
result: await new TextDecoder('utf-8').decode(value),
});
if (
this.isFloat(new TextDecoder('utf-8').decode(value)) === true
) {
await this.props.testfun(
new TextDecoder('utf-8').decode(value)
);
}
if (this.props.portclose === false) {
reader.cancel();
}
}
}
} catch (error) {}
} else {
break;
}
}
};
componentDidUpdate = async () => {
if (this.props.portclose === true) this.portfun(this.props.portval);
};
render() {
return (
<div style={{ display: 'inline' }}>
{/* <FaWeight
style={{fontSize: "22px", cursor: "pointer", margin: "0px 0px 5px 16px",color: "black"}}
onClick={()=>this.openport()}
/> */}
</div>
);
}
}
export default WeightScale;

61
src/Features/AppPage/CenterPage.js Normal file
View File

@ -0,0 +1,61 @@
import { createSlice, createAsyncThunk } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../AuthenicationToken/AuthenticationToken';
export const getEmpAccess = createAsyncThunk(
'Home/getEmpAccess',
async (data) => {
if (
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined &&
data?.EmpId != null &&
data?.EmpId != undefined &&
data?.AppId != null &&
data?.AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/empAccess?CompId=${data?.CompId}&BranchId=${data?.BranchId}&EmpId=${data?.EmpId}&AppId=${data?.AppId}`
);
}
}
);
const initialState = {
breadCrumb: [],
RedirectStatus: false,
EmpAccessDetail:[]
};
const centerPageSlice = createSlice({
name: 'centerPage',
initialState,
reducers: {
changeBreadCrumb: (state, action) => {
const { items } = action?.payload;
state.breadCrumb = items;
},
emptyBreadCrumb: (state, action) => {
state.breadCrumb = [];
},
ChangeRedirectStatus: (state, action) => {
state.RedirectStatus = action?.payload;
},
},
extraReducers: (builder) => {
builder.addCase(getEmpAccess.fulfilled, (state, action) => {
if (action?.payload?.data?.statusCode === 1) {
state.EmpAccessDetail = action?.payload?.data?.data[0]?.EmpAccessDetails;
}
})
}
});
export const { changeBreadCrumb, emptyBreadCrumb, ChangeRedirectStatus } =
centerPageSlice.actions;
export const breadCrumbSelector = (state) => state.centerPage?.breadCrumb;
export const GlobalRedirectStatus = (state) => state.centerPage?.RedirectStatus;
export const GlobalEmpAccessDetail = (state)=>state.centerPage?.EmpAccessDetail
export default centerPageSlice.reducer;

183
src/Features/AuthenicationToken/AuthenticationToken.js Normal file
View File

@ -0,0 +1,183 @@
import axios from 'axios';
import {
getSession,
clearSession,
TokendecryptedValuesFun,
} from '../../Services/Others';
const apiUrl = import.meta.env.ENV_API_URL;
const apiCommonUrl = import.meta.env.ENV_API_URL_COMMON;
const subDirectory = import.meta.env.ENV_COMMON_BASE_URL;
const EmailApiUrl = import.meta.env.ENV_EMAIL_API;
const axiosRetailInstance = axios.create({
baseURL: apiUrl,
});
const axiosCommonInstance = axios.create({
baseURL: apiCommonUrl,
});
const axiosEmail_SMS = axios.create({
baseURL: EmailApiUrl,
});
const getToken = () => {
return new Promise((resolve) => {
let token = sessionStorage.getItem('auth');
if (token) {
resolve(token);
} else {
const tokenInterval = setInterval(() => {
token = sessionStorage.getItem('auth');
if (token) {
clearInterval(tokenInterval);
resolve(token);
}
}, 100);
}
});
};
const addAuthHeader = async (config) => {
const token = await getToken();
if (token) {
config.headers['Authorization'] = `Bearer ${token}`;
console.log(config, 'Request config after adding token');
} else {
console.warn('Token is still not available.');
}
let encryptedMobileno = sessionStorage.getItem('MobileNo');
let encryptedUserId = sessionStorage.getItem('UserId');
let encryptedLoginType = TokendecryptedValuesFun(
sessionStorage.getItem('LoginType')
);
console.log(
'encryptedLoginType',
encryptedLoginType,
TokendecryptedValuesFun(encryptedMobileno)
);
// let Mobileno = encryptedUserId && encryptedLoginType != "Kiosk" ? TokendecryptedValuesFun(encryptedMobileno) : '1000000001';
let Mobileno = encryptedUserId
? TokendecryptedValuesFun(encryptedMobileno)
: '1000000001';
console.warn('Mobileno is still not available.');
config.headers['Mobileno'] = Mobileno;
return config;
};
axiosRetailInstance.interceptors.request.use(addAuthHeader, (error) => {
console.error('Error in request interceptor:', error);
return Promise.reject(error);
});
axiosCommonInstance.interceptors.request.use(addAuthHeader, (error) => {
console.error('Error in request interceptor:', error);
return Promise.reject(error);
});
axiosEmail_SMS.interceptors.request.use(addAuthHeader, (error) => {
console.error('Error in request interceptor:', error);
return Promise.reject(error);
});
function showNotification(message) {
const notification = document.createElement('div');
notification.innerText = message;
notification.style.cssText = `
position: fixed;
top: 10%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #f03e3e;
color: white;
padding: 15px 30px;
border-radius: 8px;
font-family: Arial, sans-serif;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
z-index: 1000;
opacity: 0;
transition: opacity 0.3s ease;
`;
document.body.appendChild(notification);
// Show the notification
setTimeout(() => {
notification.style.opacity = 1;
}, 10);
// Remove the notification after 3 seconds
setTimeout(() => {
notification.style.opacity = 0;
setTimeout(() => notification.remove(), 300);
}, 2000);
}
const responseErrorHandler = async (error) => {
if (error.response && error.response.status === 401) {
showNotification(
'Your session has expired. Please log in again to continue.'
);
setTimeout(() => {
if (getSession('UserId')) {
const Generate = 'N';
fetch(`${apiCommonUrl}/Logout`, {
method: 'PUT',
headers: {
'Content-Type': 'application/json',
Authorization: sessionStorage.getItem('auth')
? sessionStorage.getItem('auth')
: 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9',
Mobileno: getSession('MobileNo')
? getSession('MobileNo')
: '1000000001',
},
body: JSON.stringify({
UserId: getSession('UserId'),
Generate: Generate,
RequestMode: 'DW',
}),
})
.then((response) => {
if (!response.ok) {
throw new Error(`Error: ${response.status}`);
}
return response.json();
})
.then((data) => {
if (data?.statusCode === 1) {
clearSession();
window.location.href = `${subDirectory}`;
}
})
.catch((error) => {
console.error('Error:', error);
});
}
// else {
// clearSession();
// window.location.href = `${subDirectory}`;
// }
}, 2000);
}
// else {
// alert("An error occurred. Please try again later.");
// }
return Promise.reject(error);
};
axiosCommonInstance.interceptors.response.use(
(response) => response, // On success, just return the response
// responseErrorHandler // Handle errors
);
axiosRetailInstance.interceptors.response.use(
(response) => response, // On success, just return the response
// responseErrorHandler // Handle errors
);
export const axiosRetailInstanceData = axiosRetailInstance;
export const axiosCommonInstanceData = axiosCommonInstance;
export const axiosEmail_SMSData = axiosEmail_SMS;

73
src/Features/Barcode/Barcode.js Normal file
View File

@ -0,0 +1,73 @@
import { createAsyncThunk } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../AuthenicationToken/AuthenticationToken';
export const getBarcodeSessionsIDs = createAsyncThunk(
'barcode/getBarcodeSessionsIDs',
async () => {
return await axiosRetailInstanceData.get(
`/ConfigMaster?typeName=Barcode Size`
);
}
);
export const getBarcodeComponent = createAsyncThunk(
'barcode/getBarcodeComponent',
async () => {
return await axiosRetailInstanceData.get(`/BarcodeComponent`);
}
);
export const getBarcodeComponentsBasedOnSessionId = createAsyncThunk(
'barcode/getBarcodeComponent',
async (sessionId) => {
return await axiosRetailInstanceData.get(
`/BarcodeComponent?sessionId=${sessionId}&activeStatus=A`
);
}
);
export const putBarcodeComponent = createAsyncThunk(
'barcode/putBarcodeComponent',
async (putData) => {
return await axiosRetailInstanceData.put('/BarcodeComponent', putData);
}
);
export const postBarcodeComponent = createAsyncThunk(
'barcode/postBarcodeComponent',
async (postData) => {
return await axiosRetailInstanceData.post('/BarcodeComponent', postData);
}
);
export const deleteBarcodeComponent = createAsyncThunk(
'barcode/deleteBarcodeComponent',
async ({ componentId, updatedBy, activeStatus }) => {
return await axiosRetailInstanceData.delete(
`/BarcodeComponent?componentId=${componentId}&updatedBy=${updatedBy}&activeStatus=${activeStatus}`
);
}
);
export const getBarcodeTemplate = createAsyncThunk(
'barcode/getBarcodeComponent',
async ({ compId, appId, branchId }) => {
return await axiosRetailInstanceData.get(
`/BarcodeTemplate?compId=${compId}&appId=${appId}&branchId=${branchId}`
);
}
);
export const putBarcodeTemplate = createAsyncThunk(
'barcode/putBarcodeComponent',
async (putData) => {
return await axiosRetailInstanceData.put('/BarcodeTemplate', putData);
}
);
export const postBarcodeTemplate = createAsyncThunk(
'barcode/postBarcodeComponent',
async (postData) => {
return await axiosRetailInstanceData.post('/BarcodeTemplate', postData);
}
);

2198
src/Features/BookingScreen/BookingData/BookingData.js Normal file
View File

File diff suppressed because it is too large Load Diff

37
src/Features/BookingScreen/BookingData/DateStore.js Normal file
View File

@ -0,0 +1,37 @@
//
import { create } from 'zustand';
// Utility: format date as YYYY-MM-DD
const formatDate = (date) => {
const d = new Date(date);
const year = d.getFullYear();
const month = String(d.getMonth() + 1).padStart(2, '0');
const day = String(d.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
};
// Utility: get today's and tomorrow's date
const today = new Date();
const tomorrow = new Date();
tomorrow.setDate(today.getDate() + 1);
export const useDateStore = create((set) => ({
selectedDate: [formatDate(today), formatDate(today)], // initial 2 dates
isBulk: false,
setSelectedDate: (dates) => {
// Always store as an array in YYYY-MM-DD format
const formattedDates = (Array.isArray(dates) ? dates : [dates]).map(formatDate);
console.log(formattedDates, "dates useDateStore");
set({ selectedDate: formattedDates });
},
clearDates: () => {
// Reset to current + next day in YYYY-MM-DD format
const t1 = formatDate(new Date());
set({ selectedDate: [t1, t1] });
},
setIsBulk: (value) => set({ isBulk: value }),
}));

523
src/Features/BookingScreen/BookingData/KioskBookingData.js Normal file
View File

@ -0,0 +1,523 @@
import { createSlice, createAsyncThunk } from '@reduxjs/toolkit';
import axios from 'axios';
import {
axiosRetailInstanceData,
axiosCommonInstanceData,
} from '../../AuthenicationToken/AuthenticationToken';
import { getSession } from '../../../Services/Others';
import { getSelfBooking } from '../../TableBooking/TableBooking';
const Paymentdevice_POST_URL = import.meta.env.ENV_PAYMENT_DEVICE_URL;
const Paymentdevice_GET_URL = import.meta.env.ENV_PAYMENT_STATUS_GET_URL;
const apiCommonUrl = import.meta.env.ENV_API_URL_COMMON;
export const getProductCategories = createAsyncThunk(
'KioskBookingData/getLayoutCategories',
async ({ CompId, BranchId, AppId }) => {
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/productCat?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}`
);
}
}
);
export const getPaymentVerfication = createAsyncThunk(
'KioskBookingData/getLayoutCategories',
async (OrderId) => {
if (
OrderId != null &&
OrderId != undefined
) {
return await axiosRetailInstanceData.get(
`/PaymentPageStatus?orderId=${OrderId}`
);
}
}
);
export const getCustomerBooking = createAsyncThunk(
'self/CustomerBookings',
({ AppId, CompId, BranchId, CustId, FromDate, ToDate }) => {
if (CompId != null && CompId != undefined && BranchId != null && BranchId != undefined && AppId != null && AppId != undefined && CustId != null && CustId != undefined && FromDate != null && FromDate != undefined && ToDate != null && ToDate != undefined) {
return axiosRetailInstanceData.get(`/CustomerBookings?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&CustId=${CustId}&fromDate=${FromDate}&toDate=${ToDate}`);
}
else if (CompId != null && CompId != undefined && BranchId != null && BranchId != undefined && AppId != null && AppId != undefined && CustId != null && CustId != undefined) {
return axiosRetailInstanceData.get(`/CustomerBookings?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&CustId=${CustId}`);
}
}
);
// get /CustomerMembership
export const getCustomerMembership = createAsyncThunk(
'self/CustomerMembership',
({ AppId, CompId, BranchId, CustId }) => {
if (CompId != null && CompId != undefined && BranchId != null && BranchId != undefined && AppId != null && AppId != undefined && CustId != null && CustId != undefined) {
return axiosRetailInstanceData.get(`/CustomerMembership?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&CustId=${CustId}`);
}
}
);
export const getProductCardListKiosk = createAsyncThunk(
'KioskBookingData/getProductCardListKiosk',
async ({ CompId, BranchId, AppId, ProdCat, ProdSubCat, Search, Dates,fromDate,toDate }) => {
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined &&
ProdCat != null &&
ProdCat != undefined && Search != null && Search != undefined && Search != ""
) {
return await axiosRetailInstanceData.get(
`/productCardList?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&ProdName=${encodeURIComponent(Search)}`
);
}
else if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined &&
ProdSubCat != null &&
ProdSubCat != undefined &&
fromDate != null &&
fromDate != undefined &&
toDate != null &&
toDate != undefined
) {
return await axiosRetailInstanceData.get(
`/productCardList?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&ProdSubCat=${ProdSubCat}&fromDate=${fromDate}&toDate=${toDate}`
);
}
else if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined &&
ProdSubCat != null &&
ProdSubCat != undefined &&
Dates != null && Dates != undefined
) {
return await axiosRetailInstanceData.get(
`/productCardList?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&ProdSubCat=${ProdSubCat}&date=${Dates}`
);
}
else if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined &&
ProdSubCat != null &&
ProdSubCat != undefined
) {
return await axiosRetailInstanceData.get(
`/productCardList?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&ProdSubCat=${ProdSubCat}`
);
}
else {
return await axiosRetailInstanceData.get(
`/ProductCardList?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&prodCat=${ProdCat}`
);
}
}
);
export const PostKioskBookingData = createAsyncThunk(
'BookingData/PostKioskBookingdata',
async (postData) => {
return await axiosRetailInstanceData.post(`/KioskBooking`, postData);
}
);
export const PostSelfBookingCustomer = createAsyncThunk(
'BookingData/PostKioskBookingdata',
async (postData) => {
return await axiosRetailInstanceData.post(`/CustomerSelfBooking`, postData);
}
);
export const PutKioskBookingData = createAsyncThunk(
'BookingData/PutKioskBookingdata',
async (putData) => {
return await axiosRetailInstanceData.put(`/KioskBooking`, putData);
}
);
export const PutBookingPaymentStatusChange = createAsyncThunk(
'BookingData/PutBookingPaymentStatusChange',
async (putData) => {
return await axiosRetailInstanceData.put(`/BookingPaymentStatus`, putData);
}
);
// http://192.168.1.37:8001/ProductCardList?request.compId=1&request.branchId=1&request.appId=2&request.prodCat=224
export const getCompanyData = createAsyncThunk(
'appAccess/getCompanyData',
async ({ CompId }) => {
if (CompId != null && CompId != undefined) {
return await axios.get(`${apiCommonUrl}/company?CompId=${CompId}`);
}
}
);
export const getPaymentGatewayConfig = createAsyncThunk(
'getPaymentGatewayConfig',
async ({ CompId, AppId, BranchId }) => {
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined
) {
return await axiosCommonInstanceData.get(
`/PaymentGatewayConfig?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}`
);
}
}
);
export const getPaymentGatewayDetails = createAsyncThunk(
'getPaymentGatewayDetails',
async ({ CompId, AppId, BranchId, DetailType }) => {
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/upi?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&detailType=${DetailType}`
);
}
}
);
export const getAllApplications = createAsyncThunk(
'application/getApplicationData',
async ({ AppId }) => {
if (AppId != null && AppId != undefined) {
return axios.get(`${apiCommonUrl}/application?AppId=${AppId}`);
}
}
);
export const getDeviceAccess = createAsyncThunk(
'agetDeviceAccess',
async ({ DeviceAddress }) => {
if (DeviceAddress != null && DeviceAddress != undefined) {
return axiosCommonInstanceData.get(
`/DeviceInfo?DeviceAddress=${DeviceAddress}`
);
}
}
);
export const getPaymentOptionsData = createAsyncThunk(
'getPaymentOptionsData',
({ AppId, CompId, BranchId }) => {
const UserType = getSession('UserType');
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined &&
UserType !== 'Super Admin' &&
UserType !== 'Super Admin User'
) {
return axiosRetailInstanceData.get(
`/paymentOptions?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}`
);
}
}
);
export const getPaymentDeviceAccessData = createAsyncThunk(
'getPaymentDeviceAccessData',
({ AppId, CompId, BranchId, UserId }) => {
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined &&
UserId != null &&
UserId != undefined
) {
return axiosRetailInstanceData.get(
`/PaymentDeviceAccess?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&UserId=${UserId}`
);
}
}
);
export const getPaymentGatewayAccessData = createAsyncThunk(
'getPaymentGatewayAccessData',
({ AppId, CompId, BranchId, ActiveStatus }) => {
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined
) {
return axiosCommonInstanceData.get(
`/PaymentGatewayConfig?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&ActiveStatus=${ActiveStatus}`
);
}
}
);
export const postPaymentDevice = createAsyncThunk(
'postPaymentDevice',
async (data, { rejectWithValue }) => {
try {
const response = await axios.post(`${Paymentdevice_POST_URL}`, data, {
headers: {
'Content-Type': 'application/json', // Set the Content-Type header
// Add any other headers here if needed
},
});
console.log('Response Data:', response?.data); // Log the response data
return response?.data;
} catch (error) {
console.error('Request Error:', error);
return rejectWithValue(error.response?.data || error.message);
}
}
);
export const getPaymentDeviceResponse = createAsyncThunk(
'getPaymentDeviceResponse',
async (data, { rejectWithValue }) => {
try {
const response = await axios.post(`${Paymentdevice_GET_URL}`, data, {
headers: {
'Content-Type': 'application/json', // Set the Content-Type header
},
});
console.log('Response Data:', response?.data); // Log the response data
return response?.data;
} catch (error) {
console.error('Request Error:', error);
return rejectWithValue(error.response?.data || error.message);
}
}
);
const initialState = {
BookingType: 'TakeAway',
ProdCat: null,
ProdSubCat: null,
CategorieData: [],
ProductCardList: [],
KioskOrderDetails: [],
OrderbtnClicked: false,
OrderId: null,
SalesId: null,
KioskBookingTypeBoth: false,
PaymentgatewayRedirect: false,
PGFailedTransId: null,
PGFailedAmt: null,
MergeData: [], // Add merge data to global state
LastBuyProducts: [],
changeAddlastPrds: false,
MembershipDetail: [],
OrderOfferDetails: [],
selfBookingCustomerDtls: null,
MembershipNumber: null
};
const KioskBookingData = createSlice({
name: 'KioskBookingData',
initialState,
reducers: {
changeSelfBookingCustomerDtls: (state, action) => {
state.selfBookingCustomerDtls = action?.payload
},
changeOrderOfferDetail: (state, action) => {
state.OrderOfferDetails = action?.payload;
},
changeAddlastPrds: (state, action) => {
state.changeAddlastPrds = action?.payload;
},
changeMembershipDetail: (state, action) => {
state.MembershipDetail = action?.payload;
},
changeAllLastBuyProducts: (state, action) => {
state.LastBuyProducts = action?.payload
},
changeProductCategorie: (state, action) => {
state.ProdCat = action?.payload;
},
changeProductSubCategorie: (state, action) => {
state.ProdSubCat = action?.payload;
},
changeBookingType: (state, action) => {
state.BookingType = action?.payload;
},
changeCategorieData: (state, action) => {
state.CategorieData = action?.payload;
},
changeProductCardListData: (state, action) => {
state.ProductCardList = action?.payload;
},
changePaymentgatewayRedirect: (state, action) => {
state.PaymentgatewayRedirect = action?.payload;
},
changeAllGlbStatustData: (state, action) => {
(state.BookingType = 'TakeAway'),
(state.KioskOrderDetails = []),
(state.OrderbtnClicked = false),
(state.OrderId = null),
(state.ProdCat = null),
state.CategorieData;
// cart clear
},
changeKioskOrderDetails: (state, action) => {
state.KioskOrderDetails = action?.payload;
const result =
action?.payload?.some(
(product) => product.BookingTypeName === 'TakeAway'
) &&
action?.payload?.some(
(product) => product.BookingTypeName === 'Dine In'
);
state.KioskBookingTypeBoth = result ? true : false;
},
changeOrderbtnClicked: (state, action) => {
state.OrderbtnClicked = action?.payload;
},
changeOrderId: (state, action) => {
state.OrderId = action?.payload;
},
changeSalesId: (state, action) => {
state.SalesId = action?.payload;
},
changePGFailedTransId: (state, action) => {
state.PGFailedTransId = action?.payload;
},
changePGFailedAmt: (state, action) => {
state.PGFailedAmt = action?.payload;
},
changeMergeData: (state, action) => {
state.MergeData = action?.payload;
},
changeMembershipNumber: (state, action) => {
state.MembershipNumber = action?.payload;
}
},
extraReducers: (builder) => {
builder.addCase(getProductCategories.fulfilled, (state, action) => {
if (action?.payload?.data?.statusCode == 1) {
state.CategorieData = action?.payload?.data?.data;
// state.ProdCat = action?.payload?.data?.data[0].ProdCat;
} else {
state.CategorieData = action?.payload?.data?.data;
// state.ProdCat = null;
}
}),
builder.addCase(getProductCardListKiosk.fulfilled, (state, action) => {
if (action?.payload?.data?.statusCode == 1) {
state.ProductCardList = action?.payload?.data?.data;
} else {
state.ProductCardList = [];
}
});
builder.addCase(getSelfBooking.fulfilled, (state, action) => {
if (action?.payload?.data?.statusCode == 1) {
state.KioskOrderDetails =
action?.payload?.data?.data?.[0]?.productDetails?.map((item) => ({
...item,
disabled: true,
}));
state.OrderId = action?.payload?.data?.data?.[0]?.OrderId;
state.SalesId = action?.payload?.data?.data?.[0]?.SalesId;
} else {
state.KioskOrderDetails = [];
}
});
},
});
export const {
changeSelfBookingCustomerDtls,
changeProductCategorie,
changeProductSubCategorie,
changeBookingType,
changeCategorieData,
changeProductCardListData,
changeAllGlbStatustData,
changeKioskOrderDetails,
changeOrderbtnClicked,
changeOrderId,
changePaymentgatewayRedirect,
changePGFailedTransId,
changePGFailedAmt,
changeSalesId,
changeMergeData,
changeAllLastBuyProducts, changeAddlastPrds,
changeMembershipDetail, changeOrderOfferDetail, changeMembershipNumber
} = KioskBookingData.actions;
export const GlobalBookingTypeKiosk = (state) =>
state?.KioskBookingData?.BookingType;
export const GlobalProductCategorieKiosk = (state) =>
state?.KioskBookingData?.ProdCat;
export const GlobalProductSubCategorieKiosk = (state) =>
state?.KioskBookingData?.ProdSubCat;
export const GlobalCategorieDataKiosk = (state) =>
state?.KioskBookingData?.CategorieData;
export const GlobalProductCardListKiosk = (state) =>
state?.KioskBookingData?.ProductCardList;
export const GlobalKioskOrderDetails = (state) =>
state?.KioskBookingData?.KioskOrderDetails;
export const GlobalOrderbtnClicked = (state) =>
state?.KioskBookingData?.OrderbtnClicked;
export const GlobalOrderId = (state) => state?.KioskBookingData?.OrderId;
export const GlobalSalesId = (state) => state?.KioskBookingData?.SalesId;
export const GlobalKioskBookingTypeBoth = (state) =>
state?.KioskBookingData?.KioskBookingTypeBoth;
export const GlobalPaymentgatewayRedirect = (state) =>
state?.KioskBookingData?.PaymentgatewayRedirect;
export const GlobalPGFailedTransId = (state) =>
state?.KioskBookingData?.PGFailedTransId;
export const GlobalPGFailedAmt = (state) =>
state?.KioskBookingData?.PGFailedAmt;
export const GlobalMergeData = (state) => state?.KioskBookingData?.MergeData;
export const GlobalLastBuyProducts = (state) => state?.KioskBookingData?.LastBuyProducts;
export const GlobalChangeAddlastPrds = (state) => state?.KioskBookingData?.changeAddlastPrds;
export const GlobalMembershipDetail = (state) => state?.KioskBookingData?.MembershipDetail;
export const GlobalOrderOfferDetails = (state) => state?.KioskBookingData?.OrderOfferDetails;
export const GlobalSelfBookingCustomerDtls = (state) => state?.KioskBookingData?.selfBookingCustomerDtls;
export const GlobalMembershipNumber = (state) => state?.KioskBookingData?.MembershipNumber;
export default KioskBookingData.reducer;

136
src/Features/BookingScreen/Customer/addCustomer.js Normal file
View File

@ -0,0 +1,136 @@
import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../../AuthenicationToken/AuthenticationToken';
export const getAddCustomerDetails = createAsyncThunk(
'addCustomer/getAddCustomerDetails',
async (data) => {
if (
data?.MobileNo != null &&
data?.MobileNo != undefined &&
data?.AppId != null &&
data?.AppId != undefined &&
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined
) {
return await axiosRetailInstanceData.get(
`/customer?MobileNo=${data?.MobileNo}&AppId=${data?.AppId}&CompId=${data?.CompId}&BranchId=${data?.BranchId}`
);
}
}
);
export const postAddCustomerDetails = createAsyncThunk(
'addCustomer/postAddCustomerDetails',
async (postData) => {
return await axiosRetailInstanceData.post(`/customer`, postData);
}
);
export const postRePrintReason = createAsyncThunk(
'rePrint/postRePrintReason',
async (postData) => {
return await axiosRetailInstanceData.post(`/rePrint`, postData);
}
);
export const postDefaultReprintReason = createAsyncThunk(
'rePrint/postDefaultReprintReason',
async (postData) => {
return await axiosRetailInstanceData.post(`/DefaultStatusReprint`, postData);
}
);
export const getRePrintDefault = createAsyncThunk(
'rePrint/getRePrintDefault',
async (data) => {
return await axiosRetailInstanceData.get(`/ReprintHistoryStatus?compId=${data.CompId}&branchId=${data.BranchId}&appId=${data.AppId}&Type=Reprint`);
}
);
export const getDefaultPaymentOptions = createAsyncThunk(
'rePrint/getDefaultPaymentOptions',
async (data) => {
return await axiosRetailInstanceData.get(`/ReprintHistoryStatus?compId=${data.CompId}&branchId=${data.BranchId}&appId=${data.AppId}&Type=PaymentOptions`);
}
);
export const getRePrintReason = createAsyncThunk(
'rePrint/getRePrintReason',
async (data) => {
if (
data?.orderFromDate != null &&
data?.orderFromDate != undefined &&
data?.orderToDate != null &&
data?.orderToDate != undefined &&
data?.appId != null &&
data?.appId != undefined &&
data?.compId != null &&
data?.compId != undefined &&
data?.branchId != null &&
data?.branchId != undefined
) {
return await axiosRetailInstanceData.get(
`/ReprintHistory?compId=${data.compId}&branchId=${data.branchId}&appId=${data.appId}&fromDate=${data.orderFromDate}&toDate=${data.orderToDate}`
);
}
}
);
export const ReprintDetails = createAsyncThunk(
"addCustomer/ReprintDetails",
async (data) => {
const { AppId, CompId, BranchId, OrderFromDate, OrderToDate, OrderId } = data || {};
if (OrderId && !OrderFromDate && !OrderToDate) {
return await axiosRetailInstanceData.get(
`/reprint?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&OrderId=${OrderId}`
);
}
if (OrderFromDate && OrderToDate) {
return await axiosRetailInstanceData.get(
`/reprint?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&orderFromDate=${OrderFromDate}&orderToDate=${OrderToDate}`
);
} else {
return await axiosRetailInstanceData.get(
`/reprint?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}`
);
}
}
);
const initialState = {
AddCustomerDetails: [],
refreshTrigger: 0,
};
const addCustomer = createSlice({
name: 'addCustomer',
initialState,
reducers: {
changeCustomerdetails: (state, action) => {
state.AddCustomerDetails = action?.payload;
},
triggerCustomerRefresh: (state) => {
state.refreshTrigger += 1;
},
},
extraReducers: (builder) => {
builder.addCase(getAddCustomerDetails.fulfilled, (state, action) => {
if (action?.payload?.status) {
state.AddCustomerDetails = action?.payload?.data?.data;
} else {
state.AddCustomerDetails = [];
}
});
},
});
export const { changeCustomerdetails, triggerCustomerRefresh } = addCustomer.actions;
export const GlobalAddCustomerDetails = (state) =>
state.addCustomer?.AddCustomerDetails;
export const GlobalCustomerRefreshTrigger = (state) =>
state.addCustomer?.refreshTrigger;
export default addCustomer.reducer;

21
src/Features/BookingScreen/EwayBill/ListOfInvoices.js Normal file
View File

@ -0,0 +1,21 @@
import axios from 'axios';
import { createAsyncThunk } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../../AuthenicationToken/AuthenticationToken';
export const getSalesInvoices = createAsyncThunk(
'ListOfInvoices/getSalesInvoices',
async (data) => {
if (
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined &&
data?.AppId != null &&
data?.AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/reprint?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}&orderFromDate=${data?.orderFromDate}&orderToDate=${data?.orderToDate}`
);
}
}
);

50
src/Features/BookingScreen/HoldOption/HoldOption.js Normal file
View File

@ -0,0 +1,50 @@
import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../../AuthenicationToken/AuthenticationToken';
export const gettinghold = createAsyncThunk('gettinghold', async (data) => {
if (
data?.AppId != null &&
data?.AppId != undefined &&
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined
) {
return await axiosRetailInstanceData.get(
`/hold?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}`
);
}
});
export const puttinghold = createAsyncThunk('puttinghold', async (putData) => {
return await axiosRetailInstanceData.put(`/hold`, putData);
});
const initialState = {
holddata: [],
};
const HoldOption = createSlice({
name: 'HoldOption',
initialState,
reducers: {
changeholddata: (state, action) => {
state.holddata = action?.payload;
},
},
extraReducers: (builder) => {
builder.addCase(gettinghold.fulfilled, (state, action) => {
if (action?.payload?.status) {
state.holddata = action?.payload?.data?.data;
} else {
state.holddata = [];
}
});
},
});
export const { changeholddata } = HoldOption.actions;
export const globalholddata = (state) => state?.HoldOption?.holddata;
export default HoldOption.reducer;

197
src/Features/BookingScreen/PreOrder/PreOrder.js Normal file
View File

@ -0,0 +1,197 @@
import { createSlice, createAsyncThunk } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../../AuthenicationToken/AuthenticationToken';
export const PreOrderBookingData = createAsyncThunk(
'PreOrder/PreOrderBookingData',
async (postData) => {
return await axiosRetailInstanceData.post(`/PreOrder`, postData);
}
);
export const PreOrderGet = createAsyncThunk(
'PreOrder/PreOrderBookingData',
async (data) => {
if (
data?.compId != null &&
data?.compId != undefined &&
data?.branchId != null &&
data?.branchId != undefined &&
data?.appId != null &&
data?.appId != undefined &&
data?.deliveryStatus != null &&
data?.deliveryStatus != undefined
) {
if (data?.toDate && data?.fromDate) {
return await axiosRetailInstanceData.get(
`/PreOrder?compId=${data?.compId}&branchId=${data?.branchId}&appId=${data?.appId}&deliveryStatus=${data?.deliveryStatus}&fromDate=${data?.fromDate}&toDate=${data?.toDate}`
);
} else {
return await axiosRetailInstanceData.get(
`/PreOrder?compId=${data?.compId}&branchId=${data?.branchId}&appId=${data?.appId}&deliveryStatus=${data?.deliveryStatus}`
);
}
}
}
);
export const PreOrderBookingDataCancel= createAsyncThunk(
'PreOrder/PreOrderBookingDataCancel',
async (Data) => {
return await axiosRetailInstanceData.post(`/PreOrderCancel`, Data);
}
);
export const PreOrderBookingDataPut = createAsyncThunk(
'PreOrder/PreOrderBookingDataPut',
async (putData) => {
return await axiosRetailInstanceData.put(`/PreOrder`, putData);
}
);
const initialState = {
preOrder: false,
PreOrderList: [],
PreOrderAdditem: null,
PreOrderCusName: null,
PreOrderCusMobNo: null,
PreOrderDate: null,
PreOrderTime: null,
PreOrderAdvance: 0,
PreOrderMessage: null,
PreOrderAdd1: null,
PreOrderAdd2: null,
PreOrderzip: null,
PreOrderCity: null,
PreOrderDistrict: null,
PreOrderState: null,
PreOrderReferenceMessage: null,
PreOrderSelectedPaymentOption: null,
PreOrderSelectedUPIOption: null,
PreOrderListedit: [],
PreOrderPendingCount: null,
};
const PreOrder = createSlice({
name: 'PreOrder',
initialState,
reducers: {
changepreOrder: (state, action) => {
state.preOrder = action?.payload;
},
changePreOrderMessage: (state, action) => {
state.PreOrderMessage = action?.payload;
},
changePreOrderAdd1: (state, action) => {
state.PreOrderAdd1 = action?.payload;
},
changePreOrderAdd2: (state, action) => {
state.PreOrderAdd2 = action?.payload;
},
changePreOrderzip: (state, action) => {
state.PreOrderzip = action?.payload;
},
changePreOrderCity: (state, action) => {
state.PreOrderCity = action?.payload;
},
changePreOrderDistrict: (state, action) => {
state.PreOrderDistrict = action?.payload;
},
changePreOrderState: (state, action) => {
state.PreOrderState = action?.payload;
},
changePreOrderReferenceMessage: (state, action) => {
state.PreOrderReferenceMessage = action?.payload;
},
changePreOrderSelectedPaymentOption: (state, action) => {
state.PreOrderSelectedPaymentOption = action?.payload;
},
changePreOrderSelectedUPIOptione: (state, action) => {
state.PreOrderSelectedUPIOption = action?.payload;
},
changepreOrderListedit: (state, action) => {
state.PreOrderListedit = action?.payload;
},
changePreOrderPendingCount: (state, action) => {
state.PreOrderPendingCount = action?.payload;
},
changePreOrderAdvance: (state, action) => {
state.PreOrderAdvance = action?.payload;
},
changePreOrderDate: (state, action) => {
state.PreOrderDate = action?.payload;
},
changePreOrderTime: (state, action) => {
state.PreOrderTime = action?.payload;
},
changePreOrderCusName: (state, action) => {
state.PreOrderCusName = action?.payload;
},
changePreOrderCusMob: (state, action) => {
state.PreOrderCusMobNo = action?.payload;
},
changePreOrderAdditem: (state, action) => {
state.PreOrderAdditem = action?.payload;
},
changepreOrderList: (state, action) => {
state.PreOrderList = action?.payload;
},
},
});
export const {
changepreOrder,
changepreOrderList,
changePreOrderAdditem,
changePreOrderCusName,
changePreOrderCusMob,
changePreOrderDate,
changePreOrderTime,
changePreOrderAdvance,
changePreOrderMessage,
changePreOrderAdd1,
changePreOrderAdd2,
changePreOrderzip,
changePreOrderCity,
changePreOrderDistrict,
changePreOrderState,
changePreOrderReferenceMessage,
changePreOrderSelectedPaymentOption,
changePreOrderSelectedUPIOptione,
changepreOrderListedit,
changePreOrderPendingCount,
} = PreOrder.actions;
export const GlobalpreOrderOpen = (state) => state?.PreOrder?.preOrder;
export const GlobalPreOrderMessage = (state) =>
state?.PreOrder?.PreOrderMessage;
export const GlobalPreOrderListedit = (state) =>
state?.PreOrder?.PreOrderListedit;
export const GlobalPreOrderPendingCount = (state) =>
state?.PreOrder?.PreOrderPendingCount;
export const GlobalPreOrderSelectedPaymentOption = (state) =>
state?.PreOrder?.PreOrderSelectedPaymentOption;
export const GlobaPreOrderSelectedUPIOptione = (state) =>
state?.PreOrder?.PreOrderSelectedUPIOption;
export const GlobalPreOrderReferenceMessage = (state) =>
state?.PreOrder?.PreOrderReferenceMessage;
export const GlobalPreOrderAdd1 = (state) => state?.PreOrder?.PreOrderAdd1;
export const GlobalPreOrderAdd2 = (state) => state?.PreOrder?.PreOrderAdd2;
export const GlobalPreOrderzip = (state) => state?.PreOrder?.PreOrderzip;
export const GlobalPreOrderCity = (state) => state?.PreOrder?.PreOrderCity;
export const GlobalPreOrderDistrict = (state) =>
state?.PreOrder?.PreOrderDistrict;
export const GlobalPreOrderState = (state) => state?.PreOrder?.PreOrderState;
export const GlobalPreOrderAdvance = (state) =>
state?.PreOrder?.PreOrderAdvance;
export const GlobalPreOrderDate = (state) => state?.PreOrder?.PreOrderDate;
export const GlobalPreOrderTime = (state) => state?.PreOrder?.PreOrderTime;
export const GlobalPreOrderCusName = (state) =>
state?.PreOrder?.PreOrderCusName;
export const GlobalPreOrderCusMobNo = (state) =>
state?.PreOrder?.PreOrderCusMobNo;
export const GlobalPreOrderAdditem = (state) =>
state?.PreOrder?.PreOrderAdditem;
export const GlobalPreOrderList = (state) => state?.PreOrder?.PreOrderList;
export default PreOrder.reducer;

87
src/Features/BookingScreen/Pricing/Pricing.js Normal file
View File

@ -0,0 +1,87 @@
import { createSlice, createAsyncThunk } from '@reduxjs/toolkit';
import {
axiosRetailInstanceData,
axiosCommonInstanceData,
} from '../../AuthenicationToken/AuthenticationToken';
import { getSession } from '../../../Services/Others';
export const getccavenuePaymentDetails = createAsyncThunk(
'getccavenuePaymentDetails1',
async () => {
return await axiosCommonInstanceData.get(
`/ccavenuePaymentDetails?activeStatus=A`
);
}
);
export const getPaymentUpiDetails = createAsyncThunk(
'getPaymentUpiDeatils1',
async () => {
return await axiosCommonInstanceData.get(
`/paymentUpiDetails?activeStatus=A&type=I`
);
}
);
export const postInvoice = createAsyncThunk('postInvoice', async (postData) => {
return await axiosCommonInstanceData.post(`/userAppMap`, postData);
});
export const getPricingType = createAsyncThunk(
'getPricingType/getPricingType',
async (PricingId) => {
if (PricingId) {
return await axiosCommonInstanceData.get(
`/pricingType?PricingId=${PricingId}`
);
}
}
);
export const getUserDetails = createAsyncThunk(
'getUserDetail/getUserDetails',
async (UserId) => {
if (UserId) {
return await axiosCommonInstanceData.get(`/user?UserId=${UserId}`);
}
}
);
export const getPurchasedAppDetails = createAsyncThunk(
'getPurchasedAppDetails',
async ({ UserId, AppId }) => {
return await axiosCommonInstanceData.get(
`/UserAppMap?AppId=${AppId}&UserId=${UserId}`
);
}
);
export const CheckPaymentStatus = createAsyncThunk(
'SendPaymentLink/SendPaymentLink',
async (BookingId) => {
if (BookingId) {
return await axiosCommonInstanceData.get(
`/userAppMap?UniqueId=${BookingId}&PaymentStatus=S`
);
}
}
);
export const getPaymentValidation = createAsyncThunk(
'getPaymentValidation',
async (data) => {
const UserType = getSession('UserType');
if (UserType !== 'Super Admin' && UserType !== 'Super Admin User') {
return await axiosRetailInstanceData.get(
`/PaymentOptions?compId=${data?.CompId}&appId=${data?.AppId}&branchId=${data?.BranchId}`
);
}
}
);
const initialState = {};
const Pricing = createSlice({
name: 'BookingData',
initialState,
});
export default Pricing.reducer;

38
src/Features/BookingScreen/RetailBookingClose.js Normal file
View File

@ -0,0 +1,38 @@
import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
import {
axiosRetailInstanceData,
axiosCommonInstanceData,
} from '../AuthenicationToken/AuthenticationToken';
export const getRetailPaymentClosing = createAsyncThunk(
'RetailBookingClose/getRetailPaymentClosing',
async (data) => {
console.log(data, 'datadata');
if (
data?.AppId != null &&
data?.AppId != undefined &&
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined &&
data?.UserId != null &&
data?.UserId != undefined
) {
return await axiosRetailInstanceData.get(
`/BookingClosingBalance?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}&UserId=${data?.UserId}`
);
}
}
);
export const PostBookingClose = createAsyncThunk(
'RetailBookingClose/PostBookingClose',
async (postData) => {
return await axiosRetailInstanceData.post(`/BookingClose`, postData);
}
);
export const PutBookingClose = createAsyncThunk(
'RetailBookingClose/PutBookingClose',
async (putData) => {
return await axiosRetailInstanceData.put(`/BookingClose`, putData);
}
);

275
src/Features/BrachLogin/BranchLogin.js Normal file
View File

@ -0,0 +1,275 @@
import axios from 'axios';
import { createSlice, createAsyncThunk } from '@reduxjs/toolkit';
import {
axiosRetailInstanceData,
axiosCommonInstanceData,
} from '../AuthenicationToken/AuthenticationToken';
import { getSession } from '../../Services/Others';
const apiCommonUrl = import.meta.env.ENV_API_URL_COMMON;
export const GenerateLogout = createAsyncThunk(
'signInPage/GenerateLogout',
async ({ UserId, status }) => {
if (UserId) {
return await axiosCommonInstanceData.put(`/Logout`, {
UserId: UserId,
Generate: status,
RequestMode: 'DW',
});
}
}
);
export const checkSession = createAsyncThunk(
'signInPage/checkSession',
async ({ UserId, sessionId }) => {
if (UserId) {
return await axiosCommonInstanceData.get(
`/UserSessionId?UserId=${UserId}&sessionId=${sessionId}`
);
}
}
);
export const PublicQrCodepost = createAsyncThunk(
'BranchLogin/PublicQrCodepost',
async (postData) => {
return await axiosCommonInstanceData.get(
`/URLshortener?referenceNo=${postData}`
);
}
);
export const getCompBranchData = createAsyncThunk(
'BranchData/getBranchData',
async ({ CompId, AppId, UserId }) => {
if (
UserId != null &&
UserId != undefined &&
AppId != null &&
AppId != undefined &&
CompId != null &&
CompId != undefined
) {
return await axiosCommonInstanceData.get(
`/Branch?UserId=${UserId}&AppId=${AppId}&CompId=${CompId}`
);
} else if (
CompId != null &&
CompId != undefined &&
AppId != null &&
AppId != undefined
) {
return await axiosCommonInstanceData.get(
`/Branch?CompId=${CompId}&AppId=${AppId}`
);
}
}
);
export const getBranchDetail = createAsyncThunk(
'BranchData/getBranchDetail',
async (data) => {
if (data?.BrId != null && data?.BrId != undefined) {
return await axiosCommonInstanceData.get(`/Branch?BrId=${data?.BrId}`);
}
}
);
export const getAllBranchDetail = createAsyncThunk(
'BranchData/getAllBranchDetail',
async (data) => {
if (data?.AppId != null && data?.AppId != undefined) {
return await axiosCommonInstanceData.get(`/Branch?appId=${data?.AppId}`);
}
}
);
export const getEmpAccesData = createAsyncThunk(
'EmpAccesData/getEmpAccesData',
async (data) => {
if (
data?.AppId != null &&
data?.AppId != undefined &&
data?.UserId != null &&
data?.UserId != undefined &&
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined
) {
return await axiosRetailInstanceData.get(
`/EmpAccess?empId=${data?.UserId}&AppId=${data?.AppId}&CompId=${data?.CompId}&branchId=${data?.BranchId}`
);
}
}
);
export const PricingAppPricingName = createAsyncThunk(
'BranchData/PricingAppPricingName',
async (data) => {
if (
data?.appId != null &&
data?.appId != undefined &&
data?.compId != null &&
data?.compId != undefined &&
data?.branchId != null &&
data?.branchId != undefined
) {
return await axios.get(
`${apiCommonUrl}/PricingAppFeatMap?appId=${data?.appId}&compId=${data?.compId}&branchId=${data?.branchId}`
);
} else if (
data?.appId != null &&
data?.appId != undefined &&
data?.userId != null &&
data?.userId != undefined
) {
return await axios.get(
`${apiCommonUrl}/PricingAppFeatMap?appId=${data?.appId}&userId=${data?.userId}`
);
}
}
);
export const getSAdminUserAccesData = createAsyncThunk(
'Sadmindata/getSAdminUserAccesData',
async (data) => {
if (
data?.AppId != null &&
data?.AppId != undefined &&
data?.UserId != null &&
data?.UserId != undefined
) {
return await axiosCommonInstanceData.get(
`/AppMenuAccess?UserId=${data?.UserId}&AppId=${data?.AppId}`
);
}
}
);
export const getApplicationDetails = createAsyncThunk(
'BranchData/getApplicationDetails',
async ({ AppId }) => {
if (AppId) {
return await axios.get(`${apiCommonUrl}/application?AppId=${AppId}`);
}
}
);
export const PostLoginSuser = createAsyncThunk(
'BranchData/PostLoginSuser',
async (postData) => {
return await axiosCommonInstanceData.post(
`/SuperAdminUserBranchSignIn`,
postData
);
}
);
export const PUTLoginuser = createAsyncThunk(
'BranchData/PostLoginSuser',
async (putData) => {
return await axiosCommonInstanceData.put(
`/SuperAdminUserBranchSignIn`,
putData
);
}
);
export const putSadminUserExit = createAsyncThunk(
'BranchData/putSadminUserExit',
async (putData) => {
return await axiosCommonInstanceData.put(
`/SuperAdminUserBranchSignInEmp`,
putData
);
}
);
export const getLoginuser = createAsyncThunk(
'BranchData/getLoginuser',
async (getdata) => {
return await axiosCommonInstanceData.get(
`/SuperAdminUserBranchSignIn?userId=${getdata.UserId}&sessionId=${getdata.sessionId}&branchId=${getdata.BranchId}`
);
}
);
export const getCommonAppPreference = createAsyncThunk(
'/getAppPreference',
async (AppId) => {
if (
AppId != null &&
AppId != undefined
){
return await axiosCommonInstanceData.get(
`/ApplicationPreferenceMapping?AppId=${AppId}`
);
}
}
);
const initialState = {
SelectedBrachId: null,
CompBranchData: null,
SadminUserPin: [],
SadminUserData: [],
AppPreferences: [],
isWarehouse:false,
};
const BranchLogin = createSlice({
name: 'BranchLogin',
initialState,
reducers: {
changeSelectedBranchId: (state, action) => {
state.SelectedBrachId = action?.payload;
},
changeWarehouse:(state,action)=>{
state.isWarehouse=action?.payload
}
},
extraReducers: (builder) => {
builder.addCase(getCompBranchData.fulfilled, (state, action) => {
if (action?.payload?.status) {
state.CompBranchData = action?.payload?.data?.data;
}
});
builder.addCase(checkSession.fulfilled, (state, action) => {
if (action?.payload?.status) {
if (action?.payload?.data?.data?.length > 0) {
state.SadminUserPin = action?.payload?.data?.data?.filter(
(item) =>
item?.AppId == getSession('AppId') &&
item?.CompId == getSession('CompId') &&
item?.BranchId == getSession('BranchId')
);
state.SadminUserData = action?.payload?.data?.data;
} else {
state.SadminUserPin = [];
}
}
});
builder.addCase(getCommonAppPreference.fulfilled, (state, action) => {
if (action?.payload?.status === 200) {
const { data: result } = action?.payload;
if (result?.data?.length > 0) {
state.AppPreferences = result?.data?.[0]?.PreferenceDetails;
} else {
state.AppPreferences = [];
}
}
});
},
});
export const { changeSelectedBranchId ,changeWarehouse} = BranchLogin.actions;
export const GlobalSelectedBranchId = (state) =>
state?.BranchLogin?.SelectedBrachId;
export const GlobalCompBranchData = (state) =>
state?.BranchLogin?.CompBranchData;
export const GLobalSadminUserPin = (state) => state?.BranchLogin?.SadminUserPin;
export const GLobalSadminUserData = (state) =>
state?.BranchLogin?.SadminUserData;
export const ApplicationPreferences = (state) =>
state?.BranchLogin?.AppPreferences;
export const globalBranchType = (state) =>
state?.BranchLogin?.isWarehouse;
export default BranchLogin.reducer;

116
src/Features/CancelReschedule/CancelApplicableProd.js Normal file
View File

@ -0,0 +1,116 @@
import { createAsyncThunk } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../AuthenicationToken/AuthenticationToken';
export const getProdListBasedOnCat = createAsyncThunk(
'CancelApplicableProd/getProdListBasedOnCat',
async (data) => {
if (
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined &&
data?.AppId != null &&
data?.AppId != undefined &&
data?.ProdCat != null &&
data?.ProdCat != undefined &&
data?.type != null &&
data?.type != undefined
) {
return await axiosRetailInstanceData.get(
`/productCardList?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}&ProdCat=${data?.ProdCat}&Type=${data?.type}`
);
}
}
);
export const putCancelAppProd = createAsyncThunk(
'CancelApplicableProd/putCancelAppProd',
async (putData) => {
return await axiosRetailInstanceData.put(
`/CancelApplicableProducts`,
putData
);
}
);
export const getSalesReturn = createAsyncThunk(
'CancelApplicableProd/getProdListBasedOnCat',
async (data) => {
const { CompId, BranchId, AppId } = data;
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/SalesReturn?appId=${AppId}&compId=${CompId}&branchId=${BranchId}`
);
}
}
);
export const getRescheduledSlot = createAsyncThunk(
'RescheduledSlot/getRescheduledSlot',
async (data) => {
const { CompId, BranchId, AppId } = data;
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/Sales/RescheduledSlotGet?appId=${AppId}&compId=${CompId}&branchId=${BranchId}`
);
}
}
);
export const postSalesReturn = createAsyncThunk(
'CancelApplicableProd/postSalesReturn',
async (postData) => {
return await axiosRetailInstanceData.post(
`/SalesReturn`,
postData
);
}
);
export const postRescheduleSlot = createAsyncThunk(
'RescheduleSlot/SlotReschedule',
async (postData) => {
return await axiosRetailInstanceData.post(
`/SlotReschedule`,
postData
);
}
);
export const getProductReturnPolicy = createAsyncThunk(
'CancelApplicableProd/getProductReturnPolicy',
async (data) => {
const { CompId, BranchId, AppId, SalesId } = data;
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined &&
SalesId != null &&
SalesId != undefined
) {
return await axiosRetailInstanceData.get(
`ReturnExchangePolicyMapping/Eligibility?appId=${AppId}&compId=${CompId}&branchId=${BranchId}&salesId=${SalesId}`
);
}
}
);

165
src/Features/ComboMaster/ComboMaster.js Normal file
View File

@ -0,0 +1,165 @@
import { createAsyncThunk } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../AuthenicationToken/AuthenticationToken';
export const productname = createAsyncThunk('productname', async (data) => {
if (
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined &&
data?.AppId != null &&
data?.AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/Offer/ProductDtl?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}`
);
}
});
export const getCombolist = createAsyncThunk('getCombo', async (data) => {
if (
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined &&
data?.AppId != null &&
data?.AppId != undefined &&
data?.ActiveStatus != null &&
data?.ActiveStatus != undefined
) {
return await axiosRetailInstanceData.get(
`/comboHdr?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}&ActiveStatus=${data?.ActiveStatus}`
);
} else {
return await axiosRetailInstanceData.get(
`/comboHdr?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}`
);
}
});
export const getCombo = createAsyncThunk('getCombo', async (data) => {
if (
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined &&
data?.AppId != null &&
data?.AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/comboHdr?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}&type=${data?.type}`
);
}
});
export const getComboProddata = createAsyncThunk('getCombo', async (data) => {
if (
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined &&
data?.AppId != null &&
data?.AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/comboHdr?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}&comboId=${data?.comboId}`
);
}
});
export const productqrqty = createAsyncThunk('productqrqty', async (data) => {
if (data?.ProdId != null && data?.ProdId != undefined) {
return await axiosRetailInstanceData.get(`/product?ProdId=${data?.ProdId}`);
}
});
export const postCombo = createAsyncThunk(
'postCombo/postCombo',
async (postData) => {
return await axiosRetailInstanceData.post(`/comboHdr`, postData);
}
);
export const putCombo = createAsyncThunk(
'putCombo/putCombo',
async (putData) => {
return await axiosRetailInstanceData.put(`/comboHdr`, putData);
}
);
export const deleteCombo = createAsyncThunk(
'deleteCombo/deleteCombo',
async (putData) => {
return await axiosRetailInstanceData.put(`/DeleteCombo`, putData);
}
);
export const getProdvaraiantdata = createAsyncThunk(
'product/getProdcataloguedata',
async (data) => {
if (
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined &&
data?.AppId != null &&
data?.AppId != undefined &&
data?.prodName != null &&
data?.prodName != undefined
) {
return await axiosRetailInstanceData.get(
`/ProductCardList?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId} &prodName=${encodeURIComponent(data?.prodName)}`
);
}
}
);
export const getPurProdvaraiantdata = createAsyncThunk(
'PurchaseOrder/getPurProdvaraiantdata',
async (data) => {
if (
data?.CompId !== null &&
data?.CompId !== undefined &&
data?.BranchId !== null &&
data?.BranchId !== undefined &&
data?.AppId !== null &&
data?.AppId !== undefined &&
data?.prodName !== null &&
data?.prodName !== undefined
) {
return await axiosRetailInstanceData.get(
`/ProductCardList?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}&prodName=${encodeURIComponent(data?.prodName)}`
);
}
}
);
export const getProdInwarddata = createAsyncThunk(
'getProdInwarddata',
async (data) => {
return await axiosRetailInstanceData.get(
`/InwardDtl?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}&prodId=${data?.prodId}`
);
}
);
export const putComboStockdel = createAsyncThunk(
'putComboStockdel/putComboStockdel',
async (putData) => {
return await axiosRetailInstanceData.put(`/ComboStock`, putData);
}
);
export const putComboPriceoffer = createAsyncThunk(
'putComboPriceoffer/putComboPriceoffer',
async (putData) => {
return await axiosRetailInstanceData.put(`/ComboHdr`, putData);
}
);
export const putComboName = createAsyncThunk(
'putComboName',
async (putData) => {
return await axiosRetailInstanceData.put(`/ComboNameChange`, putData);
}
);

146
src/Features/ConfigMasterPage/ConfigMasterPage.js Normal file
View File

@ -0,0 +1,146 @@
import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
import { axiosCommonInstanceData, axiosEmail_SMSData, axiosRetailInstanceData } from '../AuthenicationToken/AuthenticationToken';
export const getConfiguration = createAsyncThunk(
'configMaster/getConfiguration',
async ({ Type }) => {
if (Type != null && Type != undefined) {
return await axiosRetailInstanceData.get(`/configMaster?Type=${Type}`);
} else {
return await axiosRetailInstanceData.get(`/configMaster`);
}
}
);
export const getConfigTypeData = createAsyncThunk(
'configMaster/getConfigTypeData',
async ({ TypeName, AppId }) => {
if (
AppId != null &&
AppId != undefined &&
TypeName != null &&
TypeName != undefined
) {
return await axiosRetailInstanceData.get(
`/configMaster?TypeName=${TypeName}&AppId=${AppId}`
);
} else {
return await axiosRetailInstanceData.get(
`/configMaster?TypeName=${TypeName}`
);
}
}
);
export const getActiveConfigNames = createAsyncThunk(
'configMaster/getActiveConfigNames',
async () => {
return await axiosRetailInstanceData.get(`/configMaster?ActiveStatus=A`);
}
);
export const deleteConfiguration = createAsyncThunk(
'configMaster/deleteConfiguration',
async (deleteData) => {
return await axiosRetailInstanceData.delete(`/configMaster`, {
params: deleteData,
});
}
);
export const postConfiguration = createAsyncThunk(
'configMaster/postConfiguration',
async (postData) => {
return await axiosRetailInstanceData.post(`/configMaster`, postData);
}
);
export const PublicQrCodepost = createAsyncThunk(
'configMaster/PublicQrCodepost',
async (postData) => {
return await axiosCommonInstanceData.post(`/URLshortener`, postData);
}
);
export const PublicQrCodeget = createAsyncThunk(
'BranchLogin/PublicQrCodepost',
async (postData) => {
return await axiosCommonInstanceData.get(
`/URLshortener?referenceNo=${postData}`
);
}
);
export const putConfiguration = createAsyncThunk(
'configMaster/putConfiguration',
async (putData) => {
return await axiosRetailInstanceData.put(`/configMaster`, putData);
}
);
export const postBulkConfiguration = createAsyncThunk(
'configMaster/postBulkConfiguration',
async (postData) => {
return await axiosRetailInstanceData.post(
`/configMaster/BulkUpload`,
postData
);
}
);
export const SelfBookingEmailSendLink = createAsyncThunk(
'email/sendEmailLink',
async (EmailData) => {
const { toEmail, type, fileUrl} = EmailData;
const data = {
toEmail:toEmail,
Type: type,
fileUrl:fileUrl,
};
return await axiosEmail_SMSData.post('/SendUrlEmail', data);
}
);
//----------------------------------------------------------------------------------------------------------------------------------------------
export const postbulkconfigdata = createAsyncThunk(
'configMaster/postbulkconfigdata',
async (postData) => {
return await axiosRetailInstanceData.post(
`/configMaster/BulkUpload`,
postData
);
}
);
const initialState = {
configData: [],
ActiveConfigNames: [],
};
const configmaster = createSlice({
name: 'configmaster',
initialState,
extraReducers: (builder) => {
builder.addCase(getConfiguration.fulfilled, (state, action) => {
if (action?.payload?.status) {
state.configData = action?.payload?.data?.data;
} else {
state.configData = [];
}
});
builder.addCase(getActiveConfigNames.fulfilled, (state, action) => {
if (action?.payload?.status) {
state.ActiveConfigNames = action?.payload?.data?.data;
} else {
state.ActiveConfigNames = [];
}
});
},
});
export const configDataSelector = (state) => state.configmasterPage?.configData;
export const ActiveConfigNamesSelector = (state) =>
state.configmasterPage?.ActiveConfigNames;
export default configmaster.reducer;

77
src/Features/ConfigTypePage/ConfigTypePage.js Normal file
View File

@ -0,0 +1,77 @@
import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../AuthenicationToken/AuthenticationToken';
export const getConfigurationType = createAsyncThunk(
'configType/getConfigurationType',
async () => {
return await axiosRetailInstanceData.get(`/configType`);
}
);
export const postConfigurationType = createAsyncThunk(
'configType/postConfigurationType',
async (postData) => {
return await axiosRetailInstanceData.post(`/configType`, postData);
}
);
export const putConfigurationType = createAsyncThunk(
'configType/putConfigurationType',
async (putData) => {
return await axiosRetailInstanceData.put(`/configType`, putData);
}
);
export const deleteConfigTypeData = createAsyncThunk(
'configType/deleteConfigTypeData',
async (deleteData) => {
return await axiosRetailInstanceData.delete(`/configType`, {
params: deleteData,
});
}
);
export const getActiveConfigTypeNames = createAsyncThunk(
'configType/getActiveConfigTypeNames',
async ({ Type }) => {
if (Type != null && Type != undefined) {
return await axiosRetailInstanceData.get(`/configType?Type=${Type}`);
} else {
return await axiosRetailInstanceData.get(`/configType?ActiveStatus=A`);
}
}
);
const initialState = {
configTypeData: [],
configTypeActiveData: [],
};
const configTypeSlice = createSlice({
name: 'configType',
initialState,
extraReducers: (builder) => {
builder.addCase(getConfigurationType.fulfilled, (state, action) => {
if (action?.payload?.status) {
state.configTypeData = action?.payload?.data?.data;
} else {
state.configTypeData = [];
}
});
builder.addCase(getActiveConfigTypeNames.fulfilled, (state, action) => {
if (action?.payload?.status) {
state.configTypeActiveData = action?.payload?.data?.data;
} else {
state.configTypeActiveData = [];
}
});
},
});
export const configTypeDataSelector = (state) =>
state.configtypePage?.configTypeData;
export const configTypeActiveDataSelector = (state) =>
state.configtypePage?.configTypeActiveData;
export default configTypeSlice.reducer;

88
src/Features/CounterCategoryMap/CounterCategoryMap.js Normal file
View File

@ -0,0 +1,88 @@
import { createAsyncThunk } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../AuthenicationToken/AuthenticationToken';
export const getCategoryData = createAsyncThunk(
'CounterCategoryMap/getCategoryData',
async (data) => {
if (
data?.AppId != null &&
data?.AppId != undefined &&
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined
) {
return await axiosRetailInstanceData.get(
`/productCat?AppId=${data?.AppId}&CompId=${data?.CompId}&BranchId=${data?.BranchId}`
);
}
}
);
export const getSubCategoryData = createAsyncThunk(
'CounterCategoryMap/getSubCategoryData',
async (data) => {
if (
data?.AppId != null &&
data?.AppId != undefined &&
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined &&
data?.ProdCat != null &&
data?.ProdCat != undefined
) {
return await axiosRetailInstanceData.get(
`/productSubCat?AppId=${data?.AppId}&CompId=${data?.CompId}&BranchId=${data?.BranchId}&ProdCat=${data?.ProdCat}`
);
}
}
);
export const postCounterCategoryMap = createAsyncThunk(
'PurchaseOrder/postCounterCategoryMap',
async (postData) => {
return await axiosRetailInstanceData.post(`/CounterToken`, postData);
}
);
export const getCounterTokenData = createAsyncThunk(
'CounterCategoryMap/getSubCategoryData',
async (data) => {
if (
data?.AppId != null &&
data?.AppId != undefined &&
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined
) {
let endpoint = `/CounterToken?AppId=${data?.AppId}&CompId=${data?.CompId}&BranchId=${data?.BranchId}&UserId=${data?.UserId}`;
if (data?.ActiveStatus !== null && data?.ActiveStatus !== undefined) {
endpoint += `&ActiveStatus=${data?.ActiveStatus}`;
}
return await axiosRetailInstanceData.get(endpoint);
}
}
);
export const putCounterCategoryMap = createAsyncThunk(
'PurchaseOrder/putCounterCategoryMap',
async (putData) => {
return await axiosRetailInstanceData.put(`/CounterToken`, putData);
}
);
export const deleteCounterCategoryMap = createAsyncThunk(
'PurchaseOrder/deleteCounterCategoryMap',
async (deleteData) => {
if (
deleteData?.counterId != null &&
deleteData?.counterId != undefined &&
deleteData?.updatedBy != null &&
deleteData?.updatedBy != undefined &&
deleteData?.activeStatus != null &&
deleteData?.activeStatus != undefined
) {
return await axiosRetailInstanceData.put(`/DeleteToken`, deleteData);
}
}
);

59
src/Features/CustMaster/CustMaster.js Normal file
View File

@ -0,0 +1,59 @@
import { createAsyncThunk } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../AuthenicationToken/AuthenticationToken';
export const getUserData = createAsyncThunk(
'signInPage/getUserData',
async (data) => {
if (
data?.AppId != null &&
data?.AppId != undefined &&
data?.MobileNo != null &&
data?.MobileNo != undefined &&
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined
) {
return await axiosRetailInstanceData.get(
`/customer?MobileNo=${data?.MobileNo}&AppId=${data?.AppId}&CompId=${data?.CompId}&BranchId=${data?.BranchId}`
);
}
}
);
export const postCust = createAsyncThunk(
'postCust/postCust',
async (postData) => {
return await axiosRetailInstanceData.post(`/customer`, postData);
}
);
export const getCustBasedOnCmpIdBrIdAppId = createAsyncThunk(
'Cust/getCust',
async (data) => {
if (
data?.AppId != null &&
data?.AppId != undefined &&
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined
) {
return await axiosRetailInstanceData.get(
`/customer?AppId=${data?.AppId}&CompId=${data?.CompId}&BranchId=${data?.BranchId}`
);
}
}
);
export const delCust = createAsyncThunk('Cust/delcust', async (deleteData) => {
if (deleteData?.CustId && deleteData?.ActiveStatus && deleteData?.UpdatedBy) {
return await axiosRetailInstanceData.delete(
`/customer?CustId=${deleteData?.CustId}&ActiveStatus=${deleteData?.ActiveStatus}&UpdatedBy=${deleteData?.UpdatedBy}`
);
}
});
export const putCust = createAsyncThunk('putCust/putCust', async (putData) => {
return await axiosRetailInstanceData.put(`/customer`, putData);
});

21
src/Features/CustomerDisplay/CustomerDisplay.js Normal file
View File

@ -0,0 +1,21 @@
import axios from 'axios';
import { createAsyncThunk } from '@reduxjs/toolkit';
import { axiosCommonInstanceData } from '../AuthenicationToken/AuthenticationToken';
const apiCommonUrl = import.meta.env.ENV_API_URL_COMMON;
export const getCompanyData = createAsyncThunk(
'customerDisplay/getCompanyData',
async ({ CompId }) => {
if (CompId) {
return await axios.get(`${apiCommonUrl}/company?CompId=${CompId}`);
}
}
);
export const getAllApplications = createAsyncThunk(
'customerDisplay/getApplicationData',
async ({ AppId }) => {
if (AppId) {
return axios.get(`${apiCommonUrl}/application?AppId=${AppId}`);
}
}
);

102
src/Features/DeliveryChallan/DeliveryChallan.js Normal file
View File

@ -0,0 +1,102 @@
import { createAsyncThunk } from '@reduxjs/toolkit';
import {
axiosRetailInstanceData,
axiosCommonInstanceData,
} from '../AuthenicationToken/AuthenticationToken';
// export const AdminUserData = createAsyncThunk(
// 'PurQuota/AdminUserData',
// async () => {
// return await axiosCommonInstanceData.get(`/user?UserType=A`);
// }
// );
export const getDeliveryChallan = createAsyncThunk(
'DeliveryChallan/getDeliveryChallan',
async (ProdData) => {
if (
ProdData?.CompId !== null &&
ProdData?.CompId !== undefined &&
ProdData?.BranchId !== null &&
ProdData?.BranchId !== undefined &&
ProdData?.AppId !== null &&
ProdData?.AppId !== undefined
) {
return await axiosRetailInstanceData.get(
`/DeliveryChallan?compId=${ProdData?.CompId}&branchId=${ProdData?.BranchId}&appId=${ProdData?.AppId}`
);
}
}
);
export const getNonConvertedDeliveryChallans = createAsyncThunk(
'DeliveryChallan/getNonConvertedDeliveryChallan',
async (ProdData) => {
if (
ProdData?.CompId !== null &&
ProdData?.CompId !== undefined &&
ProdData?.BranchId !== null &&
ProdData?.BranchId !== undefined &&
ProdData?.AppId !== null &&
ProdData?.AppId !== undefined
) {
return await axiosRetailInstanceData.get(
`/DeliveryChallanConvert?compId=${ProdData?.CompId}&branchId=${ProdData?.BranchId}&appId=${ProdData?.AppId}`
);
}
}
);
export const postDeliveryToInvoice = createAsyncThunk(
'DeliveryChallan/DCtoInvoice',
async (data) => {
if (data) {
return await axiosRetailInstanceData.post(`/DCtoInvoice`, data);
}
}
);
export const getDeliveryToInvoice = createAsyncThunk(
'DeliveryChallan/DCtoInvoice',
async (ProdData) => {
if (
ProdData?.CompId !== null &&
ProdData?.CompId !== undefined &&
ProdData?.BranchId !== null &&
ProdData?.BranchId !== undefined &&
ProdData?.AppId !== null &&
ProdData?.AppId !== undefined
) {
return await axiosRetailInstanceData.get(
`/DCtoInvoice?compId=${ProdData?.CompId}&branchId=${ProdData?.BranchId}&appId=${ProdData?.AppId}`
);
}
}
);
// export const getProdQuoaVariantdata = createAsyncThunk(
// 'product/getProdcataloguedata',
// async (data) => {
// if (
// data?.CompId != null &&
// data?.CompId != undefined &&
// data?.BranchId != null &&
// data?.BranchId != undefined &&
// data?.AppId != null &&
// data?.AppId != undefined &&
// data?.prodName != null &&
// data?.prodName != undefined
// ) {
// return await axiosRetailInstanceData.get(
// `/ProductCardList?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}&prodName=${data?.prodName}`
// );
// }
// }
// );
export const PostChallan = createAsyncThunk(
'DeliveryChallan/PostChallan',
async (postData) => {
return await axiosRetailInstanceData.post(`/DeliveryChallan`, postData);
}
);

58
src/Features/Dinein/Dinein.js Normal file
View File

@ -0,0 +1,58 @@
import { createAsyncThunk } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../AuthenicationToken/AuthenticationToken';
export const getDineinType = createAsyncThunk(
'DineinForm/getDineinType',
async () => {
return await axiosRetailInstanceData.get(
`/configMaster?TypeName=Dine In Type`
);
}
);
export const getDineinTableData = createAsyncThunk(
'DineinTable/getDineinTableData',
async ({ CompId, BranchId, AppId }) => {
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/diningTable?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}`
);
}
}
);
export const editDineinTableData = createAsyncThunk(
'DineInTable/editDineinTableData',
async (putData) => {
return await axiosRetailInstanceData.put(`/diningTable`, putData);
}
);
export const postDineinTableData = createAsyncThunk(
'DineInTable/editDineinTableData',
async (postData) => {
return await axiosRetailInstanceData.post(`/diningTable`, postData);
}
);
export const DeleteDineinTableData = createAsyncThunk(
'DineInTable/editDineinTableData',
async (deleteData) => {
if (
deleteData?.TableId &&
deleteData?.ActiveStatus &&
deleteData?.UpdatedBy
) {
return await axiosRetailInstanceData.delete(
`/diningTable?TableId=${deleteData?.TableId}&ActiveStatus=${deleteData?.ActiveStatus}&UpdatedBy=${deleteData?.UpdatedBy}`
);
}
}
);

92
src/Features/EmpAccess/EmpAccess.js Normal file
View File

@ -0,0 +1,92 @@
import { createAsyncThunk } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../AuthenicationToken/AuthenticationToken';
export const getEmpAccessBasedOnCmpIdBrIdAppId = createAsyncThunk(
'Emp/getEmp',
async (data) => {
if (
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined &&
data?.AppId != null &&
data?.AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/empAccess?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}`
);
}
}
);
export const getMasterOptionList = createAsyncThunk(
'configMaster/getMasterOptionList',
async () => {
return await axiosRetailInstanceData.get(
`/configMaster?TypeName=Master Access`
);
}
);
export const getEmpListBasedOnCmpIdBrID = createAsyncThunk(
'Emp/getEmp',
async (data) => {
if (
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined &&
data?.AppId != null &&
data?.AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/employee?ActiveStatus=A&CompId=${data?.CompId}&BranchId=${data?.BranchId}&Type=A&AppId=${data?.AppId}`
);
}
}
);
export const getEmpListBasedOnCmpIdBrIDEdit = createAsyncThunk(
'Emp/getEmp',
async (data) => {
if (
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined
) {
return await axiosRetailInstanceData.get(
`/employee?ActiveStatus=A&CompId=${data?.CompId}&BranchId=${data?.BranchId}`
);
}
}
);
export const postEmpAccess = createAsyncThunk(
'postEmpAccess/postEmpAccess',
async (postData) => {
return await axiosRetailInstanceData.post(`/empAccess`, postData);
}
);
export const putEmpAccess = createAsyncThunk(
'putEmpAccess/putEmpAccess',
async (putData) => {
return await axiosRetailInstanceData.put(`/empAccess`, putData);
}
);
export const delEmpAccess = createAsyncThunk(
'Emp/delEmpAccess',
async (deleteData) => {
if (
deleteData?.UniqueId &&
deleteData?.ActiveStatus &&
deleteData?.UpdatedBy
) {
return await axiosRetailInstanceData.delete(
`/empAccess?UniqueId=${deleteData?.UniqueId}&ActiveStatus=${deleteData?.ActiveStatus}&UpdatedBy=${deleteData?.UpdatedBy}`
);
}
}
);

162
src/Features/EmpMaster/EmpMaster.js Normal file
View File

@ -0,0 +1,162 @@
import { createAsyncThunk } from '@reduxjs/toolkit';
import {
axiosRetailInstanceData,
axiosCommonInstanceData,
} from '../AuthenicationToken/AuthenticationToken';
export const getEmpBasedOnCmpId = createAsyncThunk(
'Emp/getEmp',
async (CompId) => {
if (CompId != null && CompId != undefined) {
return await axiosRetailInstanceData.get(`/employee?CompId=${CompId}`);
}
}
);
export const getEmpBasedOnCmpIdBrId = createAsyncThunk(
'Emp/getEmp',
async (data) => {
if (
data?.cmpId != null &&
data?.cmpId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined
) {
return await axiosRetailInstanceData.get(
`/employee?CompId=${data?.cmpId}&BranchId=${data?.BranchId}`
);
}
}
);
export const UserDataBasedOnBranchId = createAsyncThunk(
'Emp/UserData',
async (data) => {
if (
data?.Type == 'E' &&
data?.BranchId != null &&
data?.BranchId != undefined
) {
return await axiosCommonInstanceData.get(
`/login?BranchId=${data?.BranchId}&Type=E`
);
} else if (data?.BranchId != null && data?.BranchId != undefined) {
return await axiosCommonInstanceData.get(
`/login?BranchId=${data?.BranchId}&Type=EE`
);
}
}
);
export const EmpTypeDropDown = createAsyncThunk(
'Emp/EmpTypeDropDown',
async () => {
return await axiosRetailInstanceData.get(
`/configMaster?TypeName=Employee Type`
);
}
);
export const EmpDesgDropDown = createAsyncThunk(
'Emp/EmpDesgDropDown',
async ({ AppId }) => {
if (AppId != null && AppId != undefined) {
return await axiosRetailInstanceData.get(
`/configMaster?TypeName=Designation&AppId=${AppId}`
);
}
}
);
export const EmpDepartMentDropDown = createAsyncThunk(
'Emp/EmpDesgDropDown',
async () => {
return await axiosRetailInstanceData.get(
`/configMaster?TypeName=Department`
);
}
);
export const GettingShiftData = createAsyncThunk(
'Shift/GettingShiftData',
async (CompId) => {
if (CompId != null && CompId != undefined) {
return await axiosRetailInstanceData.get(`/shift?CompId=${CompId}`);
}
}
);
export const getBranchDataBasedonCmpAppId = createAsyncThunk(
'Emp/BranchData',
async (data) => {
if (
data?.AppId != null &&
data?.AppId != undefined &&
data?.cmpId != null &&
data?.cmpId != undefined
) {
return await axiosCommonInstanceData.get(
`/appAccess?AppId=${data?.AppId}&CompId=${data?.cmpId}`
);
}
}
);
export const delEmp = createAsyncThunk('Emp/delEmp', async (deleteData) => {
if (
deleteData?.UniqueId &&
deleteData?.ActiveStatus &&
deleteData?.UpdatedBy
) {
return await axiosRetailInstanceData.delete(
`/employee?UniqueId=${deleteData?.UniqueId}&ActiveStatus=${deleteData?.ActiveStatus}&UpdatedBy=${deleteData?.UpdatedBy}`
);
}
});
export const postEmpCommOrIncen = createAsyncThunk('commOrIncen/postEmpCommOrIncen', async (postData) => {
return await axiosRetailInstanceData.post(`/EmployeeIncentive`, postData);
});
export const putEmpCommOrIncen = createAsyncThunk('commOrIncen/putEmpCommOrIncen', async (putData) => {
return await axiosRetailInstanceData.put(`/EmployeeIncentive`, putData);
});
export const getEmpCommOrIncentive = createAsyncThunk('commOrIncen/getEmpCommOrIncentive', async (data) => {
const { AppId, CompId, BranchId, UserRole } = data
if (AppId !== null && AppId !== undefined && CompId !== null && CompId !== undefined && BranchId !== null && BranchId !== undefined && UserRole !== null && UserRole !== undefined) {
return await axiosRetailInstanceData.get(`/EmployeeIncentive?AppId=${AppId}&CompId=${CompId}&BranchId=${BranchId}&UserRole=${UserRole}`);
}
});
export const deleteCommOrIncentive = createAsyncThunk('commOrIncen/deleteCommOrIncentive', async (deleteData) => {
const { IncentiveId, UpdatedBy, ActiveStatus, UserRole } = deleteData;
if (IncentiveId && UpdatedBy && ActiveStatus && UserRole) {
return await axiosRetailInstanceData.delete(
`/EmployeeIncentive?incentiveId=${IncentiveId}&activeStatus=${ActiveStatus}&UpdatedBy=${UpdatedBy}&UserRole=${UserRole}`
);
}
});
export const postEmp = createAsyncThunk('postEmp/postEmp', async (postData) => {
return await axiosRetailInstanceData.post(`/employee`, postData);
});
export const putEmp = createAsyncThunk('putEmp/putEmp', async (putData) => {
return await axiosRetailInstanceData.put(`/employee`, putData);
});
export const checkTrialCompany = createAsyncThunk(
'userAppMap/checkTrialCompany',
async (getTrialCompany) => {
if (
getTrialCompany.AppId != null &&
getTrialCompany.AppId != undefined &&
getTrialCompany.UserId != null &&
getTrialCompany.UserId != undefined
) {
return await axiosCommonInstanceData.get(
`/userAppMap?AppId=${getTrialCompany.AppId}&UserId=${getTrialCompany.UserId}`
);
}
}
);

26
src/Features/EmpRelieve/EmpRelieve.js Normal file
View File

@ -0,0 +1,26 @@
import { createAsyncThunk } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../AuthenicationToken/AuthenticationToken';
export const getEmpRelieve = createAsyncThunk('Emp/getEmpRelieve', async ({CompId,UserId,AppId,BranchId}) => {
if (CompId != null && CompId != undefined && UserId != null && UserId != undefined && AppId != null && AppId != undefined && BranchId != null && BranchId != undefined) {
return await axiosRetailInstanceData.get(`/EmployeeRelieveInfo?appId=${AppId}&compId=${CompId}&branchId=${BranchId}&userId=${UserId}`);
}
}
);
export const deleteEmpRelieve = createAsyncThunk('Emp/getEmpRelieve', async ({uniqueId,updatedBy,activeStatus}) => {
if (uniqueId != null && uniqueId != undefined && updatedBy != null && updatedBy != undefined && activeStatus != null && activeStatus != undefined ) {
return await axiosRetailInstanceData.delete(`/EmployeeRelieveInfo?uniqueId=${uniqueId}&updatedBy=${updatedBy}&activeStatus=${activeStatus}`);
}
}
);
export const postEmpRelieve = createAsyncThunk('Emp/postEmpRelieve', async (postData) => {
return await axiosRetailInstanceData.post(`/EmployeeRelieveInfo`,postData);
}
);
export const putEmpRelieve = createAsyncThunk('Emp/putEmpRelieve', async (putData) => {
return await axiosRetailInstanceData.put(`/EmployeeRelieveInfo`,putData);
}
);

67
src/Features/EmpScreenRights/EmpScreenRights.js Normal file
View File

@ -0,0 +1,67 @@
import { createAsyncThunk } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../AuthenicationToken/AuthenticationToken';
export const getWholeSaleScreenType = createAsyncThunk(
'BookingData/getWholeSaleScreenType',
async ({ TypeName }) => {
if (TypeName != null && TypeName != undefined) {
return await axiosRetailInstanceData.get(
`/configMaster?TypeName=${TypeName}`
);
}
}
);
export const postEmpScreenAccess = createAsyncThunk(
'postEmpAccess/postEmpScreenAccess',
async (postData) => {
return await axiosRetailInstanceData.post(
`/WholeSaleScreenRights`,
postData
);
}
);
export const putEmpScreenAccess = createAsyncThunk(
'postEmpAccess/putEmpScreenAccess',
async (putData) => {
return await axiosRetailInstanceData.put(`/WholeSaleScreenRights`, putData);
}
);
export const getEmpScreenRights = createAsyncThunk(
'BookingData/getEmpScreenRights',
async (data) => {
if (
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined &&
data?.AppId != null &&
data?.AppId != undefined &&
data?.UserType != null &&
data?.UserType != undefined
) {
return await axiosRetailInstanceData.get(
`/WholeSaleScreenRights?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}&UserType=${data?.UserType}`
);
}
}
);
export const EmpgetEmpScreenRights = createAsyncThunk(
'BookingData/getEmpScreenRights',
async (data) => {
if (
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined &&
data?.AppId != null &&
data?.AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/WholeSaleScreenRights?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}&UserType=${data?.UserType}&EmpId=${data?.EmpId}`
);
}
}
);

22
src/Features/EmployeeSettlement/EmployeeSettlement.js Normal file
View File

@ -0,0 +1,22 @@
import { createAsyncThunk } from "@reduxjs/toolkit";
import { axiosRetailInstanceData } from "../AuthenicationToken/AuthenticationToken";
export const getEmployeeSettlementList = createAsyncThunk("getEmployeeSettlementList", async (data) => {
return await axiosRetailInstanceData.get(`/IncentiveSettlement?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}`);
})
export const getEmployeeSettlementListindIvidually = createAsyncThunk("getEmployeeSettlementListindIvidually", async (data) => {
return await axiosRetailInstanceData.get(`/IncentiveSettlement?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}&employeeId=${data?.employeeId}`);
})
// export const getAllTipAmountSettlementList = createAsyncThunk("getAllTipAmountSettlementList", async (data) => {
// return await axiosRetailInstanceData.get(`/TipsSettlement?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}&fromDate=${data?.fromDate}&toDate=${data?.toDate}`);
// })
export const postEmployeeSettle = createAsyncThunk('postEmployeeSettle', async (postData) => {
return await axiosRetailInstanceData.post(`/IncentiveSettlement`, postData);
});
// http://192.168.1.37:8012/IncentiveSettlement?request.compId=77&request.branchId=127&request.appId=1

37
src/Features/ExcelUploadPage/ExcelUploadPage.js Normal file
View File

@ -0,0 +1,37 @@
import { createSlice } from '@reduxjs/toolkit';
const initialState = {
excelFile: null,
excelFileError: null,
excelData: null,
fileInputRef: ' ',
};
const excelupload = createSlice({
name: 'excelupload',
initialState,
reducers: {
emptyExcelData: (state, action) => {
state.excelFile = null;
state.excelFileError = null;
state.excelData = null;
state.fileInputRef = ' ';
},
uploadExcel: (state, action) => {
const { file, jsonData } = action?.payload;
state.excelFile = file;
state.excelData = jsonData;
},
},
});
export const { emptyExcelData, uploadExcel } = excelupload.actions;
export const excelDataSelector = (state) => state.exceluploadPage.excelData;
export const excelFileSelector = (state) => state.exceluploadPage.excelFile;
export const excelFileErrorSelector = (state) =>
state.exceluploadPage.excelFileError;
export const fileInputRefSelector = (state) =>
state.exceluploadPage.fileInputRef;
export default excelupload.reducer;

85
src/Features/ExchangeAndReplace/ExchangeAndReplace.js Normal file
View File

@ -0,0 +1,85 @@
import { createAsyncThunk } from "@reduxjs/toolkit";
import {
axiosRetailInstanceData,
axiosCommonInstanceData,
} from '../AuthenicationToken/AuthenticationToken';
export const postExchangeAndReplace = createAsyncThunk("ExchangeAndReplace/postExchangeAndReplace", async (postData) => {
return await axiosRetailInstanceData.post(`/ReturnExchangePolicy`, postData);
})
export const putExchangeAndReplace = createAsyncThunk("ExchangeAndReplace/putExchangeAndReplace", async (postData) => {
return await axiosRetailInstanceData.put(`/ReturnExchangePolicy`, postData);
})
export const GetExchangeAndReplace = createAsyncThunk(
'GetExchangeAndReplace',
async ({ CompId, AppId, BranchId }) => {
if (CompId != null && CompId != undefined) {
return await axiosRetailInstanceData.get(`/ReturnExchangePolicy?appId=${AppId}&compId=${CompId}&branchId=${BranchId}&activeStatus=A`);
}
}
);
export const GetReturnPolicyMappingProducts = createAsyncThunk(
'GetExchangeAndReplace',
async ({ CompId, AppId, BranchId ,PolicyId}) => {
if (CompId != null && CompId != undefined && PolicyId != null && PolicyId != undefined) {
return await axiosRetailInstanceData.get(`/ReturnExchangePolicyMapping/Products?appId=${AppId}&compId=${CompId}&branchId=${BranchId}&policyId=${PolicyId}&activeStatus=A`);
}
}
);
export const postReturnPolicyMappingProducts = createAsyncThunk("PostReturnExchangePolicy", async (postData) => {
return await axiosRetailInstanceData.post(`/ReturnExchangePolicyMapping`, postData);
})
export const GetReturnPolicyMappingProduct = createAsyncThunk(
'GetExchangeAndReplace',
async ({ CompId, AppId, BranchId }) => {
if (CompId != null && CompId != undefined ) {
return await axiosRetailInstanceData.get(`/ReturnExchangePolicyMapping?appId=${AppId}&compId=${CompId}&branchId=${BranchId}`);
}
}
);
export const deleteExchangePolicyProductOverAll = createAsyncThunk(
'ReturnExchangePolicyMapping',
async ({ PolicyId, ActiveStatus, UpdatedBy }) => {
if (PolicyId && ActiveStatus && UpdatedBy) {
return await axiosRetailInstanceData.delete(
`/ReturnExchangePolicyMapping/OverallDelete?policyId=${PolicyId}&activeStatus=${ActiveStatus}&updatedBy=${UpdatedBy}`
);
}
}
);
export const PutExchangeMapping = createAsyncThunk('PutExchangeMapping', async (putData) => {
return await axiosRetailInstanceData.put(`/ReturnExchangePolicyMapping`, putData);
});
export const deleteReturnMappingProduct = createAsyncThunk(
'deleteReturnMappingProduct',
async ({ UniqueId, ActiveStatus, UpdatedBy }) => {
if (UniqueId && ActiveStatus && UpdatedBy) {
return await axiosRetailInstanceData.delete(
`/ReturnExchangePolicyMapping?uniqueId=${UniqueId}&activeStatus=${ActiveStatus}&updatedBy=${UpdatedBy}`
);
}
}
);
export const delExchangeAndReplace = createAsyncThunk('ExchangeAndReplace/delExchangeAndReplace', async (deleteData) => {
if (
deleteData?.policyId &&
deleteData?.ActiveStatus &&
deleteData?.UpdatedBy
) {
return await axiosRetailInstanceData.delete(
`/ReturnExchangePolicy?policyId=${deleteData?.policyId}&ActiveStatus=${deleteData?.ActiveStatus}&UpdatedBy=${deleteData?.UpdatedBy}`
);
}
});

73
src/Features/ExteraCharges/ExtraCharges.js Normal file
View File

@ -0,0 +1,73 @@
import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../AuthenicationToken/AuthenticationToken';
export const getExtTabledata = createAsyncThunk(
'ExtraCharges/ getExtTabledata',
async (data) => {
if (
data?.AppId != null &&
data?.AppId != undefined &&
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined
) {
return await axiosRetailInstanceData.get(
`/extraCharges?AppId=${data?.AppId}&CompId=${data?.CompId}&BranchId=${data?.BranchId}`
);
}
}
);
export const putExtTabledata = createAsyncThunk(
'ExtraCharges/ putExtTabledata',
async (putData) => {
return await axiosRetailInstanceData.put(`/extraCharges`, putData);
}
);
export const postExtTabledata = createAsyncThunk(
'ExtraCharges/ postExtTabledata',
async (postData) => {
return await axiosRetailInstanceData.post(`/extraCharges`, postData);
}
);
export const deleteExtTabledata = createAsyncThunk(
'ExtraCharges/ deleteExtTabledata',
async (data) => {
if (data?.UpdatedBy && data?.UniqueId && data?.ActiveStatus) {
return await axiosRetailInstanceData.delete(
`/extraCharges?UpdatedBy=${data?.UpdatedBy}&UniqueId=${data?.UniqueId}&ActiveStatus=${data?.ActiveStatus}`
);
}
}
);
const initialState = {
ExtraChargesType: [],
ExtraChargesPrice: [],
TotalAmount: [],
};
const ExtraCharges = createSlice({
name: 'ExtraCharges',
initialState,
reducers: {
ChangeTotalAmount: (state, action) => {
state.TotalAmount = action?.payload;
},
},
extraReducers: (builder) => {
builder.addCase(getExtTabledata.fulfilled, (state, action) => {
if (action?.payload?.status) {
state.ExtraChargesType = action?.payload?.data?.data;
}
});
},
});
export const { ChangeTotalAmount } = ExtraCharges.actions;
export const globalExtraChargesType = (state) =>
state?.ExtraCharges?.ExtraChargesType;
export const globalExtraTotalAmount = (state) =>
state?.ExtraCharges?.TotalAmount;
export default ExtraCharges.reducer;

151
src/Features/FreeProducts&Purchase/FreeProducts&Purchase.js Normal file
View File

@ -0,0 +1,151 @@
import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../AuthenicationToken/AuthenticationToken';
//Product
export const getFreeProductTabledata = createAsyncThunk(
'FreeProduct/ getFreeProductTabledata',
async (data) => {
const { appId, compId, branchId } = data;
if (
appId != undefined &&
compId != undefined &&
branchId != undefined &&
appId != null &&
compId != null &&
branchId != null
) {
return await axiosRetailInstanceData.get(
`/FreeProduct?appId=${appId}&compId=${compId}&branchId=${branchId}`
);
}
}
);
export const putFreeProductTabledata = createAsyncThunk(
'FreeProduct/ putFreeProductTabledata',
async (putData) => {
return await axiosRetailInstanceData.put(`/FreeProduct`, putData);
}
);
export const postFreeProductTabledata = createAsyncThunk(
'FreeProduct/ postFreeProductTabledata',
async (postData) => {
return await axiosRetailInstanceData.post(`/FreeProduct`, postData);
}
);
export const deleteFreeProductTabledata = createAsyncThunk(
'FreeProduct/ deleteFreeProductTabledata',
async (data) => {
const { prodId, updatedBy, activeStatus } = data;
if (
prodId != undefined &&
updatedBy != undefined &&
activeStatus != undefined &&
prodId != null &&
updatedBy != null &&
activeStatus != null
) {
return await axiosRetailInstanceData.delete(
`/FreeProduct?prodId=${prodId}&updatedBy=${updatedBy}&activeStatus=${activeStatus}`
);
}
}
);
//purchse order
export const getPurchseOrderTabledata = createAsyncThunk(
'FreeProduct/ getPurchseOrderTabledata',
async (data) => {
if (
data?.CompId !== null &&
data?.CompId !== undefined &&
data?.BranchId !== null &&
data?.BranchId !== undefined &&
data?.AppId !== null &&
data?.AppId !== undefined
) {
return await axiosRetailInstanceData.get(
`/FreeProductPurchaseOrder?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}`
);
}
}
);
export const postPurchseOrderTabledata = createAsyncThunk(
'FreeProduct/ postPurchseOrderTabledata',
async (postData) => {
return await axiosRetailInstanceData.post(
`/FreeProductPurchaseOrder`,
postData
);
}
);
//purchse entry
export const getPurchseEntryTabledata = createAsyncThunk(
'FreeProduct/ getPurchseEntryTabledata',
async (ProdData) => {
if (
ProdData?.CompId != null &&
ProdData?.CompId != undefined &&
ProdData?.BranchId != null &&
ProdData?.BranchId != undefined &&
ProdData?.AppId != null &&
ProdData?.AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/FreeProductPurchaseEntry?compId=${ProdData?.CompId}&branchId=${ProdData?.BranchId}&appId=${ProdData?.AppId}`
);
}
}
);
export const postPurchseEntryTabledata = createAsyncThunk(
'FreeProduct/ postPurchseEntryTabledata',
async (postData) => {
return await axiosRetailInstanceData.post(
`/FreeProductPurchaseEntry`,
postData
);
}
);
//purchse return
export const getFreePurchseReturndata = createAsyncThunk(
'FreeProduct/ getFreePurchseReturndata',
async (data) => {
if (
data?.CompId != null &&
data?.CompId != undefined &&
data?.BranchId != null &&
data?.BranchId != undefined &&
data?.AppId != null &&
data?.AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/FreeProductPurchaseReturn?CompId=${data?.CompId}&BranchId=${data?.BranchId}&AppId=${data?.AppId}`
);
}
}
);
export const postFreePurchseReturndata = createAsyncThunk(
'FreeProduct/ postFreePurchseReturndata',
async (postData) => {
return await axiosRetailInstanceData.post(
`/FreeProductPurchaseReturn`,
postData
);
}
);
const initialState = {};
const FreeProucts_Purchase = createSlice({
name: 'FreeProucts_Purchase',
initialState,
reducers: {},
});
export const {} = FreeProucts_Purchase.actions;
export const global = (state) => state?.FreeProucts_Purchase?.jellasojoewaeawe;
export default FreeProucts_Purchase.reducer;

82
src/Features/GatewayMasterConfiguration/GatewayMasterConfiguration.js Normal file
View File

@ -0,0 +1,82 @@
import { createAsyncThunk } from "@reduxjs/toolkit";
import { axiosCommonInstanceData } from "../AuthenicationToken/AuthenticationToken";
export const getConfigNames = createAsyncThunk('configMaster/getConfigNames', async ({ TypeName }) => {
if (TypeName != null && TypeName != undefined) {
return await axiosCommonInstanceData.get(`/configMaster?TypeName=${TypeName}`);
}
})
export const postGateWayMaster = createAsyncThunk(
"GateWayMaster/postGateWayMaster",
async (data) => {
if (data) {
return await axiosCommonInstanceData.post(`/GatewayConfigMaster`, data);
}
}
);
export const putGateWayMaster = createAsyncThunk(
"GateWayMaster/putGateWayMaster",
async (data) => {
if (data) {
return await axiosCommonInstanceData.put(`/GatewayConfigMaster`, data);
}
}
);
export const deleteGateWayMaster = createAsyncThunk(
"GateWayMaster/GatewayConfigMaster",
async (Data) => {
if (
Data?.uniqueId != undefined &&
Data?.uniqueId != null &&
Data?.updatedBy != undefined &&
Data?.updatedBy != null &&
Data?.activeStatus != undefined &&
Data?.activeStatus != null
) {
return await axiosCommonInstanceData.delete(
`/GatewayConfigMaster?uniqueId=${Data?.uniqueId}&updatedBy=${Data?.updatedBy}&activeStatus=${Data?.activeStatus}`
);
}
}
);
// export const deleteGateWayMaster = createAsyncThunk(
// "GateWayMaster/GatewayConfigMaster",
// async (data) => {
// if (data) {
// return await axiosCommonInstanceData.delete(`/GatewayConfigMaster`, {
// headers: { "Content-Type": "application/json" }, // important
// data: {
// UniqueId: data.uniqueId,
// UpdatedBy: data.updatedBy,
// ActiveStatus: data.activeStatus,
// },
// });
// }
// }
// );
export const getGateWayConfigData = createAsyncThunk(
"GateWayMaster/getGateWayConfigData",
async (data) => {
const { serviceType, compId, branchId, appId } = data
if (
serviceType !== null &&
serviceType !== undefined &&
compId != null &&
compId != undefined &&
branchId != null &&
branchId != undefined &&
appId != null &&
appId != undefined) {
return await axiosCommonInstanceData.get(`/GatewayConfigMaster?compId=${compId}&branchId=${branchId}&appId=${appId}&ServiceType=${serviceType}`);
}
}
);

380
src/Features/Kiosk/check.js Normal file
View File

@ -0,0 +1,380 @@
import { createSlice, createAsyncThunk } from '@reduxjs/toolkit';
import axios from 'axios';
import {
axiosRetailInstanceData,
axiosCommonInstanceData,
} from '../../AuthenicationToken/AuthenticationToken';
import { getSession } from '../../../Services/Others';
import { getSelfBooking } from '../../TableBooking/TableBooking';
const Paymentdevice_POST_URL = import.meta.env.ENV_PAYMENT_DEVICE_URL;
const Paymentdevice_GET_URL = import.meta.env.ENV_PAYMENT_STATUS_GET_URL;
const apiCommonUrl = import.meta.env.ENV_API_URL_COMMON;
export const getProductCategories = createAsyncThunk(
'KioskBookingData/getLayoutCategories',
async ({ CompId, BranchId, AppId }) => {
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/productCat?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}`
);
}
}
);
export const getProductCardListKiosk = createAsyncThunk(
'KioskBookingData/getProductCardListKiosk',
async ({ CompId, BranchId, AppId, ProdCat }) => {
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined &&
ProdCat != null &&
ProdCat != undefined
) {
return await axiosRetailInstanceData.get(
`/ProductCardList?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&prodCat=${ProdCat}`
);
}
}
);
export const PostKioskBookingData = createAsyncThunk(
'BookingData/PostKioskBookingdata',
async (postData) => {
return await axiosRetailInstanceData.post(`/KioskBooking`, postData);
}
);
export const PutKioskBookingData = createAsyncThunk(
'BookingData/PutKioskBookingdata',
async (putData) => {
return await axiosRetailInstanceData.put(`/KioskBooking`, putData);
}
);
export const PutBookingPaymentStatusChange = createAsyncThunk(
'BookingData/PutBookingPaymentStatusChange',
async (putData) => {
return await axiosRetailInstanceData.put(`/BookingPaymentStatus`, putData);
}
);
// http://192.168.1.37:8001/ProductCardList?request.compId=1&request.branchId=1&request.appId=2&request.prodCat=224
export const getCompanyData = createAsyncThunk(
'appAccess/getCompanyData',
async ({ CompId }) => {
if (CompId != null && CompId != undefined) {
return await axios.get(`${apiCommonUrl}/company?CompId=${CompId}`);
}
}
);
export const getPaymentGatewayConfig = createAsyncThunk(
'getPaymentGatewayConfig',
async ({ CompId, AppId, BranchId }) => {
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined
) {
return await axiosCommonInstanceData.get(
`/PaymentGatewayConfig?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}`
);
}
}
);
export const getPaymentGatewayDetails = createAsyncThunk(
'getPaymentGatewayDetails',
async ({ CompId, AppId, BranchId, DetailType }) => {
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined
) {
return await axiosRetailInstanceData.get(
`/upi?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&detailType=${DetailType}`
);
}
}
);
export const getAllApplications = createAsyncThunk(
'application/getApplicationData',
async ({ AppId }) => {
if (AppId != null && AppId != undefined) {
return axios.get(`${apiCommonUrl}/application?AppId=${AppId}`);
}
}
);
export const getDeviceAccess = createAsyncThunk(
'agetDeviceAccess',
async ({ DeviceAddress }) => {
if (DeviceAddress != null && DeviceAddress != undefined) {
return axiosCommonInstanceData.get(
`/DeviceInfo?DeviceAddress=${DeviceAddress}`
);
}
}
);
export const getPaymentOptionsData = createAsyncThunk(
'getPaymentOptionsData',
({ AppId, CompId, BranchId }) => {
const UserType = getSession('UserType');
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined &&
UserType !== 'Super Admin' &&
UserType !== 'Super Admin User'
) {
return axiosRetailInstanceData.get(
`/paymentOptions?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}`
);
}
}
);
export const getPaymentDeviceAccessData = createAsyncThunk(
'getPaymentDeviceAccessData',
({ AppId, CompId, BranchId, UserId }) => {
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined &&
UserId != null &&
UserId != undefined
) {
return axiosRetailInstanceData.get(
`/PaymentDeviceAccess?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&UserId=${UserId}`
);
}
}
);
export const getPaymentGatewayAccessData = createAsyncThunk(
'getPaymentGatewayAccessData',
({ AppId, CompId, BranchId, ActiveStatus }) => {
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined
) {
return axiosCommonInstanceData.get(
`/PaymentGatewayConfig?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&ActiveStatus=${ActiveStatus}`
);
}
}
);
export const postPaymentDevice = createAsyncThunk(
'postPaymentDevice',
async (data, { rejectWithValue }) => {
try {
const response = await axios.post(`${Paymentdevice_POST_URL}`, data, {
headers: {
'Content-Type': 'application/json', // Set the Content-Type header
// Add any other headers here if needed
},
});
console.log('Response Data:', response?.data); // Log the response data
return response?.data;
} catch (error) {
console.error('Request Error:', error);
return rejectWithValue(error.response?.data || error.message);
}
}
);
export const getPaymentDeviceResponse = createAsyncThunk(
'getPaymentDeviceResponse',
async (data, { rejectWithValue }) => {
try {
const response = await axios.post(`${Paymentdevice_GET_URL}`, data, {
headers: {
'Content-Type': 'application/json', // Set the Content-Type header
},
});
console.log('Response Data:', response?.data); // Log the response data
return response?.data;
} catch (error) {
console.error('Request Error:', error);
return rejectWithValue(error.response?.data || error.message);
}
}
);
const initialState = {
BookingType: 'TakeAway',
ProdCat: null,
CategorieData: [],
ProductCardList: [],
KioskOrderDetails: [],
OrderbtnClicked: false,
OrderId: null,
SalesId: null,
KioskBookingTypeBoth: false,
PaymentgatewayRedirect: false,
PGFailedTransId: null,
PGFailedAmt: null,
MergeData: [], // Add merge data to global state
};
const KioskBookingData = createSlice({
name: 'KioskBookingData',
initialState,
reducers: {
changeProductCategorie: (state, action) => {
state.ProdCat = action?.payload;
},
changeBookingType: (state, action) => {
state.BookingType = action?.payload;
},
changeCategorieData: (state, action) => {
state.CategorieData = action?.payload;
},
changeProductCardListData: (state, action) => {
state.ProductCardList = action?.payload;
},
changePaymentgatewayRedirect: (state, action) => {
state.PaymentgatewayRedirect = action?.payload;
},
changeAllGlbStatustData: (state, action) => {
(state.BookingType = 'TakeAway'),
(state.KioskOrderDetails = []),
(state.OrderbtnClicked = false),
(state.OrderId = null),
(state.ProdCat = null),
state.CategorieData;
// cart clear
},
changeKioskOrderDetails: (state, action) => {
state.KioskOrderDetails = action?.payload;
const result =
action?.payload?.some(
(product) => product.BookingTypeName === 'TakeAway'
) &&
action?.payload?.some(
(product) => product.BookingTypeName === 'Dine In'
);
state.KioskBookingTypeBoth = result ? true : false;
},
changeOrderbtnClicked: (state, action) => {
state.OrderbtnClicked = action?.payload;
},
changeOrderId: (state, action) => {
state.OrderId = action?.payload;
},
changeSalesId: (state, action) => {
state.SalesId = action?.payload;
},
changePGFailedTransId: (state, action) => {
state.PGFailedTransId = action?.payload;
},
changePGFailedAmt: (state, action) => {
state.PGFailedAmt = action?.payload;
},
changeMergeData: (state, action) => {
state.MergeData = action?.payload;
},
},
extraReducers: (builder) => {
builder.addCase(getProductCategories.fulfilled, (state, action) => {
if (action?.payload?.data?.statusCode == 1) {
state.CategorieData = action?.payload?.data?.data;
state.ProdCat = action?.payload?.data?.data[0].ProdCat;
} else {
state.CategorieData = action?.payload?.data?.data;
state.ProdCat = null;
}
}),
builder.addCase(getProductCardListKiosk.fulfilled, (state, action) => {
if (action?.payload?.data?.statusCode == 1) {
state.ProductCardList = action?.payload?.data?.data;
} else {
state.ProductCardList = [];
}
});
builder.addCase(getSelfBooking.fulfilled, (state, action) => {
if (action?.payload?.data?.statusCode == 1) {
state.KioskOrderDetails =
action?.payload?.data?.data?.[0]?.productDetails?.map((item) => ({
...item,
disabled: true,
}));
state.OrderId = action?.payload?.data?.data?.[0]?.OrderId;
state.SalesId = action?.payload?.data?.data?.[0]?.SalesId;
} else {
state.KioskOrderDetails = [];
}
});
},
});
export const {
changeProductCategorie,
changeBookingType,
changeCategorieData,
changeProductCardListData,
changeAllGlbStatustData,
changeKioskOrderDetails,
changeOrderbtnClicked,
changeOrderId,
changePaymentgatewayRedirect,
changePGFailedTransId,
changePGFailedAmt,
changeSalesId,
changeMergeData,
} = KioskBookingData.actions;
export const GlobalBookingTypeKiosk = (state) =>
state?.KioskBookingData?.BookingType;
export const GlobalProductCategorieKiosk = (state) =>
state?.KioskBookingData?.ProdCat;
export const GlobalCategorieDataKiosk = (state) =>
state?.KioskBookingData?.CategorieData;
export const GlobalProductCardListKiosk = (state) =>
state?.KioskBookingData?.ProductCardList;
export const GlobalKioskOrderDetails = (state) =>
state?.KioskBookingData?.KioskOrderDetails;
export const GlobalOrderbtnClicked = (state) =>
state?.KioskBookingData?.OrderbtnClicked;
export const GlobalOrderId = (state) => state?.KioskBookingData?.OrderId;
export const GlobalSalesId = (state) => state?.KioskBookingData?.SalesId;
export const GlobalKioskBookingTypeBoth = (state) =>
state?.KioskBookingData?.KioskBookingTypeBoth;
export const GlobalPaymentgatewayRedirect = (state) =>
state?.KioskBookingData?.PaymentgatewayRedirect;
export const GlobalPGFailedTransId = (state) =>
state?.KioskBookingData?.PGFailedTransId;
export const GlobalPGFailedAmt = (state) =>
state?.KioskBookingData?.PGFailedAmt;
export const GlobalMergeData = (state) => state?.KioskBookingData?.MergeData;
export default KioskBookingData.reducer;

397
src/Features/Kiosk/kiosk.js Normal file
View File

@ -0,0 +1,397 @@
import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
import {
axiosRetailInstanceData,
axiosCommonInstanceData,
} from '../AuthenicationToken/AuthenticationToken';
import { getSession } from '../../Services/Others';
import dayjs from 'dayjs';
export const getKioskTemplate = createAsyncThunk(
'theme/getKioskTemplate',
async ({ CompId, BranchId, AppId }) => {
if (
CompId != null &&
CompId != undefined &&
BranchId != null &&
BranchId != undefined &&
AppId != null &&
AppId != undefined
) {
return axiosRetailInstanceData.get(
`/UIKioskTemplatePreference?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}`
);
}
}
);
export const getCustomisedDrpDwnData = createAsyncThunk(
'theme/getCustomisedDrpDwnData',
(data) => {
if (data != null && data != undefined) {
return axiosRetailInstanceData.get(
`/UIKioskComponent?sessionName=${data}&activeStatus=A`
);
}
}
);
export const getKioskSetup = createAsyncThunk('theme/getKioskSetup', (data) => {
if (
data?.compId != null &&
data?.compId != undefined &&
data?.branchId != null &&
data?.branchId != undefined &&
data?.appId != null &&
data?.appId != undefined
) {
return axiosRetailInstanceData.get(
`/UIKioskTemplatePreference?compId=${data?.compId}&branchId=${data?.branchId}&appId=${data?.appId}`
);
}
});
export const postKioskSetup = createAsyncThunk(
'theme/postKioskSetup',
(postData) => {
if (postData != null && postData != undefined) {
return axiosRetailInstanceData.post(
`/UIKioskTemplatePreference`,
postData
);
}
}
);
export const putKioskSetup = createAsyncThunk(
'theme/putKioskSetup',
(putData) => {
if (putData != null && putData != undefined) {
return axiosRetailInstanceData.put(`/UIKioskTemplatePreference`, putData);
}
}
);
export const getPaymentMethod = createAsyncThunk(
'theme/getPaymentMethod',
() => {
return axiosCommonInstanceData.get(`/ccavenuePaymentDetails`);
}
);
export const getKioskDatas = createAsyncThunk(
'KioskBooking/getKioskSetup',
async (data) => {
return await axiosRetailInstanceData.get(
`/KioskBooking?compId=${data?.CompId}&branchId=${data?.BranchId}&appId=${data?.AppId}&userId=${data?.UserId}&type=PC`
);
}
);
// 26/08/2024
export const getGatewayConfig = createAsyncThunk(
'PaymentOptions/getGatewayConfig',
async ({ CompId, AppId, BranchId }) => {
if (CompId && BranchId && AppId) {
return await axiosCommonInstanceData.get(
`/PaymentGatewayConfig?CompId=${CompId}&BranchId=${BranchId}&AppId=${AppId}&ActiveStatus=A`
);
}
}
);
export const getDeviceConfig = createAsyncThunk(
'PaymentOptions/getDeviceConfig',
async ({ CompId, AppId, BranchId, UserId }) => {
if (CompId && BranchId && AppId && UserId) {
return await axiosRetailInstanceData.get(
`/PaymentDeviceAccess?compId=${CompId}&branchId=${BranchId}&appId=${AppId}&userId=${UserId}`
);
}
}
);
export const PostBlockSlots = createAsyncThunk(
'BookingData/PostBlockSlots',
async (postData) => {
return await axiosRetailInstanceData.post(`/BlockSlot`, postData);
}
);
const initialState = {
currentKioskPageName:
getSession('kioskCurrentPage') || 'initialPage',
kioskTemplateData: [],
DarkColor: '',
LightColor: '',
CompLogo: '',
BranchName: '',
BackgroundImg: '',
OfferImg: ' ',
OfferContent1: 'Welcome',
OfferContent2: 'Ready to Order',
OfferContent3: "Let's Get Started",
OfferValue: null,
OfferType: null,
SalesType: null,
Setup_ActiveTheme: null,
Setup_SelectedHomePage: null,
Setup_SelectedCategoryPage: null,
Setup_SelectedCardPage: null,
Setup_BgImageUrl: null,
Setup_OfferImageUrl: null,
Setup_SelecteddarkColor: null,
Setup_SelectedlightColor: null,
Setup_SelectedthemeType: null,
Setup_SelectedcolorType: null,
Setup_SelectedSalesType: null,
Setup_Content1: null,
Setup_Content2: null,
Setup_Content3: null,
Setup_OfferValue: null,
Setup_OfferType: 'P',
Setup_OrderCart: null,
Setup_OrderPage: null,
KioskCustomerMobileNumber: null,
KioskPaymentOption: [],
SelectedKioskPaymentOption: null,
KioskSalesCount: 0,
isKioskCartOpen: false,
CardlistDate: dayjs(),
changesHappenedORderCardDtls: false,
};
const KiosePageChange = createSlice({
name: 'KiosePageChange',
initialState,
reducers: {
changesHappenedORderCardDtls: (state, action) => {
state.changesHappenedORderCardDtls = !state.changesHappenedORderCardDtls;
},
changeisKioskCartOpen: (state, action) => {
state.isKioskCartOpen = action?.payload;
},
changeCardlistDate: (state, action) => {
state.CardlistDate = action?.payload;
},
changeKioskPageName: (state, action) => {
state.currentKioskPageName = action?.payload;
},
changeSetup_ActiveTheme: (state, action) => {
state.Setup_ActiveTheme = action?.payload;
},
changeSetup_SelectedHomePage: (state, action) => {
state.Setup_SelectedHomePage = action?.payload;
},
changeSetup_SelectedCategoryPage: (state, action) => {
state.Setup_SelectedCategoryPage = action?.payload;
},
changeSetup_SelectedCardPage: (state, action) => {
state.Setup_SelectedCardPage = action?.payload;
},
changeSetup_BgImageUrl: (state, action) => {
state.Setup_BgImageUrl = action?.payload;
},
changeSetup_OfferImageUrl: (state, action) => {
state.Setup_OfferImageUrl = action?.payload;
},
changeSetup_SelecteddarkColor: (state, action) => {
state.Setup_SelecteddarkColor = action?.payload;
},
changeSetup_SelectedlightColor: (state, action) => {
state.Setup_SelectedlightColor = action?.payload;
},
changeSetup_SelectedthemeType: (state, action) => {
state.Setup_SelectedthemeType = action?.payload;
},
changeSetup_SelectedcolorType: (state, action) => {
state.Setup_SelectedcolorType = action?.payload;
},
changeSetup_SelectedSalesType: (state, action) => {
state.Setup_SelectedSalesType = action?.payload;
},
changeSetup_Content1: (state, action) => {
state.Setup_Content1 = action?.payload;
},
changeSetup_Content2: (state, action) => {
state.Setup_Content2 = action?.payload;
},
changeSetup_Content3: (state, action) => {
state.Setup_Content3 = action?.payload;
},
changeSetup_OfferValue: (state, action) => {
state.Setup_OfferValue = action?.payload;
},
changeSetup_OfferType: (state, action) => {
state.Setup_OfferType = action?.payload;
},
changeSetup_OrderCart: (state, action) => {
state.Setup_OrderCart = action?.payload;
},
changeSetup_OrderPage: (state, action) => {
state.Setup_OrderPage = action?.payload;
},
changeKioskCustomerMobileNo: (state, action) => {
state.KioskCustomerMobileNumber = action?.payload;
},
changeKioskPaymentOption: (state, action) => {
state.KioskPaymentOption = action?.payload;
},
changeSelectedKioskPaymentOption: (state, action) => {
state.SelectedKioskPaymentOption = action?.payload;
},
changeAppName: (state, action) => {
state.AppName = action?.payload;
},
changeBranchName: (state, action) => {
state.BranchName = action?.payload;
},
changeCompLogo: (state, action) => {
state.CompLogo = action?.payload;
},
changeSelectedApplication: (state, action) => {
state.SelectedApplication = action?.payload;
},
changeSalesType: (state, action) => {
state.SalesType = action?.payload;
},
},
extraReducers: (builder) => {
builder.addCase(getKioskTemplate.fulfilled, (state, action) => {
if (action?.payload?.data?.statusCode == 1) {
let resData = action?.payload?.data?.data[0];
state.SelectedApplication = { AppId: resData?.AppId };
state.AppName = resData?.AppName;
state.DarkColor = resData?.DarkColor;
state.LightColor = resData?.LightColor;
state.BackgroundImg = resData?.BackgroundImg;
state.OfferImg = resData?.OfferImg;
state.BranchName = resData?.BranchName;
state.CompLogo = resData?.CompLogo;
state.SalesType = resData?.SalesType;
state.OfferContent1 = resData?.OfferContent1;
state.OfferContent2 = resData?.OfferContent2;
state.OfferContent3 = resData?.OfferContent3;
state.OfferValue = resData?.OfferValue;
state.OfferType = resData?.OfferType;
let tempDic = {};
for (let eachData of resData?.TemplateComponentDetails) {
tempDic[eachData.SessionName] = [eachData.ComponentName];
}
state.kioskTemplateData = tempDic;
} else {
state.kioskTemplateData = {};
}
});
builder.addCase(getKioskDatas.fulfilled, (state, action) => {
if (action?.payload?.data?.statusCode == 1) {
state.KioskSalesCount = action?.payload?.data?.data?.length;
} else {
state.KioskSalesCount = null;
}
});
},
});
export const {
changeCardlistDate,
changeisKioskCartOpen,
changeKioskPageName,
changeSetup_ActiveTheme,
changeSetup_SelectedHomePage,
changeSetup_SelectedCategoryPage,
changeSetup_SelectedCardPage,
changeSetup_BgImageUrl,
changeSetup_OfferImageUrl,
changeSetup_SelecteddarkColor,
changeSetup_SelectedlightColor,
changeSetup_SelectedthemeType,
changeSetup_SelectedcolorType,
changeSetup_SelectedSalesType,
changeSetup_OfferValue,
changeSetup_Content1,
changeSetup_Content2,
changeSetup_Content3,
changeSetup_OfferType,
changeSetup_OrderCart,
changeSetup_OrderPage,
changeKioskCustomerMobileNo,
changeKioskPaymentOption,
changeSelectedKioskPaymentOption,
changeAppName,
changeBranchName,
changeCompLogo,
changeSelectedApplication,
changeSalesType,
changesHappenedORderCardDtls
} = KiosePageChange?.actions;
export const globalCurrentKioskPageName = (state) =>
state?.KiosePageChange?.currentKioskPageName;
export const getKioskTemplateData = (state) =>
state?.KiosePageChange?.kioskTemplateData;
export const getKioskDarkColour = (state) => state?.KiosePageChange?.DarkColor;
export const getKioskLightColour = (state) =>
state?.KiosePageChange?.LightColor;
export const getKioskCompLogo = (state) => state?.KiosePageChange?.CompLogo;
export const getKioskBranchName = (state) => state?.KiosePageChange?.BranchName;
export const getKioskBackgroundimg = (state) =>
state?.KiosePageChange?.BackgroundImg;
export const getKioskOfferimg = (state) => state?.KiosePageChange?.OfferImg;
export const getKioskOfferContent1 = (state) =>
state?.KiosePageChange?.OfferContent1;
export const getKioskOfferContent2 = (state) =>
state?.KiosePageChange?.OfferContent2;
export const getKioskOfferContent3 = (state) =>
state?.KiosePageChange?.OfferContent3;
export const getKioskOfferValue = (state) => state?.KiosePageChange?.OfferValue;
export const getKioskOfferType = (state) => state?.KiosePageChange?.OfferType;
export const globalSalesType = (state) => state?.KiosePageChange?.SalesType;
export const globalKioskCustomerMobileNo = (state) =>
state?.KiosePageChange?.KioskCustomerMobileNumber;
export const globalSetup_ActiveTheme = (state) =>
state?.KiosePageChange?.Setup_ActiveTheme;
export const globalSetup_SelectedHomePage = (state) =>
state?.KiosePageChange?.Setup_SelectedHomePage;
export const globalSetup_SelectedCategoryPage = (state) =>
state?.KiosePageChange?.Setup_SelectedCategoryPage;
export const globalSetup_SelectedCardPage = (state) =>
state?.KiosePageChange?.Setup_SelectedCardPage;
export const globalSetup_BgImageUrl = (state) =>
state?.KiosePageChange?.Setup_BgImageUrl;
export const globalSetup_OfferImageUrl = (state) =>
state?.KiosePageChange?.Setup_OfferImageUrl;
export const globalSetup_SelecteddarkColor = (state) =>
state?.KiosePageChange?.Setup_SelecteddarkColor;
export const globalSetup_SelectedlightColor = (state) =>
state?.KiosePageChange?.Setup_SelectedlightColor;
export const globalSetup_SelectedthemeType = (state) =>
state?.KiosePageChange?.Setup_SelectedthemeType;
export const globalSetup_SelectedcolorType = (state) =>
state?.KiosePageChange?.Setup_SelectedcolorType;
export const globalSetup_SelectedSalesType = (state) =>
state?.KiosePageChange?.Setup_SelectedSalesType;
export const globalSetup_Content1 = (state) =>
state?.KiosePageChange?.Setup_Content1;
export const globalSetup_Content2 = (state) =>
state?.KiosePageChange?.Setup_Content2;
export const globalSetup_Content3 = (state) =>
state?.KiosePageChange?.Setup_Content3;
export const globalSetup_OfferValue = (state) =>
state?.KiosePageChange?.Setup_OfferValue;
export const globalSetup_OfferType = (state) =>
state?.KiosePageChange?.Setup_OfferType;
export const globalSetup_OrderCart = (state) =>
state?.KiosePageChange?.Setup_OrderCart;
export const globalSetup_OrderPage = (state) =>
state?.KiosePageChange?.Setup_OrderPage;
export const globalKioskPaymentOption = (state) =>
state?.KiosePageChange?.KioskPaymentOption;
export const globalSelectedKioskPaymentOption = (state) =>
state?.KiosePageChange?.SelectedKioskPaymentOption;
export const globalKioskSalesCount = (state) =>
state?.KiosePageChange?.KioskSalesCount;
export const globalisKioskCartOpen = (state) =>
state?.KiosePageChange?.isKioskCartOpen;
export const getCardlistDate = (state) =>
state?.KiosePageChange?.CardlistDate;
export const getchangesHappenedORderCardDtls = (state) =>
state?.KiosePageChange?.changesHappenedORderCardDtls;
export default KiosePageChange.reducer;

37
src/Features/KioskComponents/KioskComponentPage.js Normal file
View File

@ -0,0 +1,37 @@
import { createAsyncThunk } from '@reduxjs/toolkit';
import { axiosRetailInstanceData } from '../AuthenicationToken/AuthenticationToken';
export const getKioskSessions = createAsyncThunk(
'kioskcomponents/getKioskSessions',
async () => {
return await axiosRetailInstanceData.get(
`/configMaster?TypeName=Kiosk Session Name`
);
}
);
export const getKioskComponents = createAsyncThunk(
'kioskcomponents/getKioskComponents',
async () => {
return await axiosRetailInstanceData.get(`/UIKioskComponent`);
}
);
export const postKioskComponent = createAsyncThunk(
'kioskcomponens/postKioskComponent',
async (postData) => {
return await axiosRetailInstanceData.post(`/UIKioskComponent`, postData);
}
);
export const puttKioskComponent = createAsyncThunk(
'kioskcomponens/puttKioskComponent',
async (putData) => {
return await axiosRetailInstanceData.put(`/UIKioskComponent`, putData);
}
);
export const deleteKioskComponent = createAsyncThunk(
'kioskcomponens/eleteKioskComponent',
async (deleteData) => {
return await axiosRetailInstanceData.delete(`/UIKioskComponent`, {
params: deleteData,
});
}
);

Some files were not shown because too many files have changed in this diff Show More