开发: 成员聊天页面

src/pages/ChatLogs/components/ChatRedpacket.tsx

@@ -1,8 +1,12 @@
 import { RedEnvelopeFilled } from '@ant-design/icons';
 import { IChatItem } from '../ChatLogsType';
-import styles from './index.module.scss';
 
 export const ChatRedpacket: React.FC<IChatItem> = (props) => {
+  const type: any = {
+    1: '普通红包',
+    2: '拼手气群红包',
+    3: '激励群红包',
+  };
   function content() {
     try {
       const msg = JSON.parse(props.chat?.content as string);
@@ -19,7 +23,9 @@ export const ChatRedpacket: React.FC<IChatItem> = (props) => {
               </div>
             </div>
           </div>
-          <div style={{ borderTop: '1px solid #ddd', marginTop: 12 }}>红包</div>
+          <div style={{ borderTop: '1px solid #ddd', marginTop: 8, paddingTop: 8, color: '#999' }}>
+            {type[msg.type]}
+          </div>
         </div>
       );
     } catch (_e) {
@@ -31,33 +37,13 @@ export const ChatRedpacket: React.FC<IChatItem> = (props) => {
             />
             <div style={{ wordBreak: 'break-all' }}>{props.chat?.content}</div>
           </div>
-          <div style={{ borderTop: '1px solid #ddd', marginTop: 12 }}>红包</div>
+          <div style={{ borderTop: '1px solid #ddd', marginTop: 8, paddingTop: 8, color: '#999' }}>
+            红包
+          </div>
         </div>
       );
     }
   }
 
-  return (
-    <>
-      {props.from?.user_id == props.chat?.msg_from ? (
-        <div className={styles.chatRight}>
-          <div className={styles.chatContentBox}>
-            <div className={styles.name}>{props.from?.name}</div>
-            <div className={styles.content}>{content()}</div>
-          </div>
-          <div className={styles.chatAvatar}>{props.from?.name[0]}</div>
-        </div>
-      ) : (
-        <div className={styles.chatLeft}>
-          <div className={styles.chatAvatar}>
-            <img src={props.to?.cust_info.avatar} alt="" />
-          </div>
-          <div className={styles.chatContentBox}>
-            <div className={styles.name}>{props.to?.cust_info.name}</div>
-            <div className={styles.content}>{content()}</div>
-          </div>
-        </div>
-      )}
-    </>
-  );
+  return <>{content()}</>;
 };