84 lines
3.4 KiB
TypeScript
84 lines
3.4 KiB
TypeScript
import { t } from "@/config/i18n";
|
|
import type { ContractInputs } from "@/services/resources/contracts";
|
|
import { Group, NumberInput, Stack, Text, TextInput, Title } from "@mantine/core";
|
|
import type { UseFormReturnType } from "@mantine/form";
|
|
import { useEffect } from "react";
|
|
|
|
export type ContractChequeProps = {
|
|
inputForm: UseFormReturnType<ContractInputs>;
|
|
price: number;
|
|
chequeOrder: string;
|
|
};
|
|
|
|
export type Cheque = {
|
|
name: string;
|
|
value: string;
|
|
};
|
|
|
|
export function ContractCheque({ inputForm, price, chequeOrder }: ContractChequeProps) {
|
|
useEffect(() => {
|
|
if (!inputForm.values.payment_method.includes("cheque")) {
|
|
return;
|
|
}
|
|
const quantity = Number(inputForm.values.cheque_quantity);
|
|
if (!quantity || quantity <= 0) return;
|
|
const cheques = inputForm.values.cheques || [];
|
|
if (cheques.length !== quantity) {
|
|
const newCheques = Array.from({ length: quantity }, (_, i) => ({
|
|
name: cheques[i]?.name ?? "",
|
|
value: cheques[i]?.value ?? 0,
|
|
}));
|
|
inputForm.setFieldValue("cheques", newCheques);
|
|
}
|
|
|
|
const totalCents = Math.round(price * 100);
|
|
const base = Math.floor(totalCents / quantity);
|
|
const rest = totalCents - base * quantity;
|
|
for (let i = 0; i < quantity; i++) {
|
|
const val = (i === quantity - 1 ? base + rest : base) / 100;
|
|
inputForm.setFieldValue(`cheques.${i}.value`, val.toFixed(2));
|
|
}
|
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
}, [inputForm.values.cheque_quantity, price, inputForm.values.cheques]);
|
|
|
|
return (
|
|
<Stack>
|
|
<Title order={4}>{`${t("order name")} : ${chequeOrder}`}</Title>
|
|
<NumberInput
|
|
label={t("cheque quantity", { capfirst: true })}
|
|
placeholder={t("enter cheque quantity", { capfirst: true })}
|
|
description={t(
|
|
"number of cheques between 1 and 3 cheques also enter your cheques identifiers, value is calculated automatically",
|
|
{ capfirst: true },
|
|
)}
|
|
min={1}
|
|
max={3}
|
|
{...inputForm.getInputProps(`cheque_quantity`)}
|
|
/>
|
|
<Group grow>
|
|
{inputForm.values.cheques.map((cheque, index) => (
|
|
<Stack key={`${index}`}>
|
|
<TextInput
|
|
label={t("cheque id", { capfirst: true })}
|
|
placeholder={t("cheque id", { capfirst: true })}
|
|
{...inputForm.getInputProps(`cheques.${index}.name`)}
|
|
error={
|
|
cheque.name == "" ?
|
|
<Text size="sm" c="red">{inputForm?.errors.cheques}</Text> :
|
|
null
|
|
}
|
|
/>
|
|
<NumberInput
|
|
readOnly
|
|
label={t("cheque value", { capfirst: true })}
|
|
suffix={"€"}
|
|
placeholder={t("enter cheque value", { capfirst: true })}
|
|
{...inputForm.getInputProps(`cheques.${index}.value`)}
|
|
/>
|
|
</Stack>
|
|
))}
|
|
</Group>
|
|
</Stack>
|
|
);
|
|
}
|