消息-群设置功能

src/views/message/components/GroupSetting.vue

@@ -9,7 +9,10 @@
     >
       <div class="group-setting">
         <!-- 群头像和名称 -->
-        <div class="group-info">
+        <div
+          class="group-info"
+          v-if="currentChat.scene === ContactsScene.GROUP"
+        >
           <el-avatar
             :size="40"
             :src="
@@ -34,7 +37,11 @@
         <div class="section">
           <div class="section-title">群成员 {{ groupInfo.user_num }}人</div>
           <div class="member-list">
-            <div class="member-item" @click="showAddMember">
+            <div
+              class="member-item"
+              @click="showAddMember"
+              v-if="currentChat.scene === ContactsScene.GROUP"
+            >
               <el-icon
                 class="el-icon-circle-plus-outline"
                 style="font-size: 40px"
@@ -68,13 +75,18 @@
                   <i class="el-icon-minus" />
                 </span>
               </div>
-              <span class="member-name" :title="member.name">{{ member.name }}</span>
+              <span class="member-name" :title="member.name">{{
+                member.name
+              }}</span>
             </div>
           </div>
         </div>
         <!-- 群管理员 -->
         <div
-          v-if="groupInfo.user_list.some((m) => m.id === groupInfo.user_id)"
+          v-if="
+            groupInfo.user_list.some((m) => m.id === groupInfo.user_id) &&
+            currentChat.scene === ContactsScene.GROUP
+          "
           class="section"
         >
           <div class="section-title">群管理员</div>
@@ -93,12 +105,14 @@
                   member.avatar
                 "
               />
-              <span class="member-name" :title="member.name">{{ member.name }}</span>
+              <span class="member-name" :title="member.name">{{
+                member.name
+              }}</span>
             </div>
           </div>
         </div>
         <!-- 操作按钮 -->
-        <div class="actions">
+        <div class="actions" v-if="currentChat.scene === ContactsScene.GROUP">
           <el-button type="danger" @click="handleQuitGroup">
             退出群组
           </el-button>
@@ -369,7 +383,7 @@ export default {
       font-size: 12px;
       color: #606266;
       text-align: center;
-       width: 100%;
+      width: 100%;
       overflow: hidden;
       text-overflow: ellipsis;
       white-space: nowrap;

src/views/message/components/MessageDisplay.vue

@@ -19,7 +19,7 @@
           type="text"
           icon="el-icon-s-tools"
           @click="handleGroupSetting"
-          v-if="currentChat && currentChat.scene === ContactsScene.GROUP"
+          v-if="currentChat"
         />
       </div>
     </div>
@@ -676,14 +676,11 @@ export default {
       text = text.replace(/\n/g, "<br>");
       // @高亮 - 添加 data 属性存储用户名和索引
       let atIndex = 0;
-      text = text.replace(
+      text = text.replace(/@([^\s@]+)/g, (match, username) => {
-        /@([^\s@]+)/g,
+        const result = `<span class="at-highlight" data-username="${username}" data-at-index="${atIndex}">@${username}</span>`;
-        (match, username) => {
+        atIndex++;
-          const result = `<span class="at-highlight" data-username="${username}" data-at-index="${atIndex}">@${username}</span>`;
+        return result;
-          atIndex++;
+      });
-          return result;
-        }
-      );
       // URL链接
       text = text.replace(
         /(https?:\/\/[^\s]+)/g,
@@ -713,7 +710,7 @@ export default {
     async getUserInfoById(userId) {
       try {
         const response = await this.$http.get(`/api/v1/users/info`, {
-          params: { user_id: userId }
+          params: { user_id: userId },
         });
 
         if (response.data.code === 200) {
@@ -729,19 +726,25 @@ export default {
     },
 
     showUserInfoModal(userInfo) {
-      this.$alert(`
+      this.$alert(
+        `
         <div style="text-align: left;">
-          <h3 style="margin-bottom: 15px;">${userInfo.name || userInfo.username}</h3>
+          <h3 style="margin-bottom: 15px;">${
+            userInfo.name || userInfo.username
+          }</h3>
           <p><strong>账号：</strong>${userInfo.username}</p>
           <p><strong>手机：</strong>${userInfo.phone || "-"}</p>
           <p><strong>邮箱：</strong>${userInfo.email || "-"}</p>
           <p><strong>部门：</strong>${userInfo.department || "-"}</p>
           <p><strong>职位：</strong>${userInfo.position || "-"}</p>
         </div>
-      `, '用户信息', {
+      `,
-        dangerouslyUseHTMLString: true,
+        "用户信息",
-        confirmButtonText: '关闭'
+        {
-      });
+          dangerouslyUseHTMLString: true,
+          confirmButtonText: "关闭",
+        }
+      );
     },
 
     getFileUrl(pathOrUrl) {