|
|
|
|
@ -1,5 +1,5 @@
|
|
|
|
|
import { useEffect, useState } from 'react';
|
|
|
|
|
import { App, Button, Popover, Tabs, List, Image, Avatar, Card } from 'antd';
|
|
|
|
|
import { App, Button, Popover, Tabs, List, Image, Avatar, Card, Flex } from 'antd';
|
|
|
|
|
import { FileSearchOutlined, LoadingOutlined } from '@ant-design/icons';
|
|
|
|
|
import { InboxIcon, SendPlaneFillIcon } from '@/components/Icons';
|
|
|
|
|
import { groupBy, stringToColour } from '@/utils/commons';
|
|
|
|
|
@ -8,6 +8,7 @@ import { useShallow } from 'zustand/react/shallow';
|
|
|
|
|
import EmailDetail from './EmailDetail';
|
|
|
|
|
import { MESSAGE_PAGE_SIZE, fetchMessagesHistory } from '@/actions/ConversationActions';
|
|
|
|
|
import DnDModal from '@/components/DnDModal';
|
|
|
|
|
import useStyleStore from '@/stores/StyleStore';
|
|
|
|
|
|
|
|
|
|
const BIG_PAGE_SIZE = MESSAGE_PAGE_SIZE * 10;
|
|
|
|
|
|
|
|
|
|
@ -25,6 +26,8 @@ const getVideoName = (vUrl) => {
|
|
|
|
|
* 消息记录筛选----------------------------------------------------------------------------------------------------
|
|
|
|
|
*/
|
|
|
|
|
const MessageListFilter = ({ ...props }) => {
|
|
|
|
|
const [mobile] = useStyleStore((state) => [state.mobile]);
|
|
|
|
|
|
|
|
|
|
const activeMessages = useConversationStore(
|
|
|
|
|
useShallow((state) => (state.currentConversation.sn && state.activeConversations[state.currentConversation.sn] ? state.activeConversations[state.currentConversation.sn] : []))
|
|
|
|
|
);
|
|
|
|
|
@ -102,7 +105,7 @@ const MessageListFilter = ({ ...props }) => {
|
|
|
|
|
renderItem={(date) => (
|
|
|
|
|
<List.Item>
|
|
|
|
|
<Card size='small' title={date} key={date} className='mb-2'>
|
|
|
|
|
<div className='grid grid-cols-5 gap-2 '>
|
|
|
|
|
<div className={['grid gap-2 ', mobile === false ? 'grid-cols-5' : 'grid-cols-3'].join(' ')}>
|
|
|
|
|
{byDate[date].map((img) => (
|
|
|
|
|
<Image className='border object-cover' key={img.data.id} width={100} height={100} src={img.data.uri} />
|
|
|
|
|
))}
|
|
|
|
|
@ -136,28 +139,24 @@ const MessageListFilter = ({ ...props }) => {
|
|
|
|
|
loadMore={loadMore}
|
|
|
|
|
loading={loading}
|
|
|
|
|
renderItem={(item) => (
|
|
|
|
|
<List.Item
|
|
|
|
|
actions={[
|
|
|
|
|
<Button key='copyv' onClick={() => handleCopyClick(item.data.videoURL)} type='link' size='small'>
|
|
|
|
|
复制🔗
|
|
|
|
|
</Button>,
|
|
|
|
|
item.localDate,
|
|
|
|
|
]}
|
|
|
|
|
className='items-center'>
|
|
|
|
|
<List.Item>
|
|
|
|
|
<List.Item.Meta
|
|
|
|
|
avatar={
|
|
|
|
|
<Avatar size='small' style={CalColorStyle(item.sender)}>
|
|
|
|
|
{item.senderName}
|
|
|
|
|
</Avatar>
|
|
|
|
|
}
|
|
|
|
|
title={
|
|
|
|
|
<span onClick={() => handleOpenVideoPlay(item?.data.videoURL)}>
|
|
|
|
|
{getVideoName(item?.data.videoURL)}
|
|
|
|
|
</span>
|
|
|
|
|
title={<span onClick={() => handleOpenVideoPlay(item?.data.videoURL)}>{getVideoName(item?.data.videoURL)}</span>}
|
|
|
|
|
description={
|
|
|
|
|
<Flex>
|
|
|
|
|
<div className='flex-auto'>{item.localDate}</div>
|
|
|
|
|
<Button key='copyv' onClick={() => handleCopyClick(item.data.videoURL)} type='link' size='small'>
|
|
|
|
|
复制🔗
|
|
|
|
|
</Button>
|
|
|
|
|
</Flex>
|
|
|
|
|
}
|
|
|
|
|
description={item.text}
|
|
|
|
|
/>
|
|
|
|
|
{/* {item.text} */}
|
|
|
|
|
{item.text}
|
|
|
|
|
</List.Item>
|
|
|
|
|
)}
|
|
|
|
|
/>
|
|
|
|
|
@ -209,12 +208,8 @@ const MessageListFilter = ({ ...props }) => {
|
|
|
|
|
loadMore={loadMore}
|
|
|
|
|
loading={loading}
|
|
|
|
|
renderItem={(item) => (
|
|
|
|
|
<List.Item actions={[
|
|
|
|
|
<Button key='copyv' onClick={() => handleCopyClick(item.data.uri)} type='link' size='small'>
|
|
|
|
|
复制🔗
|
|
|
|
|
</Button>,item.localDate]}>
|
|
|
|
|
<List.Item>
|
|
|
|
|
<List.Item.Meta
|
|
|
|
|
// avatar={<Avatar src={`https://api.dicebear.com/7.x/miniavs/svg?seed=${index}`} />}
|
|
|
|
|
avatar={
|
|
|
|
|
<Avatar size='small' style={CalColorStyle(item.sender)}>
|
|
|
|
|
{item.senderName}
|
|
|
|
|
@ -222,12 +217,19 @@ const MessageListFilter = ({ ...props }) => {
|
|
|
|
|
}
|
|
|
|
|
title={
|
|
|
|
|
<a href={item.data.uri} target='_blank' rel='noreferrer'>
|
|
|
|
|
{item.title} 🔗
|
|
|
|
|
{item.title}
|
|
|
|
|
</a>
|
|
|
|
|
}
|
|
|
|
|
description={item.text}
|
|
|
|
|
description={
|
|
|
|
|
<Flex>
|
|
|
|
|
<div className='flex-auto'>{item.localDate}</div>
|
|
|
|
|
<Button key='copyv' onClick={() => handleCopyClick(item.data.videoURL)} type='link' size='small'>
|
|
|
|
|
复制🔗
|
|
|
|
|
</Button>
|
|
|
|
|
</Flex>
|
|
|
|
|
}
|
|
|
|
|
/>
|
|
|
|
|
{/* {item.text} */}
|
|
|
|
|
{item.text}
|
|
|
|
|
</List.Item>
|
|
|
|
|
)}
|
|
|
|
|
/>
|
|
|
|
|
@ -256,7 +258,7 @@ const MessageListFilter = ({ ...props }) => {
|
|
|
|
|
loading={loading}
|
|
|
|
|
renderItem={({ emailOrigin, ...item }) => (
|
|
|
|
|
<List.Item
|
|
|
|
|
actions={[item.localDate]}
|
|
|
|
|
// actions={[item.localDate]}
|
|
|
|
|
className='cursor-pointer'
|
|
|
|
|
onClick={() => {
|
|
|
|
|
onOpenEmail({ emailOrigin, ...item });
|
|
|
|
|
@ -270,7 +272,12 @@ const MessageListFilter = ({ ...props }) => {
|
|
|
|
|
// </Avatar>
|
|
|
|
|
}
|
|
|
|
|
title={emailOrigin.subject}
|
|
|
|
|
description={`To: ${emailOrigin.toEmail}`}
|
|
|
|
|
// description={`To: ${emailOrigin.toEmail}`}
|
|
|
|
|
description={
|
|
|
|
|
<Flex justify={'space-between'} className='max-w-full overflow-hidden' >
|
|
|
|
|
<div className='flex-auto line-clamp-1 break-all pr-2'>{`To: ${emailOrigin.toEmail}`}</div>
|
|
|
|
|
<div className=' basis-32 flex-grow-0 flex-shrink-0'>{item.localDate}</div>
|
|
|
|
|
</Flex>}
|
|
|
|
|
/>
|
|
|
|
|
{emailOrigin.abstract}
|
|
|
|
|
</List.Item>
|
|
|
|
|
@ -286,10 +293,10 @@ const MessageListFilter = ({ ...props }) => {
|
|
|
|
|
return (
|
|
|
|
|
<>
|
|
|
|
|
<Popover
|
|
|
|
|
// overlayClassName={[mobile === undefined ? 'w-3/5' : 'w-full max-h-full'].join(' ')}
|
|
|
|
|
// destroyTooltipOnHide
|
|
|
|
|
placement='bottom'
|
|
|
|
|
overlayClassName='w-2/5 max-w-2/5 max-h-[70%]'
|
|
|
|
|
overlayClassName={[mobile === false ? 'w-2/5' : 'w-full max-h-full', 'max-h-[70%]'].join(' ')}
|
|
|
|
|
// 'min-w-2/5 max-w-2/5 max-h-[70%]'
|
|
|
|
|
trigger={'click'}
|
|
|
|
|
open={openPopup}
|
|
|
|
|
onOpenChange={setOpenPopup}
|
|
|
|
|
|
Lei OT
9 months ago