diff --git a/src/views/Conversations/Online/MessagesHeader.jsx b/src/views/Conversations/Online/MessagesHeader.jsx
index 4c59283..2a8c9ae 100644
--- a/src/views/Conversations/Online/MessagesHeader.jsx
+++ b/src/views/Conversations/Online/MessagesHeader.jsx
@@ -1,6 +1,6 @@
 import useConversationStore from '@/stores/ConversationStore';
 import useAuthStore from '@/stores/AuthStore'
-import { Flex, Typography, Avatar, Alert, Button, Tooltip, Spin } from 'antd';
+import { Flex, Typography, Avatar, Alert, Button, Tooltip, Spin, Space } from 'antd';
 import { ReloadOutlined, ApiOutlined } from '@ant-design/icons';
 import { LoadingOutlined } from '@ant-design/icons';
 import ExpireTimeClock from './ExpireTimeClock';
@@ -35,15 +35,15 @@ const MessagesHeader = () => {
       <Flex gap={16} className='p-1 flex-auto'>
         {/* {currentConversation.customer_name && <Avatar src={`https://api.dicebear.com/7.x/avataaars/svg?seed=${currentConversation.customer_name}`} />} */}
         <Flex flex={'1'} justify='space-between'>
-          <Flex vertical={false} gap={12} justify='space-between'>
+          <Flex vertical={false} gap={12} justify='space-between' align='center'>
             {(currentConversation.coli_sn || currentConversation.sn) ? (
               <>
                 <Typography.Text strong>{currentConversation.show_default}</Typography.Text>
                 {currentConversation.sn ? (
-                  <>
+                  <div className='flex flex-col'>
                     <Typography.Text>{currentConversation?.channels?.whatsapp_phone_number}</Typography.Text>
                     <Typography.Text>{currentConversation?.channels?.email}</Typography.Text>
-                  </>
+                  </div>
                 ) : (
                   <Typography.Text strong type='danger'>
                     没有WhatsApp号码