-
-
+ //Solicitado pelo Adriano: Click no LinkItem e fechar o menu!
+
setDrawerOpen(false)}>
{
primary={i18n.t("mainDrawer.listItems.contacts")}
icon={}
/>
- }
- />
+ } />
{
yes={() => (
<>
-
- {i18n.t("mainDrawer.listItems.administration")}
-
+ {i18n.t("mainDrawer.listItems.administration")}
{
}
/>
- }
- />
-
- }
- />
+ } />
+ } />
(
- }
- />
- )}
+ role={user.profile}
+ perform="settings-view:show"
+ yes={() => (
+ }
+ />
+ )}
/>
-
-
>
)}
/>
diff --git a/frontend/src/layout/index.js b/frontend/src/layout/index.js
index ce410d0..dc9dccb 100644
--- a/frontend/src/layout/index.js
+++ b/frontend/src/layout/index.js
@@ -185,7 +185,7 @@ const LoggedInLayout = ({ children }) => {
-
+
diff --git a/frontend/src/pages/Dashboard/Title.js b/frontend/src/pages/Dashboard/Title.js
index 8fa5dad..9dbb8b8 100644
--- a/frontend/src/pages/Dashboard/Title.js
+++ b/frontend/src/pages/Dashboard/Title.js
@@ -1,10 +1,10 @@
import React from "react";
import Typography from "@material-ui/core/Typography";
-const Title = props => {
+const Title = ({children}) => {
return (
- {props.children}
+ {children}
);
};
diff --git a/frontend/src/pages/Dashboard/index.js b/frontend/src/pages/Dashboard/index.js
index 7ca5e15..5c56b77 100644
--- a/frontend/src/pages/Dashboard/index.js
+++ b/frontend/src/pages/Dashboard/index.js
@@ -1,134 +1,460 @@
-import React, { useContext } from "react"
+import React, { useContext, useReducer, useEffect, useState } from "react";
-import Paper from "@material-ui/core/Paper"
-import Container from "@material-ui/core/Container"
-import Grid from "@material-ui/core/Grid"
-import { makeStyles } from "@material-ui/core/styles"
+import Paper from "@material-ui/core/Paper";
+import Container from "@material-ui/core/Container";
+import Grid from "@material-ui/core/Grid";
+import { makeStyles } from "@material-ui/core/styles";
import Typography from "@material-ui/core/Typography";
+import Card from "@mui/material/Card";
+import CardHeader from "@mui/material/CardHeader";
+import CardContent from "@mui/material/CardContent";
+import CardActions from "@mui/material/CardActions";
+import Avatar from "@mui/material/Avatar";
+import Tooltip from "@mui/material/Tooltip";
+import Zoom from "@mui/material/Zoom";
+import IconButton from "@mui/material/IconButton";
+import Info from "@material-ui/icons/Info";
+import Box from "@mui/material/Box";
+import InputLabel from "@mui/material/InputLabel";
+import MenuItem from "@mui/material/MenuItem";
+import FormControl from "@mui/material/FormControl";
+import Select from "@mui/material/Select";
-import useTickets from "../../hooks/useTickets"
+import useTickets from "../../hooks/useTickets";
import { AuthContext } from "../../context/Auth/AuthContext";
import { i18n } from "../../translate/i18n";
-import Chart from "./Chart"
+import Chart from "./Chart";
+
+import openSocket from "socket.io-client";
+
+import api from "../../services/api";
import { Can } from "../../components/Can";
-const useStyles = makeStyles(theme => ({
- container: {
- paddingTop: theme.spacing(4),
- paddingBottom: theme.spacing(4),
- },
- fixedHeightPaper: {
- padding: theme.spacing(2),
- display: "flex",
- overflow: "auto",
- flexDirection: "column",
- height: 240,
- },
- customFixedHeightPaper: {
- padding: theme.spacing(2),
- display: "flex",
- overflow: "auto",
- flexDirection: "column",
- height: 120,
- },
- customFixedHeightPaperLg: {
- padding: theme.spacing(2),
- display: "flex",
- overflow: "auto",
- flexDirection: "column",
- height: "100%",
- },
-}))
+import { Button } from "@material-ui/core";
+
+const useStyles = makeStyles((theme) => ({
+ container: {
+ paddingTop: theme.spacing(4),
+ paddingBottom: theme.spacing(4),
+ },
+ fixedHeightPaper: {
+ padding: theme.spacing(2),
+ display: "flex",
+ overflow: "auto",
+ flexDirection: "column",
+ height: 240,
+ },
+ customFixedHeightPaper: {
+ padding: theme.spacing(2),
+ display: "flex",
+ overflow: "auto",
+ flexDirection: "column",
+ height: 120,
+ },
+ customFixedHeightPaperLg: {
+ padding: theme.spacing(2),
+ display: "flex",
+ overflow: "auto",
+ flexDirection: "column",
+ height: "100%",
+ },
+ cardPaperFix: {
+ textTransform: "capitalize",
+ padding: theme.spacing(2),
+ paddingBottom: theme.spacing(4),
+ height: "500px",
+ overflowY: "scroll",
+ },
+ cardStyleFix: {
+ display: "flex",
+ flexDirection: "row",
+ justifyContent: "left",
+ alignItems: "center",
+ gap: "32px",
+ },
+ logginBtn: {
+ position: "absolute",
+ bottom: "21px",
+ right: "21px",
+ fontSize: "12px",
+ },
+}));
+
+const reducer = (state, action) => {
+ if (action.type === "DELETE_USER_STATUS") {
+ const userId = action.payload;
+
+ const userIndex = state.findIndex((u) => `${u.id}` === `${userId}`);
+
+ if (userIndex !== -1) {
+ state.splice(userIndex, 1);
+ }
+
+ return [...state];
+ }
+
+ if (action.type === "LOAD_QUERY") {
+ const queries = action.payload;
+ const newQueries = [];
+
+ queries.forEach((query) => {
+ const queryIndex = state.findIndex((q) => q.id === query.id);
+
+ if (queryIndex !== -1) {
+ state[queryIndex] = query;
+ } else {
+ newQueries.push(query);
+ }
+ });
+
+ return [...state, ...newQueries];
+ }
+
+ if (action.type === "UPDATE_STATUS_ONLINE") {
+ let onlineUser = action.payload;
+ let index = -1;
+
+ let onlySumOpenClosed = false;
+
+ if (onlineUser.sumOpen || onlineUser.sumClosed) {
+ index = state.findIndex(
+ (e) =>
+ (onlineUser.sumOpen && e.id === onlineUser.sumOpen.userId) ||
+ (onlineUser.sumClosed && e.id === onlineUser.sumClosed.userId)
+ );
+
+ onlySumOpenClosed = true;
+ } else {
+ index = state.findIndex((e) => `${e.id}` === `${onlineUser.userId}`);
+ }
+
+ if (index !== -1) {
+ if (!onlySumOpenClosed) {
+ if (!("statusOnline" in state[index])) {
+ state[index].statusOnline = onlineUser;
+ } else if ("statusOnline" in state[index]) {
+ state[index].statusOnline["status"] = onlineUser.status;
+ }
+ }
+
+ if ("onlineTime" in onlineUser) {
+ if ("sumOnlineTime" in state[index]) {
+ state[index].sumOnlineTime["sum"] = onlineUser.onlineTime.split(" ")[1];
+ } else if (!("sumOnlineTime" in state[index])) {
+ state[index].sumOnlineTime = {
+ userId: onlineUser.userId,
+ sum: onlineUser.onlineTime.split(" ")[1],
+ };
+ }
+ }
+
+ if (onlineUser.sumOpen) {
+ if ("sumOpen" in state[index]) {
+ state[index].sumOpen["count"] = onlineUser.sumOpen.count;
+ } else if (!("sumOpen" in state[index])) {
+ state[index].sumOpen = onlineUser.sumOpen;
+ }
+ }
+
+ if (onlineUser.sumClosed) {
+ if ("sumClosed" in state[index]) {
+ state[index].sumClosed["count"] = onlineUser.sumClosed.count;
+ } else if (!("sumClosed" in state[index])) {
+ state[index].sumClosed = onlineUser.sumClosed;
+ }
+ }
+ }
+ return [...state];
+ }
+
+ if (action.type === "RESET") {
+ return [];
+ }
+};
const Dashboard = () => {
- const classes = useStyles()
+ const classes = useStyles();
+ const [usersOnlineInfo, dispatch] = useReducer(reducer, []);
+ const [filterStatus, setFilterStatus] = useState(null);
+ const { user } = useContext(AuthContext);
+ var userQueueIds = [];
- const { user } = useContext(AuthContext);
- var userQueueIds = [];
+ if (user.queues && user.queues.length > 0) {
+ userQueueIds = user.queues.map((q) => q.id);
+ }
- if (user.queues && user.queues.length > 0) {
- userQueueIds = user.queues.map(q => q.id);
- }
+ const GetTickets = (status, showAll, withUnreadMessages, unlimited) => {
+ const { tickets } = useTickets({
+ status: status,
+ showAll: showAll,
+ withUnreadMessages: withUnreadMessages,
+ queueIds: JSON.stringify(userQueueIds),
+ unlimited: unlimited,
+ });
+ return tickets.length;
+ };
- const GetTickets = (status, showAll, withUnreadMessages, unlimited) => {
+ useEffect(() => {
+ dispatch({ type: "RESET" });
+ }, []);
- const { tickets } = useTickets({
- status: status,
- showAll: showAll,
- withUnreadMessages: withUnreadMessages,
- queueIds: JSON.stringify(userQueueIds),
- unlimited: unlimited
- });
- return tickets.length;
- }
+ const handleLogouOnlineUser = async (userId) => {
+ try {
+ await api.get(`/users/logout/${userId}`);
+ //toast.success(("Desloged!"));
+ //handleDeleteRows(scheduleId)
+ } catch (err) {
+ // toastError(err);
+ }
+ };
- return (
+ useEffect(() => {
+ //setLoading(true);
-
(
-
-
-
-
-
-
- {i18n.t("dashboard.messages.inAttendance.title")}
-
-
-
- {GetTickets("open", "true", "false", "true")}
-
-
-
-
-
-
-
- {i18n.t("dashboard.messages.waiting.title")}
-
-
-
- {GetTickets("pending", "true", "false", "true")}
-
-
-
-
-
-
-
- {i18n.t("dashboard.messages.closed.title")}
-
-
-
- {GetTickets("closed", "true", "false", "true")}
-
-
-
-
-
-
-
-
-
-
-
-
- )}
- />
-
-
+ const delayDebounceFn = setTimeout(() => {
+ // setLoading(true);
+ const fetchQueries = async () => {
+ try {
+ let date = new Date().toLocaleDateString("pt-BR").split("/");
+ let dateToday = `${date[2]}-${date[1]}-${date[0]}`;
+ const dataQuery = await api.get("/reports/user/services", {
+ params: { userId: null, startDate: dateToday, endDate: dateToday },
+ });
+ dispatch({ type: "RESET" });
+ dispatch({ type: "LOAD_QUERY", payload: dataQuery.data });
+ //console.log()
+ } catch (err) {
+ console.log(err);
+ }
+ };
+ fetchQueries();
+ }, 500);
+ return () => clearTimeout(delayDebounceFn);
+ }, []);
- /**/
- )
-}
+ useEffect(() => {
+ const socket = openSocket(process.env.REACT_APP_BACKEND_URL);
-export default Dashboard
+ socket.on("onlineStatus", (data) => {
+ if (data.action === "logout" || data.action === "update") {
+ dispatch({ type: "UPDATE_STATUS_ONLINE", payload: data.userOnlineTime });
+ } else if (data.action === "delete") {
+ dispatch({ type: "DELETE_USER_STATUS", payload: data.userOnlineTime });
+ }
+ });
+
+ socket.on("user", (data) => {
+ if (data.action === "delete") {
+ // console.log(' entrou no delete user: ', data)
+ dispatch({ type: "DELETE_USER", payload: +data.userId });
+ }
+ });
+
+ return () => {
+ socket.disconnect();
+ };
+ }, []);
+
+ const handleFilterChange = (event) => {
+ setFilterStatus(event.target.value);
+ };
+
+ return (
+ (
+
+
+
+
+
+
+ {i18n.t("dashboard.messages.inAttendance.title")}
+
+
+
+ {GetTickets("open", "true", "false", "true")}
+
+
+
+
+
+
+
+ {i18n.t("dashboard.messages.waiting.title")}
+
+
+
+ {GetTickets("pending", "true", "false", "true")}
+
+
+
+
+
+
+
+ {i18n.t("dashboard.messages.closed.title")}
+
+
+
+ {GetTickets("closed", "true", "false", "true")}
+
+
+
+
+
+
+
+
+
+
+
+ Usuários
+
+
+
+
+
+
+
+
+
+
+ Status
+
+
+
+
+
+
+
+ {usersOnlineInfo &&
+ usersOnlineInfo
+ .filter((e) => {
+ if (filterStatus === null) return e;
+ if (filterStatus === "not") return !e.statusOnline;
+ return e.statusOnline && e.statusOnline.status === filterStatus;
+ })
+ .map((user, index) => (
+
+
+
+ {user.name[0].toUpperCase()}
+
+ }
+ title={
+
+ {user.name}
+
+ }
+ />
+
+
+
+ Em atendimento:
+
+ {user.sumOpen && user.sumOpen.count ? user.sumOpen.count : 0}
+
+
+
+
+ Finalizado:
+
+ {user.sumClosed && user.sumClosed.count ? user.sumClosed.count : 0}
+
+
+
+
+ Tempo online:
+
+ {user.sumOnlineTime && user.sumOnlineTime.sum
+ ? user.sumOnlineTime.sum
+ : "Não entrou Hoje"}
+
+
+
+
+ {user.statusOnline &&
+ user.statusOnline.status === "online" &&
+ user.statusOnline && (
+
+ )}
+
+
+
+ ))}
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )}
+ />
+
+ /**/
+ );
+};
+
+export default Dashboard;