Merge branch 'dev' into 'staging'

Dev

See merge request frontend/admin!76

src/api/quizStatistic.ts

@@ -1,4 +1,5 @@
 import makeRequest from "@root/api/makeRequest";
+import {parseAxiosError} from "@root/utils/parse-error";
 
 export type QuizStatisticResponse = {
     Registrations: number;
@@ -25,4 +26,25 @@ export const getStatistic = async (
 
     return { Registrations: 0, Quizes: 0, Results: 0 };
   }
-};
+};
+
+export const getStatisticSchild = async (
+    from: any, to: any): Promise<unknown> => {
+    try {
+        const StatisticResponse = await makeRequest<unknown, unknown>({
+            url: process.env.REACT_APP_DOMAIN + "/customer/quizlogo/stat" ,
+            method: "post",
+            useToken: true,
+            body: {
+                "to": to,
+                "from": from,
+                "page": 0,
+                "limit": 100
+            },
+        });
+        return StatisticResponse;
+    } catch (nativeError) {
+
+        return [{ID: 0, Regs: 0, Money: 0, Quizes:[{QuizID: 0, Regs: 0, Money: 0}]}];
+    }
+};

src/pages/dashboard/Content/QuizStatistic/StatisticSchild.tsx

@@ -0,0 +1,245 @@
+import {useEffect, useState} from "react";
+import moment, {Moment} from "moment";
+import {
+    Accordion,
+    AccordionDetails, AccordionSummary,
+    Box,
+    Button,
+    Table,
+    TableBody,
+    TableCell,
+    TableHead,
+    TableRow,
+    TextField,
+    Typography,
+    useTheme
+} from "@mui/material";
+import {AdapterMoment} from "@mui/x-date-pickers/AdapterMoment";
+import { DatePicker, LocalizationProvider } from '@mui/x-date-pickers';
+import ModalUser from "@pages/dashboard/ModalUser";
+import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
+import useSchildStatistic from "@root/utils/hooks/useSchildStatistic";
+
+export default function StatisticSchild() {
+    const theme = useTheme()
+    const [isOpen, setOpen] = useState<boolean>(false);
+    const [isOpenEnd, setOpenEnd] = useState<boolean>(false);
+
+    const [openUserModal, setOpenUserModal] = useState<boolean>(false);
+    const [activeUserId, setActiveUserId] = useState<string>("");
+
+    const [from, setFrom] = useState<Moment | null>(moment("01.01.2023"));
+    const [to, setTo] = useState<Moment | null>(moment(Date.now()));
+
+    const statistic = useSchildStatistic(from, to)
+    const handleClose = () => {
+        setOpen(false);
+    };
+
+    const handleOpen = () => {
+        setOpen(true);
+    };
+
+    const onAdornmentClick = () => {
+        setOpen((old) => !old);
+        if (isOpenEnd) {
+            handleCloseEnd();
+        }
+    };
+
+    const handleCloseEnd = () => {
+        setOpenEnd(false);
+    };
+
+    const handleOpenEnd = () => {
+        setOpenEnd(true);
+    };
+
+    const onAdornmentClickEnd = () => {
+        setOpenEnd((old) => !old);
+        if (isOpen) {
+            handleClose();
+        }
+    };
+    useEffect(() => {
+        if (!openUserModal) {
+            setActiveUserId("");
+        }
+    }, [openUserModal]);
+
+    useEffect(() => {
+        if (activeUserId) {
+            setOpenUserModal(true);
+
+            return;
+        }
+
+        setOpenUserModal(false);
+    }, [activeUserId]);
+
+    console.log(statistic)
+
+    return(
+        <LocalizationProvider dateAdapter={AdapterMoment}>
+            <Typography sx={{mt: "20px", mb: "20px"}}>Статистика переходов с шильдика</Typography>
+            <Box>
+                <Typography
+                    sx={{
+                        fontSize: "16px",
+                        marginBottom: "5px",
+                        fontWeight: 500,
+                        color: "4D4D4D",
+                    }}
+                >
+                    Дата начала
+                </Typography>
+                <DatePicker
+                    inputFormat="DD/MM/YYYY"
+                    value={from}
+                    onChange={(date) => date && setFrom(date)}
+                    renderInput={(params) => (
+                        <TextField
+                            {...params}
+                            sx={{ background: "#1F2126", borderRadius: "5px" }}
+                        />
+                    )}
+                    InputProps={{
+                        sx: {
+                            height: "40px",
+                            color: theme.palette.secondary.main,
+                            border: "1px solid",
+                            borderColor: theme.palette.secondary.main,
+                            "& .MuiSvgIcon-root": {
+                                color: theme.palette.secondary.main,
+                            },
+                        },
+                    }}
+                />
+            </Box>
+            <Box>
+                <Typography
+                    sx={{
+                        fontSize: "16px",
+                        marginBottom: "5px",
+                        fontWeight: 500,
+                        color: "4D4D4D",
+                    }}
+                >
+                    Дата окончания
+                </Typography>
+                <DatePicker
+                    inputFormat="DD/MM/YYYY"
+                    value={to}
+                    onChange={(date) => date && setTo(date)}
+                    renderInput={(params) => (
+                        <TextField
+                            {...params}
+                            sx={{ background: "#1F2126", borderRadius: "5px" }}
+                        />
+                    )}
+                    InputProps={{
+                        sx: {
+                            height: "40px",
+                            color: theme.palette.secondary.main,
+                            border: "1px solid",
+                            borderColor: theme.palette.secondary.main,
+                            "& .MuiSvgIcon-root": {
+                                color: theme.palette.secondary.main,
+                            },
+                        },
+                    }}
+                />
+            </Box>
+            <Table
+                sx={{
+                    width: "80%",
+                    border: "2px solid",
+                    borderColor: theme.palette.secondary.main,
+                    bgcolor: theme.palette.content.main,
+                    color: "white",
+                    mt: "20px"
+                }}
+            >
+                <TableHead>
+                    <TableRow
+                        sx={{
+                            borderBottom: "2px solid",
+                            borderColor: theme.palette.grayLight.main,
+                            height: "100px",
+                        }}
+                    >
+                        <TableCell sx={{color: "inherit"}} align="center">Пользователь</TableCell>
+                        <TableCell sx={{color: "inherit"}} align="center">Регистраций</TableCell>
+                        <TableCell sx={{color: "inherit"}} align="center">Деньги</TableCell>
+                        <TableCell sx={{color: "inherit"}} align="center">Квизы</TableCell>
+                    </TableRow>
+                </TableHead>
+                {statistic.map((stat: any) => (
+                        <TableBody>
+                            <TableCell
+                                sx={{color: "inherit"}} align="center"
+                                onClick={()=> setActiveUserId(stat?.ID)}
+                            >{stat?.ID}</TableCell>
+                            <ModalUser
+                                open={openUserModal}
+                                onClose={() => setOpenUserModal(false)}
+                                userId={activeUserId}
+                            />
+                            <TableCell sx={{color: "inherit"}} align="center">{stat?.Regs}</TableCell>
+                            <TableCell sx={{color: "inherit"}} align="center">{stat?.Money}</TableCell>
+                            <TableCell sx={{color: "inherit"}} align="center">
+                                <Accordion>
+                                    <AccordionSummary
+                                        sx={{backgroundColor: "#26272c", color: "#FFFFFF"}}
+                                        expandIcon={<ExpandMoreIcon sx={{color: "#FFFFFF"}}/>}
+                                        aria-controls="panel1-content"
+                                        id="panel1-header"
+                                    >
+                                        Статистика по квизам
+                                    </AccordionSummary>
+                                    <AccordionDetails sx={{backgroundColor: "#26272c",}}>
+                                        <Table
+                                            sx={{
+                                                width: "80%",
+                                                border: "2px solid",
+                                                borderColor: theme.palette.secondary.main,
+                                                bgcolor: theme.palette.content.main,
+                                                color: "white"
+                                            }}
+                                        >
+                                            <TableHead>
+                                                <TableRow
+                                                    sx={{
+                                                        borderBottom: "2px solid",
+                                                        borderColor: theme.palette.grayLight.main,
+                                                        height: "100px",
+                                                    }}
+                                                >
+                                                    <TableCell sx={{color: "inherit"}} align="center">QuizID</TableCell>
+                                                    <TableCell sx={{color: "inherit"}} align="center">Регистрации</TableCell>
+                                                    <TableCell sx={{color: "inherit"}} align="center">Деньги</TableCell>
+                                                </TableRow>
+                                            </TableHead>
+
+                                                {stat?.Quizes.map((quiz:any)=> (
+                                                    <TableBody>
+                                                        <TableCell sx={{color: "inherit"}} align="center">{quiz?.QuizID}</TableCell>
+                                                        <TableCell sx={{color: "inherit"}} align="center">{quiz?.Regs}</TableCell>
+                                                        <TableCell sx={{color: "inherit"}} align="center">{quiz?.Money}</TableCell>
+                                                    </TableBody>
+                                                ))}
+
+
+                                        </Table>
+                                    </AccordionDetails>
+                                </Accordion>
+                            </TableCell>
+                        </TableBody>
+                    ))
+            }
+
+            </Table>
+        </LocalizationProvider>
+    )
+
+}

src/pages/dashboard/Content/QuizStatistic/index.tsx

@@ -5,9 +5,7 @@ import type { Moment } from "moment";
 import { DatePicker, LocalizationProvider } from '@mui/x-date-pickers';
 import { useQuizStatistic } from '@root/utils/hooks/useQuizStatistic';
 import { AdapterMoment } from '@mui/x-date-pickers/AdapterMoment'
-import makeRequest from "@root/api/makeRequest";
+import StatisticSchild from "./StatisticSchild";
-import {Discount} from "@frontend/kitui";
-import {parseAxiosError} from "@root/utils/parse-error";
 
 export default () => {
     const theme = useTheme()
@@ -19,6 +17,7 @@ export default () => {
     const [to, setTo] = useState<Moment | null>(moment(Date.now()));
 
 
+
     const { Registrations, Quizes, Results } = useQuizStatistic({
         from,
         to,
@@ -59,29 +58,6 @@ export default () => {
         }
     };
 
-    const StatisticsShild = async (from: any, to: any) => {
-        try {
-            const StatisticResponse = await makeRequest<unknown, unknown>({
-                url: process.env.REACT_APP_DOMAIN + "/customer/quizlogo/stat" ,
-                method: "post",
-                useToken: true,
-                body: {
-                    "to": to.unix(),
-                    "from": from.unix(),
-                    "page": 0,
-                    "limit": 100
-                },
-            });
-
-            return [StatisticResponse];
-        } catch (nativeError) {
-            const [error] = parseAxiosError(nativeError);
-
-            return [null, `Ошибка запроса статистики. ${error}`];
-        }
-    }
-
-
     return <>
         <LocalizationProvider dateAdapter={AdapterMoment}>
             <Box>
@@ -160,15 +136,6 @@ export default () => {
             >
                 Сбросить даты
             </Button>
-            <Button
-            sx={{
-                m: '10px 0'
-            }}
-            onClick={async() =>StatisticsShild(from, to)}
-            >
-                Запросить статистику(тест)
-            </Button>
-
                 <Table
                     sx={{
                         width: "80%",
@@ -197,6 +164,9 @@ export default () => {
                                 <TableCell sx={{color: "inherit"}} align="center">{Results}</TableCell>
                     </TableBody>
                 </Table>
+
+            <StatisticSchild/>
+
         </LocalizationProvider>
     </>
 }

src/pages/dashboard/Content/Support/TicketList/CloseTicketModal.tsx

@@ -66,7 +66,10 @@ export default function CloseTicketModal({ticketId, openModal, setOpenModal}: Pr
                 }}
             >
                 <Button
-                    onClick={CloseTicket}
+                    onClick={async ()=>{
+                        CloseTicket()
+                        setOpenModal(false)
+                    }}
                     sx={{width: "40px", height: "25px"}}
                 >
                     Да

src/pages/dashboard/ModalUser/UserTab.tsx

@@ -48,7 +48,7 @@ export const UserTab = ({ userId }: UserTabProps) => {
         <Box sx={{ marginBottom: "25px" }}>
           <Typography sx={{ lineHeight: "20px" }}>Email</Typography>
           <Typography sx={{ lineHeight: "20px", fontWeight: "bold" }}>
-            {user?.email}
+            {user?.email || user?.login}
           </Typography>
         </Box>
         <Box sx={{ marginBottom: "25px" }}>

src/utils/hooks/useSchildStatistic.ts

@@ -0,0 +1,17 @@
+import {useEffect, useState} from "react";
+import {getStatisticSchild} from "@root/api/quizStatistic";
+
+
+export default function useSchildStatistic (from: any, to: any){
+    const formatTo = to?.unix();
+    const formatFrom = from?.unix();
+    const [statistic, setStatistic] = useState<any>([])
+    useEffect(() => {
+        const StatisticsShild = async () => {
+            const gottenData = await getStatisticSchild(Number(formatFrom), Number(formatTo));
+            setStatistic(gottenData)
+        }
+        StatisticsShild()
+    }, []);
+    return statistic
+}