ajustes em adamento

backend/src/controllers/TicketController.ts

@@ -35,6 +35,7 @@ type IndexQuery = {
   withUnreadMessages: string;
   queueIds: string;
   unlimited?: string;
+  searchParamContent?: string
 };
 
 interface TicketData {
@@ -71,7 +72,8 @@ export const index = async (req: Request, res: Response): Promise<Response> => {
     showAll,
     queueIds: queueIdsStringified,
     withUnreadMessages,
-    unlimited
+    unlimited,
+    searchParamContent
   } = req.query as IndexQuery;
 
 
@@ -92,14 +94,15 @@ export const index = async (req: Request, res: Response): Promise<Response> => {
     userId,
     queueIds,
     withUnreadMessages,
-    unlimited
+    unlimited,
+    searchParamContent
   });
 
   return res.status(200).json({ tickets, count, hasMore });
 };
 
 export const store = async (req: Request, res: Response): Promise<Response> => {
-  const { contactId, status, userId, msg }: TicketData = req.body;
+  const { contactId, status, userId, msg, queueId }: TicketData = req.body;
 
   console.log('TICKET CREATE: ', 'contactId: ', contactId, ' | status: ', status, ' | userId: ', userId)
 
@@ -111,7 +114,7 @@ export const store = async (req: Request, res: Response): Promise<Response> => {
 
   }
   else {
-    ticket = await CreateTicketService({ contactId, status, userId, msg });
+    ticket = await CreateTicketService({ contactId, status, userId, msg, queueId });
   }
 
   const io = getIO();

backend/src/services/TicketServices/CreateTicketService.ts

@@ -29,7 +29,7 @@ interface Request {
   status: string;
   userId: number;
   msg?: string,
-  queueId?: string | undefined
+  queueId?: number | undefined
 }
 
 const CreateTicketService = async ({
@@ -42,7 +42,7 @@ const CreateTicketService = async ({
 
   try {
 
-    console.log('Create contact service........')
+    console.log('*************** Create contact service queueId: ', queueId)
 
     const defaultWhatsapp = await GetDefaultWhatsApp(userId);
 

backend/src/services/TicketServices/ListTicketsService.ts

@@ -31,6 +31,7 @@ interface Request {
   withUnreadMessages?: string;
   queueIds: number[];
   unlimited?: string;
+  searchParamContent?: string;
 }
 
 interface Response {
@@ -49,9 +50,12 @@ const ListTicketsService = async ({
   showAll,
   userId,
   withUnreadMessages,
-  unlimited = 'false'
+  unlimited = 'false',
+  searchParamContent = ""
 }: Request): Promise<Response> => {
 
+  console.log('----------> searchParamContent: ', searchParamContent)
+
   let whereCondition: Filterable["where"] = { [Op.or]: [{ userId }, { status: "pending" }], queueId: { [Op.or]: [queueIds, null] } };
 
   console.log('PAGE NUMBER TICKET: ', pageNumber)
@@ -146,6 +150,7 @@ const ListTicketsService = async ({
 
   if (searchParam) {
     const sanitizedSearchParam = searchParam.toLocaleLowerCase().trim();
+    const sanitizedSearchParamContent = searchParamContent.toLocaleLowerCase().trim();
 
     // includeCondition = [
     //   ...includeCondition,
@@ -161,20 +166,31 @@ const ListTicketsService = async ({
     //   }
     // ];
 
+    if (searchParamContent.length > 0) {
+
+      console.log('LLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLL')
+
+      includeCondition = [
+        ...includeCondition,
+        {
+          model: Message,
+          as: "messages",
+          attributes: ["id", "body"],
+          where: {
+            body: where(fn("LOWER", col("body")), "LIKE", `%${sanitizedSearchParamContent}%`)
+          },
+          required: false,
+          duplicating: false
+        }
+      ];
+
+      whereCondition = {
+        ...whereCondition,
+        "$message.body$": where(fn("LOWER", col("body")), "LIKE", `%${sanitizedSearchParamContent}%`)
+      };
+
+    }
 
-    includeCondition = [
-      ...includeCondition,
-      {
-        model: Message,
-        as: "messages",
-        attributes: ["id", "body"],
-        where: {
-          body: where(fn("LOWER", col("body")), "LIKE", `%ADRIANO ROB%`)
-        },
-        required: false,
-        duplicating: false
-      }
-    ];
 
     whereCondition = {
       ...whereCondition,
@@ -185,13 +201,12 @@ const ListTicketsService = async ({
 
         { "$contact.number$": { [Op.like]: `%${sanitizedSearchParam}%` } },
 
-        // { 
-        //   "$message.body$": where(fn("LOWER", col("body")), "LIKE", `%${sanitizedSearchParam}%`) 
-        // }
       ],
-      "$message.body$": where(fn("LOWER", col("body")), "LIKE", `%ADRIANO ROB%`) 
+      // "$message.body$": where(fn("LOWER", col("body")), "LIKE", `%ADRIANO ROB%`)
     };
 
+    console.log('whereConditionwhereConditionwhereCondition: ', whereCondition)
+
 
     // whereCondition = {
     //   ...whereCondition,

frontend/src/components/TicketsList/index.js

@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useReducer, useContext } from "react"; 
+import React, { useState, useEffect, useReducer, useContext } from "react";
 
 
 import openSocket from "socket.io-client";
@@ -177,31 +177,32 @@ const reducer = (state, action) => {
 };
 
 const TicketsList = (props) => {
-	const { status, searchParam, showAll, selectedQueueIds, updateCount, style, tab } = props;
+	const { status, searchParam, searchParamContent, showAll, selectedQueueIds, updateCount, style, tab } = props;
 	const classes = useStyles();
 	const [pageNumber, setPageNumber] = useState(1);
 	const [ticketsList, dispatch] = useReducer(reducer, []);
 	const { user } = useContext(AuthContext);
 
-	const { searchTicket } = useContext(SearchTicketContext)  
+	const { searchTicket } = useContext(SearchTicketContext)
 
-	useEffect(() => { 
+	useEffect(() => {
 
 		dispatch({ type: "RESET" });
 		setPageNumber(1);
 
-	}, [status, searchParam, showAll, selectedQueueIds, searchTicket]);  
+	}, [status, searchParam, searchParamContent, showAll, selectedQueueIds, searchTicket]);
 
 	const { tickets, hasMore, loading } = useTickets({
 		pageNumber,
 		searchParam,
+		searchParamContent,
 		status,
 		showAll,
 		queueIds: JSON.stringify(selectedQueueIds),
 		tab
 	});
 
-	useEffect(() => { 
+	useEffect(() => {
 
 		if (!status && !searchParam) return;
 

frontend/src/components/TicketsManager/index.js

@@ -8,6 +8,9 @@ import Tabs from "@material-ui/core/Tabs";
 import Tab from "@material-ui/core/Tab";
 import Badge from "@material-ui/core/Badge";
 
+import Tooltip from "@material-ui/core/Tooltip";
+
+
 import SearchIcon from "@material-ui/icons/Search";
 import MoveToInboxIcon from "@material-ui/icons/MoveToInbox";
 import CheckBoxIcon from "@material-ui/icons/CheckBox";
@@ -152,6 +155,9 @@ const TicketsManager = () => {
   const [inputSearch, setInputSearch] = useState('');
   const [inputContentSearch, setInputContentSearch] = useState("")
 
+  const [openTooltipSearch, setOpenTooltipSearch] = useState(false)
+
+
   useEffect(() => {
     if (user.profile.toUpperCase() === "ADMIN") {
       setShowAllTickets(true);
@@ -183,6 +189,7 @@ const TicketsManager = () => {
   }, [tabOption, setTabOption])
 
   let searchTimeout;
+  let searchContentTimeout;
 
   const removeExtraSpace = (str) => {
 
@@ -203,10 +210,16 @@ const TicketsManager = () => {
     if (searchedTerm === "") {
       setSearchParam(prev => ({ ...prev, searchParam: searchedTerm }))
       setInputSearch(searchedTerm)
+      setShowContentSearch(false)
       setTab("open");
       return;
     }
 
+    if (searchedTerm.length < 4) {
+      setSearchParam(prev => ({ ...prev, searchParamContent: "" }))
+    }
+
+
     searchTimeout = setTimeout(() => {
 
       setSearchParam(prev => ({ ...prev, searchParam: searchedTerm }));
@@ -215,8 +228,36 @@ const TicketsManager = () => {
   };
 
   const handleContentSearch = e => {
-    let searchedContentText = e.target.value.toLowerCase()
+
-     setInputContentSearch(searchedContentText)
+    let searchedContentText = removeExtraSpace(e.target.value.toLowerCase())
+
+    console.log('searchedContentText: ', searchedContentText)
+
+    setInputContentSearch(searchedContentText)
+
+    // setInputSearch(removeExtraSpace(searchedContentText))
+
+    clearTimeout(searchContentTimeout);
+
+    searchContentTimeout = setTimeout(() => {
+
+      setSearchParam(prev => ({ ...prev, searchParamContent: inputContentSearch }));
+
+    }, 500);
+
+  }
+
+  const handleOpenTooltipSearch = () => {
+    if (searchParam.searchParam.length < 4) {
+      setOpenTooltipSearch(true)
+    }
+  }
+
+  const handleCloseTooltipSearch = () => {
+    setOpenTooltipSearch(false)
+    if (searchParam.searchParam.length < 4) {
+      searchInputRef.current.focus()
+    }
   }
 
   const handleChangeTab = (e, newValue) => {
@@ -281,12 +322,28 @@ const TicketsManager = () => {
                 value={inputSearch}
                 onChange={handleSearch}
               />
-              <IconButton onClick={() => setShowContentSearch(prev => !prev)}>
+              {/* <IconButton onClick={() => setShowContentSearch(prev => !prev)}>
                 <MenuIcon className={classes.menuSearch} />
-              </IconButton>
+              </IconButton> */}
+              <Tooltip
+                open={openTooltipSearch}
+                onOpen={() => handleOpenTooltipSearch()}
+                onClose={() => handleCloseTooltipSearch()}
+                title="Digite pelo menos 4 caracteres"
+                arrow>
+                <span>
+                  <IconButton
+                    disabled={searchParam.searchParam.length < 4}
+                    onClick={() => setShowContentSearch(prev => !prev)}
+                  >
+                    <MenuIcon className={classes.menuSearch} />
+                  </IconButton>
+                </span>
+              </Tooltip>
             </div>
             {
-              showContentSearch ?
+              // showContentSearch ?
+              (showContentSearch && searchParam.searchParam.length >= 4) ?
                 (<div className={classes.searchContentInput}>
                   <FindInPageIcon className={classes.searchIcon} />
                   <InputBase
@@ -400,6 +457,7 @@ const TicketsManager = () => {
 
         <TicketsList
           searchParam={searchParam.searchParam}
+          searchParamContent={searchParam.searchParamContent}
           tab={tab}
           showAll={true}
           selectedQueueIds={selectedQueueIds}

frontend/src/hooks/useTickets/index.js

@@ -5,6 +5,7 @@ import api from "../../services/api";
 
 const useTickets = ({
 	searchParam,
+	searchParamContent,
 	pageNumber,
 	status,
 	date,
@@ -35,6 +36,7 @@ const useTickets = ({
 					const { data } = await api.get("/tickets", {
 						params: {
 							searchParam,
+							searchParamContent,
 							pageNumber,
 							status,
 							date,
@@ -63,6 +65,7 @@ const useTickets = ({
 		return () => clearTimeout(delayDebounceFn);
 	}, [
 		searchParam,
+		searchParamContent,
 		pageNumber,
 		status,
 		date,