75 lines
2.3 KiB
JavaScript
75 lines
2.3 KiB
JavaScript
import { useEffect, useState } from 'react';
|
|
import { Popover, Input, Button } from 'antd';
|
|
import { useDispatch, useSelector } from "react-redux";
|
|
import { GiPayMoney } from "react-icons/gi";
|
|
import { GlobaltipAmount, changeTipAmount } from "../../../../Features/BookingScreen/BookingData/BookingData";
|
|
import TooltipWrapper from '../../../../Components/Tooltip/Tooltip';
|
|
import { isMobile } from 'react-device-detect';
|
|
|
|
const BSTipAmount = () => {
|
|
const globalTipAmount = useSelector(GlobaltipAmount);
|
|
const [visible, setVisible] = useState(false);
|
|
const [tipAmount, setTipAmount] = useState(globalTipAmount);
|
|
const dispatch = useDispatch();
|
|
|
|
const handleOk = () => {
|
|
if (changeTipAmount) {
|
|
dispatch(changeTipAmount(tipAmount));
|
|
}
|
|
setVisible(false);
|
|
};
|
|
|
|
const handleCancel = () => {
|
|
setTipAmount('');
|
|
setVisible(false);
|
|
};
|
|
useEffect(() => {
|
|
if (globalTipAmount > 0) {
|
|
setTipAmount(globalTipAmount)
|
|
}
|
|
else {
|
|
setTipAmount(0)
|
|
|
|
}
|
|
}, [globalTipAmount])
|
|
|
|
console.log(globalTipAmount, "tipAmounttipAmount");
|
|
|
|
const content = (
|
|
<div style={{ width: 200 }}>
|
|
<Input
|
|
placeholder="Enter tip amount"
|
|
value={tipAmount}
|
|
onChange={(e) => setTipAmount(e.target.value)}
|
|
type="number"
|
|
/>
|
|
<div style={{ marginTop: 10, display: 'flex', justifyContent: 'space-between' }}>
|
|
<Button type="primary" onClick={handleOk}>
|
|
OK
|
|
</Button>
|
|
<Button onClick={handleCancel}>Cancel</Button>
|
|
</div>
|
|
</div>
|
|
);
|
|
|
|
return (<>
|
|
<TooltipWrapper title="Tip Amount" isMobile={isMobile}>
|
|
<Popover
|
|
content={content}
|
|
title="Tip Amount"
|
|
trigger="click"
|
|
visible={visible}
|
|
onVisibleChange={(visible) => setVisible(visible)}
|
|
>
|
|
<GiPayMoney
|
|
fill={"rgb(18, 146, 238)"}
|
|
style={{ fontSize: 24, cursor: 'pointer' }}
|
|
onClick={() => setVisible(!visible)}
|
|
/>
|
|
</Popover>
|
|
</TooltipWrapper>
|
|
</>);
|
|
};
|
|
|
|
export default BSTipAmount;
|