- * + * *
* * @author blue @@ -24,48 +24,48 @@ import java.util.Date; @TableName("im_friend") public class Friend extends Model- * 群成员 服务实现类 - *
- * - * @author blue - * @since 2022-10-31 - */ + +@CacheConfig(cacheNames = RedisKey.IM_CACHE_GROUP_MEMBER) @Service public class GroupMemberServiceImpl extends ServiceImpl{{member.aliasName}}121212121212
+ {{member.aliasName}}
+
-
-
- {{ activeUser.userName }}
+ {{ userInfo.userName }}
- {{ activeUser.nickName }}
+ {{ userInfo.nickName }}
- {{ activeUser.sex==0?"男":"女" }}
- {{ activeUser.signature }}
+ {{ userInfo.sex==0?"男":"女" }}
+ {{ userInfo.signature }}
@@ -58,7 +58,7 @@
return {
searchText: "",
showAddFriend: false,
- activeUser: {}
+ userInfo: {}
}
},
methods: {
@@ -70,17 +70,7 @@
},
handleActiveItem(friend, index) {
this.$store.commit("activeFriend", index);
- this.$http({
- url: `/api/user/find/${friend.id}`,
- method: 'get'
- }).then((user) => {
- this.activeUser = user;
- // 如果发现好友的头像和昵称改了，进行更新
- if (user.headImageThumb != friend.headImage ||
- user.nickName != friend.nickName) {
- this.updateFriendInfo(friend, user, index)
- }
- })
+ this.loadUserInfo(friend,index);
},
handleDelItem(friend, index) {
this.$http({
@@ -95,7 +85,7 @@
})
},
handleSendMessage() {
- let user = this.activeUser;
+ let user = this.userInfo;
let chat = {
type: 'single',
targetId: user.id,
@@ -108,6 +98,8 @@
this.$router.push("/home/chat");
},
updateFriendInfo(friend, user, index) {
+ // store的数据不能直接修改，深拷贝一份store的数据
+ friend = JSON.parse(JSON.stringify(friend));
friend.headImage = user.headImageThumb;
friend.nickName = user.nickName;
this.$http({
@@ -118,6 +110,30 @@
this.$store.commit("updateFriend", friend);
this.$store.commit("updateChatFromUser", user);
})
+ },
+ loadUserInfo(friend,index){
+ this.$http({
+ url: `/api/user/find/${friend.id}`,
+ method: 'get'
+ }).then((user) => {
+ this.userInfo = user;
+ // 如果发现好友的头像和昵称改了，进行更新
+ if (user.headImageThumb != friend.headImage ||
+ user.nickName != friend.nickName) {
+ this.updateFriendInfo(friend, user, index)
+ }
+ })
+ }
+ },
+ computed:{
+ friendStore(){
+ return this.$store.state.friendStore;
+ }
+ },
+ mounted() {
+ if(this.friendStore.activeIndex>=0){
+ let friend = this.friendStore.friends[this.friendStore.activeIndex];
+ this.loadUserInfo(friend,this.friendStore.activeIndex);
}
}
diff --git a/im-ui/src/view/Group.vue b/im-ui/src/view/Group.vue
index 4303fb0..b69f8ef 100644
--- a/im-ui/src/view/Group.vue
+++ b/im-ui/src/view/Group.vue
@@ -18,20 +18,26 @@
- {{activeGroup.remark}}
+
+ {{activeGroup.remark}}({{groupMembers.length}})
-
- ![]()
-
-
-
-
-
+
+
+
+
-
+
-
+
+ ![]()
+
+
+ 发送消息
+
+
+ 提交
+ 退出群聊
+ 解散群聊
+
- 保存
- 发消息
- 退出
- 解散
-
+
@@ -96,7 +102,14 @@
remark: ""
},
groupMembers: [],
- showAddGroupMember: false
+ showAddGroupMember: false,
+ rules: {
+ name: [{
+ required: true,
+ message: '请输入群聊名称',
+ trigger: 'blur'
+ }]
+ }
};
},
methods: {
@@ -128,21 +141,56 @@
handleCloseAddGroupMember() {
this.showAddGroupMember = false;
},
-
handleUploadSuccess(res) {
this.activeGroup.headImage = res.data.originUrl;
this.activeGroup.headImageThumb = res.data.thumbUrl;
},
handleSaveGroup() {
- let vo = this.activeGroup;
- this.$http({
- url: "/api/group/modify",
- method: "put",
- data: vo
- }).then((group) => {
- this.$store.commit("updateGroup",group);
- this.$message.success("修改成功");
+ this.$refs['groupForm'].validate((valid) => {
+ if (valid) {
+ let vo = this.activeGroup;
+ this.$http({
+ url: "/api/group/modify",
+ method: "put",
+ data: vo
+ }).then((group) => {
+ this.$store.commit("updateGroup", group);
+ this.$message.success("修改成功");
+ })
+ }
+ });
+ },
+ handleDissolve() {
+ this.$confirm('确认要解散群聊吗?', '确认解散?', {
+ confirmButtonText: '确定',
+ cancelButtonText: '取消',
+ type: 'warning'
+ }).then(() => {
+ this.$http({
+ url: `/api/group/delete/${this.activeGroup.id}`,
+ method: 'delete'
+ }).then(() => {
+ this.$store.commit("removeGroup", this.groupStore.activeIndex);
+ this.$store.commit("activeGroup", -1);
+ });
})
+
+ },
+ handleQuit() {
+ this.$confirm('退出群聊后将不再接受群里的消息，确认退出吗？', '确认退出?', {
+ confirmButtonText: '确定',
+ cancelButtonText: '取消',
+ type: 'warning'
+ }).then(() => {
+ this.$http({
+ url: `/api/group/quit/${this.activeGroup.id}`,
+ method: 'delete'
+ }).then(() => {
+ this.$store.commit("removeGroup", this.groupStore.activeIndex);
+ this.$store.commit("activeGroup", -1);
+ });
+ })
+
},
handleSendMessage() {
@@ -159,6 +207,22 @@
computed: {
groupStore() {
return this.$store.state.groupStore;
+ },
+ ownerName() {
+ let member = this.groupMembers.find((m) => m.userId == this.activeGroup.ownerId);
+ return member && member.aliasName;
+ },
+ isOwner() {
+ return this.activeGroup.ownerId == this.$store.state.userStore.userInfo.id;
+ }
+ },
+ mounted() {
+ if(this.groupStore.activeIndex>=0){
+ let activeGroup = this.groupStore.groups[this.groupStore.activeIndex];
+ // store数据不能直接修改，所以深拷贝一份内存
+ this.activeGroup = JSON.parse(JSON.stringify(activeGroup));
+ // 加载群成员
+ this.loadGroupMembers();
}
}
}
@@ -193,7 +257,9 @@
height: 50px;
padding: 5px;
line-height: 50px;
- font-size: 22px;
+ font-size: 20px;
+ text-align: left;
+ text-indent: 10px;
background-color: white;
border: #dddddd solid 1px;
}
@@ -207,7 +273,8 @@
.r-group-form {
flex: 1;
- padding-left: 20px;
+ padding-left: 40px;
+ max-width: 800px;
}
.avatar-uploader {
@@ -228,15 +295,15 @@
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
- width: 178px;
- height: 178px;
- line-height: 178px;
+ width: 200px;
+ height: 200px;
+ line-height: 200px;
text-align: center;
}
.avatar {
- width: 178px;
- height: 178px;
+ width: 200px;
+ height: 200px;
display: block;
}
}