diff --git a/src/actions/ConversationActions.js b/src/actions/ConversationActions.js index 7908463..06618fa 100644 --- a/src/actions/ConversationActions.js +++ b/src/actions/ConversationActions.js @@ -1,6 +1,6 @@ import { groupBy, pick, sortArrayByOrder } from '@/utils/commons'; -import { fetchJSON, postJSON } from '@/utils/request' +import { fetchJSON, postJSON, postForm } from '@/utils/request' import { parseRenderMessageList } from '@/channel/whatsappUtils'; import { API_HOST } from '@/config'; import { isEmpty } from '@/utils/commons'; @@ -70,8 +70,20 @@ export const fetchConversationItemClose = async (body) => { * @param {object} body { phone_number, name } */ export const postNewConversationItem = async (body) => { - const { errcode, result } = await postJSON(`${API_HOST}/newconversation`, body); - return errcode !== 0 ? {} : result; + const formData = new FormData(); + Object.keys(body).forEach(function (key) { + formData.append(key, body[key]); + }); + const { errcode, result } = await postForm(`${API_HOST}/new_conversation`, formData); + if (errcode !== 0) { + return {}; + } + const resultItem = result?.[0] || {}; + return { + ...resultItem, + customer_name: `${resultItem.whatsapp_name || ''}`.trim(), + whatsapp_name: `${resultItem.whatsapp_name || ''}`.trim(), + }; }; /** @@ -86,6 +98,7 @@ export const fetchCleanUnreadMsgCount = async (params) => { * 标记未未读 * @param {object} body conversationItem: { sn, ... } */ +export const UNREAD_MARK = 999; export const fetchConversationItemUnread = async (body) => { const { errcode, result } = await fetchJSON(`${API_HOST}/set_state_unread`, body); return errcode !== 0 ? {} : result; diff --git a/src/stores/ConversationStore.js b/src/stores/ConversationStore.js index 66dcbe2..ea3ce14 100644 --- a/src/stores/ConversationStore.js +++ b/src/stores/ConversationStore.js @@ -178,7 +178,7 @@ const conversationSlice = (set, get) => ({ const withoutNew = conversationsList.filter((item) => !newListIds.includes(`${item.sn}`)); const mergedList = [...newList, ...withoutNew]; - const refreshTotalNotify = mergedList.reduce((r, c) => r+c.unread_msg_count, 0); + const refreshTotalNotify = mergedList.reduce((r, c) => r+(c.unread_msg_count === 999 ? 0 : c.unread_msg_count), 0); return set((state) => ({ conversationsList: mergedList, @@ -237,7 +237,7 @@ const messageSlice = (set, get) => ({ totalNotify: 0, msgListLoading: false, activeConversations: {}, - refreshTotalNotify: () => set((state) => ({ totalNotify: state.conversationsList.reduce((r, c) => r+c.unread_msg_count, 0) })), + refreshTotalNotify: () => set((state) => ({ totalNotify: state.conversationsList.reduce((r, c) => r+(c.unread_msg_count === 999 ? 0 : c.unread_msg_count), 0) })), setMsgLoading: (msgListLoading) => set({ msgListLoading }), receivedMessageList: (conversationid, msgList) => set((state) => ({ diff --git a/src/views/Conversations/Online/ConversationsList.jsx b/src/views/Conversations/Online/ConversationsList.jsx index 457440e..d5f9cf8 100644 --- a/src/views/Conversations/Online/ConversationsList.jsx +++ b/src/views/Conversations/Online/ConversationsList.jsx @@ -2,7 +2,7 @@ import { useEffect, useState, useRef } from 'react'; import { useParams, useNavigate, useLocation } from 'react-router-dom'; import { Dropdown, Input, Button, Empty, Tooltip, Tag, Select } from 'antd'; import { PlusOutlined, WhatsAppOutlined, LoadingOutlined, HistoryOutlined, FireOutlined, MessageFilled, FilterOutlined, PlusSquareOutlined } from '@ant-design/icons'; -import { fetchConversationsList, fetchOrderConversationsList, fetchConversationItemClose, fetchConversationsSearch, postNewConversationItem, fetchConversationItemUnread } from '@/actions/ConversationActions'; +import { fetchConversationsList, fetchOrderConversationsList, fetchConversationItemClose, fetchConversationsSearch, postNewConversationItem, fetchConversationItemUnread, UNREAD_MARK } from '@/actions/ConversationActions'; import { ChatItem } from 'react-chat-elements'; import ConversationsNewItem from './ConversationsNewItem'; import { isEmpty, olog } from '@/utils/commons'; @@ -29,7 +29,6 @@ const Conversations = ({ mobile }) => { const [conversationsListLoading, setConversationsListLoading] = useConversationStore((state) => [state.conversationsListLoading, state.setConversationsListLoading]); const addToConversationList = useConversationStore((state) => state.addToConversationList); const delConversationitem = useConversationStore((state) => state.delConversationitem); - const updateConversationItem = useConversationStore((state) => state.updateConversationItem); const closedConversationsList = useConversationStore((state) => state.closedConversationsList); const setClosedConversationList = useConversationStore((state) => state.setClosedConversationList); @@ -61,11 +60,15 @@ const Conversations = ({ mobile }) => { return () => {}; }, [isVisible]); + const [activeList, setActiveList] = useState(true); + const [dataSource, setDataSource] = useState(conversationsList); + const [listUpdateFlag, setListUpdateFlag] = useState(); useEffect(() => { - setDataSource(conversationsList); + // setDataSource(conversationsList); + setDataSource(activeList ? conversationsList: closedConversationsList); return () => {}; - }, [conversationsList.length]); + }, [conversationsList.length, listUpdateFlag, currentConversation.unread_msg_count]); const [switchToC, setSwitchToC] = useState({}); const [shouldFetchCList, setShouldFetchCList] = useState(true); @@ -141,22 +144,9 @@ const Conversations = ({ mobile }) => { }; const handleConversationItemUnread = async (item) => { - // updateConversationItem({ sn: item.sn, unread_msg_count: 1000 }); - // const bak_dataSource = dataSource; - // const targetIndex = bak_dataSource.findIndex((ele) => String(ele.sn) === String(item.sn)); - // bak_dataSource.splice(targetIndex, 1, { - // ...conversationsList[targetIndex], - // ...{ sn: item.sn, unread_msg_count: 1000 }, - // }) - setDataSource((prev) => - prev.map((ele) => { - return String(ele.sn) === String(item.sn) ? { ...ele, unread_msg_count: 1000 } : ele; - }) - ); - // setDataSource(bak_dataSource); - // setDataSource(conversationsList); await fetchConversationItemUnread({ conversationid: item.sn }); - refreshConversationList(); + await refreshConversationList(); + setListUpdateFlag(Math.random()); } const searchInputRef = useRef(null); @@ -181,23 +171,20 @@ const Conversations = ({ mobile }) => { } const [newChatModalVisible, setNewChatModalVisible] = useState(false); - const [newChatFormValues, setNewChatFormValues] = useState(); + const [newItemLoading, setNewItemLoading] = useState(false); const handleNewChat = async (values) => { // console.log(values); - const hasNewCurrent = await getOrderConversationList(values.coli_sn, values.phone_number); - if (hasNewCurrent !== false) { - // - } - setNewChatModalVisible(false); - // const newItem = await postNewConversationItem({...values, opi_sn: userId }); + const newChat = { phone_number: values.wa_id, remark_name: values.name }; + setNewItemLoading(true); + const createdNew = await postNewConversationItem({...newChat, opi_sn: userId }); // if ( ! isEmpty(newItem)) { - // addToConversationList(newItem); - // setCurrentConversation(newItem); + addToConversationList([createdNew]); + setCurrentConversation(createdNew); // } - // setNewChatFormValues(values); + setNewChatModalVisible(false); + setNewItemLoading(false); }; - const [activeList, setActiveList] = useState(true); // const closedVisible = closedConversationsList.length > 0; const toggleClosedConversationsList = () => { const _active = activeList; @@ -235,7 +222,7 @@ const Conversations = ({ mobile }) => { return (