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