Merge remote-tracking branch 'origin/dev/2025a' into dev/2025a

src/views/orders/components/MailBox.jsx

@@ -3,6 +3,8 @@ import { ReloadOutlined, ReadOutlined, CheckSquareOutlined, StarOutlined, RightO
 import { Flex, Button, Tooltip, List, Form, Row, Col, Drawer, Dropdown, Input, Checkbox, DatePicker, Switch, Breadcrumb } from 'antd'
 import dayjs from 'dayjs'
 import { useEmailList } from '@/hooks/useEmail';
+import { isEmpty } from '@/utils/commons';
+import { MailboxDirIcon } from './MailboxDirIcon'
 
 const { RangePicker } = DatePicker
 const MailBox = ({ mailboxDir, onMailItemClick, ...props}) => {
@@ -32,11 +34,36 @@ const MailBox = ({ mailboxDir, onMailItemClick, ...props}) => {
       value: [dayjs().startOf('y'), dayjs().endOf('y')],
     },
   ]
-  const [openOrder, setOpenOrder] = useState(false)
   const [form] = Form.useForm()
 
   const { mailList, isLoading, error } = useEmailList(mailboxDir);
 
+  console.info('props.breadcrumb: ', props.breadcrumb)
+  console.info('props.mailboxDir: ', mailboxDir)
+
+  const mailItemRender = (item) => {
+    const isOrderNode = mailboxDir.COLI_SN > 0
+    const orderNumber = (isEmpty(item.MAI_COLI_ID) || isOrderNode) ? '' : (item.MAI_COLI_ID + ' - ')
+    const countryName = isEmpty(item.CountryCN) ? '' : ('[' + (item.CountryCN === null ? 'USA' : item.CountryCN) + '] ')
+    const mailStateClass = item.MOI_ReadState === 0 ? 'font-bold' : ''
+    return (
+      <li className='flex border border-solid border-t-0 border-x-0 border-gray-200 hover:bg-neutral-50 p-2' onClick={() => {
+        console.info('item: ', item)
+        onMailItemClick(item.MAI_SN)
+      }}>
+        <div className=''>
+          <Checkbox></Checkbox>
+        </div>
+        <div className='flex-1 pl-2'>
+          <Flex gap='small' vertical={true} justify='space-between' className='cursor-pointer'>
+            <div>{orderNumber}<span className={mailStateClass}>{item.MAI_Subject}</span></div>
+            <span className='text-neutral-500 text-wrap break-words break-all '>{countryName + item.SenderReceiver + ' ' + item.SRDate}</span>
+          </Flex>
+        </div>
+      </li>
+    )
+  }
+
   return (
     <>
       <div className='bg-white h-auto px-1 flex gap-1 items-center'>
@@ -106,8 +133,10 @@ const MailBox = ({ mailboxDir, onMailItemClick, ...props}) => {
           }}
           placeholder={`邮件主题`}
         />
-        <Switch checkedChildren={<AppstoreOutlined />}
+          <Tooltip title='高级搜索'>
+        <Switch checkedChildren={<ExpandOutlined />}
       unCheckedChildren={<ExpandOutlined />} defaultChecked={false} />
+      </Tooltip>
       </div>
       <div className='bg-white h-auto p-1 flex gap-1 items-center hidden'>
         <Form
@@ -136,30 +165,24 @@ const MailBox = ({ mailboxDir, onMailItemClick, ...props}) => {
       </div>
 
       <div className='bg-white overflow-y-auto' style={{ height: 'calc(100vh - 198px)' }}>
-        <List
+        <List loading={isLoading}
           header={
             <Flex align='center' justify="space-between">
             <Breadcrumb
-              items={[
-                {
-                  title: (
-                    <>
-                      <StarOutlined />
-                      <span>今日任务</span>
-                    </>
-                  ),
-                },
-                {
-                  title: (
-                    <>
-                      <span>lyj20210810144702</span>
-                    </>
-                  ),
-                },
-              ]}
+              items={
+                props.breadcrumb.map(bc  => {
+                  return {
+                    title: (
+                      <>
+                      <MailboxDirIcon type={bc?.iconIndex} />
+                        <span>{bc.title}</span>
+                      </>
+                    ),
+                  }
+                })}
             />
             <Flex align="center" justify="space-between">
-              <span>51-100 of 562</span>
+              <span>1-50 of {mailList.length}</span>
             <Button icon={<LeftOutlined />} type="text" iconPosition={'end'}></Button>
             <Button icon={<RightOutlined />} type="text" iconPosition={'end'}></Button>
             </Flex>
@@ -167,58 +190,11 @@ const MailBox = ({ mailboxDir, onMailItemClick, ...props}) => {
           </Flex>
           }
           itemLayout='vertical'
-          size='large'
           pagination={false}
           dataSource={mailList}
-          renderItem={(item) => (
-            <li onClick={() => onMailItemClick(item.MAI_SN)} className='flex border border-solid border-t-0 border-x-0 border-gray-200 hover:bg-neutral-50 p-2'>
-              <div className=''>
-                <Checkbox></Checkbox>
-              </div>
-              <div className='flex-1 pl-2'>
-                <Flex gap='small' vertical={true} justify='space-between' className='cursor-pointer'>
-                  <div>{item.orderNo + ' - '}<span className='font-bold'>{item.title}</span></div>
-                  <span className='text-neutral-500 text-wrap break-words break-all '>{'[' + (item.country === null ? '' : item.country) + '] ' + item.description + ' ' + item.mailDate}</span>
-                </Flex>
-              </div>
-            </li>
-          )}
+          renderItem={mailItemRender}
         />
       </div>
-
-      {/* <Drawer title={'高级搜索'} placement='top'  size={'large'} mask={true} maskClosable={true} open={openOrder} onClose={() => setOpenOrder(false)}>
-        <Form
-          layout={'vertical'}
-          form={form}
-          initialValues={{}}
-          // onFinish={handleSubmit}
-        >
-          <Row justify='start' gutter={16}>
-            <Col span={4}>
-              <Form.Item label='订单号' name='orderNumber'>
-                <Input placeholder='订单号' allowClear />
-              </Form.Item>
-            </Col>
-            <Col span={4}>
-              <Form.Item label='出发日期' name='startDateRange'>
-                <RangePicker allowClear={true} inputReadOnly={true} presets={DATE_RANGE_PRESETS} />
-              </Form.Item>
-            </Col>
-            <Col span={4}>
-              <Form.Item label='确认日期' name='confirmDateRange'>
-                <RangePicker allowClear={true} inputReadOnly={true} presets={DATE_RANGE_PRESETS} />
-              </Form.Item>
-            </Col>
-          </Row>
-          <Row justify='start' align='middle' gutter={16}>
-            <Col span={1} offset={1}>
-              <Button type='primary' htmlType='submit'>
-                搜索
-              </Button>
-            </Col>
-          </Row>
-        </Form>
-      </Drawer> */}
     </>
   )
 }