From 3519c4a414acd3a6cb5d1dd19d769a08b3988465 Mon Sep 17 00:00:00 2001
From: LiaoYijun <lyj@hainatravel.com>
Date: Wed, 4 Jun 2025 14:42:33 +0800
Subject: [PATCH] =?UTF-8?q?perf=EF=BC=9A=E8=B0=83=E6=95=B4=E9=82=AE?=
 =?UTF-8?q?=E4=BB=B6=E5=88=97=E8=A1=A8=E6=A0=B7=E5=BC=8F=EF=BC=8C=E7=B2=BE?=
 =?UTF-8?q?=E7=AE=80=E5=AD=97=E4=BD=93=E5=A4=A7=E5=B0=8F=E3=80=81=E8=A1=8C?=
 =?UTF-8?q?=E9=97=B4=E8=B7=9D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/orders/components/MailBox.jsx | 59 +++++++++----------------
 1 file changed, 22 insertions(+), 37 deletions(-)

diff --git a/src/views/orders/components/MailBox.jsx b/src/views/orders/components/MailBox.jsx
index b9a2dec..7f3147a 100644
--- a/src/views/orders/components/MailBox.jsx
+++ b/src/views/orders/components/MailBox.jsx
@@ -1,18 +1,9 @@
-
 import { useCallback, useEffect, useState } from 'react'
-import {
-  ReloadOutlined,
-  ReadOutlined, CheckSquareOutlined
-} from '@ant-design/icons'
-import {
-  Flex,
-  Button, Tooltip,
-  List,Radio,Typography,Divider,Drawer,
-  Dropdown, Input, Checkbox
-} from 'antd'
+import { ReloadOutlined, ReadOutlined, CheckSquareOutlined } from '@ant-design/icons'
+import { Flex, Button, Tooltip, List, Radio, Typography, Divider, Drawer, Dropdown, Input, Checkbox } from 'antd'
 
 const MailBox = (props) => {
-    const [openOrder, setOpenOrder] = useState(false)
+  const [openOrder, setOpenOrder] = useState(false)
   return (
     <>
       <div className='bg-white h-auto px-1 flex gap-1 items-center'>
@@ -82,7 +73,12 @@ const MailBox = (props) => {
           }}
           placeholder={`邮件主题`}
         />
-        <Button onClick={() => {setOpenOrder(true)}}>高级搜索</Button>
+        <Button
+          onClick={() => {
+            setOpenOrder(true)
+          }}>
+          高级搜索
+        </Button>
       </div>
 
       <div className='bg-white overflow-y-auto' style={{ height: 'calc(100vh - 198px)' }}>
@@ -200,34 +196,23 @@ const MailBox = (props) => {
             },
           ]}
           renderItem={(item) => (
-            <List.Item
-              key={item.title}
-              // actions={[
-              //   <a key="list-vertical-star-o">回复</a>,
-              //   <a key="list-vertical-refor">转发</a>,
-              // ]}
-              extra={<Checkbox></Checkbox>}>
-              <List.Item.Meta
-                className='cursor-pointer'
-                onClick={() => {console.info('item: ', item); props?.onMailClick(item.key)}}
-                title={<a href={item.href} onClick={() => {console.info(''); props?.onMailClick(item.key)}}>{item.title}</a>}
-                description={item.description + ' ' + item.mailDate}
-              />
-              {item.content}LSS250501006, Thailand
-            </List.Item>
+            <li className='flex border border-solid border-t-0 border-x-0 border-gray-200 hover:bg-gray-100 p-2'>
+              <div className='flex-1'>
+                <Flex gap='small' vertical={true} justify='space-between' className='cursor-pointer'>
+                  <span className="font-bold">{item.title}</span>
+                  <span className="text-neutral-500 text-wrap break-words break-all ">{item.description + ' ' + item.mailDate}</span>
+                  {item.orderNo + ' ' + item.country}
+                </Flex>
+              </div>
+              <div className=''>
+                <Checkbox></Checkbox>
+              </div>
+            </li>
           )}
         />
       </div>
 
-      <Drawer
-        title={'高级搜索'}
-        placement='right'
-        getContainer={false}
-        size={'large'}
-        mask={true}
-        maskClosable={true}
-        open={openOrder}
-        onClose={() => setOpenOrder(false)}>
+      <Drawer title={'高级搜索'} placement='top' getContainer={false} size={'large'} mask={true} maskClosable={true} open={openOrder} onClose={() => setOpenOrder(false)}>
         <Divider orientation='left'>
           <Typography.Text strong>是否重要</Typography.Text>
         </Divider>