Criação do broker para otimização do csv export all finalizada!

backend/src/controllers/ReportController.ts

@@ -22,9 +22,11 @@ import ShowUserServiceReport from "../services/UserServices/ShowUserServiceRepor
 import CountTicketsByUserQueue from "../services/UserServices/CountTicketsByUserQueue";
 
 import ShowQueuesByUser from "../services/UserServices/ShowQueuesByUser";
-import { filter } from "bluebird";
 
  
+// import { filter } from "bluebird"; 
+
+import { getIO } from "../libs/socket";
 
 type IndexQuery = {
   userId: string;
@@ -33,6 +35,11 @@ type IndexQuery = {
   pageNumber: string;
 };
 
+type ReportOnQueue = {
+  userId: string;
+  identifier: string;
+}
+
 
 export const reportUserByDateStartDateEnd = async (req: Request, res: Response): Promise<Response> => {
 
@@ -42,14 +49,8 @@ export const reportUserByDateStartDateEnd = async (req: Request, res: Response):
 
   const { userId, startDate, endDate, pageNumber } = req.query as IndexQuery
 
-
-  console.log('PAGE NUMBER: ', pageNumber)
-
-
   const { tickets, count, hasMore } = await ShowTicketReport({ userId, startDate, endDate, pageNumber });
 
-  // return res.status(200).json(data_query);
-
   return res.status(200).json({ tickets, count, hasMore });
 };
 
@@ -105,20 +106,6 @@ export const reportUserService = async (req: Request, res: Response): Promise<Re
   }
 
 
-  // console.log('queuesByUser: ', queuesByUser)
-
-
-
-  // console.log('queuesByUser: ',queuesByUser)
-  // console.log()
-  // console.log('CLIENT START TRUE openByUserOnQueue: ', openByUserOnQueue) 
-  // console.log()
-  // console.log('CLIENT START FALSE openByUserOutQueue: ', openByUserOutQueue) 
-  // console.log()
-  // console.log('CLIENT START TRUE closedByUserOnQueue: ', closedByUserOnQueue) 
-  // console.log()
-  // console.log('CLIENT START FALSE closedUserOutQueue: ', closedUserOutQueue) 
-
 
   usersProfile.map((user: any) => {
 
@@ -141,33 +128,6 @@ export const reportUserService = async (req: Request, res: Response): Promise<Re
     }
 
 
-     
-
-
-    // let openByUserOut = openQueueInOut.filter((e: any) => e.userId == user.id && !e.queueName)
-    // let openByUserIn = openQueueInOut.filter((e: any) => e.userId == user.id && e.queueName)
-
-    // if (openByUserOut && openByUserOut.length > 0) {
-    //   user.openTicketByUserOut = openByUserOut
-    // }
-    // if (openByUserIn && openByUserIn.length > 0) {
-    //   user.openTicketByUserIn = openByUserIn
-    // }
-
-    // let closedByUserOut = closedQueueInOut.filter((e: any) => e.userId == user.id && !e.queueName)
-    // let closedByUserIn = closedQueueInOut.filter((e: any) => e.userId == user.id && e.queueName)
-
-    // if (closedByUserOut && closedByUserOut.length > 0) {
-    //   user.closedTicketByUserOut = closedByUserOut
-    // }
-    // if (closedByUserIn && closedByUserIn.length > 0) {
-    //   user.closedTicketByUserIn = closedByUserIn
-    // }
-
-
-
-
-
     // OPEN, CLOSED TICKETS STARTED BY USERS
     let openClosedOutQueue = {}
     let open = openCloseOutQueue.filter((e) => e.userId == user.id && e.status == 'open')
@@ -191,12 +151,6 @@ export const reportUserService = async (req: Request, res: Response): Promise<Re
     }
 
 
-
-
-
-
-
-
     index = onlineUsers.findIndex((e: any) => e.userId == user.id)
 
     if (index != -1) {
@@ -240,7 +194,7 @@ export const reportMessagesUserByDateStartDateEnd = async (req: Request, res: Re
       data_query_messages[i].fromMe = 'Cliente'
     }
 
-    data_query_messages[i].id = (i+1) 
+    data_query_messages[i].id = (i + 1)
 
     console.log('data_query_messages: ', data_query_messages[i])
   }
@@ -251,5 +205,27 @@ export const reportMessagesUserByDateStartDateEnd = async (req: Request, res: Re
 
 
 
+export const reportOnQueue = async (req: Request, res: Response): Promise<Response> => {
+
+  // console.log(req.body)
+
+  const { adminId, identifier, queueStatus, file } = req.body
+
+  const io = getIO();
+  io.emit("queryOnQueueStatus", {
+    action: "update",
+    queryOnQueue: {
+      adminId: adminId,
+      identifier: identifier,
+      queueStatus: queueStatus,
+      file: file
+    }
+  });
+
+  return res.status(200).json({ message: 'ok' })  
+};
+
+
+
 
 

backend/src/database/index.ts

@@ -14,8 +14,6 @@ import QuickAnswer from "../models/QuickAnswer";
 import SchedulingNotify from "../models/SchedulingNotify";
 import StatusChatEnd from "../models/StatusChatEnd";
 import UserOnlineTime from "../models/UserOnlineTime"; 
-
-
 // eslint-disable-next-line
 const dbConfig = require("../config/database");
 // import dbConfig from "../config/database";

backend/src/models/User.ts

@@ -55,10 +55,8 @@ class User extends Model<User> {
   @HasMany(() => Ticket)
   tickets: Ticket[];
  
-  //test del 
   @HasMany(() => UserOnlineTime)
   UserOnlineTime: UserOnlineTime[]; 
-  //
 
   @BelongsToMany(() => Queue, () => UserQueue)
   queues: Queue[];

backend/src/routes/reportRoutes.ts

@@ -9,6 +9,8 @@ const reportRoutes = express.Router();
 
 reportRoutes.get("/reports", isAuth, ReportController.reportUserByDateStartDateEnd);  
 
+reportRoutes.post("/reports/onqueue", ReportController.reportOnQueue);  
+
 reportRoutes.get("/reports/user/services", isAuth, ReportController.reportUserService);  
 
 reportRoutes.get("/reports/messages", isAuth, ReportController.reportMessagesUserByDateStartDateEnd);  

frontend/package.json

@@ -17,10 +17,12 @@
     "@testing-library/user-event": "^12.1.7",
     "axios": "^0.21.1",
     "date-fns": "^2.28.0",
+    "dotenv": "^16.0.1",
     "emoji-mart": "^3.0.1",
     "formik": "^2.2.0",
     "i18next": "^19.8.2",
     "i18next-browser-languagedetector": "^6.0.1",
+    "js-file-download": "^0.4.12",
     "markdown-to-jsx": "^7.1.0",
     "material-table": "^1.69.3",
     "mic-recorder-to-mp3": "^2.2.2",

frontend/src/pages/Report/index.js

@@ -18,13 +18,18 @@ import MaterialTable from 'material-table';
 
 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";
 
 const report = [{ 'value': '1', 'label': 'Atendimento por atendentes' }, { 'value': '2', 'label': 'Usuários online/offline' }]
 
@@ -96,9 +101,6 @@ let columns = [
 
 const reducerQ = (state, action) => {
 
-
-
-
   if (action.type === "DELETE_USER_STATUS") {
 
     const userId = action.payload;
@@ -339,6 +341,9 @@ const Report = () => {
   const [profile, setProfile] = useState('')
   const [dataRows, setData] = useState([]);
 
+  const [onQueueStatus, setOnQueueProcessStatus] = useState(undefined)
+  const [csvFile, setCsvFile] = useState()
+
 
 
 
@@ -477,32 +482,103 @@ const Report = () => {
   }, [reportOption])
 
 
+
+  useEffect(() => {
+
+    const delayDebounceFn = setTimeout(() => {
+
+      const fetchReportOnQueue = async () => {
+        try {
+
+          const queryOnQueue = await apiBroker.get("/reports/status/query/onqueue", {
+            params: {
+              adminId: userA.id,
+              baseURL: process.env.REACT_APP_BACKEND_URL,
+              identifier: 'csv'
+            }
+          });
+
+
+          if (queryOnQueue.data) {
+            setCsvFile(queryOnQueue.data.app.file)
+            setOnQueueProcessStatus(queryOnQueue.data.app.status)
+          }
+          else {
+            setOnQueueProcessStatus('empty')
+          }
+
+          console.log('>>>>> queryOnqueue: ', queryOnQueue.data)
+
+
+
+        } catch (err) {
+          console.log(err);
+        }
+      };
+
+      fetchReportOnQueue();
+
+    }, 500);
+    return () => clearTimeout(delayDebounceFn);
+
+  }, [])
+
+
+  const handleCSVDownload = async () => {
+
+    try { 
+ 
+      let res = await apiBroker.get(`/reports/download/${csvFile}`, { responseType: 'blob' });
+
+      if (res) {  
+        fileDownload(res.data, `${csvFile}`);
+
+        setOnQueueProcessStatus('empty')
+      }
+
+    } catch (err) {
+      console.log(err);
+    }
+
+  }
+
+
   const handleCSVMessages = () => {
 
     const fetchQueries = async () => {
 
       try {
 
-        const dataQuery = await api.get("/reports/messages", { params: { userId, startDate, endDate }, });
+        // const dataQuery = await api.get("/reports/messages", { params: { userId, startDate, endDate }, });
 
-        console.log('dataQuery messages: ', dataQuery.data)
+        const querySavedOnQueue = await apiBroker.post("/reports/messages",
-
+          {
-        if (dataQuery.data.length > 0) {
+            app: {
-
+              adminId: userA.id,
-          let dataCSVFormat = dataQuery.data;
+              baseURL: process.env.REACT_APP_BACKEND_URL, 
-
+              frontURL: process.env.REACT_APP_FRONTEND_URL,
-          for (var i = 0; i < dataCSVFormat.length; i++) {
+              identifier: 'csv'
-            if (dataCSVFormat[i].fromMe) {
+            },
-              dataCSVFormat[i].fromMe = 'Atendente'
+            query_params: {
+              userId: userId,
+              startDate: startDate,
+              endDate: endDate
             }
-            else {
+          });
-              dataCSVFormat[i].fromMe = 'Cliente'
-            }
-          }
 
-          setDataCSV(dataCSVFormat)
+        console.log('dataQuery messages: ', querySavedOnQueue.data.queueStatus)
-          setIsMount(false);
+
-        }
+        const onQueueStatus = querySavedOnQueue.data.queueStatus
+
+        setOnQueueProcessStatus(onQueueStatus)
+
+        // if (onQueueStatus.data.length > 0) {
+
+        //   let dataCSVFormat = queueStatus.data;
+
+
+        //   setIsMount(false);
+        // }
 
       } catch (err) {
         console.log(err);
@@ -532,9 +608,24 @@ const Report = () => {
 
   useEffect(() => {
 
+    const socket = openSocket(process.env.REACT_APP_BACKEND_URL);
+
+    socket.on("queryOnQueueStatus", (data) => {
+      if (data.action === 'update') {
+
+        if (String(data.queryOnQueue.adminId) === String(userA.id)) { 
+
+          setCsvFile(data.queryOnQueue.file)
+          setOnQueueProcessStatus(data.queryOnQueue.queueStatus)
+
+        }
+
+      }
+    })
+
     if (reportOption === '2') {
 
-      const socket = openSocket(process.env.REACT_APP_BACKEND_URL);
+      // const socket = openSocket(process.env.REACT_APP_BACKEND_URL);
 
       socket.on("onlineStatus", (data) => {
 
@@ -563,9 +654,10 @@ const Report = () => {
         }
       });
 
-      return () => {
+
-        socket.disconnect();
+      // return () => {
-      };
+      //   socket.disconnect();
+      // };
 
     }
     else if (reportOption === "1") {
@@ -573,6 +665,10 @@ const Report = () => {
       setTicketsPageNumber(1)
     }
 
+    return () => {
+      socket.disconnect();
+    };
+
 
   }, [reportOption, startDate, endDate, userId]);
 
@@ -641,6 +737,48 @@ const Report = () => {
   };
 
 
+  const renderSwitch = (param) => {
+    switch (param) {
+      case 'empty':
+        return (
+          <>
+            <Button
+              variant="contained"
+              color="primary"
+              onClick={(e) => {
+                handleCSVMessages()
+              }}
+            >
+              {"CSV ALL"}
+            </Button>
+          </>);
+
+      case 'pending' || 'processing':
+        return (
+          <>
+            <span>PROCESSING...</span>
+          </>);
+
+      case 'success':
+        return (
+          <>
+            <Button
+              variant="contained"
+              color="primary"
+              onClick={(e) => {
+                handleCSVDownload()
+              }}
+            >
+              {"DOWNLOAD"}
+            </Button>
+          </>);
+
+      default:
+        return (<><span>WAITING...</span></>);
+    }
+  }
+
+
   return (
 
     <Can
@@ -665,34 +803,8 @@ const Report = () => {
               <div style={{ margin: '2px' }}></div>
 
               {reportOption === '1' && 
-
                 <div>
-                  {/* <Button style={{ display: "none" }}
+                  {renderSwitch(onQueueStatus)}
-                    variant="contained"
-                    color="primary"
-                    onClick={(e) => {
-                      handleCSVMessages()
-                    }}
-                  > */}
-
-                    {/* <Button 
-                      variant="contained"
-                      color="primary"
-                      onClick={(e) => {
-                        handleCSVMessages()
-                      }}
-                    >
-                      {"CSV ALL"}
-                    </Button> */}
-
-                    <div>
-                      <CSVLink
-                        data={dataCSV}
-                        headers={columns}
-                        filename={'Relatorio_detalhado_atendimento_atendentes.csv'}
-                        target={'_blank'}
-                        ref={csvLink} />
-                    </div>
                 </div>
 
               }

frontend/src/services/apiBroker.js

@@ -0,0 +1,10 @@
+import axios from "axios";
+
+const apiBroker = axios.create({
+	baseURL: process.env.REACT_APP_URL_API_BROKER,
+	headers: {
+		Authorization: `Bearer ${process.env.REACT_APP_API_BROKER_TOKEN}`
+	}
+});
+
+export default apiBroker;