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

merge

Browse Source
This commit is contained in:
唐明明
2022-01-24 14:13:34 +08:00
parent 15c83ad6bd 33b4fb304d
commit d8d54a4d1b
14 changed files with 1058 additions and 808 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
.hbuilderx/launch.json
View File

@@ -4,7 +4,7 @@
"configurations": [{ "configurations": [{
"app-plus" : "app-plus" :
{ {
"launchtype" : "remote" "launchtype" : "local"
}, },
"default" : "default" :
{ {

78
apis/interfaces/im.js
View File

@@ -1,46 +1,78 @@
/**
/** * Web唐明明
* Web唐明明 * 匆匆数载恍如梦，岁月迢迢华发增。
* 匆匆数载恍如梦，岁月迢迢华发增。 * 碌碌无为枉半生，一朝惊醒万事空。
* 碌碌无为枉半生，一朝惊醒万事空。 * moduleName: 聊聊
* moduleName: 聊聊 */
*/
import {
import { request } from '../index' request
} from '../index'
// 获取好友列表 // 获取好友列表
const getFriends = () => { const getFriends = () => {
return request({ return request({
url: 'im/friends', url: 'im/friends',
}, true) }, true)
} }
// 获取融云token // 获取融云token
const getImToken = () => { const getImToken = () => {
return request({ return request({
url: 'im/token', url: 'im/token',
}, true) }, true)
} }
// 获取用户信息 // 获取用户信息
const getUserInfo = (targetId) => { const getUserInfo = (targetId) => {
return request({ return request({
url: 'im/userInfo/' + targetId, url: 'im/userInfo/' + targetId,
}) })
} }
/** /**
* 获取好友申请列表 * 获取好友申请列表
*/ */
const getPedings = () => { const getPedings = () => {
return request({ return request({
url: 'im/friends/pending' url: 'im/friends/pending'
}) })
}
const resolveFriend = (targetId) => {
return request({
method: 'POST',
url: 'im/friends/accept/' + targetId
})
}
const rejectFriend = (targetId) => {
return request({
method: 'DELETE',
url: 'im/friends/accept/' + targetId
})
}
const searchFriend = (mobile) => {
return request({
url: 'im/search?mobile=' + mobile
})
}
const pedingFriend = (recipient) => {
return request({
method: 'POST',
url: 'im/friends/' + recipient
})
} }
export { export {
getImToken, getImToken,
getFriends, getFriends,
getUserInfo, getUserInfo,
getPedings getPedings,
resolveFriend,
rejectFriend,
searchFriend,
pedingFriend
} }

4
manifest.json
View File

@@ -2,8 +2,8 @@
"name" : "ZH-HEALTH", "name" : "ZH-HEALTH",
"appid" : "__UNI__C29473D", "appid" : "__UNI__C29473D",
"description" : "ZH-HEALTH，您手上的健康管理专家", "description" : "ZH-HEALTH，您手上的健康管理专家",
"versionName" : "1.0.3", "versionName" : "1.0.5",
"versionCode" : 103, "versionCode" : 105,
"transformPx" : false, "transformPx" : false,
/* 5+App特有相关 */ /* 5+App特有相关 */
"app-plus" : { "app-plus" : {

8
pages.json
View File

@@ -372,7 +372,7 @@
"name": "imPrivate", "name": "imPrivate",
"style": { "style": {
"navigationBarTitleText": "聊天", "navigationBarTitleText": "聊天",
"navigationBarBackgroundColor": "#FFFFFF", "navigationBarBackgroundColor": "#F3F6FB",
"disableScroll": true, "disableScroll": true,
"app-plus": { "app-plus": {
"titleNView": { "titleNView": {
@@ -420,8 +420,8 @@
"path": "pages/im/friends/pending", "path": "pages/im/friends/pending",
"name": "imFriendsPending", "name": "imFriendsPending",
"style": { "style": {
"navigationBarTitleText": "新的朋友", "navigationBarTitleText": "新朋友",
"navigationBarBackgroundColor":"#FFFFFF" "navigationBarBackgroundColor":"#F3F6FB"
} }
}, },
{ {
@@ -429,7 +429,7 @@
"name": "imFriendsInfo", "name": "imFriendsInfo",
"style": { "style": {
"navigationBarTitleText": "好友资料", "navigationBarTitleText": "好友资料",
"navigationBarBackgroundColor":"#FFFFFF" "navigationBarBackgroundColor":"#F3F6FB"
} }
}, },
{ {

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

@@ -1,125 +1,84 @@
<template> <template>
<view> <view>
<view class="list"> <u-list height="auto">
<view class="list__item" @click="toPending"> <u-list-item>
<u-avatar size="35" icon="plus-people-fill" fontSize="26" bg-color="#f0ad4e"></u-avatar> <u-cell title="新的朋友" @click="toPending">
<text class="list__item__user-name">新的朋友</text> <u-avatar slot="icon" size="35" font-size="24" icon="plus-people-fill" shape="square"
</view> bg-color="#f0ad4e"></u-avatar>
<u-line></u-line> </u-cell>
<view class="list__item" @click="showToast"> </u-list-item>
<u-avatar size="35" icon="account-fill" fontSize="26" bg-color="#4cd964"></u-avatar> <u-list-item>
<text class="list__item__user-name">我的群聊</text> <u-cell title="我的群聊" @click="showToast">
</view> <u-avatar slot="icon" size="35" font-size="24" icon="account-fill" shape="square"
<u-line></u-line> bg-color="#4cd964"></u-avatar>
</view> </u-cell>
<block v-if="friendsArr.length > 0"> </u-list-item>
<u-index-list activeColor="#34CE98"> </u-list>
<template v-for="(item, index) in friendsArr">
<!-- #ifdef APP-NVUE --> <block v-if="friends.length > 0">
<u-index-anchor bgColor="#F3F6FB" color="#666" :text="indexList[index]" :key="index"></u-index-anchor> <u-list height="auto">
<!-- #endif --> <u-list-item v-for="(item, index) in friends" :key="index">
<u-index-item :key="index"> <u-cell :title="item.name + item.userId" @click="toInfo(item.userId)">
<!-- #ifndef APP-NVUE --> <u-avatar slot="icon" shape="square" size="35" :src="item.portraitUrl"></u-avatar>
<u-index-anchor :text="indexList[index]" bgColor="#F3F6FB" color="#666"></u-index-anchor> </u-cell>
<!-- #endif --> </u-list-item>
<view class="list" v-for="(item1, index1) in item" :key="index1"> </u-list>
<view class="list__item" @click="toInfo(10047)"> </block>
<image class="list__item__avatar" :src="item1.url"></image> <block v-else>
<!-- <u-avatar size="35" icon="chrome-circle-fill" fontSize="26" randomBgColor></u-avatar> --> <u-empty class="pages-null" mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" text="暂无好友">
<text class="list__item__user-name">{{item1.name}}</text> </u-empty>
</view> </block>
<u-line></u-line>
</view>
</u-index-item>
</template>
<view slot="footer" class="u-safe-area-inset--bottom">
<text class="list__footer">共305位好友</text>
</view>
</u-index-list>
</block>
<block v-else>
<u-empty
class="pages-null"
mode="data"
icon="http://cdn.uviewui.com/uview/empty/data.png"
text="暂未添加好友"
>
</u-empty>
</block>
</view> </view>
</template> </template>
<script> <script>
import { getFriends } from '@/apis/interfaces/im' import {
getFriends
} from '@/apis/interfaces/im'
export default { export default {
data() { data() {
return { return {
friendsArr: [] friends: []
} }
}, },
onShow() { onShow() {
getFriends().then(res => { getFriends().then(res => {
this.friendsArr = res this.friends = res
console.log(res) })
}) },
},
computed: { computed: {
}, },
methods: { methods: {
// 扫码提示 // 扫码提示
showToast(){ showToast() {
uni.showToast({ uni.showToast({
title: "群聊功能暂未开放，敬请期待", title: "群聊功能暂未开放，敬请期待",
icon : "none" icon: "none"
}) })
}, },
// 新朋友 // 新朋友
toPending() { toPending() {
uni.navigateTo({ uni.navigateTo({
url: '/pages/im/friends/pending' url: '/pages/im/friends/pending'
}) })
}, },
// 用户资料 // 用户资料
toInfo(targetId) { toInfo(targetId) {
uni.navigateTo({ uni.navigateTo({
url: '/pages/im/friends/info?targeId=' + targetId url: '/pages/im/friends/info?targetId=' + targetId
}) })
} }
}, },
onNavigationBarButtonTap(e) { onNavigationBarButtonTap(e) {
this.toPending() this.toPending()
} }
} }
</script> </script>
<style lang="scss"> <style lang="scss">
.list { // 页面空
&__item { .pages-null {
@include flex; height: 70vh;
padding: 6px 12px; }
align-items: center;
&__avatar {
height: 35px;
width: 35px;
border-radius: 50%;
}
&__user-name {
font-size: 16px;
margin-left: 10px;
color: $u-main-color;
}
}
&__footer {
color: $u-tips-color;
font-size: 14px;
text-align: center;
margin: 15px 0;
}
}
// 页面空
.pages-null{
height: 70vh;
}
</style> </style>

256
pages/im/friends/info.vue
View File

@@ -1,122 +1,146 @@
<template> <template>
<view class="content"> <view class="content">
<!-- 用户信息 --> <!-- 用户信息 -->
<view class="user-info"> <view class="user-info">
<u-avatar <u-avatar :src="userInfo.portraitUrl" size="100"></u-avatar>
src="https://cdn.uviewui.com/uview/album/1.jpg"
size="58" <view class="nickname">{{ userInfo.name }}</view>
></u-avatar> <!-- <view class="sex">
<view class="nickname">{{ userInfo.name }}</view> <u-tag text="男" color="#fff" borderColor="#5db6ee" size="mini" icon="man" bgColor="#5db6ee"></u-tag>
<view class="sex"> <u-tag text="女" color="#fff" borderColor="#e4867a" size="mini" icon="woman" bgColor="#e4867a"></u-tag>
<u-tag text="男" color="#fff" borderColor="#5db6ee" size="mini" icon="man" bgColor="#5db6ee"></u-tag> </view> -->
<!-- <u-tag text="女" color="#fff" borderColor="#e4867a" size="mini" icon="woman" bgColor="#e4867a"></u-tag> --> <view class="address">
</view> {{ userInfo.address}}
</view> </view>
<view class="user-lists"> </view>
<view class="user-lists-item"> <!-- <view class="user-lists">
<label>地区</label> <view class="user-lists-item">
<text>黑龙江 哈尔滨</text> <label>地区</label>
</view> <text>黑龙江 哈尔滨</text>
</view> </view>
<!-- 发送消息 --> </view> -->
<view class="info-footer"> <!-- 发送消息 -->
<button class="open-btn" @click="toPrivate">发送消息</button> <view class="info-footer">
</view> <button class="open-btn" @click="toPrivate">发送消息</button>
</view> </view>
</view>
</template> </template>
<script> <script>
import { import {
getUserInfo getUserInfo
} from '@/apis/interfaces/im.js' } from '@/apis/interfaces/im.js'
export default { export default {
data() { data() {
return { return {
userInfo: {} targetId: '',
} userInfo: {}
}, }
onLoad(e) { },
getUserInfo(e.targetId).then(res => { onLoad(e) {
this.userInfo = res this.targetId = e.targetId
}) console.log('获取资料',e.targetId);
}, getUserInfo(e.targetId).then(res => {
methods: { this.userInfo = res
toPrivate() { console.log('获取资料', res);
uni.navigateTo({ uni.setNavigationBarTitle({
url: '/pages/im/private/index?targetId=10047&conversationType=1' title: res.name
}) })
} })
} },
methods: {
toPrivate() {
uni.redirectTo({
url: '/pages/im/private/index?conversationType=1&targetId=' + this.targetId
})
}
}
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.content{ .content {
min-height: 100vh; min-height: 100vh;
background: $window-color; background: $window-color;
} }
// 用户信息
.user-info{ // 用户信息
padding: $padding*3 $padding; .user-info {
display: flex; padding: $padding*3 $padding;
flex-direction: column; display: flex;
justify-content: center; flex-direction: column;
align-items: center; justify-content: center;
background: white; align-items: center;
.nickname{ background: white;
font-size: 42rpx;
padding-top: $padding; .nickname {
color: $text-color; font-size: 42rpx;
} padding-top: $padding;
.sex{ }
padding-top: $padding/2;
text{ .address {
font-size: $title-size-sm; line-height: 64rpx;
background: #303133; font-size: 26rpx;
padding: 0 10rpx; color: $text-gray;
color: white; }
border-radius: $radius-m;
line-height: 30rpx; .sex {
display: inline-block; padding-top: $padding/2;
}
} text {
} font-size: $title-size-sm;
.user-lists{ background: #303133;
margin-top: $margin; padding: 0 10rpx;
background: white; color: white;
.user-lists-item{ border-radius: $radius-m;
padding: 0 $padding; line-height: 30rpx;
display: flex; display: inline-block;
justify-content: space-between; }
line-height: 90rpx; }
font-size: $title-size-lg; }
label{
color: $text-color; .user-lists {
} margin-top: $margin;
text{ background: white;
color: $text-gray;
} .user-lists-item {
} padding: 0 $padding;
} display: flex;
// 发送消息 justify-content: space-between;
.info-footer{ line-height: 90rpx;
padding: $padding; font-size: $title-size-lg;
width: 100%;
box-sizing: border-box; label {
.open-btn{ color: $text-color;
width: 100%; }
height: 90rpx;
line-height: 90rpx; text {
background: $main-color; color: $text-gray;
border-radius: $radius-lg; }
padding: 0; }
margin: 0; }
color: white;
font-size: $title-size; // 发送消息
&::after{ .info-footer {
display: none; padding: $padding;
} width: 100%;
} box-sizing: border-box;
}
.open-btn {
width: 100%;
height: 90rpx;
line-height: 90rpx;
background: $main-color;
border-radius: $radius-lg;
padding: 0;
margin: 0;
color: white;
font-size: $title-size;
&::after {
display: none;
}
}
}
</style> </style>

186
pages/im/friends/pending.vue
View File

@@ -1,69 +1,119 @@
<template> <template>
<view> <view>
<!-- 搜索 --> <!-- 搜索 -->
<view class="header-search"> <u-sticky>
<u-search placeholder="输入手机号码搜索" v-model="searchValue"></u-search> <view class="header-search">
</view> <u-search placeholder="输入手机号码搜索" bgColor="white" @custom="search" @search="search"
<!-- 新朋友 --> v-model="searchValue"></u-search>
<view class="lists"> </view>
<view class="lists-item" v-for="(item, index) in 10" :key="index"> </u-sticky>
<image class="lists-item-cover" src="" mode="aspectFill"></image> <u-list height="auto">
<view class="">好友</view> <u-list-item v-for="(item, index) in searchResult" :key="index">
<view class=""> <u-cell :title="item.name">
<text>通过</text> <u-avatar slot="icon" shape="square" size="35" :src="item.portraitUrl"></u-avatar>
<text>拒绝</text>
</view> <div style="width: 50px;" slot="value">
</view> <u-button type="success" size="small" @click="pending(item.userId)">申请</u-button>
</view> </div>
<!-- 空列表 --> </u-cell>
<view class=""> </u-list-item>
空列表 </u-list>
</view> <!-- 新朋友 -->
</view> <u-divider text="好友申请"></u-divider>
</template> <u-list height="auto">
<u-swipe-action>
<script> <u-list-item v-for="(item, index) in pedings" :key="index">
export default{ <u-swipe-action-item autoClose :options="options" @click="action($event, item)">
data(){ <u-cell :title="item.name">
return{ <u-avatar slot="icon" shape="square" size="35" :src="item.portraitUrl"></u-avatar>
searchValue: "", </u-cell>
listsArr: [] </u-swipe-action-item>
} </u-list-item>
} </u-swipe-action>
} </u-list>
</script> </view>
</template>
<style lang="scss" scoped>
.header-search{ <script>
padding: $padding/2 $padding; import {
background: white; getPedings,
} resolveFriend,
// 好友列表 rejectFriend,
.lists{ searchFriend,
.lists-item{ pedingFriend
padding: 20rpx $padding; } from '@/apis/interfaces/im.js'
position: relative;
display: flex; export default {
align-items: center; data() {
return {
&::after{ searchResult: [],
content: " "; searchValue: '',
position: absolute; pedings: [],
left: $margin; options: [{
right: 0; text: '通过',
bottom: 0; style: {
height: 1rpx; backgroundColor: '#3c9cff'
background-color: $border-color; }
} }, {
&:last-child::after{ text: '拒绝',
display: none; style: {
} backgroundColor: '#f56c6c'
.lists-item-cover{ }
width: 98rpx; }]
height: 98rpx; }
border-radius: 50%; },
background: $window-color; onLoad() {
} this.getPeddingList()
} },
} methods: {
search() {
console.log('sousuo');
searchFriend(this.searchValue).then(res => {
console.log(res);
this.searchResult = res
}).catch(err => {
console.log('err', err);
})
},
action(e, item) {
if (e.index == 0) {
resolveFriend(item.userId).then(res => {
this.getPeddingList()
})
} else {
rejectFriend(item.userId).then(res => {
this.getPeddingList()
})
}
},
getPeddingList() {
getPedings().then(res => {
this.pedings = res
})
},
pending(userId) {
uni.showLoading()
pedingFriend(userId).then(res => {
uni.showToast({
title: '申请成功',
success: () => {
this.searchResult = []
}
})
}).catch(err => {
uni.showToast({
icon: 'error',
title: err.message
})
})
}
}
}
</script>
<style lang="scss" scoped>
.header-search {
padding: $padding/2 $padding;
background: $window-color;
}
</style> </style>

286
pages/im/index.vue
View File

@@ -24,28 +24,39 @@
<block v-if="conversations.length < 1"> <block v-if="conversations.length < 1">
<view class="vertical null-list"> <view class="vertical null-list">
<u-empty icon="http://cdn.uviewui.com/uview/empty/message.png" textColor="#999" text="暂无好友消息"> <u-empty icon="http://cdn.uviewui.com/uview/empty/message.png" textColor="#999" text="暂无好友消息">
<template> <!-- <template>
<view class="null-list-btn">开启聊天</view> <view class="null-list-btn">开启聊天</view>
</template> </template> -->
</u-empty> </u-empty>
</view> </view>
</block> </block>
<block v-else> <block v-else>
<view v-for="(item, index) in conversations" :key="index" class="mssage-box" @click="toDetail(item)"> <u-alert type="warning" v-if="connection != 0" description="网络似乎断开了" :show-icon="true"></u-alert>
<view class="mssage-action"> <view v-for="(item, index) in conversations" :key="index" :class="['message', { 'is-top': item.isTop }]"
<block v-if="!friend(item.targetId).portraitUrl"> @tap="toDetail(item)" @longpress="onLongPress" :data-item="item">
<u-avatar clsss="mssage-action-cover" size="44" :text="friend(item.targetId).name ? friend(item.targetId).name.substring(0,1) : '未'" font-size="14" randomBgColor></u-avatar> <view class="avatar">
</block> <u-badge numberType="ellipsis" max="99" shape="horn" absolute :offset="[-5, -5]"
<block v-else> :value="item.unreadMessageCount" />
<u-avatar clsss="mssage-action-cover" :src="friend(item.targetId).portraitUrl" size="44"> <u-avatar size="44" v-if="!friend(item.targetId).portraitUrl"
</u-avatar> :text="friend(item.targetId).name ? friend(item.targetId).name.substring(0,1) : '未'"
</block> font-size="14" randomBgColor></u-avatar>
<view class="mssage-action-content"> <u-avatar v-else :src="friend(item.targetId).portraitUrl" size="44">
<view class="mssage-header"> </u-avatar>
<view class="header-name">{{ friend(item.targetId).name || '未知用户' }}</view> </view>
<view class="header-time">{{ item.sentTime|timeCustomCN }}</view>
</view> <view class="content">
<view class="mssage-msg">{{ item.latestMessage.content }}</view> <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 || '&nbsp;' }}</view>
</view>
</view>
<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">
{{item}}
</view> </view>
</view> </view>
</view> </view>
@@ -75,7 +86,16 @@
return { return {
isShown: true, // 当前页面显示状态 isShown: true, // 当前页面显示状态
conversations: [], // 会话列表 conversations: [], // 会话列表
isImToken: '', // 是否已鉴权 connection: 0,
/* 窗口尺寸 */
winSize: {},
/* 显示操作弹窗 */
showPop: false,
/* 弹窗按钮列表 */
popButton: ['置顶聊天', '删除该聊天'],
/* 弹窗定位样式 */
popStyle: "",
pickedItem: {}
} }
}, },
computed: { computed: {
@@ -87,16 +107,14 @@
}, },
onShow() { onShow() {
if (this.$store.state.token !== '') { if (this.$store.state.token !== '') {
if (this.isImToken === '') { getImToken().then(res => {
getImToken().then(res => { console.log("IMTOKEN", res);
im.connect(res.token, res.userInfo) im.connect(res.token, res.userInfo, () => {
this.isImToken = res.token this.getConversationList()
this.getConversationList()
}) })
} })
this.getConversationList() }
this.isShown = true this.isShown = true
}
}, },
onHide() { onHide() {
this.isShown = false this.isShown = false
@@ -108,22 +126,67 @@
icon: 'none' icon: 'none'
}) })
} }
if (e.index == 1) { if (e.index == 1) {
if(this.toLogin()){ if (this.toLogin()) {
this.$Router.push({ this.$Router.push({
name: 'imFriends' name: 'imFriends'
}) })
}
}
},
watch: {
'$store.getters.newMessage': function(n, o) {
if (this.isShown) {
this.getConversationList()
} }
} }
}, },
watch: {
'$store.getters.newMessage': function(n, o) {
if (this.isShown) {
this.getConversationList()
}
},
'$store.getters.connection': function(n, o) {
this.connection = n
}
},
methods: { methods: {
hidePop() {
this.showPop = false
this.pickedItem = {}
setTimeout(() => {
this.showShade = false
}, 250)
},
pickerMenu(e) {
const index = Number(e.currentTarget.dataset.index)
if (index == 0) {
RongIMLib.setConversationToTop(this.pickedItem.conversationType, this.pickedItem.targetId, !this
.pickedItem.isTop)
} else {
RongIMLib.removeConversation(this.pickedItem.conversationType, this.pickedItem.targetId)
}
this.getConversationList()
this.hidePop()
},
onLongPress(e) {
let [touches, style, item] = [e.touches[0], "", e.currentTarget.dataset.item]
if (touches.clientY > (this.winSize.height / 2)) {
style = `bottom:${this.winSize.height-touches.clientY}px;`
} else {
style = `top:${touches.clientY}px;`
}
if (touches.clientX > (this.winSize.witdh / 2)) {
style += `right:${this.winSize.witdh-touches.clientX}px`
} else {
style += `left:${touches.clientX}px`
}
this.popButton[0] = item.isTop ? '取消置顶' : '置顶聊天'
this.popStyle = style
this.pickedItem = item
this.$nextTick(() => {
setTimeout(() => {
this.showPop = true;
}, 10)
})
},
// 检查登录 // 检查登录
toLogin() { toLogin() {
if (this.$store.state.token === '') { if (this.$store.state.token === '') {
@@ -133,20 +196,19 @@
} }
return true return true
}, },
getFriend(targetId) {
return this.$store.getters.userInfo(targetId)
},
getConversationList() { getConversationList() {
const count = 1000 const count = 1000
const timestamp = 0 // 会话的时间戳（获取这个时间戳之前的会话列表，0 表示从最新开始获取）会话类型 const timestamp = 0
RongIMLib.getConversationList(undefined, count, timestamp, (res) => { RongIMLib.getConversationList(undefined, count, timestamp, (res) => {
console.log('获取列表', res);
if (res.code === 0 && res.conversations.length > 0) { if (res.code === 0 && res.conversations.length > 0) {
this.conversations = res.conversations this.conversations = res.conversations
} }
}) })
}, },
// 进入聊天的详情页面，清理未读消息数量 // 进入聊天的详情页面，清理未读消息数量
toDetail(item) { toDetail(item) {
this.hidePop()
uni.navigateTo({ uni.navigateTo({
url: '/pages/im/private/index?targetId=' + item.targetId + '&conversationType=' + item url: '/pages/im/private/index?targetId=' + item.targetId + '&conversationType=' + item
.conversationType .conversationType
@@ -220,62 +282,98 @@
} }
} }
.mssage-box { .message {
position: relative;
display: flex;
background: white; background: white;
padding: 24rpx 24rpx 20rpx 24rpx;
.mssage-action { &.is-top {
background: $window-color;
}
.avatar {
position: relative; position: relative;
padding: 20rpx $padding;
&::after { .u-badge {
position: absolute; z-index: 999;
left: $padding + 108;
right: 0;
bottom: 0;
content: " ";
height: 1rpx;
background: $border-color;
}
&-content {
position: absolute;
top: 20rpx;
height: 44px;
left: $padding + 108;
right: $margin;
display: flex;
flex-direction: column;
justify-content: center;
.mssage-header {
display: flex;
font-size: $title-size;
line-height: 40rpx;
justify-content: space-between;
.header-name {
flex: 1;
@extend .nowrap;
}
.header-time {
padding-left: $padding;
font-size: $title-size-sm - 2;
color: $text-gray;
}
}
.mssage-msg {
font-size: $title-size-sm - 2;
color: $text-gray;
@extend .nowrap;
}
} }
} }
&-item:last-child { .content {
.mssage-action::after { margin-left: 16rpx;
display: none; flex: 1;
.header {
display: flex;
justify-content: space-between;
.name {
font-size: 36rpx
}
.time {
font-size: 24rpx;
color: $text-gray;
}
}
.preview {
width: 520rpx;
word-break: break-all;
color: $text-gray;
font-size: 26rpx;
@extend .nowrap;
}
}
}
.message:not(:last-child) {
&::after {
position: absolute;
left: $padding + 108;
right: 0;
bottom: 0;
content: " ";
height: 1rpx;
background: $border-color;
}
}
}
/* 遮罩 */
.shade {
.pop {
position: fixed;
z-index: 101;
width: 200rpx;
box-sizing: border-box;
font-size: 28rpx;
text-align: left;
color: #333;
background-color: #fff;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
line-height: 80rpx;
transition: transform 0.15s ease-in-out 0s;
user-select: none;
-webkit-touch-callout: none;
transform: scale(0, 0);
&.show {
transform: scale(1, 1);
}
&>view {
padding: 0 20rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
user-select: none;
-webkit-touch-callout: none;
&:active {
background-color: #f3f3f3;
} }
} }
} }

52
pages/im/private/index.vue
View File

@@ -1,11 +1,9 @@
<template> <template>
<view class="chat-content"> <view class="chat-content">
<scroll-view class="chat-scrool" :scroll-y="true" :scroll-into-view="scrollIntoID" :scroll-with-animation="false"> <scroll-view class="chat-scrool" :scroll-y="true" :scroll-into-view="scrollIntoID"
:scroll-with-animation="false">
<!-- 聊天窗口 --> <!-- 聊天窗口 -->
<view class="chat-item" v-for="(item,index) in messages" :key="index" :id="'chatId_'+index"> <view class="chat-item" v-for="(item,index) in messages" :key="index">
<view class="chat-item-time">
<text>{{ item.sentTime|timeCustomCN }}</text>
</view>
<view class="chat-item-article" :class="item.messageDirection == 1 ? 'right' : 'left'"> <view class="chat-item-article" :class="item.messageDirection == 1 ? 'right' : 'left'">
<view class="chat-msg"> <view class="chat-msg">
<view class="chat-msg-text">{{ item.content.content }}</view> <view class="chat-msg-text">{{ item.content.content }}</view>
@@ -14,18 +12,22 @@
<view class="chat-status" :class="{'hide': item.sentStatus == 50}" <view class="chat-status" :class="{'hide': item.sentStatus == 50}"
v-if="item.messageDirection == 1">{{ item.sentStatus == 50 ? '已读': '未读'}}</view> v-if="item.messageDirection == 1">{{ item.sentStatus == 50 ? '已读': '未读'}}</view>
<view class="chat-avatar"> <view class="chat-avatar">
<!-- <u-avatar :src="userInfo.portraitUrl" @click="showFriend"></u-avatar> --> <u-avatar v-if="item.messageDirection == 2" bg-color="#ffffff" :src="userInfo.portraitUrl"
<u-avatar v-if="item.messageDirection == 2" :src="friend(targetId).portraitUrl"></u-avatar> @click="showFriend(targetId)"></u-avatar>
<u-avatar v-else :src="$store.getters.sender.portraitUrl"/> <u-avatar v-else @click="showMine" bg-color="#ffffff"
:src="$store.getters.sender.portraitUrl" />
</view> </view>
</view> </view>
</view> <view class="chat-item-time" :id="'chatId_'+index">
<text>{{ item.sentTime|timeCustomCN }}</text>
</view>
</view>
</scroll-view> </scroll-view>
<view class="chat-footer"> <view class="chat-footer">
<input class="chat-input" type="text" v-model="inputTxt" confirm-type="发送" @confirm="send" <input class="chat-input" type="text" v-model="inputTxt" confirm-type="发送" @confirm="send"
cursor-spacing="10" /> cursor-spacing="10" />
<button class="chat-push" size="mini" @click="send">发送</button> <button class="chat-push" :disabled="disabled" size="mini" @click="send">发送</button>
</view> </view>
</view> </view>
</template> </template>
@@ -85,8 +87,8 @@
RongIMLib.clearReadReceiptReceivedListener() RongIMLib.clearReadReceiptReceivedListener()
}, },
computed: { computed: {
showSendButton() { disabled() {
return this.inputTxt.length > 0 return this.inputTxt.length == 0
}, },
friend() { friend() {
return function(targetId) { return function(targetId) {
@@ -98,7 +100,13 @@
if (e.index == 0) { if (e.index == 0) {
uni.navigateTo({ uni.navigateTo({
url: '/pages/im/private/setting?targetId=' + this.targetId + url: '/pages/im/private/setting?targetId=' + this.targetId +
'&conversationType=' + this.conversationType '&conversationType=' + this.conversationType,
events: {
messageClear: () => {
this.getMessageList()
console.log('聊天消息被清空');
}
}
}) })
} }
}, },
@@ -151,15 +159,15 @@
this.inputTxt = '' this.inputTxt = ''
}) })
}, },
showFriend() { showFriend(targetId) {
// uni.navigateTo({ uni.navigateTo({
// url: '/pages/im/friends/info?targetId=' + this.targetId url: '/pages/im/friends/info?targetId=' + targetId
// }) })
}, },
showMine() { showMine() {
// uni.navigateTo({ uni.navigateTo({
// url: '/pages/im/friends/mine' url: '/pages/im/friends/mine'
// }) })
}, },
scrollBottom() { scrollBottom() {
this.$nextTick(function() { this.$nextTick(function() {
@@ -310,6 +318,10 @@
font-size: $title-size-m; font-size: $title-size-m;
font-weight: bold; font-weight: bold;
&[disabled] {
background: $uni-bg-color-grey;
}
&::after { &::after {
display: none; display: none;
} }

207
pages/im/private/setting.vue
View File

@@ -1,46 +1,56 @@
<template> <template>
<view class="content"> <view class="content">
<!-- 聊天信息 --> <!-- 聊天信息 -->
<view class="set-user"> <view class="set-user" @click="showFriend">
<u-avatar <u-avatar :src="friend(targetId).portraitUrl" size="48"></u-avatar>
src="https://cdn.uviewui.com/uview/album/1.jpg" <view class="set-user-nickname">{{ friend(targetId).name }}</view>
size="48" </view>
></u-avatar> <!-- 聊天设置 -->
<view class="set-user-nickname">唐明明</view> <view class="set-group">
</view> <view class="group-flex">
<!-- 聊天设置 --> <label>消息免打扰</label>
<view class="set-group"> <u-switch v-model="status" activeColor="#34CE98" size="22" @change="setStatus"></u-switch>
<view class="group-flex"> </view>
<label>消息免打扰</label> <view class="group-flex">
<u-switch activeColor="#34CE98" size="22"></u-switch> <label>消息置顶</label>
</view> <u-switch v-model="isTop" activeColor="#34CE98" size="22" @change="setTop"></u-switch>
<view class="group-flex"> </view>
<label>置顶会话</label> </view>
<u-switch v-model="isTop" activeColor="#34CE98" size="22"></u-switch> <view class="set-group">
</view> <view class="group-flex" @click="cleanConversation">
</view> <label>清空聊天记录</label>
<view class="set-group"> <u-icon name="arrow-right" color="#999" size="16"></u-icon>
<view class="group-flex" @click="cleanConversation"> </view>
<label>清空聊天记录</label> </view>
<u-icon name="arrow-right" color="#999" size="16"></u-icon> </view>
</view>
</view>
</view>
</template> </template>
<script> <script>
import * as RongIMLib from '@rongcloud/imlib-uni' import * as RongIMLib from '@rongcloud/imlib-uni'
import {
getUserInfo
} from '@/apis/interfaces/im.js'
export default { export default {
data() { data() {
return { return {
eventChannel: null,
targetId: '', targetId: '',
conversationType: 1, conversationType: 1,
isTop: false, isTop: false,
status: 0 // 0 是免打扰，1是正常通知 status: false // 0 是免打扰，1是正常通知
}
},
computed: {
friend() {
return function(targetId) {
return this.$store.getters.userInfo(targetId)
}
} }
}, },
onLoad(e) { onLoad(e) {
this.eventChannel = this.$scope.eventChannel
this.targetId = e.targetId this.targetId = e.targetId
this.conversationType = e.conversationType this.conversationType = e.conversationType
@@ -53,83 +63,104 @@
RongIMLib.getConversationNotificationStatus(this.conversationType, this.targetId, ({ RongIMLib.getConversationNotificationStatus(this.conversationType, this.targetId, ({
status status
}) => { }) => {
this.status = status this.status = !Boolean(status)
}) })
}, },
methods: { methods: {
showFriend() {
uni.navigateTo({
url: '/pages/im/friends/info?targetId=' + this.targetId
})
},
setStatus() { setStatus() {
RongIMLib.setConversationNotificationStatus(this.conversationType, this.targetId, this.status, ({ RongIMLib.setConversationNotificationStatus(this.conversationType, this.targetId, this.status, ({
status status
}) => { }) => {
this.status = status this.status = !Boolean(status)
}) })
}, },
setTop() { setTop() {
RongIMLib.setConversationToTop(this.conversationType, this.targetId, !this.isTop, (res) => { RongIMLib.setConversationToTop(this.conversationType, this.targetId, this.isTop, (res) => {
console.log(res);
RongIMLib.getConversation(this.conversationType, this.targetId, ({ RongIMLib.getConversation(this.conversationType, this.targetId, ({
conversation conversation
}) => { }) => {
console.log(conversation.isTop);
this.isTop = conversation.isTop this.isTop = conversation.isTop
}) })
}) })
}, },
// 清空聊天记录 // 清空聊天记录
cleanConversation() { cleanConversation() {
RongIMLib.deleteMessages(this.conversationType, this.targetId, ({code}) => { uni.showModal({
if (code === 0) { title: '清空聊天记录',
console.log('chenggong '); success: (res) => {
} if (res.confirm) {
}) RongIMLib.deleteMessages(this.conversationType, this.targetId, ({
code
}) => {
if (code === 0) {
this.eventChannel.emit('messageClear')
uni.showToast({
title: '聊天记录已清空'
})
}
})
}
}
})
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.content{ .content {
min-height: 100vh; min-height: 100vh;
background: $window-color; background: $window-color;
// 用户信息
.set-user{ // 用户信息
background: white; .set-user {
padding: $padding; background: white;
display: flex; padding: $padding;
align-items: center; display: flex;
.set-user-nickname{ align-items: center;
padding-left: $padding;
flex: 1; .set-user-nickname {
line-height: 70rpx; padding-left: $padding;
font-size: $title-size + 6; flex: 1;
} line-height: 70rpx;
} font-size: $title-size + 6;
// 聊天设置 }
.set-group{ }
margin: $margin 0;
background: white; // 聊天设置
.group-flex{ .set-group {
position: relative; margin: $margin 0;
display: flex; background: white;
justify-content: space-between;
height: 90rpx; .group-flex {
line-height: 90rpx; position: relative;
padding: 0 $padding; display: flex;
font-size: $title-size; justify-content: space-between;
align-items: center; height: 90rpx;
&::after{ line-height: 90rpx;
content: " "; padding: 0 $padding;
position: absolute; font-size: $title-size;
left: $margin; align-items: center;
right: 0;
bottom: 0; &::after {
height: 1rpx; content: " ";
background-color: $border-color; position: absolute;
} left: $margin;
&:last-child::after{ right: 0;
display: none; bottom: 0;
} height: 1rpx;
} background-color: $border-color;
} }
}
&:last-child::after {
display: none;
}
}
}
}
</style> </style>

594
pages/topic/details.vue
View File

@@ -1,282 +1,314 @@
<template> <template>
<view class="content"> <view class="content">
<view class="backCont"> <view class="backCont">
<image class="img" :src="topicData.cover" mode="aspectFill"></image> <image class="img" :src="topicData.cover" mode="aspectFill"></image>
<view class="head"> <view class="head">
<view class="ios-top"></view> <view class="ios-top"></view>
<view class="ellipsis title"> <view class="ellipsis title">
{{ topicData.name }} {{ topicData.name }}
</view> </view>
<view class="tips" v-if="topicData.category"> <view class="tips" v-if="topicData.category">
# 话题 -- {{ topicData.category.name }} # # 话题 -- {{ topicData.category.name }} #
</view> </view>
<view class="ellipsis text"> <view class="ellipsis text">
{{ topicData.description }} {{ topicData.description }}
</view> </view>
<view class="tool"> <view class="tool">
<view class="tool-see"> <view class="tool-see">
<text>{{ topicData.clicks }} 人游览</text> <text>{{ topicData.clicks }} 人游览</text>
<text>{{ topicData.favorites }} 人点赞</text> <text>{{ topicData.favorites }} 人点赞</text>
</view> </view>
<view class="tool-btn" :class="{active : isFavorite}" @click="thumbClick(topicData.topic_id)"> <view class="tool-btn" :class="{active : isFavorite}" @click="thumbClick(topicData.topic_id)">
<u-icon name="thumb-up-fill" :color="isFavorite ? '#333': '#fff'" size="17" style="margin-right: 5rpx;"></u-icon> <u-icon name="thumb-up-fill" :color="isFavorite ? '#333': '#fff'" size="17"
{{ isFavorite ? '已赞' : '点赞' }} style="margin-right: 5rpx;"></u-icon>
</view> {{ isFavorite ? '已赞' : '点赞' }}
</view> </view>
</view> </view>
<view class="brief"> </view>
<view class="source"> <view class="brief">
<image class="source-logo" src="/static/find/logo.png" mode="aspectFill"></image> <view class="source">
<view class="source-title"> <image class="source-logo" src="/static/find/logo.png" mode="aspectFill"></image>
<view class="source-name"> <view class="source-title">
{{ topicData.author }} <view class="source-name">
</view> {{ topicData.author }}
<view class="source-text"> </view>
ZH大健康官方账号 <view class="source-text">
</view> ZH大健康官方账号
</view> </view>
</view> </view>
<view class="brief-text"> </view>
<rich-text :nodes="topicContent"></rich-text> <view class="brief-text">
</view> <rich-text :nodes="topicContent"></rich-text>
<view class="goods" v-if="goodsArr.length > 0"> </view>
<view class="title"> <view class="goods" v-if="goodsArr.length > 0">
相关商品 <view class="title">
</view> 相关商品
<view class="item" v-for="(item, index) in goodsArr" :key="index"> </view>
<image class="item-cover" src="http://api.zh.shangkelian.cn/storage/images/2022/01/06/fc143605e2a1557989e96652d990579f.png" mode="aspectFill"></image> <view class="item" v-for="(item, index) in goodsArr" :key="index">
<view class="item-title"> <image class="item-cover"
<view class="nowrap item-name"> src="http://api.zh.shangkelian.cn/storage/images/2022/01/06/fc143605e2a1557989e96652d990579f.png"
{{ item.name }} mode="aspectFill"></image>
</view> <view class="item-title">
<view class="item-price"> <view class="nowrap item-name">
￥{{ item.price }} {{ item.name }}
</view> </view>
</view> <view class="item-price">
<view class="item-btn" @click="$Router.push({ name: 'StoreGoods', params: {id: item.goods_id}})"> ￥{{ item.price }}
查看商品 </view>
</view> </view>
</view> <view class="item-btn"
</view> @click="$Router.push({ name: 'StoreGoods', params: {id: item.goods_id}})">
</view> 查看商品
</view> </view>
</view> </view>
</template> </view>
</view>
<script> </view>
import { topicDet, topicThumb } from '@/apis/interfaces/topic' </view>
import userAuth from '@/public/userAuth' </template>
export default {
data() { <script>
return { import {
topicData : '', topicDet,
goodsArr : [], topicThumb
topicContent: '', } from '@/apis/interfaces/topic'
isFavorite : '' import userAuth from '@/public/userAuth'
} export default {
}, data() {
mounted() { return {
this.getRank() topicData: '',
}, goodsArr: [],
methods: { topicContent: '',
// 详情 isFavorite: ''
getRank(){ }
topicDet(this.$Route.query.id).then(res => { },
uni.setNavigationBarTitle({ mounted() {
title: res.name this.getRank()
}) },
this.topicData = res methods: {
this.goodsArr = res.goods // 详情
this.isFavorite = res.is_favorite getRank() {
this.topicContent = res.content.replace(/\<img/gi, '<img style="max-width:100%;height:auto;display:block;"') topicDet(this.$Route.query.id).then(res => {
}) uni.setNavigationBarTitle({
}, title: res.name
})
// 点赞 this.topicData = res
thumbClick(id) { this.goodsArr = res.goods
if(this.$store.state.token === ''){ this.isFavorite = res.is_favorite
const Auth = new userAuth() this.topicContent = res.content.replace(/\<img/gi,
Auth.Login() '<img style="max-width:100%;height:auto;display:block;"')
return })
} },
topicThumb(id).then(res => { // 点赞
this.isFavorite = !this.isFavorite thumbClick(id) {
}) if (this.$store.state.token === '') {
} const Auth = new userAuth()
} Auth.Login()
}; return
</script> }
topicThumb(id).then(res => {
<style lang="scss" scoped> this.isFavorite = !this.isFavorite
page {
background: $window-color; this.topicData.favorites = res
} })
}
.backCont { }
position: relative; };
width: 100vw; </script>
padding-top: 90%;
&::after { <style lang="scss" scoped>
position: absolute; page {
content: ''; background: $window-color;
left: 0; }
top: 0;
width: 100%; .backCont {
height: 100%; position: relative;
z-index: 2; width: 100vw;
background-color: rgba($color: #000000, $alpha: .35); padding-top: 90%;
}
.img { &::after {
position: absolute; position: absolute;
left: 0; content: '';
top: 0; left: 0;
width: 100%; top: 0;
height: 100%; width: 100%;
z-index: 1; height: 100%;
filter: blur(10rpx); z-index: 2;
overflow: hidden; background-color: rgba($color: #000000, $alpha: .35);
} }
.head {
padding: $padding * 3 $padding + 30 0; .img {
color: white; position: absolute;
box-sizing: border-box; left: 0;
position: absolute; top: 0;
left: 0; width: 100%;
top: 0; height: 100%;
width: 100%; z-index: 1;
z-index: 9; filter: blur(10rpx);
.title { overflow: hidden;
font-size: $title-size + 8; }
margin-bottom: $margin - 10;
height: 100rpx; .head {
font-weight: 600; padding: $padding * 3 $padding + 30 0;
} color: white;
.tips { box-sizing: border-box;
margin-bottom: $margin + 20; position: absolute;
} left: 0;
.text { top: 0;
margin: $margin 0 $margin + 10; width: 100%;
line-height: 48rpx; z-index: 9;
height: 100rpx;
font-size: $title-size-lg; .title {
} font-size: $title-size + 8;
.tool { margin-bottom: $margin - 10;
width: 100%; height: 100rpx;
font-size: $title-size-m; font-weight: 600;
display: flex; }
line-height: 48rpx;
.tool-see { .tips {
flex: 1; margin-bottom: $margin + 20;
text { }
padding-right: $padding;
} .text {
} margin: $margin 0 $margin + 10;
.tool-btn { line-height: 48rpx;
border: 2rpx solid white; height: 100rpx;
border-radius: $radius * 2; font-size: $title-size-lg;
font-size: $title-size-sm; }
padding: 0 $padding - 5;
line-height: 48rpx; .tool {
display: flex; width: 100%;
&.active { font-size: $title-size-m;
background-color: white; display: flex;
color: $text-color; line-height: 48rpx;
}
} .tool-see {
} flex: 1;
}
} text {
padding-right: $padding;
.brief { }
position: absolute; }
top: 90%;
width: 100%; .tool-btn {
z-index: 10; border: 2rpx solid white;
background-color: white; border-radius: $radius * 2;
border-radius: $radius * 3 $radius * 3 0 0; font-size: $title-size-sm;
padding: $padding; padding: 0 $padding - 5;
box-sizing: border-box; line-height: 48rpx;
.brief-text { display: flex;
margin: $margin 0;
line-height: 48rpx; &.active {
font-size: $title-size-lg; background-color: white;
color: $text-color; color: $text-color;
padding: 0 $padding - 20; }
box-sizing: border-box; }
} }
.source { }
position: relative; }
.source-logo {
width: 70rpx; .brief {
height: 70rpx; position: absolute;
border-radius: 50%; top: 90%;
margin-top: $margin - 24; width: 100%;
} z-index: 10;
.source-title { background-color: white;
position: absolute; border-radius: $radius * 3 $radius * 3 0 0;
left: 0; padding: $padding;
top: 0; box-sizing: border-box;
width: 100%;
padding-left: 90rpx; .brief-text {
box-sizing: border-box; margin: $margin 0;
font-size: $title-size-lg; line-height: 48rpx;
.source-name { font-size: $title-size-lg;
font-weight: 600; color: $text-color;
margin-bottom: $margin - 25; padding: 0 $padding - 20;
} box-sizing: border-box;
.source-text { }
line-height: 48rpx;
font-size: $title-size-m; .source {
color: $text-gray-m; position: relative;
}
} .source-logo {
} width: 70rpx;
} height: 70rpx;
border-radius: 50%;
.goods { margin-top: $margin - 24;
margin-top: $margin; }
.title {
font-weight: bold; .source-title {
font-size: $title-size; position: absolute;
} left: 0;
.item { top: 0;
position: relative; width: 100%;
margin-top: $margin - 10; padding-left: 90rpx;
background: #f5fdfa; box-sizing: border-box;
border-radius: $radius; font-size: $title-size-lg;
padding: $padding;
box-sizing: border-box; .source-name {
.item-cover { font-weight: 600;
width: 120rpx; margin-bottom: $margin - 25;
height: 90rpx; }
border-radius: $radius-m;
} .source-text {
.item-title { line-height: 48rpx;
position: absolute; font-size: $title-size-m;
left: 0; color: $text-gray-m;
top: 0; }
width: calc(100% - 180rpx); }
box-sizing: border-box; }
padding: $padding $padding 0 180rpx; }
font-size: $title-size-lg;
margin-bottom: 10px; .goods {
color: $text-color; margin-top: $margin;
.item-price {
color: $text-price; .title {
margin-top: $margin - 20; font-weight: bold;
} font-size: $title-size;
} }
.item-btn {
position: absolute; .item {
right: $padding; position: relative;
top: $padding + 20; margin-top: $margin - 10;
background-color: $main-color; background: #f5fdfa;
color: white; border-radius: $radius;
line-height: 62rpx; padding: $padding;
font-size: $title-size-m; box-sizing: border-box;
padding: 0 $padding - 10;
border-radius: $radius-m; .item-cover {
} width: 120rpx;
} height: 90rpx;
} border-radius: $radius-m;
}
.item-title {
position: absolute;
left: 0;
top: 0;
width: calc(100% - 180rpx);
box-sizing: border-box;
padding: $padding $padding 0 180rpx;
font-size: $title-size-lg;
margin-bottom: 10px;
color: $text-color;
.item-price {
color: $text-price;
margin-top: $margin - 20;
}
}
.item-btn {
position: absolute;
right: $padding;
top: $padding + 20;
background-color: $main-color;
color: white;
line-height: 62rpx;
font-size: $title-size-m;
padding: 0 $padding - 10;
border-radius: $radius-m;
}
}
}
</style> </style>

23
store/modules/im.js
View File

@@ -4,12 +4,17 @@ export default {
state: { state: {
newMsg: {}, newMsg: {},
friends: {}, friends: {},
sender: {} sender: {},
// IM连接状态，0是正常
connection: 0
}, },
getters: { getters: {
newMessage(state) { newMessage(state) {
return state.newMsg return state.newMsg
}, },
connection(state) {
return state.connection
},
friends(state) { friends(state) {
return state.friends return state.friends
}, },
@@ -17,8 +22,8 @@ export default {
if (state.friends[targetId]) { if (state.friends[targetId]) {
return state.friends[targetId] return state.friends[targetId]
} else { } else {
console.log('没找到,， 死循环了，得处理 todo', targetId); console.log('没找到,死循环了，得处理 todo', targetId);
im.syncUserInfo(targetId) // im.syncUserInfo(targetId)
return { return {
name: '', name: '',
address: '', address: '',
@@ -43,9 +48,15 @@ export default {
}, },
SET_state_sender(state, userInfo) { SET_state_sender(state, userInfo) {
state.sender = userInfo state.sender = userInfo
},
SET_connection_status(state, status) {
state.connection = status
} }
}, },
actions: { actions: {
updateConnectionStatus({commit}, status) {
commit('SET_connection_status', status)
},
newMessage({ newMessage({
commit commit
}, msg) { }, msg) {
@@ -63,7 +74,6 @@ export default {
const model = uni.model.friendModel const model = uni.model.friendModel
model.find('userId=' + userInfo.userId, (err, user) => { model.find('userId=' + userInfo.userId, (err, user) => {
if (!err && user.length == 0) { if (!err && user.length == 0) {
console.log('哪里更新的 ', 1);
saveAvatar(userInfo, (savedFilePath) => { saveAvatar(userInfo, (savedFilePath) => {
model.insert({ model.insert({
userId: userInfo.userId, userId: userInfo.userId,
@@ -76,7 +86,6 @@ export default {
commit('updateFriends', userInfo) commit('updateFriends', userInfo)
}) })
} else if (!err && user[0].hash != userInfo.hash) { } else if (!err && user[0].hash != userInfo.hash) {
console.log('哪里更新的 ', 2);
saveAvatar(userInfo, (savedFilePath) => { saveAvatar(userInfo, (savedFilePath) => {
model.update('userId=' + userInfo.userId, { model.update('userId=' + userInfo.userId, {
name: userInfo.name, name: userInfo.name,
@@ -98,7 +107,7 @@ export default {
commit('updateFriends', userInfo) commit('updateFriends', userInfo)
}) })
} else { } else {
console.log('不需要有动作', user[0]); console.log('不用操作', user[0]);
} }
}) })
} }

2
uni.scss
View File

@@ -44,7 +44,7 @@ $uni-border-color:#c8c7cc;
/* 文字尺寸 */ /* 文字尺寸 */
$uni-font-size-sm:12px; $uni-font-size-sm:12px;
$uni-font-size-base:14px; $uni-font-size-base:14px;
$uni-font-size-lg:16; $uni-font-size-lg:16px;
/* 图片尺寸 */ /* 图片尺寸 */
$uni-img-size-sm:20px; $uni-img-size-sm:20px;

9
utils/im/index.js
View File

@@ -36,9 +36,11 @@ const setNotifyBadge = (count) => {
* @param {string} token token * @param {string} token token
* @param {object} userInfo {userId: string, name: string, portraitUrl: string} * @param {object} userInfo {userId: string, name: string, portraitUrl: string}
*/ */
const connect = (token, userInfo) => { const connect = (token, userInfo, callback) => {
RongIMLib.connect(token, res => { RongIMLib.connect(token, res => {
console.log('连接结果', res); console.log('连接结果', res);
callback(res)
}) })
store.dispatch('setSenderInfo', userInfo) store.dispatch('setSenderInfo', userInfo)
@@ -61,7 +63,8 @@ const disconnect = () => {
const addListeners = () => { const addListeners = () => {
// 添加连接状态监听函数 // 添加连接状态监听函数
RongIMLib.addConnectionStatusListener((res) => { RongIMLib.addConnectionStatusListener((res) => {
console.log('连接状态监', res.data.status); console.log('连接状态监', res.data.status);
store.dispatch('updateConnectionStatus', res.data.status)
}) })
// 添加消息监听函数 // 添加消息监听函数
RongIMLib.addReceiveMessageListener((res) => { RongIMLib.addReceiveMessageListener((res) => {