TmOct5/ZhHealth
1
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

成员管理的基础

Browse Source
This commit is contained in:
Jason.Chen
2022-02-15 10:14:52 +08:00
parent 2122a0b079
commit a831b65a5f
3 changed files with 344 additions and 222 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
apis/interfaces/im.js
View File

@@ -117,9 +117,10 @@ const getGroupBase = (groupId) => {
}) })
} }
const getGroupUsers = (groupId) => { const getGroupUsers = (groupId, limit) => {
limit = limit || 0
return request({ return request({
url: 'im/groups/' + groupId + '/users' url: 'im/groups/' + groupId + '/users?limit=' + limit
}) })
} }
@@ -210,6 +211,59 @@ const dismissGroup = (groupId) => {
}) })
} }
/**
* 移除群成员
*/
const removeGroupUser = (groupId, userId) => {
return request({
method: 'DELETE',
url: 'im/groups/' + groupId + '/users/' + userId
})
}
/**
* 邀请群成员
*/
const inviteGroupUser = (groupId, userIds) => {
return request({
method: 'POST',
url: 'im/groups/' + groupId + '/invite',
data: {
userIds
}
})
}
/**
* 设置群管理
*/
const setGroupAdmin = (groupId, userId) => {
return request({
method: 'POST',
url: 'im/groups/' + groupId + '/admin/' + userId
})
}
/**
* 移除群管理
*/
const removeGroupAdmin = (groupId, userId) => {
return request({
method: 'DELETE',
url: 'im/groups/' + groupId + '/admin/' + userId
})
}
/**
* 转移群主
*/
const transferGroupOwner = (groupId, userId) => {
return request({
method: 'DELETE',
url: 'im/groups/' + groupId + '/owner/' + userId
})
}
export { export {
getImToken, getImToken,
deleteFriend, deleteFriend,
@@ -235,5 +289,10 @@ export {
joinGroupPre, joinGroupPre,
joinGroup, joinGroup,
quitGroup, quitGroup,
dismissGroup dismissGroup,
inviteGroupUser,
removeGroupUser,
setGroupAdmin,
removeGroupAdmin,
transferGroupOwner
} }

79
pages/im/group/info.vue
View File

@@ -2,7 +2,8 @@
<view class="container"> <view class="container">
<view class="members u-border-bottom"> <view class="members u-border-bottom">
<view class="users"> <view class="users">
<view class="user" v-for="(item, index) in users" :key="index" @click="toUser(item)" <view :class="['user', {'active': item.targetId == currentUser.targetId}]"
v-for="(item, index) in users" :key="index" @click="toUser(item)"
@longpress="showUserActionSheet(item)"> @longpress="showUserActionSheet(item)">
<u-avatar size="44" shape="square" :src="item.portraitUrl"> <u-avatar size="44" shape="square" :src="item.portraitUrl">
</u-avatar> </u-avatar>
@@ -71,7 +72,12 @@
getGroupInfo, getGroupInfo,
updateGroup, updateGroup,
quitGroup, quitGroup,
dismissGroup removeGroupUser,
setGroupAdmin,
removeGroupAdmin,
dismissGroup,
transferGroupOwner,
getGroupUsers
} from '@/apis/interfaces/im.js' } from '@/apis/interfaces/im.js'
import { import {
uploads uploads
@@ -133,18 +139,23 @@
} }
}) })
this.initData() this.initData()
this.initUsers()
uni.$on('groupAnnouncementCreated', this.initData) uni.$on('groupAnnouncementCreated', this.initData)
}, },
onUnload() { onUnload() {
uni.$off('groupAnnouncementCreated') uni.$off('groupAnnouncementCreated')
}, },
methods: { methods: {
initUsers() {
getGroupUsers(this.targetId, 14).then(res => {
this.users = res
})
},
initData() { initData() {
getGroupInfo(this.targetId).then(res => { getGroupInfo(this.targetId).then(res => {
this.group = res.group this.group = res.group
this.groupName = res.group.name this.groupName = res.group.name
this.announcement = res.announcement this.announcement = res.announcement
this.users = res.users
this.members = res.members this.members = res.members
this.loaded = true this.loaded = true
this.joinTypeMap = res.join_type_map.map(item => { this.joinTypeMap = res.join_type_map.map(item => {
@@ -191,7 +202,10 @@
} }
}, },
inviteUser() { inviteUser() {
uni.showToast({
icon: 'none',
title: '开发中'
})
}, },
loadMore() { loadMore() {
uni.navigateTo({ uni.navigateTo({
@@ -375,11 +389,54 @@
this.showUserAction = false this.showUserAction = false
}, },
handleUserAction(e) { handleUserAction(e) {
uni.showToast({ switch (e.key) {
icon: 'none', case 0:
title: e.name removeGroupUser(this.targetId, this.currentUser.targetId).then(res => {
}) uni.showToast({
console.log(e); icon: 'none',
title: '成员移除成功'
})
}).catch(err => {
uni.showToast({
icon: 'none',
title: err.message
})
}).finally(() => {
this.initUsers()
})
break;
case 1:
setGroupAdmin(this.targetId, this.currentUser.targetId).then(res => {
uni.showToast({
icon: 'none',
title: '设置管理成功'
})
}).catch(err => {
uni.showToast({
icon: 'none',
title: err.message
})
}).finally(() => {
this.initUsers()
})
break;
case 2:
transferGroupOwner(this.targetId, this.currentUser.targetId).then(res => {
uni.showToast({
icon: 'none',
title: '群主转让成功'
})
}).catch(err => {
uni.showToast({
icon: 'none',
title: err.message
})
}).finally(() => {
this.initUsers()
this.initData()
})
break;
}
} }
} }
} }
@@ -415,6 +472,10 @@
justify-content: center; justify-content: center;
align-items: center; align-items: center;
&.active {
background-color: $window-color;
}
.name { .name {
color: $text-gray-m; color: $text-gray-m;
width: 126rpx; width: 126rpx;

422
pages/setting/setting.vue
View File

@@ -1,211 +1,213 @@
<template> <template>
<view class="setting"> <view class="setting">
<!-- 更多管理 --> <!-- 更多管理 -->
<view class="list"> <view class="list">
<view class="list-item" @click="updImgs"> <view class="list-item" @click="updImgs">
<view class="list-item-left"> <span>修改头像</span> </view> <view class="list-item-left"> <span>修改头像</span> </view>
<view class="avatar" > <view class="avatar">
<image :src="avatar.showPath || require('@/static/user/cover.png')" mode="aspectFill" /> <image :src="avatar.showPath || require('@/static/user/cover.png')" mode="aspectFill" />
<u-icon name="arrow-right" color="#999" size="20"></u-icon> <u-icon name="arrow-right" color="#999" size="20"></u-icon>
</view> </view>
</view> </view>
<view class="list-item"> <view class="list-item">
<view class="list-item-left"> <span>修改昵称</span> </view> <view class="list-item-left"> <span>修改昵称</span> </view>
<view class="input"> <view class="input">
<input type="text" :value="nickname" @blur='blur' placeholder="请输入用户的昵称" maxlength="12" /> <input type="text" :value="nickname" @blur='blur' placeholder="请输入用户的昵称" maxlength="12" />
<u-icon name="arrow-right" color="#999" size="20"></u-icon> <u-icon name="arrow-right" color="#999" size="20"></u-icon>
</view> </view>
</view> </view>
</view> </view>
<u-toast ref="uToast" /> <u-toast ref="uToast" />
</view> </view>
</template> </template>
<script> <script>
import { import {
getUserSettingInfo, getUserSettingInfo,
resetUserInfo resetUserInfo
} from '@/apis/interfaces/setting.js' } from '@/apis/interfaces/setting.js'
import { import {
uploads uploads
} from '@/apis/interfaces/uploading' } from '@/apis/interfaces/uploading'
export default { export default {
data() { data() {
return { return {
canLogin: true, canLogin: true,
nickname: '', nickname: '',
avatar: { avatar: {
path: '', path: '',
showPath: '' showPath: ''
}, },
is_bind: true is_bind: true
} }
}, },
onShow() { onShow() {
this.getUserInfo() this.getUserInfo()
}, },
onPullDownRefresh() { onPullDownRefresh() {
this.getUserInfo() this.getUserInfo()
}, },
methods: { methods: {
// 获取当前用户得基本信息 // 获取当前用户得基本信息
getUserInfo() { getUserInfo() {
getUserSettingInfo().then(res => { getUserSettingInfo().then(res => {
this.avatar.showPath = res.avatar this.avatar.showPath = res.avatar
this.nickname = res.nickname this.nickname = res.nickname
this.is_bind = res.is_bind this.is_bind = res.is_bind
uni.stopPullDownRefresh() uni.stopPullDownRefresh()
}).catch(err => { }).catch(err => {
this.$refs.uToast.show({ this.$refs.uToast.show({
title: err.message, title: err.message,
type: 'primary', type: 'primary',
duration: 3000 duration: 3000
}) })
}) })
}, },
// 上传头像 // 上传头像
updImgs(type) { updImgs(type) {
uni.chooseImage({ uni.chooseImage({
crop: { crop: {
width: 80, quality: 100,
height: 80 width: 128,
}, height: 128,
success: res => { resize: true
let path = res.tempFiles.map((val, index) => { },
return { success: res => {
name: 'uploads' + index, let path = res.tempFiles.map((val, index) => {
uri: val.path return {
} name: 'uploads' + index,
}) uri: val.path
uploads(path).then(pathRes => { }
this.avatar.path = pathRes.path[0] })
this.avatar.showPath = pathRes.url[0] uploads(path).then(pathRes => {
this.resetUserInfo('avatar',pathRes.url[0]) this.avatar.path = pathRes.path[0]
}).catch(err => { this.avatar.showPath = pathRes.url[0]
uni.showToast({ this.resetUserInfo('avatar', pathRes.url[0])
title: err.message, }).catch(err => {
icon: "none", uni.showToast({
duration: 2000, title: err.message,
mask: true icon: "none",
}) duration: 2000,
}) mask: true
} })
}) })
}, }
// 修改姓名 })
blur(e){ },
let value = e.detail.value // 修改姓名
if(value !== this.nickname){ blur(e) {
this.resetUserInfo('nickname',value) let value = e.detail.value
} if (value !== this.nickname) {
}, this.resetUserInfo('nickname', value)
// 修改头像或昵称 }
resetUserInfo(key, value) { },
let data ={ // 修改头像或昵称
key:key, resetUserInfo(key, value) {
value:value let data = {
} key: key,
resetUserInfo(data).then(res=>{ value: value
uni.showToast({ }
title: res, resetUserInfo(data).then(res => {
icon: 'none' uni.showToast({
}) title: res,
this.getUserInfo() icon: 'none'
}).catch(err => { })
uni.showToast({ this.getUserInfo()
title: err.message, }).catch(err => {
icon: "none", uni.showToast({
duration: 2000, title: err.message,
mask: true icon: "none",
}) duration: 2000,
}) mask: true
} })
} })
} }
</script> }
}
<style lang="scss" scoped> </script>
page {
background-color: #F8F8F8; <style lang="scss" scoped>
} page {
background-color: #F8F8F8;
.setting { }
position: relative;
background-color: #fff; .setting {
position: relative;
// 更多管理 background-color: #fff;
.list {
display: flex; // 更多管理
flex-direction: column; .list {
align-items: flex-start; display: flex;
justify-content: flex-start; flex-direction: column;
box-sizing: border-box; align-items: flex-start;
position: relative; justify-content: flex-start;
top: -10rpx; box-sizing: border-box;
border-radius: 20rpx; position: relative;
margin: 0 $margin; top: -10rpx;
padding: 30rpx 0; border-radius: 20rpx;
width: calc(100% - 80rpx); margin: 0 $margin;
padding: 30rpx 0;
.list-item { width: calc(100% - 80rpx);
width: 100%;
display: flex; .list-item {
flex-direction: row; width: 100%;
align-items: center; display: flex;
justify-content: space-between; flex-direction: row;
padding: 40rpx 0; align-items: center;
border-bottom: solid 1rpx #f9f9f9; justify-content: space-between;
box-sizing: border-box; padding: 40rpx 0;
font-size: $title-size; border-bottom: solid 1rpx #f9f9f9;
box-sizing: border-box;
.avatar { font-size: $title-size;
display: flex;
flex-direction: row; .avatar {
align-items: center; display: flex;
justify-content: center; flex-direction: row;
box-sizing: border-box; align-items: center;
justify-content: center;
box-sizing: border-box;
image {
width: 100rpx;
height: 100rpx; image {
border-radius: 50%; width: 100rpx;
margin-right: 20rpx; height: 100rpx;
} border-radius: 50%;
} margin-right: 20rpx;
}
.input { }
display: flex;
flex-direction: row; .input {
align-items: center; display: flex;
justify-content: center; flex-direction: row;
box-sizing: border-box; align-items: center;
text-align: right; justify-content: center;
flex: 1; box-sizing: border-box;
text-align: right;
input { flex: 1;
padding-right: $padding - 10;
width: 100%; input {
} padding-right: $padding - 10;
} width: 100%;
}
.list-item-left { }
display: flex;
flex-direction: row; .list-item-left {
align-items: center; display: flex;
justify-content: flex-start; flex-direction: row;
box-sizing: border-box; align-items: center;
justify-content: flex-start;
image { box-sizing: border-box;
width: 40rpx;
} image {
width: 40rpx;
span { }
margin-left: 20rpx;
} span {
} margin-left: 20rpx;
} }
} }
}
} }
}
</style> </style>