From 776a5f64e71898fd8bd11b61366eab03f8c1438f Mon Sep 17 00:00:00 2001 From: junleea <354425203@qq.com> Date: Fri, 16 Aug 2024 15:24:25 +0800 Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E7=BE=A4=E8=81=8A=E5=8F=8A?= =?UTF-8?q?=E7=AE=A1=E7=90=86=E7=BE=A4=E7=BB=84=E4=BF=A1=E6=81=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/chat.js | 10 +- src/api/group.js | 42 ++++ src/api/user.js | 24 ++ src/router/index.js | 6 + src/utils/request.js | 4 +- src/views/Chat.vue | 79 +++++- src/views/Group.vue | 527 ++++++++++++++++++++++++++++++++++++++++ src/views/UserList.vue | 104 ++++++-- src/views/VideoList.vue | 3 + 9 files changed, 771 insertions(+), 28 deletions(-) create mode 100644 src/api/group.js create mode 100644 src/views/Group.vue diff --git a/src/api/chat.js b/src/api/chat.js index f116fc0..dd07dcc 100644 --- a/src/api/chat.js +++ b/src/api/chat.js @@ -43,4 +43,12 @@ export const sendMessageService = (data) => { } } ); -}; \ No newline at end of file +}; + +export const addGroupService = (data) => { + const params = new URLSearchParams(); + for (let key in data) { + params.append(key, data[key]) + } + return request.post('/im/create_group', params, { "headers": { 'token': data.token },'Content-Type': 'application/json' }); +} \ No newline at end of file diff --git a/src/api/group.js b/src/api/group.js new file mode 100644 index 0000000..f9fd9dc --- /dev/null +++ b/src/api/group.js @@ -0,0 +1,42 @@ +import request from '@/utils/request.js' + + + +export const updateDeviceService = (data) => { + const params = new URLSearchParams(); + for (let key in data) { + params.append(key, data[key]) + } + return request.post('/device/update_device', params, { "headers": { 'token': data.token } }); +} + +export const deleteDeviceService = (data) => { + const params = new URLSearchParams(); + for (let key in data) { + params.append(key, data[key]) + } + return request.post('/device/delete_device', params, { "headers": { 'token': data.token } }); +} + +export const addDeviceService = (data) => { + const params = new URLSearchParams(); + for (let key in data) { + params.append(key, data[key]) + } + return request.post('/device/add_device', params, { "headers": { 'token': data.token },'Content-Type': 'application/json' }); +} + +export const getGroupListService = (data) => { + const params = new URLSearchParams(); + for (let d in data) { + params.append(d, data[d]); + } + // request.headers["Content-Type"] = "application/json"; + request.defaults.headers["token"] = data.token.value; + return request.post('/im/get_group', params, { + headers: { + 'token': data.token, // 将 token 替换为您的令牌值 + } + } + ); +} \ No newline at end of file diff --git a/src/api/user.js b/src/api/user.js index 7f9a253..c605a7b 100644 --- a/src/api/user.js +++ b/src/api/user.js @@ -52,6 +52,30 @@ export const getFriendReqService = (Data) => { }) } +export const GetUserInfoService = (Data) => { + const params = new URLSearchParams(); + for (let key in Data) { + params.append(key, Data[key]) + } + return request.post('/user/info', params, { + headers: { + 'token': Data.token, // 将 token 替换为您的令牌值 + } + }) +} + +export const DelFGService =(Data) =>{ + const params = new URLSearchParams(); + for (let key in Data) { + params.append(key, Data[key]) + } + return request.post('/im/del_friend_or_group', params, { + headers: { + 'token': Data.token, // 将 token 替换为您的令牌值 + } + }) +} + export const acceptInviteService =(Data)=> { const params = new URLSearchParams(); for (let key in Data) { diff --git a/src/router/index.js b/src/router/index.js index 4b0c4ed..64f2001 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -10,6 +10,7 @@ import CIDListVue from "@/views/CIDList.vue"; import CIDLog from "@/views/CIDLog.vue"; import DeviceRealVP from "@/views/DeviceRealVP.vue"; import Chat from "@/views/Chat.vue" +import Group from "@/views/Group.vue" const routes = [ { @@ -52,6 +53,11 @@ const routes = [ name: 'CID', component: CIDListVue }, + { + path: "/group", + name: "Group", + component: Group + }, { path: '/cidlog', name: 'CIDLog', diff --git a/src/utils/request.js b/src/utils/request.js index ba70305..2561886 100644 --- a/src/utils/request.js +++ b/src/utils/request.js @@ -1,7 +1,7 @@ import axios from "axios"; import router from "@/router/index.js"; -const baseURL = "https://gep.ljsea.xyz/"; -//const baseURL= "http://localhost:8082"; +//const baseURL = "https://gep.ljsea.xyz/"; +const baseURL= "http://localhost:8083"; const request = axios.create({ baseURL: baseURL, }); diff --git a/src/views/Chat.vue b/src/views/Chat.vue index 19c147e..5f5cdd1 100644 --- a/src/views/Chat.vue +++ b/src/views/Chat.vue @@ -20,7 +20,6 @@ {{ user.name }} - @@ -30,9 +29,9 @@ 群组 - + - {{ item.group_name + {{ item.GroupName }} @@ -72,7 +71,7 @@
-
+
{{ cur_user_name }} {{ formatTime(item.CreatedAt) }} @@ -84,6 +83,18 @@
+
+ + {{ item.name}} + {{ formatTime(item.CreatedAt) }} + + + + + {{ item.Msg }} + + +
@@ -112,6 +123,14 @@ + + + + + + + + @@ -142,6 +161,8 @@ export default { filteredUsers: [], // 过滤后的用户列表 to_user_id:0, cur_user_id:0, + cur_group_id:0, + msg_type:1, searchName: '', // 搜索框内容 history_cnt: 1, @@ -181,6 +202,47 @@ export default { this.history_cnt++ this.handleGetMessage(this.cur_user_id); }, + async handleGetGroupMessage(id){ + this.cur_group_id=id; + this.cur_user_id=0; + this.to_user_id=0; + this.msg_type=2; + let result={} + try { + let req={ + token: localStorage.getItem("token"), + ip: localStorage.getItem("ip"), + userId: localStorage.getItem("userId"), + username: localStorage.getItem("username"), + group_id:id, + index:this.history_cnt, + type:2, + } + result = await getMessageService(req); + } catch (e) { + console.log(e); + } + let data = result.data; + if(data === undefined || data === null){ + ElMessage({ + message: "无消息！", + type: "error", + }) + this.MsgList=[] + return; + } + data.sort((a, b) => { + const dateA = new Date(a.CreatedAt); + const dateB = new Date(b.CreatedAt); + + // 返回时间差，用于排序 + return dateA - dateB; + }); + this.MsgList=data; + if(this.history_cnt <=2){ + this.scrollToBottom(); + } + }, async handleGetMessage(id){ let result = {}; if(this.to_user_id!=id){ @@ -188,6 +250,8 @@ export default { } this.to_user_id=id; this.cur_user_id=id; + this.cur_group_id=0; + this.msg_type=1; console.log("uid:",this.uid,"\tcur_user_id:",this.cur_user_id) for(let i=0; i +import axios from "axios"; +import { inject } from "vue"; +import { getGroupListService } from "@/api/group.js"; +import { restartDeviceService } from "@/api/device.js"; +import { addDeviceService } from "@/api/device.js"; +import { deleteDeviceService } from "@/api/device.js"; +import { getFriendListService } from "@/api/chat.js"; +import { addGroupService} from "@/api/chat.js"; +import {sendMessageService} from "@/api/chat.js"; +import { updateDeviceService } from "@/api/device.js"; +import router from "@/router/index.js"; +import { ElMessage } from 'element-plus'; + +export default { + data() { + return { + ip: "", + FriendsTableIsDisplay:false, + tableData: [], + group_id:0, + tokenData: { + token: localStorage.getItem("token"), + ip: localStorage.getItem("ip"), + userId: localStorage.getItem("userId"), + username: localStorage.getItem("username"), + }, + addDialogVisible: false, + updateDialogVisible: false, + searchForm: { + hour: 0, + entrydate: [], + }, + addForm: { + group_name: "", + group_info: "", + group_type: "", + group_icon:"", + auth_id: -1, + token: localStorage.getItem("token"), + }, + updateForm: { + id:0, + device_name: "", + device_ip: "", + device_status: "", + device_info: "", + device_location: "", + device_type: "", + auth_id: -1, + token: localStorage.getItem("token"), + }, + }; + }, + + // methods 是一些用来更改状态与触发更新的函数 + // 它们可以在模板中作为事件处理器绑定 + methods: { + async getGroupList() { + let result = {}; + try { + result = await getGroupListService(this.tokenData); + } catch (e) { + console.log(e); + } + let data = result.data; + + // for(let d in data){ + // let res = JSON.parse(d); + // console.log("res=",res); + // this.tableData.push(res); + // } + // console.log(this.tableData); + + this.tableData = data; + }, + onSubmit() { + getGroupList({ token: token }); + }, + handleSizeChange() { + alert("每页记录数变化" + val); + }, + handleCurrentChange() { + alert("页码发生变化" + val); + }, + //获取好友列表 + async displayFriends(index){ + this.group_id = this.tableData[index].ID; + let result ={} + try{ + result = await getFriendListService(this.tokenData); + if(result.code ===0){ + this.FriendsGList = result.data.friends; + this.GroupList=result.data.groups; + this.FriendsTableIsDisplay = true; + }else{ + ElMessage.error("获取好友列表失败"); + } + }catch(e){ + console.log(e); + } + }, + + //设置设备重启 + async inviteUser(index) { + var id = this.tableData[index].ID; + var restart_data = { + id: id, + option: "one", + ip: this.ip, + userId: this.tokenData.userId, + token: this.tokenData.token, + }; + try { + var d_re = await restartDeviceService(restart_data); + if (d_re.code == 0) { + //alert("重启成功"); + ElMessage.success('重启成功'); + } else { + alert("操作失败"); + ElMessage.fail('操作失败'); + } + } catch (e) { + console.log(e); + } + }, + playRealVp(index) { + var id = this.tableData[index].ID; + localStorage.setItem("realvp_device_id", id); + router.push("/deviceRealVP"); + }, + async deleteDevice(index) { + var id = this.tableData[index].ID; + var delete_data = { + id: id, + userId: this.tokenData.userId, + token: this.tokenData.token, + }; + try { + var d_re = await deleteGroupService(delete_data); + if (d_re.code == 0) { + //alert("删除成功"); + ElMessage.success('删除成功'); + //刷新页面 + this.getGroupList(); + } else { + //alert("操作失败"); + ElMessage.fail("操作失败"); + } + } catch (e) { + console.log(e); + } + }, + async updateButtonDevice(index) { + var id = this.tableData[index].ID; + this.group_id = id; + this.updateForm.device_name = this.tableData[index].DeviceName; + this.updateForm.device_ip = this.tableData[index].DeviceIP; + this.updateForm.device_status = this.tableData[index].DeviceStatus; + this.updateForm.device_info = this.tableData[index].DeviceInfo; + this.updateForm.device_location = this.tableData[index].DeviceLocation; + this.updateForm.device_type = this.tableData[index].DeviceType; + this.updateForm.auth_id = this.tableData[index].AuthID; + this.updateForm.id = id; + this.updateDialogVisible= true; + }, + async addGroup() { + this.addDialogVisible = false; + let result = {}; + try { + result = await addGroupService(this.addForm); + if (result.code == 0) { + ElMessage.success("添加成功"); + } else { + //alert("添加失败"); + ElMessage.error("添加失败") + } + } catch (e) { + console.log(e); + } + }, + async updateGroup() { + this.updateDialogVisible = false; + let result = {}; + try { + result = await updateGroupService(this.updateForm); + if (result.code == 0) { + //alert("修改成功"); + ElMessage.success("修改成功"); + this.getGroupList() + } else { + alert("修改失败"); + } + } catch (e) { + console.log(e); + } + }, + async restartAllDevice() { + var restart_data = { + id: id, + ip: this.ip, + option: "all", + userId: this.tokenData.userId, + token: this.tokenData.token, + }; + try { + var d_re = await restartDeviceService(restart_data); + if (d_re.code == 0) { + //alert("重启成功"); + ElMessage.success("重启成功"); + } else { + alert("操作失败"); + } + } catch (e) { + console.log(e); + } + }, + async inviteFriendAddGroup(index){ + var id = this.FriendsGList[index].id; + let req={ + token: localStorage.getItem("token"), + ip: localStorage.getItem("ip"), + userId: localStorage.getItem("userId"), + username: localStorage.getItem("username"), + from_user_id:localStorage.getItem("userId"), + to_user_id:id, + group_id:this.group_id, + msg:this.currentMsg, + type:6, + } + try { + var d_re = await sendMessageService(req); + if (d_re.code == 0) { + //alert("邀请成功"); + ElMessage.success("邀请成功"); + } else { + //alert("操作失败"); + ElMessage.error("操作失败:"+d_re.error); + } + } catch (e) { + console.log(e); + } + }, + async getIpClient() { + try { + const response = await axios.get("https://ipinfo.io/json"); + this.ip = response.data.ip; + localStorage.setItem("ip", this.ip); + //console.log(response); + } catch (error) { + console.error(error); + } + }, + handleMenuSelect(val) { + router.push(val); + }, + toVideoList() { + router.push("/videoList"); + }, + // 修改条纹颜色 + tableRowClassName({ row, rowIndex }) { + if (row.human === 1) { + return { + background: "#488aff", + }; + } else { + return ""; + } + }, + }, + + // 生命周期钩子会在组件生命周期的各个不同阶段被调用 + // 例如这个函数就会在组件挂载完成后被调用 + async mounted() { + let now = new Date(); + if (localStorage.getItem("token") === null) { + router.push("/login"); + } + // console.log("mounted"); + await this.getIpClient(); + this.getGroupList(); + }, +}; + + + + \ No newline at end of file diff --git a/src/views/UserList.vue b/src/views/UserList.vue index c7a1937..b91beb6 100644 --- a/src/views/UserList.vue +++ b/src/views/UserList.vue @@ -3,6 +3,8 @@ import axios from "axios"; import { SearchUserService } from "@/api/user.js"; import { getFriendReqService } from "@/api/user.js"; import {acceptInviteService } from "@/api/user.js"; +import {GetUserInfoService} from "@/api/user.js"; +import {DelFGService} from "@/api/user.js"; import router from "@/router/index.js"; import Cookies from "js-cookie"; import { getFriendListService } from "@/api/chat.js"; @@ -14,8 +16,10 @@ export default { ip: "", tableData: [], search_id: 2002, + UserUpdateForm:{}, keyword: "", FriendsRequestIsDisplay:false, + updateDialogVisible: false, FriendsGRequestList:[], FriendsTableIsDisplay:false, FriendsGList:[], @@ -106,12 +110,12 @@ export default { var name = this.FriendsGList[index].name; let result ={} try{ - result =await sendMessageService({ + result =await DelFGService({ token: localStorage.getItem("token"), from_user_id: localStorage.getItem("userId"), to_user_id: id, msg: "删除好友", - type: 5, + type: 1, }); if(result.code ===0){ ElMessage.success("删除好友成功"); @@ -177,22 +181,24 @@ export default { alert("页码发生变化" + val); }, - //设置设备重启 - async startChat(index) { - var id = this.tableData[index].ID; - var name = this.tableData[index].Name; - // var user_data = { - // to_user_id: id, - // to_user_name: this.tableData[index].Name, - // }; - //转到聊天页面 - if(id == localStorage.getItem("userId")){ - alert("不能和自己聊天"); - return; + async displayMyInfo() { + let result = {}; + try{ + //获取用户信息 + result = await GetUserInfoService(this.tokenData) + if(result.code ===0){ + this.UserUpdateForm.id = result.data.ID; + this.UserUpdateForm.name = result.data.Name; + this.UserUpdateForm.email = result.data.Email; + this.UserUpdateForm.age = result.data.Age; + this.UserUpdateForm.role = result.data.Role; + this.UserUpdateForm.gender = result.data.Gender; + this.UserUpdateForm.create_time = result.data.CreatedAt; + } + }catch(e){ + console.log(e); } - localStorage.setItem("to_user_id", id); - localStorage.setItem("to_user_name", name); - router.push("/im"); + this.updateDialogVisible= true; }, handleMenuSelect(val) { @@ -252,6 +258,7 @@ export default { @click.prevent="handleMenuSelect('/cid')" >集成部署 + 用户搜索列表好友请求 - + + 我的信息 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 聊天 + 群组