@tencentcloud/ai-desk-customer-vue 1.3.0 → 1.4.0

package/components/CustomerServiceChat/message-input-toolbar/index-web.vue

@@ -11,20 +11,48 @@
         !isPC && 'message-input-toolbar-h5-list',
       ]"
     >
-      <EmojiPicker
-        ref="emojiPickerRef"
-        @insertEmoji="insertEmoji"
-        @dialogShowInH5="dialogShowInH5"
-        @dialogCloseInH5="dialogCloseInH5"
-        @changeToolbarDisplayType="
-          (type) => emits('changeToolbarDisplayType', type)
-        "
-        :isH5EmojiShow="isH5EmojiShow"
-        @sendMessage="sendMessage"
-      />
-      <ImageUpload imageSourceType="album" :isH5ToolShow="isH5ToolShow"/>
-      <FileUpload :isH5ToolShow="isH5ToolShow"/>
-      <!-- <VideoUpload videoSourceType="album" /> -->
+      <template v-if="props.inputToolbarList === undefined">
+        <EmojiPicker
+          v-if="isPC"
+          ref="emojiPickerRef"
+          @insertEmoji="insertEmoji"
+          @dialogShowInH5="dialogShowInH5"
+          @dialogCloseInH5="dialogCloseInH5"
+          @changeToolbarDisplayType="
+            (type) => emits('changeToolbarDisplayType', type)
+          "
+          :isH5EmojiShow="isH5EmojiShow"
+          @sendMessage="sendMessage"
+        />
+        <ImageUpload imageSourceType="album" :isH5ToolShow="isH5ToolShow"/>
+        <FileUpload :isH5ToolShow="isH5ToolShow"/>
+      </template>
+      <template v-else v-for="(item, index) in props.inputToolbarList" :key="index">
+        <EmojiPicker
+          v-if="isPC && item.presetId === INPUT_TOOLBAR_TYPE.EMOJI && item.isEnabled === 1"
+          ref="emojiPickerRef"
+          @insertEmoji="insertEmoji"
+          @dialogShowInH5="dialogShowInH5"
+          @dialogCloseInH5="dialogCloseInH5"
+          @changeToolbarDisplayType="
+            (type) => emits('changeToolbarDisplayType', type)
+          "
+          :isH5EmojiShow="isH5EmojiShow"
+          @sendMessage="sendMessage"
+        />
+        <ImageUpload v-else-if="item.presetId === INPUT_TOOLBAR_TYPE.IMAGE && item.isEnabled === 1" imageSourceType="album" :isH5ToolShow="isH5ToolShow"/>
+        <FileUpload v-else-if="item.presetId === INPUT_TOOLBAR_TYPE.FILE && item.isEnabled === 1" :isH5ToolShow="isH5ToolShow"/>
+        <VideoUpload v-else-if="item.presetId === INPUT_TOOLBAR_TYPE.VIDEO && item.isEnabled === 1" videoSourceType="album" :isH5ToolShow="isH5ToolShow"/>
+        <RatingTool v-else-if="item.presetId === INPUT_TOOLBAR_TYPE.RATING && item.isEnabled === 1 && isInHumanService" :isH5ToolShow="isH5ToolShow"/>
+        <UserDefineTool
+          v-else-if="item.isEnabled === 1 && item.isPreset === 0 && item.presetId !== INPUT_TOOLBAR_TYPE.EMOJI"
+          :isH5ToolShow="isH5ToolShow"
+          :title="item.title"
+          :icon="item.icon"
+          :type="item.type"
+          :content="item.content"
+        />
+      </template>
     </div>
     <div
       v-if="isH5"
@@ -44,14 +72,18 @@ import EmojiPicker from './emoji-picker/index.vue';
 import ImageUpload from './image-upload/index.vue';
 import FileUpload from './file-upload/index.vue';
 import VideoUpload from './video-upload/index.vue';
+import RatingTool from './rating-tool/index.vue';
 import { isPC, isH5 } from '../../../utils/env';
-import { ToolbarDisplayType } from '../../../interface';
+import { ToolbarDisplayType, InputToolbarModel } from '../../../interface';
+import UserDefineTool from './user-define-input-tool.vue'
+import { INPUT_TOOLBAR_TYPE } from '../../../constant';
 const { ref, onMounted, onUnmounted, watch } = vue;
 
 interface IProps {
   displayType: ToolbarDisplayType;
-  isH5EmojiShow?:boolean;
-  isH5ToolShow?:boolean;
+  isH5EmojiShow?: boolean;
+  isH5ToolShow?: boolean;
+  inputToolbarList?: InputToolbarModel[];
 }
 interface IEmits {
   (e: 'scrollToLatestMessage'): void;
@@ -70,17 +102,24 @@ const h5Dialog = ref<HTMLElement>();
 const currentConversation = ref<IConversationModel>();
 const isGroup = ref<boolean>(false);
 const emojiPickerRef = ref<InstanceType<typeof EmojiPicker>>();
+const isInHumanService = ref(false);
 
 onMounted(() => {
   TUIStore.watch(StoreName.CONV, {
     currentConversation: onCurrentConversationUpdate,
   });
+  TUIStore.watch(StoreName.CUSTOM, {
+    isInHumanService: onInHumanServiceUpdate,
+  });
 });
 
 onUnmounted(() => {
   TUIStore.unwatch(StoreName.CONV, {
     currentConversation: onCurrentConversationUpdate,
   });
+  TUIStore.unwatch(StoreName.CUSTOM, {
+    isInHumanService: onInHumanServiceUpdate,
+  });
 });
 
 watch(
@@ -99,7 +138,7 @@ watch(
   (newValue) => {
     if (newValue === false) {
       emojiPickerRef.value?.closeEmojiPicker();
-    } 
+    }
   },
 );
 
@@ -109,6 +148,10 @@ const onCurrentConversationUpdate = (conversation: IConversationModel) => {
     = currentConversation?.value?.type === TUIChatEngine.TYPES.CONV_GROUP;
 };
 
+const onInHumanServiceUpdate = (value: boolean) => {
+  isInHumanService.value = value;
+};
+
 const insertEmoji = (emojiObj: object) => {
   emits('insertEmoji', emojiObj);
 };

package/components/CustomerServiceChat/message-input-toolbar/rating-tool/index.vue

@@ -0,0 +1,72 @@
+<template>
+  <ToolbarItemContainer
+    :iconFile="getIcon()"
+    :title="props.title"
+    :iconWidth="isPC ? '20px' : '25px'"
+    :iconHeight="isPC ? '20px' : '25px'"
+    :needDialog="false"
+    @onIconClick="onIconClick"
+    :isH5ToolShow="isH5ToolShow"
+  />
+</template>
+<script lang="ts" setup>
+import {
+  TUIChatService,
+  TUIStore,
+  StoreName,
+  IConversationModel,
+  TUITranslateService,
+} from '@tencentcloud/chat-uikit-engine';
+import vue from '../../../../adapter-vue';
+import { isPC, isH5 } from '../../../../utils/env';
+import ToolbarItemContainer from '../toolbar-item-container/index.vue';
+import ratingToolIcon from '../../../../assets/rating_tool_icon.svg'
+import ratingToolIconH5 from '../../../../assets/rating_tool_icon_h5.svg';
+import { getTo } from '../../../../utils/utils';
+import { CUSTOM_MESSAGE_SRC } from '../../../../constant';
+const { ref, onMounted, onUnmounted } = vue;
+
+const props = defineProps({
+  isH5ToolShow:{
+    type: Boolean,
+    default: false,
+  },
+  title: {
+    type: String,
+    default: TUITranslateService.t('AIDesk.提交评价')
+  },
+  icon: {
+    type: String,
+    default: '',
+  }
+});
+
+const currentConversation = ref<IConversationModel>();
+
+TUIStore.watch(StoreName.CONV, {
+  currentConversation: (conversation: IConversationModel) => {
+    currentConversation.value = conversation;
+  },
+});
+
+const getIcon = (): string => {
+  return isH5 ? ratingToolIconH5 : ratingToolIcon;
+}
+
+const onIconClick = () => {
+  TUIChatService.sendCustomMessage({
+    to: getTo(currentConversation?.value),
+    conversationType: currentConversation?.value?.type,
+    payload:{
+      data:JSON.stringify({
+        src: CUSTOM_MESSAGE_SRC.USER_SATISFACTION,
+        customerServicePlugin: 0,
+      }),
+    },
+  },{ onlineUserOnly: true })
+};
+</script>
+
+<style lang="scss" scoped>
+@import "../../style/common";
+</style>

package/components/CustomerServiceChat/message-input-toolbar/toolbar-item-container/style/h5.scss

@@ -6,11 +6,20 @@
   margin-right:15px;
   &-title {
     margin-top:5px;
+    font-size: 14px;
+    white-space: nowrap;
+    max-width: 85px;
+    overflow: hidden;
+    text-overflow: ellipsis;
   }
   &-icon{
     background-color: #fff;
-    padding:20px;
+    width: 40px;
     border-radius: 10px;
+    height: 40px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
   }
   &-dialog {
     position: static !important;

package/components/CustomerServiceChat/message-input-toolbar/user-define-input-tool.vue

@@ -0,0 +1,80 @@
+<template>
+  <ToolbarItemContainer
+    :iconFile="getIcon()"
+    :title="props.title"
+    :iconWidth="isPC ? '20px' : '25px'"
+    :iconHeight="isPC ? '20px' : '25px'"
+    :needDialog="false"
+    @onIconClick="onIconClick"
+    :isH5ToolShow="isH5ToolShow">
+    <div :class="['image-upload', !isPC && 'image-upload-h5', 'image-video']">
+    </div>
+  </ToolbarItemContainer>
+</template>
+<script lang="ts" setup>
+import {
+  TUIChatService,
+  TUIStore,
+  StoreName,
+  IConversationModel,
+} from '@tencentcloud/chat-uikit-engine';
+import vue from '../../../adapter-vue';
+import { isPC } from '../../../utils/env';
+import ToolbarItemContainer from './toolbar-item-container/index.vue';
+import { isEnabledMessageReadReceiptGlobal, openSafeUrl, getTo } from '../../../utils/utils';
+const { ref } = vue;
+
+const props = defineProps({
+  isH5ToolShow: {
+    type: Boolean,
+    default: false,
+  },
+  title: {
+    type: String,
+    default: ''
+  },
+  icon: {
+    type: String,
+    default: '',
+  },
+  type: {
+    type: Number,
+    default: 1
+  },
+  content: {
+    type: String,
+    default: ''
+  }
+});
+
+const currentConversation = ref<IConversationModel>();
+
+TUIStore.watch(StoreName.CONV, {
+  currentConversation: (conversation: IConversationModel) => {
+    currentConversation.value = conversation;
+  },
+});
+
+const getIcon = (): string => {
+  return props.icon;
+}
+
+const onIconClick = () => {
+  if (props.type === 1 && props.content) {
+    TUIChatService.sendTextMessage({
+      to: getTo(currentConversation?.value),
+      conversationType: currentConversation?.value?.type,
+      payload: {
+        text: props.content
+      },
+      needReadReceipt: isEnabledMessageReadReceiptGlobal(),
+    });
+  } else if (props.type === 2 && props.content) {
+    openSafeUrl(props.content);
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+@import "../style/common";
+</style>

package/components/CustomerServiceChat/message-input-toolbar/video-upload/index.vue

@@ -3,8 +3,8 @@
     :iconFile="handleIcon()"
     :title="handleTitle()"
     :needDialog="false"
-    iconWidth='21px'
-    iconHeight='18px'
+    iconWidth='20px'
+    iconHeight='20px'
     @onIconClick="onIconClick"
   >
     <div :class="['video-upload', !isPC && 'video-upload-h5']">
@@ -32,8 +32,9 @@ import {
 import vue from '../../../../adapter-vue';
 import { isPC } from '../../../../utils/env';
 import ToolbarItemContainer from '../toolbar-item-container/index.vue';
-import videoIcon from '../../../../assets/video.png';
-import { isEnabledMessageReadReceiptGlobal } from '../../../../utils/utils';
+import videoIcon from '../../../../assets/video.svg';
+import videoIconH5 from '../../../../assets/video_h5.svg'
+import { isEnabledMessageReadReceiptGlobal, getTo } from '../../../../utils/utils';
 const { ref } = vue;
 
 const props = defineProps({
@@ -56,19 +57,15 @@ TUIStore.watch(StoreName.CONV, {
 });
 
 const handleIcon = (): string => {
-    return videoIcon;
-  
+  return isPC ? videoIcon :  videoIconH5;
 };
 
 const handleTitle = (): string => {
-
-    return '视频';
-  
+  return TUITranslateService.t('视频');
 };
 
 const onIconClick = () => {
-    inputRef?.value?.click && inputRef?.value?.click();
-  
+  inputRef?.value?.click && inputRef?.value?.click();
 };
 
 const sendVideoInWeb = (e: any) => {
@@ -84,9 +81,7 @@ const sendVideoMessage = (file: any) => {
     return;
   }
   const options = {
-    to:
-      currentConversation?.value?.groupProfile?.groupID
-      || currentConversation?.value?.userProfile?.userID,
+    to: getTo(currentConversation?.value),
     conversationType: currentConversation?.value?.type,
     payload: {
       file,

package/components/CustomerServiceChat/message-list/index-web.vue

@@ -217,8 +217,9 @@ import {
   isEnabledMessageReadReceiptGlobal,
   deepCopy,
 } from '../../../utils/utils';
-import { isMessageInvisible, isThinkingMessage, isThinkingMessageOverTime } from '../../../utils/index';
+import { isMessageInvisible, isThinkingMessage, isThinkingMessageOverTime, JSONToObject } from '../../../utils/index';
 import { isCustomerConversation } from '../../../index';
+import { CUSTOM_MESSAGE_SRC } from '../../../constant';
 
 interface ScrollConfig {
   scrollToMessage?: IMessageModel;
@@ -290,9 +291,9 @@ onMounted(() => {
     messageList: onMessageListUpdated,
     messageSource: onMessageSourceUpdated,
     isCompleted: isCompletedUpdated,
+    newMessageList: onNewMessageList,
   });
 
-
   TUIStore.watch(StoreName.CUSTOM, {
     isShowMessagePopMenu: isShowMessagePopMenuUpdated,
   });
@@ -329,6 +330,29 @@ onUnmounted(() => {
   observer = null;
 });
 
+function onNewMessageList(list: IMessageModel[]) {
+  list.forEach((message:IMessageModel) => {
+    if (message?.type === TUIChatEngine.TYPES.MSG_CUSTOM) {
+      const data = JSONToObject(message?.payload?.data);
+      if (data?.src === CUSTOM_MESSAGE_SRC.SEAT_STATUS) {
+        if (data?.content.command === "updateSeatStatus") {
+          if (data.content.content === 'inSeat') {
+            TUIStore.update(StoreName.CUSTOM, "isInHumanService", true);
+          } else if (data.content.content === 'outSeat') {
+            TUIStore.update(StoreName.CUSTOM, "isInHumanService", false);
+          }
+        }
+      } else if (data?.src === CUSTOM_MESSAGE_SRC.TYPING_STATE) {
+        if (data?.typingStatus === 1) {
+          TUIStore.update(StoreName.CUSTOM, 'isTyping', true);
+        } else {
+          TUIStore.update(StoreName.CUSTOM, 'isTyping', false);
+        }
+      }
+    }
+  });
+}
+
 async function onMessageListUpdated(list: IMessageModel[]) {
   if (!isCustomerConversation(currentConversationID.value)) {
     return;
@@ -370,7 +394,6 @@ async function onMessageListUpdated(list: IMessageModel[]) {
     await scrollToPosition({
       scrollToOffset: { bottom: beforeHistoryGetScrollHeight.value },
     });
-    beforeHistoryGetScrollHeight.value = 0;
   } else if (
     scrollButtonInstanceRef.value?.isScrollButtonVisible
     && newLastMessage?.flow === 'in'
@@ -425,8 +448,7 @@ async function scrollToPosition(config: ScrollConfig = {}): Promise<void> {
         if (config.scrollToOffset?.top) {
           container!.scrollTop = config.scrollToOffset.top;
         } else if (config.scrollToOffset?.bottom) {
-          container!.scrollTop
-            = container!.scrollHeight - config.scrollToOffset.bottom;
+          container!.scrollTop = container!.scrollHeight - config.scrollToOffset.bottom;
         }
       }
       resolve();
@@ -574,6 +596,11 @@ const handleH5LongPress = (e: any, message: IMessageModel, type: string) => {
 };
 
 function onHeightChanged() {
+  // 如果 view more 导致了子组件派发了 heightChanged 事件，不滚动到最底部，保留原来的滚动位置
+  if (beforeHistoryGetScrollHeight.value > 0) {
+    return;
+  }
+
   scrollToLatestMessage();
 }
 
@@ -617,6 +644,7 @@ async function scrollToLatestMessage() {
     messageListRef.value.scrollTop = scrollHeight - height;
   }
   scrollButtonInstanceRef.value?.hideScrollButton();
+  beforeHistoryGetScrollHeight.value = 0;
 }
 
 const handelScrollListScroll = throttle(
@@ -709,7 +737,6 @@ function setAudioPlayed(messageID: string) {
   };
 }
 
-
 defineExpose({
   scrollToLatestMessage,
 });

package/components/CustomerServiceChat/message-list/message-elements/message-bubble-web.vue

@@ -12,21 +12,19 @@
           :class="[message.flow === 'in' ? '' : 'reverse']"
         >
           <Avatar
-          v-if="isPC"
+            v-if="isPC && showAvatar === 1"
             useSkeletonAnimation
-            :url="message.flow=== 'in'? (message.avatar || customerAvatar) : (message.avatar || '')"
+            :url="avatarUrl"
           />
           <main
             :class="['message-body',message.flow==='out' && 'message-body-reverse']"
             @click.stop
           >
             <div
-              v-if="
-                isPC
-              "
+              v-if="isPC && showNickName === 1"
               class="message-body-nick-name"
             >
-              {{ props.content.showName }}
+              {{ nickName }}
             </div>
             <div
               :class="[
@@ -142,6 +140,8 @@ import loadingIcon from '../../../../assets/loading.png';
 import customerAvatar from '../../../../assets/customer_avatar.png';
 import { shallowCopyMessage } from '../../../../utils/utils';
 import { isPC,isH5 } from '../../../../utils/env';
+import { JSONToObject } from '../../../../utils/index';
+import state from '../../../../utils/state.js';
 import { CUSTOM_MESSAGE_SRC } from '../../../../constant';
 const { computed, toRefs } = vue;
 
@@ -182,6 +182,16 @@ const needLoadingIconMessageType = [
 ];
 
 const { blinkMessageIDList, messageItem: message } = toRefs(props);
+const {
+  showAvatar,
+  showNickName,
+  robotAvatar,
+  staffAvatar,
+  userAvatar,
+  robotNickName,
+  staffNickName,
+  userNickName,
+} = state.get('avatarNickName');
 
 const isDisplayUnplayMark = computed<boolean>(() => {
   return (
@@ -213,6 +223,43 @@ const isMultiBranchMsg = computed(()=>{
   return false;
 });
 
+function isFromRobot(cloudCustomData: string) {
+  try {
+    const jsonObj = JSONToObject(cloudCustomData);
+    return jsonObj.hasOwnProperty("role") && jsonObj.role === "robot";
+  } catch (e) {
+    return false;
+  }
+}
+
+const avatarUrl = computed(() => {
+  let url = '';
+  if (message.value?.flow === 'in') {
+    if (isFromRobot(message.value?.cloudCustomData)) {
+      url = robotAvatar || customerAvatar;
+    } else {
+      url = staffAvatar || message.value?.avatar;
+    }
+  } else {
+    url = userAvatar || message.value?.avatar || '';
+  }
+  return url;
+});
+
+const nickName = computed(() => {
+  let nick = '';
+  if (message.value?.flow === 'in') {
+    if (isFromRobot(message.value?.cloudCustomData)) {
+      nick = robotNickName || props.content.showName;
+    } else {
+      nick = staffNickName || props.content.showName;
+    }
+  } else {
+    nick = userNickName || props.content.showName;
+  }
+  return nick;
+});
+
 const isProductCardOrOrderMessage = computed(() => {
   if (message.value?.type == "TIMCustomElem") {
     const src = JSON.parse(message.value.payload.data).src;

package/components/CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-branch.vue

@@ -122,7 +122,7 @@ export default {
   margin-bottom: 8px;
 }
 .branch-item {
-  color:#1c66e5;
+  color: #1c66e5;
   cursor: pointer;
 }
 .warning-item {
@@ -131,14 +131,14 @@ export default {
 .branch-card {
   min-width: 250px;
   max-width: 350px;
-  display:flex;
-  flex-direction:column;
+  display: flex;
+  flex-direction: column;
   align-items: flex-start;
 }
 .branch-item-selected {
-  cursor:none;
+  cursor: default;
   color: #a0a7b8;
-  opacity:0.6;
+  opacity: 0.6;
 }
 .branch-title-icon {
   margin-right: 5px;

package/components/CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-desk.vue

@@ -79,6 +79,7 @@ import { CustomMessagePayload, TextMessagePayload, customerServicePayloadType }
 import MessageRating from './message-rating/index.vue';
 import vue from '../../../../../../adapter-vue';
 import { JSONToObject } from '../../../../../../utils/index';
+import { isEnabledMessageReadReceiptGlobal } from '../../../../../../utils/utils';
 import { CUSTOM_MESSAGE_SRC } from '../../../../../../constant';
 import MessageBranch from './message-branch.vue';
 import MessageForm from './message-single-form/index.vue';
@@ -123,11 +124,15 @@ export default {
     const payload = computed<customerServicePayloadType>(() => {
       return props.message && JSONToObject(props.message?.payload?.data);
     });
-    const sendTextMessage = (payload: TextMessagePayload) => {
-      TUIChatService.sendTextMessage({payload});
+    const sendTextMessage = (payload: TextMessagePayload, cloudCustomData?: string) => {
+      TUIChatService.sendTextMessage({ 
+        payload, 
+        cloudCustomData: cloudCustomData || '',
+        needReadReceipt: isEnabledMessageReadReceiptGlobal() 
+      });
     };
     const sendCustomMessage = (payload: CustomMessagePayload) => {
-      TUIChatService.sendCustomMessage({payload});
+      TUIChatService.sendCustomMessage({ payload });
     };
     const handleShowFormPopup = (data: boolean) => {
       emit('showFormPopup', data);

package/components/CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-multi-branch/branch-pc.vue

@@ -7,7 +7,7 @@
       {{ props.payload.content.header }}
     </div>
     <div
-      v-if="props.payload.status == 0 && !isClicked"
+      v-if="props.payload.status === 0 && canSelect"
       v-for="(item, index) in props.payload.content.items"
       :key="index"
       :class="['form-branch-item', item.content ? '' : 'warning-item']"
@@ -19,9 +19,11 @@
 </template>
 
 <script lang="ts">
+import vue from '../../../../../../../adapter-vue';
 import { TUITranslateService } from '@tencentcloud/chat-uikit-engine';
 import { customerServicePayloadType } from '../../../../../../../interface';
 import { isPC } from '../../../../../../../utils/env'
+const { ref } = vue;
 interface branchItem {
   content: string;
   desc: string;
@@ -35,23 +37,35 @@ export default {
   props: {
     payload: {
       type: Object as () => customerServicePayloadType,
-      default: () => ({content: { header: '', items: [] },status:0}),
+      default: () => ({optionType: 0, taskInfo: { taskID: 0, nodeID: '', env: '' }, content: { header: '', items: [] }, status: 0}),
     },
   },
   emits: ['input-click'],
   setup(props: Props, { emit }) {
-    let isClicked = false;
+    let canSelect = ref(true);
     const listItemClick = (branch: branchItem): void => {
       if (!branch.content) {
         return;
       }
-      emit('input-click', branch);
-      isClicked = true;
+      let cloudCustomData;
+      if (props.payload.optionType === 0) {
+        cloudCustomData = '';
+        canSelect.value = false;
+      } else if (props.payload.optionType === 1) {
+        cloudCustomData = JSON.stringify({
+          BranchOptionInfo: {
+            taskID: props.payload.taskInfo?.taskID,
+            nodeID: props.payload.taskInfo?.nodeID,
+            env: props.payload.taskInfo?.env,
+          }
+        });
+      }
+      emit('input-click', branch, cloudCustomData); 
     };
 
     return {
       props,
-      isClicked,
+      canSelect,
       listItemClick,
       isPC,
       TUITranslateService

package/components/CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-multi-branch/index.vue

@@ -37,8 +37,8 @@ export default {
     const payload = computed<customerServicePayloadType>(() => {
       return props.payload;
     });
-    const handleContentListItemClick = (branch: branchItem) => {
-      emit('sendMessage', { text: branch.content });
+    const handleContentListItemClick = (branch: branchItem, cloudCustomData?: string) => {
+      emit('sendMessage', { text: branch.content },  cloudCustomData || '');
     };
 
     const handleFormSaveInputSubmit = (text: string) => {