添加请求加入群聊功能

src/api/user.js

@@ -40,6 +40,17 @@ export const getUUIDService = (registerData) => {
     return request.post('/user/uuid', params)
 }
 
+export const addGroupRequestService  = (Data) => {
+    const params = new URLSearchParams();
+    for (let key in Data) {
+        params.append(key, Data[key])
+    }
+    return request.post('/im/send_message', params,{
+        headers: {
+            'token': Data.token, // 将 token 替换为您的令牌值  
+        }
+    })
+}
 export const getFriendReqService = (Data) => {
     const params = new URLSearchParams();
     for (let key in Data) {

src/views/Chat.vue

@@ -33,6 +33,7 @@
                                 <!-- <template #title>Group 1</template> -->
                                 <el-menu-item :index="String(item.GroupName)" @click="handleGetGroupMessage(item.ID)">{{ item.GroupName
                                 }}</el-menu-item>
+                                <span v-if="hasUnreadMsg[`g_${item.ID}`]" class="unread-dot"></span>
                                 <!-- <el-menu-item index="2-2">Option 2</el-menu-item> -->
                             </el-menu-item-group>
                         </el-scrollbar>
@@ -199,6 +200,7 @@ export default {
       this.cur_user_id=0;
       this.to_user_id=0;
       this.msg_type=2;
+      this.hasUnreadMsg["g_"+id]=false;
       let result={}
       try {
         let req={

src/views/Group.vue

@@ -19,6 +19,8 @@ export default {
       FriendsTableIsDisplay:false,
       tableData: [],
       group_id:0,
+      GroupRequestIsDisplay : false,
+      GroupRequestList:[],
       tokenData: {
         token: localStorage.getItem("token"),
         ip: localStorage.getItem("ip"),
@@ -251,6 +253,46 @@ export default {
         console.error(error);
       }
     },
+    async displayGroupReq(){
+      let result ={}
+      try{
+        result =await getGroupReqService(this.tokenData)
+        if(result.code ===0){
+          this.GroupRequestList = result.data;
+          this.GroupRequestIsDisplay = true;
+        }else{
+          ElMessage.error("获取好友请求列表失败");
+        }
+      }catch(e){
+        console.log(e);
+      }
+
+    },
+    async AcceptFriendsOrGroup(index){
+      var id = this.GroupRequestList[index].id;
+      var im_id = this.GroupRequestList[index].im_id;
+      var name = this.FriendsGRequestList[index].name;
+      let result ={}
+      try{
+        result =await acceptInviteService({
+          token: localStorage.getItem("token"),
+          id: im_id,
+          from_user_id: localStorage.getItem("userId"),
+          to_user_id: id,
+          msg: "接受加入群组请求",
+          index: 1,
+          type: 4,
+        });
+        if(result.code ===0){
+          ElMessage.success("接受好友请求成功");
+          this.displayFriendReq()
+        }else{
+          ElMessage.error("接受好友请求失败");
+        }
+      }catch(e){
+        console.log(e);
+      }
+    },
     handleMenuSelect(val) {
       router.push(val);
     },
@@ -322,6 +364,11 @@ export default {
                 >建群</el-button
               >
             </el-form-item>
+            <el-form-item>
+              <el-button type="primary" @click="displayGroupReq()"
+                >请求加入群聊请求</el-button
+              >
+            </el-form-item>
             <el-form-item>
               <el-dialog
                 v-model="addDialogVisible"
@@ -451,6 +498,47 @@ export default {
             </el-table>
           </el-dialog>
 
+          <el-dialog
+            title="加入群组请求"
+            width="50%"
+            v-model="GroupRequestIsDisplay"
+            center>
+
+            <el-table :data="GroupRequestList" width="100%">
+              <el-table-column prop="id" label="id" width="80"></el-table-column>
+              <el-table-column
+                prop="name"
+                label="名称"
+                width="100"
+              ></el-table-column>
+              <el-table-column
+                prop="email"
+                label="用户邮箱"
+                width="180"
+              ></el-table-column>
+              <el-table-column
+                prop="age"
+                label="用户Age"
+                width="120"
+              ></el-table-column>
+              <el-table-column>
+                <template #default="scope">
+                  <el-button
+                    type="primary"
+                    size="mini"
+                    @click.prevent="AcceptFriendsOrGroup(scope.$index)"
+                    >同意请求</el-button
+                  >
+                  <el-button
+                    type="primary"
+                    size="mini"
+                    @click.prevent="RefuseFriendsOrGroup(scope.$index)"
+                    >拒绝请求</el-button>
+                  </template>
+              </el-table-column>
+            </el-table>
+          </el-dialog>
+
           <!-- 表格  :row-style="this.tableRowClassName"-->
           <el-table :data="tableData" width="100%" border>
             :row-style="this.tableRowClassName"

src/views/UserList.vue

@@ -3,6 +3,7 @@ import axios from "axios";
 import { SearchUserService } from "@/api/user.js";
 import { getFriendReqService } from "@/api/user.js";
 import {acceptInviteService } from "@/api/user.js";
+import { addGroupRequestService } from "@/api/user.js"; 
 import {GetUserInfoService} from "@/api/user.js";
 import {DelFGService} from "@/api/user.js";
 import router from "@/router/index.js";
@@ -24,6 +25,7 @@ export default {
       FriendsTableIsDisplay:false,
       FriendsGList:[],
       GroupList:[],
+      groups:[],
       tokenData: {
         token: localStorage.getItem("token"),
         ip: localStorage.getItem("ip"),
@@ -66,6 +68,7 @@ export default {
       }
       let data = result.data;
       this.tableData = data;
+      this.groups= result.group;
     },
     async requestFriend(index) {
       var id = this.tableData[index].ID;
@@ -127,6 +130,32 @@ export default {
         console.log(e);
       }
     },
+    async addGroupRequest(index){
+      var group_id=this.groups[index].ID;
+      let result={}
+      let req={
+        token: localStorage.getItem("token"),
+        from_user_id: localStorage.getItem("userId"),
+        to_user_id: 0,
+        group_id: group_id,
+        msg: "请求加入群组",
+        type: 5,
+      }
+      try{
+
+        result = await addGroupRequestService(req);
+        if(result.code ===0){
+          ElMessage.success("请求发送成功");
+        }else{
+          ElMessage.error("操作失败：",result.error);
+        }
+
+      }catch(e){
+        console.log(e);
+      }
+
+
+    },
 
     //接受好友请求
     async AcceptFriendsOrGroup(index){
@@ -490,6 +519,53 @@ export default {
               </template>
             </el-table-column>
           </el-table>
+          
+          <br />
+          <h>
+            群组列表
+          </h>
+
+          <!-- 表格  :row-style="this.tableRowClassName"-->
+          <el-table :data="groups" width="100%" border>
+            :row-style="this.tableRowClassName"
+            <el-table-column prop="ID" label="id" width="80"></el-table-column>
+            <el-table-column
+              prop="GroupName"
+              label="名称"
+              width="100"
+            ></el-table-column>
+            <el-table-column
+              prop="GroupInfo"
+              label="描述"
+              width="180"
+            ></el-table-column>
+            <el-table-column
+              prop="GroupType"
+              label="类型"
+              width="120"
+            ></el-table-column>
+            <el-table-column
+              prop="CreatedAt"
+              label="创建时间"
+              width="120"
+            ></el-table-column>
+            <el-table-column
+              prop="UpdatedAt"
+              label="更新时间"
+              width="120"
+            ></el-table-column>
+            <el-table-column label="操作" width="350">
+              <template #default="scope">
+                <el-button
+                  type="primary"
+                  size="mini"
+                  @click.prevent="addGroupRequest(scope.$index)"
+                  >请求加入</el-button
+                >
+                <!-- <el-button type="danger" size="mini">删除</el-button> -->
+              </template>
+            </el-table-column>
+          </el-table>
           <br />
 
           <!-- 分页条 -->