.

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

@@ -29,6 +29,13 @@ const extTypeMapped = {
   default: { icon: FileOutlined }, // rtf bmp
 }
 
+const FileTypeIcon = ({fileName}) => {
+  const ext = fileName.split('.').pop() || 'default';
+  const Com = extTypeMapped[ext]?.icon || FileOutlined;
+  const color = extTypeMapped[ext]?.color || 'inherit';
+  return <Com style={{ color: color }} size={36} />;
+};
+
 /**
  * @property {*} emailMsg - 邮件数据. { conversationid, actionId, order_opi, coli_sn, msgOrigin: { from, to, id, email: { subject, mai_sn, } } }
  */
@@ -125,12 +132,6 @@ const EmailDetailInline = ({ mailID, emailMsg = {}, disabled = false, variant, s
       })
     }
   }
-  const FileTypeIcon = ({fileName}) => {
-    const ext = fileName.split('.').pop() || 'default';
-    const Com = extTypeMapped[ext]?.icon || FileOutlined;
-    const color = extTypeMapped[ext]?.color || 'inherit';
-    return <Com style={{ color: color }} size={36} />;
-  };
 
   /**
    * 根据状态, 显示操作
@@ -139,7 +140,7 @@ const EmailDetailInline = ({ mailID, emailMsg = {}, disabled = false, variant, s
    * * 失败: 重发
    * todo: disabled 不显示
    */
-  const ActionBtns = ({ className, ...props }) => {
+  const renderActionBtns = ({ className, ...props }) => {
     const { status } = mailData.info
 
     let btns = []
@@ -211,6 +212,26 @@ const EmailDetailInline = ({ mailID, emailMsg = {}, disabled = false, variant, s
     return <div className={`flex justify-end items-center gap-1  ${className || ''}`}>{btns}</div>
   }
 
+  const renderAttaList = ({ list }) => {
+    return (
+      <List
+        dataSource={list}
+        size='small'
+        className='[&_.ant-list-item]:p-1 [&_.ant-list-item]:justify-start'
+        renderItem={(atta) => (
+          <List.Item>
+            <FileTypeIcon fileName={atta.ATI_Name} />
+            <Typography.Text ellipsis={{ tooltip: { title: atta.ATI_Name, placement: 'left' } }} className='text-inherit'>
+              <span key={atta.ATI_SN} onClick={() => openPopup(`${EMAIL_ATTA_HOST}${atta.ATI_ServerFile}`, atta.ATI_SN)} size='small' className='text-blue-500 cursor-pointer'>
+                {atta.ATI_Name}
+              </span>
+            </Typography.Text>
+          </List.Item>
+        )}
+      />
+    )
+  };
+
   const variantCls = (variant) => {
     switch (variant) {
       case 'outline':
@@ -231,7 +252,8 @@ const EmailDetailInline = ({ mailID, emailMsg = {}, disabled = false, variant, s
               {loading ? <LoadingOutlined className='mr-1' /> : null}
               {mailData.info?.MAI_Subject || emailMsg?.msgOrigin?.subject}
             </span>
-            <ActionBtns key='actions' className={'ml-auto'} />
+            {/* <ActionBtns key='actions' className={'ml-auto'} /> */}
+            {renderActionBtns({ className: 'ml-auto'})}
           </div>
           <Divider className='my-2' />
           <div className={['flex flex-wrap justify-end', window.innerWidth < 800 ? 'flex-col' : 'flex-row '].join(' ')}>
@@ -284,42 +306,14 @@ const EmailDetailInline = ({ mailID, emailMsg = {}, disabled = false, variant, s
                 {mailData.attachments.length > 0 && (
                   <>
                     <span>&nbsp;附件 ({mailData.attachments.length})</span>
-                    <List
+                    {renderAttaList({ list: mailData.attachments || []})}
-                      dataSource={mailData.attachments || []}
-                      size='small'
-                      className='[&_.ant-list-item]:p-1 [&_.ant-list-item]:justify-start'
-                      renderItem={(atta) => (
-                        <List.Item>
-                          <FileTypeIcon fileName={atta.ATI_Name} />
-                          <Typography.Text ellipsis={{ tooltip: { title: atta.ATI_Name, placement: 'left' } }} className='text-inherit'>
-                            <span key={atta.ATI_SN} onClick={() => openPopup(`${EMAIL_ATTA_HOST}${atta.ATI_ServerFile}`, atta.ATI_SN)} size='small' className='text-blue-500 cursor-pointer'>
-                              {atta.ATI_Name}
-                            </span>
-                          </Typography.Text>
-                        </List.Item>
-                      )}
-                    />
                   </>
                 )}
                 {mailData.insideAttachments.length > 0 && <details>
                   <summary>
                     <span className='text-gray-500 italic'>&nbsp;文内附件 ({mailData.insideAttachments.length}) 已在正文显示&nbsp;</span><span className='cursor-pointer underline'>点击展开</span>
                   </summary>
-                  <List
+                  {renderAttaList({ list: mailData.insideAttachments || []})}
-                    dataSource={mailData.insideAttachments || []}
-                    size='small'
-                    className='[&_.ant-list-item]:p-1 [&_.ant-list-item]:justify-start'
-                    renderItem={(atta) => (
-                      <List.Item>
-                        <FileTypeIcon fileName={atta.ATI_Name} />
-                        <Typography.Text ellipsis={{ tooltip: { title: atta.ATI_Name, placement: 'left' } }} className='text-inherit'>
-                          <span key={atta.ATI_SN} onClick={() => openPopup(`${EMAIL_ATTA_HOST}${atta.ATI_ServerFile}`, atta.ATI_SN)} size='small' className='text-blue-500 cursor-pointer'>
-                            {atta.ATI_Name}
-                          </span>
-                        </Typography.Text>
-                      </List.Item>
-                    )}
-                  />
                 </details>}
               </div>
             )}