Merge pull request 'FIX#223 Logon System Customer mobile number get in salespage' (#224) from March-3-deployment into main
Reviewed-on: Pozomind/pozo-retail-app#224
This commit is contained in:
commit
f10e9b1a60
|
|
@ -100,6 +100,11 @@ const BSBillingTable3 = () => {
|
|||
setting?.SettingIdName?.toLowerCase() === 'decimal' &&
|
||||
setting?.SettingValue === 'Y'
|
||||
);
|
||||
const salesaskiosk = preferenceDatas?.[0]?.SettingDtlDetails?.find(
|
||||
(setting) =>
|
||||
setting?.SettingIdName?.toLowerCase() === 'salespageaskiosk' &&
|
||||
setting?.SettingValue === 'Y'
|
||||
);
|
||||
const SessionData = useSelector(StoredSessionData);
|
||||
const BranchId = SessionData?.BranchId;
|
||||
const AppId = SessionData?.AppId;
|
||||
|
|
@ -2357,7 +2362,7 @@ const BSBillingTable3 = () => {
|
|||
fontSize: '16px',
|
||||
}}
|
||||
>
|
||||
{tableData?.length > 0 ? (
|
||||
{(tableData?.length > 0 && !salesaskiosk)? (
|
||||
<Popconfirm
|
||||
title="Delete the items"
|
||||
description="Are you sure you want to clear these items?"
|
||||
|
|
|
|||
|
|
@ -215,6 +215,7 @@ import UpiPopover from '../StandardTable/Utils/UpiPopOver.jsx';
|
|||
import MobileMultiPdfPrintTrigger from '../../UtillComponents/MobileMultiPdfPrintTrigger.jsx';
|
||||
import { useDateStore } from '../../../../../Features/BookingScreen/BookingData/DateStore.js';
|
||||
import BillingTableSkeleton from '../../../../../Components/Skeleton/BillingTableSkeleton.jsx';
|
||||
import CustomerMobileNumberModal from '../../BookingFunctionality/CustomerOTP.jsx';
|
||||
const PaymentGatewayEmbedded = lazy(
|
||||
() => import('../../UtillComponents/PaymentGatewayEmbedded.jsx')
|
||||
);
|
||||
|
|
@ -269,6 +270,7 @@ const BSBillingTable3Pay = () => {
|
|||
const previousOrderOfferDetails = useSelector(
|
||||
GlobalPreviousOrderOfferDetails
|
||||
);
|
||||
const CustomerMobileNumber = useSelector(GlobalSelCustId, shallowEqual);
|
||||
const AllPaymentOptions = useSelector(GlobalpaymentOptionData);
|
||||
const FreeProdList = useSelector(GlobalFreeProdList);
|
||||
const offerAppliedProducts = useSelector(
|
||||
|
|
@ -301,6 +303,7 @@ const BSBillingTable3Pay = () => {
|
|||
const FontFamily = useSelector(GlobalSelectedFont);
|
||||
const GetCustId = useSelector(GlobalCustId);
|
||||
const SelCustId = useSelector(GlobalSelCustId);
|
||||
console.log(GetCustId, SelCustId, 'GetCustId, SelCustId');
|
||||
const selOption = useSelector(GlobalSelOption);
|
||||
const SelectedTableDetails = useSelector(GlobalSelectedTableDetails);
|
||||
const defaultBookingType = useSelector(GlobalDefaultBookingType);
|
||||
|
|
@ -378,6 +381,17 @@ const BSBillingTable3Pay = () => {
|
|||
const [PrintOrderDetails, setPrintOrderDetails] = useState([]);
|
||||
const OrderCardDetail = useSelector(GlobalOrderCardDetails);
|
||||
const [customerPreviesOrders, setCustomerPreviesOrders] = useState(false);
|
||||
const [CustomerOtpmodalopen, setCustomerOtpmodalopen] = useState(false);
|
||||
const isOtpEnabled = SettingDataSelector?.[0]?.SettingDtlDetails?.find(
|
||||
(setting) =>
|
||||
setting?.SettingIdName?.toLowerCase() === 'kioskotp' &&
|
||||
setting?.SettingValue === 'Y'
|
||||
);
|
||||
const salesaskiosk = SettingDataSelector?.[0]?.SettingDtlDetails?.find(
|
||||
(setting) =>
|
||||
setting?.SettingIdName?.toLowerCase() === 'salespageaskiosk' &&
|
||||
setting?.SettingValue === 'Y'
|
||||
);
|
||||
|
||||
console.log(OrderCardDetail, 'OrderCardDetail');
|
||||
//Total calculation
|
||||
|
|
@ -707,6 +721,10 @@ const BSBillingTable3Pay = () => {
|
|||
// dispatch(getPrintSelectionComponentData(Data1)).unwrap();
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
(!CustomerMobileNumber && isOtpEnabled && salesaskiosk) && setCustomerOtpmodalopen(true);
|
||||
}, [PrintOrderDetails, CustomerMobileNumber]);
|
||||
|
||||
useEffect(() => {
|
||||
const getPrintData = async () => {
|
||||
try {
|
||||
|
|
@ -1072,9 +1090,9 @@ const BSBillingTable3Pay = () => {
|
|||
setDefaultPaymentMode([]);
|
||||
}
|
||||
};
|
||||
if (salesBillEdit) {
|
||||
// if (salesBillEdit) {
|
||||
setDefaultPaymentOption();
|
||||
}
|
||||
// }
|
||||
}, [defaultPaymentTrigger, salesBillEdit]);
|
||||
|
||||
const TokenPrint = async (index) => {
|
||||
|
|
@ -4917,6 +4935,13 @@ const BSBillingTable3Pay = () => {
|
|||
}
|
||||
/>
|
||||
)}
|
||||
|
||||
{(CustomerOtpmodalopen && isOtpEnabled && salesaskiosk) && (
|
||||
<CustomerMobileNumberModal
|
||||
open={CustomerOtpmodalopen}
|
||||
HandleCloseModal={() => setCustomerOtpmodalopen(false)}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
</Suspense>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -2908,7 +2908,7 @@ const StandardTablePayment = () => {
|
|||
PrintOrderDetails?.[0]?.OrderDetails?.[0]?.productDetails?.some(
|
||||
(product) => product.TokenAvailable === 'Y'
|
||||
);
|
||||
if (!isMobile) {
|
||||
if (isMobile) {
|
||||
if (MobileA4Print) {
|
||||
await MobileMultiPdfPrintTrigger({
|
||||
preferenceDetails,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,482 @@
|
|||
import { shallowEqual, useSelector } from 'react-redux';
|
||||
import {
|
||||
changeCustomerID,
|
||||
ChangeSelectedCustDisable,
|
||||
changeSelectedCustId,
|
||||
changeSelectedOption,
|
||||
PreferenceData,
|
||||
} from '../../../../Features/BookingScreen/BookingData/BookingData';
|
||||
|
||||
import { useCallback, useEffect, useState } from 'react';
|
||||
import {
|
||||
changeKioskCustomerMobileNo,
|
||||
globalKioskCustomerMobileNo,
|
||||
} from '../../../../Features/Kiosk/kiosk.js';
|
||||
import { HiOutlineBackspace } from 'react-icons/hi';
|
||||
import { useDispatch } from 'react-redux';
|
||||
import { isIndianMobile } from '../../../../utils/calculations.js';
|
||||
import { IoIosWarning } from 'react-icons/io';
|
||||
import './CustomerOTP.scss';
|
||||
import { Messages } from '../../../../Components/Notifications/Messages.jsx';
|
||||
import { DefaultModal } from '../../../../Components/Modal/DefaultModal.jsx';
|
||||
import {
|
||||
checkLastOrderTimeLimit,
|
||||
sendupiotp,
|
||||
} from '../../../../Features/UpiDetails/UpiDetails.js';
|
||||
import { StoredSessionData } from '../../../../Features/ThemeChange/ThemeChange.js';
|
||||
import { getAddCustomerDetails, postAddCustomerDetails } from '../../../../Features/BookingScreen/Customer/addCustomer.js';
|
||||
const CustomerMobileNumberModal = ({ open, HandleCloseModal }) => {
|
||||
const SettingDataSelector = useSelector(PreferenceData);
|
||||
const CustomerMobileNumber = useSelector(globalKioskCustomerMobileNo);
|
||||
|
||||
const SessionData = useSelector(StoredSessionData, shallowEqual);
|
||||
const dispatch = useDispatch();
|
||||
const [number, setNumber] = useState(
|
||||
CustomerMobileNumber ? CustomerMobileNumber : ''
|
||||
);
|
||||
const [messageType, setMessageType] = useState(null);
|
||||
const [messageData, setMessageData] = useState(null);
|
||||
const [canResend, setCanResend] = useState(true);
|
||||
const [otpInput, setOtpInput] = useState(['', '', '', '']);
|
||||
const [otpIndex, setOtpIndex] = useState(0);
|
||||
const [otpSent, setOtpSent] = useState(false);
|
||||
const [otpVerifed, setOtpVerified] = useState(false);
|
||||
const [otpNumber, setOTPNumber] = useState(null);
|
||||
const [maxLimitExceeded, setMaxLimitExceeded] = useState(null);
|
||||
const [maxLimitExceededMessage, setMaxLimitExceededMessage] = useState(null);
|
||||
const isOtpEnabled = SettingDataSelector?.[0]?.SettingDtlDetails?.find(
|
||||
(setting) =>
|
||||
setting?.SettingIdName?.toLowerCase() === 'kioskotp' &&
|
||||
setting?.SettingValue === 'Y'
|
||||
);
|
||||
const isTimeLimitEnabled = SettingDataSelector?.[0]?.SettingDtlDetails?.find(
|
||||
(setting) =>
|
||||
(setting?.SettingIdName?.toLowerCase() === 'hours' ||
|
||||
setting?.SettingIdName?.toLowerCase() === 'minutes') &&
|
||||
setting?.SettingValue === 'Y'
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
isIndianMobile(number) && fetchCustomerDetails(number);
|
||||
}, [number]);
|
||||
useEffect(() => {
|
||||
if (otpInput.every((input) => input !== '')) {
|
||||
verifyOtp();
|
||||
}
|
||||
}, [otpInput]);
|
||||
const fetchCustomerDetails = async (number) => {
|
||||
const response = await dispatch(
|
||||
getAddCustomerDetails({
|
||||
MobileNo: number,
|
||||
AppId: SessionData.AppId,
|
||||
CompId: SessionData.CompId,
|
||||
BranchId: SessionData.BranchId,
|
||||
})
|
||||
)?.unwrap();
|
||||
if (response?.data?.statusCode === 1) {
|
||||
console.log(
|
||||
'response?.data?.CustomerId',
|
||||
response?.data,
|
||||
response?.data?.data?.[0]?.CustId
|
||||
);
|
||||
dispatch(changeCustomerID(response?.data?.data?.[0]?.CustId));
|
||||
let custvalues = {
|
||||
value: number,
|
||||
label: response?.data?.data?.[0]?.CustName || number,
|
||||
CustId: response?.data?.data?.[0]?.CustId,
|
||||
...response?.data?.data?.[0],
|
||||
};
|
||||
// {value: '8428086416', label: 'mohan', CustId: 'CUST1-281-437-74', CustName: 'mohan', Address1: undefined, …}
|
||||
await dispatch(changeSelectedOption(custvalues));
|
||||
await dispatch(changeSelectedCustId(response?.data?.data?.[0]?.CustId));
|
||||
await dispatch(
|
||||
ChangeSelectedCustDisable(true)
|
||||
);
|
||||
}else{
|
||||
let postdata = {
|
||||
"CustMobile":number,
|
||||
"CustomerProfile": null,
|
||||
"AppId": SessionData.AppId,
|
||||
"CompId": SessionData.CompId,
|
||||
"BranchId": SessionData.BranchId,
|
||||
"CreatedBy": SessionData.UserId,
|
||||
"InitialOutStanding": null,
|
||||
"OfferType": "P",
|
||||
"MarriedStatus": "N",
|
||||
"CustomerAddressDtl": []
|
||||
}
|
||||
let response1 = await dispatch(postAddCustomerDetails(postdata)).unwrap();
|
||||
|
||||
if (response1?.data?.statusCode == 1) {
|
||||
dispatch(changeSelectedOption(null));
|
||||
dispatch(
|
||||
changeCustomerID(
|
||||
response1?.data?.CustomerDetails?.[
|
||||
response1?.data?.CustomerDetails.length - 1
|
||||
]
|
||||
)
|
||||
);
|
||||
dispatch(
|
||||
changeSelectedCustId(response1?.data?.CustomerDetails?.[0]?.CustId)
|
||||
);
|
||||
dispatch(
|
||||
ChangeSelectedCustDisable(true)
|
||||
);
|
||||
|
||||
} else{
|
||||
setMessageData('Invalid mobile No.');
|
||||
setMessageType('error');
|
||||
setNumber('');
|
||||
}
|
||||
}
|
||||
};
|
||||
const setNumberFun = (newValue) => {
|
||||
setNumber((prevNumber) => {
|
||||
if (prevNumber.length < 10) {
|
||||
return prevNumber + newValue;
|
||||
}
|
||||
return prevNumber;
|
||||
});
|
||||
};
|
||||
|
||||
const handleOtpNumber = (num) => {
|
||||
if (otpIndex > 3) return;
|
||||
|
||||
const newOtp = [...otpInput];
|
||||
newOtp[otpIndex] = num.toString();
|
||||
setOtpInput(newOtp);
|
||||
|
||||
if (otpIndex < 3) {
|
||||
setOtpIndex(otpIndex + 1);
|
||||
}
|
||||
};
|
||||
|
||||
const handleOtpBackspace = () => {
|
||||
if (otpIndex < 0) return;
|
||||
|
||||
const newOtp = [...otpInput];
|
||||
|
||||
if (newOtp[otpIndex]) {
|
||||
newOtp[otpIndex] = '';
|
||||
} else if (otpIndex > 0) {
|
||||
newOtp[otpIndex - 1] = '';
|
||||
setOtpIndex(otpIndex - 1);
|
||||
}
|
||||
|
||||
setOtpInput(newOtp);
|
||||
};
|
||||
|
||||
const handleBackspace = () => {
|
||||
setNumber((prevNumber) => prevNumber.slice(0, -1));
|
||||
};
|
||||
const checkLast30MinOrder = async (MobileNo) => {
|
||||
const response = await dispatch(
|
||||
checkLastOrderTimeLimit({
|
||||
MobileNo,
|
||||
AppId: SessionData.AppId,
|
||||
CompId: SessionData.CompId,
|
||||
BranchId: SessionData.BranchId,
|
||||
})
|
||||
)?.unwrap();
|
||||
return response?.data;
|
||||
};
|
||||
const sendOTP = async () => {
|
||||
const valid = isIndianMobile(number);
|
||||
if (valid) {
|
||||
if (isTimeLimitEnabled) {
|
||||
const withinTimeLimit = await checkLast30MinOrder(number);
|
||||
if (withinTimeLimit?.IsEligible === false) {
|
||||
// setMessageData(withinTimeLimit?.response);
|
||||
// setMessageType('warning');
|
||||
setMaxLimitExceededMessage(withinTimeLimit?.response);
|
||||
setMaxLimitExceeded(true);
|
||||
await dispatch(changeSelectedOption(null));
|
||||
await dispatch(changeSelectedCustId(null));
|
||||
// Reset after 3 seconds
|
||||
setTimeout(() => {
|
||||
setMaxLimitExceeded(false);
|
||||
setMaxLimitExceededMessage(null);
|
||||
}, 2500);
|
||||
return;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
setMessageData('Please enter valid mobile No.');
|
||||
setMessageType('warning');
|
||||
return;
|
||||
}
|
||||
try {
|
||||
setOtpIndex(0);
|
||||
setOtpSent(true);
|
||||
let response = await dispatch(
|
||||
sendupiotp({
|
||||
MobileNo: number,
|
||||
CreatedBy: 0,
|
||||
})
|
||||
)?.unwrap();
|
||||
if (response?.data?.statusCode == 1) {
|
||||
setMessageData('OTP sent to your mobile number');
|
||||
setMessageType('success');
|
||||
setOTPNumber(response?.data?.OTP);
|
||||
startResendTimer();
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
};
|
||||
const verifyOtp = () => {
|
||||
const enteredOtp = otpInput.join('');
|
||||
|
||||
if (enteredOtp === otpNumber?.toString()) {
|
||||
setMessageType('success');
|
||||
setMessageData('OTP Verified Successfully');
|
||||
setOtpSent(false);
|
||||
setOtpInput(['', '', '', '']);
|
||||
HandleCloseModal();
|
||||
// setShowPaymentMethods(true);
|
||||
setOtpVerified(true);
|
||||
} else {
|
||||
setMessageType('error');
|
||||
setMessageData('Invalid OTP');
|
||||
setOtpInput(['', '', '', '']);
|
||||
setOtpIndex(0);
|
||||
}
|
||||
};
|
||||
const onComplete = useCallback(() => {
|
||||
setMessageData(null);
|
||||
setMessageType(null);
|
||||
}, []);
|
||||
return (
|
||||
<>
|
||||
<Messages
|
||||
messageType={messageType}
|
||||
messageData={messageData}
|
||||
onComplete={onComplete}
|
||||
/>
|
||||
<DefaultModal
|
||||
open={open}
|
||||
// handleCancel={HandleCloseModal}
|
||||
footer={false}
|
||||
width={900}
|
||||
// {width > 768 ? 900 : 700}
|
||||
children={
|
||||
<div className="BSOTPpaymentModal-Master">
|
||||
<h4 className="BSOTPTitlepayment">
|
||||
{isOtpEnabled ? 'Enter Mobile Number To Order' : 'PAYMENT'}
|
||||
</h4>
|
||||
<div className="BSOTPpaymentModal_main">
|
||||
{!otpSent && !otpVerifed && (
|
||||
<>
|
||||
<div className="BSOTPprompt">
|
||||
{/* <p style={{ fontFamily: 'Poppins', fontWeight: '600' }}>
|
||||
Get your order bill on your mobile <br />
|
||||
via SMS / Whatsapp
|
||||
</p> */}
|
||||
</div>
|
||||
|
||||
<div
|
||||
className={`BSOTPinputModal ${number ? 'green-border' : ''}`}
|
||||
>
|
||||
<input type="text" value={number} readOnly />
|
||||
{number?.length === 10 && !isIndianMobile(number) && (
|
||||
<div className="input-err">
|
||||
Please Enter Valid Mobile Number
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* input boxxes */}
|
||||
<div
|
||||
className="BSOTPdailpad-main"
|
||||
// style={{
|
||||
// pointerEvents: selectedPaymentOption && 'none',
|
||||
// opacity: selectedPaymentOption && '40%',
|
||||
// }}
|
||||
>
|
||||
<div
|
||||
className="BSOTPKiosk-dailpadModal"
|
||||
// style={{ backgroundColor: getKioskLightColourdata }}
|
||||
>
|
||||
<div className="BSOTPKioskPayment-dailpad-1">
|
||||
<p onClick={() => setNumberFun(1)}>1</p>
|
||||
<p onClick={() => setNumberFun(2)}>2</p>
|
||||
<p onClick={() => setNumberFun(3)}>3</p>
|
||||
</div>
|
||||
<div className="BSOTPKioskPayment-dailpad-2">
|
||||
<p onClick={() => setNumberFun(4)}>4</p>
|
||||
<p onClick={() => setNumberFun(5)}>5</p>
|
||||
<p onClick={() => setNumberFun(6)}>6</p>
|
||||
</div>
|
||||
<div className="BSOTPKioskPayment-dailpad-3">
|
||||
<p onClick={() => setNumberFun(7)}>7</p>
|
||||
<p onClick={() => setNumberFun(8)}>8</p>
|
||||
<p onClick={() => setNumberFun(9)}>9</p>
|
||||
</div>
|
||||
<div className="BSOTPKioskPayment-dailpad-4">
|
||||
<p onClick={handleBackspace}>
|
||||
<HiOutlineBackspace
|
||||
size={30}
|
||||
style={{ marginBottom: '-2px' }}
|
||||
/>
|
||||
</p>
|
||||
<p onClick={() => setNumberFun(0)}>0</p>
|
||||
<p style={{ background: 'none' }}></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{isOtpEnabled && (
|
||||
<>
|
||||
<button
|
||||
className="BSOTPKioskOPTBTn"
|
||||
// disabled={number?.length === 10}
|
||||
onClick={() => sendOTP()}
|
||||
>
|
||||
Get OTP
|
||||
</button>
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
{isOtpEnabled && otpSent && (
|
||||
<div className="BSOTPotp-section">
|
||||
<div style={{ fontFamily: 'Poppins', fontSize: '16px' }}>
|
||||
Enter OTP
|
||||
</div>
|
||||
{/* Mobile Number + Edit */}
|
||||
<div className="BSOTPotp-mobile-row">
|
||||
<span className="BSOTPotp-mobile-number">{number}</span>
|
||||
<button
|
||||
className="BSOTPotp-edit-btn"
|
||||
onClick={() => {
|
||||
setOtpSent(false);
|
||||
setOtpInput(['', '', '', '']);
|
||||
}}
|
||||
>
|
||||
Edit
|
||||
</button>
|
||||
``{' '}
|
||||
</div>
|
||||
|
||||
{/* 4 Digit OTP Input */}
|
||||
<div className='optEnterResendOTP'>
|
||||
<div className="BSOTPotp-input-container">
|
||||
{otpInput.map((digit, index) => (
|
||||
<input
|
||||
key={index}
|
||||
type="text"
|
||||
value={digit}
|
||||
className={`BSOTPotp-box ${index === otpIndex ? 'active' : ''}`}
|
||||
onClick={() => setOtpIndex(index)}
|
||||
readOnly
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<div className="BSOTPotp-buttons">
|
||||
{/* <button
|
||||
className="verify-btn"
|
||||
disabled={otpInput.join('').length !== 4}
|
||||
onClick={verifyOtp}
|
||||
>
|
||||
Verify
|
||||
</button> */}
|
||||
|
||||
<button
|
||||
className="BSOTPresend-btn"
|
||||
disabled={!canResend}
|
||||
onClick={sendOTP}
|
||||
>
|
||||
{canResend ? 'Resend OTP' : `Resend in ${resendTimer}s`}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="BSOTPKioskPayment-dailpad-main">
|
||||
<div
|
||||
className="BSOTPKiosk-dailpadModal"
|
||||
// style={{ backgroundColor: getKioskLightColourdata }}
|
||||
>
|
||||
<div className="BSOTPKioskPayment-dailpad-1">
|
||||
<p onClick={() => handleOtpNumber(1)}>1</p>
|
||||
<p onClick={() => handleOtpNumber(2)}>2</p>
|
||||
<p onClick={() => handleOtpNumber(3)}>3</p>
|
||||
</div>
|
||||
<div className="BSOTPKioskPayment-dailpad-2">
|
||||
<p onClick={() => handleOtpNumber(4)}>4</p>
|
||||
<p onClick={() => handleOtpNumber(5)}>5</p>
|
||||
<p onClick={() => handleOtpNumber(6)}>6</p>
|
||||
</div>
|
||||
<div className="BSOTPKioskPayment-dailpad-3">
|
||||
<p onClick={() => handleOtpNumber(7)}>7</p>
|
||||
<p onClick={() => handleOtpNumber(8)}>8</p>
|
||||
<p onClick={() => handleOtpNumber(9)}>9</p>
|
||||
</div>
|
||||
<div className="BSOTPKioskPayment-dailpad-4">
|
||||
<p onClick={handleOtpBackspace}>
|
||||
<HiOutlineBackspace size={30} />
|
||||
</p>
|
||||
<p onClick={() => handleOtpNumber(0)}>0</p>
|
||||
<p style={{ background: 'none' }}></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Buttons */}
|
||||
</div>
|
||||
)}
|
||||
{/* {(!isOtpEnabled || (otpVerifed)) && <>
|
||||
<p className="choiseTitle">Select Payment Method</p>
|
||||
{console.log('selectedOption', selectedPaymentOption)}
|
||||
<div
|
||||
className="paymentChoise"
|
||||
style={{
|
||||
pointerEvents:
|
||||
(!isIndianMobile(number) || selectedPaymentOption) &&
|
||||
'none',
|
||||
opacity:
|
||||
(!isIndianMobile(number) || selectedPaymentOption) && '40%',
|
||||
}}
|
||||
>
|
||||
|
||||
{counterAvailability && (
|
||||
<div
|
||||
className="upi"
|
||||
onClick={() => handlePaymentOption('Counter')}
|
||||
>
|
||||
<MdOutlinePayments size={50} opacity={0.5} />
|
||||
<p style={{ fontSize: '12px', textAlign: 'center' }}>
|
||||
PAY AT THE COUNTER
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
{paymentOptionDetailsBusinessUpi && (
|
||||
<div
|
||||
className="upi"
|
||||
onClick={() => handlePaymentOption('BU')}
|
||||
>
|
||||
<img src={UPI} alt="" width={60} />
|
||||
<p> UPI</p>
|
||||
</div>
|
||||
)}
|
||||
{!paymentOptionDetailsBusinessUpi && !counterAvailability && (
|
||||
<div className="payment-error-msg">
|
||||
Please Set Payment Options Contact Admin
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</>} */}
|
||||
</div>
|
||||
<div
|
||||
className={`BSOTPItem3Warning ${maxLimitExceeded ? 'showing' : ''}`}
|
||||
>
|
||||
<p>
|
||||
<IoIosWarning size={30} color="#b99400" />
|
||||
{maxLimitExceededMessage}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default CustomerMobileNumberModal;
|
||||
|
|
@ -0,0 +1,701 @@
|
|||
.BSOTPpaymentModal_main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
gap: 10px;
|
||||
|
||||
.BSOTPprompt {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: flex-start;
|
||||
text-align: left;
|
||||
|
||||
p {
|
||||
text-align: left;
|
||||
font-family: 'Gilroy';
|
||||
font-weight: 700;
|
||||
font-size: 26px;
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPKioskPayment-inputModal {
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 1rem 1rem;
|
||||
flex-direction: column;
|
||||
|
||||
.input-err {
|
||||
color: red;
|
||||
font-size: 13px;
|
||||
margin-top: 4px;
|
||||
font-family: 'Poppins', sans-serif;
|
||||
}
|
||||
|
||||
input {
|
||||
width: 50vw;
|
||||
height: 4rem;
|
||||
padding: 0rem 1rem;
|
||||
font-family: 'Gilroy', sans-serif;
|
||||
font-size: 22px;
|
||||
border: none;
|
||||
letter-spacing: 1px;
|
||||
font-weight: 500;
|
||||
border: 1px solid rgba(0, 0, 0, 0.199);
|
||||
border-radius: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPKiosk-dailpadModal {
|
||||
background-color: #e1eef1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 16px;
|
||||
padding: 10px 10px;
|
||||
border-radius: 8px;
|
||||
width: 60%;
|
||||
@media (max-width: 768px) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPpaymentChoise {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
column-gap: 3rem;
|
||||
row-gap: 1rem;
|
||||
|
||||
.BSOTPupi {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
width: 110px;
|
||||
height: 110px;
|
||||
border: 1px solid rgba(0, 0, 0, 0.199);
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
|
||||
p {
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPchoiseTitle {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
align-items: flex-start;
|
||||
padding: 1rem 2rem;
|
||||
}
|
||||
|
||||
.BSOTPKioskPayment-dailpad-main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 12px;
|
||||
padding: 16px 0px;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
.BSOTPKioskPayment-dailpad-1,
|
||||
.BSOTPKioskPayment-dailpad-2,
|
||||
.BSOTPKioskPayment-dailpad-3 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
column-gap: 1.5rem;
|
||||
row-gap: 2rem;
|
||||
|
||||
p {
|
||||
background-color: #fff;
|
||||
padding: 10px 10px;
|
||||
width: 25%;
|
||||
text-align: center;
|
||||
border-radius: 12px;
|
||||
cursor: pointer;
|
||||
font-family: 'Gilroy', sans-serif;
|
||||
font-weight: 600;
|
||||
font-size: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPKioskPayment-dailpad-4 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: row-reverse;
|
||||
column-gap: 1.5rem;
|
||||
|
||||
p {
|
||||
background-color: #fff;
|
||||
padding: 10px 10px;
|
||||
width: 25%;
|
||||
text-align: center;
|
||||
border-radius: 12px;
|
||||
cursor: pointer;
|
||||
font-family: 'Gilroy', sans-serif;
|
||||
font-weight: 600;
|
||||
font-size: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-modal .ant-modal-content {
|
||||
height: 90vh !important;
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPTitlepayment {
|
||||
margin: 0;
|
||||
color: rgba(0, 0, 0, 0.88);
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
line-height: 1.5;
|
||||
word-wrap: break-word;
|
||||
font-family: 'Barlow Condensed';
|
||||
font-size: 24px !important;
|
||||
}
|
||||
|
||||
.BSOTPpaymentCardMain {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
width: 100%;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
background-color: #fff;
|
||||
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
|
||||
padding: 1rem 1rem;
|
||||
height: 45vh;
|
||||
position: relative;
|
||||
|
||||
.ant-radio-wrapper .ant-radio-checked .ant-radio-inner {
|
||||
background-color: var(--SELECTED_COLOR) !important;
|
||||
border-color: var(--SELECTED_COLOR) !important;
|
||||
}
|
||||
|
||||
.BSOTPcardChooice {
|
||||
width: 40%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
row-gap: 10px;
|
||||
column-gap: 10px;
|
||||
}
|
||||
|
||||
.BSOTPcardoption {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
column-gap: 10px;
|
||||
// box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
|
||||
box-shadow:
|
||||
rgba(0, 0, 0, 0.1) 0px 10px 36px 0px,
|
||||
rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
|
||||
border-radius: 6px;
|
||||
|
||||
padding: 4px 14px;
|
||||
cursor: pointer;
|
||||
width: 95%;
|
||||
|
||||
img {
|
||||
width: 30px;
|
||||
height: 22px;
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPcardname {
|
||||
font-size: 16px;
|
||||
font-weight: 550;
|
||||
}
|
||||
|
||||
.BSOTPcardname2 {
|
||||
font-size: 11px;
|
||||
font-weight: 550;
|
||||
margin-top: -1px;
|
||||
}
|
||||
|
||||
.BSOTPbankChooice {
|
||||
width: 60%;
|
||||
border-radius: 6px;
|
||||
|
||||
.searchbar {
|
||||
display: flex;
|
||||
padding: 1px 12px;
|
||||
// border: 1px solid #1c1c1c;
|
||||
// box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
|
||||
box-shadow:
|
||||
rgba(0, 0, 0, 0.16) 0px 10px 36px 0px,
|
||||
rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
|
||||
|
||||
border-radius: 6px;
|
||||
align-items: center;
|
||||
// border: 1px solid black;
|
||||
}
|
||||
|
||||
input {
|
||||
border: none;
|
||||
outline: none;
|
||||
padding: 1px 10px;
|
||||
}
|
||||
|
||||
.titlechoose {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 16px;
|
||||
column-gap: 1rem;
|
||||
padding-bottom: 9px;
|
||||
border-bottom: 1px solid #1c1c1c;
|
||||
}
|
||||
|
||||
.choosecardMain {
|
||||
padding: 10px 10px;
|
||||
margin-top: -1rem;
|
||||
}
|
||||
|
||||
.bankname {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 10px;
|
||||
font-size: 16px;
|
||||
padding: 10px 10px;
|
||||
font-weight: 500;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPbuttonOfpay {
|
||||
position: absolute;
|
||||
bottom: -60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
column-gap: 11rem;
|
||||
padding: 1rem 4rem;
|
||||
|
||||
.inr {
|
||||
font-size: 22px;
|
||||
color: #4eb14e;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.primary_Button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 10px 16px;
|
||||
cursor: pointer;
|
||||
background-color: #4eb14e !important;
|
||||
color: #fff;
|
||||
border-radius: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.searchbar :focus {
|
||||
.ant-input-outlined {
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
.searchbar:focus-within {
|
||||
.ant-input-outlined {
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
.searchbar .ant-input-search .ant-input:focus {
|
||||
background-color: #fff !important;
|
||||
border: #fff !important;
|
||||
}
|
||||
|
||||
.searchbar .ant-input-search .ant-input:focus {
|
||||
border-color: #fff !important;
|
||||
}
|
||||
|
||||
.paymentCardMain .ant-collapse {
|
||||
width: 100%;
|
||||
border: none;
|
||||
// box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
|
||||
box-shadow:
|
||||
rgba(0, 0, 0, 0.16) 0px 10px 36px 0px,
|
||||
rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
|
||||
}
|
||||
|
||||
.paymentCardMain .ant-radio-group,
|
||||
.ant-radio-wrapper span.ant-radio + * {
|
||||
padding: 10px 10px;
|
||||
}
|
||||
|
||||
.paymentCardMain .ant-modal .ant-modal-content {
|
||||
padding: 54px 35px !important;
|
||||
}
|
||||
|
||||
.paymentCardMain
|
||||
.ant-collapse
|
||||
.ant-collapse-item:last-child
|
||||
> .ant-collapse-content {
|
||||
overflow: scroll;
|
||||
height: 26vh;
|
||||
}
|
||||
|
||||
.paymentCardMain .ant-input-search .ant-input:hover,
|
||||
.paymentCardMain .ant-input:hover {
|
||||
border: none;
|
||||
outline: none;
|
||||
|
||||
&:focus {
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.BSOTPpaymentModal_main .BSOTPKiosk-dailpadModal {
|
||||
padding: 2rem 0rem;
|
||||
}
|
||||
|
||||
.BSOTPpaymentModal_main .BSOTPpaymentChoise {
|
||||
column-gap: 1rem;
|
||||
}
|
||||
|
||||
.BSOTPpaymentModal_main .BSOTPpaymentChoise .upi {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.BSOTPpaymentModal_main .BSOTPbuttonOfpay {
|
||||
width: max-content;
|
||||
}
|
||||
|
||||
.BSOTPTitlepayment {
|
||||
text-wrap: nowrap;
|
||||
font-size: 19px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPpayment-modal {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
background: white;
|
||||
width: 420px;
|
||||
height: 540px;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 4px 25px rgba(0, 0, 0, 0.2);
|
||||
padding: 16px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.BSOTPmodal-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
// filter: blur(5px);
|
||||
// pointer-events: none;
|
||||
// user-select: none;
|
||||
width: 70vw;
|
||||
margin: 1rem 0;
|
||||
font-family: 'Poppins';
|
||||
font-weight: 500;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
width: 95vw;
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPpayment-modal {
|
||||
position: fixed;
|
||||
z-index: 1000;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
border-radius: 0;
|
||||
height: 100%;
|
||||
backdrop-filter: blur(5px);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
backdrop-filter: blur(8px);
|
||||
-webkit-backdrop-filter: blur(8px);
|
||||
/* for Safari */
|
||||
}
|
||||
|
||||
.BSOTPpaymentclose-btn {
|
||||
width: max-content;
|
||||
height: max-content;
|
||||
border: none;
|
||||
background-color: unset;
|
||||
color: #ff0000;
|
||||
cursor: pointer;
|
||||
font-size: 20px;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.BSOTPpayment-frame {
|
||||
width: 70vw;
|
||||
height: 70vh;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
width: 95vw;
|
||||
height: 80vh;
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPKioskOPTBTn {
|
||||
width: 60%;
|
||||
padding: 12px 16px;
|
||||
font-size: 20px;
|
||||
font-family: 'Poppins';
|
||||
font-weight: 400;
|
||||
border: none;
|
||||
outline: none;
|
||||
background-color: #000000;
|
||||
color: #fff;
|
||||
border-radius: 10px;
|
||||
cursor: pointer;
|
||||
@media (max-width: 768px) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPotp-section {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
|
||||
.BSOTPotp-mobile-row {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 15px;
|
||||
margin-bottom: 20px;
|
||||
font-family: 'Poppins';
|
||||
|
||||
.BSOTPotp-mobile-number {
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.BSOTPotp-edit-btn {
|
||||
background: none;
|
||||
border: none;
|
||||
color: #007bff;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
font-family: 'Poppins';
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPotp-input-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 20px;
|
||||
|
||||
.BSOTP-otp-box {
|
||||
width: 65px;
|
||||
height: 65px;
|
||||
font-size: 28px;
|
||||
text-align: center;
|
||||
border: 2px solid #ccc;
|
||||
border-radius: 8px;
|
||||
outline: none;
|
||||
transition: 0.2s ease;
|
||||
|
||||
&:focus {
|
||||
border-color: #28a745;
|
||||
box-shadow: 0 0 6px rgba(40, 167, 69, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
.otp-box.active {
|
||||
border: 2px solid #28a745;
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPotp-buttons {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 20px;
|
||||
|
||||
button {
|
||||
min-width: 140px;
|
||||
padding: 12px 18px;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
transition: 0.2s ease;
|
||||
font-family: 'Poppins', sans-serif !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
&:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
|
||||
.verify-btn {
|
||||
background-color: #28a745;
|
||||
border: none;
|
||||
color: #fff;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background-color: #218838;
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPresend-btn {
|
||||
background-color: #ffc107;
|
||||
border: none;
|
||||
color: #000;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background-color: #e0a800;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.BSOTPItem3Warning {
|
||||
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 */
|
||||
.BSOTPItem3Warning.showing {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
|
||||
p {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPinputModal {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
.input-err {
|
||||
font-family: 'Poppins', sans-serif;
|
||||
font-size: 12px;
|
||||
margin-top: 6px;
|
||||
color: rgb(224, 0, 0);
|
||||
}
|
||||
input {
|
||||
width: 60%;
|
||||
outline: none;
|
||||
font-family: 'Poppins', sans-serif;
|
||||
font-weight: 600;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
height: 45px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #333;
|
||||
font-size: 20px;
|
||||
@media (max-width: 768px) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.BSOTPdailpad-main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 12px;
|
||||
padding: 14px 0px;
|
||||
align-items: center;
|
||||
overflow-x: hidden;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.BSOTPotp-box {
|
||||
width: 55px;
|
||||
height: 55px;
|
||||
font-size: 24px;
|
||||
text-align: center;
|
||||
border: 2px solid #ccc;
|
||||
border-radius: 8px;
|
||||
outline: none;
|
||||
transition: 0.2s ease;
|
||||
font-family: 'Poppins';
|
||||
font-weight: 500;
|
||||
|
||||
&:focus {
|
||||
border-color: #28a745;
|
||||
box-shadow: 0 0 6px rgba(40, 167, 69, 0.4);
|
||||
}
|
||||
}
|
||||
|
||||
.BSOTPotp-box.active {
|
||||
border: 2px solid #28a745;
|
||||
}
|
||||
.BSOTPpaymentModal-Master {
|
||||
scrollbar-width: thin;
|
||||
height: 90vh;
|
||||
overflow: auto;
|
||||
}
|
||||
.optEnterResendOTP {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
|
@ -136,8 +136,11 @@ const BSCustomerSelect = ({ TopName = null }) => {
|
|||
);
|
||||
const BSLayout1Data = useSelector(getTemplateData);
|
||||
const selOption = useSelector(GlobalSelOption);
|
||||
console.log(selOption, 'selOption');
|
||||
const GetCustId = useSelector(GlobalCustId);
|
||||
console.log(GetCustId, 'GetCustId');
|
||||
const Custdisable = useSelector(GlobalSelectedCustDisable);
|
||||
console.log(Custdisable, 'Custdisable');
|
||||
const SessionData = useSelector(StoredSessionData);
|
||||
const OrderOfferDetails = useSelector(
|
||||
GlobalOfferAppliedProducts,
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -192,12 +192,25 @@ export const usePaymentOptions = ({ AppId, CompId, BranchId, UserId }) => {
|
|||
) === undefined &&
|
||||
Pay_at_the_counter !== undefined;
|
||||
|
||||
if (UpiCondition) {
|
||||
let BusinessUPI = Formated_Payment_Details?.find((item) => item.OptionName == 'Business Upi')
|
||||
if (UpiCondition || BusinessUPI) {
|
||||
let UpiDetailsResponse = await dispatch(
|
||||
getPaymentUPIDetails({ CompId, AppId, BranchId, DetailType: 'U' })
|
||||
).unwrap();
|
||||
let BusinessUpi = await dispatch(
|
||||
getPaymentUPIDetails({ CompId, AppId, BranchId, DetailType: 'BU' })
|
||||
).unwrap();
|
||||
let data = BusinessUpi?.data?.data
|
||||
const hasNonUPI = Formated_Payment_Details
|
||||
?.find(item => item.OptionName === 'Pay at the counter')
|
||||
?.ModeDetails
|
||||
?.every(e => e?.ModeName !== "UPI");
|
||||
|
||||
const hasChooseBusinessUpi = Formated_Payment_Details
|
||||
?.find(item => item.OptionName === 'Business Upi')
|
||||
?.ModeDetails
|
||||
if (
|
||||
UpiDetailsResponse?.data?.statusCode === 0 &&
|
||||
UpiDetailsResponse?.data?.statusCode === 0 && BusinessUpi?.data?.statusCode === 0 && BusinessUpi?.data?.data?.length === 0 &&
|
||||
UpiDetailsResponse?.data?.data?.length === 0
|
||||
) {
|
||||
Formated_Payment_Details = Formated_Payment_Details.map((item) => {
|
||||
|
|
@ -210,6 +223,62 @@ export const usePaymentOptions = ({ AppId, CompId, BranchId, UserId }) => {
|
|||
return item;
|
||||
});
|
||||
}
|
||||
else if (BusinessUpi?.data?.data?.length === 1 && hasNonUPI && hasChooseBusinessUpi) {
|
||||
Formated_Payment_Details = Formated_Payment_Details.map((item) => {
|
||||
if (item.OptionName === 'Pay at the counter') {
|
||||
let reqDatfromBusinessUpi = BusinessUPI?.ModeDetails?.[0]
|
||||
|
||||
return {
|
||||
...item,
|
||||
ModeDetails: [
|
||||
...item?.ModeDetails,
|
||||
{
|
||||
"PaymentOptionId": reqDatfromBusinessUpi?.PaymentOptionId,
|
||||
"PaymentModeId": reqDatfromBusinessUpi?.PaymentModeId,
|
||||
"ModeId": reqDatfromBusinessUpi?.ModeId,
|
||||
"ModeName": "UPI",
|
||||
"ModeDefault": "Y",
|
||||
"ModeImage": "",
|
||||
"PayOpt": null,
|
||||
"CardType": null,
|
||||
"MerchantUPIId": null,
|
||||
"MerchantMobile": null,
|
||||
"MerchantNumber": null,
|
||||
"RefreshToken": null,
|
||||
"Token": null,
|
||||
"MerchantId": null,
|
||||
"ActiveStatus": reqDatfromBusinessUpi?.ActiveStatus,
|
||||
"CreatedBy": 0,
|
||||
"CreatedDate": "2026-03-03T19:07:54.393",
|
||||
"UpdatedBy": null,
|
||||
"UpdatedDate": null,
|
||||
"MethodDetails": []
|
||||
}
|
||||
],
|
||||
};
|
||||
}
|
||||
|
||||
// IMPORTANT: return other items unchanged
|
||||
return item;
|
||||
});
|
||||
}
|
||||
else if (UpiDetailsResponse?.data?.statusCode === 0 && UpiDetailsResponse?.data?.data?.length === 0) {
|
||||
Formated_Payment_Details = Formated_Payment_Details.map((item) => {
|
||||
if (item.OptionName === 'Pay at the counter') {
|
||||
return {
|
||||
...item,
|
||||
ModeDetails: Pay_at_the_counter_witoutUPIMode,
|
||||
};
|
||||
}
|
||||
return item;
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
////
|
||||
|
||||
}
|
||||
|
||||
if (
|
||||
|
|
|
|||
|
|
@ -968,16 +968,6 @@ const KioskPayment = (props) => {
|
|||
};
|
||||
await dispatch(sendSms(postData));
|
||||
}
|
||||
const goFullScreen = () => {
|
||||
const elem = document.documentElement;
|
||||
|
||||
if (!document.fullscreenElement) {
|
||||
elem.requestFullscreen?.().catch((err) => {
|
||||
console.log("Fullscreen error:", err);
|
||||
});
|
||||
}
|
||||
};
|
||||
goFullScreen();
|
||||
clearAllStates();
|
||||
} else {
|
||||
if (
|
||||
|
|
@ -1954,7 +1944,7 @@ const KioskPayment = (props) => {
|
|||
open={open}
|
||||
handleCancel={!selectedPaymentOption && HandleCloseModal}
|
||||
footer={false}
|
||||
width={width > 768 ? 900 : 700}
|
||||
width={width > 768 ? 800 : 600}
|
||||
children={
|
||||
showPaymentGatewayOptions ? (
|
||||
<div className="paymentCardMain">
|
||||
|
|
|
|||
|
|
@ -560,4 +560,5 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -31,6 +31,7 @@ import { DefaultModal } from '../../../Components/Modal/DefaultModal.jsx';
|
|||
import { DropDowns } from '../../../Components/Forms/DropDown.jsx';
|
||||
import { useAuth } from '../../../AuthContext.jsx';
|
||||
import { FeatureAddon } from '../../../Features/BookingScreen/BookingData/BookingData.js';
|
||||
import "../../../Pages/openingStock/openingStockForm.scss"
|
||||
|
||||
const PaymentDetailsList = () => {
|
||||
const { SadminuserAccess } = useAuth();
|
||||
|
|
|
|||
|
|
@ -67,6 +67,7 @@ const PreferenceList = () => {
|
|||
dashboard: allSettingsMap['dashboard']?.value === 'Y',
|
||||
shortcutkeys: allSettingsMap['shortcutkeys']?.value === 'Y',
|
||||
autoreceivestock: allSettingsMap['autoreceivestock']?.value === 'Y',
|
||||
salespageaskiosk: allSettingsMap['salespageaskiosk']?.value === 'Y',
|
||||
kioskotp: allSettingsMap['kioskotp']?.value === 'Y',
|
||||
decimal: allSettingsMap['decimal']?.value === 'Y',
|
||||
enabledModules: [
|
||||
|
|
@ -308,6 +309,7 @@ const PreferenceList = () => {
|
|||
dashboard: values.dashboard,
|
||||
shortcutkeys: values.shortcutkeys,
|
||||
autoreceivestock: values.autoreceivestock,
|
||||
salespageaskiosk: values.salespageaskiosk,
|
||||
kioskotp: values.kioskotp,
|
||||
decimal: values.decimal,
|
||||
searchfocus: values.searchfocus,
|
||||
|
|
@ -512,6 +514,10 @@ const PreferenceList = () => {
|
|||
{renderCheckbox(
|
||||
'decimal',
|
||||
'Display values with 2 decimal places throughout the app?'
|
||||
)}
|
||||
{renderCheckbox(
|
||||
'salespageaskiosk',
|
||||
'Do you want to open sales page as kiosk layout?'
|
||||
)}
|
||||
{(allSettingsMap['onlineindividualslots'] !== undefined ||
|
||||
allSettingsMap['allow individual booking'] !== undefined ||
|
||||
|
|
|
|||
|
|
@ -23,6 +23,7 @@ import {
|
|||
} from '../../Features/UpiDetails/UpiDetails.js';
|
||||
import { changeBreadCrumb } from '../../Features/AppPage/CenterPage.js';
|
||||
import { DefaultModal } from '../../Components/Modal/DefaultModal.jsx';
|
||||
import "../../Pages/openingStock/openingStockForm.scss"
|
||||
|
||||
const UpiDetailslist = () => {
|
||||
const navigateTo = useNavigate();
|
||||
|
|
|
|||
|
|
@ -299,3 +299,12 @@
|
|||
.purchase-entry-form {
|
||||
width: 100%;
|
||||
}
|
||||
.otpInput {
|
||||
width: 2.5rem !important;
|
||||
height: 2.5rem;
|
||||
margin: 0 0.14rem;
|
||||
font-size: 1rem;
|
||||
text-align: center;
|
||||
border-radius: 4px;
|
||||
border: 1px solid rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
|
@ -30,6 +30,7 @@
|
|||
display: flex;
|
||||
flex-direction: row;
|
||||
column-gap: 0.5rem;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.defaultandCustomisedTheme {
|
||||
|
|
|
|||
|
|
@ -27,8 +27,8 @@
|
|||
display: flex;
|
||||
flex-direction: row;
|
||||
column-gap: 0.5rem;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
// Branch Login Design by Vicky
|
||||
|
||||
.branchLoginMaster {
|
||||
|
|
|
|||
Loading…
Reference in New Issue