Correção no função de data

rtenorioh · Oct 29, 2024 · ed479ca · ed479ca
1 parent 92c2391
commit ed479ca
Show file tree

Hide file tree

Showing 3 changed files with 64 additions and 50 deletions.
diff --git a/frontend/src/pages/Dashboard/Chart.js b/frontend/src/pages/Dashboard/Chart.js
@@ -18,7 +18,13 @@ import Title from "./Title";
 
 const Chart = () => {
 	const theme = useTheme();
-	const [selectedDate, setSelectedDate] = useState(new Date().toISOString().split("T")[0]);
+	const [selectedDate, setSelectedDate] = useState(() => {
+		const today = new Date();
+		const year = today.getFullYear();
+		const month = String(today.getMonth() + 1).padStart(2, '0');
+		const day = String(today.getDate()).padStart(2, '0');
+		return `${year}-${month}-${day}`;
+	});
 	const { tickets } = useTickets({ date: selectedDate });
 	const [chartData, setChartData] = useState([]);
 

diff --git a/frontend/src/pages/Dashboard/ChartPerConnection.js b/frontend/src/pages/Dashboard/ChartPerConnection.js
@@ -1,5 +1,5 @@
 import { useTheme } from "@material-ui/core/styles";
-import TextField from '@material-ui/core/TextField'; // Importação do TextField
+import TextField from '@material-ui/core/TextField';
 import React, { useEffect, useState } from "react";
 import {
     Cell,
@@ -14,8 +14,6 @@ import { i18n } from "../../translate/i18n";
 import CustomTooltip from "./CustomTooltip";
 import Title from "./Title";
 
-const COLORS = ["#8884d8", "#82ca9d", "#ffc658", "#ff8042", "#8dd1e1"];
-
 const ChartPerConnection = ({ searchParam, pageNumber, status, date, showAll, queueIds, withUnreadMessages }) => {
     const theme = useTheme();
 
@@ -28,36 +26,39 @@ const ChartPerConnection = ({ searchParam, pageNumber, status, date, showAll, qu
     };
 
     const [selectedDate, setSelectedDate] = useState(getCurrentDate());
-    const { ticketsByConnection, formatDateToDDMMYYYY } = useTickets({ searchParam, pageNumber, status, date, showAll, queueIds, withUnreadMessages });
+    const { tickets } = useTickets({
+        searchParam,
+        pageNumber,
+        status,
+        date: selectedDate,
+        showAll,
+        queueIds,
+        withUnreadMessages,
+    });
+
     const [connectionChartData, setConnectionChartData] = useState([]);
 
     useEffect(() => {
-        if (ticketsByConnection && Object.keys(ticketsByConnection).length > 0) {
-            let updatedData;
+        const connectionData = tickets.reduce((acc, ticket) => {
+            const connectionName = ticket.whatsapp?.name || "Sem Conexão";
+            const connectionColor = ticket.whatsapp?.color || "#5C59A0";
 
-            if (selectedDate === getCurrentDate()) {
-                updatedData = Object.entries(ticketsByConnection).map(([connectionName, dateCounts]) => {
-                    const totalCount = Object.values(dateCounts).reduce((acc, count) => acc + count, 0);
-                    return { name: connectionName, value: totalCount };
-                });
-            } else {
-                updatedData = Object.entries(ticketsByConnection).map(([connectionName, dateCounts]) => {
-                    const formattedDate = formatDateToDDMMYYYY(selectedDate);
-                    const count = dateCounts[formattedDate] || 0;
-                    return { name: connectionName, value: count };
-                });
+            if (!acc[connectionName]) {
+                acc[connectionName] = { value: 0, color: connectionColor };
             }
+            acc[connectionName].value++;
 
-            if (JSON.stringify(updatedData) !== JSON.stringify(connectionChartData)) {
-                setConnectionChartData(updatedData);
-            }
-        } else {
-            if (connectionChartData.length !== 0) {
-                setConnectionChartData([]);
-            }
-        }
-    }, [ticketsByConnection, selectedDate, formatDateToDDMMYYYY, connectionChartData]);
+            return acc;
+        }, {});
+
+        const formattedData = Object.entries(connectionData).map(([name, { value, color }]) => ({
+            name,
+            value,
+            color,
+        }));
 
+        setConnectionChartData(formattedData);
+    }, [tickets]);
 
     const handleDateChange = (event) => {
         setSelectedDate(event.target.value);
@@ -91,7 +92,7 @@ const ChartPerConnection = ({ searchParam, pageNumber, status, date, showAll, qu
                         label
                     >
                         {filteredChartData.map((entry, index) => (
-                            <Cell key={`cell-${index}`} fill={COLORS[index % COLORS.length]} />
+                            <Cell key={`cell-${index}`} fill={entry.color} />
                         ))}
                     </Pie>
                     <Tooltip content={<CustomTooltip />} cursor={true} />

diff --git a/frontend/src/pages/Dashboard/NewContactsChart.js b/frontend/src/pages/Dashboard/NewContactsChart.js
@@ -40,24 +40,6 @@ const NewContactsChart = ({
 
     const [contactsChartData, setContactsChartData] = useState([]);
 
-    const generateDateRange = (start, end) => {
-        const dateArray = [];
-        let currentDate = new Date(start);
-
-        while (currentDate <= end) {
-            const year = currentDate.getFullYear();
-            const month = String(currentDate.getMonth() + 1).padStart(2, '0');
-            const day = String(currentDate.getDate()).padStart(2, '0');
-            const formattedDate = `${year}-${month}-${day}`;
-
-            dateArray.push(formattedDate);
-            currentDate.setDate(currentDate.getDate() + 1);
-        }
-
-        return dateArray;
-    };
-
-
     const getLastWeekDateRange = () => {
         const end = new Date();
         const start = new Date();
@@ -68,17 +50,25 @@ const NewContactsChart = ({
     useEffect(() => {
         if (!startDate && !endDate) {
             const { start, end } = getLastWeekDateRange();
-            setStartDate(start.toISOString().split("T")[0]);
-            setEndDate(end.toISOString().split("T")[0]);
+
+            const formatToLocalDate = (date) => {
+                const year = date.getFullYear();
+                const month = String(date.getMonth() + 1).padStart(2, '0');
+                const day = String(date.getDate()).padStart(2, '0');
+                return `${year}-${month}-${day}`;
+            };
+
+            setStartDate(formatToLocalDate(start));
+            setEndDate(formatToLocalDate(end));
         }
-    }, [newContactsByDay, startDate, endDate]);
+    }, [startDate, endDate]);
 
     useEffect(() => {
         if (newContactsByDay && Object.keys(newContactsByDay).length > 0 && startDate && endDate) {
             const start = new Date(startDate);
             const end = new Date(endDate);
 
-            const dateRange = generateDateRange(start, end);
+            const dateRange = generateDateRange(start, new Date(end.setHours(23, 59, 59, 999)));
 
             const formattedData = dateRange.map((date) => {
                 const formattedDate = date.split("-").reverse().join("/");
@@ -96,6 +86,23 @@ const NewContactsChart = ({
         }
     }, [newContactsByDay, startDate, endDate]);
 
+    const generateDateRange = (start, end) => {
+        const dateArray = [];
+        let currentDate = new Date(start);
+
+        while (currentDate <= end) {
+            const year = currentDate.getFullYear();
+            const month = String(currentDate.getMonth() + 1).padStart(2, '0');
+            const day = String(currentDate.getDate()).padStart(2, '0');
+            const formattedDate = `${year}-${month}-${day}`;
+
+            dateArray.push(formattedDate);
+            currentDate.setDate(currentDate.getDate() + 1);
+        }
+
+        return dateArray;
+    };
+
     return (
         <React.Fragment>
             <Title>{i18n.t("dashboard.newContacts.title")}</Title>