fakz9/Fulfillment-Frontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: deal card, deal status, deal new dates, indicator, hide navbar

Browse Source
This commit is contained in:
admin
2024-09-30 22:53:31 +03:00
parent 100af0aa06
commit f202e9b9fa
4 changed files with 52 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
src/components/Dnd/DealSummaryCard/DealSummaryCard.tsx
View File

@@ -13,11 +13,13 @@ import {
Popover,
rem,
Text,
Tooltip,
} from "@mantine/core";
import { useDealPageContext } from "../../../pages/LeadsPage/contexts/DealPageContext.tsx";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faCheck } from "@fortawesome/free-solid-svg-icons";
import { DealStatus } from "../../../shared/enums/DealStatus.ts";
import { IconCheck } from "@tabler/icons-react";
type Props = {
dealSummary: DealSummary;
@@ -31,8 +33,6 @@ const DealSummaryCard: FC<Props> = ({ dealSummary }) => {
});
};
const getIndicatorProps = (): IndicatorProps => {
// check if deal status is less then in delivery and delivery_date - current date is less then 3 days, then show indicator
// and if current status is less then in_delivery, then show indicator
if (!dealSummary.deliveryDate)
return { disabled: true };
@@ -42,7 +42,6 @@ const DealSummaryCard: FC<Props> = ({ dealSummary }) => {
const diffDays = Math.ceil(diff / (1000 * 3600 * 24));
if (dealSummary.status < DealStatus.IN_DELIVERY) {
// if less than 2 days left, show yellow, if less than 1 day left, show red
if (diffDays <= 2 && diffDays > 1) {
return {
color: "yellow",
@@ -124,43 +123,53 @@ const DealSummaryCard: FC<Props> = ({ dealSummary }) => {
)}
</Flex>
<Flex align={"center"} justify={"space-between"}>
<CopyButton value={dealSummary.id.toString()}>
{({ copy, copied }) => (
<Popover
opened={copied}
withArrow>
<Popover.Target>
<div
onClick={e => {
e.stopPropagation();
copy();
}}
className={styles["flex-item"]}>
<Badge
variant={"light"}
radius={"sm"}>
ID: {dealSummary.id}
</Badge>
</div>
</Popover.Target>
<Popover.Dropdown>
<Flex
justify={"center"}
align={"center"}
gap={rem(5)}>
<FontAwesomeIcon
bounce
style={{ animationIterationCount: 1 }}
icon={faCheck}
/>
<Text size={"xs"}>
ID сделки скопирован
</Text>
</Flex>
</Popover.Dropdown>
</Popover>
<Flex align={"center"} gap={rem(5)}>
<CopyButton value={dealSummary.id.toString()}>
{({ copy, copied }) => (
<Popover
opened={copied}
withArrow>
<Popover.Target>
<div
onClick={e => {
e.stopPropagation();
copy();
}}
className={styles["flex-item"]}>
<Badge
variant={"light"}
radius={"sm"}>
ID: {dealSummary.id}
</Badge>
</div>
</Popover.Target>
<Popover.Dropdown>
<Flex
justify={"center"}
align={"center"}
gap={rem(5)}>
<FontAwesomeIcon
bounce
style={{ animationIterationCount: 1 }}
icon={faCheck}
/>
<Text size={"xs"}>
ID сделки скопирован
</Text>
</Flex>
</Popover.Dropdown>
</Popover>
)}
</CopyButton>
{dealSummary.billRequest?.paid && (
<Tooltip label={"Оплачен"}>
<IconCheck />
</Tooltip>
)}
</CopyButton>
</Flex>
<ActionIcon variant={"transparent"}>
<Image
src={dealSummary.baseMarketplace?.iconUrl || ""}