68 lines
2.4 KiB
TypeScript
68 lines
2.4 KiB
TypeScript
import { ActionIcon, Table, Tooltip } from "@mantine/core";
|
|
import { type Contract } from "@/services/resources/contracts";
|
|
import { IconDownload, IconX } from "@tabler/icons-react";
|
|
import { t } from "@/config/i18n";
|
|
import { useGetContractFile } from "@/services/api";
|
|
import { useCallback } from "react";
|
|
import { useNavigate } from "react-router";
|
|
|
|
export type ContractRowProps = {
|
|
contract: Contract;
|
|
};
|
|
|
|
export default function ContractRow({ contract }: ContractRowProps) {
|
|
const getContractMutation = useGetContractFile();
|
|
const navigate = useNavigate();
|
|
|
|
const handleDownload = useCallback(async () => {
|
|
getContractMutation.mutateAsync(contract.id);
|
|
}, [useGetContractFile, contract, contract.id]);
|
|
return (
|
|
<Table.Tr key={contract.id}>
|
|
<Table.Td>
|
|
{contract.form.name} {contract.form.season}
|
|
</Table.Td>
|
|
<Table.Td>
|
|
{contract.firstname} {contract.lastname}
|
|
</Table.Td>
|
|
<Table.Td>{contract.email}</Table.Td>
|
|
<Table.Td>
|
|
{contract.cheque_quantity > 0 && contract.cheque_quantity} {contract.payment_method}
|
|
</Table.Td>
|
|
<Table.Td>
|
|
{`${Intl.NumberFormat("fr-FR", {
|
|
style: "currency",
|
|
currency: "EUR",
|
|
}).format(contract.total_price)}`}
|
|
</Table.Td>
|
|
<Table.Td>
|
|
<Tooltip label={t("download contract", { capfirst: true })}>
|
|
<ActionIcon
|
|
size="sm"
|
|
mr="5"
|
|
onClick={(e) => {
|
|
e.stopPropagation();
|
|
handleDownload();
|
|
}}
|
|
>
|
|
<IconDownload />
|
|
</ActionIcon>
|
|
</Tooltip>
|
|
<Tooltip label={t("remove contract", { capfirst: true })}>
|
|
<ActionIcon
|
|
color="red"
|
|
size="sm"
|
|
mr="5"
|
|
onClick={(e) => {
|
|
e.stopPropagation();
|
|
navigate(`/dashboard/contracts/${contract.id}/delete`);
|
|
}}
|
|
>
|
|
<IconX />
|
|
</ActionIcon>
|
|
</Tooltip>
|
|
</Table.Td>
|
|
</Table.Tr>
|
|
);
|
|
}
|