From ffcefe8f12dedc8b3d8f8fde7f80bbe2e5b2d016 Mon Sep 17 00:00:00 2001 From: adriano Date: Thu, 28 Jul 2022 14:55:23 -0300 Subject: [PATCH] =?UTF-8?q?Finaliza=C3=A7=C3=A3o=20do=20relatorio=20carreg?= =?UTF-8?q?ado=20sob=20demanda?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- backend/src/controllers/ReportController.ts | 13 +- .../20220221193811-create-scheduling-data.ts | 2 +- .../helpers/SchedulingNotifySendMessage.ts | 31 ++ .../TicketServices/ShowTicketReport.ts | 42 +- .../WbotServices/wbotMessageListener.ts | 1 + frontend/src/components/MessagesList/index.js | 8 +- .../src/components/Report/MTable/index.js | 170 +++++-- .../components/TicketActionButtons/index.js | 2 +- frontend/src/components/TicketsList/index.js | 7 +- frontend/src/hooks/useWhatsApps/index.js | 25 +- frontend/src/pages/Connections/index.js | 429 ++++++++++-------- frontend/src/pages/Contacts/index.js | 9 + frontend/src/pages/Report/index.js | 177 +++++--- frontend/src/rules.js | 1 + 14 files changed, 588 insertions(+), 329 deletions(-) diff --git a/backend/src/controllers/ReportController.ts b/backend/src/controllers/ReportController.ts index bf59bbb..588e494 100644 --- a/backend/src/controllers/ReportController.ts +++ b/backend/src/controllers/ReportController.ts @@ -24,6 +24,7 @@ type IndexQuery = { userId: string; startDate: string; endDate: string; + pageNumber: string; }; @@ -33,13 +34,17 @@ export const reportUserByDateStartDateEnd = async (req: Request, res: Response): throw new AppError("ERR_NO_PERMISSION", 403); } - const { userId, startDate, endDate } = req.query as IndexQuery + const { userId, startDate, endDate, pageNumber } = req.query as IndexQuery + + + console.log('PAGE NUMBER: ', pageNumber) - const data_query = await ShowTicketReport(userId, startDate, endDate); + const { tickets, count, hasMore } = await ShowTicketReport({userId, startDate, endDate, pageNumber}); - return res.status(200).json(data_query); - + // return res.status(200).json(data_query); + + return res.status(200).json({ tickets, count, hasMore }); }; diff --git a/backend/src/database/seeds/20220221193811-create-scheduling-data.ts b/backend/src/database/seeds/20220221193811-create-scheduling-data.ts index 34514f8..06d37d5 100644 --- a/backend/src/database/seeds/20220221193811-create-scheduling-data.ts +++ b/backend/src/database/seeds/20220221193811-create-scheduling-data.ts @@ -6,7 +6,7 @@ module.exports = { "StatusChatEnds", [ { - name: "SEM RETORNO DO CLIENTE", + name: "FINALIZADO", createdAt: new Date(), updatedAt: new Date() }, diff --git a/backend/src/helpers/SchedulingNotifySendMessage.ts b/backend/src/helpers/SchedulingNotifySendMessage.ts index 792281a..5a9ca55 100644 --- a/backend/src/helpers/SchedulingNotifySendMessage.ts +++ b/backend/src/helpers/SchedulingNotifySendMessage.ts @@ -13,6 +13,8 @@ const fastFolderSize = require('fast-folder-size') const { promisify } = require('util') const fs = require('fs') +const { exec } = require("child_process"); + let scheduler_monitor: any; let timeInterval = 5 @@ -53,6 +55,35 @@ const monitor = async () => { } + exec("df -h /", (error: any, stdout: any, stderr: any) => { + + if (error) { + console.log(`exec error: ${error.message}`); + return; + } + if (stderr) { + console.log(`exec stderr: ${stderr}`); + return; + } + + stdout = stdout.split(/\r?\n/) + stdout = stdout[1].trim().split(/\s+/) + + // DISK SPACE MONITORING + const io = getIO(); + io.emit("diskSpaceMonit", { + action: "update", + diskSpace: { + size: stdout[1], + used: stdout[2], + available: stdout[3], + use: stdout[4] + } + }); + + }); + + // WHATS SESSION SIZE MONITORING const whatsapps = await ListWhatsAppsService(); diff --git a/backend/src/services/TicketServices/ShowTicketReport.ts b/backend/src/services/TicketServices/ShowTicketReport.ts index 835922b..f11e41a 100644 --- a/backend/src/services/TicketServices/ShowTicketReport.ts +++ b/backend/src/services/TicketServices/ShowTicketReport.ts @@ -16,12 +16,31 @@ import { startOfDay, endOfDay, parseISO, getDate} from "date-fns"; import { string } from "yup/lib/locale"; import Whatsapp from "../../models/Whatsapp"; +interface Request { + userId: string | number; + startDate: string; + endDate: string; + pageNumber?: string; +} + + +interface Response { + tickets: Ticket[]; + count: number; + hasMore: boolean; +} + //Report by user, startDate, endDate -const ShowTicketReport = async (id: string | number, startDate: string, endDate: string): Promise => { +const ShowTicketReport = async ({ + userId, + startDate, + endDate, + pageNumber = "1" +}: Request): Promise => { let where_clause = {} - if(id=='0'){ + if(userId=='0'){ where_clause = { createdAt: { [Op.gte]: startDate+' 00:00:00.000000', @@ -31,7 +50,7 @@ const ShowTicketReport = async (id: string | number, startDate: string, endDate: } else{ where_clause = { - userid: id, + userid: userId, createdAt: { [Op.gte]: startDate+' 00:00:00.000000', [Op.lte]: endDate +' 23:59:59.999999' @@ -40,11 +59,14 @@ const ShowTicketReport = async (id: string | number, startDate: string, endDate: } - + const limit = 40; + const offset = limit * (+pageNumber - 1); - const ticket = await Ticket.findAll({ + const {count, rows: tickets} = await Ticket.findAndCountAll({ where: where_clause , + limit, + offset, //attributes: ['id', 'status', 'createdAt', 'updatedAt'], attributes: ['id', 'status', 'statusChatEnd', [Sequelize.fn("DATE_FORMAT",Sequelize.col("Ticket.createdAt"),"%d/%m/%Y %H:%i:%s"),"createdAt"], @@ -81,15 +103,21 @@ const ShowTicketReport = async (id: string | number, startDate: string, endDate: attributes: ['name'] }, ], + + order: [ + ['id', 'ASC'] + ] }); + + const hasMore = count > offset + tickets.length; - if (!ticket) { + if (!tickets) { throw new AppError("ERR_NO_TICKET_FOUND", 404); } - return ticket; + return {tickets, count, hasMore}; }; export default ShowTicketReport; diff --git a/backend/src/services/WbotServices/wbotMessageListener.ts b/backend/src/services/WbotServices/wbotMessageListener.ts index 961fb99..caeae3b 100644 --- a/backend/src/services/WbotServices/wbotMessageListener.ts +++ b/backend/src/services/WbotServices/wbotMessageListener.ts @@ -825,6 +825,7 @@ const handleMsgAck = async (msg: WbotMessage, ack: MessageAck) => { action: "update", message: messageToUpdate }); + } catch (err) { Sentry.captureException(err); logger.error(`Error handling message ack. Err: ${err}`); diff --git a/frontend/src/components/MessagesList/index.js b/frontend/src/components/MessagesList/index.js index 0344c7b..3f7fe46 100644 --- a/frontend/src/components/MessagesList/index.js +++ b/frontend/src/components/MessagesList/index.js @@ -362,15 +362,17 @@ const MessagesList = ({ ticketId, isGroup }) => { socket.on("connect", () => socket.emit("joinChatBox", ticketId)); socket.on("appMessage", (data) => { + if (data.action === "create") { - dispatch({ type: "ADD_MESSAGE", payload: data.message }); - - // console.log('* NOVA MENSAGEM CAP: ', data.message) + dispatch({ type: "ADD_MESSAGE", payload: data.message }); scrollToBottom(); } if (data.action === "update") { + + console.log('2 THIS IS THE DATA: ', data) + dispatch({ type: "UPDATE_MESSAGE", payload: data.message }); } }); diff --git a/frontend/src/components/Report/MTable/index.js b/frontend/src/components/Report/MTable/index.js index a2ca6b5..b3f5dbe 100644 --- a/frontend/src/components/Report/MTable/index.js +++ b/frontend/src/components/Report/MTable/index.js @@ -4,82 +4,154 @@ import MaterialTable from 'material-table'; import Modal from '../Modal' import { render } from '@testing-library/react'; +import chat from '@material-ui/icons/Chat'; + +// import Button from "@material-ui/core/Button"; + import React from 'react'; const MTable = (props) => { - const [selectedRow, setSelectedRow] = useState(null); - + const tableRef = React.useRef(); + + const openInNewTab = url => { + window.open(url, '_blank', 'noopener,noreferrer'); + }; + + const [selectedRow, setSelectedRow] = useState(null); //const dataLoad = props.data.map((dt) => { return { ...dt }}); const dataLoad = props.data.map(({ user, ...others }) => ({ ...others, 'user': user ? user : { name: 'Aguardando atendente', email: '' } })); const columnsLoad = props.columns.map((column) => { return { ...column } }); + useEffect(() => { console.log(`You have clicked the button ${selectedRow} times`) + // console.log('TABLE REF: ', tableRef) + }, [selectedRow]); + + useEffect(() => { + + if (!tableRef.current) return + + const element = tableRef.current.tableContainerDiv.current; + + element.addEventListener('scroll', props.handleScroll); + + return () => { + element.removeEventListener('scroll', props.handleScroll); + }; + + }, [props]); + + + + + + return ( - + {/* */} - maxWidth={true} - - onRowClick={(evt, selectedRow) => { + {/* */} - if(props.removeClickRow){ - return + { + + if (props.removeClickRow) { + return + } + + console.log(selectedRow.tableData.id); + console.log(selectedRow); + console.log(selectedRow.messages); + setSelectedRow(selectedRow.tableData.id) + + if (props.hasChild) { + render() + } + + console.log('props.hasChild: ', props.hasChild) + + //evt.stopPropagation() } - - console.log(selectedRow.tableData.id); - console.log(selectedRow); - console.log(selectedRow.messages); - setSelectedRow(selectedRow.tableData.id) - - if (props.hasChild) { - render() } - console.log('props.hasChild: ', props.hasChild) - //evt.stopPropagation() - } - } + actions={[ + (rowData) => { - options={{ - search: true, - selection: false, - paging: false, - padding: 'dense', - sorting: true ? props.hasChild : false, - //loadingType: 'linear', - searchFieldStyle: { - width: 300, - }, + if(props.hasChild){ + return { + icon: chat, + tooltip: `Ticket id ${rowData.id}`, + disable: false, + onClick: (event, rowData) => { + + openInNewTab(`/tickets/${rowData.id}`) + + } + } + } + } + ]} + + options={{ + search: true, + selection: false, + paging: false, + padding: 'dense', + + exportButton: props.hasChild ? true : null, + exportAllData: true, + + sorting: true ? props.hasChild : false, + loadingType: 'circular', + searchFieldStyle: { + width: 300, + }, + + pageSize: 20, + + headerStyle: { + position: "sticky", + top: "0" + }, + + maxBodyHeight: "400px", + // minBodyHeight: "85vh", //FIXME to calculate dynamic height, needed for correct scroll position identification + // maxBodyHeight: "85vh", + + + + rowStyle: rowData => ({ + fontSize: 12, + backgroundColor: selectedRow === rowData.tableData.id ? '#ec5114' : '#FFF' + }) + }} + /> + - pageSize: 20, - headerStyle: { - position: "sticky", - top: "0" - }, - maxBodyHeight: "400px", - rowStyle: rowData => ({ - fontSize: 12, - backgroundColor: selectedRow === rowData.tableData.id ? '#ec5114' : '#FFF' - }) - }} - /> ); }; diff --git a/frontend/src/components/TicketActionButtons/index.js b/frontend/src/components/TicketActionButtons/index.js index 3919503..e8a21e3 100644 --- a/frontend/src/components/TicketActionButtons/index.js +++ b/frontend/src/components/TicketActionButtons/index.js @@ -35,7 +35,7 @@ const TicketActionButtons = ({ ticket, statusChatEnd }) => { const ticketOptionsMenuOpen = Boolean(anchorEl); const { user } = useContext(AuthContext); - const handleOpenTicketOptionsMenu = e => { + const handleOpenTicketOptionsMenu = e => { setAnchorEl(e.currentTarget); }; diff --git a/frontend/src/components/TicketsList/index.js b/frontend/src/components/TicketsList/index.js index 1fb3263..442cbd4 100644 --- a/frontend/src/components/TicketsList/index.js +++ b/frontend/src/components/TicketsList/index.js @@ -235,7 +235,7 @@ const TicketsList = (props) => { }); } - if (data.action === "update" && notBelongsToUserQueues(data.ticket)) { + if (data.action === "update" && notBelongsToUserQueues(data.ticket)) { dispatch({ type: "DELETE_TICKET", payload: data.ticket.id }); } @@ -285,10 +285,11 @@ const TicketsList = (props) => { setPageNumber(prevState => prevState + 1); }; - const handleScroll = e => { + const handleScroll = e => { + if (!hasMore || loading) return; - const { scrollTop, scrollHeight, clientHeight } = e.currentTarget; + const { scrollTop, scrollHeight, clientHeight } = e.currentTarget; if (scrollHeight - (scrollTop + 100) < clientHeight) { loadMore(); diff --git a/frontend/src/hooks/useWhatsApps/index.js b/frontend/src/hooks/useWhatsApps/index.js index 19e8717..c7ed37b 100644 --- a/frontend/src/hooks/useWhatsApps/index.js +++ b/frontend/src/hooks/useWhatsApps/index.js @@ -39,6 +39,19 @@ const reducer = (state, action) => { } + // if (action.type === "UPDATE_DISK_SPACE_MONIT") { + // const whatsApp = action.payload; + // const whatsAppIndex = state.findIndex(s => s.id === whatsApp.id); + + // if (whatsAppIndex !== -1) { + // state[whatsAppIndex].sessionSize = whatsApp.sessionSize; + // return [...state]; + // } else { + // return [whatsApp, ...state]; + // } + // } + + if (action.type === "UPDATE_WHATSAPPS_SESSION_MONIT") { const whatsApp = action.payload; const whatsAppIndex = state.findIndex(s => s.id === whatsApp.id); @@ -106,11 +119,7 @@ const useWhatsApps = () => { dispatch({ type: "UPDATE_SESSION", payload: data.session }); } - }); - - - - //test del + }); socket.on("whatsappSessionMonit", data => { if (data.action === "update") { @@ -119,9 +128,9 @@ const useWhatsApps = () => { dispatch({ type: "UPDATE_WHATSAPPS_SESSION_MONIT", payload: data.whatsappSessionSize }); } - }); - - // + }); + + return () => { socket.disconnect(); diff --git a/frontend/src/pages/Connections/index.js b/frontend/src/pages/Connections/index.js index 1cf53f6..2efc13d 100644 --- a/frontend/src/pages/Connections/index.js +++ b/frontend/src/pages/Connections/index.js @@ -1,7 +1,9 @@ -import React, { useState, useCallback, useContext } from "react"; +import React, { useState, useCallback, useEffect, useContext } from "react"; import { toast } from "react-toastify"; import { format, parseISO } from "date-fns"; +import openSocket from "socket.io-client"; + import { makeStyles } from "@material-ui/core/styles"; import { green } from "@material-ui/core/colors"; import { @@ -111,6 +113,8 @@ const Connections = () => { const [selectedWhatsApp, setSelectedWhatsApp] = useState(null); const [confirmModalOpen, setConfirmModalOpen] = useState(false); + const [diskSpaceInfo, setDiskSpaceInfo] = useState({}); + @@ -324,6 +328,23 @@ const Connections = () => { ); }; + + useEffect(() => { + const socket = openSocket(process.env.REACT_APP_BACKEND_URL); + + socket.on("diskSpaceMonit", data => { + if (data.action === "update") { + + setDiskSpaceInfo(data.diskSpace) + + } + }); + + return () => { + socket.disconnect(); + }; + }, []); + return ( { /> + + {i18n.t("connections.title")} + { )} /> + + - - - + <> - - {i18n.t("connections.table.name")} - - - - {i18n.t("connections.table.status")} - - - ( - - {i18n.t("connections.table.session")} - - )} - /> - - - - - ( - - Restore - - )} - /> - - - - ( - - Session MB - - )} - /> - - - - - - {i18n.t("connections.table.lastUpdate")} - - - {i18n.t("connections.table.default")} - - - {i18n.t("connections.table.actions")} - - - - - {loading ? ( - - ) : ( + ( <> - {whatsApps?.length > 0 && - whatsApps.map(whatsApp => ( - - {whatsApp.name} - - - {renderStatusToolTips(whatsApp)} - - - ( - - {renderActionButtons(whatsApp)} - - )} - /> - - - - - - - ( - - - - - - )} - /> - - - - ( - - -
{whatsApp.sessionSize}
- - - )} - /> - - - - - - - {format(parseISO(whatsApp.updatedAt), "dd/MM/yy HH:mm")} - - - - - {whatsApp.isDefault && ( -
- -
- )} - - - - - - ( - handleEditWhatsApp(whatsApp)} - > - - - )} - /> - - - ( - { - handleOpenConfirmationModal("delete", whatsApp.id); - }} - > - - - )} - /> - - - - ))} - +
+ + + + Size + + + Used + + + Available + + + Use% + + + + + + + {diskSpaceInfo.size} + {diskSpaceInfo.used} + {diskSpaceInfo.available} + {diskSpaceInfo.use} + + +
+
+ )} - - + /> + + + + + + + {i18n.t("connections.table.name")} + + + + {i18n.t("connections.table.status")} + + + ( + + {i18n.t("connections.table.session")} + + )} + /> + + + + + ( + + Restore + + )} + /> + + + + ( + + Session MB + + )} + /> + + + + + + {i18n.t("connections.table.lastUpdate")} + + + {i18n.t("connections.table.default")} + + + {i18n.t("connections.table.actions")} + + + + + {loading ? ( + + ) : ( + <> + {whatsApps?.length > 0 && + whatsApps.map(whatsApp => ( + + {whatsApp.name} + + + {renderStatusToolTips(whatsApp)} + + + ( + + {renderActionButtons(whatsApp)} + + )} + /> + + + + + + + ( + + + + + + )} + /> + + + + ( + + +
{whatsApp.sessionSize}
+ + + )} + /> + + + + + + + {format(parseISO(whatsApp.updatedAt), "dd/MM/yy HH:mm")} + + + + + {whatsApp.isDefault && ( +
+ +
+ )} + + + + + + ( + handleEditWhatsApp(whatsApp)} + > + + + )} + /> + + + ( + { + handleOpenConfirmationModal("delete", whatsApp.id); + }} + > + + + )} + /> + + + + ))} + + )} + +
+ + )} diff --git a/frontend/src/pages/Contacts/index.js b/frontend/src/pages/Contacts/index.js index e2df88d..da21442 100644 --- a/frontend/src/pages/Contacts/index.js +++ b/frontend/src/pages/Contacts/index.js @@ -36,17 +36,23 @@ import { AuthContext } from "../../context/Auth/AuthContext"; import { Can } from "../../components/Can"; const reducer = (state, action) => { + + if (action.type === "LOAD_CONTACTS") { + const contacts = action.payload; const newContacts = []; contacts.forEach((contact) => { + const contactIndex = state.findIndex((c) => c.id === contact.id); + if (contactIndex !== -1) { state[contactIndex] = contact; } else { newContacts.push(contact); } + }); return [...state, ...newContacts]; @@ -210,6 +216,9 @@ const Contacts = () => { const handleScroll = (e) => { if (!hasMore || loading) return; const { scrollTop, scrollHeight, clientHeight } = e.currentTarget; + + // console.log('scrollTop: ', scrollTop, ' | scrollHeight: ', scrollHeight, ' | clientHeight: ', clientHeight) + if (scrollHeight - (scrollTop + 100) < clientHeight) { loadMore(); } diff --git a/frontend/src/pages/Report/index.js b/frontend/src/pages/Report/index.js index 4b5d94d..cd59b8b 100644 --- a/frontend/src/pages/Report/index.js +++ b/frontend/src/pages/Report/index.js @@ -18,10 +18,13 @@ import MaterialTable from 'material-table'; import LogoutIcon from '@material-ui/icons/CancelOutlined'; + + import { CSVLink } from "react-csv"; +// import CircularProgress from '@mui/material/CircularProgress'; -import openSocket from "socket.io-client"; +import openSocket from "socket.io-client"; const report = [{ 'value': '1', 'label': 'Atendimento por atendentes' }, { 'value': '2', 'label': 'Usuários online/offline' }] @@ -77,7 +80,7 @@ let columns = [ }, { key: 'ticket.statusChatEnd', - label: 'Status de encerramento', + label: 'Status de encerramento', } ] @@ -104,7 +107,7 @@ const reducerQ = (state, action) => { const userIndex = state.findIndex((u) => `${u.id}` === `${userId}`); - // console.log('>>>>>>>>>>>>>>>>>>>>> userIndex: ', userIndex) + // console.log('>>>>>>>>>>>>>>>>>>>>> userIndex: ', userIndex) if (userIndex !== -1) { state.splice(userIndex, 1); @@ -117,7 +120,6 @@ const reducerQ = (state, action) => { if (action.type === 'LOAD_QUERY') { - const queries = action.payload const newQueries = [] @@ -143,7 +145,7 @@ const reducerQ = (state, action) => { let onlineUser = action.payload let index = -1 - // console.log('sssssssssstate: ', state, ' | ONLINE USERS: onlineUser.userId ', onlineUser.userId) + // console.log('sssssssssstate: ', state, ' | ONLINE USERS: onlineUser.userId ', onlineUser.userId) if (onlineUser.sumOpen || onlineUser.sumClosed) { index = state.findIndex((e) => ((onlineUser.sumOpen && e.id === onlineUser.sumOpen.userId) || (onlineUser.sumClosed && e.id === onlineUser.sumClosed.userId))) @@ -152,13 +154,13 @@ const reducerQ = (state, action) => { index = state.findIndex((e) => `${e.id}` === `${onlineUser.userId}`) } - //console.log(' *********************** index: ', index) + //console.log(' *********************** index: ', index) if (index !== -1) { - // console.log('ENTROU NO INDEX') + // console.log('ENTROU NO INDEX') if (!("statusOnline" in state[index])) { @@ -183,10 +185,10 @@ const reducerQ = (state, action) => { if (onlineUser.sumOpen) { if ("sumOpen" in state[index]) { - // console.log(' >>>>>>>>>>>>>>>>>> sumOpen 1 | state[index].sumOpen["count"]: ', state[index].sumOpen['count'], ' | onlineUser.sumOpen.count: ', onlineUser.sumOpen.count) + // console.log(' >>>>>>>>>>>>>>>>>> sumOpen 1 | state[index].sumOpen["count"]: ', state[index].sumOpen['count'], ' | onlineUser.sumOpen.count: ', onlineUser.sumOpen.count) state[index].sumOpen['count'] = onlineUser.sumOpen.count } else if (!("sumOpen" in state[index])) { - // console.log(' >>>>>>>>>>>>>>>>>> sumOpen 1') + // console.log(' >>>>>>>>>>>>>>>>>> sumOpen 1') state[index].sumOpen = onlineUser.sumOpen } @@ -195,10 +197,10 @@ const reducerQ = (state, action) => { if (onlineUser.sumClosed) { if ("sumClosed" in state[index]) { - // console.log(' >>>>>>>>>>>>>>>>>> sumClosed 1 | state[index].sumClosed["count"]: ', state[index].sumClosed['count'], ' | onlineUser.sumClosed.count: ', onlineUser.sumClosed.count) + // console.log(' >>>>>>>>>>>>>>>>>> sumClosed 1 | state[index].sumClosed["count"]: ', state[index].sumClosed['count'], ' | onlineUser.sumClosed.count: ', onlineUser.sumClosed.count) state[index].sumClosed['count'] = onlineUser.sumClosed.count } else if (!("sumClosed" in state[index])) { - // console.log(' >>>>>>>>>>>>>>>>>> sumOpen 1') + // console.log(' >>>>>>>>>>>>>>>>>> sumOpen 1') state[index].sumClosed = onlineUser.sumClosed } @@ -298,22 +300,29 @@ let columnsData = [ { title: 'Assunto', field: 'queue.name' }, { title: 'Status', field: 'status' }, - + { title: 'Criado', field: 'createdAt' }, //{title: 'Atualizado', field: 'updatedAt'}, - {title: 'Status de encerramento', field: 'statusChatEnd'}]; + { title: 'Status de encerramento', field: 'statusChatEnd' }]; const Report = () => { const csvLink = useRef() + const { user: userA } = useContext(AuthContext); //-------- const [searchParam] = useState(""); - //const [loading, setLoading] = useState(false); - //const [hasMore, setHasMore] = useState(false); + + const [loading, setLoading] = useState(false); + const [hasMore, setHasMore] = useState(false); + const [pageNumberTickets, setTicketsPageNumber] = useState(1); + const [totalCountTickets, setTotalCountTickets] = useState(0); + + + const [pageNumber, setPageNumber] = useState(1); const [users, dispatch] = useReducer(reducer, []); //const [columns, setColums] = useState([]) @@ -329,14 +338,14 @@ const Report = () => { const [reporList,] = useState(report) const [profile, setProfile] = useState('') const [dataRows, setData] = useState([]); - + useEffect(() => { dispatch({ type: "RESET" }); dispatchQ({ type: "RESET" }) - + setTicketsPageNumber(1) setPageNumber(1); }, [searchParam, profile]); @@ -380,20 +389,24 @@ const Report = () => { const delayDebounceFn = setTimeout(() => { + setLoading(true); const fetchQueries = async () => { try { if (reportOption === '1') { - const dataQuery = await api.get("/reports/", { params: { userId, startDate, endDate }, }); - dispatchQ({ type: "RESET" }) - dispatchQ({ type: "LOAD_QUERY", payload: dataQuery.data }); + const { data } = await api.get("/reports/", { params: { userId, startDate, endDate, pageNumber: pageNumberTickets }, }); - //setLoading(false); + console.log('dataQuery: ', data) + console.log('pageNumberTickets: ', pageNumberTickets) - // console.log('dataQuery: ', dataQuery.data) + // dispatchQ({ type: "RESET" }) + dispatchQ({ type: "LOAD_QUERY", payload: data.tickets }); + + setHasMore(data.hasMore); + setTotalCountTickets(data.count) + setLoading(false); - // console.log() } else if (reportOption === '2') { @@ -404,7 +417,7 @@ const Report = () => { //setLoading(false); - // console.log('REPORT 2 dataQuery : ', dataQuery.data) + // console.log('REPORT 2 dataQuery : ', dataQuery.data) //console.log() @@ -420,7 +433,7 @@ const Report = () => { }, 500); return () => clearTimeout(delayDebounceFn); - }, [userId, startDate, endDate, reportOption]); + }, [userId, startDate, endDate, reportOption, pageNumberTickets, totalCountTickets]); // Get from child 1 @@ -449,7 +462,7 @@ const Report = () => { setReport(data) - // console.log(' data: ', data) + // console.log(' data: ', data) } useEffect(() => { @@ -461,22 +474,10 @@ const Report = () => { setProfile('user') } - }, [reportOption]) + }, [reportOption]) + - - // useEffect(() => { - - // console.log('>>>>>>>>>>>>>>>>>> New query: ', query) - - // }, [query]) - - - - // test del - - const handleCSVMessages = () => { - - // setLoading(true); + const handleCSVMessages = () => { const fetchQueries = async () => { @@ -484,7 +485,7 @@ const Report = () => { const dataQuery = await api.get("/reports/messages", { params: { userId, startDate, endDate }, }); - // console.log('dataQuery messages: ', dataQuery.data) + console.log('dataQuery messages: ', dataQuery.data) if (dataQuery.data.length > 0) { @@ -497,16 +498,11 @@ const Report = () => { else { dataCSVFormat[i].fromMe = 'Cliente' } - } - - // console.log('dataCSVFormat: ', dataCSVFormat) + } setDataCSV(dataCSVFormat) - setIsMount(false); - // setDataCSV(dataQuery.data) - } - - // setLoading(false); + setIsMount(false); + } } catch (err) { console.log(err); @@ -548,8 +544,8 @@ const Report = () => { let date = new Date().toLocaleDateString('pt-BR').split('/') let dateToday = `${date[2]}-${date[1]}-${date[0]}` - // console.log('date: ', new Date(startDate).toLocaleDateString('pt-BR')) - // console.log('date2: ', startDate) + // console.log('date: ', new Date(startDate).toLocaleDateString('pt-BR')) + // console.log('date2: ', startDate) if (data.action === "logout" || (data.action === "update" && @@ -571,7 +567,7 @@ const Report = () => { socket.on("user", (data) => { if (data.action === "delete") { - // console.log(' entrou no delete user: ', data) + // console.log(' entrou no delete user: ', data) dispatch({ type: "DELETE_USER", payload: +data.userId }); } }); @@ -581,9 +577,13 @@ const Report = () => { }; } + else if (reportOption === "1") { + dispatchQ({ type: "RESET" }) + setTicketsPageNumber(1) + } - }, [reportOption, startDate, endDate]); + }, [reportOption, startDate, endDate, userId]); // const handleDeleteRows = (id) => { @@ -621,7 +621,31 @@ const Report = () => { // toastError(err); } - + + }; + + + const loadMore = () => { + setTicketsPageNumber((prevState) => prevState + 1); + }; + + const handleScroll = (e) => { + + if (!hasMore || loading) return; + + const { scrollTop, scrollHeight, clientHeight } = e.currentTarget; + + // console.log('scrollTop: ', scrollTop, + // ' | scrollHeight: ', scrollHeight, + // ' | clientHeight: ', clientHeight, + // ' | scrollHeight - (scrollTop + 1): ', scrollHeight - (scrollTop + 1)) + + if (scrollHeight - (scrollTop + 1) < clientHeight) { + + loadMore(); + + // e.currentTarget.scrollTo(0, 200); + } }; @@ -639,7 +663,7 @@ const Report = () => { return { 'value': obj.id, 'label': obj.name } })} /> - + @@ -650,14 +674,16 @@ const Report = () => { {reportOption === '1' && -
- {/* */} +
{ } - - - - - + @@ -688,11 +710,22 @@ const Report = () => { {reportOption === '1' && - + //
+ //
+ + <> + + + + + } {reportOption === '2' && @@ -711,7 +744,7 @@ const Report = () => { [ // { title: 'Foto', field: 'ticket.contact.profilePicUrl', render: rowData => imagem de perfil do whatsapp }, - { title: 'Nome', field: 'name', cellStyle: {whiteSpace: 'nowrap'}, }, + { title: 'Nome', field: 'name', cellStyle: { whiteSpace: 'nowrap' }, }, { title: 'Status', field: 'statusOnline.status', @@ -765,7 +798,7 @@ const Report = () => { disable: false, onClick: (event, rowData) => { - // console.log(' ROW DATA INFO: ', rowData, ' | rowData: ', rowData.id) + // console.log(' ROW DATA INFO: ', rowData, ' | rowData: ', rowData.id) handleLogouOnlineUser(rowData.id) } } diff --git a/frontend/src/rules.js b/frontend/src/rules.js index fec35f1..9d42bf0 100644 --- a/frontend/src/rules.js +++ b/frontend/src/rules.js @@ -29,6 +29,7 @@ const rules = { "show-icon-add-queue", "show-icon-edit-queue", "show-icon-delete-queue", + "space-disk-info:show", "drawer-admin-items:view",