Restrição de operação de crud para criação e edição de filas. Apenas o master tem esse poder
adriano
parent
755584a881
commit
9bb316a0cf
|
|
@ -45,7 +45,7 @@ import toastError from "../../errors/toastError";
|
|||
import { AuthContext } from "../../context/Auth/AuthContext";
|
||||
import { Can } from "../../components/Can";
|
||||
|
||||
|
||||
|
||||
const useStyles = makeStyles(theme => ({
|
||||
mainPaper: {
|
||||
flex: 1,
|
||||
|
|
@ -98,20 +98,20 @@ const CustomToolTip = ({ title, content, children }) => {
|
|||
};
|
||||
|
||||
const Connections = () => {
|
||||
|
||||
|
||||
//--------
|
||||
const { user } = useContext(AuthContext);
|
||||
|
||||
|
||||
const { user } = useContext(AuthContext);
|
||||
|
||||
|
||||
const classes = useStyles();
|
||||
|
||||
const { whatsApps, loading } = useContext(WhatsAppsContext);
|
||||
const [whatsAppModalOpen, setWhatsAppModalOpen] = useState(false);
|
||||
const [qrModalOpen, setQrModalOpen] = useState(false);
|
||||
const [selectedWhatsApp, setSelectedWhatsApp] = useState(null);
|
||||
const [confirmModalOpen, setConfirmModalOpen] = useState(false);
|
||||
const [confirmModalOpen, setConfirmModalOpen] = useState(false);
|
||||
|
||||
|
||||
|
||||
const confirmationModalInitialState = {
|
||||
action: "",
|
||||
title: "",
|
||||
|
|
@ -124,7 +124,7 @@ const Connections = () => {
|
|||
);
|
||||
|
||||
const handleStartWhatsAppSession = async whatsAppId => {
|
||||
try {
|
||||
try {
|
||||
await api.post(`/whatsappsession/${whatsAppId}`);
|
||||
} catch (err) {
|
||||
toastError(err);
|
||||
|
|
@ -207,69 +207,69 @@ const Connections = () => {
|
|||
};
|
||||
|
||||
const renderActionButtons = whatsApp => {
|
||||
return (
|
||||
return (
|
||||
|
||||
<Can
|
||||
role={user.profile}
|
||||
perform="connection-button:show"
|
||||
yes={() => (
|
||||
|
||||
<>
|
||||
{whatsApp.status === "qrcode" && (
|
||||
<Button
|
||||
size="small"
|
||||
variant="contained"
|
||||
color="primary"
|
||||
onClick={() => handleOpenQrModal(whatsApp)}
|
||||
>
|
||||
{i18n.t("connections.buttons.qrcode")}
|
||||
</Button>
|
||||
)}
|
||||
{whatsApp.status === "DISCONNECTED" && (
|
||||
<>
|
||||
{whatsApp.status === "qrcode" && (
|
||||
<Button
|
||||
size="small"
|
||||
variant="contained"
|
||||
color="primary"
|
||||
onClick={() => handleOpenQrModal(whatsApp)}
|
||||
>
|
||||
{i18n.t("connections.buttons.qrcode")}
|
||||
</Button>
|
||||
)}
|
||||
{whatsApp.status === "DISCONNECTED" && (
|
||||
|
||||
<>
|
||||
<Button
|
||||
size="small"
|
||||
variant="outlined"
|
||||
color="primary"
|
||||
onClick={() => handleStartWhatsAppSession(whatsApp.id)}
|
||||
>
|
||||
{i18n.t("connections.buttons.tryAgain")}
|
||||
</Button>{" "}
|
||||
<Button
|
||||
size="small"
|
||||
variant="outlined"
|
||||
color="secondary"
|
||||
onClick={() => handleRequestNewQrCode(whatsApp.id)}
|
||||
>
|
||||
{i18n.t("connections.buttons.newQr")}
|
||||
</Button>
|
||||
<>
|
||||
<Button
|
||||
size="small"
|
||||
variant="outlined"
|
||||
color="primary"
|
||||
onClick={() => handleStartWhatsAppSession(whatsApp.id)}
|
||||
>
|
||||
{i18n.t("connections.buttons.tryAgain")}
|
||||
</Button>{" "}
|
||||
<Button
|
||||
size="small"
|
||||
variant="outlined"
|
||||
color="secondary"
|
||||
onClick={() => handleRequestNewQrCode(whatsApp.id)}
|
||||
>
|
||||
{i18n.t("connections.buttons.newQr")}
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
{(whatsApp.status === "CONNECTED" ||
|
||||
whatsApp.status === "PAIRING" ||
|
||||
whatsApp.status === "TIMEOUT") && (
|
||||
<Button
|
||||
size="small"
|
||||
variant="outlined"
|
||||
color="secondary"
|
||||
onClick={() => {
|
||||
handleOpenConfirmationModal("disconnect", whatsApp.id);
|
||||
}}
|
||||
>
|
||||
{i18n.t("connections.buttons.disconnect")}
|
||||
</Button>
|
||||
)}
|
||||
{whatsApp.status === "OPENING" && (
|
||||
<Button size="small" variant="outlined" disabled color="default">
|
||||
{i18n.t("connections.buttons.connecting")}
|
||||
</Button>
|
||||
)}
|
||||
</>
|
||||
|
||||
)}
|
||||
{(whatsApp.status === "CONNECTED" ||
|
||||
whatsApp.status === "PAIRING" ||
|
||||
whatsApp.status === "TIMEOUT") && (
|
||||
<Button
|
||||
size="small"
|
||||
variant="outlined"
|
||||
color="secondary"
|
||||
onClick={() => {
|
||||
handleOpenConfirmationModal("disconnect", whatsApp.id);
|
||||
}}
|
||||
>
|
||||
{i18n.t("connections.buttons.disconnect")}
|
||||
</Button>
|
||||
)}
|
||||
{whatsApp.status === "OPENING" && (
|
||||
<Button size="small" variant="outlined" disabled color="default">
|
||||
{i18n.t("connections.buttons.connecting")}
|
||||
</Button>
|
||||
)}
|
||||
</>
|
||||
|
||||
)}
|
||||
/>
|
||||
|
||||
/>
|
||||
|
||||
);
|
||||
};
|
||||
|
||||
|
|
@ -312,160 +312,166 @@ const Connections = () => {
|
|||
);
|
||||
};
|
||||
|
||||
return (
|
||||
return (
|
||||
|
||||
<Can
|
||||
role={user.profile}
|
||||
perform="connections-view:show"
|
||||
yes={() => (
|
||||
<MainContainer>
|
||||
<ConfirmationModal
|
||||
title={confirmModalInfo.title}
|
||||
open={confirmModalOpen}
|
||||
onClose={setConfirmModalOpen}
|
||||
onConfirm={handleSubmitConfirmationModal}
|
||||
>
|
||||
{confirmModalInfo.message}
|
||||
</ConfirmationModal>
|
||||
<QrcodeModal
|
||||
open={qrModalOpen}
|
||||
onClose={handleCloseQrModal}
|
||||
whatsAppId={!whatsAppModalOpen && selectedWhatsApp?.id}
|
||||
/>
|
||||
<WhatsAppModal
|
||||
open={whatsAppModalOpen}
|
||||
onClose={handleCloseWhatsAppModal}
|
||||
whatsAppId={!qrModalOpen && selectedWhatsApp?.id}
|
||||
/>
|
||||
<MainHeader>
|
||||
<Title>{i18n.t("connections.title")}</Title>
|
||||
<MainHeaderButtonsWrapper>
|
||||
|
||||
|
||||
<Can
|
||||
role={user.profile}
|
||||
perform="btn-add-whatsapp"
|
||||
yes={() => (
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
onClick={handleOpenWhatsAppModal}>
|
||||
{i18n.t("connections.buttons.add")}
|
||||
</Button>
|
||||
)}
|
||||
/>
|
||||
|
||||
|
||||
|
||||
</MainHeaderButtonsWrapper>
|
||||
</MainHeader>
|
||||
<Paper className={classes.mainPaper} variant="outlined">
|
||||
<Table size="small">
|
||||
<TableHead>
|
||||
<TableRow>
|
||||
<TableCell align="center">
|
||||
{i18n.t("connections.table.name")}
|
||||
</TableCell>
|
||||
<TableCell align="center">
|
||||
{i18n.t("connections.table.status")}
|
||||
</TableCell>
|
||||
role={user.profile}
|
||||
perform="connections-view:show"
|
||||
yes={() => (
|
||||
<MainContainer>
|
||||
<ConfirmationModal
|
||||
title={confirmModalInfo.title}
|
||||
open={confirmModalOpen}
|
||||
onClose={setConfirmModalOpen}
|
||||
onConfirm={handleSubmitConfirmationModal}
|
||||
>
|
||||
{confirmModalInfo.message}
|
||||
</ConfirmationModal>
|
||||
<QrcodeModal
|
||||
open={qrModalOpen}
|
||||
onClose={handleCloseQrModal}
|
||||
whatsAppId={!whatsAppModalOpen && selectedWhatsApp?.id}
|
||||
/>
|
||||
<WhatsAppModal
|
||||
open={whatsAppModalOpen}
|
||||
onClose={handleCloseWhatsAppModal}
|
||||
whatsAppId={!qrModalOpen && selectedWhatsApp?.id}
|
||||
/>
|
||||
<MainHeader>
|
||||
<Title>{i18n.t("connections.title")}</Title>
|
||||
<MainHeaderButtonsWrapper>
|
||||
|
||||
|
||||
<Can
|
||||
role={user.profile}
|
||||
perform="connection-button:show"
|
||||
yes={() => (
|
||||
<TableCell align="center">
|
||||
{i18n.t("connections.table.session")}
|
||||
</TableCell>
|
||||
)}
|
||||
role={user.profile}
|
||||
perform="btn-add-whatsapp"
|
||||
yes={() => (
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
onClick={handleOpenWhatsAppModal}>
|
||||
{i18n.t("connections.buttons.add")}
|
||||
</Button>
|
||||
)}
|
||||
/>
|
||||
|
||||
|
||||
|
||||
<TableCell align="center">
|
||||
{i18n.t("connections.table.lastUpdate")}
|
||||
</TableCell>
|
||||
<TableCell align="center">
|
||||
{i18n.t("connections.table.default")}
|
||||
</TableCell>
|
||||
<TableCell align="center">
|
||||
{i18n.t("connections.table.actions")}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
<TableBody>
|
||||
{loading ? (
|
||||
<TableRowSkeleton />
|
||||
) : (
|
||||
<>
|
||||
{whatsApps?.length > 0 &&
|
||||
whatsApps.map(whatsApp => (
|
||||
<TableRow key={whatsApp.id}>
|
||||
<TableCell align="center">{whatsApp.name}</TableCell>
|
||||
|
||||
|
||||
</MainHeaderButtonsWrapper>
|
||||
</MainHeader>
|
||||
<Paper className={classes.mainPaper} variant="outlined">
|
||||
<Table size="small">
|
||||
<TableHead>
|
||||
<TableRow>
|
||||
<TableCell align="center">
|
||||
{i18n.t("connections.table.name")}
|
||||
</TableCell>
|
||||
<TableCell align="center">
|
||||
{i18n.t("connections.table.status")}
|
||||
</TableCell>
|
||||
|
||||
|
||||
<Can
|
||||
role={user.profile}
|
||||
perform="connection-button:show"
|
||||
yes={() => (
|
||||
<TableCell align="center">
|
||||
{renderStatusToolTips(whatsApp)}
|
||||
{i18n.t("connections.table.session")}
|
||||
</TableCell>
|
||||
|
||||
<Can
|
||||
role={user.profile}
|
||||
perform="connection-button:show"
|
||||
yes={() => (
|
||||
<TableCell align="center">
|
||||
{renderActionButtons(whatsApp)}
|
||||
</TableCell>
|
||||
)}
|
||||
/>
|
||||
|
||||
|
||||
|
||||
<TableCell align="center">
|
||||
{format(parseISO(whatsApp.updatedAt), "dd/MM/yy HH:mm")}
|
||||
</TableCell>
|
||||
<TableCell align="center">
|
||||
{whatsApp.isDefault && (
|
||||
<div className={classes.customTableCell}>
|
||||
<CheckCircle style={{ color: green[500] }} />
|
||||
</div>
|
||||
)}
|
||||
</TableCell>
|
||||
<TableCell align="center">
|
||||
<IconButton
|
||||
size="small"
|
||||
onClick={() => handleEditWhatsApp(whatsApp)}
|
||||
>
|
||||
<Edit />
|
||||
</IconButton>
|
||||
)}
|
||||
/>
|
||||
|
||||
|
||||
|
||||
<Can
|
||||
<TableCell align="center">
|
||||
{i18n.t("connections.table.lastUpdate")}
|
||||
</TableCell>
|
||||
<TableCell align="center">
|
||||
{i18n.t("connections.table.default")}
|
||||
</TableCell>
|
||||
<TableCell align="center">
|
||||
{i18n.t("connections.table.actions")}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
<TableBody>
|
||||
{loading ? (
|
||||
<TableRowSkeleton />
|
||||
) : (
|
||||
<>
|
||||
{whatsApps?.length > 0 &&
|
||||
whatsApps.map(whatsApp => (
|
||||
<TableRow key={whatsApp.id}>
|
||||
<TableCell align="center">{whatsApp.name}</TableCell>
|
||||
<TableCell align="center">
|
||||
{renderStatusToolTips(whatsApp)}
|
||||
</TableCell>
|
||||
|
||||
<Can
|
||||
role={user.profile}
|
||||
perform="btn-remove-whatsapp"
|
||||
perform="connection-button:show"
|
||||
yes={() => (
|
||||
<IconButton
|
||||
size="small"
|
||||
onClick={e => {
|
||||
handleOpenConfirmationModal("delete", whatsApp.id);
|
||||
}}
|
||||
>
|
||||
<DeleteOutline />
|
||||
</IconButton>
|
||||
<TableCell align="center">
|
||||
{renderActionButtons(whatsApp)}
|
||||
</TableCell>
|
||||
)}
|
||||
/>
|
||||
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))}
|
||||
</>
|
||||
)}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</Paper>
|
||||
</MainContainer>
|
||||
)}
|
||||
/>
|
||||
|
||||
/>
|
||||
|
||||
|
||||
|
||||
<TableCell align="center">
|
||||
{format(parseISO(whatsApp.updatedAt), "dd/MM/yy HH:mm")}
|
||||
</TableCell>
|
||||
<TableCell align="center">
|
||||
{whatsApp.isDefault && (
|
||||
<div className={classes.customTableCell}>
|
||||
<CheckCircle style={{ color: green[500] }} />
|
||||
</div>
|
||||
)}
|
||||
</TableCell>
|
||||
<TableCell align="center">
|
||||
|
||||
<Can
|
||||
role={user.profile}
|
||||
perform="show-icon-edit-whatsapp"
|
||||
yes={() => (
|
||||
<IconButton
|
||||
size="small"
|
||||
onClick={() => handleEditWhatsApp(whatsApp)}
|
||||
>
|
||||
<Edit />
|
||||
</IconButton>
|
||||
)}
|
||||
/>
|
||||
|
||||
|
||||
<Can
|
||||
role={user.profile}
|
||||
perform="btn-remove-whatsapp"
|
||||
yes={() => (
|
||||
<IconButton
|
||||
size="small"
|
||||
onClick={e => {
|
||||
handleOpenConfirmationModal("delete", whatsApp.id);
|
||||
}}
|
||||
>
|
||||
<DeleteOutline />
|
||||
</IconButton>
|
||||
)}
|
||||
/>
|
||||
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))}
|
||||
</>
|
||||
)}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</Paper>
|
||||
</MainContainer>
|
||||
)}
|
||||
/>
|
||||
|
||||
);
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -91,7 +91,7 @@ const reducer = (state, action) => {
|
|||
const Queues = () => {
|
||||
const classes = useStyles();
|
||||
|
||||
const { user } = useContext(AuthContext);
|
||||
const { user } = useContext(AuthContext);
|
||||
|
||||
const [queues, dispatch] = useReducer(reducer, []);
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
|
@ -163,17 +163,16 @@ const Queues = () => {
|
|||
setSelectedQueue(null);
|
||||
};
|
||||
|
||||
return (
|
||||
return (
|
||||
<Can
|
||||
role={user.profile}
|
||||
perform="queues-view:show"
|
||||
yes={() => (
|
||||
<MainContainer>
|
||||
role={user.profile}
|
||||
perform="queues-view:show"
|
||||
yes={() => (
|
||||
<MainContainer>
|
||||
<ConfirmationModal
|
||||
title={
|
||||
selectedQueue &&
|
||||
`${i18n.t("queues.confirmationModal.deleteTitle")} ${
|
||||
selectedQueue.name
|
||||
`${i18n.t("queues.confirmationModal.deleteTitle")} ${selectedQueue.name
|
||||
}?`
|
||||
}
|
||||
open={confirmModalOpen}
|
||||
|
|
@ -189,15 +188,25 @@ const Queues = () => {
|
|||
/>
|
||||
<MainHeader>
|
||||
<Title>{i18n.t("queues.title")}</Title>
|
||||
<MainHeaderButtonsWrapper>
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
onClick={handleOpenQueueModal}
|
||||
>
|
||||
{i18n.t("queues.buttons.add")}
|
||||
</Button>
|
||||
</MainHeaderButtonsWrapper>
|
||||
|
||||
|
||||
<Can
|
||||
role={user.profile}
|
||||
perform="show-icon-add-queue"
|
||||
yes={() => (
|
||||
<MainHeaderButtonsWrapper>
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
onClick={handleOpenQueueModal}
|
||||
>
|
||||
{i18n.t("queues.buttons.add")}
|
||||
</Button>
|
||||
</MainHeaderButtonsWrapper>
|
||||
)}
|
||||
/>
|
||||
|
||||
|
||||
</MainHeader>
|
||||
<Paper className={classes.mainPaper} variant="outlined">
|
||||
<Table size="small">
|
||||
|
|
@ -245,23 +254,42 @@ const Queues = () => {
|
|||
</Typography>
|
||||
</div>
|
||||
</TableCell>
|
||||
|
||||
|
||||
|
||||
<TableCell align="center">
|
||||
<IconButton
|
||||
size="small"
|
||||
onClick={() => handleEditQueue(queue)}
|
||||
>
|
||||
<Edit />
|
||||
</IconButton>
|
||||
|
||||
<IconButton
|
||||
size="small"
|
||||
onClick={() => {
|
||||
setSelectedQueue(queue);
|
||||
setConfirmModalOpen(true);
|
||||
}}
|
||||
>
|
||||
<DeleteOutline />
|
||||
</IconButton>
|
||||
|
||||
|
||||
<Can
|
||||
role={user.profile}
|
||||
perform="show-icon-edit-queue"
|
||||
yes={() => (
|
||||
<IconButton
|
||||
size="small"
|
||||
onClick={() => handleEditQueue(queue)}
|
||||
>
|
||||
<Edit />
|
||||
</IconButton>
|
||||
)}
|
||||
/>
|
||||
|
||||
|
||||
<Can
|
||||
role={user.profile}
|
||||
perform="show-icon-delete-queue"
|
||||
yes={() => (
|
||||
<IconButton
|
||||
size="small"
|
||||
onClick={() => {
|
||||
setSelectedQueue(queue);
|
||||
setConfirmModalOpen(true);
|
||||
}}
|
||||
>
|
||||
<DeleteOutline />
|
||||
</IconButton>
|
||||
)}
|
||||
/>
|
||||
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))}
|
||||
|
|
@ -271,8 +299,8 @@ const Queues = () => {
|
|||
</Table>
|
||||
</Paper>
|
||||
</MainContainer>
|
||||
)}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -5,6 +5,8 @@ const rules = {
|
|||
|
||||
admin: {
|
||||
static: [
|
||||
"show-icon-edit-whatsapp",
|
||||
|
||||
"drawer-admin-items:view",
|
||||
"tickets-manager:showall",
|
||||
"user-modal:editProfile",
|
||||
|
|
@ -22,6 +24,13 @@ const rules = {
|
|||
|
||||
master: {
|
||||
static: [
|
||||
|
||||
"show-icon-edit-whatsapp",
|
||||
"show-icon-add-queue",
|
||||
"show-icon-edit-queue",
|
||||
"show-icon-delete-queue",
|
||||
|
||||
|
||||
"drawer-admin-items:view",
|
||||
"tickets-manager:showall",
|
||||
"user-modal:editProfile",
|
||||
|
|
|
|||
Loading…
Reference in New Issue