订单进入会话, 获取新会话列表

dev/chat
Lei OT 1 year ago
parent e466d3d414
commit 0ef3a4a2b3

@ -30,6 +30,13 @@ export const fetchCustomerProfile = async (colisn) => {
return data; return data;
}; };
export const fetchOrderConversationsList = async (params) => {
const { errcode, result: data } = await fetchJSON(`${API_HOST}/getorderconversation`, params);
if (errcode !== 0) return [];
const list = data.map((ele) => ({ ...ele, customer_name: ele.whatsapp_name.trim() }));
return list;
};
export const fetchConversationItemClose = async (body) => { export const fetchConversationItemClose = async (body) => {
const getParams = body ? new URLSearchParams(body).toString() : ''; const getParams = body ? new URLSearchParams(body).toString() : '';
const { result } = await fetchJSON(`${API_HOST}/closeconversation?${getParams}`); const { result } = await fetchJSON(`${API_HOST}/closeconversation?${getParams}`);

@ -244,6 +244,16 @@ export const parseRenderMessageItem = (msg) => {
whatsapp_name: msg?.customerProfile?.name || '', whatsapp_name: msg?.customerProfile?.name || '',
whatsapp_phone_number: msg.from, whatsapp_phone_number: msg.from,
whatsapp_msg_type: msg.type, whatsapp_msg_type: msg.type,
...(isEmpty(msg.context)
? {}
: {
reply: {
message: `${msg.context.id}`, // todo: msg.context.text?.body || msg.context.text,
title: msg?.customerProfile?.name || msg.from,
titleColor: "#128c7e",
},
origin: msg.context,
}),
}; };
}; };
/** /**

@ -122,6 +122,9 @@ export const conversationSlice = (set, get) => ({
conversationsList: [], conversationsList: [],
currentConversation: {}, currentConversation: {},
/**
* @deprecated
*/
setConversationsList: (conversationsList) => { setConversationsList: (conversationsList) => {
const conversationsMapped = conversationsList.reduce((r, v) => ({ ...r, [`${v.sn}`]: [] }), {}); const conversationsMapped = conversationsList.reduce((r, v) => ({ ...r, [`${v.sn}`]: [] }), {});
return set({ conversationsList, activeConversations: conversationsMapped }); return set({ conversationsList, activeConversations: conversationsMapped });
@ -251,10 +254,10 @@ export const useConversationStore = create(devtools((set, get) => ({
// side effects // side effects
fetchInitialData: async (userId) => { fetchInitialData: async (userId) => {
olog('fetch init'); olog('fetch init');
const { setConversationsList, setTemplates } = get(); const { addToConversationList, setTemplates } = get();
const conversationsList = await fetchConversationsList({ opisn: userId }); const conversationsList = await fetchConversationsList({ opisn: userId });
setConversationsList(conversationsList); addToConversationList(conversationsList);
const templates = await fetchTemplates(); const templates = await fetchTemplates();
setTemplates(templates); setTemplates(templates);

@ -62,7 +62,7 @@ const ChatWindow = () => {
<Messages /> <Messages />
</div> </div>
</Content> </Content>
<Footer className='ant-layout-sider-light p-1'> <Footer className='ant-layout-sider-light p-0'>
<InputComposer /> <InputComposer />
</Footer> </Footer>
</Layout> </Layout>

@ -1,10 +1,10 @@
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { useParams, useNavigate } from 'react-router-dom'; import { useParams, useNavigate, useLocation } from 'react-router-dom';
import { Button, Dropdown } from 'antd'; import { Button, Dropdown } from 'antd';
import { MoreOutlined } from '@ant-design/icons'; import { MoreOutlined } from '@ant-design/icons';
import { useAuthContext } from '@/stores/AuthContext'; import { useAuthContext } from '@/stores/AuthContext';
import { import {
fetchConversationsList, fetchOrderConversationsList,
fetchConversationItemClose, fetchConversationItemClose,
fetchMessages, fetchMessages,
} from '@/actions/ConversationActions'; } from '@/actions/ConversationActions';
@ -44,6 +44,8 @@ const CDropdown = (props) => {
* [] * []
*/ */
const Conversations = () => { const Conversations = () => {
const { state: orderRow } = useLocation()
const { coli_guest_WhatsApp } = orderRow || {};
const { order_sn } = useParams(); const { order_sn } = useParams();
const navigate = useNavigate(); const navigate = useNavigate();
const { loginUser } = useAuthContext(); const { loginUser } = useAuthContext();
@ -60,7 +62,7 @@ const Conversations = () => {
title: item.whatsapp_name.trim() || item.whatsapp_phone_number, title: item.whatsapp_name.trim() || item.whatsapp_phone_number,
// subtitle: item.whatsapp_phone_number, // subtitle: item.whatsapp_phone_number,
// subtitle: item.lastMessage, // subtitle: item.lastMessage,
date: item.last_received_time, // last_send_time // todo: GMT+8 date: item.last_received_time, // last_send_time
unread: item.unread_msg_count, unread: item.unread_msg_count,
// showMute: true, // showMute: true,
// muted: false, // muted: false,
@ -76,21 +78,23 @@ const Conversations = () => {
return () => {}; return () => {};
}, [conversationsList, currentConversation]); }, [conversationsList, currentConversation]);
const [shouldFetchCList, setShouldFetchCList] = useState(true);
useEffect(() => { useEffect(() => {
if (order_sn) { if (order_sn && shouldFetchCList) {
// getOrderConversationList(order_sn); getOrderConversationList(order_sn);
// debug: reset chat window
setCurrentConversation({ sn: '', customer_name: '', coli_sn: order_sn });
} }
return () => {}; return () => {};
}, [order_sn]); }, [order_sn, shouldFetchCList]);
const getOrderConversationList = async (colisn) => { const getOrderConversationList = async (colisn) => {
const data = await fetchConversationsList({ opisn: userId, colisn }); const { whatsapp_phone_number } = switchToC;
const whatsappID = coli_guest_WhatsApp || whatsapp_phone_number || '';
const data = await fetchOrderConversationsList({ opisn: userId, colisn: colisn, whatsappid: whatsappID });
if (!isEmpty(data)) { if (!isEmpty(data)) {
addToConversationList(data); addToConversationList(data);
switchConversation(data[0]); const ifCurrent = data.findIndex((item) => item.sn === currentConversation.sn);
switchConversation(data[ifCurrent === -1 ? 0 : ifCurrent]);
} else { } else {
// reset chat window // reset chat window
setCurrentConversation({ sn: '', customer_name: '', coli_sn: order_sn }); setCurrentConversation({ sn: '', customer_name: '', coli_sn: order_sn });
@ -109,31 +113,24 @@ const Conversations = () => {
setCurrentConversation(item); setCurrentConversation(item);
}; };
const [switchToC, setSwitchToC] = useState({});
const onSwitchConversation = (item) => { const onSwitchConversation = (item) => {
if (item.coli_sn) { if (item.coli_sn) {
navigate(`/order/chat/${item.coli_sn}`, { replace: true }); navigate(`/order/chat/${item.coli_sn}`, { replace: true });
setSwitchToC(item);
setShouldFetchCList(false);
} else { } else {
navigate(`/order/chat`, { replace: true }); navigate(`/order/chat`, { replace: true });
} }
switchConversation(item); switchConversation(item);
}; };
// const handleConversationItemClose = async (item) => {
// console.log('invoke close', item);
// const data = await postConversationItemClose({ conversationid: item.sn, opisn: userId });
// };
return ( return (
<> <>
<ChatList <ChatList
className=' overflow-x-hidden' className=' overflow-x-hidden'
dataSource={chatlist} dataSource={chatlist}
onClick={(item) => onSwitchConversation(item)} onClick={(item) => onSwitchConversation(item)}
// onContextMenu={(item, i, e) => {
// console.log(item, i, e);
// return ( <p>ppp</p> )
// }}
// onClickMute={handleConversationItemClose}
/> />
</> </>
); );

@ -14,7 +14,7 @@ export default {
gossip: '#dcf8c6', gossip: '#dcf8c6',
bg: '#ece5dd', // '#efeae2' '#eae6df' '#d1d7db' bg: '#ece5dd', // '#efeae2' '#eae6df' '#d1d7db'
bgdark: '#0b141a', bgdark: '#0b141a',
me: '#ccd5ae', me: '#ccd5ae', // '#d9fdd3'
}, },
'primary': '#1ba784', 'primary': '#1ba784',
}, },

Loading…
Cancel
Save