Files
Crm-Frontend/src/app/deals/components/shared/DealCard/DealCard.tsx

74 lines
2.5 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import { Box, Card, Group, Pill, Stack, Text } from "@mantine/core";
import { useDealsContext } from "@/app/deals/contexts/DealsContext";
import { useProjectsContext } from "@/app/deals/contexts/ProjectsContext";
import { useDrawersContext } from "@/drawers/DrawersContext";
import { DealSchema } from "@/lib/client";
import { ModuleNames } from "@/modules/modules";
import styles from "./DealCard.module.css";
type Props = {
deal: DealSchema;
};
const DealCard = ({ deal }: Props) => {
const { selectedProject, modulesSet } = useProjectsContext();
const { dealsCrud, refetchDeals } = useDealsContext();
const { openDrawer } = useDrawersContext();
const onClick = () => {
openDrawer({
key: "dealEditorDrawer",
props: {
value: deal,
onChange: deal => dealsCrud.onUpdate(deal.id, deal),
onDelete: dealsCrud.onDelete,
project: selectedProject,
},
onClose: refetchDeals,
});
};
return (
<Card
onClick={onClick}
className={styles.container}>
<Group
justify={"space-between"}
wrap={"nowrap"}
pl={"xs"}
gap={"xs"}
align={"start"}>
<Text
c={"dodgerblue"}
mt={"xs"}>
{deal.name}
</Text>
<Box className={styles["deal-id"]}>
<Text style={{ textWrap: "nowrap" }}>ID: {deal.id}</Text>
</Box>
</Group>
<Stack className={styles["deal-data"]}>
<Stack gap={0}>
{modulesSet.has(ModuleNames.CLIENTS) && (
<Text>{deal.client?.name}</Text>
)}
{modulesSet.has(ModuleNames.FULFILLMENT_BASE) && (
<>
<Text key={"price"}>{deal.totalPrice} руб.</Text>
<Text key={"count"}>
{deal.productsQuantity} тов.
</Text>
</>
)}
</Stack>
<Group gap={"xs"}>
<Pill className={styles["first-tag"]}>Срочно</Pill>
<Pill className={styles["second-tag"]}>Бесплатно</Pill>
</Group>
</Stack>
</Card>
);
};
export default DealCard;