Remoção de console.log e desable do botao csv export

pull/20/head
adriano 2022-08-29 10:55:07 -03:00
parent 46c9119195
commit 118fa7398d
2 changed files with 58 additions and 252 deletions

View File

@ -19,20 +19,17 @@ const MTable = (props) => {
}; };
const [selectedRow, setSelectedRow] = useState(null); 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 dataLoad = props.data.map(({ user, ...others }) => ({ ...others, 'user': user ? user : { name: 'Aguardando atendente', email: '' } }));
const columnsLoad = props.columns.map((column) => { return { ...column } }); const columnsLoad = props.columns.map((column) => { return { ...column } });
useEffect(() => { // useEffect(() => {
console.log(`You have clicked the button ${selectedRow} times`) // console.log(`You have clicked the button ${selectedRow} times`)
// console.log('TABLE REF: ', tableRef) // }, [selectedRow]);
}, [selectedRow]);
useEffect(() => { useEffect(() => {
@ -76,10 +73,7 @@ const MTable = (props) => {
if (props.removeClickRow) { if (props.removeClickRow) {
return return
} }
console.log(selectedRow.tableData.id);
console.log(selectedRow);
console.log(selectedRow.messages);
setSelectedRow(selectedRow.tableData.id) setSelectedRow(selectedRow.tableData.id)
if (props.hasChild) { if (props.hasChild) {
@ -89,8 +83,7 @@ const MTable = (props) => {
user={selectedRow.user.name} user={selectedRow.user.name}
clientContactNumber={selectedRow.contact.number} />) clientContactNumber={selectedRow.contact.number} />)
} }
console.log('props.hasChild: ', props.hasChild)
//evt.stopPropagation() //evt.stopPropagation()
} }

View File

@ -1,8 +1,7 @@
import React, { useState, useEffect, useReducer, useContext, useRef } from "react"; import React, { useState, useEffect, useReducer, useContext } from "react";
import MainContainer from "../../components/MainContainer"; import MainContainer from "../../components/MainContainer";
import api from "../../services/api"; import api from "../../services/api";
import SelectField from "../../components/Report/SelectField"; import SelectField from "../../components/Report/SelectField";
//import { data } from '../../components/Report/MTable/data';
import DatePicker1 from '../../components/Report/DatePicker' import DatePicker1 from '../../components/Report/DatePicker'
import DatePicker2 from '../../components/Report/DatePicker' import DatePicker2 from '../../components/Report/DatePicker'
import MTable from "../../components/Report/MTable"; import MTable from "../../components/Report/MTable";
@ -21,95 +20,19 @@ import LogoutIcon from '@material-ui/icons/CancelOutlined';
import apiBroker from "../../services/apiBroker"; import apiBroker from "../../services/apiBroker";
import fileDownload from 'js-file-download' import fileDownload from 'js-file-download'
import fs from 'fs' import openSocket from "socket.io-client";
import { CSVLink } from "react-csv";
// import CircularProgress from '@mui/material/CircularProgress';
import openSocket from "socket.io-client";
import { set } from "date-fns";
const report = [{ 'value': '1', 'label': 'Atendimento por atendentes' }, { 'value': '2', 'label': 'Usuários online/offline' }] const report = [{ 'value': '1', 'label': 'Atendimento por atendentes' }, { 'value': '2', 'label': 'Usuários online/offline' }]
let columns = [
{
key: 'ticket.whatsapp.name',
label: 'Loja',
},
{
key: 'id',
label: 'id Mensagem',
},
{
key: 'ticket.id',
label: 'id Conversa',
},
{
key: 'ticket.contact.name',
label: 'Cliente',
},
{
key: 'ticket.user.name',
label: 'Atendente',
},
{
key: 'body',
label: 'Mensagem',
},
{
key: 'fromMe',
label: 'Sentido',
},
{
key: 'createdAt',
label: 'Criada',
},
{
key: 'ticket.contact.number',
label: 'Telefone cliente',
},
{
key: 'ticket.queue.name',
label: 'Fila',
},
{
key: 'ticket.status',
label: 'Status',
},
{
key: 'ticket.statusChatEnd',
label: 'Status de encerramento',
}
]
//
const reducerQ = (state, action) => { const reducerQ = (state, action) => {
if (action.type === "DELETE_USER_STATUS") { if (action.type === "DELETE_USER_STATUS") {
const userId = action.payload; const userId = action.payload;
//console.log('Entrou no delete user status userId: ', userId) const userIndex = state.findIndex((u) => `${u.id}` === `${userId}`);
const userIndex = state.findIndex((u) => `${u.id}` === `${userId}`);
// console.log('>>>>>>>>>>>>>>>>>>>>> userIndex: ', userIndex)
if (userIndex !== -1) { if (userIndex !== -1) {
state.splice(userIndex, 1); state.splice(userIndex, 1);
@ -146,24 +69,16 @@ const reducerQ = (state, action) => {
let onlineUser = action.payload let onlineUser = action.payload
let index = -1 let index = -1
// console.log('sssssssssstate: ', state, ' | ONLINE USERS: onlineUser.userId ', onlineUser.userId)
if (onlineUser.sumOpen || onlineUser.sumClosed) { if (onlineUser.sumOpen || onlineUser.sumClosed) {
index = state.findIndex((e) => ((onlineUser.sumOpen && e.id === onlineUser.sumOpen.userId) || (onlineUser.sumClosed && e.id === onlineUser.sumClosed.userId))) index = state.findIndex((e) => ((onlineUser.sumOpen && e.id === onlineUser.sumOpen.userId) || (onlineUser.sumClosed && e.id === onlineUser.sumClosed.userId)))
} }
else { else {
index = state.findIndex((e) => `${e.id}` === `${onlineUser.userId}`) index = state.findIndex((e) => `${e.id}` === `${onlineUser.userId}`)
} }
//console.log(' *********************** index: ', index) if (index !== -1) {
if (index !== -1) {
// console.log('ENTROU NO INDEX')
if (!("statusOnline" in state[index])) { if (!("statusOnline" in state[index])) {
state[index].statusOnline = onlineUser state[index].statusOnline = onlineUser
@ -186,11 +101,9 @@ const reducerQ = (state, action) => {
if (onlineUser.sumOpen) { if (onlineUser.sumOpen) {
if ("sumOpen" in state[index]) { if ("sumOpen" in state[index]) {
// 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 state[index].sumOpen['count'] = onlineUser.sumOpen.count
} else if (!("sumOpen" in state[index])) { } else if (!("sumOpen" in state[index])) {
// console.log(' >>>>>>>>>>>>>>>>>> sumOpen 1')
state[index].sumOpen = onlineUser.sumOpen state[index].sumOpen = onlineUser.sumOpen
} }
@ -198,11 +111,9 @@ const reducerQ = (state, action) => {
if (onlineUser.sumClosed) { if (onlineUser.sumClosed) {
if ("sumClosed" in state[index]) { if ("sumClosed" in state[index]) {
// 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 state[index].sumClosed['count'] = onlineUser.sumClosed.count
} else if (!("sumClosed" in state[index])) { } else if (!("sumClosed" in state[index])) {
// console.log(' >>>>>>>>>>>>>>>>>> sumOpen 1')
state[index].sumClosed = onlineUser.sumClosed state[index].sumClosed = onlineUser.sumClosed
} }
@ -308,10 +219,7 @@ let columnsData = [
{ title: 'Status de encerramento', field: 'statusChatEnd' }]; { title: 'Status de encerramento', field: 'statusChatEnd' }];
const Report = () => { const Report = () => {
const csvLink = useRef()
const { user: userA } = useContext(AuthContext); const { user: userA } = useContext(AuthContext);
@ -326,15 +234,12 @@ const Report = () => {
const [pageNumber, setPageNumber] = useState(1); const [pageNumber, setPageNumber] = useState(1);
const [users, dispatch] = useReducer(reducer, []); const [users, dispatch] = useReducer(reducer, []);
//const [columns, setColums] = useState([])
const [startDate, setDatePicker1] = useState(new Date()) const [startDate, setDatePicker1] = useState(new Date())
const [endDate, setDatePicker2] = useState(new Date()) const [endDate, setDatePicker2] = useState(new Date())
const [userId, setUser] = useState(null) const [userId, setUser] = useState(null)
const [query, dispatchQ] = useReducer(reducerQ, []) const [query, dispatchQ] = useReducer(reducerQ, [])
const [dataCSV, setDataCSV] = useState([])
const [isMount, setIsMount] = useState(true);
const [reportOption, setReport] = useState('1') const [reportOption, setReport] = useState('1')
const [reporList,] = useState(report) const [reporList,] = useState(report)
@ -363,17 +268,13 @@ const Report = () => {
const fetchUsers = async () => { const fetchUsers = async () => {
try { try {
//console.log('profile: ', profile)
const { data } = await api.get("/users/", { const { data } = await api.get("/users/", {
params: { searchParam, pageNumber, profile }, params: { searchParam, pageNumber, profile },
}); });
dispatch({ type: "LOAD_USERS", payload: data.users }); dispatch({ type: "LOAD_USERS", payload: data.users });
//setHasMore(data.hasMore); //setLoading(false);
//setLoading(false);
} catch (err) { } catch (err) {
console.log(err); console.log(err);
@ -400,12 +301,8 @@ const Report = () => {
if (reportOption === '1') { if (reportOption === '1') {
const { data } = await api.get("/reports/", { params: { userId, startDate, endDate, pageNumber: pageNumberTickets }, }); const { data } = await api.get("/reports/", { params: { userId, startDate, endDate, pageNumber: pageNumberTickets }, });
// console.log('dataQuery: ', data)
// console.log('pageNumberTickets: ', pageNumberTickets)
// dispatchQ({ type: "RESET" })
dispatchQ({ type: "LOAD_QUERY", payload: data.tickets }); dispatchQ({ type: "LOAD_QUERY", payload: data.tickets });
setHasMore(data.hasMore); setHasMore(data.hasMore);
@ -466,8 +363,7 @@ const Report = () => {
const reportValue = (data) => { const reportValue = (data) => {
setReport(data) setReport(data)
// console.log(' data: ', data)
} }
useEffect(() => { useEffect(() => {
@ -506,10 +402,7 @@ const Report = () => {
else { else {
setOnQueueProcessStatus('empty') setOnQueueProcessStatus('empty')
} }
console.log('>>>>> queryOnqueue: ', queryOnQueue.data)
} catch (err) { } catch (err) {
console.log(err); console.log(err);
@ -521,16 +414,16 @@ const Report = () => {
}, 500); }, 500);
return () => clearTimeout(delayDebounceFn); return () => clearTimeout(delayDebounceFn);
}, []) }, [ userA ])
const handleCSVDownload = async () => { const handleCSVDownload = async () => {
try { try {
let res = await apiBroker.get(`/reports/download/${csvFile}`, { responseType: 'blob' }); let res = await apiBroker.get(`/reports/download/${csvFile}`, { responseType: 'blob' });
if (res) { if (res) {
fileDownload(res.data, `${csvFile}`); fileDownload(res.data, `${csvFile}`);
setOnQueueProcessStatus('empty') setOnQueueProcessStatus('empty')
@ -555,7 +448,7 @@ const Report = () => {
{ {
app: { app: {
adminId: userA.id, adminId: userA.id,
baseURL: process.env.REACT_APP_BACKEND_URL, baseURL: process.env.REACT_APP_BACKEND_URL,
frontURL: process.env.REACT_APP_FRONTEND_URL, frontURL: process.env.REACT_APP_FRONTEND_URL,
identifier: 'csv' identifier: 'csv'
}, },
@ -564,21 +457,11 @@ const Report = () => {
startDate: startDate, startDate: startDate,
endDate: endDate endDate: endDate
} }
}); });
console.log('dataQuery messages: ', querySavedOnQueue.data.queueStatus)
const onQueueStatus = querySavedOnQueue.data.queueStatus const onQueueStatus = querySavedOnQueue.data.queueStatus
setOnQueueProcessStatus(onQueueStatus) setOnQueueProcessStatus(onQueueStatus)
// if (onQueueStatus.data.length > 0) {
// let dataCSVFormat = queueStatus.data;
// setIsMount(false);
// }
} catch (err) { } catch (err) {
console.log(err); console.log(err);
@ -589,22 +472,7 @@ const Report = () => {
} }
useEffect(() => {
if (isMount) {
return;
}
csvLink.current.link.click()
}, [dataCSV, isMount, csvLink]);
useEffect(() => { useEffect(() => {
@ -613,7 +481,7 @@ const Report = () => {
socket.on("queryOnQueueStatus", (data) => { socket.on("queryOnQueueStatus", (data) => {
if (data.action === 'update') { if (data.action === 'update') {
if (String(data.queryOnQueue.adminId) === String(userA.id)) { if (String(data.queryOnQueue.adminId) === String(userA.id)) {
setCsvFile(data.queryOnQueue.file) setCsvFile(data.queryOnQueue.file)
setOnQueueProcessStatus(data.queryOnQueue.queueStatus) setOnQueueProcessStatus(data.queryOnQueue.queueStatus)
@ -624,8 +492,7 @@ const Report = () => {
}) })
if (reportOption === '2') { if (reportOption === '2') {
// const socket = openSocket(process.env.REACT_APP_BACKEND_URL);
socket.on("onlineStatus", (data) => { socket.on("onlineStatus", (data) => {
@ -633,9 +500,7 @@ const Report = () => {
let dateToday = `${date[2]}-${date[1]}-${date[0]}` let dateToday = `${date[2]}-${date[1]}-${date[0]}`
if (data.action === "logout" || (data.action === "update" && if (data.action === "logout" || (data.action === "update" &&
((`${startDate}` === `${endDate}`) && (`${endDate}` === `${dateToday}`) && (`${startDate}` === `${dateToday}`)))) { ((`${startDate}` === `${endDate}`) && (`${endDate}` === `${dateToday}`) && (`${startDate}` === `${dateToday}`)))) {
//console.log('UPDATE FROM ONLINE/OFFLINE LOGED USERS: ', data.userOnlineTime, ' | data.action : ', data.action)
dispatchQ({ type: "UPDATE_STATUS_ONLINE", payload: data.userOnlineTime }); dispatchQ({ type: "UPDATE_STATUS_ONLINE", payload: data.userOnlineTime });
@ -648,16 +513,11 @@ const Report = () => {
socket.on("user", (data) => { socket.on("user", (data) => {
if (data.action === "delete") { if (data.action === "delete") {
// console.log(' entrou no delete user: ', data)
dispatch({ type: "DELETE_USER", payload: +data.userId }); dispatch({ type: "DELETE_USER", payload: +data.userId });
} }
}); });
// return () => {
// socket.disconnect();
// };
} }
else if (reportOption === "1") { else if (reportOption === "1") {
@ -670,30 +530,10 @@ const Report = () => {
}; };
}, [reportOption, startDate, endDate, userId]); }, [reportOption, startDate, endDate, userId, userA]);
useEffect(() => {
// const handleDeleteRows = (id) => {
// let _data = [...dataRows];
// _data.forEach(rd => {
// _data = _data.filter(t => t.id !== id);
// });
// setData(_data);
// };
useEffect(() => {
//if (!loading) {
// setData(query.map(({ scheduleReminder, ...others }) => (
// { ...others, 'scheduleReminder': `${others.statusChatEndId}` === '3' ? 'Agendamento' : 'Lembrete' }
// )))
// }
setData(query.map((column) => { return { ...column } })) setData(query.map((column) => { return { ...column } }))
@ -721,18 +561,12 @@ const Report = () => {
if (!hasMore || loading) return; if (!hasMore || loading) return;
const { scrollTop, scrollHeight, clientHeight } = e.currentTarget; 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) { if (scrollHeight - (scrollTop + 1) < clientHeight) {
loadMore(); loadMore();
// e.currentTarget.scrollTo(0, 200);
} }
}; };
@ -743,6 +577,7 @@ const Report = () => {
return ( return (
<> <>
<Button <Button
disabled={query && query.length > 0 ? false : true}
variant="contained" variant="contained"
color="primary" color="primary"
onClick={(e) => { onClick={(e) => {
@ -769,7 +604,7 @@ const Report = () => {
handleCSVDownload() handleCSVDownload()
}} }}
> >
{"DOWNLOAD"} {"CSV DOWNLOAD"}
</Button> </Button>
</>); </>);
@ -802,7 +637,7 @@ const Report = () => {
<div style={{ margin: '2px' }}></div> <div style={{ margin: '2px' }}></div>
{reportOption === '1' && {reportOption === '1' &&
<div> <div>
{renderSwitch(onQueueStatus)} {renderSwitch(onQueueStatus)}
</div> </div>
@ -820,10 +655,7 @@ const Report = () => {
<Item sx={{ gridColumn: '1', gridRow: 'span 1' }}> <Item sx={{ gridColumn: '1', gridRow: 'span 1' }}>
{reportOption === '1' && {reportOption === '1' &&
// <div onScroll={handleScroll} style={{ height: 400, overflowY: "scroll" }}>
// </div>
<> <>
@ -893,8 +725,7 @@ const Report = () => {
] ]
} }
data={dataRows} data={dataRows}
// icons={tableIcons}
actions={[ actions={[
(rowData) => { (rowData) => {
@ -908,9 +739,7 @@ const Report = () => {
icon: LogoutIcon, icon: LogoutIcon,
tooltip: 'deslogar', tooltip: 'deslogar',
disable: false, disable: false,
onClick: (event, rowData) => { onClick: (event, rowData) => {
// console.log(' ROW DATA INFO: ', rowData, ' | rowData: ', rowData.id)
handleLogouOnlineUser(rowData.id) handleLogouOnlineUser(rowData.id)
} }
} }
@ -927,8 +756,7 @@ const Report = () => {
selection: false, selection: false,
paging: false, paging: false,
padding: 'dense', padding: 'dense',
sorting: true, sorting: true,
//loadingType: 'linear',
searchFieldStyle: { searchFieldStyle: {
width: 300, width: 300,
}, },
@ -942,22 +770,7 @@ const Report = () => {
rowStyle: { rowStyle: {
fontSize: 14, fontSize: 14,
} }
// cellStyle: (rowData) => {
// return {
// fontSize: 12,
// color: "#fff",
// };
// }
}} }}
/> />