Browse Source

更换图片

lex 1 year ago
parent
commit
9f0b627298

+ 2 - 2
src/TUIKit/TUIComponents/components/transferTUI/index.vue

@@ -18,7 +18,7 @@
             <li class="list-item" v-for="(item, index) in list" :key="index" @click="selected(item)">
               <i class="icon" :class="[item?.isDisabled && 'disabled', selectedList.indexOf(item) > -1 ? 'icon-selected' : 'icon-unselected']"></i>
               <template v-if="!isCustomItem">
-                <img class="avatar" :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
+                <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
                 <span class="name">{{ item?.nick || item?.userID }}</span>
                 <span v-if="item?.isDisabled">({{ $t("component.已在群聊中") }})</span>
               </template>
@@ -41,7 +41,7 @@
           <li class="list-item space-between" v-for="(item, index) in selectedList" :key="index">
             <aside>
               <template v-if="!isCustomItem">
-                <img class="avatar" :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
+                <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
                 <span v-if="!isH5">{{ item.nick || item.userID }}</span>
               </template>
               <template v-else>

+ 1 - 1
src/TUIKit/TUIComponents/container/TUIChat/components/index.vue

@@ -39,7 +39,7 @@
     <!-- <DialogTUI :show="dialogShow" :isHeaderShow="false" :is-footer-show="false" @update:show="(e) => (dialogShow = e)">
       <div v-for="(item, index) in dialogMessageList" :key="index">
         <div class="dialogItem">
-          <img class="avatar" :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
+          <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
         </div>
       </div>
     </DialogTUI> -->

+ 1 - 1
src/TUIKit/TUIComponents/container/TUIChat/components/message-bubble.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="message-bubble" :class="[message.flow === 'in' ? '' : 'reverse']" ref="htmlRefHook">
-    <img class="avatar" :src="message?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
+    <img class="avatar" :src="message?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
     <main class="message-area">
       <label class="name" v-if="message.flow === 'in' && message.conversationType === 'GROUP'">
         {{ message.nameCard || message.nick || message.from }}

+ 1 - 1
src/TUIKit/TUIComponents/container/TUIChat/manage-components/manage-member.vue

@@ -4,7 +4,7 @@
       <li class="list-item" v-for="(item, index) in list" :key="index">
         <!-- @click="handleMemberProfileShow(item)" -->
         <aside>
-          <img class="avatar" :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
+          <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
           <span class="name">{{ item?.nickname || item?.userID }}</span>
           <span>{{ handleRoleName(item) }}</span>
         </aside>

+ 5 - 5
src/TUIKit/TUIComponents/container/TUIChat/manage-components/manage.vue

@@ -28,7 +28,7 @@
             <!-- @click="handleMemberProfileShow(item)" -->
             <dl v-for="(item, index) in userInfo?.list?.slice(0, showUserNum)" :key="index">
               <dt>
-                <img class="avatar" :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
+                <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
               </dt>
               <dd>{{ item?.nickname || item?.userID }}</dd>
             </dl>
@@ -70,9 +70,9 @@
               class="avatar"
               :src="
                 conversation?.groupProfile?.avatar ||
-                'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'
+                'https://oss.dayaedu.com/news-info/07/1690775328089.png'
               "
-              onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'"
+              onerror="this.src='https://oss.dayaedu.com/news-info/07/1690775328089.png'"
             />
           </li>
           <li>
@@ -119,7 +119,7 @@
           <ol>
             <dl v-for="(item, index) in member.admin" :key="index">
               <dt>
-                <img class="avatar" :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
+                <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
               </dt>
               <dd>{{ item?.nick || item?.userID }}</dd>
             </dl>
@@ -145,7 +145,7 @@
           <ol>
             <dl v-for="(item, index) in member.muteMember" :key="index">
               <dt>
-                <img class="avatar" :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
+                <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
               </dt>
               <dd>{{ item?.nick || item?.userID }}</dd>
             </dl>

+ 32 - 51
src/TUIKit/TUIComponents/container/TUIChat/manage-components/member-profile.vue

@@ -1,14 +1,7 @@
 <template>
   <div class="memeber-profile">
     <div class="memeber-profile-main">
-      <img
-        class="avatar"
-        :src="
-          userInfo?.avatar ||
-          'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'
-        "
-        onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
-      />
+      <img class="avatar" :src="userInfo?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
       <ul class="list">
         <h1>{{ userInfo?.nick || userInfo?.userID }}</h1>
         <li>
@@ -16,40 +9,36 @@
           <span>{{ userInfo?.userID }}</span>
         </li>
         <li>
-          <label>{{ $t('TUIContact.个性签名') }}:</label>
+          <label>{{ $t("TUIContact.个性签名") }}:</label>
           <span>{{ userInfo?.selfSignature }}</span>
         </li>
       </ul>
     </div>
     <div class="memeber-profile-footer">
-      <div
-        class="button"
-        @click="enter(userInfo?.userID, 'C2C')"
-        v-if="showEnter()"
-      >
-        {{ $t('TUIContact.发送消息') }}
+      <div class="button" @click="enter(userInfo?.userID, 'C2C')" v-if="showEnter()">
+        {{ $t("TUIContact.发送消息") }}
       </div>
     </div>
   </div>
 </template>
 <script lang="ts">
-import TIM from '../../../../TUICore/tim';
-import { reactive, toRefs, watch, watchEffect, defineComponent } from 'vue';
-import manage from './manage.vue';
+import TIM from "../../../../TUICore/tim";
+import { reactive, toRefs, watch, watchEffect, defineComponent } from "vue";
+import manage from "./manage.vue";
 
 const memberProfile = defineComponent({
   props: {
     userInfo: {
       type: Object,
-      default: () => ({})
-    }
+      default: () => ({}),
+    },
   },
   setup(props: any, ctx: any) {
     const TUIServer = manage?.TUIServer;
     const data = reactive({
       isFriendShip: false,
       userInfo: {},
-      self: {}
+      self: {},
     });
     watchEffect(() => {
       data.self = props.self;
@@ -64,29 +53,21 @@ const memberProfile = defineComponent({
       },
       {
         deep: true,
-        immediate: true
+        immediate: true,
       }
     );
     const enter = async (ID: any, type: string) => {
       const name = `${type}${ID}`;
-      TUIServer.TUICore.TUIServer.TUIConversation.getConversationProfile(
-        name
-      ).then((imResponse: any) => {
+      TUIServer.TUICore.TUIServer.TUIConversation.getConversationProfile(name).then((imResponse: any) => {
         // 通知 TUIConversation 添加当前会话
         // Notify TUIConversation to toggle the current conversation
-        TUIServer.TUICore.TUIServer.TUIConversation.handleCurrentConversation(
-          imResponse.data.conversation
-        );
+        TUIServer.TUICore.TUIServer.TUIConversation.handleCurrentConversation(imResponse.data.conversation);
       });
     };
     const checkFriend = async () => {
       if (!(data.userInfo as any).userID) return;
-      const relation = await TUIServer.checkFriend(
-        (data.userInfo as any).userID,
-        TIM.TYPES.SNS_CHECK_TYPE_BOTH
-      );
-      data.isFriendShip =
-        relation === TIM.TYPES.SNS_TYPE_BOTH_WAY ? true : false;
+      const relation = await TUIServer.checkFriend((data.userInfo as any).userID, TIM.TYPES.SNS_CHECK_TYPE_BOTH);
+      data.isFriendShip = relation === TIM.TYPES.SNS_TYPE_BOTH_WAY ? true : false;
     };
 
     const showEnter = () => {
@@ -95,15 +76,15 @@ const memberProfile = defineComponent({
     return {
       ...toRefs(data),
       enter,
-      showEnter
+      showEnter,
     };
-  }
+  },
 });
 export default memberProfile;
 </script>
 <style lang="scss" scoped>
-@import url('../../../styles/common.scss');
-@import url('../../../styles/icon.scss');
+@import url("../../../styles/common.scss");
+@import url("../../../styles/icon.scss");
 .memeber-profile {
   flex: 1;
   display: flex;
@@ -114,15 +95,15 @@ export default memberProfile;
     width: 100%;
     overflow: hidden;
     img {
-      width: 60Px;
-      height: 60Px;
-      border-radius: 8Px;
-      margin: 20Px 10Px 20Px 20Px;
+      width: 60px;
+      height: 60px;
+      border-radius: 8px;
+      margin: 20px 10px 20px 20px;
     }
     .list {
       flex: 1;
       overflow: hidden;
-      margin: 20Px 10Px;
+      margin: 20px 10px;
       font-weight: 400;
       li {
         color: #999999;
@@ -136,24 +117,24 @@ export default memberProfile;
     }
   }
   &-footer {
-    border-top: 10Px solid #f4f5f9;
-    padding: 14Px;
+    border-top: 10px solid #f4f5f9;
+    padding: 14px;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     .button {
-      width: 100Px;
-      font-size: 14Px;
+      width: 100px;
+      font-size: 14px;
       cursor: pointer;
       background-color: #006eff;
       color: #ffffff;
-      padding: 8Px 20Px;
-      border-radius: 4Px;
+      padding: 8px 20px;
+      border-radius: 4px;
       border: none;
-      font-size: 14Px;
+      font-size: 14px;
       text-align: center;
-      line-height: 20Px;
+      line-height: 20px;
     }
   }
 }

+ 55 - 85
src/TUIKit/TUIComponents/container/TUIChat/message-input/message-input-at.vue

@@ -1,31 +1,15 @@
 <template>
-  <div
-    class="message-input-at"
-    :class="[isH5 && 'message-input-at-h5']"
-    v-if="showAtList"
-    ref="MessageInputAt"
-  >
+  <div class="message-input-at" :class="[isH5 && 'message-input-at-h5']" v-if="showAtList" ref="MessageInputAt">
     <div class="memberList" ref="dialog">
       <header class="memberList-title" v-if="isH5">
-        <span class="title">{{ $t('TUIChat.选择提醒的人') }}</span>
+        <span class="title">{{ $t("TUIChat.选择提醒的人") }}</span>
         <i class="icon icon-close close" @click="closeAt"></i>
       </header>
       <ul class="memberList-box">
-        <li
-          class="memberList-box-body"
-          :class="[index === selectedIndex && 'selected']"
-          v-for="(item, index) in showMemberList"
-          :key="index"
-          @click="selectItem(index)"
-          ref="memberListItems"
-        >
-          <img
-            :src="(item as any)?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
-          />
+        <li class="memberList-box-body" :class="[index === selectedIndex && 'selected']" v-for="(item, index) in showMemberList" :key="index" @click="selectItem(index)" ref="memberListItems">
+          <img :src="(item as any)?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
           <span>
-            {{
-              (item as any)?.nick ? (item as any)?.nick : (item as any)?.userID
-            }}
+            {{ (item as any)?.nick ? (item as any)?.nick : (item as any)?.userID }}
           </span>
         </li>
       </ul>
@@ -33,11 +17,11 @@
   </div>
 </template>
 <script lang="ts">
-import { defineComponent, ref, toRefs, watchEffect, watch } from 'vue';
-import { SuggestionProps, SuggestionKeyDownProps } from '@tiptap/suggestion';
-import atIcon from '../../../assets/icon/at.svg';
-import TIM from '../../../../TUICore/tim';
-import { onClickOutside } from '@vueuse/core';
+import { defineComponent, ref, toRefs, watchEffect, watch } from "vue";
+import { SuggestionProps, SuggestionKeyDownProps } from "@tiptap/suggestion";
+import atIcon from "../../../assets/icon/at.svg";
+import TIM from "../../../../TUICore/tim";
+import { onClickOutside } from "@vueuse/core";
 
 const MessageInputAt = ref();
 const showAtList = ref(false);
@@ -45,7 +29,7 @@ const allMemberList = ref<Array<any>>();
 const showMemberList = ref<Array<any>>();
 const position = ref({
   left: 0,
-  top: 0
+  top: 0,
 });
 const command = ref();
 const selectedIndex = ref(0);
@@ -56,14 +40,8 @@ const MessageInputAtSuggestion = () => {
   return {
     allowedPrefixes: null,
     items: (props: { query: string }) => {
-      const queryResult = allMemberList?.value?.filter(
-        item =>
-          item?.nick?.toLowerCase()?.startsWith(props?.query?.toLowerCase()) ||
-          item?.userID?.toLowerCase()?.startsWith(props?.query?.toLowerCase())
-      );
-      showMemberList.value = queryResult?.length
-        ? queryResult
-        : allMemberList.value;
+      const queryResult = allMemberList?.value?.filter((item) => item?.nick?.toLowerCase()?.startsWith(props?.query?.toLowerCase()) || item?.userID?.toLowerCase()?.startsWith(props?.query?.toLowerCase()));
+      showMemberList.value = queryResult?.length ? queryResult : allMemberList.value;
       return showMemberList.value;
     },
     render: () => {
@@ -83,7 +61,7 @@ const MessageInputAtSuggestion = () => {
           if (rect?.left && rect?.top && !isH5.value) {
             position.value = {
               left: rect?.left,
-              top: rect?.top
+              top: rect?.top,
             };
           }
           command.value = props.command;
@@ -97,30 +75,30 @@ const MessageInputAtSuggestion = () => {
           if (rect?.left && rect?.top && !isH5.value) {
             position.value = {
               left: rect?.left,
-              top: rect?.top
+              top: rect?.top,
             };
           }
         },
 
         onKeyDown(props: SuggestionKeyDownProps) {
-          if (props.event.key === 'Enter') {
+          if (props.event.key === "Enter") {
             props.event?.stopPropagation();
             props.event?.preventDefault();
           }
-          if (props.event.key === 'Escape') {
+          if (props.event.key === "Escape") {
             showAtList.value = false;
             showMemberList.value = allMemberList.value;
             return true;
           }
-          if (props?.event.key === 'ArrowUp') {
+          if (props?.event.key === "ArrowUp") {
             upHandler();
             return true;
           }
-          if (props?.event.key === 'ArrowDown') {
+          if (props?.event.key === "ArrowDown") {
             downHandler();
             return true;
           }
-          if (props?.event.key === 'Enter') {
+          if (props?.event.key === "Enter") {
             enterHandler();
             return true;
           }
@@ -132,26 +110,23 @@ const MessageInputAtSuggestion = () => {
           showMemberList.value = allMemberList.value;
           position.value = {
             left: 0,
-            top: 0
+            top: 0,
           };
-        }
+        },
       };
-    }
+    },
   };
 };
 
 const upHandler = () => {
   if (!showMemberList?.value?.length) return;
-  selectedIndex.value =
-    (selectedIndex.value + showMemberList?.value?.length - 1) %
-    showMemberList?.value?.length;
+  selectedIndex.value = (selectedIndex.value + showMemberList?.value?.length - 1) % showMemberList?.value?.length;
   memberListItems?.value[selectedIndex.value]?.scrollIntoView(false);
 };
 
 const downHandler = () => {
   if (!showMemberList?.value?.length) return;
-  selectedIndex.value =
-    (selectedIndex.value + 1) % showMemberList?.value?.length;
+  selectedIndex.value = (selectedIndex.value + 1) % showMemberList?.value?.length;
   memberListItems?.value[selectedIndex.value]?.scrollIntoView(false);
 };
 
@@ -166,7 +141,7 @@ const selectItem = (index: number) => {
     command.value &&
       command.value({
         id: (item as any)?.userID,
-        label: (item as any)?.nick || (item as any)?.userID
+        label: (item as any)?.nick || (item as any)?.userID,
       });
   }
 };
@@ -175,28 +150,28 @@ const MessageInputAtComponent = defineComponent({
   props: {
     memberList: {
       type: Array,
-      default: () => []
+      default: () => [],
     },
     isGroup: {
       type: Boolean,
-      default: false
+      default: false,
     },
     selfInfo: {
       type: Object,
-      default: () => ({})
+      default: () => ({}),
     },
     isH5: {
       type: Boolean,
-      default: false
-    }
+      default: false,
+    },
   },
   setup(props) {
     const { memberList, isGroup, selfInfo } = toRefs(props);
     const all = {
       userID: TIM.TYPES.MSG_AT_ALL,
-      nick: '所有人',
+      nick: "所有人",
       isAll: true,
-      avatar: atIcon
+      avatar: atIcon,
     };
     const dialog = ref();
     watchEffect(() => {
@@ -220,27 +195,22 @@ const MessageInputAtComponent = defineComponent({
       },
       {
         deep: true,
-        immediate: true
+        immediate: true,
       }
     );
 
     watch(
       () => [position.value, MessageInputAt?.value],
       () => {
-        if (
-          isH5.value ||
-          !MessageInputAt?.value ||
-          !MessageInputAt?.value?.style
-        ) {
+        if (isH5.value || !MessageInputAt?.value || !MessageInputAt?.value?.style) {
           return;
         }
-        MessageInputAt.value.style.left = position.value.left + 'Px';
-        MessageInputAt.value.style.top =
-          position.value.top - MessageInputAt.value.clientHeight + 'Px';
+        MessageInputAt.value.style.left = position.value.left + "Px";
+        MessageInputAt.value.style.top = position.value.top - MessageInputAt.value.clientHeight + "Px";
       },
       {
         deep: true,
-        immediate: true
+        immediate: true,
       }
     );
 
@@ -249,7 +219,7 @@ const MessageInputAtComponent = defineComponent({
       showMemberList.value = allMemberList.value;
       position.value = {
         left: 0,
-        top: 0
+        top: 0,
       };
     };
 
@@ -266,17 +236,17 @@ const MessageInputAtComponent = defineComponent({
       allMemberList,
       MessageInputAt,
       memberListItems,
-      dialog
+      dialog,
     };
-  }
+  },
 });
 
 export default MessageInputAtComponent;
 export { MessageInputAtSuggestion, MessageInputAtComponent };
 </script>
 <style scoped lang="scss">
-@import url('../../../styles/common.scss');
-@import url('../../../styles/icon.scss');
+@import url("../../../styles/common.scss");
+@import url("../../../styles/icon.scss");
 .message-input-at {
   position: fixed;
   max-width: 15rem;
@@ -290,7 +260,7 @@ export { MessageInputAtSuggestion, MessageInputAtComponent };
 .memberList-box {
   &-header {
     height: 2.5rem;
-    padding-top: 5Px;
+    padding-top: 5px;
     cursor: pointer;
 
     &:hover {
@@ -303,7 +273,7 @@ export { MessageInputAtSuggestion, MessageInputAtComponent };
     font-size: 0.88rem;
     color: #000000;
     letter-spacing: 0;
-    padding: 5Px;
+    padding: 5px;
   }
   &-body {
     height: 2.5rem;
@@ -325,7 +295,7 @@ export { MessageInputAtSuggestion, MessageInputAtComponent };
   img {
     width: 1.5rem;
     height: 1.5rem;
-    padding-left: 10Px;
+    padding-left: 10px;
   }
   .selected {
     background: rgba(0, 110, 255, 0.1);
@@ -351,25 +321,25 @@ export { MessageInputAtSuggestion, MessageInputAtComponent };
     width: 100%;
     max-width: 100%;
     background: white;
-    border-radius: 12Px 12Px 0 0;
+    border-radius: 12px 12px 0 0;
     display: flex;
     flex-direction: column;
     overflow: hidden;
     &-title {
       height: fit-content;
-      width: calc(100% - 30Px);
+      width: calc(100% - 30px);
       text-align: center;
       vertical-align: middle;
-      padding: 15Px;
+      padding: 15px;
       .title {
         vertical-align: middle;
         display: inline-block;
-        font-size: 16Px;
+        font-size: 16px;
       }
       .close {
         vertical-align: middle;
         position: absolute;
-        right: 10Px;
+        right: 10px;
         display: inline-block;
       }
     }
@@ -377,13 +347,13 @@ export { MessageInputAtSuggestion, MessageInputAtComponent };
       flex: 1;
       overflow-y: scroll;
       &-body {
-        padding: 10Px;
+        padding: 10px;
         img {
-          width: 26Px;
-          height: 26Px;
+          width: 26px;
+          height: 26px;
         }
         span {
-          font-size: 14Px;
+          font-size: 14px;
         }
       }
     }

+ 38 - 67
src/TUIKit/TUIComponents/container/TUIChat/plugin-components/readReceiptDialog/readReceiptDialog.vue

@@ -1,16 +1,11 @@
 <template>
-  <div
-    class="read-receipt"
-    :class="[isH5 ? 'read-receipt-H5' : '', isMenuOpen ? 'read-receipt-menu-open' : '']"
-    v-if="show"
-    ref="dialog"
-  >
+  <div class="read-receipt" :class="[isH5 ? 'read-receipt-H5' : '', isMenuOpen ? 'read-receipt-menu-open' : '']" v-if="show" ref="dialog">
     <div class="header">
       <div class="header-back">
         <i v-if="isH5" class="icon icon-back" @click="toggleShow"></i>
       </div>
       <div class="header-title">
-        <span>{{ $t('TUIChat.消息详情') }}</span>
+        <span>{{ $t("TUIChat.消息详情") }}</span>
       </div>
       <div class="header-close">
         <i v-if="!isH5" class="icon icon-close" @click="toggleShow"></i>
@@ -31,13 +26,7 @@
       </div>
       <div class="body-tab">
         <template v-for="(val, key) in readReceiptList">
-          <div
-            class="tab-item"
-            :class="key === showListNow && 'tab-item-now'"
-            v-if="val.show"
-            :key="key"
-            @click="showListNow = key"
-          >
+          <div class="tab-item" :class="key === showListNow && 'tab-item-now'" v-if="val.show" :key="key" @click="showListNow = key">
             <div class="tab-item-title">{{ val?.label }}</div>
             <div class="tab-item-count">{{ val?.count }}</div>
           </div>
@@ -46,11 +35,7 @@
       <div class="body-list">
         <ul>
           <li v-for="(item, index) in readReceiptList[showListNow].userList" :key="index" class="body-list-item">
-            <img
-              class="avatar"
-              :src="item?.avatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
-              onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
-            />
+            <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
             <div class="name">
               {{ item?.nick || item?.userID }}
             </div>
@@ -62,18 +47,14 @@
   </div>
 </template>
 <script lang="ts">
-import { defineComponent, reactive, watchEffect, toRefs, watch, ref } from 'vue';
-import { onClickOutside } from '@vueuse/core';
-import { caculateTimeago, handleErrorPrompts } from '../../../utils';
-import { Message, userListItem } from '../../interface';
-import {
-  handleImageMessageShowContext,
-  handleVideoMessageShowContext,
-  handleFaceMessageShowContext,
-} from '../../utils/utils';
-import { TUIEnv } from '../../../../../TUIPlugin';
+import { defineComponent, reactive, watchEffect, toRefs, watch, ref } from "vue";
+import { onClickOutside } from "@vueuse/core";
+import { caculateTimeago, handleErrorPrompts } from "../../../utils";
+import { Message, userListItem } from "../../interface";
+import { handleImageMessageShowContext, handleVideoMessageShowContext, handleFaceMessageShowContext } from "../../utils/utils";
+import { TUIEnv } from "../../../../../TUIPlugin";
 const ReadReceiptDialog = defineComponent({
-  type: 'custom',
+  type: "custom",
   props: {
     message: {
       type: Object,
@@ -97,31 +78,31 @@ const ReadReceiptDialog = defineComponent({
       isH5: false,
       messageInfo: {
         isImg: false,
-        content: '',
+        content: "",
       },
       readReceiptList: [
         {
-          label: props.isH5 ? t('TUIChat.人已读') : t('TUIChat.已读'),
+          label: props.isH5 ? t("TUIChat.人已读") : t("TUIChat.已读"),
           count: 0,
           userList: [] as userListItem[],
           isCompleted: true,
-          cursor: '',
+          cursor: "",
           show: true,
         },
         {
-          label: props.isH5 ? t('TUIChat.人未读') : t('TUIChat.未读'),
+          label: props.isH5 ? t("TUIChat.人未读") : t("TUIChat.未读"),
           count: 0,
           userList: [] as userListItem[],
           isCompleted: true,
-          cursor: '',
+          cursor: "",
           show: true,
         },
         {
-          label: props.isH5 ? t('TUIChat.人关闭阅读状态') : t('TUIChat.关闭阅读状态'),
+          label: props.isH5 ? t("TUIChat.人关闭阅读状态") : t("TUIChat.关闭阅读状态"),
           count: 0,
           userList: [] as userListItem[],
           isCompleted: true,
-          cursor: '',
+          cursor: "",
           show: false,
         },
       ],
@@ -158,34 +139,29 @@ const ReadReceiptDialog = defineComponent({
     const toggleShow = () => {
       data.show = !data.show;
       if (!data.show) {
-        ctx.emit('closeDialog', 'receipt');
+        ctx.emit("closeDialog", "receipt");
         close();
       }
     };
 
     onClickOutside(dialog, () => {
       data.show = false;
-      ctx.emit('closeDialog', 'receipt');
+      ctx.emit("closeDialog", "receipt");
       close();
     });
 
     const getReadList = async (more = false) => {
       if (!data.isGroup || !data.message || Object.keys(data.message).length === 0) return;
       try {
-        const obj = await ReadReceiptDialog.TUIServer.getGroupReadMemberList(
-          data.message,
-          more ? data.readReceiptList[0].cursor : ''
-        );
+        const obj = await ReadReceiptDialog.TUIServer.getGroupReadMemberList(data.message, more ? data.readReceiptList[0].cursor : "");
         data.readReceiptList[0].isCompleted = obj?.data?.isCompleted;
-        data.readReceiptList[0].cursor = obj?.data?.cursor || '';
+        data.readReceiptList[0].cursor = obj?.data?.cursor || "";
         const list = obj.data.readUserIDList;
         const readList: userListItem[] = await handleAvatarAndName(list);
-        data.readReceiptList[0].userList = more
-          ? ([...data.readReceiptList[0].userList, ...readList] as userListItem[])
-          : readList;
+        data.readReceiptList[0].userList = more ? ([...data.readReceiptList[0].userList, ...readList] as userListItem[]) : readList;
       } catch (error) {
         if (error && (error as any)?.code === 10062) {
-          const message = t('TUIChat.您当前购买使用的套餐包暂未开通群消息已读回执功能');
+          const message = t("TUIChat.您当前购买使用的套餐包暂未开通群消息已读回执功能");
           handleErrorPrompts(message, data.env);
           console.warn(message);
         }
@@ -194,17 +170,12 @@ const ReadReceiptDialog = defineComponent({
 
     const getUnreadList = async (more = false) => {
       if (!data.isGroup || !data.message || Object.keys(data.message).length === 0) return;
-      const obj = await ReadReceiptDialog.TUIServer.getGroupUnreadMemberList(
-        data.message,
-        more ? data.readReceiptList[1].cursor : ''
-      );
+      const obj = await ReadReceiptDialog.TUIServer.getGroupUnreadMemberList(data.message, more ? data.readReceiptList[1].cursor : "");
       data.readReceiptList[1].isCompleted = obj?.data.isCompleted;
-      data.readReceiptList[1].cursor = obj?.data?.cursor || '';
+      data.readReceiptList[1].cursor = obj?.data?.cursor || "";
       const list = obj.data.unreadUserIDList;
       const unreadList: userListItem[] = await handleAvatarAndName(list);
-      data.readReceiptList[1].userList = more
-        ? ([...data.readReceiptList[1].userList, ...unreadList] as userListItem[])
-        : unreadList;
+      data.readReceiptList[1].userList = more ? ([...data.readReceiptList[1].userList, ...unreadList] as userListItem[]) : unreadList;
     };
 
     const handleAvatarAndName = async (list: any) => {
@@ -249,34 +220,34 @@ const ReadReceiptDialog = defineComponent({
       data.message = {};
       data.readReceiptList = [
         {
-          label: props.isH5 ? t('TUIChat.人已读') : t('TUIChat.已读'),
+          label: props.isH5 ? t("TUIChat.人已读") : t("TUIChat.已读"),
           count: 0,
           userList: [] as userListItem[],
           isCompleted: true,
-          cursor: '',
+          cursor: "",
           show: true,
         },
         {
-          label: props.isH5 ? t('TUIChat.人未读') : t('TUIChat.未读'),
+          label: props.isH5 ? t("TUIChat.人未读") : t("TUIChat.未读"),
           count: 0,
           userList: [] as userListItem[],
           isCompleted: true,
-          cursor: '',
+          cursor: "",
           show: true,
         },
         {
-          label: props.isH5 ? t('TUIChat.人关闭阅读状态') : t('TUIChat.关闭阅读状态'),
+          label: props.isH5 ? t("TUIChat.人关闭阅读状态") : t("TUIChat.关闭阅读状态"),
           count: 0,
           userList: [] as userListItem[],
           isCompleted: true,
-          cursor: '',
+          cursor: "",
           show: false,
         },
       ];
       data.showListNow = 0;
       data.messageInfo = {
         isImg: false,
-        content: '',
+        content: "",
       };
     };
 
@@ -288,7 +259,7 @@ const ReadReceiptDialog = defineComponent({
           data.messageInfo.isImg = false;
           break;
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_CUSTOM:
-          data.messageInfo.content = t('TUIChat.自定义');
+          data.messageInfo.content = t("TUIChat.自定义");
           data.messageInfo.isImg = false;
           break;
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_IMAGE:
@@ -296,7 +267,7 @@ const ReadReceiptDialog = defineComponent({
           data.messageInfo.isImg = true;
           break;
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_AUDIO:
-          data.messageInfo.content = t('TUIChat.语音');
+          data.messageInfo.content = t("TUIChat.语音");
           data.messageInfo.isImg = false;
           break;
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_VIDEO:
@@ -304,7 +275,7 @@ const ReadReceiptDialog = defineComponent({
           data.messageInfo.isImg = true;
           break;
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_FILE:
-          data.messageInfo.content = t('TUIChat.文件') + data.message?.payload?.fileName;
+          data.messageInfo.content = t("TUIChat.文件") + data.message?.payload?.fileName;
           data.messageInfo.isImg = false;
           break;
         case ReadReceiptDialog.TUIServer.TUICore.TIM.TYPES.MSG_FACE:
@@ -315,7 +286,7 @@ const ReadReceiptDialog = defineComponent({
     };
 
     const handleDialogPosition = () => {
-      data.isMenuOpen = !!document?.getElementsByClassName('home-menu')?.length;
+      data.isMenuOpen = !!document?.getElementsByClassName("home-menu")?.length;
     };
 
     return {

+ 55 - 131
src/TUIKit/TUIComponents/container/TUIChat/plugin-components/replies/replies-item.vue

@@ -1,108 +1,36 @@
 <template>
   <div class="replies-item" :class="!isRoot ? 'replies-item-normal' : ''">
     <div class="message-bubble" ref="htmlRefHook">
-      <img
-        class="avatar"
-        :src="
-          message?.avatar ||
-          'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'
-        "
-        onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
-      />
+      <img class="avatar" :src="message?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
       <main class="message-area">
         <div class="message-area-title">
           <label class="name">
-            {{
-              isRoot
-                ? message.nameCard || message.nick || message.from
-                : message.messageSender
-            }}
+            {{ isRoot ? message.nameCard || message.nick || message.from : message.messageSender }}
           </label>
           <label class="time">
-            {{
-              caculateTimeago(
-                (isRoot ? message?.time : message?.messageTime) * 1000
-              )
-            }}
+            {{ caculateTimeago((isRoot ? message?.time : message?.messageTime) * 1000) }}
           </label>
         </div>
         <div class="content content-in">
-          <MessageText
-            v-if="
-              message.messageType === constant.typeText ||
-              message.type === TIM.TYPES.MSG_TEXT ||
-              !isRoot
-            "
-            :data="
-              handleTextMessageShowContext(
-                isRoot
-                  ? message
-                  : { payload: { text: message?.messageAbstract } }
-              )
-            "
-          />
-          <span
-            v-if="
-              message.messageType === constant.typeCustom ||
-              message.type === TIM.TYPES.MSG_CUSTOM
-            "
-          >
+          <MessageText v-if="message.messageType === constant.typeText || message.type === TIM.TYPES.MSG_TEXT || !isRoot" :data="handleTextMessageShowContext(isRoot ? message : { payload: { text: message?.messageAbstract } })" />
+          <span v-if="message.messageType === constant.typeCustom || message.type === TIM.TYPES.MSG_CUSTOM">
             {{ handleCustomMessageShowContext(message)?.custom }}
           </span>
-          <img
-            v-if="
-              message.messageType === constant.typeImage ||
-              message.type === TIM.TYPES.MSG_IMAGE
-            "
-            class="message-img"
-            :src="message?.payload?.imageInfoArray[1].url"
-          />
-          <div
-            v-if="
-              message.messageType === constant.typeAudio ||
-              message.type === TIM.TYPES.MSG_AUDIO
-            "
-            class="message-audio"
-            :style="`width: ${message?.payload?.second * 10 + 40}Px`"
-          >
+          <img v-if="message.messageType === constant.typeImage || message.type === TIM.TYPES.MSG_IMAGE" class="message-img" :src="message?.payload?.imageInfoArray[1].url" />
+          <div v-if="message.messageType === constant.typeAudio || message.type === TIM.TYPES.MSG_AUDIO" class="message-audio" :style="`width: ${message?.payload?.second * 10 + 40}Px`">
             <i class="icon icon-voice"></i>
             <label>{{ message?.payload?.second }}s</label>
           </div>
-          <div
-            v-if="
-              message.messageType === constant.typeVideo ||
-              message.type === TIM.TYPES.MSG_VIDEO
-            "
-            class="message-video-cover"
-          >
-            <img
-              class="message-videoimg"
-              :src="message?.payload?.snapshotUrl || message?.payload?.thumbUrl"
-            />
+          <div v-if="message.messageType === constant.typeVideo || message.type === TIM.TYPES.MSG_VIDEO" class="message-video-cover">
+            <img class="message-videoimg" :src="message?.payload?.snapshotUrl || message?.payload?.thumbUrl" />
           </div>
-          <img
-            v-if="
-              message.messageType === constant.typeFace ||
-              message.type === TIM.TYPES.MSG_FACE
-            "
-            class="message-img"
-            :src="url"
-          />
-          <div
-            v-if="
-              message.messageType === constant.typeFile ||
-              message.type === TIM.TYPES.MSG_FILE
-            "
-            class="message-file"
-          >
+          <img v-if="message.messageType === constant.typeFace || message.type === TIM.TYPES.MSG_FACE" class="message-img" :src="url" />
+          <div v-if="message.messageType === constant.typeFile || message.type === TIM.TYPES.MSG_FILE" class="message-file">
             <i class="icon icon-files"></i>
             <div class="message-file-content">
               <label>{{ message?.payload?.fileName }}</label>
               <span>
-                {{
-                  handleFileMessageShowContext(message)?.size ||
-                  message?.payload?.fileSize
-                }}
+                {{ handleFileMessageShowContext(message)?.size || message?.payload?.fileSize }}
               </span>
             </div>
           </div>
@@ -113,44 +41,40 @@
   </div>
 </template>
 <script lang="ts">
-import { defineComponent, reactive, toRefs, watchEffect } from 'vue';
-import { Message } from '../../interface';
-import {
-  handleTextMessageShowContext,
-  handleCustomMessageShowContext,
-  handleFileMessageShowContext
-} from '../../utils/utils';
-import { MessageText, MessageEmojiReact } from '../../components';
-import { caculateTimeago } from '../../../utils';
-import constant from '../../../constant';
-import TIM from '../../../../../TUICore/tim/index';
+import { defineComponent, reactive, toRefs, watchEffect } from "vue";
+import { Message } from "../../interface";
+import { handleTextMessageShowContext, handleCustomMessageShowContext, handleFileMessageShowContext } from "../../utils/utils";
+import { MessageText, MessageEmojiReact } from "../../components";
+import { caculateTimeago } from "../../../utils";
+import constant from "../../../constant";
+import TIM from "../../../../../TUICore/tim/index";
 const RepliesItem = defineComponent({
   props: {
     message: {
       type: Object,
-      default: () => ({})
+      default: () => ({}),
     },
     isH5: {
       type: Boolean,
-      default: false
+      default: false,
     },
     isRoot: {
       type: Boolean,
-      default: false
-    }
+      default: false,
+    },
   },
   components: {
     MessageText,
-    MessageEmojiReact
+    MessageEmojiReact,
   },
   setup(props: any, ctx: any) {
     const data = reactive({
       message: {} as Message,
       isH5: false,
-      url: '',
+      url: "",
       isRoot: false,
       constant,
-      TIM
+      TIM,
     });
     watchEffect(() => {
       data.message = props.message;
@@ -165,37 +89,37 @@ const RepliesItem = defineComponent({
       handleTextMessageShowContext,
       handleCustomMessageShowContext,
       handleFileMessageShowContext,
-      caculateTimeago
+      caculateTimeago,
     };
-  }
+  },
 });
 export default RepliesItem;
 </script>
 <style lang="scss" scoped>
 .replies-item {
-  padding: 15Px;
+  padding: 15px;
   width: auto;
   &-normal {
-    padding: 12.8Px 15Px 0 17Px;
+    padding: 12.8px 15px 0 17px;
     .message-bubble {
       padding-bottom: 0;
       .avatar {
-        width: 48Px;
-        height: 48Px;
-        border-radius: 8Px;
+        width: 48px;
+        height: 48px;
+        border-radius: 8px;
       }
       .message-area {
-        padding: 0 0 8Px 0;
-        margin: 0 0 0 16Px;
-        border-bottom: 0.1Px solid #dbdbdb;
+        padding: 0 0 8px 0;
+        margin: 0 0 0 16px;
+        border-bottom: 0.1px solid #dbdbdb;
         &-title {
           .name {
-            font-size: 14Px;
-            line-height: 20Px;
+            font-size: 14px;
+            line-height: 20px;
           }
           .time {
-            font-size: 12Px;
-            line-height: 18Px;
+            font-size: 12px;
+            line-height: 18px;
           }
         }
         .content,
@@ -203,31 +127,31 @@ export default RepliesItem;
           background: inherit;
           border-radius: 0;
           padding: 0;
-          line-height: 22Px;
+          line-height: 22px;
         }
       }
     }
   }
   .avatar {
-    width: 36Px;
-    height: 36Px;
-    border-radius: 5Px;
+    width: 36px;
+    height: 36px;
+    border-radius: 5px;
   }
   .message-bubble {
     width: 100%;
     display: flex;
-    padding-bottom: 5Px;
+    padding-bottom: 5px;
   }
   .line-left {
-    border: 1Px solid rgba(0, 110, 255, 0.5);
+    border: 1px solid rgba(0, 110, 255, 0.5);
   }
 
   .message-area {
-    max-width: calc(100% - 54Px);
+    max-width: calc(100% - 54px);
     position: relative;
     display: flex;
     flex-direction: column;
-    padding: 0 8Px;
+    padding: 0 8px;
     flex: 1;
     &-title {
       display: flex;
@@ -235,7 +159,7 @@ export default RepliesItem;
       justify-content: space-between;
       .name,
       .time {
-        padding-bottom: 4Px;
+        padding-bottom: 4px;
         font-weight: 400;
         font-size: 0.8rem;
         color: #999999;
@@ -249,9 +173,9 @@ export default RepliesItem;
       }
     }
     .content {
-      padding: 12Px;
+      padding: 12px;
       font-weight: 400;
-      font-size: 14Px;
+      font-size: 14px;
       color: #000000;
       letter-spacing: 0;
       word-wrap: break-word;
@@ -259,14 +183,14 @@ export default RepliesItem;
       width: fit-content;
       &-in {
         background: #f2f2f2;
-        border-radius: 0Px 10Px 10Px 10Px;
+        border-radius: 0px 10px 10px 10px;
         .message-img,
         .message-videoimg {
           width: inherit;
           height: inherit;
           max-height: 100%;
           max-width: 100%;
-          max-height: 300Px;
+          max-height: 300px;
         }
       }
     }
@@ -275,7 +199,7 @@ export default RepliesItem;
     align-self: flex-end;
     font-family: PingFangSC-Regular;
     font-weight: 400;
-    font-size: 12Px;
+    font-size: 12px;
     color: #b6b8ba;
     word-break: keep-all;
   }
@@ -298,7 +222,7 @@ export default RepliesItem;
     max-width: 100%;
     overflow: hidden;
     .icon {
-      margin: 0 4Px;
+      margin: 0 4px;
     }
     audio {
       width: 0;

+ 2 - 2
src/TUIKit/TUIComponents/container/TUIChat/utils/utils.ts

@@ -9,10 +9,10 @@ export function handleAvatar(item: any) {
   let avatar = "";
   switch (item.type) {
     case TIM.TYPES.CONV_C2C:
-      avatar = isUrl(item?.userProfile?.avatar) ? item?.userProfile?.avatar : "https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png";
+      avatar = isUrl(item?.userProfile?.avatar) ? item?.userProfile?.avatar : "https://oss.dayaedu.com/news-info/07/1690787574969.png";
       break;
     case TIM.TYPES.CONV_GROUP:
-      avatar = isUrl(item?.groupProfile?.avatar) ? item?.groupProfile?.avatar : "https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png";
+      avatar = isUrl(item?.groupProfile?.avatar) ? item?.groupProfile?.avatar : "https://oss.dayaedu.com/news-info/07/1690775328089.png";
       break;
     case TIM.TYPES.CONV_SYSTEM:
       avatar = isUrl(item?.groupProfile?.avatar) ? item?.groupProfile?.avatar : "https://web.sdk.qcloud.com/component/TUIKit/assets/group_avatar.png";

+ 48 - 125
src/TUIKit/TUIComponents/container/TUIContact/index.vue

@@ -32,31 +32,18 @@
         <ul class="TUI-contact-column" v-if="!isSearch">
           <li class="TUI-contact-column-item">
             <header @click="select('system')">
-              <i
-                class="icon icon-right"
-                :class="[columnName === 'system' && 'icon-down']"
-              ></i>
+              <i class="icon icon-right" :class="[columnName === 'system' && 'icon-down']"></i>
               <main>
-                <label>{{ $t('TUIContact.群聊通知') }}</label>
-                <span
-                  class="num"
-                  v-if="
-                    systemConversation && systemConversation.unreadCount > 0
-                  "
-                >
+                <label>{{ $t("TUIContact.群聊通知") }}</label>
+                <span class="num" v-if="systemConversation && systemConversation.unreadCount > 0">
                   {{ systemConversation.unreadCount }}
                 </span>
               </main>
             </header>
             <ul class="TUI-contact-list" v-if="columnName === 'system'">
               <li class="TUI-contact-list-item selected not-aside">
-                <label>{{ $t('TUIContact.系统通知') }}</label>
-                <span
-                  class="num"
-                  v-if="
-                    systemConversation && systemConversation.unreadCount > 0
-                  "
-                >
+                <label>{{ $t("TUIContact.系统通知") }}</label>
+                <span class="num" v-if="systemConversation && systemConversation.unreadCount > 0">
                   {{ systemConversation.unreadCount }}
                 </span>
               </li>
@@ -64,31 +51,15 @@
           </li>
           <li class="TUI-contact-column-item">
             <header @click="select('group')">
-              <i
-                class="icon icon-right"
-                :class="[columnName === 'group' && 'icon-down']"
-              ></i>
+              <i class="icon icon-right" :class="[columnName === 'group' && 'icon-down']"></i>
               <main>
-                <label>{{ $t('TUIContact.我的群聊') }}</label>
+                <label>{{ $t("TUIContact.我的群聊") }}</label>
               </main>
             </header>
             <ul class="TUI-contact-list" v-show="columnName === 'group'">
-              <li
-                class="TUI-contact-list-item"
-                :class="[currentGroup?.groupID === item?.groupID && 'selected']"
-                v-for="(item, index) in groupList"
-                :key="index"
-                @click="handleListItem(item)"
-              >
+              <li class="TUI-contact-list-item" :class="[currentGroup?.groupID === item?.groupID && 'selected']" v-for="(item, index) in groupList" :key="index" @click="handleListItem(item)">
                 <aside class="left">
-                  <img
-                    class="avatar"
-                    :src="
-                      item?.avatar ||
-                      'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'
-                    "
-                    onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'"
-                  />
+                  <img class="avatar" :src="item?.avatar || 'https://oss.dayaedu.com/news-info/07/1690775328089.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690775328089.png'" />
                 </aside>
                 <main class="content">
                   <ul>
@@ -105,40 +76,16 @@
           </li>
           <li class="TUI-contact-column-item">
             <header @click="select('friend')">
-              <i
-                class="icon icon-right"
-                :class="[columnName === 'friend' && 'icon-down']"
-              ></i>
+              <i class="icon icon-right" :class="[columnName === 'friend' && 'icon-down']"></i>
               <main>
-                <label>{{ $t('TUIContact.我的好友') }}</label>
+                <label>{{ $t("TUIContact.我的好友") }}</label>
               </main>
             </header>
             <ul class="TUI-contact-list" v-show="columnName === 'friend'">
-              <li
-                class="TUI-contact-list-item"
-                :class="[currentFriend?.userID === item?.userID && 'selected']"
-                v-for="(item, index) in friendList"
-                :key="index"
-                @click="handleListItem(item)"
-              >
+              <li class="TUI-contact-list-item" :class="[currentFriend?.userID === item?.userID && 'selected']" v-for="(item, index) in friendList" :key="index" @click="handleListItem(item)">
                 <aside class="left">
-                  <img
-                    class="avatar"
-                    :src="
-                      item?.profile?.avatar ||
-                      'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'
-                    "
-                    onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
-                  />
-                  <div
-                    class="online-status"
-                    :class="
-                      userStatusList.get(item?.userID)?.statusType === 1
-                        ? 'online-status-online'
-                        : 'online-status-offline'
-                    "
-                    v-if="displayOnlineStatus"
-                  ></div>
+                  <img class="avatar" :src="item?.profile?.avatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
+                  <div class="online-status" :class="userStatusList.get(item?.userID)?.statusType === 1 ? 'online-status-online' : 'online-status-offline'" v-if="displayOnlineStatus"></div>
                 </aside>
                 <main class="content">
                   <ul>
@@ -152,23 +99,9 @@
           </li>
         </ul>
         <ul class="TUI-contact-list" v-else>
-          <li
-            v-if="!!searchGroup?.groupID"
-            class="TUI-contact-list-item"
-            :class="[
-              currentGroup?.groupID === searchGroup?.groupID && 'selected'
-            ]"
-            @click="handleListItem(searchGroup)"
-          >
+          <li v-if="!!searchGroup?.groupID" class="TUI-contact-list-item" :class="[currentGroup?.groupID === searchGroup?.groupID && 'selected']" @click="handleListItem(searchGroup)">
             <aside class="left">
-              <img
-                class="avatar"
-                :src="
-                  searchGroup?.avatar ||
-                  'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'
-                "
-                onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'"
-              />
+              <img class="avatar" :src="searchGroup?.avatar || 'https://oss.dayaedu.com/news-info/07/1690775328089.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690775328089.png'" />
             </aside>
             <main class="content">
               <ul>
@@ -214,7 +147,7 @@
                 currentGroup?.avatar ||
                 'https://web.sdk.qcloud.com/component/TUIKit/assets/group_avatar.png'
               "
-              onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'"
+              onerror="this.src='https://oss.dayaedu.com/news-info/07/1690775328089.png'"
             />
           </header>
           <main class="TUI-contact-main-info-main" v-if="isNeedPermission">
@@ -288,9 +221,9 @@
               class="avatar"
               :src="
                 currentFriend?.profile?.avatar ||
-                'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'
+                'https://oss.dayaedu.com/news-info/07/1690787574969.png'
               "
-              onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
+              onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'"
             />
           </header>
 
@@ -320,20 +253,20 @@
   </transition>
 </template>
 <script lang="ts">
-import { computed, defineComponent, reactive, toRefs, watch } from 'vue';
+import { computed, defineComponent, reactive, toRefs, watch } from "vue";
 // import MessageSystem from './components/message-system.vue';
-import { handleErrorPrompts, isArrayEqual } from '../utils';
+import { handleErrorPrompts, isArrayEqual } from "../utils";
 
 const TUIContact = defineComponent({
-  name: 'TUIContact',
+  name: "TUIContact",
   components: {
     // MessageSystem
   },
   props: {
     displayOnlineStatus: {
       type: Boolean,
-      default: false
-    }
+      default: false,
+    },
   },
   setup(props: any, ctx: any) {
     const TUIServer: any = TUIContact.TUIServer;
@@ -341,13 +274,13 @@ const TUIContact = defineComponent({
     const data = reactive({
       groupList: [],
       searchGroup: {},
-      searchID: '',
+      searchID: "",
       currentGroup: null,
       systemConversation: {
-        unreadCount: 0
+        unreadCount: 0,
       },
       systemMessageList: [],
-      columnName: '',
+      columnName: "",
       types: TUIServer.TUICore.TIM.TYPES,
       isSearch: false,
       env: TUIServer.TUICore.TUIEnv,
@@ -356,7 +289,7 @@ const TUIContact = defineComponent({
       currentFriend: {},
       displayOnlineStatus: false,
       onlineStatus: false,
-      userStatusList: new Map()
+      userStatusList: new Map(),
     });
 
     TUIServer.bind(data);
@@ -369,7 +302,7 @@ const TUIContact = defineComponent({
         TUIServer.handleUserStatus(data.displayOnlineStatus, data.userIDList);
       },
       {
-        immediate: true
+        immediate: true,
       }
     );
 
@@ -383,18 +316,16 @@ const TUIContact = defineComponent({
 
     const isNeedPermission = computed(() => {
       const isHaveSeif = (data.currentGroup as any).selfInfo.userID;
-      const isPermission =
-        (data.currentGroup as any).joinOption ===
-        TUIServer.TUICore.TIM.TYPES.JOIN_OPTIONS_NEED_PERMISSION;
+      const isPermission = (data.currentGroup as any).joinOption === TUIServer.TUICore.TIM.TYPES.JOIN_OPTIONS_NEED_PERMISSION;
       return !isHaveSeif && isPermission;
     });
 
     const handleListItem = async (item: any) => {
       switch (data.columnName) {
-        case 'group':
+        case "group":
           data.currentGroup = item;
           break;
-        case 'friend':
+        case "friend":
           data.currentFriend = item;
           break;
       }
@@ -409,7 +340,7 @@ const TUIContact = defineComponent({
         try {
           await TUIServer.searchGroupByID(data.searchID.trim());
         } catch (error) {
-          const message = t('TUIContact.该群组不存在');
+          const message = t("TUIContact.该群组不存在");
           handleErrorPrompts(message, data.env);
         }
       }
@@ -418,8 +349,8 @@ const TUIContact = defineComponent({
     const join = async (group: any) => {
       const options: any = {
         groupID: group.groupID,
-        applyMessage: group.applyMessage || t('TUIContact.加群'),
-        type: group?.type
+        applyMessage: group.applyMessage || t("TUIContact.加群"),
+        type: group?.type,
       };
       await TUIServer.joinGroup(options);
       (data.currentGroup as any).apply = true;
@@ -432,14 +363,10 @@ const TUIContact = defineComponent({
 
     const enter = async (ID: any, type: string) => {
       const name = `${type}${ID}`;
-      TUIServer.TUICore.TUIServer.TUIConversation.getConversationProfile(
-        name
-      ).then((imResponse: any) => {
+      TUIServer.TUICore.TUIServer.TUIConversation.getConversationProfile(name).then((imResponse: any) => {
         // 通知 TUIConversation 添加当前会话
         // Notify TUIConversation to toggle the current conversation
-        TUIServer.TUICore.TUIServer.TUIConversation.handleCurrentConversation(
-          imResponse.data.conversation
-        );
+        TUIServer.TUICore.TUIServer.TUIConversation.handleCurrentConversation(imResponse.data.conversation);
         back();
       });
     };
@@ -450,36 +377,32 @@ const TUIContact = defineComponent({
     };
 
     const select = async (name: string) => {
-      if (
-        data.columnName !== 'system' &&
-        name === 'system' &&
-        (data.systemConversation as any)?.conversationID
-      ) {
+      if (data.columnName !== "system" && name === "system" && (data.systemConversation as any)?.conversationID) {
         await TUIServer.getSystemMessageList();
         await TUIServer.setMessageRead();
       }
       (data.currentGroup as any) = {};
-      if (data.columnName !== 'group' && name === 'group' && !data.env.isH5) {
+      if (data.columnName !== "group" && name === "group" && !data.env.isH5) {
         (data.currentGroup as any) = data.groupList[0];
       } else {
         (data.currentGroup as any) = {};
       }
-      data.searchID = '';
-      data.columnName = data.columnName === name ? '' : name;
+      data.searchID = "";
+      data.columnName = data.columnName === name ? "" : name;
     };
 
     const toggleSearch = () => {
       data.isSearch = !data.isSearch;
-      data.columnName = '';
-      data.searchID = '';
+      data.columnName = "";
+      data.searchID = "";
       data.searchGroup = {};
       (data.currentGroup as any) = {};
     };
 
     const init = () => {
       data.isSearch = false;
-      data.columnName = '';
-      data.searchID = '';
+      data.columnName = "";
+      data.searchID = "";
       data.searchGroup = {};
       (data.currentGroup as any) = {};
     };
@@ -490,7 +413,7 @@ const TUIContact = defineComponent({
     const back = () => {
       (data.currentGroup as any) = {};
       (data.currentFriend as any) = {};
-      data.columnName = '';
+      data.columnName = "";
     };
 
     const getUserStatusList = (userList: Array<string>) => {
@@ -511,9 +434,9 @@ const TUIContact = defineComponent({
       init,
       back,
       enter,
-      getUserStatusList
+      getUserStatusList,
     };
-  }
+  },
 });
 export default TUIContact;
 </script>

+ 1 - 1
src/TUIKit/TUIComponents/container/TUIGroup/index.vue

@@ -26,7 +26,7 @@
           <ul class="TUI-contact-list">
             <li class="TUI-contact-list-item" v-for="(item, index) in groupList" :key="index" @click="handleListItem(item)">
               <aside class="left">
-                <img class="avatar" :src="item.img || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690775328089.png'" />
+                <img class="avatar" :src="item.img || 'https://oss.dayaedu.com/news-info/07/1690775328089.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690775328089.png'" />
               </aside>
               <div class="content-header">
                 <label>

+ 1 - 1
src/TUIKit/TUIComponents/container/TUIPerson/index.vue

@@ -26,7 +26,7 @@
           <ul class="TUI-contact-list">
             <li class="TUI-contact-list-item" v-for="(item, index) in friendList" :key="index" @click="handleListItem(item)">
               <aside class="left">
-                <img class="avatar" :src="item.friendAvatar || 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'" />
+                <img class="avatar" :src="item.friendAvatar || 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
               </aside>
               <div class="content-header">
                 <label>

+ 109 - 129
src/TUIKit/TUIComponents/container/TUIProfile/components/TUIProfileEdit/index.vue

@@ -1,56 +1,54 @@
-<template >
-  <div class="edit" :class="[isH5 ? 'edit-h5': '']">
+<template>
+  <div class="edit" :class="[isH5 ? 'edit-h5' : '']">
     <header class="edit-header">
       <i v-if="isH5" class="icon icon-back" @click="cancel"></i>
-      <h1 class="edit-header-title">{{$t('TUIProfile.资料设置')}}</h1>
+      <h1 class="edit-header-title">{{ $t("TUIProfile.资料设置") }}</h1>
     </header>
     <ul class="edit-list">
       <li class="edit-list-item space-top">
-          <main class="edit-list-item-content" @click="setProfile('avatar')">
-            <label>{{$t('TUIProfile.头像')}}</label>
-            <span v-if="isH5">
-              <img
-                :src="profile.avatar ? profile.avatar : 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
-                onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'">
-            </span>
-            <ul class="avatar-list" v-else>
-              <li class="avatar-list-item" v-for="(item,index) in avatarList"  :key="index" @click="chooseAvatar(item)">
-                <img :class="[profile.avatar === item.avatar &&  'selected']" :src="item.avatar" >
-              </li>
-            </ul>
-          </main>
-          <i v-if="isH5" class="icon icon-right"></i>
+        <main class="edit-list-item-content" @click="setProfile('avatar')">
+          <label>{{ $t("TUIProfile.头像") }}</label>
+          <span v-if="isH5">
+            <img :src="profile.avatar ? profile.avatar : 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
+          </span>
+          <ul class="avatar-list" v-else>
+            <li class="avatar-list-item" v-for="(item, index) in avatarList" :key="index" @click="chooseAvatar(item)">
+              <img :class="[profile.avatar === item.avatar && 'selected']" :src="item.avatar" />
+            </li>
+          </ul>
+        </main>
+        <i v-if="isH5" class="icon icon-right"></i>
       </li>
       <li class="edit-list-item space-top">
         <main class="edit-list-item-content" @click="setProfile('nick')">
-          <label>{{$t('TUIProfile.昵称')}}</label>
-          <span v-if="isH5">{{profile.nick}}</span>
-          <input v-else type="text" v-model="profile.nick">
+          <label>{{ $t("TUIProfile.昵称") }}</label>
+          <span v-if="isH5">{{ profile.nick }}</span>
+          <input v-else type="text" v-model="profile.nick" />
         </main>
         <i v-if="isH5" class="icon icon-right"></i>
       </li>
       <li class="edit-list-item">
         <main class="edit-list-item-content">
-          <label>{{$t('TUIProfile.账号')}}</label>
-          <span>{{profile.userID}}</span>
+          <label>{{ $t("TUIProfile.账号") }}</label>
+          <span>{{ profile.userID }}</span>
         </main>
       </li>
       <li class="edit-list-item space-top">
         <main class="edit-list-item-content" @click="setProfile('selfSignature')">
-          <label>{{$t('TUIProfile.个性签名')}}</label>
-          <span v-if="isH5">{{profile.selfSignature}}</span>
-          <input v-else type="text" v-model="profile.selfSignature">
+          <label>{{ $t("TUIProfile.个性签名") }}</label>
+          <span v-if="isH5">{{ profile.selfSignature }}</span>
+          <input v-else type="text" v-model="profile.selfSignature" />
         </main>
         <i v-if="isH5" class="icon icon-right"></i>
       </li>
       <li class="edit-list-item">
         <main class="edit-list-item-content" @click="setProfile('gender')">
-          <label>{{$t('TUIProfile.性别')}}</label>
-          <span v-if="isH5">{{profile.gender ? $t(`TUIProfile.${genderLabel[profile.gender]}`) : ''}}</span>
+          <label>{{ $t("TUIProfile.性别") }}</label>
+          <span v-if="isH5">{{ profile.gender ? $t(`TUIProfile.${genderLabel[profile.gender]}`) : "" }}</span>
           <ul v-else class="gender-list">
-            <li class="gender-list-item" v-for="(item, index) in type" :key="index"  @click="showChooseGender(item)">
+            <li class="gender-list-item" v-for="(item, index) in type" :key="index" @click="showChooseGender(item)">
               <i class="gender" :class="[profile.gender === item.type && 'gender-selected']"></i>
-              <p class="name">{{$t(`TUIProfile.${item.label}`)}}</p>
+              <p class="name">{{ $t(`TUIProfile.${item.label}`) }}</p>
             </li>
           </ul>
         </main>
@@ -58,65 +56,50 @@
       </li>
       <li class="edit-list-item">
         <main class="edit-list-item-content" @click="setProfile('birthday')">
-          <label>{{$t('TUIProfile.出生年月')}}</label>
-          <span v-if="isH5">{{profile.birthday}}</span>
-          <Datepicker
-            v-else
-            :placeholder="$t(`TUIProfile.请选择出生日期`)"
-            :enableTimePicker="false"
-            :format="format"
-            :previewFormat="format"
-            :modelValue="birthday"
-            @update:modelValue="showBirthday" />
+          <label>{{ $t("TUIProfile.出生年月") }}</label>
+          <span v-if="isH5">{{ profile.birthday }}</span>
+          <Datepicker v-else :placeholder="$t(`TUIProfile.请选择出生日期`)" :enableTimePicker="false" :format="format" :previewFormat="format" :modelValue="birthday" @update:modelValue="showBirthday" />
         </main>
         <i v-if="isH5" class="icon icon-right"></i>
       </li>
     </ul>
     <footer class="edit-footer" v-if="!isH5">
-      <button class="btn-default" @click="cancel">{{$t('TUIProfile.取消')}}</button>
-      <button class="btn-submit" @click="submit">{{$t('TUIProfile.保存')}}</button>
+      <button class="btn-default" @click="cancel">{{ $t("TUIProfile.取消") }}</button>
+      <button class="btn-submit" @click="submit">{{ $t("TUIProfile.保存") }}</button>
     </footer>
-    <div class="mask" v-if="setName&&isH5" @click.self="closeMask">
+    <div class="mask" v-if="setName && isH5" @click.self="closeMask">
       <div class="mask-main">
         <header class="edit-h5-header">
-          <h1>{{$t(`TUIProfile.${editConfig.title}`)}}</h1>
-          <span class="close" @click="closeMask">{{$t(`关闭`)}}</span>
+          <h1>{{ $t(`TUIProfile.${editConfig.title}`) }}</h1>
+          <span class="close" @click="closeMask">{{ $t(`关闭`) }}</span>
         </header>
         <main class="edit-h5-main">
           <ul class="list" v-if="editConfig.type === 'select'">
-            <li class="list-item" v-for="(item,index) in editConfig.list"  :key="index" @click="choose(item)">
-              <img v-if="item?.avatar" :class="[editConfig.value === item.avatar &&  'selected']" :src="item.avatar">
-              <span v-else :class="[editConfig.value === item.type &&  'selected']">{{$t(`TUIProfile.${item.label}`)}}</span>
+            <li class="list-item" v-for="(item, index) in editConfig.list" :key="index" @click="choose(item)">
+              <img v-if="item?.avatar" :class="[editConfig.value === item.avatar && 'selected']" :src="item.avatar" />
+              <span v-else :class="[editConfig.value === item.type && 'selected']">{{ $t(`TUIProfile.${item.label}`) }}</span>
             </li>
           </ul>
           <div class="input" v-else>
             <textarea v-if="editConfig.type === 'textarea'" :placeholder="editConfig.placeholder" v-model="editConfig.value"></textarea>
-            <Datepicker
-              class="datePicker"
-              :placeholder="$t(`TUIProfile.请选择出生日期`)"
-              v-else-if="editConfig.type === 'date'"
-              :enableTimePicker="false"
-              :format="format"
-              :previewFormat="format"
-              :modelValue="birthday"
-              @update:modelValue="showBirthday" />
-            <input v-else :type="editConfig.type" :placeholder="$t(`TUIProfile.${editConfig.placeholder}`)" v-model="editConfig.value">
+            <Datepicker class="datePicker" :placeholder="$t(`TUIProfile.请选择出生日期`)" v-else-if="editConfig.type === 'date'" :enableTimePicker="false" :format="format" :previewFormat="format" :modelValue="birthday" @update:modelValue="showBirthday" />
+            <input v-else :type="editConfig.type" :placeholder="$t(`TUIProfile.${editConfig.placeholder}`)" v-model="editConfig.value" />
           </div>
-          <sub v-if="editConfig.subText">{{$t(`TUIProfile.${editConfig.subText}`)}}</sub>
+          <sub v-if="editConfig.subText">{{ $t(`TUIProfile.${editConfig.subText}`) }}</sub>
         </main>
         <footer class="edit-h5-footer">
-          <button class="btn btn-submit" :disabled="!editConfig.value" @click="submit">{{$t(`确定`)}}</button>
+          <button class="btn btn-submit" :disabled="!editConfig.value" @click="submit">{{ $t(`确定`) }}</button>
         </footer>
       </div>
     </div>
   </div>
 </template>
 <script lang="ts">
-import { computed, defineComponent, reactive, toRefs, watchEffect } from 'vue';
-import Datepicker from '@vuepic/vue-datepicker';
-import '@vuepic/vue-datepicker/dist/main.css';
+import { computed, defineComponent, reactive, toRefs, watchEffect } from "vue";
+import Datepicker from "@vuepic/vue-datepicker";
+import "@vuepic/vue-datepicker/dist/main.css";
 
-const TUIProfileEdit:any = defineComponent({
+const TUIProfileEdit: any = defineComponent({
   props: {
     userInfo: {
       type: Object,
@@ -128,64 +111,64 @@ const TUIProfileEdit:any = defineComponent({
     },
   },
   components: { Datepicker },
-  setup(props:any, ctx:any) {
-    const TUIServer:any = TUIProfileEdit?.TUIServer;
+  setup(props: any, ctx: any) {
+    const TUIServer: any = TUIProfileEdit?.TUIServer;
     const data = reactive({
       profile: {},
       isEdit: false,
       avatarList: [
         {
-          name: 'avatar_01',
-          avatar: ' https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_1.png',
+          name: "avatar_01",
+          avatar: " https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_1.png",
         },
         {
-          name: 'avatar_02',
-          avatar: ' https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_2.png',
+          name: "avatar_02",
+          avatar: " https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_2.png",
         },
         {
-          name: 'avatar_03',
-          avatar: ' https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_3.png',
+          name: "avatar_03",
+          avatar: " https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_3.png",
         },
         {
-          name: 'avatar_04',
-          avatar: ' https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_4.png',
+          name: "avatar_04",
+          avatar: " https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_4.png",
         },
         {
-          name: 'avatar_05',
-          avatar: ' https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_5.png',
+          name: "avatar_05",
+          avatar: " https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_5.png",
         },
         {
-          name: 'avatar_06',
-          avatar: ' https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_6.png',
+          name: "avatar_06",
+          avatar: " https://im.sdk.qcloud.com/download/tuikit-resource/avatar/avatar_6.png",
         },
       ],
       type: [
         {
-          label: '男',
+          label: "男",
           type: TUIServer.TUICore.TIM.TYPES.GENDER_MALE,
         },
         {
-          label: '女',
+          label: "女",
           type: TUIServer.TUICore.TIM.TYPES.GENDER_FEMALE,
         },
       ],
       genderLabel: {
-        [TUIServer.TUICore.TIM.TYPES.GENDER_MALE]: '男',
-        [TUIServer.TUICore.TIM.TYPES.GENDER_FEMALE]: '女',
-        [TUIServer.TUICore.TIM.TYPES.GENDER_UNKNOWN]: '不显示',
+        [TUIServer.TUICore.TIM.TYPES.GENDER_MALE]: "男",
+        [TUIServer.TUICore.TIM.TYPES.GENDER_FEMALE]: "女",
+        [TUIServer.TUICore.TIM.TYPES.GENDER_UNKNOWN]: "不显示",
       },
-      setName: '',
+      setName: "",
       editConfig: {
-        title: '',
+        title: "",
         list: [],
-        type: '', // select、text、textarea、date
-        subText: '',
-        placeholder: '',
-        value: '',
+        type: "", // select、text、textarea、date
+        subText: "",
+        placeholder: "",
+        value: "",
       },
     });
 
-    const format = (date:any) => {
+    const format = (date: any) => {
       const day = date.getDate() > 9 ? date.getDate() : `0${date.getDate()}`;
       const month = date.getMonth() > 8 ? date.getMonth() + 1 : `0${date.getMonth() + 1}`;
       const year = date.getFullYear();
@@ -196,37 +179,34 @@ const TUIProfileEdit:any = defineComponent({
       data.profile = JSON.parse(JSON.stringify(props.userInfo));
     });
 
-
     const birthday = computed(() => {
       let value = (data.profile as any).birthday;
-      if (data.setName === 'birthday' && props.isH5) {
+      if (data.setName === "birthday" && props.isH5) {
         value = data.editConfig.value;
       }
       return handleBirthdayFamate(value);
     });
 
     const handleBirthdayFamate = (value: any) => {
-      const birthday:any = `${value}`;
+      const birthday: any = `${value}`;
       if (birthday.length === 8) {
         const y = birthday.slice(0, 4);
         const m = birthday.slice(4, 6);
         const d = birthday.slice(-2);
-        return  `${y}-${m}-${d}`;
+        return `${y}-${m}-${d}`;
       }
-      return '';
+      return "";
     };
 
-
-    const showChooseGender = (options: any)  =>  {
+    const showChooseGender = (options: any) => {
       (data.profile as any).gender = options.type;
     };
 
-
-    const  chooseAvatar = (item: any) =>  {
-      (data.profile as any).avatar  = item.avatar;
+    const chooseAvatar = (item: any) => {
+      (data.profile as any).avatar = item.avatar;
     };
 
-    const showBirthday = (e:any) => {
+    const showBirthday = (e: any) => {
       if (!props.isH5) {
         (data.profile as any).birthday = e ? Number(format(e)) : 0;
       } else {
@@ -239,61 +219,61 @@ const TUIProfileEdit:any = defineComponent({
         (data.profile as any)[data.setName] = data.editConfig.value;
         closeMask();
       }
-      ctx.emit('submit', data.profile);
+      ctx.emit("submit", data.profile);
     };
 
     const cancel = () => {
-      ctx.emit('cancel', data.profile);
+      ctx.emit("cancel", data.profile);
     };
 
     const setProfile = (name: string) => {
       data.editConfig.value = `${(data.profile as any)[name]}`;
       data.setName = name;
       switch (name) {
-        case 'avatar':
-          data.editConfig.title = '选择头像';
+        case "avatar":
+          data.editConfig.title = "选择头像";
           (data.editConfig.list as unknown) = data.avatarList;
-          data.editConfig.type = 'select';
+          data.editConfig.type = "select";
           break;
-        case 'nick':
-          data.editConfig.title = '设置昵称';
-          data.editConfig.subText = '仅限中文、字母、数字和下划线,2-20个字';
-          data.editConfig.placeholder = '请输入昵称';
-          data.editConfig.type = 'text';
+        case "nick":
+          data.editConfig.title = "设置昵称";
+          data.editConfig.subText = "仅限中文、字母、数字和下划线,2-20个字";
+          data.editConfig.placeholder = "请输入昵称";
+          data.editConfig.type = "text";
           break;
-        case 'gender':
-          data.editConfig.title = '性别选择';
+        case "gender":
+          data.editConfig.title = "性别选择";
           (data.editConfig.list as unknown) = data.type;
-          data.editConfig.type = 'select';
+          data.editConfig.type = "select";
           break;
-        case 'selfSignature':
-          data.editConfig.title = '个性签名';
-          data.editConfig.type = 'textarea';
-          data.editConfig.placeholder = '请输入内容';
+        case "selfSignature":
+          data.editConfig.title = "个性签名";
+          data.editConfig.type = "textarea";
+          data.editConfig.placeholder = "请输入内容";
           break;
-        case 'birthday':
-          data.editConfig.title = '出生年月';
-          data.editConfig.type = 'date';
-          data.editConfig.placeholder = '请选择出生日期';
+        case "birthday":
+          data.editConfig.title = "出生年月";
+          data.editConfig.type = "date";
+          data.editConfig.placeholder = "请选择出生日期";
           break;
         default:
           break;
       }
     };
 
-    const choose = (item: any) =>  {
-      data.editConfig.value  = item?.avatar || item?.type;
+    const choose = (item: any) => {
+      data.editConfig.value = item?.avatar || item?.type;
     };
 
     const closeMask = () => {
-      data.setName = '';
+      data.setName = "";
       data.editConfig = {
-        title: '',
+        title: "",
         list: [],
-        type: '',
-        subText: '',
-        placeholder: '',
-        value: '',
+        type: "",
+        subText: "",
+        placeholder: "",
+        value: "",
       };
     };
 

+ 19 - 23
src/TUIKit/TUIComponents/container/TUIProfile/index.vue

@@ -3,37 +3,33 @@
     <div class="profile" v-if="!isEdit" @click="toggleEdit">
       <header class="profile-header">
         <aside class="profile-avatar">
-          <img
-            class="avatar"
-            :src="profile.avatar ? profile.avatar : 'https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
-            onerror="this.src='https://news-info.ks3-cn-beijing.ksyuncs.com/07/1690787574969.png'"
-          />
+          <img class="avatar" :src="profile.avatar ? profile.avatar : 'https://oss.dayaedu.com/news-info/07/1690787574969.png'" onerror="this.src='https://oss.dayaedu.com/news-info/07/1690787574969.png'" />
         </aside>
         <ul class="profile-main">
           <li class="profile-main-item">
-            <h1 class="profile-main-name">{{ profile.nick || '-' }}</h1>
+            <h1 class="profile-main-name">{{ profile.nick || "-" }}</h1>
             <p class="gender" v-if="!env.isH5">
-              {{ profile.gender ? $t(`TUIProfile.${genderLabel[profile.gender]}`) : '' }}
+              {{ profile.gender ? $t(`TUIProfile.${genderLabel[profile.gender]}`) : "" }}
             </p>
           </li>
           <li class="profile-main-item">
-            <label class="profile-main-label">{{ $t('TUIProfile.用户ID') }}:</label>
+            <label class="profile-main-label">{{ $t("TUIProfile.用户ID") }}:</label>
             <span>{{ profile.userID }}</span>
           </li>
           <li class="profile-main-item" v-if="env.isH5">
-            <label class="profile-main-label">{{ $t('TUIProfile.个性签名') }}:</label>
-            <span>{{ profile.selfSignature || $t('TUIProfile.暂未设置') }}</span>
+            <label class="profile-main-label">{{ $t("TUIProfile.个性签名") }}:</label>
+            <span>{{ profile.selfSignature || $t("TUIProfile.暂未设置") }}</span>
           </li>
         </ul>
       </header>
       <ul class="profile-main" v-if="!env.isH5">
         <li class="profile-main-item">
-          <label class="profile-main-label">{{ $t('TUIProfile.个性签名') }}</label>
-          <span>{{ profile.selfSignature || $t('TUIProfile.暂未设置') }}</span>
+          <label class="profile-main-label">{{ $t("TUIProfile.个性签名") }}</label>
+          <span>{{ profile.selfSignature || $t("TUIProfile.暂未设置") }}</span>
         </li>
         <li class="profile-main-item">
-          <label class="profile-main-label">{{ $t('TUIProfile.出生年月') }}</label>
-          <span>{{ profile.birthday ? profile.birthday : $t('TUIProfile.暂未设置') }}</span>
+          <label class="profile-main-label">{{ $t("TUIProfile.出生年月") }}</label>
+          <span>{{ profile.birthday ? profile.birthday : $t("TUIProfile.暂未设置") }}</span>
         </li>
       </ul>
       <i class="icon icon-right" v-if="env.isH5"></i>
@@ -42,12 +38,12 @@
   </div>
 </template>
 <script lang="ts">
-import { defineComponent, reactive, toRefs } from 'vue';
-import { useStore } from 'vuex';
-import TUIProfileEdit from './components/TUIProfileEdit';
+import { defineComponent, reactive, toRefs } from "vue";
+import { useStore } from "vuex";
+import TUIProfileEdit from "./components/TUIProfileEdit";
 
 const TUIProfile = defineComponent({
-  name: 'TUIProfile',
+  name: "TUIProfile",
   components: {
     TUIProfileEdit,
   },
@@ -57,9 +53,9 @@ const TUIProfile = defineComponent({
       profile: {},
       isEdit: false,
       genderLabel: {
-        [TUIServer.TUICore.TIM.TYPES.GENDER_MALE]: '男',
-        [TUIServer.TUICore.TIM.TYPES.GENDER_FEMALE]: '女',
-        [TUIServer.TUICore.TIM.TYPES.GENDER_UNKNOWN]: '不显示',
+        [TUIServer.TUICore.TIM.TYPES.GENDER_MALE]: "男",
+        [TUIServer.TUICore.TIM.TYPES.GENDER_FEMALE]: "女",
+        [TUIServer.TUICore.TIM.TYPES.GENDER_UNKNOWN]: "不显示",
       },
       env: TUIServer.TUICore.TUIEnv,
     });
@@ -79,7 +75,7 @@ const TUIProfile = defineComponent({
         birthday: profile.birthday,
       };
       if (TUIServer.TUICore.getStore().TUIProfile.profile.nick !== profile.nick) {
-        (window as any)?.TUIKitTUICore?.isOfficial && VuexStore?.commit && VuexStore?.commit('handleTask', 2);
+        (window as any)?.TUIKitTUICore?.isOfficial && VuexStore?.commit && VuexStore?.commit("handleTask", 2);
       }
       try {
         await TUIServer.updateMyProfile(options);
@@ -100,7 +96,7 @@ const TUIProfile = defineComponent({
     };
 
     const changeStatus = () => {
-      ctx.emit('changeStatus');
+      ctx.emit("changeStatus");
     };
 
     const toggleEdit = () => {