This commit is contained in:
Z
2022-02-21 18:01:11 +08:00
13 changed files with 196 additions and 185 deletions

View File

@@ -373,19 +373,6 @@
{ {
"path": "pages/im/private/chat", "path": "pages/im/private/chat",
"style": { "style": {
"navigationBarBackgroundColor":"#FFFFFF",
"disableScroll": false,
"app-plus": {
"titleNView": {
"type": "default",
"buttons": [{
"float": "right",
"fontSrc": "/static/iconfont.ttf",
"text": "\ue607",
"fontSize": "20px"
}]
}
}
} }
}, },
{ {
@@ -464,7 +451,7 @@
{ {
"path": "pages/im/group/chat", "path": "pages/im/group/chat",
"name": "imGroupChat", "name": "imGroupChat",
"style": { "style": {
"navigationBarTitleText": "群聊", "navigationBarTitleText": "群聊",
"app-plus": { "app-plus": {
"titleNView": { "titleNView": {

View File

@@ -1,67 +1,67 @@
<template> <template>
<u-alert type="warning" v-if="connection != 0" :description="description" show-icon /> <u-alert type="warning" v-if="connection != 0" :description="description" show-icon />
</template> </template>
<script> <script>
export default { export default {
props: { props: {
connection: { connection: {
type: Number, type: Number,
default: 0 default: 0
} }
}, },
computed: { computed: {
description() { description() {
return this.connectionStatusMap.filter(item => item.index == this.connection)[0].text return this.connectionStatusMap.filter(item => item.index == this.connection)[0].text
} }
}, },
data() { data() {
return { return {
connectionStatusMap: [{ connectionStatusMap: [{
index: -1, index: -1,
text: '网络不可用' text: '网络不可用'
}, },
{ {
index: 0, index: 0,
text: '连接成功' text: '连接成功'
}, },
{ {
index: 1, index: 1,
text: '连接中' text: '连接中'
}, },
{ {
index: 2, index: 2,
text: '未连接' text: '未连接'
}, },
{ {
index: 3, index: 3,
text: '用户账号在其它设备登录' text: '用户账号在其它设备登录'
}, },
{ {
index: 4, index: 4,
text: 'TOKEN过期' text: 'TOKEN过期'
}, },
{ {
index: 6, index: 6,
text: '用户被禁用' text: '用户被禁用'
}, },
{ {
index: 12, index: 12,
text: '退出登录' text: '退出登录'
}, },
{ {
index: 13, index: 13,
text: '连接暂时被挂起' text: '连接暂时被挂起'
}, },
{ {
index: 14, index: 14,
text: '连接超时' text: '连接超时'
}, },
], ],
} }
} }
} }
</script> </script>
<style> <style>
</style> </style>

View File

@@ -1,10 +1,9 @@
<template> <template>
<view> <view>
<view v-for="(item, index) in conversations" :key="index" :class="['message', { 'is-top': item.isTop }]" <view v-for="(item, index) in conversations" :key="index" :class="['message', { 'is-top': item.isTop, 'is-active': pickedItem.targetId == item.targetId }]"
:data-item="item" @longpress="onLongPress" @click="toDetail(item)"> :data-item="item" @longpress="onLongPress" @click="toDetail(item)">
<message-cell :item="item" /> <message-cell :item="item" />
</view> </view>
<view class="shade" @click="hidePop" v-show="showPop"> <view class="shade" @click="hidePop" v-show="showPop">
<view class="pop" :style="popStyle" :class="{'show':showPop}"> <view class="pop" :style="popStyle" :class="{'show':showPop}">
<view v-for="(item, index) in popButton" :key="index" @click="pickerMenu" :data-index="index"> <view v-for="(item, index) in popButton" :key="index" @click="pickerMenu" :data-index="index">
@@ -131,6 +130,10 @@
&.is-top { &.is-top {
background: $window-color; background: $window-color;
}
&.is-active {
background: #F8FAFF;
} }
} }

View File

@@ -61,8 +61,13 @@
actionMap: [], actionMap: [],
actionTitle: '', actionTitle: '',
currentUser: {}, currentUser: {},
<<<<<<< HEAD
avatarSize: 45, avatarSize: 45,
labelSize: 14, labelSize: 14,
=======
avatarSize: 84,
labelSize: 14,
>>>>>>> d8b90f97d110aed79b35d385dbc0eeb481ef4eab
iconSize: 14 iconSize: 14
} }
}, },
@@ -73,10 +78,17 @@
} }
} }
}, },
<<<<<<< HEAD
created() { created() {
this.avatarSize = utils.rpx2px(90) this.avatarSize = utils.rpx2px(90)
this.labelSize = utils.rpx2px(24) this.labelSize = utils.rpx2px(24)
this.iconSize = utils.rpx2px(26) this.iconSize = utils.rpx2px(26)
=======
created() {
this.avatarSize = utils.rpx2px(84)
this.labelSize = utils.rpx2px(24)
this.iconSize = utils.rpx2px(26)
>>>>>>> d8b90f97d110aed79b35d385dbc0eeb481ef4eab
}, },
mounted() { mounted() {
this.initGroupInfo() this.initGroupInfo()
@@ -273,8 +285,8 @@
.avatar { .avatar {
border-radius: 0 8rpx 0 0; border-radius: 0 8rpx 0 0;
position: relative; position: relative;
width: 90rpx; width: 84rpx;
height: 90rpx; height: 84rpx;
overflow: hidden; overflow: hidden;
.admin { .admin {

View File

@@ -2,7 +2,7 @@
<view class="message--cell"> <view class="message--cell">
<view class="avatar"> <view class="avatar">
<u-badge max="99" shape="horn" absolute :offset="[-5, -8]" :value="item.unreadMessageCount" /> <u-badge max="99" shape="horn" absolute :offset="[-5, -8]" :value="item.unreadMessageCount" />
<u-avatar :src="contact(item.targetId).portraitUrl" shape="square" size="44" /> <u-avatar :src="contact(item.targetId).portraitUrl" shape="square" :size="avatarSize" />
</view> </view>
<view class="content"> <view class="content">
<view class="header"> <view class="header">
@@ -18,6 +18,7 @@
<script> <script>
import messagePreview from './messagePreview' import messagePreview from './messagePreview'
import utils from '@/utils/index.js'
export default { export default {
props: { props: {
@@ -27,8 +28,16 @@
return {} return {}
} }
} }
}, },
data() {
return {
avatarRpx: 84
}
},
computed: { computed: {
avatarSize() {
return utils.rpx2px(this.avatarRpx)
},
contact() { contact() {
return function(targetId) { return function(targetId) {
return this.$store.getters.contactInfo(targetId) return this.$store.getters.contactInfo(targetId)
@@ -48,6 +57,7 @@
.avatar { .avatar {
position: relative; position: relative;
padding-top: 5rpx;
.u-badge { .u-badge {
z-index: 998; z-index: 998;
@@ -59,10 +69,8 @@
box-sizing: border-box; box-sizing: border-box;
position: relative; position: relative;
flex: 1; flex: 1;
border-bottom-width: 0.5px !important; border-bottom-width: 0.5px !important;
border-color: #f9f9f9 !important; border-color: #eee !important;
border-bottom-style: solid; border-bottom-style: solid;
.header { .header {

View File

@@ -22,10 +22,10 @@
<view class="preview" v-if="msg.objectName=='RC:LBSMsg'"> <view class="preview" v-if="msg.objectName=='RC:LBSMsg'">
<text v-if="conversationType == 3">{{ user.name }}</text>[位置] <text v-if="conversationType == 3">{{ user.name }}</text>[位置]
</view> </view>
<view class="preview" v-if="msg.objectName=='RC:InfoNtf' && JSON.parse(msg.message).mediaType=='0'"> <view class="preview" v-if="msg.objectName=='RC:InfoNtf' && JSON.parse(msg.message).mediaType==0">
<text v-if="conversationType == 3">{{ user.name }}</text>[语音通话] <text v-if="conversationType == 3">{{ user.name }}</text>[语音通话]
</view> </view>
<view class="preview" v-if="msg.objectName=='RC:InfoNtf' && JSON.parse(msg.message).mediaType=='1'"> <view class="preview" v-if="msg.objectName=='RC:InfoNtf' && JSON.parse(msg.message).mediaType==1">
<text v-if="conversationType == 3">{{ user.name }}</text>[视频通话] <text v-if="conversationType == 3">{{ user.name }}</text>[视频通话]
</view> </view>
<view class="preview" v-if="msg.objectName=='RC:GrpNtf'"> <view class="preview" v-if="msg.objectName=='RC:GrpNtf'">

View File

@@ -1,29 +1,18 @@
<template> <template>
<view class="msg--text"> <view class="msg--call">
<text class="name" v-if="!guest && name">{{ name }}</text> <view class="name" v-if="!guest && name">{{ name }}</view>
<view> <view class="im--text" :class="guest ? 'right': 'left'">
<text class="im--text" :class="guest ? 'right': 'left'" v-if="message.mediaType == '1'"> <u-icon name="camera" size="22" v-if="message.mediaType == 1"
<u-icon name="camera" /> {{ message.connected ? '通话时长' + message.duration : '未接通' }} :label="message.connected ? '通话时长:' + duration : '未接通'" />
</text> <u-icon name="phone" size="22" v-else :label="message.connected ? '通话时长:' + duration : '未接通'" />
<text class="im--text" :class="guest ? 'right': 'left'" v-else>
<u-icon name="phone" /> {{ message.connected ? '通话时长' + message.duration : '未接通' }}
</text>
</view> </view>
</view> </view>
</template> </template>
<!-- msg
{
"message": "1",
"objectName": "RC:InfoNtf",
"userInfo": {
"userId": "10051",
"name": "Jason.电信",
"extra": "",
"portraitUrl": "http://storage.zh.shangkelian.cn/uploads/2022/02/16/29b13f5301694721ad7acd8b8b67bbd9.jpg"
}
}
-->
<script> <script>
import utils from '@/utils/index.js'
import moment from 'moment'
export default { export default {
name: 'showText', name: 'showText',
props: { props: {
@@ -45,16 +34,20 @@
computed: { computed: {
message() { message() {
return JSON.parse(this.msg.message) return JSON.parse(this.msg.message)
} },
}, duration() {
mounted() { if (this.message.duration > 3600) {
console.log(this.message); return moment.utc(this.message.duration * 1000).format('HH:mm:ss')
} else {
return moment.utc(this.message.duration * 1000).format('mm:ss')
}
}
} }
} }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.msg--text { .msg--call {
.name { .name {
font-size: 26rpx; font-size: 26rpx;
color: $text-gray-m; color: $text-gray-m;
@@ -67,8 +60,8 @@
line-height: 46rpx; line-height: 46rpx;
font-size: 32rpx; font-size: 32rpx;
color: $text-color; color: $text-color;
display: inline-block; display: flex;
word-break: break-all; flex-direction: row;
&.left { &.left {
border-radius: 0 20rpx 20rpx 20rpx; border-radius: 0 20rpx 20rpx 20rpx;
@@ -79,6 +72,10 @@
border-radius: 20rpx 0 20rpx 20rpx; border-radius: 20rpx 0 20rpx 20rpx;
background: $main-color; background: $main-color;
color: white; color: white;
.u-icon {
color: white;
}
} }
} }
} }

View File

@@ -7,7 +7,7 @@
<view class="cell" v-for="(item, index) in messages" :key="index"> <view class="cell" v-for="(item, index) in messages" :key="index">
<view class="time" v-if="item.senderUserId === '__system__'">{{ item.content.message }}</view> <view class="time" v-if="item.senderUserId === '__system__'">{{ item.content.message }}</view>
<view v-else :class="['cell-item', item.messageDirection == 1 ? 'right' : 'left']"> <view v-else :class="['cell-item', item.messageDirection == 1 ? 'right' : 'left']">
<u-avatar class="avatar" @click="toUser(item)" size="36" shape="square" <u-avatar class="avatar" @click="toUser(item)" :size="avatarSize" shape="square"
:src="contact(item.senderUserId).portraitUrl" /> :src="contact(item.senderUserId).portraitUrl" />
<view class="msg"> <view class="msg">
<show-voice v-if="item.objectName === 'RC:HQVCMsg'" :guest="item.messageDirection == 1" <show-voice v-if="item.objectName === 'RC:HQVCMsg'" :guest="item.messageDirection == 1"
@@ -37,6 +37,7 @@
import showImage from '../components/showImage' import showImage from '../components/showImage'
import showText from '../components/showText' import showText from '../components/showText'
import sentMessageBar from '../components/sentMessageBar' import sentMessageBar from '../components/sentMessageBar'
import utils from '@/utils/index.js'
export default { export default {
components: { components: {
@@ -47,6 +48,7 @@
}, },
data() { data() {
return { return {
avatarRpx: 84,
targetId: '', targetId: '',
conversationType: RongIMLib.ConversationType.GROUP, conversationType: RongIMLib.ConversationType.GROUP,
messages: [], messages: [],
@@ -56,6 +58,9 @@
} }
}, },
computed: { computed: {
avatarSize() {
return utils.rpx2px(this.avatarRpx)
},
latestMessage() { latestMessage() {
if (this.messages.length) { if (this.messages.length) {
return this.messages[0] return this.messages[0]
@@ -74,8 +79,8 @@
onLoad(e) { onLoad(e) {
this.targetId = e.targetId this.targetId = e.targetId
// 获取群成员数量 // 获取群成员数量
getGroupBase(this.targetId).then(res => { getGroupBase(this.targetId).then(res => {
console.log(res); console.log(res);
uni.setNavigationBarTitle({ uni.setNavigationBarTitle({
title: res.name + `(${res.members})` title: res.name + `(${res.members})`
}) })
@@ -174,6 +179,7 @@
.cell { .cell {
padding: 10rpx 30rpx; padding: 10rpx 30rpx;
.time { .time {
text-align: center; text-align: center;
font-size: 24rpx; font-size: 24rpx;

View File

@@ -1,7 +1,7 @@
<template> <template>
<view class="invite"> <view class="invite">
<view class="search"> <view class="search u-border-bottom">
<u--input class="search-input" placeholder="搜索" border="none" prefixIcon="search" v-model="searchTxt" <u--input class="search-input" placeholder="搜索好友" border="none" prefixIcon="search" v-model="searchTxt"
disabledColor="#Fff" prefixIconStyle="font-size: 22px;color: #909399" @change="onSearch" /> disabledColor="#Fff" prefixIconStyle="font-size: 22px;color: #909399" @change="onSearch" />
</view> </view>
<block v-if="friends.length > 0"> <block v-if="friends.length > 0">
@@ -73,19 +73,18 @@
}, },
methods: { methods: {
onSearch() { onSearch() {
if (this.searchTxt) { if (this.searchTxt) {
console.log(this.searchTxt)
this.friends = this.orignalFriends.map((list, index) => { this.friends = this.orignalFriends.map((list, index) => {
const resList = list.filter(item => item.name.indexOf(this.searchTxt) > 0) const resList = list.filter(item => {
if (resList.length > 0) { return item.name.indexOf(this.searchTxt) >= 0
this.indexs = this.orignalIndexs.map((t, i) => {}) })
} else {
return;
}
return resList return resList
}) })
this.friends = this.friends.filter(n => n) this.indexs = this.orignalIndexs.map((t, i) => {
if (this.friends[i].length > 0) {
return t
}
})
} else { } else {
this.friends = this.orignalFriends this.friends = this.orignalFriends
this.indexs = this.orignalIndexs this.indexs = this.orignalIndexs
@@ -124,7 +123,6 @@
}, },
onInvite() { onInvite() {
inviteGroupUser(this.targetId, this.checkboxValue).then(res => { inviteGroupUser(this.targetId, this.checkboxValue).then(res => {
console.log(res, 'res')
uni.navigateBack({ uni.navigateBack({
delta: 1, delta: 1,
animationType: 'pop-out', animationType: 'pop-out',

View File

@@ -138,6 +138,7 @@
} }
} }
<<<<<<< HEAD
.no-lists { .no-lists {
padding-top: $padding * 5; padding-top: $padding * 5;
@@ -153,4 +154,6 @@
padding-top: $padding; padding-top: $padding;
} }
} }
=======
>>>>>>> d8b90f97d110aed79b35d385dbc0eeb481ef4eab
</style> </style>

View File

@@ -19,7 +19,7 @@
</view> </view>
</view> </view>
<!-- content --> <!-- content -->
<view v-if="$store.state.token !== ''"> <view v-if="$store.state.token !== ''">
<connection-status :connection="connection" /> <connection-status :connection="connection" />
<conversation-list @refresh="getConversationList()" :conversations="conversations" /> <conversation-list @refresh="getConversationList()" :conversations="conversations" />
</view> </view>
@@ -76,13 +76,7 @@
onHide() { onHide() {
uni.$off('onReceiveMessage') uni.$off('onReceiveMessage')
}, },
methods: { methods: {
onDemo(){
console.log('1111')
uni.navigateTo({
url: '/pages/im/chatDemo'
})
},
checkNewFriendPending() { checkNewFriendPending() {
im.getPendingList((pendings) => { im.getPendingList((pendings) => {
this.hasNewFriends = pendings.length this.hasNewFriends = pendings.length

View File

@@ -75,18 +75,19 @@
// 关闭扬声器 // 关闭扬声器
volumeOff: false, volumeOff: false,
// 通话时长 // 通话时长
duration: 0 duration: 0,
interval: null
} }
}, },
onLoad(e) { onLoad(e) {
this.avatarSize = utils.rpx2px(200) this.avatarSize = utils.rpx2px(200)
this.targetId = e.targetId this.targetId = e.targetId
this.mediaType = e.mediaType this.mediaType = e.mediaType
this.isCall = Boolean(e.isCall) this.isCall = Boolean(e.isCall)
// 进入页面开启外呼 // 进入页面开启外呼
if (this.isCall) { if (this.isCall) {
CallLib.startSingleCall(this.targetId, this.mediaType, ''); CallLib.startSingleCall(this.targetId, this.mediaType, '');
if (this.mediaType == '1') { if (this.mediaType == 1) {
const session = CallLib.getCurrentCallSession() const session = CallLib.getCurrentCallSession()
setTimeout(() => { setTimeout(() => {
CallLib.setVideoView(session.mine.userId, this.$refs.bigVideoView.ref, 0, false) CallLib.setVideoView(session.mine.userId, this.$refs.bigVideoView.ref, 0, false)
@@ -107,7 +108,6 @@
this.bigVideoStyle = { this.bigVideoStyle = {
width: this.windowWidth + 'px', width: this.windowWidth + 'px',
height: this.windowHeight + 'px', height: this.windowHeight + 'px',
// backgroundImage: `url("${this.contact(this.targetId).portraitUrl}")`
} }
this.movableAreaStyle = { this.movableAreaStyle = {
width: this.windowWidth + 'px', width: this.windowWidth + 'px',
@@ -131,8 +131,8 @@
} }
}, },
methods: { methods: {
afterHangup() { afterHangup() {
const conversationType = IMLib.ConversationType.PRIVATE // 会话类型 clearInterval(this.interval)
const targetId = this.targetId const targetId = this.targetId
const sentStatus = 30 const sentStatus = 30
const messageContent = { const messageContent = {
@@ -144,19 +144,12 @@
duration: this.duration duration: this.duration
}) })
} }
const sentTime = 0 // 消息的发送时间 const sentTime = 0
IMLib.insertOutgoingMessage(conversationType, targetId, sentStatus, messageContent, sentTime, if (this.isCall) {
({ IMLib.insertOutgoingMessage(1, targetId, sentStatus, messageContent, sentTime)
code, } else {
message IMLib.insertIncomingMessage(1, targetId, targetId, sentStatus, messageContent, sentTime)
}) => { }
console.log(code);
// 插入消息成功
if (code === 0) {
console.log(message)
}
}
)
uni.$emit('onReceiveMessage', { uni.$emit('onReceiveMessage', {
targetId: this.targetId targetId: this.targetId
}) })
@@ -180,34 +173,37 @@
// 设置链接状态 // 设置链接状态
this.connected = true this.connected = true
// 视频通话,才开摄像头 // 视频通话,才开摄像头
if (this.mediaType == '1') { if (this.mediaType == 1) {
const session = CallLib.getCurrentCallSession() const session = CallLib.getCurrentCallSession()
setTimeout(() => { setTimeout(() => {
CallLib.setVideoView(session.targetId, this.$refs.bigVideoView.ref, 0, false) CallLib.setVideoView(session.targetId, this.$refs.bigVideoView.ref, 0, false)
CallLib.setVideoView(session.mine.userId, this.$refs.smallVideoView.ref, 0, true) CallLib.setVideoView(session.mine.userId, this.$refs.smallVideoView.ref, 0, true)
}, 200) }, 200)
} }
this.interval = setInterval(() => {
this.duration++
}, 1000)
}, },
// 切换主屏显示人 // 切换主屏显示人
changeMine() { changeMine() {
if (this.isCall) { // if (this.isCall) {
const session = CallLib.getCurrentCallSession() // const session = CallLib.getCurrentCallSession()
setTimeout(() => { // setTimeout(() => {
CallLib.setVideoView(session.targetId, this.$refs.bigVideoView.ref, 0, false) // CallLib.setVideoView(session.targetId, this.$refs.bigVideoView.ref, 0, false)
CallLib.setVideoView(session.mine.userId, this.$refs.smallVideoView.ref, 0, true) // CallLib.setVideoView(session.mine.userId, this.$refs.smallVideoView.ref, 0, true)
}, 200) // }, 200)
} else { // } else {
const session = CallLib.getCurrentCallSession() // const session = CallLib.getCurrentCallSession()
setTimeout(() => { // setTimeout(() => {
CallLib.setVideoView(session.targetId, this.$refs.smallVideoView.ref, 0, true) // CallLib.setVideoView(session.targetId, this.$refs.smallVideoView.ref, 0, true)
CallLib.setVideoView(session.mine.userId, this.$refs.bigVideoView.ref, 0, false) // CallLib.setVideoView(session.mine.userId, this.$refs.bigVideoView.ref, 0, false)
}, 200) // }, 200)
} // }
this.isCall = !this.isCall // this.isCall = !this.isCall
}, },
hangup() { hangup() {
this.afterHangup()
CallLib.hangup() CallLib.hangup()
this.afterHangup()
this.stopRing() this.stopRing()
setTimeout(() => { setTimeout(() => {

View File

@@ -7,7 +7,7 @@
<view class="cell" v-for="(item, index) in messages" :key="index"> <view class="cell" v-for="(item, index) in messages" :key="index">
<view class="time">{{ item.sentTime|timeCustomCN }}</view> <view class="time">{{ item.sentTime|timeCustomCN }}</view>
<view :class="['cell-item', item.messageDirection == 1 ? 'right' : 'left']"> <view :class="['cell-item', item.messageDirection == 1 ? 'right' : 'left']">
<u-avatar class="avatar" size="40" shape="square" <u-avatar class="avatar" :size="avatarSize" shape="square"
@click="showUser(item.senderUserId, item.messageDirection)" @click="showUser(item.senderUserId, item.messageDirection)"
:src="contact(item.senderUserId).portraitUrl" /> :src="contact(item.senderUserId).portraitUrl" />
<view class="msg"> <view class="msg">
@@ -37,7 +37,9 @@
import showImage from '../components/showImage' import showImage from '../components/showImage'
import showText from '../components/showText' import showText from '../components/showText'
import showCall from '../components/showCall' import showCall from '../components/showCall'
import sentMessageBar from '../components/sentMessageBar' import sentMessageBar from '../components/sentMessageBar'
import utils from '@/utils/index.js'
export default { export default {
components: { components: {
sentMessageBar, sentMessageBar,
@@ -47,7 +49,8 @@
showCall showCall
}, },
data() { data() {
return { return {
avatarRpx: 84,
targetId: '', targetId: '',
messages: [], messages: [],
conversationType: 1, conversationType: 1,
@@ -58,7 +61,10 @@
} }
} }
}, },
computed: { computed: {
avatarSize() {
return utils.rpx2px(this.avatarRpx)
},
latestMessage() { latestMessage() {
if (this.messages.length) { if (this.messages.length) {
return this.messages[0] return this.messages[0]
@@ -95,7 +101,7 @@
} }
}) })
// 监听收到新消息,判断是否是当前会话,更新会话内容 // 监听收到新消息,判断是否是当前会话,更新会话内容
uni.$on('onReceiveMessage', (msg) => { uni.$on('onReceiveMessage', (msg) => {
if (msg.targetId == this.targetId) { if (msg.targetId == this.targetId) {
this.getNewMessage() this.getNewMessage()
} }
@@ -179,7 +185,8 @@
.time { .time {
text-align: center; text-align: center;
font-size: 24rpx; font-size: 24rpx;
color: #666; color: #666;
margin-bottom: 10rpx;
} }
.cell-item { .cell-item {