From aacfae32be20376746b6cd7fee6451ee9ac84890 Mon Sep 17 00:00:00 2001
From: Lei OT <lyt@hainatravel.com>
Date: Fri, 20 Dec 2024 15:14:44 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E5=8E=86=E5=8F=B2=E8=AE=B0=E5=BD=95:?=
 =?UTF-8?q?=20=E6=98=BE=E7=A4=BA=E9=82=AE=E4=BB=B6=E6=B6=88=E6=81=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/ChatHistory.jsx                            | 12 +++++++++++-
 src/views/Conversations/History/MessagesList.jsx     |  9 ++++++---
 .../Conversations/Online/Components/BubbleEmail.jsx  |  2 +-
 .../Conversations/Online/Components/EmailDetail.jsx  |  3 ++-
 4 files changed, 20 insertions(+), 6 deletions(-)

diff --git a/src/views/ChatHistory.jsx b/src/views/ChatHistory.jsx
index 96106c0..a598790 100644
--- a/src/views/ChatHistory.jsx
+++ b/src/views/ChatHistory.jsx
@@ -8,6 +8,7 @@ import MessagesList from './Conversations/History/MessagesList';
 import ImageAlbumPreview from './Conversations/History/ImageAlumPreview';
 import { flush, pick } from '@/utils/commons';
 import { fetchConversationsSearch, CONVERSATION_PAGE_SIZE } from '@/actions/ConversationActions';
+import EmailDetail from './Conversations/Online/Components/EmailDetail';
 
 const { Sider, Content } = Layout;
 
@@ -45,6 +46,14 @@ const Index = (props) => {
       setSelectedConversation(data[0]);
     }
   };
+
+  const [openEmailDetail, setOpenEmailDetail] = useState(false);
+  const [emailDetail, setEmailDetail] = useState({});
+  const onOpenEmail = (emailMsg) => {
+    setOpenEmailDetail(true);
+    setEmailDetail({...emailMsg, order_opi: Number(selectedConversation?.opi_sn || 0)});
+  }
+
   return (
     <>
       <SearchForm onSubmit={handleSubmit} initialValues={formValues} />
@@ -56,9 +65,10 @@ const Index = (props) => {
         <Content style={{ maxHeight: 'calc(100vh - 300px)', height: 'calc(100vh - 300px)', minWidth: '360px' }}>
           <Flex className='h-full relative'>
             <MessagesMatchList />
-            <MessagesList />
+            <MessagesList onOpenEmail={onOpenEmail} />
           </Flex>
           <ImageAlbumPreview />
+          <EmailDetail open={openEmailDetail} setOpen={setOpenEmailDetail} emailMsg={emailDetail} key={`history-email-detail-${emailDetail.id}`} disabled />
         </Content>
       </Layout>
     </>
diff --git a/src/views/Conversations/History/MessagesList.jsx b/src/views/Conversations/History/MessagesList.jsx
index dc7b560..7d35d0d 100644
--- a/src/views/Conversations/History/MessagesList.jsx
+++ b/src/views/Conversations/History/MessagesList.jsx
@@ -7,9 +7,11 @@ import useFormStore from '@/stores/FormStore';
 import { isEmpty, stringToColour, groupBy, isNotEmpty } from '@/utils/commons';
 import { useShallow } from 'zustand/react/shallow';
 import MergeConversationTo from './MergeConversationTo';
+import BubbleIM from '../Online/Components/BubbleIM';
+import BubbleEmail from '../Online/Components/BubbleEmail';
 
 const BIG_PAGE_SIZE = MESSAGE_PAGE_SIZE * 20;
-const MessagesList = ({ ...props }) => {
+const MessagesList = ({ ...listProps }) => {
   const { message: appMessage } = App.useApp();
 
   const [formValues] = useFormStore((state) => [state.chatHistoryForm]);
@@ -197,8 +199,9 @@ const MessagesList = ({ ...props }) => {
   // eslint-disable-next-line react/display-name
   const MessageBoxWithRef = forwardRef((props, ref) => (
     <li ref={ref}>
-      <MessageBox {...props} />
-    </li>
+      {(props.msg_source || '').toLowerCase() === 'waba' && <MessageBox {...props} />}
+      {props.msg_source === 'email' && <BubbleEmail {...props} reposition='left' onOpenEmail={listProps.onOpenEmail} />}
+      </li>
   ));
 
   const handlePreview = (msg) => {
diff --git a/src/views/Conversations/Online/Components/BubbleEmail.jsx b/src/views/Conversations/Online/Components/BubbleEmail.jsx
index ece113c..36874b3 100644
--- a/src/views/Conversations/Online/Components/BubbleEmail.jsx
+++ b/src/views/Conversations/Online/Components/BubbleEmail.jsx
@@ -66,7 +66,7 @@ const BubbleEmail = ({ onOpenEditor, onOpenEmail, ...message  }) => {
       }
       // titleColor={message.sender !== 'me' ? '#4f46e5' : ''} // 600
       notch={false}
-      position={message.sender === 'me' ? 'right' : 'left'}
+      position={message.reposition || (message.sender === 'me' ? 'right' : 'left')}
       onReplyClick={() => onOpenEditor(message.msgOrigin)}
       onForwardClick={ () => { handleResend(message.msgOrigin); }}
       onOpen={() => handlePreview(message)}
diff --git a/src/views/Conversations/Online/Components/EmailDetail.jsx b/src/views/Conversations/Online/Components/EmailDetail.jsx
index 853d288..38fb089 100644
--- a/src/views/Conversations/Online/Components/EmailDetail.jsx
+++ b/src/views/Conversations/Online/Components/EmailDetail.jsx
@@ -13,7 +13,7 @@ import EmailBindFormModal from './EmailBind';
 /**
  * @property {*} emailMsg - 邮件数据. { conversationid, actionId, order_opi, coli_sn, msgOrigin: { from, to, id, email: { subject, mai_sn, } } }
  */
-const EmailDetail = ({ open, setOpen, emailMsg={}, ...props }) => {
+const EmailDetail = ({ open, setOpen, emailMsg={}, disabled=false, ...props }) => {
 
   // console.log('emailDetail', emailMsg);
 
@@ -77,6 +77,7 @@ const EmailDetail = ({ open, setOpen, emailMsg={}, ...props }) => {
    * * 已保存: []
    * * 已发送: 回复, 转发
    * * 失败: 重发
+   * todo: disabled 不显示
    */
   const ActionBtns = ({className, ...props}) => {
     const { status } = mailData.info