Changed behaviour for new payment values

This commit is contained in:
Joao Ramos
2023-12-27 22:14:11 +00:00
parent b3bb5a2337
commit 8831729470

View File

@@ -62,28 +62,27 @@ const columnHelper = createColumnHelper<Payment>();
const PaymentCreator = ({onClose, reload, showComission = false}: {onClose: () => void; reload: () => void; showComission: boolean}) => { const PaymentCreator = ({onClose, reload, showComission = false}: {onClose: () => void; reload: () => void; showComission: boolean}) => {
const [corporate, setCorporate] = useState<CorporateUser>(); const [corporate, setCorporate] = useState<CorporateUser>();
const [price, setPrice] = useState<number>(0);
const [currency, setCurrency] = useState<string>("EUR");
const [commission, setCommission] = useState<number>(0);
const [referralAgent, setReferralAgent] = useState<AgentUser>();
const [date, setDate] = useState<Date>(new Date()); const [date, setDate] = useState<Date>(new Date());
const {users} = useUsers(); const {users} = useUsers();
useEffect(() => { const price = corporate?.corporateInformation?.payment?.value || 0;
if (!corporate) return setReferralAgent(undefined); const commission = corporate?.corporateInformation?.payment?.commission || 0;
if (!corporate.corporateInformation?.referralAgent) return setReferralAgent(undefined); const currency = corporate?.corporateInformation?.payment?.currency || 'EUR';
const referralAgent = users.find((u) => u.id === corporate.corporateInformation.referralAgent); const referralAgent = useMemo(() => {
setReferralAgent(referralAgent as AgentUser | undefined); if(corporate?.corporateInformation?.referralAgent) {
}, [corporate, users]); return users.find((u) => u.id === corporate.corporateInformation.referralAgent);
}
useEffect(() => { return undefined;
const payment = corporate?.corporateInformation?.payment; }, [corporate?.corporateInformation?.referralAgent, users]);
// useEffect(() => {
// const payment = corporate?.corporateInformation?.payment;
setPrice(payment?.value || 0); // // setPrice(payment?.value || 0);
setCurrency(payment?.currency || "EUR"); // setCurrency(payment?.currency || "EUR");
}, [corporate]); // }, [corporate]);
const submit = () => { const submit = () => {
axios axios
@@ -91,7 +90,7 @@ const PaymentCreator = ({onClose, reload, showComission = false}: {onClose: () =
corporate: corporate?.id, corporate: corporate?.id,
agent: referralAgent?.id, agent: referralAgent?.id,
agentCommission: commission, agentCommission: commission,
agentValue: toFixedNumber((commission / 100) * price, 2), agentValue: toFixedNumber((commission! / 100) * price!, 2),
currency, currency,
value: price, value: price,
isPaid: false, isPaid: false,
@@ -146,16 +145,18 @@ const PaymentCreator = ({onClose, reload, showComission = false}: {onClose: () =
<div className="w-full grid grid-cols-5 gap-2"> <div className="w-full grid grid-cols-5 gap-2">
<Input <Input
name="paymentValue" name="paymentValue"
onChange={(e) => setPrice(e ? parseInt(e) : 0)} onChange={() => {}}
type="number" type="number"
value={price} value={price}
defaultValue={0}
className="col-span-3" className="col-span-3"
disabled
/> />
<Select <Select
className="px-4 col-span-2 py-4 w-full text-sm font-normal placeholder:text-mti-gray-cool disabled:bg-mti-gray-platinum/40 disabled:text-mti-gray-dim disabled:cursor-not-allowed bg-white rounded-full border border-mti-gray-platinum focus:outline-none" className="px-4 col-span-2 py-4 w-full text-sm font-normal placeholder:text-mti-gray-cool disabled:bg-mti-gray-platinum/40 disabled:text-mti-gray-dim disabled:cursor-not-allowed bg-white rounded-full border border-mti-gray-platinum focus:outline-none"
options={CURRENCIES.map(({label, currency}) => ({value: currency, label}))} options={CURRENCIES.map(({label, currency}) => ({value: currency, label}))}
defaultValue={{value: currency || "EUR", label: CURRENCIES.find((c) => c.currency === currency)?.label || "Euro"}} defaultValue={{value: currency || "EUR", label: CURRENCIES.find((c) => c.currency === currency)?.label || "Euro"}}
onChange={(value) => setCurrency(value?.value || "EUR")} onChange={() => {}}
value={{value: currency || "EUR", label: CURRENCIES.find((c) => c.currency === currency)?.label || "Euro"}} value={{value: currency || "EUR", label: CURRENCIES.find((c) => c.currency === currency)?.label || "Euro"}}
styles={{ styles={{
control: (styles) => ({ control: (styles) => ({
@@ -173,6 +174,7 @@ const PaymentCreator = ({onClose, reload, showComission = false}: {onClose: () =
color: state.isFocused ? "black" : styles.color, color: state.isFocused ? "black" : styles.color,
}), }),
}} }}
isDisabled
/> />
</div> </div>
</div> </div>
@@ -180,13 +182,20 @@ const PaymentCreator = ({onClose, reload, showComission = false}: {onClose: () =
<div className="flex gap-4 w-full"> <div className="flex gap-4 w-full">
<div className="flex flex-col w-full gap-3"> <div className="flex flex-col w-full gap-3">
<label className="font-normal text-base text-mti-gray-dim">Commission *</label> <label className="font-normal text-base text-mti-gray-dim">Commission *</label>
<Input name="commission" onChange={(e) => setCommission(e ? parseInt(e) : 0)} type="number" defaultValue={0} /> <Input
name="commission"
onChange={() => {}}
type="number"
defaultValue={0}
value={commission}
disabled
/>
</div> </div>
<div className="flex flex-col w-full gap-3"> <div className="flex flex-col w-full gap-3">
<label className="font-normal text-base text-mti-gray-dim">Commission Value*</label> <label className="font-normal text-base text-mti-gray-dim">Commission Value*</label>
<Input <Input
name="commissionValue" name="commissionValue"
value={`${(commission / 100) * price} ${CURRENCIES.find((c) => c.currency === currency)?.label}`} value={`${(commission! / 100) * price!} ${CURRENCIES.find((c) => c.currency === currency)?.label}`}
onChange={() => null} onChange={() => null}
type="text" type="text"
defaultValue={0} defaultValue={0}