fix: 模板信息显示

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/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>