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-01-25 15:27:33 +08:00
parent 530f1507f4
commit 33ee2ebd55
4 changed files with 191 additions and 140 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
pages/im/friends/index.vue
View File

@@ -68,12 +68,14 @@ export default {
// 新朋友
toPending() {
uni.navigateTo({
url: '/pages/im/friends/search'
url: '/pages/im/friends/pending'
});
}
},
onNavigationBarButtonTap(e) {
this.toPending();
uni.navigateTo({
url: '/pages/im/friends/search'
});
}
};
</script>

254
pages/im/index.vue
View File

@@ -1,50 +1,52 @@
<template>
<view class="contents">
<view class="ios-top"></view>
<!-- header -->
<view class="custom-header">
<view class="header-flex">
<view class="tabs">
<view class="item show">私聊</view>
<view class="item" @click="onNav('', {})">群聊</view>
</view>
<view class="btns">
<view class="item" @click="onNav('imFriends', {})">
<uni-icons color="#555" custom-prefix="iconfont" type="icon-tuandui" size="22"></uni-icons>
</view>
<view class="item" @click="onNav('', {})">
<uni-icons color="#555" custom-prefix="iconfont" type="icon-gengduo2" size="22"></uni-icons>
</view>
</view>
</view>
</view>
<!-- content -->
<view class="ios-top"></view>
<!-- header -->
<view class="custom-header">
<view class="header-flex">
<view class="tabs">
<view class="item show">私聊</view>
<view class="item" @click="onNav('', {})">群聊</view>
</view>
<view class="btns">
<view class="item" @click="onNav('imFriends', {})">
<uni-icons color="#555" custom-prefix="iconfont" type="icon-tuandui" size="22"></uni-icons>
</view>
<view class="item" @click="onNav('', {})">
<uni-icons color="#555" custom-prefix="iconfont" type="icon-gengduo2" size="22"></uni-icons>
</view>
</view>
</view>
</view>
<!-- content -->
<view v-if="$store.state.token != ''">
<block v-if="conversations.length < 1">
<view class="vertical null-list">
<u-empty icon="http://cdn.uviewui.com/uview/empty/message.png" textColor="#999" text="暂无好友消息">
<!-- <template>
<view class="null-list-btn">开启聊天</view>
</template> -->
</u-empty>
<u-empty mode="message" textColor="#999" text="暂无好友消息" />
</view>
</block>
<block v-else>
<u-alert type="warning" v-if="connection != 0" description="网络似乎断开了" :show-icon="true"></u-alert>
<view v-for="(item, index) in conversations" :key="index" :class="['message', { 'is-top': item.isTop }]" @tap="toDetail(item)" @longpress="onLongPress" :data-item="item">
<view class="avatar">
<u-badge numberType="ellipsis" max="99" shape="horn" absolute :offset="[-5, -5]" :value="item.unreadMessageCount" />
<u-avatar size="44" v-if="!friend(item.targetId).portraitUrl" shape="square" :text="friend(item.targetId).name ? friend(item.targetId).name.substring(0,1) : '未'" font-size="16" randomBgColor></u-avatar>
<u-avatar v-else :src="friend(item.targetId).portraitUrl" shape="square" size="44"></u-avatar>
</view>
<view class="content">
<view class="header">
<view v-for="(item, index) in conversations" :key="index"
:class="['message', 'u-border-bottom', { 'is-top': item.isTop }]" @tap="toDetail(item)"
@longpress="onLongPress" :data-item="item">
<view class="avatar">
<u-badge numberType="ellipsis" max="99" shape="horn" absolute :offset="[-5, -5]"
:value="item.unreadMessageCount" />
<u-avatar size="44" v-if="!friend(item.targetId).portraitUrl" shape="square"
:text="friend(item.targetId).name ? friend(item.targetId).name.substring(0,1) : '未'"
font-size="16" randomBgColor></u-avatar>
<u-avatar v-else :src="friend(item.targetId).portraitUrl" shape="square" size="44"></u-avatar>
</view>
<view class="content">
<view class="header">
<view class="name">{{ friend(item.targetId).name || '未知用户' }}</view>
<view class="time">{{ item.sentTime|timeCustomCN }}</view>
</view>
<view class="preview">{{ item.latestMessage.content || '' }}</view>
</view>
<view class="preview">{{ item.latestMessage.content || '' }}</view>
</view>
</view>
<!-- TODO 长按的弹出框，怎么点击隐藏，没搞明白 -->
<view class="shade" @tap="hidePop">
<view class="pop" :style="popStyle" :class="{'show':showPop}">
<view v-for="(item, index) in popButton" :key="index" @tap="pickerMenu" :data-index="index">
@@ -69,7 +71,9 @@
import * as RongIMLib from '@rongcloud/imlib-uni'
import im from '@/utils/im/index.js'
import userAuth from '@/public/userAuth'
import { getImToken } from '@/apis/interfaces/im.js'
import {
getImToken
} from '@/apis/interfaces/im.js'
export default {
data() {
@@ -98,7 +102,6 @@
onShow() {
if (this.$store.state.token !== '') {
getImToken().then(res => {
console.log("IMTOKEN", res);
im.connect(res.token, res.userInfo, () => {
this.getConversationList()
})
@@ -151,6 +154,7 @@
} else {
RongIMLib.removeConversation(this.pickedItem.conversationType, this.pickedItem.targetId)
}
im.setNotifyBadge()
this.getConversationList()
this.hidePop()
},
@@ -189,9 +193,9 @@
getConversationList() {
const count = 1000
const timestamp = 0
RongIMLib.getConversationList(undefined, count, timestamp, (res) => {
console.log('获取列表', res);
if (res.code === 0 && res.conversations.length > 0) {
RongIMLib.getConversationList([RongIMLib.ConversationType.PRIVATE], count, timestamp, (res) => {
console.log('getConversationList', res);
if (res.code === 0) {
this.conversations = res.conversations
}
})
@@ -204,75 +208,85 @@
.conversationType
})
},
// 点击按钮
onNav(name, params){
if(this.toLogin){
if(name === ''){
uni.showToast({
title: '开发中，敬请期待',
icon : 'none'
})
return
}
this.$Router.push({name, params})
}
}
// 点击按钮
onNav(name, params) {
if (this.toLogin) {
if (name === '') {
uni.showToast({
title: '开发中，敬请期待',
icon: 'none'
})
return
}
this.$Router.push({
name,
params
})
}
}
}
}
</script>
<style lang="scss" scoped>
// header
.custom-header{
@extend .ios-top;
background: white;
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 9999;
.header-flex{
padding: 20rpx $padding;
display: flex;
justify-content: space-between;
height: 60rpx;
line-height: 60rpx;
.tabs{
.item{
margin-left: $margin;
display: inline-block;
font-size: $title-size-lg;
color: $text-gray;
padding: 0 ($padding - 10);
border-radius: 30rpx;
&:first-child{
margin: 0;
}
&.show{
background: rgba($color: $main-color, $alpha: .1);
color: $main-color;
font-weight: bold;
}
}
}
.btns{
.item{
display: inline-block;
margin-left: $margin;
}
}
}
}
// header
.custom-header {
@extend .ios-top;
background: $window-color;
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 9999;
// contents
.header-flex {
padding: 20rpx $padding;
display: flex;
justify-content: space-between;
height: 60rpx;
line-height: 60rpx;
.tabs {
.item {
margin-left: $margin;
display: inline-block;
font-size: $title-size-lg;
color: $text-gray;
padding: 0 ($padding - 10);
border-radius: 30rpx;
&:first-child {
margin: 0;
}
&.show {
background: rgba($color: $main-color, $alpha: .1);
color: $main-color;
font-weight: bold;
}
}
}
.btns {
.item {
display: inline-block;
margin-left: $margin;
}
}
}
}
// contents
.contents {
background-color: $window-color;
min-height: 100vh;
padding-top: 90rpx;
box-sizing: border-box;
padding-top: 90rpx;
box-sizing: border-box;
.null-list {
height: 100vh;
text-align: center;
&-btn {
margin-top: $margin * 2;
line-height: 70rpx;
@@ -284,35 +298,46 @@
box-sizing: border-box;
}
}
.message {
background: white;
padding: 20rpx 30rpx;
position: relative;
display: flex;
padding: 20rpx 30rpx;
position: relative;
display: flex;
&.u-border-bottom {}
&.is-top {
background: $window-color;
}
.avatar {
position: relative;
position: relative;
.u-badge {
z-index: 998;
}
}
.content {
padding-left: 30rpx;
width: calc(100% - 44px);
box-sizing: border-box;
padding-left: 30rpx;
width: calc(100% - 44px);
box-sizing: border-box;
.header {
display: flex;
justify-content: space-between;
.name {
font-size: $title-size + 4;
}
.time {
font-size: $title-size-sm;
color: $text-gray;
}
}
.preview {
word-break: break-all;
color: $text-gray;
@@ -321,17 +346,18 @@
}
}
}
.message:not(:last-child) {
&::after {
position: absolute;
left: calc(44px + #{$padding} + 30rpx);
right: 0;
bottom: 0;
content: " ";
height: 1rpx;
background: $border-color;
}
}
// .message:not(:last-child) {
// &::after {
// position: absolute;
// left: calc(44px + #{$padding} + 30rpx);
// right: 0;
// bottom: 0;
// content: " ";
// height: 1rpx;
// background: $border-color;
// }
// }
}
/* 遮罩 */

23
utils/im/historyMessages.json Normal file
View File

@@ -0,0 +1,23 @@
[{
"objectName": "RC:TxtMsg",
"receivedTime": 1643080237399,
"extra": "",
"messageUId": "BUFC-3FSU-OLE4-I31K",
"conversationType": 1,
"messageDirection": 2,
"senderUserId": "10041",
"content": {
"content": "你好，这是 1710 条消息条消息条消息条消息条消息条消息条消息条消息条消息0.97796900 1642741562",
"objectName": "RC:TxtMsg",
"userInfo": {
"userId": "10041",
"name": "我是eth",
"portraitUrl": "http://storage.zh.shangkelian.cn/images/2022/01/12/3d2a103386df6822db7e5290272e8bc2.png"
}
},
"targetId": "10041",
"sentTime": 1642741563003,
"messageId": 2,
"receivedStatus": 1,
"sentStatus": 30
}]

2
utils/im/index.js
View File

@@ -10,7 +10,7 @@ const initIm = (KEY) => {
addListeners()
}
const setNotifyBadge = (count) => {
const setNotifyBadge = () => {
// 获取未读消息数量
RongIMLib.getTotalUnreadCount(({
code,