From 5f593cf8dc47c8c1ef14e4037788bad40df97397 Mon Sep 17 00:00:00 2001 From: IlyaDoronin Date: Tue, 2 Apr 2024 16:21:17 +0300 Subject: [PATCH] fix: statistics modal link --- src/api/promocode/requests.ts | 21 ++-- src/model/promocodes.ts | 6 +- .../PromocodeManagement/StatisticsModal.tsx | 101 ++++++++++-------- .../Content/PromocodeManagement/index.tsx | 15 ++- 4 files changed, 78 insertions(+), 65 deletions(-) diff --git a/src/api/promocode/requests.ts b/src/api/promocode/requests.ts index 6f3015c..d807d41 100644 --- a/src/api/promocode/requests.ts +++ b/src/api/promocode/requests.ts @@ -33,16 +33,11 @@ const getPromocodeList = async (body: GetPromocodeListBody) => { }; const createFastlink = async (id: string) => { try { - return await makeRequest< - {id:string}, - PromocodeList - >({ + return await makeRequest<{ id: string }, { fastlink: string }>({ url: baseUrl + "/fastlink", method: "POST", - body: {id}, + body: { id }, }); - - } catch (nativeError) { const [error] = parseAxiosError(nativeError); throw new Error(`Ошибка при создании фастлинка. ${error}`); @@ -115,22 +110,22 @@ const deletePromocode = async (id: string): Promise => { } }; -const getPromocodeStatistics = async (id: string, from: number, to: number,) => { +const getPromocodeStatistics = async (id: string, from: number, to: number) => { try { const promocodeStatisticsResponse = await makeRequest< unknown, - PromocodeStatistics[] + PromocodeStatistics >({ url: baseUrl + `/stats`, body: { - "id": id, - "from": from, - "to": to + id: id, + from: from, + to: to, }, method: "POST", useToken: false, }); -console.log(promocodeStatisticsResponse) + console.log(promocodeStatisticsResponse); return promocodeStatisticsResponse; } catch (nativeError) { const [error] = parseAxiosError(nativeError); diff --git a/src/model/promocodes.ts b/src/model/promocodes.ts index 3b1b524..599508c 100644 --- a/src/model/promocodes.ts +++ b/src/model/promocodes.ts @@ -33,6 +33,7 @@ export type Promocode = CreatePromocodeBody & { offLimit: boolean; delete: boolean; createdAt: string; + fastLinks: string[]; }; export type PromocodeList = { @@ -42,7 +43,6 @@ export type PromocodeList = { export type PromocodeStatistics = { id: string; - link: string; - useCount: number; - purchasesCount: number; + usageCount: number; + usageMap: Record; }; diff --git a/src/pages/dashboard/Content/PromocodeManagement/StatisticsModal.tsx b/src/pages/dashboard/Content/PromocodeManagement/StatisticsModal.tsx index 9dc3c6a..0e06222 100644 --- a/src/pages/dashboard/Content/PromocodeManagement/StatisticsModal.tsx +++ b/src/pages/dashboard/Content/PromocodeManagement/StatisticsModal.tsx @@ -14,11 +14,12 @@ import { DatePicker } from "@mui/x-date-pickers/DatePicker"; import { fadeIn } from "@root/utils/style/keyframes"; -import type { GridColDef } from "@mui/x-data-grid"; -import type { PromocodeStatistics } from "@root/model/promocodes"; import moment from "moment"; import { promocodeApi } from "@root/api/promocode/requests"; -import ContentCopyIcon from '@mui/icons-material/ContentCopy'; +import ContentCopyIcon from "@mui/icons-material/ContentCopy"; + +import type { GridColDef } from "@mui/x-data-grid"; +import type { Promocode } from "@root/model/promocodes"; type StatisticsModalProps = { id: string; @@ -27,20 +28,29 @@ type StatisticsModalProps = { setId: (id: string) => void; setTo: (date: number) => void; setFrom: (date: number) => void; + promocodes: Promocode[]; // promocodeStatistics: PromocodeStatistics[] | null | undefined; // promocodeStatistics: any; }; -const COLUMNS: GridColDef[] = [ +type Row = { + id: number; + link: string; + useCount: number; +}; + +const COLUMNS: GridColDef[] = [ { field: "copy", headerName: "копировать", width: 50, sortable: false, - valueGetter: ({ row }) => String(row.purchasesCount), + valueGetter: ({ row }) => String(row.useCount), renderCell: (params) => { return ( - navigator.clipboard.writeText(params.row.link)}> + navigator.clipboard.writeText(params.row.link)} + > ); @@ -65,15 +75,10 @@ const COLUMNS: GridColDef[] = [ headerName: "Покупок", width: 70, sortable: false, - valueGetter: ({ row }) => String(row.purchasesCount), + valueGetter: ({ row }) => String(1), }, ]; -type ROW = { - link: string, - useCount: number -} - export const StatisticsModal = ({ id, setId, @@ -81,40 +86,54 @@ export const StatisticsModal = ({ from, to, setTo, - //promocodeStatistics, + promocodes, }: StatisticsModalProps) => { const [startDate, setStartDate] = useState(new Date()); const [endDate, setEndDate] = useState(new Date()); const theme = useTheme(); const isMobile = useMediaQuery(theme.breakpoints.down(550)); const [general, setGeneral] = useState({}); - const [rows, setRows] = useState([]); + const [rows, setRows] = useState([]); const createFastlink = async () => { - await promocodeApi.createFastlink(id) - getParseData() - } + await promocodeApi.createFastlink(id); + getParseData(); + }; + const getParseData = async () => { - const promocodeStatistics = await promocodeApi.getPromocodeStatistics(id, moment(startDate).unix(), moment(endDate).unix()) - const rows = [] as ROW[] - //@ts-ignore - for (const [key, value] of Object.entries(promocodeStatistics.usageMap)) { - rows.push({ - link: key, - //@ts-ignore + const promocodeStatistics = await promocodeApi.getPromocodeStatistics( + id, + moment(startDate).unix(), + moment(endDate).unix() + ); + + const rows = Object.values(promocodeStatistics.usageMap).map( + (value, index) => ({ + link: + promocodes.find((promocode) => promocode.id === id)?.fastLinks[0] ?? + "", useCount: value, - id:rows.length + id: index, }) - } - setGeneral(promocodeStatistics) - //@ts-ignore - setRows(rows) - } + ) as Row[]; + + setGeneral(promocodeStatistics); + setRows(rows); + }; + useEffect(() => { - if (id.length > 0) getParseData() - }, [id]) + if (id.length > 0) { + getParseData(); + } + + if (!id) { + setRows([]); + setGeneral({}); + } + }, [id]); + // const formatTo = to === null ? 0 : moment(to).unix() // const formatFrom = from === null ? 0 : moment(from).unix() - console.log(general) + console.log(general); // useEffect(() => { // (async () => { // const gottenGeneral = await promocodeStatistics(id, startDate, endDate) @@ -125,9 +144,9 @@ export const StatisticsModal = ({ { - setId("") - setStartDate(new Date()) - setEndDate(new Date()) + setId(""); + setStartDate(new Date()); + setEndDate(new Date()); }} sx={{ "& > .MuiBox-root": { outline: "none" } }} > @@ -163,16 +182,10 @@ export const StatisticsModal = ({ alignItems: "center", }} > - - diff --git a/src/pages/dashboard/Content/PromocodeManagement/index.tsx b/src/pages/dashboard/Content/PromocodeManagement/index.tsx index 3baaeac..13b5c71 100644 --- a/src/pages/dashboard/Content/PromocodeManagement/index.tsx +++ b/src/pages/dashboard/Content/PromocodeManagement/index.tsx @@ -12,9 +12,9 @@ import DeleteModal from "./DeleteModal"; export const PromocodeManagement = () => { const theme = useTheme(); - - const [deleteModal, setDeleteModal] = useState("") - const deleteModalHC = (id:string) => setDeleteModal(id) + + const [deleteModal, setDeleteModal] = useState(""); + const deleteModalHC = (id: string) => setDeleteModal(id); const [showStatisticsModalId, setShowStatisticsModalId] = useState(""); @@ -35,7 +35,7 @@ export const PromocodeManagement = () => { setShowStatisticsModalId, deleteModalHC ); - console.log(showStatisticsModalId) + console.log(showStatisticsModalId); if (error) return Ошибка загрузки промокодов; return ( @@ -101,8 +101,13 @@ export const PromocodeManagement = () => { setTo={setTo} from={from} setFrom={setFrom} + promocodes={data?.items ?? []} + /> + - ); };