订单进入会话, 获取新会话列表
Lei OT
1 year ago
parent
6e4fc488a7
commit
22cf54f313
@ -1,18 +0,0 @@
|
||||
const initialState = {
|
||||
websocket: null,
|
||||
websocketOpened: null,
|
||||
websocketRetrying: null,
|
||||
websocketRetrytimes: null,
|
||||
|
||||
errors: [], // 错误信息
|
||||
|
||||
conversationsList: [], // 对话列表
|
||||
templates: [],
|
||||
customerOrderProfile: {},
|
||||
|
||||
activeConversations: {}, // 激活的对话的消息列表: { [conversationId]: [] }
|
||||
currentConversation: {}, // 当前对话
|
||||
|
||||
referenceMsg: {},
|
||||
};
|
||||
export default initialState;
|
||||
@ -1,156 +0,0 @@
|
||||
import initialState from '@/records/ConversationState';
|
||||
|
||||
const NAME_SPACE = 'CONVERSATION/';
|
||||
|
||||
const ConversationReducer = (state = initialState, action) => {
|
||||
switch (action.type) {
|
||||
case NAME_SPACE + 'INIT_WEBSOCKET':
|
||||
return { ...state, websocket: action.payload };
|
||||
case NAME_SPACE + 'MODIFY_WEBSOCKET_STATE':
|
||||
return { ...state, websocketOpened: action.payload, };
|
||||
case NAME_SPACE + 'MODIFY_WEBSOCKET_RETRYTIMES':
|
||||
return { ...state, websocketRetrytimes: action.payload, websocketRetrying: action.payload > 0 };
|
||||
|
||||
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 + 'DEL_CONVERSATIONS_ITEM': {
|
||||
const { conversationsList, activeConversations, currentConversation, customerOrderProfile } = state;
|
||||
const targetId = action.payload.sn;
|
||||
const targetIndex = conversationsList.findIndex((ele) => String(ele.sn) === String(targetId));
|
||||
conversationsList.splice(targetIndex, 1);
|
||||
return {
|
||||
...state,
|
||||
conversationsList: [...conversationsList],
|
||||
activeConversations: { ...activeConversations, [`${targetId}`]: [] },
|
||||
currentConversation: {},
|
||||
customerOrderProfile: {},
|
||||
};
|
||||
}
|
||||
|
||||
case NAME_SPACE + 'SET_TEMPLATE_LIST':
|
||||
return { ...state, templates: action.payload };
|
||||
|
||||
case NAME_SPACE + 'SET_CUSTOMER_ORDER_PROFILE':
|
||||
return { ...state, customerOrderProfile: action.payload };
|
||||
|
||||
case NAME_SPACE + 'SET_CURRENT_CONVERSATION': {
|
||||
// 清空未读
|
||||
const { conversationsList } = state;
|
||||
const targetId = action.payload.sn;
|
||||
const targetIndex = conversationsList.findIndex((ele) => String(ele.sn) === String(targetId));
|
||||
targetIndex !== -1 ? conversationsList.splice(targetIndex, 1, {
|
||||
...conversationsList[targetIndex],
|
||||
unread_msg_count: 0,
|
||||
}) : null;
|
||||
|
||||
return { ...state, currentConversation: action.payload, conversationsList: [...conversationsList] };
|
||||
}
|
||||
case NAME_SPACE + 'SET_ACTIVE_CONVERSATIONS': {
|
||||
const { activeConversations } = state;
|
||||
return { ...state, activeConversations: { ...activeConversations, ...action.payload } };
|
||||
}
|
||||
case NAME_SPACE + 'UPDATE_SENT_MESSAGE_ITEM': {
|
||||
console.log('UPDATE_SENT_MESSAGE_ITEM-----------------------------------------------------------------', action);
|
||||
// 更新会话中的消息
|
||||
const { activeConversations, conversationsList, } = state;
|
||||
const message = action.payload;
|
||||
const targetId = message.conversationid;
|
||||
const targetMsgs = (activeConversations[String(targetId)] || []).map((ele) => {
|
||||
// 更新状态
|
||||
// * 已读的不再更新状态, 有时候投递结果在已读之后返回
|
||||
if (ele.id === ele.actionId && ele.actionId === message.actionId) {
|
||||
return { ...ele, id: message.id, status: ele.status === 'read' ? ele.status : message.status, dateString: message.dateString };
|
||||
} else if (ele.id === message.id) {
|
||||
return { ...ele, id: message.id, status: ele.status === 'read' ? ele.status : message.status, dateString: message.dateString };
|
||||
}
|
||||
return ele;
|
||||
});
|
||||
// 显示会话中其他客户端发送的消息
|
||||
const targetMsgsIds = targetMsgs.map((ele) => ele.id);
|
||||
if ( ! targetMsgsIds.includes(message.id)) {
|
||||
targetMsgs.push(message);
|
||||
}
|
||||
|
||||
// 更新列表的时间
|
||||
if (message.type !== 'error') {
|
||||
const targetIndex = conversationsList.findIndex((ele) => String(ele.sn) === String(targetId));
|
||||
conversationsList.splice(targetIndex, 1, {
|
||||
...conversationsList[targetIndex],
|
||||
last_received_time: message.date,
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
...state,
|
||||
activeConversations: { ...state.activeConversations, [String(targetId)]: targetMsgs },
|
||||
conversationsList: [...conversationsList],
|
||||
};
|
||||
}
|
||||
case NAME_SPACE + 'RECEIVED_MESSAGE_LIST': {
|
||||
const { targetId, data } = action.payload;
|
||||
return {
|
||||
...state,
|
||||
activeConversations: { ...state.activeConversations, [String(targetId)]: data },
|
||||
};
|
||||
}
|
||||
case NAME_SPACE + 'SENT_NEW_MESSAGE':
|
||||
case NAME_SPACE + 'RECEIVED_NEW_MESSAGE': {
|
||||
const { activeConversations, conversationsList, currentConversation } = state;
|
||||
const { targetId, message } = action.payload;
|
||||
const targetMsgs = activeConversations[String(targetId)] || [];
|
||||
const targetIndex = conversationsList.findIndex((ele) => String(ele.sn) === String(targetId));
|
||||
const newConversation =
|
||||
targetId !== -1
|
||||
? {
|
||||
...conversationsList[targetIndex],
|
||||
last_received_time: message.date,
|
||||
unread_msg_count:
|
||||
String(targetId) !== String(currentConversation.sn) && message.sender !== 'me'
|
||||
? conversationsList[targetIndex].unread_msg_count + 1
|
||||
: conversationsList[targetIndex].unread_msg_count,
|
||||
}
|
||||
: {
|
||||
...message,
|
||||
sn: targetId,
|
||||
last_received_time: message.date,
|
||||
unread_msg_count: message.sender === 'me' ? 0 : 1,
|
||||
};
|
||||
conversationsList.splice(targetIndex, 1);
|
||||
conversationsList.unshift(newConversation);
|
||||
return {
|
||||
...state,
|
||||
activeConversations: { ...activeConversations, [String(targetId)]: [...targetMsgs, message] },
|
||||
conversationsList: [...conversationsList],
|
||||
currentConversation: {
|
||||
...state.currentConversation,
|
||||
last_received_time: String(targetId) === String(currentConversation.sn) ? message.date : currentConversation.last_received_time,
|
||||
},
|
||||
};
|
||||
}
|
||||
case NAME_SPACE + 'SET_REFERENCE_MSG':
|
||||
return {...state, referenceMsg: action.payload};
|
||||
case NAME_SPACE + 'ADD_ERROR': {
|
||||
console.log('add error', state.errors, action.payload);
|
||||
const prelist = state.errors || [];
|
||||
return { ...state, errors: [...prelist, action.payload] };
|
||||
}
|
||||
default:
|
||||
// throw new Error(`Unknown action: ${action.type}`);
|
||||
return state;
|
||||
}
|
||||
};
|
||||
export default ConversationReducer;
|
||||
@ -1,12 +0,0 @@
|
||||
import {createContext, useContext} from 'react';
|
||||
|
||||
export const ConversationContext = createContext();
|
||||
|
||||
export const useConversationContext = () => useContext(ConversationContext);
|
||||
|
||||
|
||||
export const ConversationStateContext = createContext();
|
||||
export const ConversationDispatchContext = createContext();
|
||||
|
||||
export const useConversationState = () => useContext(ConversationStateContext);
|
||||
export const useConversationDispatch = () => useContext(ConversationDispatchContext);
|
||||
@ -1,102 +0,0 @@
|
||||
import { useContext, useReducer, useEffect } from 'react';
|
||||
import { ConversationStateContext, ConversationDispatchContext } from '@/stores/ConversationContext';
|
||||
import ConversationReducer from '@/reducers/ConversationReducer';
|
||||
import {
|
||||
initWebsocket,
|
||||
updateWebsocketState,
|
||||
updateWebsocketRetrytimes,
|
||||
addError,
|
||||
fetchConversationsList,
|
||||
fetchTemplates,
|
||||
receivedConversationList,
|
||||
receivedTemplates,
|
||||
updateMessageItem,
|
||||
receivedNewMessage,
|
||||
} from '@/actions/ConversationActions';
|
||||
import initialState from '@/records/ConversationState';
|
||||
|
||||
import { AuthContext } from '@/stores/AuthContext';
|
||||
|
||||
import { RealTimeAPI } from '@/lib/realTimeAPI';
|
||||
import { receivedMsgTypeMapped } from '@/lib/msgUtils';
|
||||
import { isEmpty } from '@/utils/utils';
|
||||
|
||||
// const WS_URL = 'ws://202.103.68.144:8888/whatever/';
|
||||
// const WS_URL = 'ws://120.79.9.217:10022/whatever/';
|
||||
const WS_URL = 'wss://p9axztuwd7x8a7.mycht.cn/whatsapp_callback'; // prod:
|
||||
|
||||
const ConversationProvider = ({ children }) => {
|
||||
const { loginUser } = useContext(AuthContext);
|
||||
const { userId } = loginUser;
|
||||
|
||||
const [state, dispatch] = useReducer(ConversationReducer, { ...initialState, websocket: null });
|
||||
|
||||
console.log('ConversationProvider', state, dispatch);
|
||||
|
||||
// useEffect(() => {
|
||||
// console.log('invoke provider');
|
||||
// const realtimeAPI = new RealTimeAPI(
|
||||
// {
|
||||
// url: `${WS_URL}?opisn=${userId || ''}&_spam=${Date.now().toString()}`,
|
||||
// protocol: 'WhatsApp',
|
||||
// },
|
||||
// () => {dispatch(updateWebsocketState(true)); dispatch(updateWebsocketRetrytimes(0));},
|
||||
// () => dispatch(updateWebsocketState(false)),
|
||||
// (n) => dispatch(updateWebsocketRetrytimes(n))
|
||||
// );
|
||||
|
||||
// realtimeAPI.onError(() => dispatch(addError('Error')));
|
||||
// realtimeAPI.onMessage(handleMessage);
|
||||
// realtimeAPI.onCompletion(() => dispatch(addError('Connection broken')));
|
||||
|
||||
// dispatch(initWebsocket(realtimeAPI));
|
||||
// return () => {
|
||||
// realtimeAPI.disconnect();
|
||||
// };
|
||||
// }, []);
|
||||
|
||||
// useEffect(() => {
|
||||
// fetchConversationsList({ opisn: userId }).then((data) => {
|
||||
// dispatch(receivedConversationList(data));
|
||||
// });
|
||||
|
||||
// fetchTemplates().then((data) => dispatch(receivedTemplates(data)));
|
||||
|
||||
// return () => {};
|
||||
// }, []);
|
||||
const handleMessage = (data) => {
|
||||
console.log('handleMessage------------------');
|
||||
console.log(data);
|
||||
const { errcode, errmsg, result } = data;
|
||||
|
||||
if (!result) {
|
||||
return false;
|
||||
}
|
||||
let resultType = result?.action || result.type;
|
||||
if (errcode !== 0) {
|
||||
// addError('Error Connecting to Server');
|
||||
resultType = 'error';
|
||||
}
|
||||
console.log(resultType, 'result.type');
|
||||
const msgObj = receivedMsgTypeMapped[resultType].getMsg(result);
|
||||
const msgRender = receivedMsgTypeMapped[resultType].contentToRender(msgObj);
|
||||
const msgUpdate = receivedMsgTypeMapped[resultType].contentToUpdate(msgObj);
|
||||
console.log('msgRender msgUpdate', msgRender, msgUpdate);
|
||||
if (['whatsapp.message.updated', 'message', 'error'].includes(resultType)) {
|
||||
dispatch(updateMessageItem(msgUpdate));
|
||||
// return false;
|
||||
}
|
||||
if (!isEmpty(msgRender)) {
|
||||
dispatch(receivedNewMessage(msgRender.conversationid, msgRender));
|
||||
}
|
||||
console.log('handleMessage*******************');
|
||||
};
|
||||
// return <ConversationContext.Provider value={{ ...state, dispatch }}>{children}</ConversationContext.Provider>;
|
||||
return (
|
||||
<ConversationStateContext.Provider value={{ ...state }}>
|
||||
<ConversationDispatchContext.Provider value={dispatch}>{children}</ConversationDispatchContext.Provider>
|
||||
</ConversationStateContext.Provider>
|
||||
);
|
||||
};
|
||||
|
||||
export default ConversationProvider;
|
||||
Loading…
Reference in New Issue