fix: 更新未读消息数; style: 移动端

src/stores/ConversationStore.js

@@ -219,6 +219,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) })),
   setMsgLoading: (msgListLoading) => set({ msgListLoading }),
   receivedMessageList: (conversationid, msgList) =>
     set((state) => ({
@@ -343,14 +344,6 @@ export const useConversationStore = create(
 
       setInitial(true);
 
-      // const autoGetMsgs = conversationsList.length > 5 ? 5 : conversationsList.length;
-      // for (let index = 0; index < autoGetMsgs; index++) {
-      //   const chatItem = conversationsList[index];
-      //   const msgData = await fetchMessages({ opisn: chatItem.opi_sn, whatsappid: chatItem.whatsapp_phone_number });
-      //   receivedMessageList(chatItem.sn, msgData);
-      // }
-      // for (const chatItem of conversationsList) {
-      // }
     },
   }))
 );

src/views/ChatHistory.jsx

@@ -41,7 +41,7 @@ const SearchForm = memo(function ({ initialValues, onSubmit }) {
       initialValues={initialValues}
       onFinish={handleSubmit}
       style={{}}>
-      <Form.Item label='顾问' name='agent' style={{ width: '200px' }} rules={[{required: true, message: '请选择顾问'}]}>
+      <Form.Item label='顾问' name='agent' style={{ width: '200px' }} rules={[{required: false, message: '请选择顾问'}]}>
         <SearchInput placeholder='搜索顾问' fetchOptions={fetchSalesAgent} mode={'tags'} maxTagCount={0} />
       </Form.Item>
       <Form.Item label='客人' name='customer' style={{ width: '200px' }}>
@@ -89,7 +89,7 @@ function ChatHistory() {
     const allEmpty = Object.values(cloneDeep(formValues)).every((val) => {
       return val === null || val === '' || val === undefined;
     });
-    if (allEmpty) return;
+    // if (allEmpty) return;
     setConversationsListLoading(true);
     setChatItemMessages([]);
     setParamsForMsgList({});
@@ -224,11 +224,11 @@ function ChatHistory() {
       return prev;
     }, []);
     return (
-      <span className={`text-base leading-5 emoji-text ${className} ${extraClass} `}>
+      <span className={`text-sm leading-5 emoji-text ${className} ${extraClass} `}>
         {(objArr || []).map((part, index) => {
           if (part.type === 'link') {
             return (
-              <a href={part.key} target='_blank' key={`${part.key}${index}`} rel='noreferrer' className='text-base'>
+              <a href={part.key} target='_blank' key={`${part.key}${index}`} rel='noreferrer' className='text-sm'>
                 {part.key}
               </a>
             );

src/views/Conversations/Components/MessagesList.jsx

@@ -45,11 +45,11 @@ const MessagesList = ({ messages, handlePreview, reference, longListLoading, get
       return prev;
     }, []);
     return (
-      <span className={`text-base leading-5 emoji-text whitespace-pre-wrap ${className} ${extraClass}`}>
+      <span className={`text-sm leading-5 emoji-text whitespace-pre-wrap ${className} ${extraClass}`}>
         {(objArr || []).map((part, index) => {
           if (part.type === 'link') {
             return (
-              <a href={part.key} target='_blank' key={`${part.key}${index}`} rel='noreferrer' className='text-base'>
+              <a href={part.key} target='_blank' key={`${part.key}${index}`} rel='noreferrer' className='text-sm'>
                 {part.key}
               </a>
             );

src/views/Conversations/Components/MessagesWrapper.jsx

@@ -13,21 +13,26 @@ const MessagesWrapper = () => {
 
   const [currentConversation, updateCurrentConversation, setCurrentConversation] = useConversationStore(useShallow((state) => [state.currentConversation, state.updateCurrentConversation, state.setCurrentConversation]));
   const conversationsList = useConversationStore(useShallow((state) => state.conversationsList));
-  const activeConversations = useConversationStore(useShallow((state) => state.activeConversations));
   const activeMessages = useConversationStore(useShallow((state) => (state.currentConversation.sn && state.activeConversations[state.currentConversation.sn] ? state.activeConversations[state.currentConversation.sn]: [])));
   const addToConversationList = useConversationStore((state) => state.addToConversationList);
 
   const receivedMessageList = useConversationStore((state) => state.receivedMessageList);
   const setMsgLoading = useConversationStore((state) => state.setMsgLoading);
 
+  const refreshTotalNotify = useConversationStore(useShallow((state) => state.refreshTotalNotify));
+
   const [longList, setLongList] = useState([]);
   const [longListLoading, setLongListLoading] = useState(false);
   const [shouldScrollBottom, setShouldScrollBottom] = useState(true);
   useEffect(() => {
     setLongList(activeMessages);
     setShouldScrollBottom(true);
+    if (currentConversation.sn && activeMessages.length < 20) {
+      getFirstPageMessages(currentConversation);
+    }
     if (currentConversation.opi_sn && currentConversation.whatsapp_phone_number && activeMessages.length > 0) {
       fetchCleanUnreadMsgCount({ opisn: currentConversation.opi_sn, whatsappid: currentConversation.whatsapp_phone_number });
+      refreshTotalNotify();
     }
     const thisLastTime = activeMessages.length > 0 ? activeMessages[0].orgmsgtime : '';
     const loadNextPage = !(activeMessages.length === 0 || activeMessages.length < MESSAGE_PAGE_SIZE);
@@ -37,7 +42,7 @@ const MessagesWrapper = () => {
   }, [activeMessages, currentConversation.sn]);
 
 
-  const getMessages = async (item) => {
+  const getFirstPageMessages = async (item) => {
     setMsgLoading(true);
     const data = await fetchMessages({ opisn: userId, whatsappid: item.whatsapp_phone_number, lasttime: '' });
     setMsgLoading(false);
@@ -47,15 +52,6 @@ const MessagesWrapper = () => {
     updateCurrentConversation({ lasttime: thisLastTime, loadNextPage });
   };
 
-  useEffect(() => {
-    const messagesList = activeConversations[`${currentConversation.sn}`] || [];
-    if (currentConversation.sn && messagesList.length < 20) {
-      getMessages(currentConversation);
-    }
-
-    return () => {};
-  }, [currentConversation.sn]);
-
   const getMoreMessages = async () => {
     setShouldScrollBottom(false);
     setLongListLoading(true);

src/views/MobileApp.jsx

@@ -41,7 +41,7 @@ function MobileApp() {
           <Outlet />
         </Content>
       </Layout>
-      <Footer>桂林海纳国际旅行社有限公司</Footer>
+      {/* <Footer>桂林海纳国际旅行社有限公司</Footer> */}
     </Layout>
   )
 }

src/views/mobile/Chat.jsx

@@ -8,7 +8,7 @@ const { Content, Header, Footer } = Layout;
 function Chat() {
   return (
     <>
-      <Layout className='h-full chatwindow-wrapper mobilechat-wrapper' style={{ maxHeight: 'calc(100vh - 150px)', height: 'calc(100vh - 150px)', minWidth: '360px' }}>
+      <Layout className='h-full chatwindow-wrapper mobilechat-wrapper' style={{ maxHeight: 'calc(100vh - 84px)', height: 'calc(100vh - 84px)', minWidth: '360px' }}>
         <Header className='ant-layout-sider-light ant-card h-auto flex justify-between gap-1 items-center'>
           <MessagesHeader />
         </Header>