diff --git a/src/channel/bubbleMsgUtils.js b/src/channel/bubbleMsgUtils.js
index 1d20635..c23303f 100644
--- a/src/channel/bubbleMsgUtils.js
+++ b/src/channel/bubbleMsgUtils.js
@@ -2,6 +2,50 @@ import { cloneDeep, isEmpty, olog, fixTo2Decimals, pick } from "@/utils/commons"
import dayjs from "dayjs";
import { v4 as uuid } from "uuid";
+function removeFirstPlus(str) {
+ if (str.startsWith('+')) {
+ return str.slice(1);
+ }
+ return str;
+}
+
+export const WABAccounts = [
+ {
+ "id": "217973041403372",
+ "phoneNumber": "+8618174165365",
+ "wabaId": "190290134156880",
+ "verifiedName": "Global Highlights Multilanguage",
+ "qualityRating": "GREEN",
+ "messagingLimit": "TIER_1K",
+ "isOfficialBusinessAccount": false,
+ "codeVerificationStatus": "EXPIRED",
+ "status": "CONNECTED",
+ "displayPhoneNumber": "+86 181 7416 5365",
+ "nameStatus": "APPROVED",
+ "newNameStatus": "NONE"
+ },
+ {
+ "id": "160079783860667",
+ "phoneNumber": "+8617607730395",
+ "wabaId": "190290134156880",
+ "verifiedName": "Global Highlights",
+ "qualityRating": "GREEN",
+ "messagingLimit": "TIER_1K",
+ "isOfficialBusinessAccount": false,
+ "codeVerificationStatus": "EXPIRED",
+ "status": "CONNECTED",
+ "displayPhoneNumber": "+86 176 0773 0395",
+ "nameStatus": "APPROVED",
+ "newNameStatus": "NONE",
+ "decision": "DEFERRED",
+ "requestedVerifiedName": "Global Highlights",
+ "rejectionReason": "NONE"
+ }
+];
+export const WABAccountsMapped = WABAccounts.reduce((a, c) => ({ ...a, [removeFirstPlus(c.phoneNumber)]: c, [c.phoneNumber]: c }), {})
+console.log(WABAccountsMapped);
+
+
export const replaceTemplateString = (str, replacements) => {
let result = str;
let keys = str.match(/{{(.*?)}}/g).map(key => key.replace(/{{|}}/g, ''));
@@ -40,6 +84,7 @@ const mediaMsg = {
actionId: msg.id,
renderId: msg.id,
to: msg.to,
+ from: msg.from,
msgcontent: {
[msg.type]: {
link: msg.data.dataUri,
@@ -74,6 +119,7 @@ export const sentMsgTypeMapped = {
actionId: msg.id,
renderId: msg.id,
to: msg.to,
+ from: msg.from,
msgtype: 'text',
msgcontent: { body: msg.text, preview_url: true, ...(msg.context ? { context: msg.context, message_origin: msg.message_origin?.msgOrigin || msg.message_origin } : {}) },
}),
@@ -156,6 +202,7 @@ export const sentMsgTypeMapped = {
actionId: msg.id,
renderId: msg.id,
to: msg.to,
+ from: msg.from,
msgtype: 'template',
msgcontent: {
...msg.template,
diff --git a/src/views/Conversations/Online/Components/BubbleIM.jsx b/src/views/Conversations/Online/Components/BubbleIM.jsx
index b7d54a0..46fd9e0 100644
--- a/src/views/Conversations/Online/Components/BubbleIM.jsx
+++ b/src/views/Conversations/Online/Components/BubbleIM.jsx
@@ -7,6 +7,7 @@ import useConversationStore from '@/stores/ConversationStore';
import { useShallow } from 'zustand/react/shallow';
import { WABIcon } from '@/components/Icons';
import ChannelLogo from './ChannelLogo';
+import { WABAccountsMapped } from '@/channel/bubbleMsgUtils';
const BubbleIM = ({ handlePreview, handleContactClick, setNewChatModalVisible, setNewChatFormValues, scrollToMessage, focusMsg, ...message }) => {
const { message: appMessage } = App.useApp();
@@ -113,11 +114,10 @@ const BubbleIM = ({ handlePreview, handleContactClick, setNewChatModalVisible, s
// styles: { backgroundColor: '#ccd4ae' },
notchStyle: { fill: '#ccd4ae' }, // todo: channel[WhatsApp] color '#d9fdd3'
replyButton: ['text', 'document', 'image'].includes(message.whatsapp_msg_type) && message.status !== 'failed' ? true : false,
- // title: <> Global Highlights, // test: 0
- title: <> Global Highlights,
+ title: <> {WABAccountsMapped[message.from]?.verifiedName},
}
: {
- title: <>{message.title},
+ title: <> {message.title},
})}
className={[
'whitespace-pre-wrap',
diff --git a/src/views/Conversations/Online/Input/InputComposer.jsx b/src/views/Conversations/Online/Input/InputComposer.jsx
index 37f120b..8e75df4 100644
--- a/src/views/Conversations/Online/Input/InputComposer.jsx
+++ b/src/views/Conversations/Online/Input/InputComposer.jsx
@@ -1,5 +1,6 @@
import React, { useState, useRef, useEffect } from 'react';
import { App, Input, Flex, Button, Image, Tooltip } from 'antd';
+import PropTypes from 'prop-types';
// import { Input } from 'react-chat-elements';
import useAuthStore from '@/stores/AuthStore';
import useConversationStore from '@/stores/ConversationStore';
@@ -25,12 +26,13 @@ const ButtonStyleClsMapped =
{
'waba': 'bg-waba shadow shadow-waba-300 hover:!bg-waba-400 active:bg-waba-400 focus:bg-waba-400',
'whatsapp': 'bg-whatsapp shadow shadow-whatsapp-300 hover:!bg-whatsapp-400 active:bg-whatsapp-400 focus:bg-whatsapp-400',
+ 'wa': 'bg-whatsapp shadow shadow-whatsapp-300 hover:!bg-whatsapp-400 active:bg-whatsapp-400 focus:bg-whatsapp-400',
};
-const InputComposer = ({ isWABA, channel }) => {
+const InputComposer = ({ channel }) => {
const [mobile] = useStyleStore((state) => [state.mobile]);
- const userId = useAuthStore((state) => state.loginUser.userId);
+ const {userId, whatsAppBusiness} = useAuthStore((state) => state.loginUser);
const [openPaymentDrawer] = useOrderStore((state) => [state.openDrawer])
const websocket = useConversationStore((state) => state.websocket);
@@ -62,6 +64,24 @@ const InputComposer = ({ isWABA, channel }) => {
? 'Enter 发送, Shift+Enter 换行'
: 'Enter 换行';
+ const [fromIM, setFromIM] = useState('');
+ useEffect(() => {
+ switch (channel) {
+ case 'waba':
+ setFromIM(whatsAppBusiness)
+ break
+ case 'wa':
+ setFromIM('') // todo: 个人WhatsApp号
+ break
+
+ default:
+ break
+ }
+
+ return () => {}
+ }, [channel, whatsAppBusiness])
+
+
const textInputRef = useRef(null);
const [textContent, setTextContent] = useState('');
@@ -70,6 +90,7 @@ const InputComposer = ({ isWABA, channel }) => {
sender: 'me',
senderName: 'me',
to: currentConversation.whatsapp_phone_number,
+ from: fromIM,
date: new Date(),
status: 'waiting',
...(referenceMsg.id ? { context: { message_id: referenceMsg.id }, message_origin: referenceMsg } : {}),
@@ -114,6 +135,7 @@ const InputComposer = ({ isWABA, channel }) => {
sender: 'me',
senderName: 'me',
to: currentConversation.whatsapp_phone_number,
+ from: fromIM,
date: new Date(),
status: 'waiting',
...(referenceMsg.id ? { context: { message_id: referenceMsg.id }, message_origin: referenceMsg } : {}),
@@ -331,4 +353,6 @@ const InputComposer = ({ isWABA, channel }) => {
);
};
+InputComposer.PropTypes = { channel: PropTypes.oneOf(['waba', 'wa']) };
+
export default InputComposer;
diff --git a/src/views/Conversations/Online/ReplyWrapper.jsx b/src/views/Conversations/Online/ReplyWrapper.jsx
index a964e08..d59101f 100644
--- a/src/views/Conversations/Online/ReplyWrapper.jsx
+++ b/src/views/Conversations/Online/ReplyWrapper.jsx
@@ -9,12 +9,8 @@ import { useShallow } from 'zustand/react/shallow';
import useStyleStore from '@/stores/StyleStore';
import { isEmpty } from '@/utils/commons';
import { DEFAULT_CHANNEL } from '@/config';
+import { WABAccounts, WABAccountsMapped } from '@/channel/bubbleMsgUtils';
-const Wabas = [
- { key: 'Global Highlights', label: 'Global Highlights' },
- { key: 'Global Highlights-Multi', label: 'Global Highlights-Multi' },
-];
-const Wabas_mapped = Wabas.reduce((acc, cur) => ({...acc, [cur.key]: cur}), {});
/**
* @ignore
* 不在此处配置, 在个人档案页面配置
@@ -26,11 +22,11 @@ const WABASwitcher = ({ onSelect, }) => {
// trigger={['contextMenu', 'hover']}
selectable
menu={{
- items: Wabas,
+ items: WABAccounts.map(ele => ({ key: ele.phoneNumber, label: ele.verifiedName })),
onClick: ({ key, domEvent, ...x }) => {
domEvent.stopPropagation();
- setPickV(Wabas_mapped[key]);
- onSelect?.(Wabas_mapped[key]);
+ setPickV(WABAccountsMapped[key]);
+ onSelect?.(WABAccountsMapped[key]);
},
}}>
@@ -85,4 +81,5 @@ const ReplyWrapper = () => {
);
};
+
export default ReplyWrapper;