diff --git a/src/actions/ConversationActions.js b/src/actions/ConversationActions.js index 1439b3d..1c155cf 100644 --- a/src/actions/ConversationActions.js +++ b/src/actions/ConversationActions.js @@ -50,19 +50,22 @@ export const receivedConversationList = (data) => { }; export const addConversationList = (data) => { return { - type: NAME_SPACE + 'ADD_CONVERSATIONS', + type: NAME_SPACE + 'ADD_TO_CONVERSATIONS_LIST', payload: data, }; }; -export const updateConversationListItemNew = (message) => ({ - type: NAME_SPACE + 'UPDATE_CONVERSATION_LIST_ITEM_NEW', - payload: message, -}); +// export const updateConversationListItemNew = (message) => ({ +// type: NAME_SPACE + 'UPDATE_CONVERSATION_LIST_ITEM_NEW', +// payload: message, +// }); export const receivedCustomerProfile = (data) => ({ type: NAME_SPACE + 'SET_CUSTOMER_ORDER_PROFILE', payload: data, }); +/** + * @deprecated 在更新list时操作 + */ export const setActiveConversations = (obj) => ({ type: NAME_SPACE + 'SET_ACTIVE_CONVERSATIONS', payload: obj, diff --git a/src/lib/msgUtils.js b/src/lib/msgUtils.js index a4a6629..7d51e73 100644 --- a/src/lib/msgUtils.js +++ b/src/lib/msgUtils.js @@ -65,12 +65,25 @@ const whatsappMsgMapped = { console.log('getMsg', result); return isEmpty(result?.whatsappMessage) ? null : { ...result.whatsappMessage, conversationid: result.conversationid }; }, - contentToRender: () => null, // * 仅更新消息状态, 没有输出 - contentToUpdate: (msgcontent) => ({ ...msgcontent, id: msgcontent.wamid, status: msgStatusRenderMapped[(msgcontent?.status || 'failed')] }), + contentToRender: (contentObj) => { + if ((contentObj?.status === 'failed' )) { + contentObj = { + ...contentObj, + type: 'error', + text: {body: `❌ Message failed to send.` }, // contentObj.errorMessage + id: contentObj.id, + wamid: contentObj.id, + }; + return parseRenderMessageItem(contentObj); + } + // * 仅更新消息状态, 没有输出 + return null; + }, + contentToUpdate: (msgcontent) => ({ ...msgcontent, id: msgcontent.wamid, status: msgStatusRenderMapped[(msgcontent?.status || 'failed')], dateString: msgcontent.status==='failed' ? '发送失败 ❌' : '', }), }, }; export const msgStatusRenderMapped = { - 'accepted': 'sent', + 'accepted': 'waiting', // 'sent', // 接口的发送请求 'sent': 'sent', 'delivered': 'received', 'read': 'read', @@ -87,7 +100,7 @@ export const receivedMsgTypeMapped = { actionId: msgcontent.actionId, id: msgcontent.wamid, status: msgStatusRenderMapped[(msgcontent?.status || 'failed')], - conversationid: msgcontent.actionId.split('.')[0], // msgcontent.conversation.id, + conversationid: msgcontent.actionId.split('.')[0], // msgcontent.conversation.sn, }), }, 'error': { diff --git a/src/reducers/ConversationReducer.js b/src/reducers/ConversationReducer.js index 641b210..f16ae21 100644 --- a/src/reducers/ConversationReducer.js +++ b/src/reducers/ConversationReducer.js @@ -7,10 +7,22 @@ const ConversationReducer = (state = initialState, action) => { case NAME_SPACE + 'INIT_WEBSOCKET': return { ...state, websocket: action.payload }; - case NAME_SPACE + 'SET_CONVERSATION_LIST': - return { ...state, conversationsList: action.payload }; - case NAME_SPACE + 'ADD_CONVERSATIONS': - return { ...state, conversationsList: [...action.payload, ...state.conversationsList] }; + case NAME_SPACE + 'SET_CONVERSATION_LIST':{ + const conversationsMapped = action.payload.reduce((r, v) => ({ ...r, [`${v.sn}`]: [] }), {}); + return { ...state, conversationsList: action.payload, activeConversations: conversationsMapped }; + } + case NAME_SPACE + 'ADD_TO_CONVERSATIONS_LIST':{ + const { activeConversations } = state; + const conversationsIds = Object.keys(activeConversations); + const newConversations = action.payload.filter((conversation) => !conversationsIds.includes(`${conversation.sn}`)); + const newConversationsMapped = newConversations.reduce((r, v) => ({ ...r, [`${v.sn}`]: [] }), {}); + + return { + ...state, + conversationsList: [...newConversations, ...state.conversationsList], + activeConversations: { ...activeConversations, ...newConversationsMapped }, + }; + } case NAME_SPACE + 'SET_TEMPLATE_LIST': return { ...state, templates: action.payload }; diff --git a/src/views/Conversations/Components/ConversationsList.jsx b/src/views/Conversations/Components/ConversationsList.jsx index 33c29e4..05c0a71 100644 --- a/src/views/Conversations/Components/ConversationsList.jsx +++ b/src/views/Conversations/Components/ConversationsList.jsx @@ -3,7 +3,7 @@ import { useParams, useNavigate } from "react-router-dom"; import { List, Avatar, Flex } from 'antd'; import { useAuthContext } from '@/stores/AuthContext'; import { useConversationState, useConversationDispatch } from '@/stores/ConversationContext'; -import { fetchCustomerProfile, receivedCustomerProfile, setCurrentConversation, addConversationList, setActiveConversations, postConversationItemClose } from '@/actions/ConversationActions' +import { fetchCustomerProfile, receivedCustomerProfile, setCurrentConversation, addConversationList, postConversationItemClose } from '@/actions/ConversationActions' import { ChatList } from 'react-chat-elements'; import { isEmpty, pick } from '@/utils/utils'; import { v4 as uuid } from 'uuid'; @@ -56,11 +56,9 @@ const Conversations = (() => { if (isEmpty(data)) { return false; } - if (!isEmpty(data.conversation)) { + if (!isEmpty(data.conversations)) { dispatch(addConversationList(data.conversations)); - dispatch(setCurrentConversation(data.conversation[0])); - const thisCMapped = data.conversation.reduce((r, v) => ({ ...r, [`${v.sn}`]: [] }), {}); - dispatch(setActiveConversations(thisCMapped)); + dispatch(setCurrentConversation(data.conversations[0])); } else { // reset chat window if (isEmpty(data.contact?.[0]?.whatsapp_phone_number)) { @@ -80,7 +78,6 @@ const Conversations = (() => { 'customer_name': data.contact[0].name, }; dispatch(addConversationList([newChat])); - dispatch(setActiveConversations({ [`${newChat.sn}`]: []})); const newCurrent = pick(newChat, ['sn', 'coli_sn', 'whatsapp_phone_number', 'whatsapp_name', 'customer_name']); dispatch(setCurrentConversation(newCurrent)); } @@ -93,10 +90,10 @@ const Conversations = (() => { }; const onSwitchConversation = (item) => { - switchConversation(item); if (item.coli_sn) { navigate(`/order/chat/${item.coli_sn}`, { replace: true }); } + switchConversation(item); } const handleConversationItemClose = async (item) => { diff --git a/src/views/Conversations/Components/InputBox.jsx b/src/views/Conversations/Components/InputBox.jsx index efc9acd..f5466ec 100644 --- a/src/views/Conversations/Components/InputBox.jsx +++ b/src/views/Conversations/Components/InputBox.jsx @@ -21,7 +21,7 @@ const InputBox = () => { const invokeSendMessage = (msgObj) => { console.log('sendMessage------------------', msgObj); const contentToSend = sentMsgTypeMapped[msgObj.type].contentToSend(msgObj); - websocket.sendMessage({ ...contentToSend, opi_sn: userId }); + websocket.sendMessage({ ...contentToSend, opi_sn: userId, coli_sn: currentConversation.coli_sn }); const contentToRender = sentMsgTypeMapped[msgObj.type].contentToRender(msgObj); console.log(contentToRender, 'contentToRender sendMessage------------------'); dispatch(sentNewMessage(contentToRender)); @@ -34,7 +34,7 @@ const InputBox = () => { text: textContent, sender: 'me', to: currentConversation.whatsapp_phone_number, - id: `${currentConversation.id}.${uuid()}`, // Date.now().toString(16), + id: `${currentConversation.sn}.${uuid()}`, // Date.now().toString(16), date: new Date(), status: 'waiting', }; @@ -49,7 +49,7 @@ const InputBox = () => { const msgObj = { type: 'whatsappTemplate', to: currentConversation.whatsapp_phone_number, - id: `${currentConversation.id}.${uuid()}`, + id: `${currentConversation.sn}.${uuid()}`, date: new Date(), status: 'waiting', statusTitle: 'Ready to send', diff --git a/src/views/Conversations/ConversationProvider.jsx b/src/views/Conversations/ConversationProvider.jsx index a6d6bd7..e11abae 100644 --- a/src/views/Conversations/ConversationProvider.jsx +++ b/src/views/Conversations/ConversationProvider.jsx @@ -8,7 +8,6 @@ import { fetchTemplates, receivedConversationList, receivedTemplates, - setActiveConversations, updateMessageItem, receivedNewMessage, } from '@/actions/ConversationActions'; @@ -50,9 +49,7 @@ const ConversationProvider = ({ children }) => { useEffect(() => { fetchConversationsList(userId).then((data) => { console.log(data, 'llllllllllllllllllllllll'); - const dataMapped = data.reduce((r, v) => ({ ...r, [`${v.sn}`]: [] }), {}); dispatch(receivedConversationList(data)); - dispatch(setActiveConversations(dataMapped)); }); // todo: 和刷新订单会话页面有冲突 fetchTemplates().then((data) => dispatch(receivedTemplates(data)));