perf(前端): wai 发消息

src/channel/bubbleMsgUtils.js

@@ -81,6 +81,7 @@ const mediaMsg = {
     action: 'message',
     actionId: msg.id,
     renderId: msg.id,
+    externalId: msg.externalId,
     to: msg.to,
     from: msg.from,
     msgcontent: {
@@ -116,6 +117,7 @@ export const sentMsgTypeMapped = {
       action: 'message',
       actionId: msg.id,
       renderId: msg.id,
+      externalId: msg.externalId,
       to: msg.to,
       from: msg.from,
       msgtype: 'text',
@@ -199,6 +201,7 @@ export const sentMsgTypeMapped = {
       action: 'message',
       actionId: msg.id,
       renderId: msg.id,
+      externalId: msg.externalId,
       to: msg.to,
       from: msg.from,
       msgtype: 'template',

src/views/Conversations/Online/Input/InputComposer.jsx

@@ -78,7 +78,7 @@ const InputComposer = ({ channel, currentActive }) => {
     }
 
     return () => {}
-  }, [channel, whatsAppBusiness])
+  }, [channel, whatsAppBusiness, whatsAppNo])
 
   useEffect(() => {
     const _to = currentConversation.whatsapp_phone_number || currentConversation.channel?.whatsapp_phone_number || currentConversation.channel?.phone_number // || customerDetail.whatsapp_phone_number
@@ -89,10 +89,11 @@ const InputComposer = ({ channel, currentActive }) => {
 
   const textInputRef = useRef(null);
   const [textContent, setTextContent] = useState('');
+  const [sendBtnLoading, setSendBtnLoading] = useState(false);
 
   const invokeSendMessage = async (msgObj) => {
     if (isEmpty(toIM)) {
-      appNotification.warning({ message: '缺少WhatsApp号码, 请先在会话列表右键菜单编辑联系人', placement: 'top' });
+      appNotification.warning({ message: '缺少WhatsApp号码', description: '请先在会话列表右键菜单编辑联系人, 补充WhatsApp号码', placement: 'bottom' });
       return false
     }
     const msgObjMerge = {
@@ -102,22 +103,25 @@ const InputComposer = ({ channel, currentActive }) => {
       from: fromIM,
       date: new Date(),
       status: 'waiting',
-      ...(referenceMsg.id ? { context: { message_id: referenceMsg.id }, message_origin: referenceMsg, from: referenceMsg.waba } : {}),
+      ...(referenceMsg.id ? { context: { message_id: referenceMsg.id }, message_origin: referenceMsg, } : {}),
       ...msgObj,
       id: `${currentConversation.sn}.${uuid()}`,
       msg_source: channel,
       wabaName: channel === 'waba' ? WABAccountsMapped[fromIM]?.verifiedName : '',
       externalId: currentConversation.sn || ''
     };
-    // olog('sendMessage------------------', msgObjMerge)
+    // console.log('sendMessage------------------', msgObjMerge)
     const contentToSend = sentMsgTypeMapped[msgObjMerge.type].contentToSend(msgObjMerge);
     // console.log('content to send-------------------------------------', contentToSend);
 
     if (channel === 'wai') {
       try {
+        setSendBtnLoading(true);
         await postSendMsg({...contentToSend, });
+        setSendBtnLoading(false);
       } catch (error) {
-        appNotification.error({ message: error.message || '发送失败', placement: 'bottom', duration: 6, });
+        setSendBtnLoading(false);
+        appNotification.error({ message: '发送失败', description: error.message, placement: 'bottom', duration: 6, });
         // appMessage.error(error.message || '发送失败');
         return false;
       }
@@ -155,9 +159,9 @@ const InputComposer = ({ channel, currentActive }) => {
     sentOrReceivedNewMessage(contentToRender.conversationid, contentToRender);
   };
 
-  const invokeSendUploadMessage = (msgObj) => {
+  const invokeSendUploadMessage = async (msgObj) => {
     if (isEmpty(toIM)) {
-      appNotification.warning({ message: '缺少WhatsApp号码, 请先在会话列表右键菜单编辑联系人', placement: 'top' });
+      appNotification.warning({ message: '缺少WhatsApp号码', description: '请先在会话列表右键菜单编辑联系人, 补充WhatsApp号码', placement: 'bottom' });
       return false
     }
     const msgObjMerge = {
@@ -175,7 +179,20 @@ const InputComposer = ({ channel, currentActive }) => {
     };
     const contentToSend = sentMsgTypeMapped[msgObjMerge.type].contentToSend(msgObjMerge);
     // olog('invoke upload send +++ ', contentToSend)
-    websocket.sendMessage({ ...contentToSend, opi_sn: userId, coli_sn: currentConversation.coli_sn || '', conversationid: currentConversation.sn, });
+    if (channel === 'wai') {
+      try {
+        setSendBtnLoading(true);
+        await postSendMsg({...contentToSend, });
+        setSendBtnLoading(false);
+      } catch (error) {
+        setSendBtnLoading(false);
+        appNotification.error({ message: '发送失败', description: error.message, placement: 'bottom', duration: 6, });
+        // appMessage.error(error.message || '发送失败');
+        return false;
+      }
+    } else if (channel === 'waba') {
+      websocket.sendMessage({ ...contentToSend, opi_sn: userId, coli_sn: currentConversation.coli_sn || '', conversationid: currentConversation.sn, });
+    }
   };
 
   const [pastedUploading, setPastedUploading] = useState(false);
@@ -368,6 +385,7 @@ const InputComposer = ({ channel, currentActive }) => {
             onClick={handleSendText}
             type='primary'
             size='middle'
+            loading={sendBtnLoading}
             icon={<SendOutlined />}
             disabled={!textabled || pastedUploading}
             className={ButtonStyleClsMapped[channel]