Resolução de merge
adriano
commit
8c2164c5a2
|
|
@ -0,0 +1,193 @@
|
|||
import React from "react";
|
||||
|
||||
import Paper from "@material-ui/core/Paper";
|
||||
import Grid from "@material-ui/core/Grid";
|
||||
import Typography from "@material-ui/core/Typography";
|
||||
|
||||
import Avatar from "@mui/material/Avatar";
|
||||
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 { Button } from "@material-ui/core";
|
||||
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 TextField from "@mui/material/TextField";
|
||||
|
||||
import CancelIcon from "@material-ui/icons/Cancel";
|
||||
import CheckCircleIcon from "@material-ui/icons/CheckCircle";
|
||||
import ErrorIcon from "@material-ui/icons/Error";
|
||||
import RemoveCircleIcon from "@material-ui/icons/RemoveCircle";
|
||||
|
||||
const CardUser = ({ classes, usersOnlineInfo, logout }) => {
|
||||
const [search, setSearch] = React.useState("");
|
||||
|
||||
const [filterStatus, setFilterStatus] = React.useState(null);
|
||||
|
||||
const handleFilterChange = (event) => {
|
||||
setFilterStatus(event.target.value);
|
||||
};
|
||||
const handlesearch = (event) => {
|
||||
setSearch(event.target.value.toLowerCase());
|
||||
};
|
||||
|
||||
return (
|
||||
<Grid item xs={12}>
|
||||
<Paper className={classes.cardPaperFix} sx={12} variant="outlined">
|
||||
<Grid container sx={12} justifyContent="space-between" alignItems="baseline">
|
||||
<Grid item sx={4}>
|
||||
<Typography
|
||||
component="h4"
|
||||
variant="h6"
|
||||
color="primary"
|
||||
style={{ marginBottom: "16px" }}
|
||||
>
|
||||
Lista de Usuários
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid item sx={8} width="100%">
|
||||
<Box sx={{ marginBottom: 2, display: "flex", gap: "12px" }}>
|
||||
<TextField
|
||||
id="outlined-basic"
|
||||
label="Usuário"
|
||||
variant="standard"
|
||||
value={search}
|
||||
onChange={handlesearch}
|
||||
/>
|
||||
<FormControl fullWidth variant="standard">
|
||||
<InputLabel id="status">Status</InputLabel>
|
||||
<Select
|
||||
labelId="status"
|
||||
id="status"
|
||||
value={filterStatus}
|
||||
label="Status"
|
||||
onChange={handleFilterChange}
|
||||
>
|
||||
<MenuItem value={null}>Todos</MenuItem>
|
||||
<MenuItem value={"online"}>Online</MenuItem>
|
||||
<MenuItem value={"offline"}>Offline</MenuItem>
|
||||
<MenuItem value={"not"}>Não entrou</MenuItem>
|
||||
</Select>
|
||||
</FormControl>
|
||||
</Box>
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
<Grid container spacing={3}>
|
||||
{usersOnlineInfo &&
|
||||
usersOnlineInfo
|
||||
.filter((e) => {
|
||||
if (filterStatus === null) return e;
|
||||
if (filterStatus === "not") return !e.statusOnline;
|
||||
return e.statusOnline && e.statusOnline.status === filterStatus;
|
||||
})
|
||||
.filter((e) => {
|
||||
return e.name.toLowerCase().includes(search);
|
||||
})
|
||||
.sort((a) => {
|
||||
if (a.statusOnline) {
|
||||
if (a.statusOnline.status === "online") {
|
||||
return -1;
|
||||
}
|
||||
return 0;
|
||||
}
|
||||
return 0;
|
||||
})
|
||||
.map((user, index) => (
|
||||
<Grid
|
||||
item
|
||||
xs={12}
|
||||
sm={6}
|
||||
md={6}
|
||||
lg={3}
|
||||
key={index}
|
||||
style={{ position: "relative" }}
|
||||
>
|
||||
<Card variant="outlined">
|
||||
<CardHeader
|
||||
avatar={
|
||||
<Avatar
|
||||
style={{
|
||||
backgroundColor: user.statusOnline
|
||||
? user.statusOnline.status === "online"
|
||||
? "green"
|
||||
: user.statusOnline.status === "offline"
|
||||
? "red"
|
||||
: "black"
|
||||
: "grey",
|
||||
}}
|
||||
>
|
||||
{user.statusOnline ? (
|
||||
user.statusOnline.status === "online" ? (
|
||||
<CheckCircleIcon style={{ color: "white" }} />
|
||||
) : user.statusOnline.status === "offline" ? (
|
||||
<CancelIcon style={{ color: "white" }} />
|
||||
) : (
|
||||
<ErrorIcon style={{ color: "yellow" }} />
|
||||
)
|
||||
) : (
|
||||
<RemoveCircleIcon style={{ color: "black" }} />
|
||||
)}
|
||||
</Avatar>
|
||||
}
|
||||
title={
|
||||
<Typography variant="h5" component="div">
|
||||
{user.name}
|
||||
</Typography>
|
||||
}
|
||||
/>
|
||||
|
||||
<CardContent>
|
||||
<Typography variant="h6" component="h1" color="textPrimary">
|
||||
Em atendimento:
|
||||
<Typography component="p" color="textPrimary" paragraph>
|
||||
{user.sumOpen && user.sumOpen.count ? user.sumOpen.count : 0}
|
||||
</Typography>
|
||||
</Typography>
|
||||
|
||||
<Typography variant="h6" component="h1" color="textPrimary">
|
||||
Finalizado:
|
||||
<Typography component="p" color="textPrimary" paragraph>
|
||||
{user.sumClosed && user.sumClosed.count ? user.sumClosed.count : 0}
|
||||
</Typography>
|
||||
</Typography>
|
||||
|
||||
<Typography variant="h6" component="h1" color="textPrimary">
|
||||
Tempo online:
|
||||
<Typography component="p" color="textPrimary" paragraph>
|
||||
{user.sumOnlineTime && user.sumOnlineTime.sum
|
||||
? user.sumOnlineTime.sum
|
||||
: "Não entrou Hoje"}
|
||||
</Typography>
|
||||
</Typography>
|
||||
</CardContent>
|
||||
<CardActions>
|
||||
{user.statusOnline &&
|
||||
user.statusOnline.status === "online" &&
|
||||
user.statusOnline && (
|
||||
<Button
|
||||
className={classes.logginBtn}
|
||||
variant="contained"
|
||||
color="primary"
|
||||
onClick={(e) => {
|
||||
logout(user.id);
|
||||
}}
|
||||
>
|
||||
{"Deslogar"}
|
||||
</Button>
|
||||
)}
|
||||
</CardActions>
|
||||
</Card>
|
||||
</Grid>
|
||||
))}
|
||||
</Grid>
|
||||
</Paper>
|
||||
</Grid>
|
||||
);
|
||||
};
|
||||
|
||||
export default CardUser;
|
||||
|
|
@ -0,0 +1,208 @@
|
|||
import React from "react";
|
||||
|
||||
import Select from "@mui/material/Select";
|
||||
import TextField from "@mui/material/TextField";
|
||||
import Typography from "@material-ui/core/Typography";
|
||||
import Grid from "@material-ui/core/Grid";
|
||||
|
||||
import Table from "@material-ui/core/Table";
|
||||
import TableBody from "@material-ui/core/TableBody";
|
||||
import TableCell from "@material-ui/core/TableCell";
|
||||
import TableContainer from "@material-ui/core/TableContainer";
|
||||
import TableHead from "@material-ui/core/TableHead";
|
||||
import TableRow from "@material-ui/core/TableRow";
|
||||
import Paper from "@material-ui/core/Paper";
|
||||
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 CancelIcon from "@material-ui/icons/Cancel";
|
||||
import CheckCircleIcon from "@material-ui/icons/CheckCircle";
|
||||
import ErrorIcon from "@material-ui/icons/Error";
|
||||
import RemoveCircleIcon from "@material-ui/icons/RemoveCircle";
|
||||
import PowerSettingsNewIcon from "@material-ui/icons/PowerSettingsNew";
|
||||
|
||||
const TableUser = ({ classes, usersOnlineInfo, logout }) => {
|
||||
const [search, setSearch] = React.useState("");
|
||||
const [filterStatus, setFilterStatus] = React.useState(null);
|
||||
|
||||
const handleFilterChange = (event) => {
|
||||
setFilterStatus(event.target.value);
|
||||
};
|
||||
const handlesearch = (event) => {
|
||||
setSearch(event.target.value.toLowerCase());
|
||||
};
|
||||
|
||||
console.log(usersOnlineInfo);
|
||||
|
||||
return (
|
||||
<Grid item xs={12}>
|
||||
<Paper className={classes.cardPaperFix} sx={12} variant="outlined">
|
||||
<Grid container sx={12} justifyContent="space-between" alignItems="baseline">
|
||||
<Grid item sx={4}>
|
||||
<Typography
|
||||
component="h4"
|
||||
variant="h6"
|
||||
color="primary"
|
||||
style={{ marginBottom: "16px" }}
|
||||
>
|
||||
Lista de Usuários
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid item sx={8} width="100%">
|
||||
<Box sx={{ marginBottom: 2, display: "flex", gap: "12px" }}>
|
||||
<TextField
|
||||
id="outlined-basic"
|
||||
label="Usuário"
|
||||
variant="standard"
|
||||
value={search}
|
||||
onChange={handlesearch}
|
||||
/>
|
||||
<FormControl fullWidth variant="standard">
|
||||
<InputLabel id="status">Status</InputLabel>
|
||||
<Select
|
||||
labelId="status"
|
||||
id="status"
|
||||
value={filterStatus}
|
||||
label="Status"
|
||||
onChange={handleFilterChange}
|
||||
>
|
||||
<MenuItem value={null}>Todos</MenuItem>
|
||||
<MenuItem value={"online"}>Online</MenuItem>
|
||||
<MenuItem value={"offline"}>Offline</MenuItem>
|
||||
<MenuItem value={"not"}>Não entrou</MenuItem>
|
||||
</Select>
|
||||
</FormControl>
|
||||
</Box>
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
<Grid container spacing={3} style={{ marginTop: "16px", marginBottom: "16px" }}>
|
||||
<TableContainer component={Paper}>
|
||||
<Table>
|
||||
<TableHead>
|
||||
<TableRow className={classes.tableRowHead}>
|
||||
<TableCell>Nome</TableCell>
|
||||
<TableCell>Em Atendimento/Finalizado(s)</TableCell>
|
||||
<TableCell>Por Fila abertos</TableCell>
|
||||
<TableCell>Por Fila Fechados</TableCell>
|
||||
<TableCell>Tempo Online</TableCell>
|
||||
<TableCell>Ações</TableCell>
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
|
||||
<TableBody>
|
||||
{usersOnlineInfo &&
|
||||
usersOnlineInfo
|
||||
.filter((e) => {
|
||||
if (filterStatus === null) return e;
|
||||
if (filterStatus === "not") return !e.statusOnline;
|
||||
return e.statusOnline && e.statusOnline.status === filterStatus;
|
||||
})
|
||||
.filter((e) => {
|
||||
return e.name.toLowerCase().includes(search);
|
||||
})
|
||||
.sort((a) => {
|
||||
if (a.statusOnline) {
|
||||
if (a.statusOnline.status === "online") {
|
||||
return -1;
|
||||
}
|
||||
return 0;
|
||||
}
|
||||
return 0;
|
||||
})
|
||||
.map((user, index) => (
|
||||
<TableRow key={index} className={classes.tableRowBody}>
|
||||
<TableCell>
|
||||
<Typography
|
||||
style={{ display: "flex", verticalAlign: "center", gap: "6px" }}
|
||||
>
|
||||
{user.statusOnline ? (
|
||||
user.statusOnline.status === "online" ? (
|
||||
<CheckCircleIcon style={{ color: "green" }} />
|
||||
) : user.statusOnline.status === "offline" ? (
|
||||
<CancelIcon style={{ color: "red" }} />
|
||||
) : (
|
||||
<ErrorIcon style={{ color: "gold" }} />
|
||||
)
|
||||
) : (
|
||||
<RemoveCircleIcon style={{ color: "black" }} />
|
||||
)}
|
||||
{user.name}
|
||||
</Typography>
|
||||
</TableCell>
|
||||
|
||||
<TableCell>
|
||||
<div style={{ display: "flex", alignItems: "center", gap: "12px" }}>
|
||||
<Typography className={classes.tableCounterOpen}>
|
||||
{user.sumOpen ? user.sumOpen.count : "0"}
|
||||
</Typography>
|
||||
<Typography className={classes.tableCounterClosed}>
|
||||
{user.sumClosed ? user.sumClosed.count : "0"}
|
||||
</Typography>
|
||||
</div>
|
||||
</TableCell>
|
||||
|
||||
<TableCell>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexWrap: "wrap",
|
||||
alignItems: "center",
|
||||
gap: "12px",
|
||||
}}
|
||||
>
|
||||
<Typography title="Cobrança">0</Typography>
|
||||
<Typography>0</Typography>
|
||||
<Typography>0</Typography>
|
||||
<Typography>0</Typography>
|
||||
<Typography>0</Typography>
|
||||
</div>
|
||||
</TableCell>
|
||||
|
||||
<TableCell>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexWrap: "wrap",
|
||||
alignItems: "center",
|
||||
gap: "12px",
|
||||
}}
|
||||
>
|
||||
<Typography title="Cobrança">0</Typography>
|
||||
<Typography>0</Typography>
|
||||
<Typography>0</Typography>
|
||||
<Typography>0</Typography>
|
||||
<Typography>0</Typography>
|
||||
</div>
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
{user.sumOnlineTime ? user.sumOnlineTime.sum : "Não entrou"}
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
{user.statusOnline && user.statusOnline.status === "online" ? (
|
||||
<PowerSettingsNewIcon
|
||||
style={{ color: "red", cursor: "pointer" }}
|
||||
onClick={(e) => {
|
||||
logout(user.id);
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
<PowerSettingsNewIcon
|
||||
style={{ color: "grey", cursor: "not-allowed" }}
|
||||
/>
|
||||
)}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</TableContainer>
|
||||
</Grid>
|
||||
</Paper>
|
||||
</Grid>
|
||||
);
|
||||
};
|
||||
|
||||
export default TableUser;
|
||||
|
|
@ -124,7 +124,7 @@ const TicketsManager = () => {
|
|||
let searchTimeout;
|
||||
|
||||
const handleSearch = (e) => {
|
||||
const searchedTerm = e.target.value.toLowerCase();
|
||||
const searchedTerm = e.target.value.toLowerCase().trim();
|
||||
|
||||
clearTimeout(searchTimeout);
|
||||
|
||||
|
|
@ -274,7 +274,7 @@ const TicketsManager = () => {
|
|||
</Tabs>
|
||||
<Paper className={classes.ticketsWrapper}>
|
||||
<TicketsList
|
||||
status="open"
|
||||
status={"open"}
|
||||
showAll={showAllTickets}
|
||||
selectedQueueIds={selectedQueueIds}
|
||||
updateCount={(val) => setOpenCount(val)}
|
||||
|
|
|
|||
|
|
@ -9,8 +9,8 @@ import Divider from "@material-ui/core/Divider";
|
|||
import { Badge } from "@material-ui/core";
|
||||
import DashboardOutlinedIcon from "@material-ui/icons/DashboardOutlined";
|
||||
|
||||
import ReportOutlinedIcon from "@material-ui/icons/ReportOutlined";
|
||||
import SendOutlined from '@material-ui/icons/SendOutlined';
|
||||
import ReportOutlinedIcon from "@material-ui/icons/ReportOutlined";
|
||||
import SendOutlined from "@material-ui/icons/SendOutlined";
|
||||
|
||||
//import ReportOutlined from "@bit/mui-org.material-ui-icons.report-outlined";
|
||||
|
||||
|
|
@ -32,10 +32,7 @@ function ListItemLink(props) {
|
|||
const { icon, primary, to, className } = props;
|
||||
|
||||
const renderLink = React.useMemo(
|
||||
() =>
|
||||
React.forwardRef((itemProps, ref) => (
|
||||
<RouterLink to={to} ref={ref} {...itemProps} />
|
||||
)),
|
||||
() => React.forwardRef((itemProps, ref) => <RouterLink to={to} ref={ref} {...itemProps} />),
|
||||
[to]
|
||||
);
|
||||
|
||||
|
|
@ -50,7 +47,7 @@ function ListItemLink(props) {
|
|||
}
|
||||
|
||||
const MainListItems = (props) => {
|
||||
const { drawerClose } = props;
|
||||
const { drawerClose, setDrawerOpen, drawerOpen } = props;
|
||||
const { whatsApps } = useContext(WhatsAppsContext);
|
||||
const { user } = useContext(AuthContext);
|
||||
const [connectionWarning, setConnectionWarning] = useState(false);
|
||||
|
|
@ -78,9 +75,8 @@ const MainListItems = (props) => {
|
|||
}, [whatsApps]);
|
||||
|
||||
return (
|
||||
<div onClick={drawerClose}>
|
||||
|
||||
|
||||
//Solicitado pelo Adriano: Click no LinkItem e fechar o menu!
|
||||
<div onClick={() => setDrawerOpen(false)}>
|
||||
<ListItemLink
|
||||
to="/tickets"
|
||||
primary={i18n.t("mainDrawer.listItems.tickets")}
|
||||
|
|
@ -92,11 +88,7 @@ const MainListItems = (props) => {
|
|||
primary={i18n.t("mainDrawer.listItems.contacts")}
|
||||
icon={<ContactPhoneOutlinedIcon />}
|
||||
/>
|
||||
<ListItemLink
|
||||
to="/schedulesReminder"
|
||||
primary="Lembretes"
|
||||
icon={<SendOutlined />}
|
||||
/>
|
||||
<ListItemLink to="/schedulesReminder" primary="Lembretes" icon={<SendOutlined />} />
|
||||
<ListItemLink
|
||||
to="/quickAnswers"
|
||||
primary={i18n.t("mainDrawer.listItems.quickAnswers")}
|
||||
|
|
@ -108,9 +100,7 @@ const MainListItems = (props) => {
|
|||
yes={() => (
|
||||
<>
|
||||
<Divider />
|
||||
<ListSubheader inset>
|
||||
{i18n.t("mainDrawer.listItems.administration")}
|
||||
</ListSubheader>
|
||||
<ListSubheader inset>{i18n.t("mainDrawer.listItems.administration")}</ListSubheader>
|
||||
<ListItemLink
|
||||
to="/users"
|
||||
primary={i18n.t("mainDrawer.listItems.users")}
|
||||
|
|
@ -132,32 +122,21 @@ const MainListItems = (props) => {
|
|||
}
|
||||
/>
|
||||
|
||||
<ListItemLink
|
||||
to="/"
|
||||
primary="Dashboard"
|
||||
icon={<DashboardOutlinedIcon />}
|
||||
/>
|
||||
|
||||
<ListItemLink
|
||||
to="/report"
|
||||
primary="Relatório"
|
||||
icon={<ReportOutlinedIcon />}
|
||||
/>
|
||||
<ListItemLink to="/" primary="Dashboard" icon={<DashboardOutlinedIcon />} />
|
||||
|
||||
<ListItemLink to="/report" primary="Relatório" icon={<ReportOutlinedIcon />} />
|
||||
|
||||
<Can
|
||||
role={user.profile}
|
||||
perform="settings-view:show"
|
||||
yes={() => (
|
||||
<ListItemLink
|
||||
to="/settings"
|
||||
primary={i18n.t("mainDrawer.listItems.settings")}
|
||||
icon={<SettingsOutlinedIcon />}
|
||||
/>
|
||||
)}
|
||||
role={user.profile}
|
||||
perform="settings-view:show"
|
||||
yes={() => (
|
||||
<ListItemLink
|
||||
to="/settings"
|
||||
primary={i18n.t("mainDrawer.listItems.settings")}
|
||||
icon={<SettingsOutlinedIcon />}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
|
||||
|
||||
</>
|
||||
)}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -185,7 +185,7 @@ const LoggedInLayout = ({ children }) => {
|
|||
</div>
|
||||
<Divider />
|
||||
<List>
|
||||
<MainListItems drawerClose={drawerClose} />
|
||||
<MainListItems drawerClose={drawerClose} setDrawerOpen={setDrawerOpen} drawerOpen={drawerOpen} />
|
||||
</List>
|
||||
<Divider />
|
||||
</Drawer>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
import React from "react";
|
||||
import Typography from "@material-ui/core/Typography";
|
||||
|
||||
const Title = props => {
|
||||
const Title = ({children}) => {
|
||||
return (
|
||||
<Typography component="h2" variant="h6" color="primary" gutterBottom>
|
||||
{props.children}
|
||||
{children}
|
||||
</Typography>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -21,12 +21,8 @@ import { AuthProvider } from "../context/Auth/AuthContext";
|
|||
import { WhatsAppsProvider } from "../context/WhatsApp/WhatsAppsContext";
|
||||
import Route from "./Route";
|
||||
|
||||
|
||||
//console.log('---AuthProvider: ',AuthProvider)
|
||||
|
||||
|
||||
|
||||
|
||||
const Routes = () => {
|
||||
return (
|
||||
<BrowserRouter>
|
||||
|
|
@ -37,41 +33,18 @@ const Routes = () => {
|
|||
<WhatsAppsProvider>
|
||||
<LoggedInLayout>
|
||||
<Route exact path="/" component={Dashboard} isPrivate />
|
||||
<Route
|
||||
exact
|
||||
path="/tickets/:ticketId?"
|
||||
component={Tickets}
|
||||
isPrivate
|
||||
/>
|
||||
<Route exact path="/tickets/:ticketId?" component={Tickets} isPrivate />
|
||||
|
||||
<Route
|
||||
exact
|
||||
path="/connections"
|
||||
component={Connections}
|
||||
isPrivate
|
||||
/>
|
||||
|
||||
|
||||
<Route
|
||||
exact
|
||||
path="/report"
|
||||
component={Report}
|
||||
isPrivate
|
||||
/>
|
||||
<Route exact path="/connections" component={Connections} isPrivate />
|
||||
|
||||
<Route exact path="/report" component={Report} isPrivate />
|
||||
|
||||
<Route exact path="/contacts" component={Contacts} isPrivate />
|
||||
|
||||
<Route exact path="/schedulesReminder" component={SchedulesReminder} isPrivate />
|
||||
|
||||
|
||||
<Route exact path="/users" component={Users} isPrivate />
|
||||
<Route
|
||||
exact
|
||||
path="/quickAnswers"
|
||||
component={QuickAnswers}
|
||||
isPrivate
|
||||
/>
|
||||
<Route exact path="/quickAnswers" component={QuickAnswers} isPrivate />
|
||||
<Route exact path="/Settings" component={Settings} isPrivate />
|
||||
<Route exact path="/Queues" component={Queues} isPrivate />
|
||||
</LoggedInLayout>
|
||||
|
|
|
|||
Loading…
Reference in New Issue