diff --git a/backend/src/controllers/TicketController.ts b/backend/src/controllers/TicketController.ts index c8d59433..4d9554ad 100644 --- a/backend/src/controllers/TicketController.ts +++ b/backend/src/controllers/TicketController.ts @@ -63,9 +63,9 @@ export const index = async (req: Request, res: Response): Promise => { }; export const store = async (req: Request, res: Response): Promise => { - const { contactId, status, userId }: TicketData = req.body; + const { contactId, status, userId, queueId }: TicketData = req.body; - const ticket = await CreateTicketService({ contactId, status, userId }); + const ticket = await CreateTicketService({ contactId, status, userId, queueId }); const io = getIO(); io.to(ticket.status).emit("ticket", { diff --git a/frontend/src/components/AcceptTicketWithoutQueueModal/index.js b/frontend/src/components/AcceptTicketWithoutQueueModal/index.js new file mode 100644 index 00000000..73770a56 --- /dev/null +++ b/frontend/src/components/AcceptTicketWithoutQueueModal/index.js @@ -0,0 +1,119 @@ +import React, { useState, useContext } from "react"; +import { useHistory } from "react-router-dom"; + +import { + Button, + Dialog, + DialogActions, + DialogContent, + DialogTitle, + FormControl, + InputLabel, + makeStyles, + MenuItem, + Select + } from "@material-ui/core"; + + +import api from "../../services/api"; +import { AuthContext } from "../../context/Auth/AuthContext"; +import ButtonWithSpinner from "../ButtonWithSpinner"; +import { i18n } from "../../translate/i18n"; +import toastError from "../../errors/toastError"; + +// const filter = createFilterOptions({ +// trim: true, +// }); + +const useStyles = makeStyles((theme) => ({ + autoComplete: { + width: 300, + // marginBottom: 20 + }, + maxWidth: { + width: "100%", + }, + buttonColorError: { + color: theme.palette.error.main, + borderColor: theme.palette.error.main, + }, +})); + +const AcceptTicketWithouSelectQueue = ({ modalOpen, onClose, ticketId }) => { + const history = useHistory(); + const classes = useStyles(); + const [selectedQueue, setSelectedQueue] = useState(''); + const [loading, setLoading] = useState(false); + const { user } = useContext(AuthContext); + +const handleClose = () => { + onClose(); + setSelectedQueue(""); +}; + +const handleUpdateTicketStatus = async (queueId) => { + setLoading(true); + try { + await api.put(`/tickets/${ticketId}`, { + status: "open", + userId: user?.id || null, + queueId: queueId + }); + + setLoading(false); + history.push(`/tickets/${ticketId}`); + handleClose(); + } catch (err) { + setLoading(false); + toastError(err); + } +}; + +return ( + <> + + + {i18n.t("ticketsList.acceptModal.title")} + + + + {i18n.t("ticketsList.acceptModal.queue")} + + + + + + handleUpdateTicketStatus(selectedQueue)} + color="primary" + loading={loading} + > + {i18n.t("ticketsList.buttons.start")} + + + + +); +}; + +export default AcceptTicketWithouSelectQueue; \ No newline at end of file diff --git a/frontend/src/components/NewTicketModal/index.js b/frontend/src/components/NewTicketModal/index.js index 1d0a16a2..b4a20975 100644 --- a/frontend/src/components/NewTicketModal/index.js +++ b/frontend/src/components/NewTicketModal/index.js @@ -20,6 +20,30 @@ import ContactModal from "../ContactModal"; import toastError from "../../errors/toastError"; import { AuthContext } from "../../context/Auth/AuthContext"; +import { + FormControl, + InputLabel, + makeStyles, + MenuItem, + Select +} from "@material-ui/core"; + + + +const useStyles = makeStyles((theme) => ({ + autoComplete: { + width: 300, + // marginBottom: 20 + }, + maxWidth: { + width: "100%", + }, + buttonColorError: { + color: theme.palette.error.main, + borderColor: theme.palette.error.main, + }, +})); + const filter = createFilterOptions({ trim: true, }); @@ -34,6 +58,8 @@ const NewTicketModal = ({ modalOpen, onClose }) => { const [newContact, setNewContact] = useState({}); const [contactModalOpen, setContactModalOpen] = useState(false); const { user } = useContext(AuthContext); + const [selectedQueue, setSelectedQueue] = useState(''); + const classes = useStyles(); useEffect(() => { if (!modalOpen || searchParam.length < 3) { @@ -74,6 +100,7 @@ const NewTicketModal = ({ modalOpen, onClose }) => { contactId: contactId, userId: user.id, status: "open", + queueId: selectedQueue }); history.push(`/tickets/${ticket.id}`); } catch (err) { @@ -140,47 +167,74 @@ const NewTicketModal = ({ modalOpen, onClose }) => { {i18n.t("newTicketModal.title")} - - handleSelectOption(e, newValue)} - renderInput={params => ( - setSearchParam(e.target.value)} - onKeyPress={e => { - if (loading || !selectedContact) return; - else if (e.key === "Enter") { - handleSaveTicket(selectedContact.id); - } - }} - InputProps={{ - ...params.InputProps, - endAdornment: ( - - {loading ? ( - - ) : null} - {params.InputProps.endAdornment} - - ), - }} - /> - )} - /> - + + + + + + + handleSelectOption(e, newValue)} + renderInput={params => ( + setSearchParam(e.target.value)} + onKeyPress={e => { + if (loading || !selectedContact) return; + else if (e.key === "Enter") { + handleSaveTicket(selectedContact.id); + } + }} + InputProps={{ + ...params.InputProps, + endAdornment: ( + + {loading ? ( + + ) : null} + {params.InputProps.endAdornment} + + ), + }} + /> + )} + /> + + + + {i18n.t("ticketsList.acceptModal.queue")} + + + + + +