karthikalakshmi
/
Android_Retail
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

CountUp status

This commit is contained in:
vignesh 2026-03-23 10:21:45 +05:30
parent a5a004bbcf
commit 47705e35f9
9 changed files with 296 additions and 2824 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable1/BST1Payment.jsx
View File

@ -220,6 +220,7 @@ import BSCustomerSelect from '../../UtillComponents/BSSelectCustomer.jsx';
import PozoAddCustomerIcon from '../../UtillComponents/Pozo retail icons/PozoAddCustomerIcon.jsx';
import PozoCartIcon from '../../UtillComponents/PozoCartIcon.jsx';
import BSBillingTable3 from '../BSBillingTable3/BSBillingTable3.jsx';
import useCountUp from '../../UtillComponents/useCountUp.jsx';
const subDirectory = import.meta.env.ENV_BASE_URL;
const MainHomeUrl = import.meta.env.ENV_MAIN_BASE_URL;
@ -3584,6 +3585,17 @@ export default function BST1Payment() {
(arr) => Array.isArray(arr) && arr.some((err) => err)
);
};
const CountUp = useCountUp(
safeRound(
OrderType === 'Failed'
? FailedTotalAmt
: credit && overAllBal >= 0
? Math.max(0, TotalAmount - overAllBal)
: TotalAmount
)
);
return (
<>
<div className="BST1-Payment-structure">
@ -4291,8 +4303,8 @@ export default function BST1Payment() {
</div>
) : (
<div>
₹{' '}
<CountUp
₹{CountUp}
{/* <CountUp
duration={0.4}
className="counter"
end={safeRound(
@ -4302,7 +4314,7 @@ export default function BST1Payment() {
? Math.max(0, TotalAmount - overAllBal)
: TotalAmount
)}
/>
/> */}
</div>
)
) : (

48
src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable1/BalanceAndReceived.jsx
View File

@ -7,12 +7,12 @@ import {
PreferenceData,
} from '../../../../../Features/BookingScreen/BookingData/BookingData';
import { GlobalSelectedFont } from '../../../../../Features/ThemeChange/ThemeChange';
import CountUp from 'react-countup';
import '../../../../../Styles/BookingScreen/Components/BSBillingTables/BSBillingTable1/BSBPayment.scss';
import { useAuth } from '../../../../../AuthContext';
import TooltipWrapper from '../../../../../Components/Tooltip/Tooltip';
import { isMobile } from 'react-device-detect';
import { getSession } from '../../../../../Services/Others';
import useCountUp from '../../UtillComponents/useCountUp';
const PaymentInput = ({
orderType,
@ -50,7 +50,11 @@ const PaymentInput = ({
const [addnewAccess, setaddnewAccess] = useState(true);
const UserType = getSession('UserType');
const preferenceDatas = useSelector(PreferenceData);
const allowDecimal = preferenceDatas?.[0]?.SettingDtlDetails?.find((setting) => setting?.SettingIdName?.toLowerCase() === "decimal" && setting?.SettingValue === 'Y');
const allowDecimal = preferenceDatas?.[0]?.SettingDtlDetails?.find(
(setting) =>
setting?.SettingIdName?.toLowerCase() === 'decimal' &&
setting?.SettingValue === 'Y'
);
useEffect(() => {
const receivedInput = document.getElementById('recived');
@ -116,6 +120,10 @@ const PaymentInput = ({
return allowDecimal ? num.toFixed(2) : Math.round(num).toString();
}
const CountUp = useCountUp(
OrderType === 'Failed' ? failedTotalAmt : safeRound(totalAmount)
);
return (
<>
{BillingTableName === 'BillingTable1' && (
@ -157,17 +165,35 @@ const PaymentInput = ({
style={{ fontFamily: FontFamily['head'] }}
>
{isMobile &&
(!OrderStatus ? salesBillEdit && (currentOrderNetAmount < previousNetAmount) ? <div>Refund: ₹{(previousNetAmount || 0) - (currentOrderNetAmount || 0)}</div> :
(!OrderStatus ? (
salesBillEdit && currentOrderNetAmount < previousNetAmount ? (
<div>
Refund: ₹
{(previousNetAmount || 0) - (currentOrderNetAmount || 0)}
</div>
) : (
`₹ ${Math.round(
OrderType === 'Failed' ? failedTotalAmt : credit && overAllBal >= 0
OrderType === 'Failed'
? failedTotalAmt
: credit && overAllBal >= 0
? Math.max(0, totalAmount - overAllBal)
: totalAmount
)}`
: 'ORDER')}
)
) : (
'ORDER'
))}
{!isMobile && !OrderStatus && ((salesBillEdit && (currentOrderNetAmount < previousNetAmount)) ? <div>Refund: ₹{(previousNetAmount || 0) - (currentOrderNetAmount || 0)}</div> : (
{!isMobile &&
!OrderStatus &&
(salesBillEdit && currentOrderNetAmount < previousNetAmount ? (
<div>
Refund: ₹
{(previousNetAmount || 0) - (currentOrderNetAmount || 0)}
</div>
) : (
<>
₹{' '}
₹ {CountUp}
{/* <CountUp
duration={0.4}
className="counter"
@ -175,11 +201,13 @@ const PaymentInput = ({
OrderType === "Failed" ? failedTotalAmt : safeRound(totalAmount)
)}
/> */}
{OrderType === 'Failed'
{/* {OrderType === 'Failed'
? failedTotalAmt
: safeRound((credit && overAllBal >= 0)
: safeRound(
credit && overAllBal >= 0
? Math.max(0, totalAmount - overAllBal)
: totalAmount)}
: totalAmount
)} */}
</>
))}

18
src/Pages/BookingScreen/Components/BSBillingTables/BSBillingTable3/BSBillingTable3pay.jsx
View File

@ -210,6 +210,7 @@ import UpiPopover from '../StandardTable/Utils/UpiPopOver.jsx';
import MobileMultiPdfPrintTrigger from '../../UtillComponents/MobileMultiPdfPrintTrigger.jsx';
import { useDateStore } from '../../../../../Features/BookingScreen/BookingData/DateStore.js';
import CustomerMobileNumberModal from '../../BookingFunctionality/CustomerOTP.jsx';
import useCountUp from '../../UtillComponents/useCountUp.jsx';
const PaymentGatewayEmbedded = lazy(
() => import('../../UtillComponents/PaymentGatewayEmbedded.jsx')
);
@ -3636,6 +3637,17 @@ const BSBillingTable3Pay = () => {
(arr) => Array.isArray(arr) && arr.some((err) => err)
);
};
const CountUp = useCountUp(
safeRound(
OrderType === 'Failed'
? FailedTotalAmt
: credit && overAllBal >= 0
? Math.max(0, TotalAmount - overAllBal)
: TotalAmount
)
);
return (
<>
<div className="BSBilling3PayMaster">
@ -4537,8 +4549,8 @@ const BSBillingTable3Pay = () => {
)}`
) : (
<div>
₹{' '}
<CountUp
₹ {CountUp}
{/* <CountUp
duration={0.4}
className="counter"
end={safeRound(
@ -4548,7 +4560,7 @@ const BSBillingTable3Pay = () => {
? Math.max(0, TotalAmount - overAllBal)
: TotalAmount
)}
/>
/> */}
</div>
)}
</p>

17
src/Pages/BookingScreen/Components/BSBillingTables/StandardTable/StandardTablePayment.jsx
View File

@ -233,6 +233,7 @@ import { MdSms } from 'react-icons/md';
import '../../../../BookingScreen/Components/BSBillingTables/StandardTable/StandardTable.scss';
import BSCustomerSelect from '../../UtillComponents/BSSelectCustomer.jsx';
import BSNavBarAddUser from '../../UtillComponents/BSNavBarAddUser.jsx';
import useCountUp from '../../UtillComponents/useCountUp.jsx';
//
const subDirectory = import.meta.env.ENV_BASE_URL;
@ -3430,6 +3431,16 @@ const StandardTablePayment = () => {
return allowDecimal ? num.toFixed(2) : Math.round(num).toString();
}
const CountUp = useCountUp(
safeRound(
OrderType === 'Failed'
? FailedTotalAmt
: credit && overAllBal >= 0
? Math.max(0, TotalAmount - overAllBal)
: TotalAmount
)
);
return (
<div className="booking-table-footer" style={{ padding: '0' }}>
<Messages
@ -3942,8 +3953,8 @@ const StandardTablePayment = () => {
)}`
) : (
<div>
₹{' '}
<CountUp
₹{CountUp}
{/* <CountUp
duration={0.4}
className="counter"
end={safeRound(
@ -3953,7 +3964,7 @@ const StandardTablePayment = () => {
? Math.max(0, TotalAmount - overAllBal)
: TotalAmount
)}
/>
/> */}
</div>
)}
</p>

2631
src/Pages/BookingScreen/Components/BSBillingTables/StandardTable/StandardTablePaymentBackup.jsx
View File

File diff suppressed because it is too large Load Diff

17
src/Pages/BookingScreen/Components/BSCombo/BSC1Payment.jsx
View File

@ -269,6 +269,7 @@ import {
} from '../../../../Features/Offer/Offernew/BookingOffernew.js';
import pozologoimg from '../../../../Images/pozologoimg.png';
import CustomerOrders from '../BookingFunctionality/CustomerOrders.jsx';
import useCountUp from '../UtillComponents/useCountUp.jsx';
const PaymentGatewayEmbedded = lazy(
() => import('../UtillComponents/PaymentGatewayEmbedded.jsx')
);
@ -3505,6 +3506,16 @@ const BSC1Payment = (props) => {
);
};
const CountUp = useCountUp(
safeRound(
OrderType === 'Failed'
? FailedTotalAmt
: credit && overAllBal >= 0
? Math.max(0, TotalAmount - overAllBal)
: TotalAmount
)
);
return (
<>
<div
@ -4650,8 +4661,8 @@ const BSC1Payment = (props) => {
)}`
) : (
<div>
₹
<CountUp
₹ {CountUp}
{/* <CountUp
duration={0.4}
className="counter"
end={safeRound(
@ -4661,7 +4672,7 @@ const BSC1Payment = (props) => {
? Math.max(0, TotalAmount - overAllBal)
: TotalAmount
)}
/>
/> */}
</div>
)}
<AiOutlineArrowRight width="25px" height="25px" />

87
src/Pages/BookingScreen/Components/UtillComponents/BSComboNavBarPreOrder.jsx
View File

@ -138,6 +138,7 @@ import { GlobalAddCustomerDetails } from '../../../../Features/BookingScreen/Cus
import SplitPayment from '../BookingFunctionality/SplitPaymentPreorder.jsx';
import PaymentPdfBooking from '../../../paymentpdfPage/PaymentPdfBooking.jsx';
import { getCustomerDisplayWindow } from '../../../../Features/customerDisplayWindow/customerDisplayWindow.js';
import useCountUp from './useCountUp.jsx';
const MainHomeUrl = import.meta.env.ENV_MAIN_BASE_URL;
@ -466,10 +467,10 @@ const BSComboNavBarPreOrder = () => {
TotalCalculation();
}, [GlobalExtraCharge]);
const OnChangeCancelPaymentOption = async (params) => {
const OnChangeCancelPaymentOption = async (params) => {
setCancelPaymentOption(params);
cancelformRef?.current?.setFieldsValue({ CancelPayOptions: params });
}
};
useEffect(() => {
if (Array.isArray(PreOrderList)) {
@ -663,7 +664,9 @@ const OnChangeCancelPaymentOption = async (params) => {
),
onFilter: (value, record) => {
return (
String(record.OrderId)?.toLowerCase().includes(value?.toLowerCase()) ||
String(record.OrderId)
?.toLowerCase()
.includes(value?.toLowerCase()) ||
String(record?.CustomerDetails?.[0]?.CustSuppName)
?.toLowerCase()
.includes(value?.toLowerCase()) ||
@ -673,7 +676,9 @@ const OnChangeCancelPaymentOption = async (params) => {
String(formatDate(record?.DeliveryDate, record.DeliveryTime))
?.toLowerCase()
.includes(value?.toLowerCase()) ||
String(record.PaidAmount)?.toLowerCase().includes(value?.toLowerCase())
String(record.PaidAmount)
?.toLowerCase()
.includes(value?.toLowerCase())
);
},
ellipsis: true,
@ -741,7 +746,6 @@ const OnChangeCancelPaymentOption = async (params) => {
return match ? match[1] : null;
};
const handlerefundvalidator = (_, value) => {
const paidAmount = parseFloat(PreOrderData?.PaidAmount ?? 0);
const refundAmount = parseFloat(value ?? 0);
@ -754,7 +758,6 @@ const OnChangeCancelPaymentOption = async (params) => {
const OnchangeRefund = async (e) => {
setPreOrderRefund(e?.target?.value);
};
const TotalCalculation = async () => {
let totalSum;
@ -2736,21 +2739,15 @@ const OnChangeCancelPaymentOption = async (params) => {
};
const handlePreOrderDelete = async (params) => {
if (params?.PaidAmount > 0) {
setCancelModal(true);
setPreOrderData(params)
setPreOrderData(params);
} else {
PreOrderCancel(params);
}
else {
PreOrderCancel(params)
}
};
const PreOrderCancel = async (params) => {
const CancelDat = {
AppId: AppId,
CompId: CompId,
@ -2759,13 +2756,14 @@ const OnChangeCancelPaymentOption = async (params) => {
...(params?.PaidAmount > 0 && {
OrderPaymentDtl: [
{
PaymentType: cancelformRef?.current?.getFieldsValue()?.CancelPayOptions,
PaymentType:
cancelformRef?.current?.getFieldsValue()?.CancelPayOptions,
Amount: cancelformRef?.current?.getFieldsValue()?.RefundAmount || 0,
PaymentStatus: "S"
}
]
PaymentStatus: 'S',
},
],
}),
CreatedBy: UserId
CreatedBy: UserId,
};
let DeleteResponse = await dispatch(PreOrderBookingDataCancel(CancelDat));
if (DeleteResponse?.payload?.data?.statusCode === 1) {
@ -2781,8 +2779,7 @@ const OnChangeCancelPaymentOption = async (params) => {
setMessageType('error');
setMessageData(DeleteResponse?.payload?.data?.response);
}
}
};
const History_onSearch = (value) => {
HistorysetSearchedText(value);
@ -3043,6 +3040,8 @@ const OnChangeCancelPaymentOption = async (params) => {
await dispatch(ChangeSearchFocusPreOrder(true));
};
const CountUp = useCountUp(Math.round(PreOrderAdvance));
return (
<>
<Messages
@ -3130,9 +3129,9 @@ const OnChangeCancelPaymentOption = async (params) => {
<Button
icon={<FiPlus />}
onClick={async () => {
await dispatch(changePreOrderAdditem('AddItems')),
(await dispatch(changePreOrderAdditem('AddItems')),
setTotalAmount(),
setBalaceAmount();
setBalaceAmount());
}}
>
Add Item
@ -3729,12 +3728,12 @@ const OnChangeCancelPaymentOption = async (params) => {
color: Color['lightColor'],
}}
>
₹{' '}
<CountUp
₹ {CountUp}
{/* <CountUp
duration={0.4}
className="counter"
end={Math.round(PreOrderAdvance)}
/>
/> */}
</button>
{PreOrderAdvance > 1 &&
PreOrderAdvance != null &&
@ -4308,21 +4307,30 @@ const OnChangeCancelPaymentOption = async (params) => {
width={700}
>
<div className="PreOrder-cancel-details">
{/* Summary Block */}
<div className="summary-box">
<div className="summary-row">
<span className="summary-label">Bill Amount:</span>
<span className="summary-value">₹ {PreOrderData?.NetAmount ?? 0}</span>
<span className="summary-value">
₹ {PreOrderData?.NetAmount ?? 0}
</span>
</div>
<div className="summary-row">
<span className="summary-label">Advance Paid:</span>
<span className="summary-value">₹ {PreOrderData?.PaidAmount ?? 0}</span>
<span className="summary-value">
₹ {PreOrderData?.PaidAmount ?? 0}
</span>
</div>
</div>
{/* Refund Amount Input */}
<Form style={{ display: 'flex', gap: '0.5rem', flexWrap: 'wrap' }} ref={cancelformRef} onFinish={() => { PreOrderCancel(PreOrderData) }}>
<Form
style={{ display: 'flex', gap: '0.5rem', flexWrap: 'wrap' }}
ref={cancelformRef}
onFinish={() => {
PreOrderCancel(PreOrderData);
}}
>
<Form.Item
name="RefundAmount"
rules={[
@ -4360,7 +4368,6 @@ const OnChangeCancelPaymentOption = async (params) => {
/>
</Form.Item>
{/* Payment Method Dropdown */}
<Form.Item
name="CancelPayOptions"
@ -4372,13 +4379,14 @@ const OnChangeCancelPaymentOption = async (params) => {
]}
>
<DropDowns
options={PaymentOptions
?.filter(option => option.ModeName !== 'Credit' && option.ModeName !== 'Card')
?.map(option => ({
options={PaymentOptions?.filter(
(option) =>
option.ModeName !== 'Credit' &&
option.ModeName !== 'Card'
)?.map((option) => ({
value: option.ModeId,
label: option.ModeName,
}))
}
}))}
label={<label className="required">Payment Method</label>}
isOnchanges={!!CancelPaymentOption}
onChangeFunction={OnChangeCancelPaymentOption}
@ -4392,7 +4400,6 @@ const OnChangeCancelPaymentOption = async (params) => {
flexWrap: 'wrap',
justifyContent: 'end',
width: '100%',
}}
>
<Buttons
@ -4401,11 +4408,7 @@ const OnChangeCancelPaymentOption = async (params) => {
icon={<ArrowRightOutlined />}
/>
</div>
</Form>
</div>
</Modal>
)}

1
src/Pages/BookingScreen/Components/UtillComponents/BSNavBarPreOrder.jsx
View File

@ -3952,7 +3952,6 @@ const BSNavBarPreOrder = ({
color: Color['lightColor'],
}}
>
{/* ₹ <CountUp duration={0.4} className="counter" end={Math.round(PreOrderAdvance)} /> */}
₹ {safeRound(PreOrderAdvance)}
</button>
{PreOrderAdvance > 1 &&

27
src/Pages/BookingScreen/Components/UtillComponents/useCountUp.jsx Normal file
View File

@ -0,0 +1,27 @@
import { useEffect, useState } from "react";
export const useCountUp = (end, duration = 400) => {
const [value, setValue] = useState(0);
useEffect(() => {
let start = 0;
const increment = end / (duration / 16);
const counter = setInterval(() => {
start += increment;
if (start >= end) {
setValue(end);
clearInterval(counter);
} else {
setValue(Math.floor(start));
}
}, 16);
return () => clearInterval(counter);
}, [end, duration]);
return value;
};
export default useCountUp;