perf(前端): 邮件详情: 记住窗口位置

src/views/ChatHistory.jsx

@@ -49,6 +49,9 @@ const Index = (props) => {
 
   const [openEmailDetail, setOpenEmailDetail] = useState(false);
   const [emailDetail, setEmailDetail] = useState({});
+  const [initialPosition, setInitialPosition] = useState({})
+  const [initialSize, setInitialSize] = useState({})
+
   const onOpenEmail = (emailMsg) => {
     setOpenEmailDetail(true);
     setEmailDetail({...emailMsg, order_opi: Number(selectedConversation?.opi_sn || 0)});
@@ -68,7 +71,7 @@ const Index = (props) => {
             <MessagesList onOpenEmail={onOpenEmail} />
           </Flex>
           <ImageAlbumPreview />
-          <EmailDetail open={openEmailDetail} setOpen={setOpenEmailDetail} emailMsg={emailDetail} key={`history-email-detail-${emailDetail.id}`} disabled />
+          <EmailDetail open={openEmailDetail} setOpen={setOpenEmailDetail} emailMsg={emailDetail} key={`history-email-detail-${emailDetail.id}`} disabled {...{initialPosition, initialSize, setInitialPosition, setInitialSize}} />
         </Content>
       </Layout>
     </>

src/views/Conversations/Online/Components/EmailDetail.jsx

@@ -14,6 +14,7 @@ import EmailContent from './EmailContent';
 
 /**
  * @property {*} emailMsg - 邮件数据. { conversationid, actionId, order_opi, coli_sn, msgOrigin: { from, to, id, email: { subject, mai_sn, } } }
+ * @property {*} disabled - 是否禁用操作: 回复, 转发 等
  */
 const EmailDetail = ({ open, setOpen, emailMsg={}, disabled=false, ...props }) => {
 
@@ -24,16 +25,16 @@ const EmailDetail = ({ open, setOpen, emailMsg={}, disabled=false, ...props }) =
   const { conversationid, actionId, order_opi, coli_sn } = emailMsg
   const { mai_sn, id } = emailMsg.msgOrigin?.email || emailMsg.msgOrigin || {}
   const mailID = mai_sn || id
-  const [initialPosition, setInitialPosition] = useState({})
-  const [initialSize, setInitialSize] = useState({})
+  // const [initialPosition, setInitialPosition] = useState({})
+  // const [initialSize, setInitialSize] = useState({})
   function onHandleMove(e) {
     const { top, left, width, height } = e
-    setInitialPosition({ top, left })
+    props?.setInitialPosition({ top, left })
   }
   function onHandleResize(e) {
     const { top, left, width, height } = e
-    setInitialPosition({ top, left })
-    setInitialSize({ width, height })
+    props?.setInitialPosition({ top, left })
+    props?.setInitialSize({ width, height })
   }
 
   const [action, setAction] = useState('')
@@ -142,7 +143,7 @@ const EmailDetail = ({ open, setOpen, emailMsg={}, disabled=false, ...props }) =
             {mailData.info?.MAI_Subject || emailMsg?.msgOrigin?.email?.subject}
           </>
         }
-        initial={{ width: window.innerWidth - 740, height: window.innerHeight - 100, left: initialPosition.left || (300 + 24), top: initialPosition.top || 74 }}
+        initial={{ width: props.initialSize?.width || (window.innerWidth - 740), height: props.initialSize?.height || (window.innerHeight - 100), left: props.initialPosition?.left || (300 + 24), top: props.initialPosition?.top || 74 }}
         onMove={onHandleMove}
         onResize={onHandleResize}
         footer={<ActionBtns className='w-full !justify-start' />}>
@@ -159,7 +160,7 @@ const EmailDetail = ({ open, setOpen, emailMsg={}, disabled=false, ...props }) =
         customerDetail={orderDetail.customerDetail}
         // emailMsg={ReferEmailMsg}
         quoteid={mailID}
-        initial={{ ...initialPosition, ...initialSize }}
+        initial={{ ...props.initialPosition, ...props.initialSize }}
         mailData={mailData}
         action={action}
         key={`email-detail-inner-${action}-popup_${mailID}`}

src/views/Conversations/Online/Components/MessageListFilter.jsx

@@ -321,6 +321,9 @@ const MessageListFilter = ({ ...props }) => {
 
     const [openEmailDetail, setOpenEmailDetail] = useState(false);
     const [emailDetail, setEmailDetail] = useState({});
+    const [initialPosition, setInitialPosition] = useState({})
+    const [initialSize, setInitialSize] = useState({})
+
     const onOpenEmail = (email_detail) => {
       setOpenEmailDetail(true);
       setEmailDetail(email_detail);
@@ -360,7 +363,7 @@ const MessageListFilter = ({ ...props }) => {
             </List.Item>
           )}
         />
-        <EmailDetail open={openEmailDetail} setOpen={setOpenEmailDetail} emailMsg={emailDetail} key={`email-detail-1-${emailDetail.id}`} />
+        <EmailDetail open={openEmailDetail} setOpen={setOpenEmailDetail} emailMsg={emailDetail} key={`email-detail-1-${emailDetail.id}`} {...{initialPosition, initialSize, setInitialPosition, setInitialSize}} />
       </>
     );
   };

src/views/Conversations/Online/MessagesWrapper.jsx

@@ -207,6 +207,9 @@ const MessagesWrapper = ({ updateRead = true, forceGetMessages }) => {
 
   const [openEmailDetail, setOpenEmailDetail] = useState(false);
   const [emailDetail, setEmailDetail] = useState({});
+  const [initialPosition, setInitialPosition] = useState({})
+  const [initialSize, setInitialSize] = useState({})
+
   const onOpenEmail = (emailMsg) => {
     setOpenEmailDetail(true);
     setEmailDetail({...emailMsg, order_opi: Number(orderDetail?.opi_sn || userId)});
@@ -273,7 +276,7 @@ const MessagesWrapper = ({ updateRead = true, forceGetMessages }) => {
         conversationid={currentConversation.sn}
         key={`email-msg-reply-top-popup_${ReferEmailMsg.id}`}
       />
-      <EmailDetail open={openEmailDetail} setOpen={setOpenEmailDetail} emailMsg={emailDetail} key={`email-detail-${emailDetail.id}`} />
+      <EmailDetail open={openEmailDetail} setOpen={setOpenEmailDetail} emailMsg={emailDetail} key={`email-detail-${emailDetail.id}`} {...{initialPosition, initialSize, setInitialPosition, setInitialSize}} />
     </>
   )
 };