|
|
|
@ -5,8 +5,7 @@ import { SendOutlined, MessageOutlined, SmileOutlined, PictureOutlined, CommentO
|
|
|
|
|
import { useAuthContext } from '@/stores/AuthContext';
|
|
|
|
|
import { useConversationState, useConversationDispatch } from '@/stores/ConversationContext';
|
|
|
|
|
import {
|
|
|
|
|
fetchCustomerProfile,
|
|
|
|
|
receivedCustomerProfile,
|
|
|
|
|
fetchConversationsList,
|
|
|
|
|
setCurrentConversation,
|
|
|
|
|
addConversationList, delConversationitem,
|
|
|
|
|
fetchConversationItemClose,
|
|
|
|
@ -16,38 +15,31 @@ import { ChatList, } from 'react-chat-elements';
|
|
|
|
|
import { isEmpty, pick } from '@/utils/utils';
|
|
|
|
|
import { v4 as uuid } from 'uuid';
|
|
|
|
|
|
|
|
|
|
const CDropdown = () => {
|
|
|
|
|
const { loginUser } = useAuthContext();
|
|
|
|
|
const { userId } = loginUser;
|
|
|
|
|
const { currentConversation } = useConversationState();
|
|
|
|
|
const CDropdown = (props) => {
|
|
|
|
|
const dispatch = useConversationDispatch();
|
|
|
|
|
const handleConversationItemClose = async (item) => {
|
|
|
|
|
console.log('invoke close', {conversationid: item.sn, opisn: userId });
|
|
|
|
|
// await fetchConversationItemClose({ conversationid: item.sn, opisn: userId });
|
|
|
|
|
dispatch(delConversationitem(item));
|
|
|
|
|
|
|
|
|
|
const handleConversationItemClose = async () => {
|
|
|
|
|
await fetchConversationItemClose({ conversationid: props.sn, opisn: props.opi_sn });
|
|
|
|
|
dispatch(delConversationitem(props));
|
|
|
|
|
};
|
|
|
|
|
return (
|
|
|
|
|
<Dropdown key={'more-action'}
|
|
|
|
|
<Dropdown
|
|
|
|
|
key={'more-action'}
|
|
|
|
|
trigger={'click'}
|
|
|
|
|
menu={{
|
|
|
|
|
items: [
|
|
|
|
|
{
|
|
|
|
|
key: 'close',
|
|
|
|
|
danger: true,
|
|
|
|
|
label: '关闭会话',
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
onClick: ({ key }) => {
|
|
|
|
|
switch (key) {
|
|
|
|
|
items: [{ key: 'close', danger: true, label: '关闭会话' }],
|
|
|
|
|
onClick: (e) => {
|
|
|
|
|
e.domEvent.stopPropagation();
|
|
|
|
|
switch (e.key) {
|
|
|
|
|
case 'close':
|
|
|
|
|
return handleConversationItemClose(currentConversation);
|
|
|
|
|
return handleConversationItemClose();
|
|
|
|
|
|
|
|
|
|
default:
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
}}>
|
|
|
|
|
<Button key={'More'} type='text' title='More' className=' rounded-none text-gray-400' icon={<MoreOutlined />} size={'middle'} onClick={e => e.stopPropagation() } />
|
|
|
|
|
<Button key={'More'} type='text' title='More' className=' rounded-none text-gray-400' icon={<MoreOutlined />} size={'middle'} onClick={(e) => e.stopPropagation()} />
|
|
|
|
|
</Dropdown>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
@ -81,7 +73,7 @@ const Conversations = () => {
|
|
|
|
|
// statusColorType: 'badge',
|
|
|
|
|
// statusText: 'online',
|
|
|
|
|
className: String(item.sn) === String(currentConversation.sn) ? '__active text-primary underline bg-whatsapp-me ' : '',
|
|
|
|
|
customStatusComponents: [CDropdown],
|
|
|
|
|
customStatusComponents: [() => CDropdown(item)],
|
|
|
|
|
}))
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
@ -90,59 +82,35 @@ const Conversations = () => {
|
|
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
if (order_sn) {
|
|
|
|
|
// getCustomerProfile(order_sn);
|
|
|
|
|
// reset chat window
|
|
|
|
|
dispatch(setCurrentConversation({ sn: '', customer_name: '', coli_sn: order_sn }));
|
|
|
|
|
getOrderConversationList(order_sn);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return () => {};
|
|
|
|
|
}, [order_sn]);
|
|
|
|
|
|
|
|
|
|
const getCustomerProfile = async (colisn) => {
|
|
|
|
|
const data = await fetchCustomerProfile(colisn);
|
|
|
|
|
dispatch(receivedCustomerProfile(data));
|
|
|
|
|
if (isEmpty(data)) {
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
if (!isEmpty(data.conversations)) {
|
|
|
|
|
dispatch(addConversationList(data.conversations));
|
|
|
|
|
dispatch(setCurrentConversation(data.conversations[0]));
|
|
|
|
|
const getOrderConversationList = async (colisn) => {
|
|
|
|
|
const data = await fetchConversationsList({ opisn: userId, colisn });
|
|
|
|
|
if (!isEmpty(data)) {
|
|
|
|
|
dispatch(addConversationList(data));
|
|
|
|
|
switchConversation(data[0]);
|
|
|
|
|
// dispatch(setCurrentConversation(data[0]));
|
|
|
|
|
} else {
|
|
|
|
|
// reset chat window
|
|
|
|
|
if (isEmpty(data.contact?.[0]?.whatsapp_phone_number)) {
|
|
|
|
|
dispatch(setCurrentConversation({ sn: '', customer_name: '', coli_sn: '' }));
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
// 加入新会话
|
|
|
|
|
const newChat = {
|
|
|
|
|
'sn': uuid(),
|
|
|
|
|
// 'opi_sn': 354,
|
|
|
|
|
'coli_sn': colisn,
|
|
|
|
|
'whatsapp_phone_number': data.contact[0].whatsapp_phone_number,
|
|
|
|
|
'last_received_time': '',
|
|
|
|
|
'last_send_time': '',
|
|
|
|
|
'unread_msg_count': 0,
|
|
|
|
|
'whatsapp_name': data.contact[0].name,
|
|
|
|
|
'customer_name': data.contact[0].name,
|
|
|
|
|
};
|
|
|
|
|
dispatch(addConversationList([newChat]));
|
|
|
|
|
const newCurrent = pick(newChat, ['sn', 'coli_sn', 'whatsapp_phone_number', 'whatsapp_name', 'customer_name']);
|
|
|
|
|
dispatch(setCurrentConversation(newCurrent));
|
|
|
|
|
dispatch(setCurrentConversation({ sn: '', customer_name: '', coli_sn: order_sn }));
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
const switchConversation = async (item) => {
|
|
|
|
|
if (String(item.sn) === String(currentConversation.sn)) {
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
dispatch(setCurrentConversation(item));
|
|
|
|
|
console.log('invoke switch');
|
|
|
|
|
const messagesList = activeConversations[`${item.sn}`] || [];
|
|
|
|
|
if (isEmpty(messagesList)) {
|
|
|
|
|
const data = await fetchMessages({ opisn: userId, whatsappid: item.whatsapp_phone_number });
|
|
|
|
|
dispatch(receivedMessageList(item.sn, data));
|
|
|
|
|
}
|
|
|
|
|
if (isEmpty(item.coli_sn) || item.coli_sn === '0') {
|
|
|
|
|
dispatch(receivedCustomerProfile({}));
|
|
|
|
|
if (String(item.sn) === String(currentConversation.sn)) {
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
dispatch(setCurrentConversation(item));
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const onSwitchConversation = (item) => {
|
|
|
|
|