From 05e90ab4fd5d3c4c7f7b2bcc4e652ec71dc75706 Mon Sep 17 00:00:00 2001 From: unknown Date: Tue, 3 Mar 2026 10:00:43 +0530 Subject: [PATCH] added time and qty limit --- src/Pages/Kiosk/CardPage/CardPage1.jsx | 15 ++++- src/Pages/Kiosk/CardPage/CardPage2.jsx | 13 +++- src/Pages/Kiosk/CardPage/CardPage3.jsx | 13 +++- src/Pages/Kiosk/CardPage/CardPage4.jsx | 14 +++- src/Pages/Kiosk/OrderCart/OrderCart1.jsx | 16 ++++- src/Pages/Kiosk/OrderCart/OrderCart2.jsx | 14 +++- src/Pages/Kiosk/OrderCart/OrderCart3.jsx | 14 +++- src/Pages/Kiosk/OrderView/OrderView1.jsx | 16 ++++- src/Pages/Kiosk/OrderView/OrderView2.jsx | 16 ++++- src/Pages/Kiosk/OrderView/OrderView3.jsx | 15 ++++- .../Kiosk/Payment/KioskPaymentWithModal.jsx | 40 +++++++++--- src/Styles/Kiosk/CardPage/CardPage1.scss | 65 +++++++++++++++++-- src/Styles/Kiosk/OrderCart/OrderCart1.scss | 55 ++++++++++++++++ 13 files changed, 276 insertions(+), 30 deletions(-) diff --git a/src/Pages/Kiosk/CardPage/CardPage1.jsx b/src/Pages/Kiosk/CardPage/CardPage1.jsx index 414ba88..ad6a3a0 100644 --- a/src/Pages/Kiosk/CardPage/CardPage1.jsx +++ b/src/Pages/Kiosk/CardPage/CardPage1.jsx @@ -18,6 +18,8 @@ import { import horizontal from '../../../Images/defaultItemImg.png'; import { getConfigType, PreferenceData } from '../../../Features/BookingScreen/BookingData/BookingData'; import { calculateOverAllQtyLimit } from '../../../utils/calculations.js'; +import { IoIosWarning } from "react-icons/io"; + const CardPage1 = (props) => { const dispatch = useDispatch(); @@ -32,6 +34,7 @@ const CardPage1 = (props) => { const [qtydata, setQtydata] = useState(); const [QtyIndex, setQtyIndex] = useState(0); const [ConfigDataList, setConfigDataList] = useState([]); + const [maxLimitExceeded, setMaxLimitExceeded] = useState(false); const kioskTemplateData = props?.data; const SettingDataSelector = useSelector(settingDataSelector); const UomPrint = SettingDataSelector?.[0]?.SettingDtlDetails.filter( @@ -61,7 +64,12 @@ const CardPage1 = (props) => { if (overAllLimitPreferenece) { const calculatedOverAllQty = calculateOverAllQtyLimit(KioskOrderDetails); if ((calculatedOverAllQty + 1) > maxQtyLimit) { - message.warning(`Overall Quantity Limit Exceeds than ${maxQtyLimit}`) + setMaxLimitExceeded(true); + // Reset after 3 seconds + setTimeout(() => { + setMaxLimitExceeded(false); + }, 2000); + return; } } @@ -782,6 +790,11 @@ const CardPage1 = (props) => { } /> +
+

+ Maximum Quantity ({maxQtyLimit}) Reached +

+
); }; diff --git a/src/Pages/Kiosk/CardPage/CardPage2.jsx b/src/Pages/Kiosk/CardPage/CardPage2.jsx index d694a4a..0c058ea 100644 --- a/src/Pages/Kiosk/CardPage/CardPage2.jsx +++ b/src/Pages/Kiosk/CardPage/CardPage2.jsx @@ -17,6 +17,7 @@ import { import horizontal from '../../../Images/defaultItemImg.png'; import { getConfigType, PreferenceData } from '../../../Features/BookingScreen/BookingData/BookingData'; import { calculateOverAllQtyLimit } from '../../../utils/calculations.js'; +import { IoIosWarning } from 'react-icons/io'; const CardPage2 = (props) => { const dispatch = useDispatch(); @@ -26,6 +27,7 @@ const CardPage2 = (props) => { const getKioskLightColourdata = useSelector(getKioskLightColour); const BookingType = useSelector(GlobalBookingTypeKiosk); const kioskTemplateData = props?.data; + const [maxLimitExceeded, setMaxLimitExceeded] = useState(false); const [openQuantity, setopenQuantity] = useState(false); const [VariantOpen, setVariantOpen] = useState(false); const [onePeiceFlow, setOnePeiceFlow] = useState(false); @@ -61,7 +63,11 @@ const CardPage2 = (props) => { if (overAllLimitPreferenece) { const calculatedOverAllQty = calculateOverAllQtyLimit(KioskOrderDetails); if ((calculatedOverAllQty + 1) > maxQtyLimit) { - message.warning(`Overall Quantity Limit Exceeds than ${maxQtyLimit}`) + setMaxLimitExceeded(true); + // Reset after 3 seconds + setTimeout(() => { + setMaxLimitExceeded(false); + }, 2000); return; } } @@ -593,6 +599,11 @@ const CardPage2 = (props) => { ) )} +
+

+ Maximum Quantity ({maxQtyLimit}) Reached +

+
Select Quantity

} height={'max-content'} diff --git a/src/Pages/Kiosk/CardPage/CardPage3.jsx b/src/Pages/Kiosk/CardPage/CardPage3.jsx index d1553b5..72743f0 100644 --- a/src/Pages/Kiosk/CardPage/CardPage3.jsx +++ b/src/Pages/Kiosk/CardPage/CardPage3.jsx @@ -16,6 +16,7 @@ import horizontal from '../../../Images/defaultItemImg.png'; import { getKioskLightColour } from '../../../Features/Kiosk/kiosk'; import { getConfigType, PreferenceData } from '../../../Features/BookingScreen/BookingData/BookingData'; import { calculateOverAllQtyLimit } from '../../../utils/calculations.js'; +import { IoIosWarning } from 'react-icons/io'; const CardPage3 = (props) => { const dispatch = useDispatch(); @@ -25,6 +26,7 @@ const CardPage3 = (props) => { console.log(KioskOrderDetails, 'KioskOrderDetailsKioskOrderDetails'); const getKioskLightColourdata = useSelector(getKioskLightColour); const BookingType = useSelector(GlobalBookingTypeKiosk); + const [maxLimitExceeded, setMaxLimitExceeded] = useState(false); const [openQuantity, setopenQuantity] = useState(false); const [VariantOpen, setVariantOpen] = useState(false); const [onePeiceFlow, setOnePeiceFlow] = useState(false); @@ -60,7 +62,11 @@ const CardPage3 = (props) => { if (overAllLimitPreferenece) { const calculatedOverAllQty = calculateOverAllQtyLimit(KioskOrderDetails); if ((calculatedOverAllQty + 1) > maxQtyLimit) { - message.warning(`Overall Quantity Limit Exceeds than ${maxQtyLimit}`) + setMaxLimitExceeded(true); + // Reset after 3 seconds + setTimeout(() => { + setMaxLimitExceeded(false); + }, 2000); return; } } @@ -596,6 +602,11 @@ const CardPage3 = (props) => { ) )} +
+

+ Maximum Quantity ({maxQtyLimit}) Reached +

+
Select Quantity

} height={'max-content'} diff --git a/src/Pages/Kiosk/CardPage/CardPage4.jsx b/src/Pages/Kiosk/CardPage/CardPage4.jsx index c11ccfd..4d0ba8a 100644 --- a/src/Pages/Kiosk/CardPage/CardPage4.jsx +++ b/src/Pages/Kiosk/CardPage/CardPage4.jsx @@ -16,6 +16,7 @@ import horizontal from '../../../Images/defaultItemImg.png'; import { getKioskLightColour } from '../../../Features/Kiosk/kiosk'; import { getConfigType, PreferenceData } from '../../../Features/BookingScreen/BookingData/BookingData'; import { calculateOverAllQtyLimit } from '../../../utils/calculations.js'; +import { IoIosWarning } from 'react-icons/io'; const CardPage4 = (props) => { const dispatch = useDispatch(); @@ -25,6 +26,7 @@ const CardPage4 = (props) => { console.log(KioskOrderDetails, 'KioskOrderDetails'); const getKioskLightColourdata = useSelector(getKioskLightColour); const BookingType = useSelector(GlobalBookingTypeKiosk); + const [maxLimitExceeded, setMaxLimitExceeded] = useState(false); const [quantities, setQuantities] = useState({}); const [openQuantity, setopenQuantity] = useState(false); const [VariantOpen, setVariantOpen] = useState(false); @@ -91,7 +93,11 @@ const CardPage4 = (props) => { if (overAllLimitPreferenece) { const calculatedOverAllQty = calculateOverAllQtyLimit(KioskOrderDetails); if ((calculatedOverAllQty + 1) > maxQtyLimit) { - message.warning(`Overall Quantity Limit Exceeds than ${maxQtyLimit}`) + setMaxLimitExceeded(true); + // Reset after 3 seconds + setTimeout(() => { + setMaxLimitExceeded(false); + }, 2000); return; } } @@ -617,7 +623,11 @@ const CardPage4 = (props) => { ) )} - +
+

+ Maximum Quantity ({maxQtyLimit}) Reached +

+
Select Quantity

} height={'max-content'} diff --git a/src/Pages/Kiosk/OrderCart/OrderCart1.jsx b/src/Pages/Kiosk/OrderCart/OrderCart1.jsx index ab1f3d1..ac6b5d1 100644 --- a/src/Pages/Kiosk/OrderCart/OrderCart1.jsx +++ b/src/Pages/Kiosk/OrderCart/OrderCart1.jsx @@ -6,11 +6,13 @@ import TakeAway from '../KioskIcons/KioskTakeAway'; import '../../../Styles/Kiosk/OrderCart/OrderCart1.scss'; import { useSelector } from 'react-redux'; import { PreferenceData } from '../../../Features/BookingScreen/BookingData/BookingData'; -import { message } from 'antd'; import { calculateOverAllQtyLimit } from '../../../utils/calculations'; +import { IoIosWarning } from 'react-icons/io'; +import { useState } from 'react'; const KisokOrderCart1 = (props) => { const dispatch = useDispatch(); + const [maxLimitExceeded, setMaxLimitExceeded] = useState(false); const preferenceDatas = useSelector(PreferenceData); const overAllLimitPreferenece = preferenceDatas?.[0]?.['SettingDtlDetails']?.find( @@ -41,7 +43,12 @@ const KisokOrderCart1 = (props) => { if (overAllLimitPreferenece) { const calculatedOverAllQty = calculateOverAllQtyLimit(KioskOrderDetails); if ((calculatedOverAllQty + 1) > maxQtyLimit) { - message.warning(`Overall Quantity Limit Exceeds than ${maxQtyLimit}`) + setMaxLimitExceeded(true); + // Reset after 3 seconds + setTimeout(() => { + setMaxLimitExceeded(false); + }, 2000); + return; } } @@ -202,6 +209,11 @@ const KisokOrderCart1 = (props) => { remove +
+

+ Maximum Quantity ({maxQtyLimit}) Reached +

+
))} diff --git a/src/Pages/Kiosk/OrderCart/OrderCart2.jsx b/src/Pages/Kiosk/OrderCart/OrderCart2.jsx index 7b2e35d..697d723 100644 --- a/src/Pages/Kiosk/OrderCart/OrderCart2.jsx +++ b/src/Pages/Kiosk/OrderCart/OrderCart2.jsx @@ -10,10 +10,13 @@ import { calculateOverAllQtyLimit } from '../../../utils/calculations'; import { PreferenceData } from '../../../Features/BookingScreen/BookingData/BookingData'; import { useSelector } from 'react-redux'; import { message } from 'antd'; +import { useState } from 'react'; +import { IoIosWarning } from 'react-icons/io'; const KisokOrderCart2 = (props) => { const dispatch = useDispatch(); const preferenceDatas = useSelector(PreferenceData); + const [maxLimitExceeded, setMaxLimitExceeded] = useState(false); const overAllLimitPreferenece = preferenceDatas?.[0]?.['SettingDtlDetails']?.find( (item) => (item.SettingIdName?.toLowerCase() === 'overalllimit') && item?.SettingValue === 'Y'); @@ -44,7 +47,11 @@ const KisokOrderCart2 = (props) => { if (overAllLimitPreferenece) { const calculatedOverAllQty = calculateOverAllQtyLimit(KioskOrderDetails); if ((calculatedOverAllQty + 1) > maxQtyLimit) { - message.warning(`Overall Quantity Limit Exceeds than ${maxQtyLimit}`) + setMaxLimitExceeded(true); + // Reset after 3 seconds + setTimeout(() => { + setMaxLimitExceeded(false); + }, 2000); return; } } @@ -223,6 +230,11 @@ const KisokOrderCart2 = (props) => { ))} +
+

+ Maximum Quantity ({maxQtyLimit}) Reached +

+
); }; diff --git a/src/Pages/Kiosk/OrderCart/OrderCart3.jsx b/src/Pages/Kiosk/OrderCart/OrderCart3.jsx index 51f4a37..3fd5c13 100644 --- a/src/Pages/Kiosk/OrderCart/OrderCart3.jsx +++ b/src/Pages/Kiosk/OrderCart/OrderCart3.jsx @@ -11,9 +11,12 @@ import '../../../Styles/Kiosk/OrderCart/OrderCart3.scss'; import { calculateOverAllQtyLimit } from '../../../utils/calculations'; import { message } from 'antd'; import { PreferenceData } from '../../../Features/BookingScreen/BookingData/BookingData'; +import { IoIosWarning } from 'react-icons/io'; +import { useState } from 'react'; const KisokOrderCart3 = (props) => { const dispatch = useDispatch(); + const [maxLimitExceeded, setMaxLimitExceeded] = useState(false); const getKioskDarkColourdata = useSelector(getKioskDarkColour); const preferenceDatas = useSelector(PreferenceData); const overAllLimitPreferenece = @@ -47,7 +50,11 @@ const KisokOrderCart3 = (props) => { if (overAllLimitPreferenece) { const calculatedOverAllQty = calculateOverAllQtyLimit(KioskOrderDetails); if ((calculatedOverAllQty + 1) > maxQtyLimit) { - message.warning(`Overall Quantity Limit Exceeds than ${maxQtyLimit}`) + setMaxLimitExceeded(true); + // Reset after 3 seconds + setTimeout(() => { + setMaxLimitExceeded(false); + }, 2000); return; } } @@ -236,6 +243,11 @@ const KisokOrderCart3 = (props) => { ))} +
+

+ Maximum Quantity ({maxQtyLimit}) Reached +

+
); }; diff --git a/src/Pages/Kiosk/OrderView/OrderView1.jsx b/src/Pages/Kiosk/OrderView/OrderView1.jsx index d5fcf51..c3d39bc 100644 --- a/src/Pages/Kiosk/OrderView/OrderView1.jsx +++ b/src/Pages/Kiosk/OrderView/OrderView1.jsx @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { useState } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { MdCurrencyRupee } from 'react-icons/md'; import KioskHeader from '../Components/KioskHeader'; @@ -19,12 +19,14 @@ import '../../../Styles/Kiosk/OrderView/OrderView1.scss'; import { PreferenceData } from '../../../Features/BookingScreen/BookingData/BookingData'; import { calculateOverAllQtyLimit } from '../../../utils/calculations'; import { message } from 'antd'; +import { IoIosWarning } from 'react-icons/io'; const OrderView1 = (props) => { const KioskThemeData = props?.hasOwnProperty('KioskThemeData') ? props['KioskThemeData'] : null; const dispatch = useDispatch(); + const [maxLimitExceeded, setMaxLimitExceeded] = useState(false); const KioskOrderDetails = useSelector(GlobalKioskOrderDetails); const getKioskLightColourdata = useSelector(getKioskLightColour); const preferenceDatas = useSelector(PreferenceData); @@ -61,7 +63,11 @@ const OrderView1 = (props) => { if (overAllLimitPreferenece) { const calculatedOverAllQty = calculateOverAllQtyLimit(KioskOrderDetails); if ((calculatedOverAllQty + 1) > maxQtyLimit) { - message.warning(`Overall Quantity Limit Exceeds than ${maxQtyLimit}`) + setMaxLimitExceeded(true); + // Reset after 3 seconds + setTimeout(() => { + setMaxLimitExceeded(false); + }, 2000); return; } } @@ -172,7 +178,6 @@ const OrderView1 = (props) => { KioskThemeData={KioskThemeData} SessionDtl={props?.SessionDtl} /> -
{ remove
+
+

+ Maximum Quantity ({maxQtyLimit}) Reached +

+
))} diff --git a/src/Pages/Kiosk/OrderView/OrderView2.jsx b/src/Pages/Kiosk/OrderView/OrderView2.jsx index 28532c8..1b6909e 100644 --- a/src/Pages/Kiosk/OrderView/OrderView2.jsx +++ b/src/Pages/Kiosk/OrderView/OrderView2.jsx @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { useState } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { MdCurrencyRupee } from 'react-icons/md'; import '../../../Styles/Kiosk/OrderView/OrderView2.scss'; @@ -14,7 +14,7 @@ import { changeKioskOrderDetails, } from '../../../Features/BookingScreen/BookingData/KioskBookingData'; import KioskFooter3 from '../Components/KioskFooter3'; -import { IoMdClose } from 'react-icons/io'; +import { IoIosWarning, IoMdClose } from 'react-icons/io'; import defaultImg from '../../../Images/defaultItemImg.png'; import PozoDineInIcon from '../KioskIcons/KioskDineIn'; import TakeAway from '../KioskIcons/KioskTakeAway'; @@ -29,6 +29,7 @@ const KioskOrderView2 = (props) => { : null; const dispatch = useDispatch(); const preferenceDatas = useSelector(PreferenceData); + const [maxLimitExceeded, setMaxLimitExceeded] = useState(false); const overAllLimitPreferenece = preferenceDatas?.[0]?.['SettingDtlDetails']?.find( (item) => (item.SettingIdName?.toLowerCase() === 'overalllimit') && item?.SettingValue === 'Y'); @@ -70,7 +71,11 @@ const KioskOrderView2 = (props) => { if (overAllLimitPreferenece) { const calculatedOverAllQty = calculateOverAllQtyLimit(KioskOrderDetails); if ((calculatedOverAllQty + 1) > maxQtyLimit) { - message.warning(`Overall Quantity Limit Exceeds than ${maxQtyLimit}`) + setMaxLimitExceeded(true); + // Reset after 3 seconds + setTimeout(() => { + setMaxLimitExceeded(false); + }, 2000); return; } } @@ -332,6 +337,11 @@ const KioskOrderView2 = (props) => { )} +
+

+ Maximum Quantity ({maxQtyLimit}) Reached +

+
); }; diff --git a/src/Pages/Kiosk/OrderView/OrderView3.jsx b/src/Pages/Kiosk/OrderView/OrderView3.jsx index d9ecf12..f9ff4a5 100644 --- a/src/Pages/Kiosk/OrderView/OrderView3.jsx +++ b/src/Pages/Kiosk/OrderView/OrderView3.jsx @@ -1,5 +1,5 @@ import { RiDeleteBin6Line } from 'react-icons/ri'; -import React from 'react'; +import React, { useState } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { MdCurrencyRupee } from 'react-icons/md'; import horizontal from '../../../Images/defaultItemImg.png'; @@ -21,6 +21,7 @@ import TakeAway from '../KioskIcons/KioskTakeAway'; import { PreferenceData } from '../../../Features/BookingScreen/BookingData/BookingData'; import { calculateOverAllQtyLimit } from '../../../utils/calculations'; import { message } from 'antd'; +import { IoIosWarning } from 'react-icons/io'; const KioskOrderView = (props) => { console.log(props, 'propsprops'); @@ -31,6 +32,7 @@ const KioskOrderView = (props) => { const KioskOrderDetails = useSelector(GlobalKioskOrderDetails); const getKioskLightColourdata = useSelector(getKioskLightColour); const preferenceDatas = useSelector(PreferenceData); + const [maxLimitExceeded, setMaxLimitExceeded] = useState(false); const overAllLimitPreferenece = preferenceDatas?.[0]?.['SettingDtlDetails']?.find( (item) => (item.SettingIdName?.toLowerCase() === 'overalllimit') && item?.SettingValue === 'Y'); @@ -63,7 +65,11 @@ const KioskOrderView = (props) => { if (overAllLimitPreferenece) { const calculatedOverAllQty = calculateOverAllQtyLimit(KioskOrderDetails); if ((calculatedOverAllQty + 1) > maxQtyLimit) { - message.warning(`Overall Quantity Limit Exceeds than ${maxQtyLimit}`) + setMaxLimitExceeded(true); + // Reset after 3 seconds + setTimeout(() => { + setMaxLimitExceeded(false); + }, 2000); return; } } @@ -323,6 +329,11 @@ const KioskOrderView = (props) => { )} +
+

+ Maximum Quantity ({maxQtyLimit}) Reached +

+
); }; diff --git a/src/Pages/Kiosk/Payment/KioskPaymentWithModal.jsx b/src/Pages/Kiosk/Payment/KioskPaymentWithModal.jsx index d049f3a..263b466 100644 --- a/src/Pages/Kiosk/Payment/KioskPaymentWithModal.jsx +++ b/src/Pages/Kiosk/Payment/KioskPaymentWithModal.jsx @@ -28,6 +28,7 @@ import { GlobalKioskPrinterDetails, getKioskPrinterDetails, } from '../../../Features/Kiosk/kiosk'; +import '../../../Styles/Kiosk/CardPage/CardPage1.scss'; import { GlobalBookingTypeKiosk, GlobalKioskBookingTypeBoth, @@ -83,6 +84,7 @@ import PaymentGatewayEmbedded from '../../BookingScreen/Components/UtillComponen import MobileMultiPdfPrintTrigger from '../../BookingScreen/Components/UtillComponents/MobileMultiPdfPrintTrigger.jsx'; import { checkLastOrderTimeLimit, sendupiotp } from '../../../Features/UpiDetails/UpiDetails.js'; import { isIndianMobile } from '../../../utils/calculations.js'; +import { IoIosWarning } from 'react-icons/io'; const CustomPaymentUrl = import.meta.env.ENV_CUSTOM_PAYMENT_URL; @@ -165,6 +167,8 @@ const KioskPayment = (props) => { const bookingTypePreference = appPreferences?.find( (preference) => preference?.PreferredCatName === 'Booking Type' )?.PreferenceCatDetails; + const [maxLimitExceeded, setMaxLimitExceeded] = useState(null); + const [maxLimitExceededMessage, setMaxLimitExceededMessage] = useState(null); const [showPaymentMethods, setShowPaymentMethods] = useState(null); const [resendTimer, setResendTimer] = useState(0) const [canResend, setCanResend] = useState(true) @@ -773,12 +777,18 @@ const KioskPayment = (props) => { }; const handlePaymentOption = async (option) => { - if (isTimeLimitEnabled) { const withinTimeLimit = await checkLast30MinOrder(number); if (withinTimeLimit?.IsEligible === false) { - setMessageData(withinTimeLimit?.response); - setMessageType('warning'); + // setMessageData(withinTimeLimit?.response); + // setMessageType('warning'); + setMaxLimitExceededMessage(withinTimeLimit?.response); + setMaxLimitExceeded(true); + // Reset after 3 seconds + setTimeout(() => { + setMaxLimitExceeded(false); + setMaxLimitExceededMessage(null); + }, 2500); return; } } @@ -1840,8 +1850,15 @@ const KioskPayment = (props) => { if (isTimeLimitEnabled) { const withinTimeLimit = await checkLast30MinOrder(number); if (withinTimeLimit?.IsEligible === false) { - setMessageData(withinTimeLimit?.response); - setMessageType('warning'); + // setMessageData(withinTimeLimit?.response); + // setMessageType('warning'); + setMaxLimitExceededMessage(withinTimeLimit?.response); + setMaxLimitExceeded(true); + // Reset after 3 seconds + setTimeout(() => { + setMaxLimitExceeded(false); + setMaxLimitExceededMessage(null); + }, 2500); return; } } @@ -2033,6 +2050,7 @@ const KioskPayment = (props) => { icon={} > + ) : (
@@ -2042,10 +2060,10 @@ const KioskPayment = (props) => {
{!otpSent && !otpVerifed && (<>
-

+ {/*

Get your order bill on your mobile
via SMS / Whatsapp -

+

*/}
{ )} {(isOtpEnabled && otpSent) && (
- +
Enter OTP
{/* Mobile Number + Edit */}
{number} @@ -2245,10 +2263,16 @@ const KioskPayment = (props) => {
}
+
+

+ {maxLimitExceededMessage} +

+
) } > + {PrintOrderDetails?.length > 0 && PrintOrderDetails?.[0]?.OrderDetails?.map((orderDetail, index) => (
diff --git a/src/Styles/Kiosk/CardPage/CardPage1.scss b/src/Styles/Kiosk/CardPage/CardPage1.scss index 2a7f59f..9818008 100644 --- a/src/Styles/Kiosk/CardPage/CardPage1.scss +++ b/src/Styles/Kiosk/CardPage/CardPage1.scss @@ -416,12 +416,13 @@ background-color: #ffebee; border-color: #f44336; } - &.selected { + + &.selected { background-color: #ffebee; border-color: #9e1c60; } - + } } } @@ -443,7 +444,7 @@ width: 48%; white-space: nowrap; - > div:nth-child(1) { + >div:nth-child(1) { font-size: 14px; font-weight: 500; line-height: 1.1; @@ -674,9 +675,63 @@ flex-wrap: wrap; gap: 10px; } -.sportsCardContinueButton{ + +.sportsCardContinueButton { display: flex; flex-direction: row-reverse; align-items: center; - + +} + +.Item3Warning { + position: fixed; + top: 0%; + left: 0%; + bottom: 0; + right: 0%; + background-color: #00000096; + z-index: 100; + font-family: "Poppins"; + font-size: 16px; + font-weight: 500; + width: 100%; + height: 100%; + overflow: hidden; + display: flex; + align-items: center; + justify-content: center; + gap: 10px; + flex-direction: column; + backdrop-filter: blur(4px); + + /* Animation initial state */ + opacity: 0; + visibility: hidden; + transition: opacity 0.3s ease, visibility 0.3s ease; + + p { + display: flex; + box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, + rgba(0, 0, 0, 0.06) 0px 0px 0px 1px; + align-items: center; + justify-content: center; + gap: 10px; + background-color: #fff; + padding: 15px 20px; + border-radius: 8px; + + /* popup animation */ + transform: scale(0.8); + transition: transform 0.3s ease; + } +} + +/* When visible */ +.Item3Warning.showing { + opacity: 1; + visibility: visible; + + p { + transform: scale(1); + } } \ No newline at end of file diff --git a/src/Styles/Kiosk/OrderCart/OrderCart1.scss b/src/Styles/Kiosk/OrderCart/OrderCart1.scss index c8369ca..dae1b6c 100644 --- a/src/Styles/Kiosk/OrderCart/OrderCart1.scss +++ b/src/Styles/Kiosk/OrderCart/OrderCart1.scss @@ -57,6 +57,7 @@ text-transform: uppercase; text-wrap: wrap; } + p { width: 65%; } @@ -122,4 +123,58 @@ justify-content: center; padding: 2px 6px; } + //mohan + +.Item3Warning { + position: fixed; + top: 0%; + left: 0%; + bottom: 0; + right: 0%; + background-color: #00000096; + z-index: 100; + font-family: "Poppins"; + font-size: 16px; + font-weight: 500; + width: 100%; + height: 100%; + overflow: hidden; + display: flex; + align-items: center; + justify-content: center; + gap: 10px; + flex-direction: column; + backdrop-filter: blur(4px); + + /* Animation initial state */ + opacity: 0; + visibility: hidden; + transition: opacity 0.3s ease, visibility 0.3s ease; + + p { + display: flex; + box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, + rgba(0, 0, 0, 0.06) 0px 0px 0px 1px; + align-items: center; + justify-content: center; + gap: 10px; + background-color: #fff; + padding: 15px 20px; + border-radius: 8px; + + /* popup animation */ + transform: scale(0.8); + transition: transform 0.3s ease; + } +} + +/* When visible */ +.Item3Warning.showing { + opacity: 1; + visibility: visible; + + p { + transform: scale(1); + } +} \ No newline at end of file