From 43c28618a6a5dad5cb806df629c98ca0550a5072 Mon Sep 17 00:00:00 2001
From: Lei OT <lyt@hainatravel.com>
Date: Tue, 27 Feb 2024 16:18:44 +0800
Subject: [PATCH] =?UTF-8?q?style:=20=E5=9B=BE=E7=89=87=E6=B6=88=E6=81=AF?=
 =?UTF-8?q?=E6=A0=B7=E5=BC=8F;=20=E4=BC=9A=E8=AF=9D=E5=88=97=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/lib/msgUtils.js                                      | 6 +++---
 src/views/Conversations/Components/ConversationsList.jsx | 2 +-
 src/views/Conversations/Components/Input/ImageUpload.jsx | 2 +-
 src/views/Conversations/Components/InputComposer.jsx     | 4 ++--
 src/views/Conversations/Components/Messages.jsx          | 2 +-
 src/views/Conversations/Conversations.css                | 6 ++++++
 6 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/src/lib/msgUtils.js b/src/lib/msgUtils.js
index 9f4eb48..bde7998 100644
--- a/src/lib/msgUtils.js
+++ b/src/lib/msgUtils.js
@@ -185,20 +185,20 @@ export const whatsappMsgTypeMapped = {
     data: (msg) => ({
       id: msg.wamid,
       text: msg.image.caption,
-      data: { id: msg.wamid, uri: msg.image.link, width: 200, height: 200, alt: msg.image.caption,  },
+      data: { id: msg.wamid, uri: msg.image.link, width: '100%', height: 200, alt: msg.image.caption,  },
       onOpen: () => {
         console.log('Open image', msg.image.link);
       },
     }),
     renderForReply: (msg) => ({
-      id: msg.wamid, photoURL: msg.image.link, width: 200, height: 200, alt: '',
+      id: msg.wamid, photoURL: msg.image.link, width: '100%', height: 200, alt: '',
     }),
   },
   sticker: {
     type: 'photo',
     data: (msg) => ({
       id: msg.wamid,
-      data: { id: msg.wamid, uri: msg.sticker.link, width: 150, height: 120, alt: '' },
+      data: { id: msg.wamid, uri: msg.sticker.link, width: '100%', height: 120, alt: '' },
     }),
   },
   video: {
diff --git a/src/views/Conversations/Components/ConversationsList.jsx b/src/views/Conversations/Components/ConversationsList.jsx
index 12ca846..ea345e8 100644
--- a/src/views/Conversations/Components/ConversationsList.jsx
+++ b/src/views/Conversations/Components/ConversationsList.jsx
@@ -118,7 +118,7 @@ const Conversations = () => {
               title={item.whatsapp_name.trim() || item.whatsapp_phone_number}
               date={item.last_received_time}
               unread={item.unread_msg_count}
-              className={String(item.sn) === String(currentConversation.sn) ? '__active text-primary border-y-0 border-e-0 border-s-2 border-solid border-whatsapp-me ' : ''}
+              className={String(item.sn) === String(currentConversation.sn) ? '__active text-primary border-y-0 border-e-0 border-s-4 border-solid border-whatsapp-bg bg-whatsapp-bg' : ''}
               onClick={() => onSwitchConversation(item)}
             />
           </Dropdown>
diff --git a/src/views/Conversations/Components/Input/ImageUpload.jsx b/src/views/Conversations/Components/Input/ImageUpload.jsx
index 357ca40..06a6d6f 100644
--- a/src/views/Conversations/Components/Input/ImageUpload.jsx
+++ b/src/views/Conversations/Components/Input/ImageUpload.jsx
@@ -32,7 +32,7 @@ const ImageUpload = ({ disabled, invokeSendMessage }) => {
   const handleSendImage = (src) => {
     const msgObj = {
       type: 'photo',
-      data: { uri: src, },
+      data: { uri: src, width: '100%', height: 150, },
       id: uuid(),
     };
     setComplexMsg(msgObj);
diff --git a/src/views/Conversations/Components/InputComposer.jsx b/src/views/Conversations/Components/InputComposer.jsx
index 3cd1b08..66c6e17 100644
--- a/src/views/Conversations/Components/InputComposer.jsx
+++ b/src/views/Conversations/Components/InputComposer.jsx
@@ -35,13 +35,13 @@ const InputBox = () => {
 
   const invokeSendMessage = (msgObj) => {
     const msgObjMerge = {
-      id: `${currentConversation.sn}.${uuid()}`,
       sender: 'me',
       to: currentConversation.whatsapp_phone_number,
       date: new Date(),
       status: 'waiting',
       ...(referenceMsg.id ? { context: { message_id: referenceMsg.id }, message_origin: referenceMsg } : {}),
       ...msgObj,
+      id: `${currentConversation.sn}.${uuid()}`,
     };
     console.log('sendMessage------------------', msgObjMerge);
     const contentToSend = sentMsgTypeMapped[msgObjMerge.type].contentToSend(msgObjMerge);
@@ -106,7 +106,7 @@ const InputBox = () => {
       <Flex justify={'space-between'} className=' bg-gray-200 p-1 rounded-b'>
         <Flex gap={4} className='*:text-primary *:rounded-none'>
           <InputTemplate key='templates' disabled={!talkabled} invokeSendMessage={invokeSendMessage} />
-          {/* <InputImageUpload key={'addNewPic'} disabled={!textabled} invokeSendMessage={invokeSendMessage} /> */}
+          <InputImageUpload key={'addNewPic'} disabled={!textabled} invokeSendMessage={invokeSendMessage} />
           {/* <Button type='text' className='' icon={<FolderAddOutlined />} size={'middle'} />
           <Button type='text' className='' icon={<CloudUploadOutlined />} size={'middle'} />
           <Button type='text' className='' icon={<FilePdfOutlined />} size={'middle'} /> */}
diff --git a/src/views/Conversations/Components/Messages.jsx b/src/views/Conversations/Components/Messages.jsx
index eb19a15..f792057 100644
--- a/src/views/Conversations/Components/Messages.jsx
+++ b/src/views/Conversations/Components/Messages.jsx
@@ -56,7 +56,7 @@ const Messages = () => {
           <Dropdown
             key={message.key}
             menu={{
-              items: [{ label: '回复', key: 'reply' }],
+              items: [{ label: '回复', key: 'reply', disabled: !['text'].includes(message.whatsapp_msg_type) }],
               onClick: ({ key, domEvent }) => {
                 domEvent.stopPropagation();
                 switch (key) {
diff --git a/src/views/Conversations/Conversations.css b/src/views/Conversations/Conversations.css
index 4c683f7..d57e6c0 100644
--- a/src/views/Conversations/Conversations.css
+++ b/src/views/Conversations/Conversations.css
@@ -11,6 +11,9 @@
 .chatwindow-wrapper .rce-container-mbox .rce-mbox{
     max-width: 400px;
 }
+.chatwindow-wrapper .rce-citem {
+    background: transparent;
+}
 .chatwindow-wrapper .rce-mbox-time-block{
     background: linear-gradient(0deg,#00000014,#0000);
     color: #00000073;
@@ -21,6 +24,9 @@
 .chatwindow-wrapper .rce-mbox-text:after{
     content: none;
 }
+.chatwindow-wrapper .rce-mbox-photo--img img{
+    width: 100%;
+}
 .chatwindow-wrapper .rce-mbox-photo .rce-mbox-text{
     padding-left: 8px;
 }