@tencentcloud/ai-desk-customer-vue 0.1.2 → 0.1.4

package/components/CustomerServiceChat/index-web.vue

@@ -7,8 +7,7 @@
       <ChatHeader
         :class="[
           'tui-chat-header',
-          !isPC && 'tui-chat-H5-header',
-          isUniFrameWork && 'tui-chat-uniapp-header',
+          !isPC && 'tui-chat-H5-header'
         ]"
         :canCloseChat="props.canCloseChat"
         @closeChat="closeChat"
@@ -23,8 +22,7 @@
         v-if="isInputToolbarShow"
         :class="[
           'tui-chat-message-input-toolbar',
-          !isPC && 'tui-chat-h5-message-input-toolbar',
-          isUniFrameWork && 'tui-chat-uni-message-input-toolbar',
+          !isPC && 'tui-chat-h5-message-input-toolbar'
         ]"
         :displayType="inputToolbarDisplayType"
         @insertEmoji="insertEmoji"
@@ -35,9 +33,7 @@
         ref="messageInputRef"
         :class="[
           'tui-chat-message-input',
-          !isPC && 'tui-chat-h5-message-input',
-          isUniFrameWork && 'tui-chat-uni-message-input',
-          isWeChat && 'tui-chat-wx-message-input',
+          !isPC && 'tui-chat-h5-message-input'
         ]"
         :isMuted="false"
         :muteText="TUITranslateService.t('TUIChat.您已被管理员禁言')"
@@ -60,8 +56,7 @@
             v-if="!isPC"
             :class="[
               'tui-chat-message-input-toolbar',
-              !isPC && 'tui-chat-h5-message-input-toolbar',
-              isUniFrameWork && 'tui-chat-uni-message-input-toolbar',
+              !isPC && 'tui-chat-h5-message-input-toolbar'
             ]"
             :isH5ToolShow="toolShowH5"
             :displayType="inputToolbarDisplayType"
@@ -91,7 +86,7 @@ import MessageList from './message-list/index-web.vue';
 import MessageInput from './message-input/index-web.vue';
 import MessageInputToolbar from './message-input-toolbar/index-web.vue';
 import EmojiDialog from './message-input-toolbar/emoji-dialog-mobile/emoji-dialog-mobile.vue';
-import { isPC, isH5 ,isWeChat, isUniFrameWork } from '../../utils/env';
+import { isPC, isH5} from '../../utils/env';
 import { ToolbarDisplayType } from '../../interface';
 
 
@@ -129,6 +124,7 @@ const loginCustomerUIKit = () => {
     console.log("ai-desk-customer login success");
     let conversationID = 'C2C@customer_service_account';
     TUIConversationService.switchConversation(conversationID);
+    TUIChatEngine.chat.callExperimentalAPI('isFeatureEnabledForStat', Math.pow(2, 42));
   }).catch((error) => {
     console.log(error);
   })
@@ -156,7 +152,7 @@ onUnmounted(() => {
 });
 
 const isInputToolbarShow = computed<boolean>(() => {
-  return (isUniFrameWork || isH5) ? inputToolbarDisplayType.value !== 'none' : true;
+  return (isH5) ? inputToolbarDisplayType.value !== 'none' : true;
 });
 
 const reset = () => {
@@ -197,9 +193,6 @@ const handleEditor = (message: IMessageModel, type: string) => {
 function changeToolbarDisplayType(type: ToolbarDisplayType) {
   inputToolbarDisplayType.value
     = inputToolbarDisplayType.value === type ? 'none' : type;
-  if (inputToolbarDisplayType.value !== 'none' && isUniFrameWork) {
-    uni.$emit('scroll-to-bottom');
-  }
 }
 
 function scrollToLatestMessage() {

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

@@ -24,13 +24,10 @@
         @sendMessage="sendMessage"
       />
       <div v-if="isH5" class="emoji-icon" id="emoji-icon-h5" @click="emojiShow">
-        <Icon :file="emojiIcon" width="20px" height="20px"/>
+        <Icon :file="emojiIcon" width="24px" height="24px"/>
       </div>
       <div v-if="isH5" class="tool-icon" @click="toolShow">
-        <Icon :file="toolIcon" width="20px" height="20px"/>
-      </div>
-      <div v-if="isH5" class="send-btn-h5" @click="sendMessage">
-        发送
+        <Icon :file="toolIcon" width="24px" height="24px"/>
       </div>
     </div>
 
@@ -185,21 +182,25 @@ defineExpose({
 }
 .emoji-icon {
   background: #fff;
-    border-radius: 0 9.4px 9.4px 0;
-    padding: 9.4px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
+  border-radius: 0 10px 10px 0;
+  padding: 5px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border: none;
 }
+
 .tool-icon {
   background: #fff;
-  margin-left: 4px;
-    border-radius: 9.4px;
-    padding: 9.4px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
+  margin-left: 5px;
+  margin-right: 10px;
+  border-radius: 10px;
+  padding: 5px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
 }
+
 .input-tool-dialog{
   height: fit-content;
     background: #fff;

package/components/CustomerServiceChat/message-input/message-input-editor-web.vue

@@ -203,9 +203,6 @@ onUnmounted(() => {
 });
 
 function handleEnter(e: any) {
-  if (isH5) {
-    return;
-  }
   e?.preventDefault();
   e?.stopPropagation();
   if (e.keyCode === 13 && e.ctrlKey) {
@@ -752,13 +749,13 @@ defineExpose({
 .message-input-editor-container-h5 {
   box-sizing: border-box;
   flex: 1;
-  height: auto;
+  height: 34px;
   background: #fff;
-  border-radius: 9.4px 0 0 9.4px;
+  border-radius: 10px 0 0 10px;
   padding: 8px 0 8px 10px;
   font-size: 16px !important;
   max-height: 86px;
-  margin-right: 0px;
+  margin: 10px 0 0 10px;
   overflow: hidden;
 
   .message-input-editor-area {

package/components/CustomerServiceChat/message-input/message-input-quote/index.vue

@@ -3,17 +3,13 @@
     v-if="Boolean(quoteMessage) && props.displayType !== 'audio'"
     :class="{
       'input-quote-container': true,
-      // 'input-quote-container-uni': isUniFrameWork,
-      'input-quote-container-h5': isH5 || isUniFrameWork,
+      'input-quote-container-h5': isH5,
     }"
   >
     <div :class="(!isPC) ? 'input-quote-content-h5' :'input-quote-content'">
       <div>
-          <div v-if="isUniFrameWork" class="input-quote-sender-h5">
-          {{ quoteMessage.nick || quoteMessage.from }}
-        </div>
         <div class="max-one-line">
-          {{ isUniFrameWork? quoteContentText : (quoteMessage.nick || quoteMessage.from)+ ': ' + quoteContentText  }}
+          {{ (quoteMessage.nick || quoteMessage.from)+ ': ' + quoteContentText  }}
         </div>
       </div>
         <Icon
@@ -39,7 +35,7 @@ import TUIChatEngine, {
 } from '@tencentcloud/chat-uikit-engine';
 import Icon from '../../../common/Icon.vue';
 import closeIcon from '../../../../assets/close-quote-icon.svg';
-import { isPC,isH5, isUniFrameWork } from '../../../../utils/env';
+import { isPC,isH5 } from '../../../../utils/env';
 import { transformTextWithKeysToEmojiNames } from '../../emoji-config';
 import { InputDisplayType } from '../../../../interface';
 const { ref, computed, onMounted, onUnmounted } = vue;
@@ -187,13 +183,6 @@ function onQuoteMessageUpdated(options?: {
   max-width: 500px;
 }
 
-.input-quote-container-uni {
-  @extend %common-container-style;
-
-  width: fit-content;
-  max-width: 250px;
-  margin: 5px 60px 0 30px;
-}
 
 .input-quote-container-h5 {
   @extend %common-container-style;

package/components/CustomerServiceChat/message-input-toolbar/emoji-dialog-mobile/emoji-dialog-mobile.vue

@@ -40,7 +40,7 @@ import {
   convertKeyToEmojiName,
 } from '../../emoji-config';
 import { EMOJI_TYPE } from '.././../../../constant';
-import { isPC, isUniFrameWork,isH5 } from '../../../../utils/env';
+import { isPC, } from '../../../../utils/env';
 
 const emits = defineEmits(['insertEmoji', 'onClose', 'sendMessage']);
 const list = ref<IEmojiGroupList>(initEmojiList());
@@ -70,11 +70,8 @@ const select = (item: any, index: number) => {
   switch (currentTabItem?.value?.type) {
     case EMOJI_TYPE.BASIC:
       options.url = currentTabItem?.value?.url + BASIC_EMOJI_URL_MAPPING[item];
-      if (isUniFrameWork) {
-        uni.$emit('insert-emoji', options);
-      } else {
         emits('insertEmoji', options);
-      }
+      
       break;
     case EMOJI_TYPE.BIG:
     //   sendFaceMessage(index, currentTabItem.value);

package/components/CustomerServiceChat/message-input-toolbar/emoji-picker/emoji-picker-dialog.vue

@@ -57,7 +57,7 @@
         >
       </li>
       <li
-        v-if="isUniFrameWork || isH5"
+        v-if="isH5"
         class="send-btn"
         @click="sendMessage"
       >
@@ -78,7 +78,7 @@ import {
 import Icon from '../../../common/Icon.vue';
 import faceIcon from '../../../../assets/face.png';
 import { EMOJI_TYPE } from '.././../../../constant';
-import { isPC, isUniFrameWork,isH5 } from '../../../../utils/env';
+import { isPC, isH5 } from '../../../../utils/env';
 import { IEmojiGroupList, IEmojiGroup } from '../../../../interface';
 import { isEnabledMessageReadReceiptGlobal } from '../../../../utils/utils';
 import {
@@ -114,9 +114,8 @@ const toggleEmojiTab = (index: number) => {
   currentTabItem.value = list?.value[index];
   currentEmojiList.value = list?.value[index]?.list;
   // web & h5 side scroll to top
-  if (!isUniFrameWork) {
-    emojiPickerListRef?.value && (emojiPickerListRef.value.scrollTop = 0);
-  }
+  emojiPickerListRef?.value && (emojiPickerListRef.value.scrollTop = 0);
+  
 };
 
 const select = (item: any, index: number) => {
@@ -127,11 +126,8 @@ const select = (item: any, index: number) => {
   switch (currentTabItem?.value?.type) {
     case EMOJI_TYPE.BASIC:
       options.url = currentTabItem?.value?.url + BASIC_EMOJI_URL_MAPPING[item];
-      if (isUniFrameWork) {
-        uni.$emit('insert-emoji', options);
-      } else {
-        emits('insertEmoji', options);
-      }
+      emits('insertEmoji', options);
+      
       break;
     case EMOJI_TYPE.BIG:
       sendFaceMessage(index, currentTabItem.value);
@@ -161,11 +157,8 @@ const sendFaceMessage = (index: number, listItem: IEmojiGroup) => {
 };
 
 function sendMessage() {
-  if (isUniFrameWork) {
-    uni.$emit('send-message-in-emoji-picker');
-  }else{
-    emits('sendMessage');
-  }
+  emits('sendMessage');
+  
 }
 
 function onCurrentConversationUpdate(conversation: IConversationModel) {

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

@@ -2,8 +2,8 @@
   <ToolbarItemContainer
     :iconFile="isH5?fileIconH5:fileIcon"
     title="文件"
-    :iconWidth="isUniFrameWork ? '32px' : '21px'"
-    :iconHeight="isUniFrameWork ? '25px' : '18px'"
+    iconWidth='21px'
+    iconHeight='18px'
     :needDialog="false"
     @onIconClick="onIconClick"
   >
@@ -32,7 +32,7 @@ import vue from '../../../../adapter-vue';
 import ToolbarItemContainer from '../toolbar-item-container/index.vue';
 import fileIcon from '../../../../assets/files.png';
 import fileIconH5 from '../../../../assets/file-h5.png';
-import { isPC, isUniFrameWork,isH5 } from '../../../../utils/env';
+import { isPC, isH5 } from '../../../../utils/env';
 import { isEnabledMessageReadReceiptGlobal } from '../../../../utils/utils';
 const { ref } = vue;
 
@@ -46,11 +46,7 @@ TUIStore.watch(StoreName.CONV, {
 });
 
 const onIconClick = () => {
-  if (isUniFrameWork) {
-    return;
-  } else {
     inputRef?.value?.click && inputRef?.value?.click();
-  }
 };
 
 const sendFileMessage = (e: any) => {

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

@@ -2,14 +2,13 @@
   <ToolbarItemContainer
     :iconFile="imageToolbarForShow.icon"
     :title="imageToolbarForShow.title"
-    :iconWidth="isUniFrameWork ? '32px' : '21px'"
-    :iconHeight="isUniFrameWork ? '25px' : '18px'"
+    iconWidth='21px'
+    iconHeight= '18px'
     :needDialog="false"
     @onIconClick="onIconClick"
     :isH5ToolShow="isH5ToolShow"
   >
     <div
-      v-if="!isUniFrameWork"
       :class="['image-upload', !isPC && 'image-upload-h5','image-video']"
     >
       <input
@@ -33,11 +32,10 @@ import {
 } from '@tencentcloud/chat-uikit-engine';
 import { TUIGlobal } from '@tencentcloud/universal-api';
 import vue from '../../../../adapter-vue';
-import { isPC, isH5,isWeChat, isUniFrameWork } from '../../../../utils/env';
+import { isPC, isH5 } from '../../../../utils/env';
 import ToolbarItemContainer from '../toolbar-item-container/index.vue';
 import imageIcon from '../../../../assets/image.png';
 import imageUniIcon from '../../../../assets/image-uni.png';
-import cameraUniIcon from '../../../../assets/camera-uni.png';
 import { isEnabledMessageReadReceiptGlobal } from '../../../../utils/utils';
 const { ref, computed } = vue;
 
@@ -65,11 +63,7 @@ const IMAGE_TOOLBAR_SHOW_MAP = {
   uni_album: {
     icon: imageUniIcon,
     title: '图片',
-  },
-  uni_camera: {
-    icon: cameraUniIcon,
-    title: '拍照',
-  },
+  }
 };
 
 TUIStore.watch(StoreName.CONV, {
@@ -79,11 +73,7 @@ TUIStore.watch(StoreName.CONV, {
 });
 
 const imageToolbarForShow = computed((): { icon: string; title: string } => {
-  if (isUniFrameWork) {
-    return props.imageSourceType === 'camera'
-      ? IMAGE_TOOLBAR_SHOW_MAP['uni_camera']
-      : IMAGE_TOOLBAR_SHOW_MAP['uni_album'];
-  } else if(isH5){
+  if(isH5){
     return IMAGE_TOOLBAR_SHOW_MAP['uni_album'];
   }
   else {
@@ -92,38 +82,10 @@ const imageToolbarForShow = computed((): { icon: string; title: string } => {
 });
 
 const onIconClick = () => {
-  // uni-app send image
-  if (isUniFrameWork) {
-    if (isWeChat && TUIGlobal?.chooseMedia) {
-      TUIGlobal?.chooseMedia({
-        count: 1,
-        mediaType: ['image','video'],
-        sizeType: ['original', 'compressed'],
-        sourceType: [props.imageSourceType], // Use camera or select from album.
-        success: function (res: any) {
-          if(res.tempFiles[0].fileType == 'image'){
-            sendImageMessage(res);
-          } else if(res.tempFiles[0].fileType == 'video'){
-            sendVideoMessage(res);
-          }
-        },
-      });
-    } else {
-      // uni-app H5/App send image
-      TUIGlobal?.chooseImage({
-        count: 1,
-        sourceType: [props.imageSourceType], // Use camera or select from album.
-        success: function (res) {
-          sendImageMessage(res);
-        },
-      });
-    }
-  } else {
-    console.log("imageToolbarForShow.value.icon")
     if (inputRef.value?.click) {
       inputRef.value.click();
     }
-  }
+  
 };
 
 const sendImageInWeb = (e: any) => {

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

@@ -3,14 +3,12 @@
     :class="[
       'message-input-toolbar',
       !isPC && 'message-input-toolbar-h5',
-      isUniFrameWork && 'message-input-toolbar-uni',
     ]"
   >
     <div
       :class="[
         'message-input-toolbar-list',
         !isPC && 'message-input-toolbar-h5-list',
-        isUniFrameWork && 'message-input-toolbar-uni-list',
       ]"
     >
       <EmojiPicker
@@ -46,7 +44,7 @@ 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 { isPC, isH5, isUniFrameWork } from '../../../utils/env';
+import { isPC, isH5 } from '../../../utils/env';
 import { ToolbarDisplayType } from '../../../interface';
 const { ref, onMounted, onUnmounted, watch } = vue;
 
@@ -177,15 +175,4 @@ const dialogCloseInH5 = (dialogDom: any) => {
   flex-direction: column;
 }
 
-.message-input-toolbar-uni {
-  background-color: #ebf0f6;
-  flex-direction: column;
-
-  &-list {
-    flex: 1;
-    display: grid;
-    grid-template-columns: repeat(4, 25%);
-    grid-template-rows: repeat(2, 100px);
-  }
-}
 </style>

package/components/CustomerServiceChat/message-input-toolbar/style/uni.scss

@@ -39,26 +39,6 @@
   flex-direction: column;
 }
 
-.message-input-toolbar-uni {
-  background-color: transparent;
-  flex-direction: column;
-  z-index: 100;
-
-  &-list {
-    flex: 1;
-    display: grid;
-    grid-template-columns: repeat(4, 25%);
-    grid-template-rows: repeat(2, 100px);
-  }
-}
-
-// uniapp swiper style
-wx-swiper .wx-swiper-wrapper,
-wx-swiper .wx-swiper-slides,
-wx-swiper .wx-swiper-slide-frame,
-.message-input-toolbar-list {
-  overflow: visible !important;
-}
 
 .message-input-toolbar {
 
@@ -72,40 +52,4 @@ wx-swiper .wx-swiper-slide-frame,
 .message-input-toolbar-swiper {
   width: 100%;
   height: 220px;
-
-  ::v-deep .uni-swiper-wrapper,
-  wx-swiper .wx-swiper-wrapper {
-    overflow: visible !important;
-
-    .uni-swiper-slides,
-    .wx-swiper-slides,
-    wx-swiper .wx-swiper-slides {
-      overflow: visible !important;
-
-      .uni-swiper-slide-frame,
-      .wx-swiper-slide-frame,
-      wx-swiper .wx-swiper-slide-frame {
-        overflow: visible !important;
-
-        .message-input-toolbar-list {
-          overflow: visible !important;
-        }
-
-        .toolbar-item-container-uni {
-          position: static !important;
-        }
-
-        .toolbar-item-container-dialog {
-          position: absolute !important;
-          background: transparent;
-          left: -10px;
-          bottom: -5px;
-
-          .bottom-popup-uni {
-            position: sticky !important;
-          }
-        }
-      }
-    }
-  }
 }

package/components/CustomerServiceChat/message-input-toolbar/toolbar-item-container/index.vue

@@ -4,14 +4,12 @@
     :class="[
       'toolbar-item-container',
       !isPC && 'toolbar-item-container-h5',
-      isUniFrameWork && 'toolbar-item-container-uni',
     ]"
   >
     <div
-      v-if="isPC || (isH5 && !isH5Emoji && isH5ToolShow) || isUniFrameWork"
+      v-if="isPC || (isH5 && !isH5Emoji && isH5ToolShow)"
       :class="[
         'toolbar-item-container-icon',
-        isUniFrameWork && 'toolbar-item-container-uni-icon',
         isH5 && 'toolbar-item-container-h5-icon'
       ]"
       @click="toggleToolbarItem"
@@ -24,8 +22,8 @@
       />
     </div>
     <div
-      v-if="isUniFrameWork || (isH5 && !isH5Emoji && isH5ToolShow)"
-      :class="['toolbar-item-container-uni-title']"
+      v-if="(isH5 && !isH5Emoji && isH5ToolShow)"
+      :class="['toolbar-item-container-h5-title']"
     >
       {{ props.title }}
     </div>
@@ -35,7 +33,6 @@
       :class="[
         'toolbar-item-container-dialog',
         !isPC && 'toolbar-item-container-h5-dialog',
-        isUniFrameWork && 'toolbar-item-container-uni-dialog',
       ]"
     >
       <BottomPopup
@@ -56,7 +53,7 @@ import vue from '../../../../adapter-vue';
 import { outsideClick } from '@tencentcloud/universal-api';
 import Icon from '../../../common/Icon.vue';
 import BottomPopup from '../../../common/BottomPopup/index.vue';
-import { isPC, isUniFrameWork,isH5 } from '../../../../utils/env';
+import { isPC, isH5 } from '../../../../utils/env';
 const { ref } = vue;
 
 const props = defineProps({

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

@@ -2,4 +2,3 @@
 @import "./color";
 @import "./web";
 @import "./h5";
-@import "./uni";

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

@@ -3,14 +3,8 @@
     :iconFile="handleIcon()"
     :title="handleTitle()"
     :needDialog="false"
-    :iconWidth="isUniFrameWork ? '32px' : '21px'"
-    :iconHeight="
-      isUniFrameWork
-        ? props.videoSourceType === 'album'
-          ? '20px'
-          : '25px'
-        : '18px'
-    "
+    iconWidth='21px'
+    iconHeight='18px'
     @onIconClick="onIconClick"
   >
     <div :class="['video-upload', !isPC && 'video-upload-h5']">
@@ -36,11 +30,9 @@ import {
 } from '@tencentcloud/chat-uikit-engine';
 import { TUIGlobal } from '@tencentcloud/universal-api';
 import vue from '../../../../adapter-vue';
-import { isPC, isWeChat, isUniFrameWork } from '../../../../utils/env';
+import { isPC } from '../../../../utils/env';
 import ToolbarItemContainer from '../toolbar-item-container/index.vue';
 import videoIcon from '../../../../assets/video.png';
-import videoUniIcon from '../../../../assets/video-uni.png';
-import cameraUniIcon from '../../../../assets/camera-uni.png';
 import { isEnabledMessageReadReceiptGlobal } from '../../../../utils/utils';
 const { ref } = vue;
 
@@ -64,54 +56,19 @@ TUIStore.watch(StoreName.CONV, {
 });
 
 const handleIcon = (): string => {
-  if (isUniFrameWork) {
-    switch (props.videoSourceType) {
-      case 'album':
-        return videoUniIcon;
-      case 'camera':
-        return cameraUniIcon;
-      default:
-        return videoUniIcon;
-    }
-  } else {
     return videoIcon;
-  }
+  
 };
 
 const handleTitle = (): string => {
-  if (isUniFrameWork && props.videoSourceType === 'camera') {
-    return '录制';
-  } else {
+
     return '视频';
-  }
+  
 };
 
 const onIconClick = () => {
-  // uni-app send video
-  if (isUniFrameWork) {
-    if (isWeChat && TUIGlobal?.chooseMedia) {
-      TUIGlobal?.chooseMedia({
-        mediaType: ['video'],
-        count: 1,
-        sourceType: [props.videoSourceType],
-        maxDuration: 60,
-        success: function (res: any) {
-          sendVideoMessage(res);
-        },
-      });
-    } else {
-      TUIGlobal?.chooseVideo({
-        count: 1,
-        sourceType: [props.videoSourceType],
-        compressed: false,
-        success: function (res: any) {
-          sendVideoMessage(res);
-        },
-      });
-    }
-  } else {
     inputRef?.value?.click && inputRef?.value?.click();
-  }
+  
 };
 
 const sendVideoInWeb = (e: any) => {