add contract storage fix various bugs and translations
This commit is contained in:
78
frontend/src/components/PaymentMethods/Cheque/index.tsx
Normal file
78
frontend/src/components/PaymentMethods/Cheque/index.tsx
Normal file
@@ -0,0 +1,78 @@
|
||||
import { t } from "@/config/i18n";
|
||||
import type { ContractInputs } from "@/services/resources/contracts";
|
||||
import { Group, NumberInput, Stack, 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`)}
|
||||
/>
|
||||
<NumberInput
|
||||
readOnly
|
||||
label={t("cheque value", { capfirst: true })}
|
||||
suffix={"€"}
|
||||
placeholder={t("enter cheque value", { capfirst: true })}
|
||||
{...inputForm.getInputProps(`cheques.${index}.value`)}
|
||||
/>
|
||||
</Stack>
|
||||
))}
|
||||
</Group>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user