adriano.andrade
/
projeto-hit
mirror of https://github.com/AdrianoRobson/projeto-hit.git
1
1
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Correção para abrir links de whatsapp wa.me

adriano 2023-06-12 15:55:54 -03:00
parent 441f1fa83e
commit 307ceca26e
5 changed files with 270 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
backend/src/services/MessageServices/ListMessagesService.ts
View File

@ -20,7 +20,9 @@ const ListMessagesService = async ({
ticketId
}: Request): Promise<Response> => {
if (ticketId && ticketId.includes("&&text=")) {
console.log('>>>>>>>>>>>>>>>>>>>> ticketId: ', ticketId)
if (ticketId && ticketId.length > 9) {
return {
messages: [],
ticket: new Ticket,

1
backend/src/services/TicketServices/CreateTicketService.ts
View File

@ -44,7 +44,6 @@ const CreateTicketService = async ({
const defaultWhatsapp = await GetDefaultWhatsApp(userId);
const user = await User.findByPk(userId, { raw: true, })
console.log('user.profile: ', user?.profile)

70
frontend/src/components/Ticket/index.js
View File

@ -1,4 +1,4 @@
import React, { useState, useEffect, useContext } from "react";
import React, { useState, useEffect } from "react";
import { useParams, useHistory } from "react-router-dom";
import { toast } from "react-toastify";
@ -17,8 +17,6 @@ import api from "../../services/api";
import { ReplyMessageProvider } from "../../context/ReplyingMessage/ReplyingMessageContext";
import toastError from "../../errors/toastError";
import { AuthContext } from "../../context/Auth/AuthContext"
const drawerWidth = 320;
const useStyles = makeStyles((theme) => ({
@ -76,10 +74,6 @@ const useStyles = makeStyles((theme) => ({
}));
const Ticket = () => {
const { user } = useContext(AuthContext);
const { ticketId } = useParams();
const history = useHistory();
const classes = useStyles();
@ -95,60 +89,9 @@ const Ticket = () => {
setLoading(true);
const delayDebounceFn = setTimeout(() => {
const fetchTicket = async () => {
try {
let number
let msg
let contactId
if (ticketId && ticketId.includes("&&text=")) {
number = ticketId.split('&&text=')[0]
msg = ticketId.split('&&text=')[1]
msg = decodeURIComponent(msg);
console.log('NUMBER: ', number)
const { data: data0 } = await api.get("/contacts/", { params: { searchParam: number, pageNumber: "1" }, });
if (data0 && data0.contacts.length > 0) {
console.log('-----> data: ', data0.contacts[0].id)
contactId = data0.contacts[0].id
}
else {
console.log('NO CONTACT whith this NUMBER: ', number)
const values = {
name: number,
number: number,
};
const { data: data1 } = await api.post("/contacts", values);
console.log('data1: ', data1)
contactId = data1.id
}
const { data: ticket } = await api.post("/tickets", {
contactId: contactId,
userId: user.id,
status: "open",
msg
});
window.location.reload();
history.push(`/tickets/${ticket.id}`);
window.location.reload();
}
else {
console.log('>>>>>>>>>>>>>>>>>>>>>>>>> ticketId: ', ticketId)
// maria julia
const { data } = await api.get("/tickets/" + ticketId);
@ -161,9 +104,6 @@ const Ticket = () => {
setStatusChatEnd(data.statusChatEnd)
setLoading(false);
}
} catch (err) {
setLoading(false);
toastError(err);
@ -172,12 +112,12 @@ const Ticket = () => {
fetchTicket();
}, 500);
return () => clearTimeout(delayDebounceFn);
}, [ticketId, history, user.id]);
}, [ticketId, history]);
useEffect(() => {
const regex = /^[0-9\b]+$/; // Regular expression to match only numbers
if (ticketId && !ticketId.match(regex)) return
if (ticketId && !ticketId.match(regex) || ticketId && ticketId.length > 9 ) return
const socket = openSocket(process.env.REACT_APP_BACKEND_URL);
@ -236,7 +176,7 @@ const Ticket = () => {
/>
</div>
<div className={classes.ticketActionButtons}>
<TicketActionButtons ticket={ticket} statusChatEnd={statusChatEnd} />
<TicketActionButtons ticket={ticket} statusChatEnd={statusChatEnd}/>
</div>
</TicketHeader>
<ReplyMessageProvider>

245
frontend/src/pages/Tickets/WhatsLink/index.js 100644
View File

@ -0,0 +1,245 @@
import React, { useState, useEffect, useContext } from "react";
import { useParams, useHistory } from "react-router-dom";
import { toast } from "react-toastify";
import openSocket from "socket.io-client";
import clsx from "clsx";
import { Paper, makeStyles } from "@material-ui/core";
import ContactDrawer from "../../../components/ContactDrawer";
import MessageInput from "../../../components/MessageInput";
import TicketHeader from "../../../components/TicketHeader";
import TicketInfo from "../../../components/TicketInfo";
import TicketActionButtons from "../../../components/TicketActionButtons";
import MessagesList from "../../../components/MessagesList";
import api from "../../../services/api";
import { ReplyMessageProvider } from "../../../context/ReplyingMessage/ReplyingMessageContext";
import toastError from "../../../errors/toastError";
import { AuthContext } from "../../../context/Auth/AuthContext"
const drawerWidth = 320;
const useStyles = makeStyles((theme) => ({
root: {
display: "flex",
height: "100%",
position: "relative",
overflow: "hidden",
},
ticketInfo: {
maxWidth: "50%",
flexBasis: "50%",
[theme.breakpoints.down("sm")]: {
maxWidth: "80%",
flexBasis: "80%",
},
},
ticketActionButtons: {
maxWidth: "50%",
flexBasis: "50%",
display: "flex",
[theme.breakpoints.down("sm")]: {
maxWidth: "100%",
flexBasis: "100%",
marginBottom: "5px",
},
},
mainWrapper: {
flex: 1,
height: "100%",
display: "flex",
flexDirection: "column",
overflow: "hidden",
borderTopLeftRadius: 0,
borderBottomLeftRadius: 0,
borderLeft: "0",
marginRight: -drawerWidth,
transition: theme.transitions.create("margin", {
easing: theme.transitions.easing.sharp,
duration: theme.transitions.duration.leavingScreen,
}),
},
mainWrapperShift: {
borderTopRightRadius: 0,
borderBottomRightRadius: 0,
transition: theme.transitions.create("margin", {
easing: theme.transitions.easing.easeOut,
duration: theme.transitions.duration.enteringScreen,
}),
marginRight: 0,
},
}));
const Ticket = () => {
const { user } = useContext(AuthContext);
const { ticketId } = useParams();
const history = useHistory();
const classes = useStyles();
const [drawerOpen, setDrawerOpen] = useState(false);
const [loading, setLoading] = useState(true);
const [contact, setContact] = useState({});
const [ticket, setTicket] = useState({});
const [statusChatEnd, setStatusChatEnd] = useState({})
useEffect(() => {
setLoading(true);
const delayDebounceFn = setTimeout(() => {
const fetchTicket = async () => {
console.log('+++++++++++ ticketId: ', ticketId)
try {
let number
let msg
let contactId
console.log('ticketId: ', ticketId)
console.log('window.location.href): ', window.location.href)
const link = window.location.href.split('/https://wa.me/')
number = link[1].split('?text=')[0]
msg = link[1].split('?text=')[1] || ''
msg = decodeURIComponent(msg);
const { data: data0 } = await api.get("/contacts/", { params: { searchParam: number, pageNumber: "1" }, });
if (data0 && data0.contacts.length > 0) {
console.log('-----> data: ', data0.contacts[0].id)
contactId = data0.contacts[0].id
}
else {
const values = {
name: number,
number: number,
};
const { data: data1 } = await api.post("/contacts", values);
contactId = data1.id
}
const { data: ticket } = await api.post("/tickets", {
contactId: contactId,
userId: user.id,
status: "open",
msg
});
window.location.reload();
history.push(`/tickets/${ticket.id}`);
window.location.reload();
} catch (err) {
console.log('first---------------------->')
setLoading(false);
toastError(err);
history.push(`/tickets`);
}
};
fetchTicket();
}, 500);
return () => clearTimeout(delayDebounceFn);
}, [ticketId, history, user.id]);
useEffect(() => {
const regex = /^[0-9\b]+$/; // Regular expression to match only numbers
if (ticketId && !ticketId.match(regex) || ticketId && ticketId.length > 9 ) return
const socket = openSocket(process.env.REACT_APP_BACKEND_URL);
socket.on("connect", () => socket.emit("joinChatBox", ticketId));
socket.on("ticket", (data) => {
if (data.action === "update") {
setTicket(data.ticket);
}
if (data.action === "delete") {
toast.success("Ticket deleted sucessfully.");
history.push("/tickets");
}
});
socket.on("contact", (data) => {
if (data.action === "update") {
setContact((prevState) => {
if (prevState.id === data.contact?.id) {
return { ...prevState, ...data.contact };
}
return prevState;
});
}
});
return () => {
socket.disconnect();
};
}, [ticketId, history]);
const handleDrawerOpen = () => {
setDrawerOpen(true);
};
const handleDrawerClose = () => {
setDrawerOpen(false);
};
return (
<div className={classes.root} id="drawer-container">
<Paper
variant="outlined"
elevation={0}
className={clsx(classes.mainWrapper, {
[classes.mainWrapperShift]: drawerOpen,
})}
>
<TicketHeader loading={loading}>
<div className={classes.ticketInfo}>
<TicketInfo
contact={contact}
ticket={ticket}
onClick={handleDrawerOpen}
/>
</div>
<div className={classes.ticketActionButtons}>
<TicketActionButtons ticket={ticket} statusChatEnd={statusChatEnd} />
</div>
</TicketHeader>
<ReplyMessageProvider>
<MessagesList
ticketId={ticketId}
isGroup={ticket.isGroup}
></MessagesList>
<MessageInput ticketStatus={ticket.status} />
</ReplyMessageProvider>
</Paper>
<ContactDrawer
open={drawerOpen}
handleDrawerClose={handleDrawerClose}
contact={contact}
loading={loading}
/>
</div>
);
};
export default Ticket;

3
frontend/src/routes/index.js
View File

@ -9,6 +9,7 @@ import Report from "../pages/Report/";
import SchedulesReminder from "../pages/SchedulesReminder/";
import Tickets from "../pages/Tickets/";
import WhatsLink from "../pages/Tickets/WhatsLink";
import Signup from "../pages/Signup/";
import Login from "../pages/Login/";
import Connections from "../pages/Connections/";
@ -35,6 +36,8 @@ const Routes = () => {
<Route exact path="/" component={Dashboard} isPrivate />
<Route exact path="/tickets/:ticketId?" component={Tickets} isPrivate />
<Route exact path="/tickets/https://wa.me/:ticketId?" component={WhatsLink} isPrivate />
<Route exact path="/connections" component={Connections} isPrivate />
<Route exact path="/report" component={Report} isPrivate />