MediaUpload: 上传附件文件

src/lib/msgUtils.js

@@ -37,7 +37,11 @@ const mediaMsg = {
     renderId: msg.id,
     to: msg.to,
     msgcontent: {
-      [msg.type]: { link: msg.data.dataUri, ...(msg.text ? { caption: msg.text } : {}) },
+      [msg.type]: {
+        link: msg.data.dataUri,
+        ...(msg.text ? { caption: msg.text } : {}),
+        ...(msg.type === 'document' ? { filename: msg.name } : {})
+      },
       ...(msg.context ? { context: msg.context, message_origin: msg.message_origin.msgOrigin } : {}),
     },
   }),
@@ -126,6 +130,22 @@ export const sentMsgTypeMapped = {
       whatsapp_msg_type: 'video',
     }),
   },
+  document: {
+    type: 'document',
+    contentToSend: (msg) => ({
+      ...mediaMsg.contentToSend(msg),
+      msgtype: 'document',
+    }),
+    contentToRender: (msg) => ({
+      ...msg,
+      ...mediaMsg.contentToRender(msg),
+      text: msg?.name || '',
+      title: msg?.name || '',
+      originText: msg?.name || '',
+      whatsapp_msg_type: 'document',
+      type: 'file',
+    }),
+  },
   whatsappTemplate: {
     contentToSend: (msg) => ({ action: 'message', actionId: msg.id, renderId: msg.id, to: msg.to, msgtype: 'template', msgcontent: msg.template }),
     contentToRender: (msg) => {

src/views/Conversations/Components/Input/MediaUpload.jsx

@@ -2,6 +2,7 @@ import { Upload, Button, message } from 'antd';
 import { FileAddOutlined } from '@ant-design/icons';
 import { v4 as uuid } from 'uuid';
 import { API_HOST } from '@/config';
+import useConversationStore from '@/stores/ConversationStore';
 
 const aliOSSHost = `https://haina-sale-system.oss-cn-shenzhen.aliyuncs.com/WAMedia/`;
 /**
@@ -15,15 +16,19 @@ const aliOSSHost = `https://haina-sale-system.oss-cn-shenzhen.aliyuncs.com/WAMed
  * ext: 3g2;3gp;3gp2;3gpp;amr;amv;asf;avi;bdmv;bik;d2v;divx;drc;dsa;dsm;dss;dsv;evo;f4v;flc;fli;flic;flv;hdmov;ifo;ivf;m1v;m2p;m2t;m2ts;m2v;m4b;m4p;m4v;mkv;mp2v;mp4;mp4v;mpe;mpeg;mpg;mpls;mpv2;mpv4;mov;mts;ogm;ogv;pss;pva;qt;ram;ratdvd;rm;rmm;rmvb;roq;rpm;smil;smk;swf;tp;tpr;ts;vob;vp6;webm;wm;wmp;wmv
  *
  */
-const fileTypes = {
-  'sticker': ['webp'],
-  'photo': ['ani','bmp','ico','jpe','jpeg','jpg','pcx','png','psd','tga','tif','tiff','wmf'],
-  'audio': ['aac','ac3','aif','aifc','aiff','au','cda','dts','fla','flac','it','m1a','m2a','m3u','m4a','mid','midi','mka','mod','mp2','mp3','mpa','ogg','ra','rmi','spc','rmi','snd','umx','voc','wav','wma','xm'],
-  'video': ['gif','3g2','3gp','3gp2','3gpp','amr','amv','asf','avi','bdmv','bik','d2v','divx','drc','dsa','dsm','dsv','evo','f4v','flc','fli','flic','flv','hdmov','ifo','ivf','m1v','m2p','m2t','m2ts','m2v','m4b','m4p','m4v','mkv','mp2v','mp4','mp4v','mpe','mpeg','mpg','mpls','mpv2','mpv4','mov','mts','ogm','ogv','pss','pva','qt','ram','ratdvd','rm','rmm','rmvb','roq','rpm','smil','smk','swf','tp','tpr','ts','vob','vp6','webm','wm','wmp','wmv'],
+const fileTypesExt = {
+  sticker: ['webp'],
+  photo: ['jpeg','jpg','png',],
+  audio: ['aac','mp4','m4a','mp3','amr','ogg',],
+  video: ['gif','mp4','3gp',],
+  document: ['pdf','doc','docx','xls','xlsx','ppt','pptx','txt','csv'],
 };
 
 const ImageUpload = ({ disabled, invokeUploadFileMessage, invokeSendUploadMessage }) => {
 
+  // const setComplexMsg = useConversationStore(state => state.setComplexMsg);
+  // const complexMsg = useConversationStore(state => state.complexMsg);
+
   const beforeUpload = async (file) => {
     // 使用 FileReader 读取文件对象
     const reader = new FileReader();
@@ -31,15 +36,15 @@ const ImageUpload = ({ disabled, invokeUploadFileMessage, invokeSendUploadMessag
     reader.onload = (event) => {
       const previewSrc = event.target.result;
       const suffix = file.name.slice(file.name.lastIndexOf('.')+1);
-      const type = Object.keys(fileTypes).find((type) => fileTypes[type].includes(suffix));
+      const type = Object.keys(fileTypesExt).find((type) => fileTypesExt[type].includes(suffix));
       const name = file.name;
-      // const filename = Date.now() + suffix;
+      const rename = Date.now() + '.' + suffix;
       const dataUri = aliOSSHost + file.name;
       const msgObj = {
         type: type,
-        name: name,
+        name: file.name,
         // status: 'loading',
-        data: { uri: previewSrc, dataUri: dataUri, width: '100%', height: 150, loading: 0.01 },
+        data: { uri: previewSrc, dataUri: dataUri, link: dataUri, width: '100%', height: 150, loading: 0.01 },
         id: uuid(),
       };
       file.msgData = msgObj;

src/views/Conversations/Components/InputComposer.jsx

@@ -54,12 +54,12 @@ const InputComposer = () => {
       ...msgObj,
       id: `${currentConversation.sn}.${uuid()}`,
     };
-    olog('sendMessage------------------', msgObjMerge)
+    // olog('sendMessage------------------', msgObjMerge)
     const contentToSend = sentMsgTypeMapped[msgObjMerge.type].contentToSend(msgObjMerge);
-    console.log('content to send-------------------------------------', contentToSend);
+    // console.log('content to send-------------------------------------', contentToSend);
     websocket.sendMessage({ ...contentToSend, opi_sn: userId, coli_sn: currentConversation.coli_sn });
     const contentToRender = sentMsgTypeMapped[msgObjMerge.type].contentToRender(msgObjMerge);
-    console.log(contentToRender, 'contentToRender  sendMessage------------------');
+    // console.log(contentToRender, 'contentToRender  sendMessage------------------');
     sentOrReceivedNewMessage(contentToRender.conversationid, contentToRender);
 
     setTextContent('');
@@ -81,7 +81,9 @@ const InputComposer = () => {
       ...msgObj,
       id: `${currentConversation.sn}.${msgObj.id}`,
     };
+    // olog('invoke upload', msgObjMerge)
     const contentToRender = sentMsgTypeMapped[msgObjMerge.type].contentToRender(msgObjMerge);
+    // console.log(contentToRender, 'contentToRender  sendMessage------------------');
     sentOrReceivedNewMessage(contentToRender.conversationid, contentToRender);
   };
 
@@ -97,6 +99,7 @@ const InputComposer = () => {
       id: `${currentConversation.sn}.${msgObj.id}`,
     };
     const contentToSend = sentMsgTypeMapped[msgObjMerge.type].contentToSend(msgObjMerge);
+    // olog('invoke upload send +++ ', contentToSend)
     websocket.sendMessage({ ...contentToSend, opi_sn: userId, coli_sn: currentConversation.coli_sn });
   }
 

src/views/Conversations/Components/MessagesList.jsx

@@ -47,7 +47,7 @@ const MessagesList = ({ reference, ...props }) => {
         return false;
 
       case 'file':
-        window.open(msg.data.uri, '_blank', 'noopener,noreferrer');
+        window.open(msg.data.link || msg.data.uri, '_blank', 'noopener,noreferrer');
         return false;
 
       default: