fix: 模板信息显示; input 提示; style: ...

src/lib/msgUtils.js

@@ -185,6 +185,26 @@ export const sentMsgTypeMapped = {
       // const footer = msg.template_origin.components?.footer?.[0]?.text || '';
       return {
         ...msg,
+        template: {
+          ...msg.template,
+          components: [
+            ...msg.template.components.filter((com) => !['footer', 'buttons', 'header'].includes(com.type.toLowerCase())),
+            ...(msg.template.components.filter((com) => 'header' === com.type.toLowerCase()).length > 0
+              ? msg.template.components
+                  .filter((com) => 'header' === com.type.toLowerCase())
+                  .map((ele) => ({ type: 'header', parameters: [{ text: ele.text, type: ele.format.toLowerCase(), [ele.format.toLowerCase()]: { link: ele.example.header_url[0] } }] }))
+              : []),
+            ...(msg.template.components.filter((com) => 'buttons' === com.type.toLowerCase()).length > 0
+              ? msg.template.components
+                  .filter((com) => 'buttons' === com.type.toLowerCase())[0]
+                  // .buttons.filter((btns) => ! ['phone_number', 'url'].includes( btns.type.toLowerCase()))
+                  .buttons.filter((btns) => ! isEmpty(btns.example)) // 静态按钮不发
+                  .map((btn, btnI) => ({ type: 'button', sub_type: btn.type.toLowerCase(), index: btnI,
+                  // parameters: [{ text: 'lq1FTtA8', type: 'text' }]
+                }))
+              : []),
+          ],
+        },
         actionId: msg.id,
         conversationid: msg.id.split('.')[0],
         type: 'text',

src/views/Conversations/Components/InputComposer.jsx

@@ -28,24 +28,6 @@ import ExpireTimeClock from './ExpireTimeClock';
 import dayjs from 'dayjs';
 
 const aliOSSHost = `https://haina-sale-system.oss-cn-shenzhen.aliyuncs.com/WAMedia/`;
-/**
- * image
- * ext: ani;bmp;gif;ico;jpe;jpeg;jpg;pcx;png;psd;tga;tif;tiff;wmf
- *
- * audio
- * ext: 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
- * 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 fileTypesExt = {
-  sticker: ['webp'],
-  photo: ['jpeg', 'jpg', 'png'],
-  video: ['gif', 'mp4', '3gp'],
-  document: ['pdf', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'csv'],
-  audio: ['aac', 'mp4', 'm4a', 'mp3', 'amr', 'ogg'],
-};
 
 const InputComposer = ({ mobile }) => {
   const userId = useAuthStore((state) => state.loginUser.userId);
@@ -266,7 +248,7 @@ const InputComposer = ({ mobile }) => {
         maxLength={2000}
         showCount={textabled}
         placeholder={
-          gt24h
+          !textabled
             ? '会话已过期. 请发送打招呼消息激活对话💬.'
             : mobile === undefined
             ? 'Enter 发送, Shift+Enter 换行\n支持复制粘贴 [截图/文件] 以备发送'

src/views/Conversations/Components/MessagesList.jsx

@@ -60,11 +60,11 @@ const MessagesList = ({ messages, handlePreview, reference, longListLoading, get
       <span className={`text-sm leading-5 emoji-text whitespace-pre-wrap ${className} ${extraClass}`} key={'msg-text'}>
         {headerObj ? (
           <div className='text-neutral-500 text-center'>
-            {'text' === headerObj.format.toLowerCase() && <div>{headerObj.text}</div>}
+            {'text' === (headerObj?.parameters?.[0]?.type || '').toLowerCase() && <div>{headerObj.text}</div>}
-            {'image' === headerObj.format.toLowerCase() && <img src={headerObj.example.header_url} height={100}></img>}
+            {'image' === (headerObj?.parameters?.[0]?.type || '').toLowerCase() && <img src={headerObj.parameters[0].image.link} height={100}></img>}
-            {['document', 'video'].includes(headerObj.format.toLowerCase()) && (
+            {['document', 'video'].includes((headerObj?.parameters?.[0]?.type || '').toLowerCase()) && (
-              <a href={headerObj.example.header_url} target='_blank' key={headerObj.format} rel='noreferrer' className='text-sm'>
+              <a href={headerObj.parameters[0][headerObj.parameters[0].type].link} target='_blank' key={headerObj.format} rel='noreferrer' className='text-sm'>
-                [&nbsp;{headerObj.format}&nbsp;]
+                [&nbsp;{headerObj.parameters[0].type}&nbsp;]
               </a>
             )}
           </div>

src/views/Conversations/Conversations.css

@@ -217,9 +217,9 @@
 .chatwindow-wrapper .message-box-focus {
     animation-iteration-count: 2;
     -webkit-animation-iteration-count: 2;
-    -webkit-animation-duration: 1s;
+    -webkit-animation-duration: 2s;
     animation-name: message-box-default-focus-x;
-    animation-duration: 1s;
+    animation-duration: 2s;
 }