perf: 移动端

src/views/Conversations/Components/ConversationsList.jsx

@@ -18,8 +18,7 @@ const Conversations = ({ mobile }) => {
   const navigate = useNavigate();
   const userId = useAuthStore((state) => state.loginUser.userId);
   const initialState = useConversationStore((state) => state.initialState);
-  const activeConversations = useConversationStore((state) => state.activeConversations);
+  const [currentConversation, setCurrentConversation] = useConversationStore((state) => [state.currentConversation, state.setCurrentConversation]);
-  const [currentConversation, setCurrentConversation, updateCurrentConversation] = useConversationStore((state) => [state.currentConversation, state.setCurrentConversation, state.updateCurrentConversation]);
   const conversationsList = useConversationStore((state) => state.conversationsList);
   const addToConversationList = useConversationStore((state) => state.addToConversationList);
   const delConversationitem = useConversationStore((state) => state.delConversationitem);
@@ -27,6 +26,15 @@ const Conversations = ({ mobile }) => {
   const [tabSelectedConversation, setTabSelectedConversation] = useState({});
   const [tabCnt, setTabCnt] = useState(-1);
 
+  useEffect(() => {
+    if (mobile !== undefined) {
+      setCurrentConversation({});
+    }
+
+    return () => {};
+  }, [])
+
+
   const [dataSource, setDataSource] = useState(conversationsList);
   useEffect(() => {
     setDataSource(conversationsList);

src/views/Conversations/Components/Input/Template.jsx

@@ -126,23 +126,26 @@ const InputTemplate = ({ mobile, disabled = false, invokeSendMessage }) => {
   return (
     <>
       <Popover
-        overlayClassName={[mobile === undefined ? 'w-3/5' : 'w-full'].join(' ')}
+        overlayClassName={[mobile === undefined ? 'w-3/5' : 'w-full max-h-full'].join(' ')}
         fresh
         forceRender
         destroyTooltipOnHide={true}
         content={
           <>
-            <Input.Search
+            <div className='flex justify-between mt-2 gap-4 content-center'>
-              ref={searchInputRef}
+              <Input.Search prefix={'🙋'}
-              onSearch={handleSearchTemplates}
+                ref={searchInputRef}
-              allowClear
+                onSearch={handleSearchTemplates}
-              value={searchContent}
+                allowClear
-              onChange={(e) => {
+                value={searchContent}
-                setSearchContent(e.target.value);
+                onChange={(e) => {
-                handleSearchTemplates(e.target.value);
+                  setSearchContent(e.target.value);
-              }}
+                  handleSearchTemplates(e.target.value);
-              placeholder='搜索名称'
+                }}
-            />
+                placeholder='搜索名称'
+              />
+              <Button size='small' onClick={() => setOpenTemplates(false)}>&times;</Button>
+            </div>
             <List
               className='h-4/6 overflow-y-auto text-slate-900'
               itemLayout='horizontal'
@@ -163,7 +166,7 @@ const InputTemplate = ({ mobile, disabled = false, invokeSendMessage }) => {
                     }
                     description={
                       <>
-                        <div className=' max-h-40 overflow-y-auto divide-dashed divide-x-0 divide-y divide-gray-300'>
+                        <div className=' max-h-32 overflow-y-auto divide-dashed divide-x-0 divide-y divide-gray-300'>
                           <div className='text-slate-500'>{renderForm({ tempItem: item })}</div>
                           {item.components?.footer?.[0] ? <div className=''>{item.components.footer[0].text || ''}</div> : null}
                         </div>
@@ -175,11 +178,11 @@ const InputTemplate = ({ mobile, disabled = false, invokeSendMessage }) => {
             />
           </>
         }
-        title={
+        // title={
-          <div className='flex justify-between mt-2 '>
+        //   <div className='flex justify-between mt-2 '>
-            <div>🙋打招呼</div>
+        //     <div>🙋打招呼</div>
-            <Button size='small' onClick={() => setOpenTemplates(false)}>&times;</Button>
+        //     <Button size='small' onClick={() => setOpenTemplates(false)}>&times;</Button>
-          </div>}
+        //   </div>}
         trigger='click'
         open={openTemplates}
         onOpenChange={setOpenTemplates}>

src/views/Conversations/Components/MessagesWrapper.jsx

@@ -39,7 +39,7 @@ const MessagesWrapper = () => {
     updateCurrentConversation({ lasttime: thisLastTime, loadNextPage });
 
     return () => {};
-  }, [activeMessages, currentConversation.sn]);
+  }, [currentConversation.sn]);
 
 
   const getFirstPageMessages = async (item) => {

src/views/Conversations/Conversations.css

@@ -178,6 +178,9 @@
 .chatwindow-wrapper .rce-mbox .rce-mbox-reply {
     background-color: rgba(236, 236, 236, 0.7);
 }
+.chatwindow-wrapper.epr-main.EmojiPickerReact{
+    border: none;
+}
 .chatwindow-wrapper .rce-mbox .epr-emoji-img,
 .chatwindow-wrapper .rce-mbox .epr-emoji-native
 {