Merge branch 'kt-20240909'

src/TUIKit/TUIComponents/container/TUIChat/components/message-custom.vue

@@ -257,7 +257,7 @@ a {
   }
 
   .notice-message {
-    max-width: 376px;
+    width: 376px;
     cursor: pointer;
     .notice-title {
       display: flex;
@@ -265,7 +265,7 @@ a {
       padding-bottom: 6px;
       span {
         font-weight: 600;
-        font-size: 16px;
+        font-size: 14Px;
         color: #198CFE;
         line-height: 24px;
       }
@@ -278,7 +278,7 @@ a {
       }
     }
     .content {
-      font-size: 16px;
+      font-size: 14Px;
       color: #131415;
       line-height: 24px;
       .content-title {

src/TUIKit/TUIComponents/container/TUIChat/components/message-reference.vue

@@ -116,7 +116,6 @@ const MessageReference = defineComponent({
       data.allMessageID = props.allMessageID;
       data.type = props.type;
 
-      console.log(data, '-----------------')
     });
     watch(
       () => props.referenceForShow,

src/TUIKit/TUIComponents/container/TUIChat/manage-components/manage-notification-detail.vue

@@ -147,6 +147,7 @@ import {
   imGroupNoticeRemove,
 } from "../../../../api";
 import Slider from "../../../components/sliderTUI/index.vue";
+import TUIMessage from "../../../components/messageTUI/index";
 const ManageNotification = defineComponent({
   components: {
     Slider,
@@ -242,8 +243,13 @@ const ManageNotification = defineComponent({
           data.id = "";
           ctx.emit("changeStatus", "addDetail");
         }
-      } catch (e) {
+      } catch(e) {
         //
+        TUIMessage({
+          message: e.message,
+          isH5: false,
+          type: "error",
+        });
       }
       popoverRef.value?.setShow(false);
     };
@@ -276,8 +282,13 @@ const ManageNotification = defineComponent({
         data.page = 1;
         data.groupDetail = [];
         getNotification();
-      } catch {
+      } catch(e) {
         //
+        TUIMessage({
+          message: e.message,
+          isH5: false,
+          type: "error",
+        });
       }
     };
 
@@ -408,14 +419,14 @@ export default ManageNotification;
   .section-content {
     h2 {
       font-weight: 600;
-      font-size: 16px;
+      font-size: 14px;
       color: #333333;
       line-height: 24px;
       word-wrap: break-word;
       word-break: break-all;
     }
     .content {
-      font-size: 16px;
+      font-size: 14px;
       color: #777777;
       line-height: 24px;
       word-wrap: break-word;
@@ -448,7 +459,7 @@ export default ManageNotification;
   }
 
   p {
-    font-size: 16px;
+    font-size: 14px;
     color: #aaaaaa;
     line-height: 22px;
   }
@@ -477,7 +488,7 @@ export default ManageNotification;
   .input-title {
     display: flex;
     align-items: center;
-    font-size: 16px;
+    font-size: 14px;
     color: #333333;
     line-height: 22px;
     padding-bottom: 10px;
@@ -490,7 +501,7 @@ export default ManageNotification;
     }
     span {
       line-height: 1;
-      padding-bottom: 4px;
+      padding-bottom: 2px;
     }
   }
 
@@ -521,9 +532,9 @@ export default ManageNotification;
   background: #198cfe;
   border-radius: 8px;
   font-weight: 600;
-  font-size: 18px;
+  font-size: 14px;
   color: #ffffff;
-  line-height: 47px;
+  line-height: 42px;
   text-align: center;
   cursor: pointer;
 
@@ -549,7 +560,7 @@ export default ManageNotification;
 
   .p-item {
     margin-bottom: 8px;
-    font-size: 16px;
+    font-size: 14px;
     color: #131415;
     border-radius: 8px;
     padding: 12px 0;

src/TUIKit/TUIComponents/container/TUIChat/manage-components/manage-notification.vue

@@ -11,7 +11,7 @@
               <span class="tag">{{ formatJobType(item.jobType) }}</span>
             </div>
             <div class="userTime">
-              <span class="time">{{ item.createTime }}</span>
+              <span class="time">{{ item.updateTime }}</span>
               <span class="tag" v-if="item.topFlag">置顶</span>
             </div>
           </div>
@@ -34,7 +34,7 @@
                 编辑公告
               </div>
               <div class="p-item" @click="onOperation(item, 'top', index)">
-                设为置顶
+                {{item.topFlag ? '取消置顶': '设为置顶'}}
               </div>
               <div
                 class="p-item p-red"
@@ -162,6 +162,7 @@ import {
   imGroupNoticeRemove,
 } from "../../../../api";
 import Slider from "../../../components/sliderTUI/index.vue";
+import TUIMessage from "../../../components/messageTUI/index";
 const ManageNotification = defineComponent({
   components: {
     Slider,
@@ -245,7 +246,7 @@ const ManageNotification = defineComponent({
         } else if (type === "top") {
           await imGroupNoticeUpdate({
             groupId: data.groupProfile.groupID,
-            topFlag: true,
+            topFlag: item.topFlag ? false : true,
             id: item.id,
           });
           data.page = 1;
@@ -266,8 +267,13 @@ const ManageNotification = defineComponent({
           data.id = "";
           ctx.emit("changeStatus", "add");
         }
-      } catch (e) {
+      } catch(e) {
         //
+        TUIMessage({
+          message: e.message,
+          isH5: false,
+          type: "error",
+        });
       }
       popoverRef.value[index]?.setShow(false);
     };
@@ -300,8 +306,13 @@ const ManageNotification = defineComponent({
         data.page = 1;
         data.groupList = [];
         getNotification();
-      } catch {
+      } catch(e) {
         //
+        TUIMessage({
+          message: e.message,
+          isH5: false,
+          type: "error",
+        });
       }
     };
 
@@ -432,14 +443,14 @@ export default ManageNotification;
   .section-content {
     h2 {
       font-weight: 600;
-      font-size: 16px;
+      font-size: 14px;
       color: #333333;
       line-height: 24px;
       word-wrap: break-word;
       word-break: break-all;
     }
     .content {
-      font-size: 16px;
+      font-size: 14px;
       color: #777777;
       line-height: 24px;
       word-wrap: break-word;
@@ -472,7 +483,7 @@ export default ManageNotification;
   }
 
   p {
-    font-size: 16px;
+    font-size: 14px;
     color: #aaaaaa;
     line-height: 22px;
   }
@@ -501,7 +512,7 @@ export default ManageNotification;
   .input-title {
     display: flex;
     align-items: center;
-    font-size: 16px;
+    font-size: 14px;
     color: #333333;
     line-height: 22px;
     padding-bottom: 10px;
@@ -514,7 +525,7 @@ export default ManageNotification;
     }
     span {
       line-height: 1;
-      padding-bottom: 4px;
+      padding-bottom: 2px;
     }
   }
 
@@ -545,9 +556,9 @@ export default ManageNotification;
   background: #198cfe;
   border-radius: 8px;
   font-weight: 600;
-  font-size: 18px;
+  font-size: 14px;
   color: #ffffff;
-  line-height: 47px;
+  line-height: 42px;
   text-align: center;
   cursor: pointer;
 
@@ -573,7 +584,7 @@ export default ManageNotification;
 
   .p-item {
     margin-bottom: 8px;
-    font-size: 16px;
+    font-size: 14px;
     color: #131415;
     border-radius: 8px;
     padding: 12px 0;

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

@@ -67,7 +67,7 @@
           <li @click.stop="setTab('notification')">
             <aside>
               <label>{{ $t(`TUIChat.manage.群公告`) }}</label>
-              <article>{{ conversation.groupProfile.notification }}</article>
+              <!-- <article>{{ conversation.groupProfile.notification }}</article> -->
             </aside>
             <i class="icon icon-right end"></i>
           </li>
@@ -366,11 +366,11 @@ const manage = defineComponent({
           break;
         case "notificationAdd":
           case "notificationAddDetail":
-          name = '添加群公告';
+          name = '新建群公告';
           break;
         case "notificationUpdate":
         case "notificationUpdateDetail":
-          name = '修改群公告';
+          name = '编辑群公告';
           break;
         case "notificationDetail":
           name = "公告详情";
@@ -1008,6 +1008,8 @@ const manage = defineComponent({
           } catch {
             //
           }
+        } else {
+          data.currentTab = ''
         }
       }
     );

src/TUIKit/TUIComponents/container/TUIChat/manage-components/style/web.scss

@@ -45,7 +45,7 @@
       }
 
       .icon {
-        margin-right: 14Px;
+        margin-right: 5Px;
         background-position: center;
       }
 

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

@@ -5,7 +5,7 @@
       <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.messageSenderName || message.messageSender }}
           </label>
           <label class="time">
             {{ caculateTimeago((isRoot ? message?.time : message?.messageTime) * 1000) }}
@@ -14,7 +14,19 @@
         <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">
-            {{ handleCustomMessageShowContext(message)?.custom }}
+            <div class="notice-message" @click="handleNotice" v-if="isCustom.businessID === constant.TC_GROUP_NOTICE">
+              <div class="notice-title">
+                <i class="iconNotice"></i>
+                <span>群公告</span>
+              </div>
+              <div class="content">
+                <div class="content-title">
+                {{isCustom.msgTitle}}
+                </div>
+                <div class="content-text">{{isCustom.msgContent}}</div>
+              </div>
+            </div>
+            <span v-else>{{ handleCustomMessageShowContext(message)?.custom }}</span>
           </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`">
@@ -45,9 +57,13 @@ import { defineComponent, reactive, toRefs, watchEffect } from "vue";
 import { Message } from "../../interface";
 import { handleTextMessageShowContext, handleCustomMessageShowContext, handleFileMessageShowContext } from "../../utils/utils";
 import { MessageText, MessageEmojiReact } from "../../components";
+import TUIMessage from "../../../../components/messageTUI/index";
 import { caculateTimeago } from "../../../utils";
+import { JSONToObject } from '../../utils/utils'
 import constant from "../../../constant";
 import TIM from "../../../../../TUICore/tim/index";
+import { eventGlobal } from "@/helpers";
+// import { imGroupNoticeDetail } from "../../../../../api";
 const RepliesItem = defineComponent({
   props: {
     message: {
@@ -70,6 +86,7 @@ const RepliesItem = defineComponent({
   setup(props: any, ctx: any) {
     const data = reactive({
       message: {} as Message,
+      isCustom: {},
       isH5: false,
       url: "",
       isRoot: false,
@@ -78,14 +95,37 @@ const RepliesItem = defineComponent({
     });
     watchEffect(() => {
       data.message = props.message;
+       const {
+        payload
+      } = props.message;
+      data.isCustom = payload?.data || ' ';
+      data.isCustom = JSONToObject(payload?.data);
       data.isH5 = props.isH5;
       data.isRoot = props.isRoot;
       if (data.message.type === TIM.TYPES.MSG_FACE) {
         data.url = `https://web.sdk.qcloud.com/im/assets/face-elem/${data.message?.payload?.data}@2x.png`;
       }
+
+      console.log(props.message, '----------------- ')
     });
+
+    const handleNotice = async () => {
+      // if(!data.isCustom?.msgId) return
+      // try {
+      //   await imGroupNoticeDetail(data.isCustom?.msgId)
+      //   eventGlobal.emit('handleNotice', data.isCustom?.msgId)
+      // } catch(e) {
+      //   //
+      //   TUIMessage({
+      //     message: e.message,
+      //     isH5: false,
+      //     type: "error",
+      //   });
+      // }
+    }
     return {
       ...toRefs(data),
+      handleNotice,
       handleTextMessageShowContext,
       handleCustomMessageShowContext,
       handleFileMessageShowContext,
@@ -99,6 +139,39 @@ export default RepliesItem;
 .replies-item {
   padding: 15px;
   width: auto;
+
+  .notice-message {
+    max-width: 376px;
+    cursor: pointer;
+    .notice-title {
+      display: flex;
+      align-items: center;
+      padding-bottom: 6px;
+      span {
+        font-weight: 600;
+        font-size: 14Px;
+        color: #198CFE;
+        line-height: 24px;
+      }
+            
+      .iconNotice {
+        width: 18px;
+        height: 18px;
+        display: inline-block;
+        margin-right: 6px;
+      }
+    }
+    .content {
+      font-size: 14Px;
+      padding: 0 !important;
+      color: #131415;
+      line-height: 24px;
+      .content-title {
+        font-weight: 600;
+        
+      }
+    }
+  }
   &-normal {
     padding: 12.8px 15px 0 17px;
     .message-bubble {
@@ -173,7 +246,7 @@ export default RepliesItem;
       }
     }
     .content {
-      padding: 12px;
+      padding: 12px 0 0;
       font-weight: 400;
       font-size: 14px;
       color: #000000;
@@ -182,7 +255,7 @@ export default RepliesItem;
       word-break: break-all;
       width: fit-content;
       &-in {
-        background: #f2f2f2;
+        background: #fff;
         border-radius: 0px 10px 10px 10px;
         .message-img,
         .message-videoimg {

src/TUIKit/TUIComponents/container/TUIChat/plugin-components/replies/replies.vue

@@ -38,6 +38,7 @@ import { Message } from '../../interface';
 import TIM from '../../../../../TUICore/tim';
 import RepliesItem from './replies-item.vue';
 import { JSONToObject } from '../../utils/utils';
+import { imUserFriendBatchFriend } from "../../../../../api";
 const ReadReceiptDialog = defineComponent({
   type: 'custom',
   components: {
@@ -115,18 +116,24 @@ const ReadReceiptDialog = defineComponent({
       close();
     });
 
-    const handleReplies = (message: Message) => {
+    const handleReplies = async (message: Message) => {
       try {
         const { cloudCustomData } = message;
         if (!cloudCustomData) return;
         const cloudCustomObject = JSONToObject(cloudCustomData);
         data.replies = cloudCustomObject?.messageReplies?.replies;
-        data?.replies?.forEach((item: any) => {
+        data?.replies?.forEach(async (item: any) => {
           const { messageID, messageSender } = item;
           const message = data.messageList.find((item: Message) => 
             (item.ID === messageID || item.from === messageSender)
           );
           item.avatar = message ? (message as Message)?.avatar : '';
+          try {
+            const res = await imUserFriendBatchFriend({ imUserIds: [messageSender] })
+            item.messageSenderName = res.data[0]?.friendNickname || res.data[0]?.imUserId
+          } catch {
+            // 
+          }
         });
       } catch (err) {
         console.log(err);

src/TUIKit/TUIComponents/container/TUIChat/utils/utils.ts

@@ -393,9 +393,20 @@ export function handleCustomMessageShowContext(item: any) {
       item.payload.data = JSON.stringify(payloadObj);
     }
   }
+  let callingMessage: any = {}
+  try {
+    callingMessage = JSONToObject(item?.payload?.data);
+  } catch (error) {
+    callingMessage = {};
+  }
+  let customContent = extractCallingInfoFromMessage(item) || `[${t("message.custom.自定义消息")}]`
+
+  if(callingMessage?.businessID === "TC_GROUP_NOTICE") {
+    customContent = '[群公告]'
+  }
   return {
     message: item,
-    custom: extractCallingInfoFromMessage(item) || `[${t("message.custom.自定义消息")}]`,
+    custom: customContent,
   };
 }
 

src/TUIKit/api.ts

@@ -145,3 +145,12 @@ export const imGroupDismiss = (params?: any) => {
     data: params,
   });
 };
+
+/**
+ * 即时通讯 - 用户信息
+ */
+export const imUserFriendBatchFriend = (params?: any) => {
+  return request.post(api + "/imUserFriend/batchFriend", {
+    data: params,
+  });
+};

vite.config.ts

@@ -12,7 +12,7 @@ function pathResolve(dir: string) {
 // function resolve(dir: string) {
 //   return path.join(__dirname, dir);
 // }
-const proxyUrl = "https://dev.kt.colexiu.com";
+const proxyUrl = "https://test.kt.colexiu.com";
 // https://vitejs.dev/config/
 export default defineConfig({
   base: "./",