|
|
|
|
@ -1,8 +1,8 @@
|
|
|
|
|
import { useEffect, useState, useRef } from 'react';
|
|
|
|
|
import { useParams, useNavigate, useLocation } from 'react-router-dom';
|
|
|
|
|
import { Dropdown, Input, Button, } from 'antd';
|
|
|
|
|
import { PlusOutlined, WhatsAppOutlined, LoadingOutlined } from '@ant-design/icons';
|
|
|
|
|
import { fetchConversationsList, fetchOrderConversationsList, fetchConversationItemClose, postNewConversationItem } from '@/actions/ConversationActions';
|
|
|
|
|
import { Dropdown, Input, Button, Empty, Tooltip } from 'antd';
|
|
|
|
|
import { PlusOutlined, WhatsAppOutlined, LoadingOutlined, HistoryOutlined, FireOutlined } from '@ant-design/icons';
|
|
|
|
|
import { fetchConversationsList, fetchOrderConversationsList, fetchConversationItemClose, fetchConversationsSearch, postNewConversationItem } from '@/actions/ConversationActions';
|
|
|
|
|
import { ChatItem } from 'react-chat-elements';
|
|
|
|
|
import ConversationsNewItem from './ConversationsNewItem';
|
|
|
|
|
import { isEmpty, olog } from '@/utils/commons';
|
|
|
|
|
@ -28,6 +28,9 @@ const Conversations = ({ mobile }) => {
|
|
|
|
|
const addToConversationList = useConversationStore((state) => state.addToConversationList);
|
|
|
|
|
const delConversationitem = useConversationStore((state) => state.delConversationitem);
|
|
|
|
|
|
|
|
|
|
const closedConversationsList = useConversationStore((state) => state.closedConversationsList);
|
|
|
|
|
const setClosedConversationList = useConversationStore((state) => state.setClosedConversationList);
|
|
|
|
|
|
|
|
|
|
const isVisible = useVisibilityState();
|
|
|
|
|
|
|
|
|
|
const [tabSelectedConversation, setTabSelectedConversation] = useState({});
|
|
|
|
|
@ -60,7 +63,7 @@ const Conversations = ({ mobile }) => {
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
setDataSource(conversationsList);
|
|
|
|
|
return () => {};
|
|
|
|
|
}, [conversationsList]);
|
|
|
|
|
}, [conversationsList.length]);
|
|
|
|
|
|
|
|
|
|
const [switchToC, setSwitchToC] = useState({});
|
|
|
|
|
const [shouldFetchCList, setShouldFetchCList] = useState(true);
|
|
|
|
|
@ -131,6 +134,8 @@ const Conversations = ({ mobile }) => {
|
|
|
|
|
if (String(order_sn) === String(item.coli_sn)) {
|
|
|
|
|
navigate(routePrefix, { replace: routerReplace });
|
|
|
|
|
}
|
|
|
|
|
const _clist = await fetchConversationsSearch({ opisn: userId, session_enable: 0 });
|
|
|
|
|
setClosedConversationList(_clist);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const searchInputRef = useRef(null);
|
|
|
|
|
@ -165,10 +170,19 @@ const Conversations = ({ mobile }) => {
|
|
|
|
|
// setNewChatFormValues(values);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const [activeList, setActiveList] = useState(true);
|
|
|
|
|
// const closedVisible = closedConversationsList.length > 0;
|
|
|
|
|
const toggleClosedConversationsList = () => {
|
|
|
|
|
const _active = activeList;
|
|
|
|
|
setDataSource(_active ? closedConversationsList : conversationsList);
|
|
|
|
|
setActiveList(!activeList);
|
|
|
|
|
setCurrentConversation({});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div className='flex flex-col h-inherit'>
|
|
|
|
|
<div className='flex gap-1'>
|
|
|
|
|
{([404, 383].includes(userId)) && <Button onClick={() => setNewChatModalVisible(true)} icon={<PlusOutlined />} type={'primary'} />}
|
|
|
|
|
{[404, 383].includes(userId) && <Button onClick={() => setNewChatModalVisible(true)} icon={<PlusOutlined />} type={'primary'} />}
|
|
|
|
|
<Input.Search
|
|
|
|
|
className=''
|
|
|
|
|
ref={searchInputRef}
|
|
|
|
|
@ -199,6 +213,13 @@ const Conversations = ({ mobile }) => {
|
|
|
|
|
}}
|
|
|
|
|
placeholder={`搜索名称/号码/订单号${conversationsListLoading ? '...' : ''}`}
|
|
|
|
|
/>
|
|
|
|
|
<Tooltip key={'conversation-list'} title={activeList ? '历史会话' : '活跃会话'}>
|
|
|
|
|
<Button
|
|
|
|
|
onClick={toggleClosedConversationsList}
|
|
|
|
|
icon={activeList ? <HistoryOutlined className='text-neutral-500' /> : <FireOutlined className=' text-orange-500' />}
|
|
|
|
|
type='text'
|
|
|
|
|
/>
|
|
|
|
|
</Tooltip>
|
|
|
|
|
</div>
|
|
|
|
|
<div className='flex-1 overflow-x-hidden overflow-y-auto relative'>
|
|
|
|
|
{conversationsListLoading && dataSource.length === 0 ? (
|
|
|
|
|
@ -244,8 +265,14 @@ const Conversations = ({ mobile }) => {
|
|
|
|
|
/>
|
|
|
|
|
</Dropdown>
|
|
|
|
|
))}
|
|
|
|
|
{dataSource.length === 0 && <Empty description={'无数据'} />}
|
|
|
|
|
</div>
|
|
|
|
|
<ConversationsNewItem initialValues={{coli_id: currentConversation.coli_id, coli_sn: currentConversation.coli_sn}} open={newChatModalVisible} onCreate={handleNewChat} onCancel={() => setNewChatModalVisible(false)} />
|
|
|
|
|
<ConversationsNewItem
|
|
|
|
|
initialValues={{ coli_id: currentConversation.coli_id, coli_sn: currentConversation.coli_sn }}
|
|
|
|
|
open={newChatModalVisible}
|
|
|
|
|
onCreate={handleNewChat}
|
|
|
|
|
onCancel={() => setNewChatModalVisible(false)}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
|
Jimmy Liow
1 year ago