diff --git a/src/app/deals/components/desktop/DealsTable/useDealsTableColumns.tsx b/src/app/deals/components/desktop/DealsTable/useDealsTableColumns.tsx
index 6e5f2a6..ddbfedf 100644
--- a/src/app/deals/components/desktop/DealsTable/useDealsTableColumns.tsx
+++ b/src/app/deals/components/desktop/DealsTable/useDealsTableColumns.tsx
@@ -3,21 +3,25 @@ import { IconEdit } from "@tabler/icons-react";
import { DataTableColumn } from "mantine-datatable";
import { ActionIcon, Tooltip } 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 { utcDateTimeToLocalString } from "@/utils/datetime";
const useDealsTableColumns = () => {
+ const { selectedProject } = useProjectsContext();
const { dealsCrud } = useDealsContext();
const { openDrawer } = useDrawersContext();
const onEditDeal = useCallback(
(deal: DealSchema) => {
+ if (!selectedProject) return;
openDrawer({
key: "dealEditorDrawer",
props: {
deal,
dealsCrud,
+ project: selectedProject,
},
});
},
diff --git a/src/app/deals/components/shared/DealCard/DealCard.tsx b/src/app/deals/components/shared/DealCard/DealCard.tsx
index d3accd1..28cad7c 100644
--- a/src/app/deals/components/shared/DealCard/DealCard.tsx
+++ b/src/app/deals/components/shared/DealCard/DealCard.tsx
@@ -1,5 +1,6 @@
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 styles from "./DealCard.module.css";
@@ -9,11 +10,16 @@ type Props = {
};
const DealCard = ({ deal }: Props) => {
+ const { selectedProject } = useProjectsContext();
const { dealsCrud } = useDealsContext();
const { openDrawer } = useDrawersContext();
const onClick = () => {
- openDrawer({ key: "dealEditorDrawer", props: { deal, dealsCrud } });
+ if (!selectedProject) return;
+ openDrawer({
+ key: "dealEditorDrawer",
+ props: { project: selectedProject, deal, dealsCrud },
+ });
};
return (
@@ -22,7 +28,9 @@ const DealCard = ({ deal }: Props) => {
className={styles.container}>
{
{deal.name}
- ID: {deal.id}
+ ID: {deal.id}
diff --git a/src/app/deals/components/shared/Funnel/Funnel.tsx b/src/app/deals/components/shared/Funnel/Funnel.tsx
index ecb91f8..da1a5bc 100644
--- a/src/app/deals/components/shared/Funnel/Funnel.tsx
+++ b/src/app/deals/components/shared/Funnel/Funnel.tsx
@@ -39,7 +39,7 @@ const Funnel: FC = () => {
getContainerId={(status: StatusSchema) => `${status.id}-status`}
getItemsByContainer={(status: StatusSchema, items: DealSchema[]) =>
sortByLexorank(
- items.filter(deal => deal.statusId === status.id)
+ items.filter(deal => deal.status.id === status.id)
)
}
renderContainer={(
diff --git a/src/app/deals/drawers/DealEditorDrawer/DealEditorDrawer.tsx b/src/app/deals/drawers/DealEditorDrawer/DealEditorDrawer.tsx
index 41ffffc..b5f660e 100644
--- a/src/app/deals/drawers/DealEditorDrawer/DealEditorDrawer.tsx
+++ b/src/app/deals/drawers/DealEditorDrawer/DealEditorDrawer.tsx
@@ -6,9 +6,10 @@ import DealEditorBody from "@/app/deals/drawers/DealEditorDrawer/components/Deal
import { DrawerProps } from "@/drawers/types";
import { DealsCrud } from "@/hooks/cruds/useDealsCrud";
import useIsMobile from "@/hooks/utils/useIsMobile";
-import { DealSchema } from "@/lib/client";
+import { DealSchema, ProjectSchema } from "@/lib/client";
type Props = {
+ project: ProjectSchema;
deal: DealSchema;
dealsCrud: DealsCrud;
};
diff --git a/src/app/deals/drawers/DealEditorDrawer/components/DealEditorBody.tsx b/src/app/deals/drawers/DealEditorDrawer/components/DealEditorBody.tsx
index 157ef57..0a3a30a 100644
--- a/src/app/deals/drawers/DealEditorDrawer/components/DealEditorBody.tsx
+++ b/src/app/deals/drawers/DealEditorDrawer/components/DealEditorBody.tsx
@@ -1,18 +1,19 @@
import { FC } from "react";
import { IconCircleDotted, IconEdit } from "@tabler/icons-react";
import { Tabs, Text } from "@mantine/core";
-import GeneralTab from "@/app/deals/drawers/DealEditorDrawer/components/GeneralTab";
+import GeneralTab from "@/app/deals/drawers/DealEditorDrawer/tabs/GeneralTab/GeneralTab";
import { DealsCrud } from "@/hooks/cruds/useDealsCrud";
-import { DealSchema } from "@/lib/client";
+import { DealSchema, ProjectSchema } from "@/lib/client";
import styles from "../DealEditorDrawer.module.css";
type Props = {
+ project: ProjectSchema;
dealsCrud: DealsCrud;
deal: DealSchema;
onClose: () => void;
};
-const DealEditorBody: FC = ({ dealsCrud, deal, onClose }) => {
+const DealEditorBody: FC = ({ project, dealsCrud, deal, onClose }) => {
return (
= ({ dealsCrud, deal, onClose }) => {
void;
-};
-
-const GeneralTab: FC = ({ deal, dealsCrud, onClose }) => {
- const [initialValues, setInitialValues] = useState(deal);
- const form = useForm({
- initialValues,
- validate: {
- name: value => !value && "Введите название",
- },
- });
-
- const onSubmit = (values: DealSchema) => {
- dealsCrud.onUpdate(deal.id, values);
- setInitialValues(values);
- };
-
- const onDelete = () => {
- dealsCrud.onDelete(deal, onClose);
- };
-
- return (
-
- );
-};
-
-export default GeneralTab;
diff --git a/src/app/deals/drawers/DealEditorDrawer/tabs/GeneralTab/Footer.tsx b/src/app/deals/drawers/DealEditorDrawer/tabs/GeneralTab/Footer.tsx
new file mode 100644
index 0000000..47bb369
--- /dev/null
+++ b/src/app/deals/drawers/DealEditorDrawer/tabs/GeneralTab/Footer.tsx
@@ -0,0 +1,43 @@
+import { FC } from "react";
+import { isEqual } from "lodash";
+import { Button, Group } from "@mantine/core";
+import { UseFormReturnType } from "@mantine/form";
+import { DealSchema } from "@/lib/client";
+
+type Props = {
+ form: UseFormReturnType>;
+ initialValues: Partial;
+ onDelete: () => void;
+};
+
+const Footer: FC = ({ form, initialValues, onDelete }) => {
+ return (
+
+
+
+
+
+
+
+ );
+};
+
+export default Footer;
diff --git a/src/app/deals/drawers/DealEditorDrawer/tabs/GeneralTab/GeneralTab.tsx b/src/app/deals/drawers/DealEditorDrawer/tabs/GeneralTab/GeneralTab.tsx
new file mode 100644
index 0000000..bd3ca38
--- /dev/null
+++ b/src/app/deals/drawers/DealEditorDrawer/tabs/GeneralTab/GeneralTab.tsx
@@ -0,0 +1,71 @@
+import { FC, useState } from "react";
+import { Stack, Text, TextInput } from "@mantine/core";
+import { useForm } from "@mantine/form";
+import Footer from "@/app/deals/drawers/DealEditorDrawer/tabs/GeneralTab/Footer";
+import BoardSelect from "@/components/selects/BoardSelect/BoardSelect";
+import StatusSelect from "@/components/selects/StatusSelect/StatusSelect";
+import { DealsCrud } from "@/hooks/cruds/useDealsCrud";
+import { DealSchema, ProjectSchema } from "@/lib/client";
+import { utcDateTimeToLocalString } from "@/utils/datetime";
+
+type Props = {
+ project: ProjectSchema;
+ dealsCrud: DealsCrud;
+ deal: DealSchema;
+ onClose: () => void;
+};
+
+const GeneralTab: FC = ({ project, deal, dealsCrud, onClose }) => {
+ const [initialValues, setInitialValues] =
+ useState>(deal);
+ const form = useForm>({
+ initialValues,
+ validate: {
+ name: value => !value && "Введите название",
+ board: value => !value && "Выберите доску",
+ status: value => !value && "Выберите статус",
+ },
+ });
+
+ const onSubmit = (values: Partial) => {
+ dealsCrud.onUpdate(deal.id, {
+ ...values,
+ boardId: values.board?.id,
+ statusId: values.status?.id,
+ });
+ setInitialValues(values);
+ };
+
+ const onDelete = () => {
+ dealsCrud.onDelete(deal, onClose);
+ };
+
+ return (
+
+ );
+};
+
+export default GeneralTab;
diff --git a/src/app/deals/hooks/useDealsAndStatusesDnd.ts b/src/app/deals/hooks/useDealsAndStatusesDnd.ts
index 5fef23f..524a1f8 100644
--- a/src/app/deals/hooks/useDealsAndStatusesDnd.ts
+++ b/src/app/deals/hooks/useDealsAndStatusesDnd.ts
@@ -41,7 +41,11 @@ const useDealsAndStatusesDnd = (): ReturnType => {
const getStatusByDealId = (dealId: number) => {
const deal = deals.find(deal => deal.id === dealId);
if (!deal) return;
- return statuses.find(status => status.id === deal.statusId);
+ return statuses.find(status => status.id === deal.status.id);
+ };
+
+ const getStatusById = (statusId: number) => {
+ return statuses.find(status => status.id === statusId);
};
const swipeSliderDuringDrag = (activeId: number, over: Over) => {
@@ -105,19 +109,19 @@ const useDealsAndStatusesDnd = (): ReturnType => {
const activeStatusId = getStatusByDealId(activeDealId)?.id;
if (!activeStatusId) return;
- const { overStatusId, newLexorank } = getDropTarget(
+ const { overStatus, newLexorank } = getDropTarget(
over.id,
activeDealId,
activeStatusId
);
- if (!overStatusId) return;
+ if (!overStatus) return;
debouncedSetDeals(
deals.map(deal =>
deal.id === activeDealId
? {
...deal,
- statusId: overStatusId,
+ status: overStatus,
lexorank: newLexorank || deal.lexorank,
}
: deal
@@ -134,7 +138,7 @@ const useDealsAndStatusesDnd = (): ReturnType => {
} else {
const deal = deals.find(deal => deal.id === over.id);
if (!deal) return;
- overStatusId = deal.statusId;
+ overStatusId = deal.status.id;
}
if (!overStatusId || activeStatusId === overStatusId) return;
@@ -156,42 +160,42 @@ const useDealsAndStatusesDnd = (): ReturnType => {
activeDealId: number,
activeStatusId: number,
isOnDragEnd: boolean = false
- ) => {
+ ): { overStatus?: StatusSchema; newLexorank?: string } => {
if (typeof overId === "string") {
return {
- overStatusId: getStatusId(overId),
+ overStatus: getStatusById(getStatusId(overId)),
newLexorank: undefined,
};
}
const overDealId = Number(overId);
- const overStatusId = getStatusByDealId(overDealId)?.id;
+ const overStatus = getStatusByDealId(overDealId);
- if (!overStatusId || (!isOnDragEnd && activeDealId === overDealId)) {
- return { overStatusId: undefined, newLexorank: undefined };
+ if (!overStatus || (!isOnDragEnd && activeDealId === overDealId)) {
+ return { overStatus: undefined, newLexorank: undefined };
}
const statusDeals = sortByLexorank(
- deals.filter(deal => deal.statusId === overStatusId)
+ deals.filter(deal => deal.status.id === overStatus.id)
);
const overDealIndex = statusDeals.findIndex(
deal => deal.id === overDealId
);
- if (activeStatusId === overStatusId) {
+ if (activeStatusId === overStatus.id) {
const newLexorank = getNewRankForSameStatus(
statusDeals,
overDealIndex,
activeDealId
);
- return { overStatusId, newLexorank };
+ return { overStatus, newLexorank };
}
const newLexorank = getNewRankForAnotherStatus(
statusDeals,
overDealIndex
);
- return { overStatusId, newLexorank };
+ return { overStatus, newLexorank };
};
const handleDragEnd = ({ active, over }: DragOverEvent) => {
@@ -215,9 +219,9 @@ const useDealsAndStatusesDnd = (): ReturnType => {
if (typeof over.id === "string" && isStatusId(over.id)) {
overStatusId = getStatusId(over.id);
} else {
- const deal = deals.find(deal => deal.statusId === over.id);
+ const deal = deals.find(deal => deal.status.id === over.id);
if (!deal) return;
- overStatusId = deal.statusId;
+ overStatusId = deal.status.id;
}
if (!overStatusId) return;
@@ -237,15 +241,15 @@ const useDealsAndStatusesDnd = (): ReturnType => {
const activeStatusId = getStatusByDealId(activeDealId)?.id;
if (!activeStatusId) return;
- const { overStatusId, newLexorank } = getDropTarget(
+ const { overStatus, newLexorank } = getDropTarget(
over.id,
activeDealId,
activeStatusId,
true
);
- if (!overStatusId) return;
+ if (!overStatus) return;
- onDealDragEnd(activeDealId, overStatusId, newLexorank);
+ onDealDragEnd(activeDealId, overStatus.id, newLexorank);
};
const onDealDragEnd = (
diff --git a/src/components/selects/StatusSelect/StatusSelect.tsx b/src/components/selects/StatusSelect/StatusSelect.tsx
index 9ad3036..862af16 100644
--- a/src/components/selects/StatusSelect/StatusSelect.tsx
+++ b/src/components/selects/StatusSelect/StatusSelect.tsx
@@ -1,6 +1,6 @@
"use client";
-import { FC, useEffect } from "react";
+import { FC, useEffect, useState } from "react";
import ObjectSelect, {
ObjectSelectProps,
} from "@/components/selects/ObjectSelect/ObjectSelect";
@@ -15,12 +15,17 @@ type Props = Omit<
};
const StatusSelect: FC = ({ boardId, ...props }) => {
+ const [isInitial, setIsInitial] = useState(true);
const onClear = () => props.onChange(null);
const { statuses } = useStatusesList({ boardId });
useEffect(() => {
- if (!boardId) props.onChange(null);
+ if (isInitial) {
+ setIsInitial(false);
+ } else {
+ onClear();
+ }
}, [boardId]);
return (
diff --git a/src/hooks/cruds/useDealsCrud.tsx b/src/hooks/cruds/useDealsCrud.tsx
index f915829..201e4a3 100644
--- a/src/hooks/cruds/useDealsCrud.tsx
+++ b/src/hooks/cruds/useDealsCrud.tsx
@@ -44,7 +44,7 @@ export const useDealsCrud = ({
if (!boardId || statuses.length === 0) return null;
const firstStatus = statuses[0];
const filteredDeals = deals.filter(
- d => d.statusId === firstStatus.id
+ d => d.status.id === firstStatus.id
);
let firstDeal: DealSchema | null = null;
if (filteredDeals.length > 0) {
@@ -65,7 +65,12 @@ export const useDealsCrud = ({
...old,
name: update.name ?? old.name,
lexorank: update.lexorank ?? old.lexorank,
- statusId: update.statusId ?? old.statusId,
+ status: update.statusId
+ ? { ...old.status, id: update.statusId }
+ : old.status,
+ board: update.boardId
+ ? { ...old.board, id: update.boardId }
+ : old.board,
}),
getDeleteConfirmTitle: () => "Удаление сделки",
});
diff --git a/src/lib/client/types.gen.ts b/src/lib/client/types.gen.ts
index eed5e41..8a0509e 100644
--- a/src/lib/client/types.gen.ts
+++ b/src/lib/client/types.gen.ts
@@ -174,14 +174,8 @@ export type DealSchema = {
* Lexorank
*/
lexorank: string;
- /**
- * Statusid
- */
- statusId: number;
- /**
- * Boardid
- */
- boardId: number;
+ status: StatusSchema;
+ board: BoardSchema;
/**
* Createdat
*/
@@ -387,6 +381,10 @@ export type UpdateDealSchema = {
* Lexorank
*/
lexorank?: string | null;
+ /**
+ * Boardid
+ */
+ boardId?: number | null;
/**
* Statusid
*/
diff --git a/src/lib/client/zod.gen.ts b/src/lib/client/zod.gen.ts
index 8bc3534..eb98fdc 100644
--- a/src/lib/client/zod.gen.ts
+++ b/src/lib/client/zod.gen.ts
@@ -52,6 +52,15 @@ export const zCreateDealRequest = z.object({
entity: zCreateDealSchema,
});
+/**
+ * StatusSchema
+ */
+export const zStatusSchema = z.object({
+ id: z.int(),
+ name: z.string(),
+ lexorank: z.string(),
+});
+
/**
* DealSchema
*/
@@ -59,8 +68,8 @@ export const zDealSchema = z.object({
id: z.int(),
name: z.string(),
lexorank: z.string(),
- statusId: z.int(),
- boardId: z.int(),
+ status: zStatusSchema,
+ board: zBoardSchema,
createdAt: z.iso.datetime({
offset: true,
}),
@@ -120,15 +129,6 @@ export const zCreateStatusRequest = z.object({
entity: zCreateStatusSchema,
});
-/**
- * StatusSchema
- */
-export const zStatusSchema = z.object({
- id: z.int(),
- name: z.string(),
- lexorank: z.string(),
-});
-
/**
* CreateStatusResponse
*/
@@ -248,6 +248,7 @@ export const zUpdateBoardResponse = z.object({
export const zUpdateDealSchema = z.object({
name: z.optional(z.union([z.string(), z.null()])),
lexorank: z.optional(z.union([z.string(), z.null()])),
+ boardId: z.optional(z.union([z.int(), z.null()])),
statusId: z.optional(z.union([z.int(), z.null()])),
});