From 4cd72fdbd666502b0f7c7ad67fa96b1a80247adf Mon Sep 17 00:00:00 2001 From: adriano Date: Wed, 28 Jun 2023 19:48:29 -0300 Subject: [PATCH] Estado funcional da busca de tickets pelo conteudo --- .../TicketServices/ListTicketsService.ts | 2 +- .../ContactCreateTicketModal/index.js | 114 ++++++++++-------- .../src/components/TicketsManager/index.js | 42 +++++-- 3 files changed, 98 insertions(+), 60 deletions(-) diff --git a/backend/src/services/TicketServices/ListTicketsService.ts b/backend/src/services/TicketServices/ListTicketsService.ts index 97f9932..a4b23b9 100644 --- a/backend/src/services/TicketServices/ListTicketsService.ts +++ b/backend/src/services/TicketServices/ListTicketsService.ts @@ -168,7 +168,7 @@ const ListTicketsService = async ({ if (searchParamContent.length > 0) { - console.log('LLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLL') + // console.log('LLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLL') includeCondition = [ ...includeCondition, diff --git a/frontend/src/components/ContactCreateTicketModal/index.js b/frontend/src/components/ContactCreateTicketModal/index.js index af8add1..35a3bed 100644 --- a/frontend/src/components/ContactCreateTicketModal/index.js +++ b/frontend/src/components/ContactCreateTicketModal/index.js @@ -1,4 +1,4 @@ -import React, { useState, useEffect, useContext } from "react"; +import React, { useState, useEffect, useContext, useRef, useCallback } from "react"; import { useHistory } from "react-router-dom"; import { toast } from "react-toastify"; @@ -8,6 +8,7 @@ import Select from "@material-ui/core/Select"; import FormControl from "@material-ui/core/FormControl"; import InputLabel from "@material-ui/core/InputLabel"; import MenuItem from "@material-ui/core/MenuItem"; +import LinearProgress from "@material-ui/core/LinearProgress"; import { makeStyles } from "@material-ui/core"; import DialogActions from "@material-ui/core/DialogActions"; @@ -28,11 +29,15 @@ const useStyles = makeStyles((theme) => ({ }, paper: { minWidth: "300px" + }, + linearProgress: { + marginTop: "5px" } })); const ContactCreateTicketModal = ({ modalOpen, onClose, contactId }) => { const { user } = useContext(AuthContext); + let isMounted = useRef(true) const history = useHistory(); const [queues, setQueues] = useState([]); @@ -42,6 +47,7 @@ const ContactCreateTicketModal = ({ modalOpen, onClose, contactId }) => { useEffect(() => { const userQueues = user.queues.map(({ id, name, color }) => { return { id, name, color } }) + if (userQueues.length === 1) setSelectedQueue(userQueues[0].id) setQueues(userQueues) }, [user]); @@ -49,69 +55,81 @@ const ContactCreateTicketModal = ({ modalOpen, onClose, contactId }) => { onClose(); }; - const handleSaveTicket = async (e) => { - e.preventDefault() - if (!contactId) return; - if (!selectedQueue) { + const handleSaveTicket = useCallback(async (contactId, userId, queueId) => { + if (!contactId || !userId) { + console.log("Missing contactId or userId") + return + }; + if (!queueId) { toast.warning("Nenhuma Fila Selecionada") return } - setLoading(true); + if (isMounted.current) setLoading(true); try { const { data: ticket } = await api.post("/tickets", { contactId: contactId, - userId: user?.id, - queueId: selectedQueue, + userId: userId, + queueId: queueId, status: "open", }); history.push(`/tickets/${ticket.id}`); } catch (err) { toastError(err); - onClose() } - setLoading(false); - }; + if (isMounted.current) setLoading(false); + }, [history]) + + useEffect(() => { + if (modalOpen && queues.length <= 1) { + handleSaveTicket(contactId, user.id, selectedQueue) + } + return () => { + isMounted.current = false; + }; + }, [modalOpen, contactId, user.id, selectedQueue, handleSaveTicket, queues.length]); + + if (modalOpen && queues.length <= 1) { + return + } return ( -
- - {i18n.t("newTicketModal.title")} - - - - {i18n.t("Selecionar Fila")} - - - - - + handleSaveTicket(contactId, user.id, selectedQueue)} + variant="contained" + color="primary" + loading={loading} + > + {i18n.t("newTicketModal.buttons.ok")} + +
); }; diff --git a/frontend/src/components/TicketsManager/index.js b/frontend/src/components/TicketsManager/index.js index d00fcf6..fa7e8e4 100644 --- a/frontend/src/components/TicketsManager/index.js +++ b/frontend/src/components/TicketsManager/index.js @@ -174,6 +174,26 @@ const TicketsManager = () => { }, [tab, setTabOption]); + useEffect(() => { + + + clearTimeout(searchContentTimeout); + + setSearchParam(prev => ({ ...prev, searchParamContent: "" })) + + // console.log('inputContentSearch1: ', inputContentSearch) + + if (!inputContentSearch) return + + searchContentTimeout = setTimeout(() => { + + setSearchParam(prev => ({ ...prev, searchParamContent: inputContentSearch })); + + }, 500); + + + }, [inputContentSearch,]); + useEffect(() => { @@ -182,6 +202,7 @@ const TicketsManager = () => { setTabOption('') setSearchParam(DEFAULT_SEARCH_PARAM); setInputSearch(''); + setInputContentSearch('') setTab("open"); return; } @@ -217,6 +238,7 @@ const TicketsManager = () => { if (searchedTerm.length < 4) { setSearchParam(prev => ({ ...prev, searchParamContent: "" })) + setInputContentSearch('') } @@ -233,18 +255,16 @@ const TicketsManager = () => { console.log('searchedContentText: ', searchedContentText) + // clearTimeout(searchContentTimeout); + + // searchContentTimeout = setTimeout(() => { + + // setSearchParam(prev => ({ ...prev, searchParamContent: inputContentSearch })); + + // }, 500); + setInputContentSearch(searchedContentText) - // setInputSearch(removeExtraSpace(searchedContentText)) - - clearTimeout(searchContentTimeout); - - searchContentTimeout = setTimeout(() => { - - setSearchParam(prev => ({ ...prev, searchParamContent: inputContentSearch })); - - }, 500); - } const handleOpenTooltipSearch = () => { @@ -352,7 +372,7 @@ const TicketsManager = () => { placeholder={i18n.t("Busca por conteúdo")} type="search" value={inputContentSearch} - onChange={handleContentSearch} + onChange={(e) => handleContentSearch(e)} /> ) : null }