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

...

Browse Source
This commit is contained in:
张冬雪
2022-02-18 11:50:22 +08:00
parent d6974e9a8b 6c0feb9cb6
commit ea381fd3f3
17 changed files with 237 additions and 102 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
pages/im/components/messagePreview.nvue → pages/im/components/messagePreview.vue
View File

0
pages/im/components/sentMessageBar.nvue → pages/im/components/sentMessageBar.vue
View File

0
pages/im/components/sentPopups.nvue → pages/im/components/sentPopups.vue
View File

0
pages/im/components/sentText.nvue → pages/im/components/sentText.vue
View File

0
pages/im/components/sentVoice.nvue → pages/im/components/sentVoice.vue
View File

0
pages/im/components/showImage.nvue → pages/im/components/showImage.vue
View File

0
pages/im/components/showText.nvue → pages/im/components/showText.vue
View File

0
pages/im/components/showVoice.nvue → pages/im/components/showVoice.vue
View File

42
pages/im/group/chat.nvue → pages/im/group/chat.vue
View File

@@ -1,19 +1,23 @@
<template>
<view class="group--chat">
<list class="body" :show-scrollbar="false">
<cell class="cell" v-for="(item, index) in messages" :key="index">
<view class="cell-system" v-if="item.senderUserId === '__system__'"> <text class="text">{{ item.content.message }}</text> </view>
<scroll-view class="body" :show-scrollbar="false">
<view class="cell" v-for="(item, index) in messages" :key="index">
<view class="cell-system" v-if="item.senderUserId === '__system__'">{{ item.content.message }}</view>
<view v-else :class="['cell-item', item.messageDirection == 1 ? 'right' : 'left']">
<u-avatar class="avatar" @click="toUser(item)" size="36" shape="square" :src="contact(item.senderUserId).portraitUrl" />
<u-avatar class="avatar" @click="toUser(item)" size="36" shape="square"
:src="contact(item.senderUserId).portraitUrl" />
<view class="msg">
<show-voice v-if="item.objectName === 'RC:HQVCMsg'" :guest="item.messageDirection == 1" :msg="item.content" :name="contact(item.senderUserId).name" />
<show-image v-if="item.objectName === 'RC:ImgMsg'" :guest="item.messageDirection == 1" :msg="item.content" :name="contact(item.senderUserId).name" />
<show-text v-if="item.objectName === 'RC:TxtMsg'" :guest="item.messageDirection == 1" :msg="item.content" :name="contact(item.senderUserId).name" />
<show-voice v-if="item.objectName === 'RC:HQVCMsg'" :guest="item.messageDirection == 1"
:msg="item.content" :name="contact(item.senderUserId).name" />
<show-image v-if="item.objectName === 'RC:ImgMsg'" :guest="item.messageDirection == 1"
:msg="item.content" :name="contact(item.senderUserId).name" />
<show-text v-if="item.objectName === 'RC:TxtMsg'" :guest="item.messageDirection == 1"
:msg="item.content" :name="contact(item.senderUserId).name" />
</view>
</view>
</cell>
<cell class="cell-footer" ref="chatBottom" />
</list>
</view>
<view class="cell-footer" ref="chatBottom"></view>
</scroll-view>
<sent-message-bar :conversationType="conversationType" :targetId="targetId" @onSuccess="getNewMessage()" />
</view>
</template>
@@ -163,24 +167,24 @@
<style lang="scss" scoped>
.group--chat {
background: $window-color;
flex: 1;
.body {
height: 100vh;
display: flex;
flex-direction: column;
.body {
overflow: scroll;
flex: 1;
.cell {
padding: 10rpx 30rpx;
.cell-system {
align-items: center;
.text {
font-size: 24rpx;
color: $text-gray-m;
}
text-align: center;
}
.cell-item {
display: flex;
flex-direction: row;
width: 690rpx;
justify-content: flex-start;
align-items: flex-start;

100
pages/im/group/invite.vue
View File

@@ -1,6 +1,6 @@
<template>
<view>
<u-index-list :index-list="indexs" inactiveColor="#666" activeColor="#34CE98">
<!-- <u-index-list :index-list="indexs" inactiveColor="#666" activeColor="#34CE98">
<view class="search">
<u--input class="search-input" placeholder="搜索" border="none" prefixIcon="search" v-model="searchTxt"
disabledColor="#Fff" prefixIconStyle="font-size: 22px;color: #909399" />
@@ -26,25 +26,49 @@
:src="searchTxt=== '' ? require('@/static/imgs/no-friend.png') :require('@/static/imgs/no-search.png')"
:lazy-load="true" />
<span>{{searchTxt=== ''?'暂无好友列表~':'暂无搜索内容~'}}</span>
</view>
</view> -->
<button type="default" @click="onInvite">确定</button>
<u-index-list :index-list="indexs" inactiveColor="#666" activeColor="#34CE98">
<u-checkbox-group v-if="friends.length > 0" v-model="checkboxValue" placement="column">
<u-index-item v-for="(item, fkey) in friends" :key="fkey">
<u-index-anchor :text="indexs[fkey]" bgColor="#ededed" height="20" size="12" color="#666"
style="padding:10rpx 30rpx" />
<view v-for="(friendItem, index) in item" :key="index" class="friend-flex"
@click="addContact(friendItem.targetId)">
<u-checkbox :name="friendItem.targetId" shape="circle" />
<u-avatar class="avatar-img" size="40" shape="square"
:src="contact(friendItem.targetId).portraitUrl" />
<view class="info">
<view class="name">{{ contact(friendItem.targetId).name }}</view>
<!-- <view class="address">Hash:{{ friendItem.address }}</view> -->
</view>
</view>
</u-index-item>
</u-checkbox-group>
</u-index-list>
</view>
</template>
<script>
import {
getFriendsLetter
getFriendsLetter,
inviteGroupUser
} from '@/apis/interfaces/im';
import * as RongIMLib from '@/uni_modules/RongCloud-IMWrapper/js_sdk/index'
export default {
data() {
return {
// indexs: [],
// friends: [],
// pendingCount: 0,
// searchTxt: '',
// checkboxValue: [],
targetId: '',
indexs: [],
friends: [],
pendingCount: 0,
searchTxt: '',
checkboxValue: [],
checkboxValue: []
};
},
computed: {
@@ -54,39 +78,65 @@
}
}
},
onLoad() {
// onLoad() {
// this.getFriendList()
// this.checkNewFriendPending()
// uni.$on('onContactNotification', this.checkNewFriendPending)
// },
// methods: {
// // group事件
// checkboxChange(n) {
// console.log('change', n);
// },
// getFriendList() {
// getFriendsLetter().then(res => {
// console.log(res)
onLoad(e) {
this.targetId = e.targetId
this.getFriendList()
this.checkNewFriendPending()
uni.$on('onContactNotification', this.checkNewFriendPending)
},
methods: {
// group事件
checkboxChange(n) {
console.log('change', n);
},
getFriendList() {
getFriendsLetter().then(res => {
console.log(res)
this.indexs = res.indexList
this.friends = res.itemArr
})
},
selectFriend(targetId) {
console.log(targetId,typeof targetId)
let arr = this.checkboxValue
let index = arr.findIndex(item => item === targetId)
if(index>0){
console.log('选择了再次点击清除数据le')
// selectFriend(targetId) {
// console.log(targetId,typeof targetId)
// let arr = this.checkboxValue
// let index = arr.findIndex(item => item === targetId)
// if(index>0){
// console.log('选择了再次点击清除数据le')
}else{
console.log('没有选择过，添加数据')
// }else{
// console.log('没有选择过，添加数据')
}
// }
console.log(this.checkboxValue,index)
console.log('奥克兰打开',targetId)
// console.log(this.checkboxValue,index)
// console.log('奥克兰打开',targetId)
// },
addContact(targetId) {
if (!this.checkboxValue.find(item => item == targetId)) {
this.checkboxValue.push(targetId)
} else {
const index = this.checkboxValue.findIndex(item => item == targetId)
this.checkboxValue = this.checkboxValue.splice(index, 1)
}
},
onInvite() {
inviteGroupUser(this.targetId, this.checkboxValue).then(res => {
uni.navigateBack()
}).catch(err => {
uni.showToast({
icon: 'none',
title: err.message
})
})
}
}
};
</script>

59
pages/im/group/reviewed.vue
View File

@@ -1,47 +1,72 @@
<!-- 群聊邀请确认列表页面 -->
<template>
<view class="reviewed">
<view class="reviewed-item">
<u-icon name="plus-people-fill" color="#fff" class="add-icon" />
{{`' 艾米的猫儿洛基 '想邀请 1位朋友加入群聊`}}
<view class="sure"> 去确认 </view>
</view>
<view class="reviewed-item">
<u-avatar class="avatar" src="require('@/static/user/cover.png')" shape="square" size="44" />
<view style="width: 500rpx;">
<view class="nickname"><span>艾米的猫儿</span>想邀请<span>艾米的猫儿洛基艾米</span>加入群聊</view>
<view> 申请原因：{{`呵呵哒。。`}}</view>
</view>
<view class="sure" @click="sure(2)"> 去确认 </view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
indexs: [],
lists: [],
};
},
onLoad() {
},
methods: {
sure(id) {
console.log(id, '....')
uni.navigateTo({
url: "/pages/im/group/reviewedInfo?id=" + id
})
}
}
};
</script>
<style lang="scss" scoped>
.reviewed{
.reviewed-item{
.reviewed {
.reviewed-item {
margin: $padding - 10;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
align-items: flex-start;
justify-content: flex-start;
box-sizing: border-box;
.add-icon{
border-bottom: solid 1rpx #f9f9f9;
font-size: $title-size-m - 2;
padding-bottom: 20rpx;
color: $text-gray-m;
.avatar {
background-color: $main-color;
padding: 10rpx;
border-radius: 6rpx;
margin-right: 20rpx;
}
.nickname{
font-size: $title-size-m;
span{
color: rgba($color: $main-color, $alpha: 0.5);
}
}
.sure {
color: $main-color;
text-align: center;
font-size: $title-size-m;
padding: 6rpx 20rpx;
border-radius: 10rpx;
}
}
}
</style>

62
pages/im/group/reviewedInfo.vue Normal file
View File

@@ -0,0 +1,62 @@
<!-- 群聊邀请确认列表页面 -->
<template>
<view class="reviewed">
确认信息页面
</view>
</template>
<script>
export default {
data() {
return {
lists: [],
};
},
onLoad() {
},
methods: {
sure(id) {
uni.navigateTo({
url:"/pages/im/group/reviewedInfo?id="+id
})
}
}
};
</script>
<style lang="scss" scoped>
.reviewed {
.reviewed-item {
margin: $padding;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
box-sizing: border-box;
border-bottom: solid 1rpx #f9f9f9;
font-size: $title-size-m;
padding-bottom: 20rpx;
color: $text-gray;
.add-icon {
background-color: $main-color;
padding: 10rpx;
border-radius: 6rpx;
margin-right: 20rpx;
}
.sure {
// width: 140rpx;
// background-color: $main-color;
color: $main-color;
text-align: center;
font-size: $title-size-m;
padding: 6rpx 20rpx;
border-radius: 10rpx;
}
}
}
</style>

2
pages/im/index.vue
View File

@@ -99,7 +99,7 @@
code,
conversations
}) => {
if (code === 0) {
if (code === 0) {
this.conversations = conversations
}
})

27
pages/im/private/call.nvue
View File

@@ -10,8 +10,7 @@
<view class="status" v-if="!connected || mediaType == 0">
<view class="remote">
<u-avatar :src="contact(targetId).portraitUrl" shape="square" size="96"
bgColor="#fff" />
<u-avatar :src="contact(targetId).portraitUrl" shape="square" size="96" bgColor="#fff" />
<view><text class="nickname">{{ contact(targetId).name }}</text></view>
<view v-if="remoteRinging"><text class="mediaType">等待对方接听</text></view>
<view v-if="connected"><text class="mediaType">已接通</text></view>
@@ -68,10 +67,10 @@
},
onLoad(e) {
this.targetId = e.targetId
this.mediaType = e.mediaType
// 进入页面开启外呼
CallLib.startSingleCall(this.targetId, this.mediaType, '');
this.mediaType = e.mediaType
// 进入页面开启外呼
CallLib.startSingleCall(this.targetId, this.mediaType, '');
// 响铃
this.startRing()
// 监听通话链接状态
uni.$once('onCallConnected', this.onCallConnected)
@@ -92,11 +91,11 @@
},
windowHeight() {
return uni.getSystemInfoSync().windowHeight
},
contact() {
return function(targetId) {
return this.$store.getters.contactInfo(targetId)
}
},
contact() {
return function(targetId) {
return this.$store.getters.contactInfo(targetId)
}
}
},
methods: {
@@ -120,10 +119,8 @@
if (this.mediaType == 1) {
const session = CallLib.getCurrentCallSession()
setTimeout(() => {
CallLib.setVideoView(session.targetId, this.$refs.bigVideoView.ref, 0,
false)
CallLib.setVideoView(session.mine.userId, this.$refs.smallVideoView.ref, 0,
true)
CallLib.setVideoView(session.targetId, this.$refs.bigVideoView.ref, 0, false)
CallLib.setVideoView(session.mine.userId, this.$refs.smallVideoView.ref, 0, true)
}, 200)
}
},

41
pages/im/private/chat.nvue → pages/im/private/chat.vue
View File

@@ -1,9 +1,9 @@
<template>
<view class="chat">
<!-- chat -->
<list class="body" :show-scrollbar="false">
<cell class="cell" v-for="(item, index) in messages" :key="index">
<view class="time"> <text class="text">{{ customCN(item.sentTime) }}</text> </view>
<scroll-view class="body" scroll-y>
<view class="cell" v-for="(item, index) in messages" :key="index">
<view class="time">{{ customCN(item.sentTime) }}</view>
<view :class="['cell-item', item.messageDirection == 1 ? 'right' : 'left']">
<u-avatar class="avatar" size="40" shape="square" @click="showUser(targetId, item.messageDirection)"
:src="contact(item.senderUserId).portraitUrl" />
@@ -15,13 +15,14 @@
<show-text v-if="item.objectName === 'RC:TxtMsg'" :guest="item.messageDirection == 1"
:msg="item.content" />
<view class="state" v-if="item.messageDirection == 1">
<text :class="item.sentStatus === 50?'state-text':'state-text-active'">{{ item.sentStatus == 50 ? '已读': '未读'}}</text>
<text
:class="item.sentStatus === 50?'state-text':'state-text-active'">{{ item.sentStatus == 50 ? '已读': '未读'}}</text>
</view>
</view>
</view>
</cell>
<cell class="cell-footer" ref="chatBottom" />
</list>
</view>
<view class="cell-footer" ref="chatBottom"></view>
</scroll-view>
<sent-message-bar :conversationType="conversationType" :targetId="targetId" @onSuccess="getNewMessage()" />
</view>
</template>
@@ -78,7 +79,7 @@
this.targetId = e.targetId
this.userInfo = this.$store.getters.contactInfo(this.targetId)
uni.setNavigationBarTitle({
title: this.userInfo.name
title: this.contact(this.targetId).name
})
// 获取消息列表
this.getMessageList()
@@ -169,31 +170,25 @@
/* 窗口 */
.chat {
background: $window-color;
flex: 1;
height: 100vh;
display: flex;
flex-direction: column;
.body {
flex: 1;
overflow: scroll;
.cell {
padding: 10rpx 30rpx;
.time {
justify-content: center;
align-items: center;
padding-bottom: 20rpx;
.text {
background: #fff;
font-size: 24rpx;
color: #666;
line-height: 40rpx;
padding: 0 20rpx;
border-radius: 10rpx;
}
text-align: center;
font-size: 24rpx;
color: #666;
}
.cell-item {
display: flex;
width: 690rpx;
justify-content: flex-start;
@@ -223,7 +218,7 @@
.state-text-active {
font-size: $title-size-m - 2;
color: #cecece;
color: #cecece;
}
}
}