feat: 会话列表: 最近消息

src/actions/ConversationActions.js

@@ -24,8 +24,15 @@ export const fetchTemplates = async () => {
 export const fetchConversationsList = async (params) => {
   const { errcode, result: data } = await fetchJSON(`${API_HOST}/getconversations`, params);
   if (errcode !== 0) return [];
-  const list = (data || []).map((ele) => ({ ...ele, customer_name: `${ele.whatsapp_name || ''}`.trim(), whatsapp_name: `${ele.whatsapp_name || ''}`.trim() }));
-  return list;
+  const list = (data || []).map((ele) => ({
+    ...ele,
+    customer_name: `${ele.whatsapp_name || ''}`.trim(),
+    whatsapp_name: `${ele.whatsapp_name || ''}`.trim(),
+    coli_id: ele.COLI_ID,
+  }))
+  // return first 10 items
+  return list.slice(0, 30); // test: 0
+  // return list;
 };
 
 /**

src/channel/bubbleMsgUtils.js

@@ -280,6 +280,7 @@ export const msgStatusRenderMapped = {
   'delivered': 'received',
   'read': 'read',
   'failed': 'failed',
+  'send': 'sent',
 };
 export const msgStatusRenderMappedCN = {
   'accepted': '[发送ing]',
@@ -454,6 +455,7 @@ export const whatsappMsgTypeMapped = {
   reaction: {
     type: 'text',
     data: (msg) => ({ id: msg.wamid, text: msg.reaction?.emoji || '' }),
+    renderForReply: (msg) => ({ id: msg.wamid, text: msg.reaction?.emoji || '' }),
   },
   document: {
     type: 'file',
@@ -518,6 +520,12 @@ export const whatsappMsgTypeMapped = {
   email: {
     type: 'email',
     data: (msg) => ({ id: msg.id, subject: msg.email.subject, }),
+    renderForReply: (msg) => {
+      return {
+        id: msg.id,
+        message: `[邮件] ${msg.email.subject}`,
+      };
+    },
   },
 };
 /**
@@ -608,7 +616,7 @@ export const parseRenderMessageList = (messages) => {
       from: msgContent.from,
       sender: msgContent.from,
       senderName: msgContent?.customerProfile?.name || 'me', // msgContent.from,
-      replyButton: ['text', 'document', 'image'].includes(msgContent.type) && (msgContent?.status || '') !== 'failed',
+      replyButton: ['text', 'document', 'image', 'email'].includes(msgContent.type) && (msgContent?.status || '') !== 'failed',
       ...(msg.msg_direction === 'outbound'
         ? {
             sender: 'me',

src/stores/ConversationStore.js

@@ -402,14 +402,14 @@ export const useConversationStore = create(
     fetchInitialData: async (userIds) => {
       const { addToConversationList, setTemplates, setInitial, setClosedConversationList, setTags } = get();
 
-      const conversationsList = await fetchConversationsList({ opisn: userIds });
-      addToConversationList(conversationsList);
+      // const conversationsList = await fetchConversationsList({ opisn: userIds });
+      // addToConversationList(conversationsList);
 
       const templates = await fetchTemplates();
       setTemplates(templates);
 
-      // const closedList = await fetchConversationsSearch({ opisn: userIds, session_enable: 0 });
-      // setClosedConversationList(closedList);
+      const closedList = await fetchConversationsSearch({ opisn: userIds, session_enable: 0 });
+      setClosedConversationList(closedList);
 
       const myTags = await fetchTags({ opisn: userIds});
       setTags(myTags);

src/stores/OrderStore.js

@@ -105,17 +105,23 @@ export const OrderLabelDefaultOptions = [
   { value: 240002, label: '次重点', emoji: '❗' },
   { value: 240001, label: '一般', emoji: '' }
 ]
+export const OrderLabelDefaultOptionsMapped = OrderLabelDefaultOptions.reduce((acc, cur) => {
+  return { ...acc, [String(cur.value)]: cur }
+}, {}) ;
 
 export const OrderStatusDefaultOptions = [
-  { value: 1, label: '新订单' },
-  { value: 2, label: '报价中' },
-  { value: 3, label: '以后联系' },
-  { value: 4, label: '等待付订金' },
+  { value: 1, label: '新订单', emoji: '' },
+  { value: 2, label: '报价中', emoji: '📝' },
+  { value: 3, label: '以后联系', emoji: '💤' },
+  { value: 4, label: '等待付订金', emoji: '🛒' },
   { value: 5, label: '成行', emoji: '💰' },
-  { value: 6, label: '丢失' },
-  { value: 7, label: '取消' },
-  { value: 8, label: '未报价' }
+  { value: 6, label: '丢失', emoji: '🎈' },
+  { value: 7, label: '取消', emoji: '🚫' },
+  { value: 8, label: '未报价', emoji: '' }
 ]
+export const OrderStatusDefaultOptionsMapped = OrderStatusDefaultOptions.reduce((acc, cur) => {
+  return { ...acc, [String(cur.value)]: cur }
+}, {})
 
 export const RemindStateDefaultOptions = [
   { value: '1', label: '一催' },

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

@@ -11,6 +11,8 @@ import useAuthStore from '@/stores/AuthStore';
 import ChannelLogo from './ChannelLogo';
 import { ReadIcon } from '@/components/Icons';
 import useStyleStore from '@/stores/StyleStore';
+import { OrderLabelDefaultOptionsMapped, OrderStatusDefaultOptionsMapped } from '@/stores/OrderStore';
+import { whatsappMsgTypeMapped } from '@/channel/bubbleMsgUtils';
 
 const TagColorStyle = (tag) => {
   const color = stringToColour(tag);
@@ -24,9 +26,8 @@ const TagColorStyle_2 = (tag, outerStyle = false) => {
 
 const OrderSignEmoji = ({ item }) => (
   <>
-    {item.order_label_id === 240003 ? '❣️' : ''}
-    {item.order_label_id === 240002 ? '❗' : ''}
-    {item.order_state_id === 5 ? '💰' : ''}
+    {OrderLabelDefaultOptionsMapped[String(item.order_label_id)]?.emoji}
+    {OrderStatusDefaultOptionsMapped[String(item.order_state_id)]?.emoji}
     {item.intour === 1 ? '👣' : ''}
   </>
 )
@@ -169,6 +170,14 @@ const ChatListItem = (({item, refreshConversationList,setListUpdateFlag,onSwitch
     return () => {};
   }, [contextMenuOpen])
 
+  const RenderLastMsg = (msg) => {
+    // const _text = isEmpty(msg) ? '' : msg.type === 'text' ? msg.text.body : `[${(msg?.type || '').toUpperCase()}]`;
+    const _text = isEmpty(msg) ? '' : (whatsappMsgTypeMapped?.[msg.type]?.renderForReply(msg) || {})?.message
+    return (
+      <>{_text}</>
+    );
+  };
+
   return (
     <>
       <Dropdown
@@ -272,16 +281,16 @@ const ChatListItem = (({item, refreshConversationList,setListUpdateFlag,onSwitch
             alt={item.whatsapp_name}
             title={(item.top_state === 1 ? '🔝' : '')
               + (item.conversation_memo || item.whatsapp_name || item.whatsapp_phone_number)}
+              // item.conversation_memo ||
             // subtitle={item.coli_id}
             subtitle={
               <div>
                 {/* <ReadIcon /> */}
                 {/* <DeliverIcon /> */}
                 {/* <SentIcon /> */}
-                {/* todo: last message ⤴⤵↗️↖️↘✔️ */}
                 {/* <span>{item.coli_id}</span> */}
                 {/* <span><ReadIcon />最后一条消息</span> */}
-                <span>{item?.last_message?.text?.body || ''}</span>
+                <span><RenderLastMsg {...item?.last_message } /></span>
                 <div className='text-sm'>
                   <OrderSignEmoji item={item} />
                   {(item?.tags || [])?.map((tag) => (
@@ -301,9 +310,10 @@ const ChatListItem = (({item, refreshConversationList,setListUpdateFlag,onSwitch
             // ].join(' ')}
             // statusText={<WhatsAppOutlined key={'channel'} className='text-whatsapp' />}
             statusText={<ChannelLogo channel={flush([
-              item.channels.phone_number ? 'phone' : null,
-              item.channels.email ? 'email' : null,
-              item.channels.whatsapp_phone_number ? 'waba' : null,
+              item?.channels?.phone_number ? 'phone' : null,
+              item?.channels?.email ? 'email' : null,
+              item?.channels?.whatsapp_phone_number ? 'waba' : null,
+              item?.last_message?.type === 'email' ? 'email' : null,
             ])} />}
             statusColor={'#fff'}
             onClick={() => onSwitchConversation(item)}