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

好友管理的基础流程，1.0.5

Browse Source
This commit is contained in:
Jason.Chen
2022-01-21 16:30:06 +08:00
parent 21bee49729
commit 80cd737e39
10 changed files with 378 additions and 205 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -7,89 +7,69 @@
</view>
<u-line></u-line>
<view class="list__item" @click="showToast">
<u-avatar size="35" icon="account-fill" fontSize="26" bg-color="#4cd964"></u-avatar>
<u-avatar size="35" icon="account-fill" fontSize="26" bg-color="#4cd964"></u-avatar>
<text class="list__item__user-name">我的群聊</text>
</view>
<u-line></u-line>
</view>
<block v-if="friendsArr.length > 0">
<u-index-list activeColor="#34CE98">
<template v-for="(item, index) in friendsArr">
<!-- #ifdef APP-NVUE -->
<u-index-anchor bgColor="#F3F6FB" color="#666" :text="indexList[index]" :key="index"></u-index-anchor>
<!-- #endif -->
<u-index-item :key="index">
<!-- #ifndef APP-NVUE -->
<u-index-anchor :text="indexList[index]" bgColor="#F3F6FB" color="#666"></u-index-anchor>
<!-- #endif -->
<view class="list" v-for="(item1, index1) in item" :key="index1">
<view class="list__item" @click="toInfo(10047)">
<image class="list__item__avatar" :src="item1.url"></image>
<!-- <u-avatar size="35" icon="chrome-circle-fill" fontSize="26" randomBgColor></u-avatar> -->
<text class="list__item__user-name">{{item1.name}}</text>
</view>
<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>
<block v-if="friends.length > 0">
<u-list height="auto">
<u-list-item v-for="(item, index) in friends" :key="index">
<u-cell :title="item.name + item.userId" @click="toInfo(item.userId)">
<u-avatar slot="icon" shape="square" size="35" :src="item.portraitUrl"></u-avatar>
</u-cell>
</u-list-item>
</u-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>
</template>
<script>
import { getFriends } from '@/apis/interfaces/im'
<script>
import {
getFriends
} from '@/apis/interfaces/im'
export default {
data() {
return {
friendsArr: []
friends: []
}
},
onShow() {
getFriends().then(res => {
this.friendsArr = res
console.log(res)
})
},
},
onShow() {
getFriends().then(res => {
this.friends = res
})
},
computed: {
},
methods: {
// 扫码提示
showToast(){
uni.showToast({
title: "群聊功能暂未开放，敬请期待",
icon : "none"
})
},
// 新朋友
methods: {
// 扫码提示
showToast() {
uni.showToast({
title: "群聊功能暂未开放，敬请期待",
icon: "none"
})
},
// 新朋友
toPending() {
uni.navigateTo({
url: '/pages/im/friends/pending'
})
},
// 用户资料
},
// 用户资料
toInfo(targetId) {
uni.navigateTo({
url: '/pages/im/friends/info?targeId=' + targetId
url: '/pages/im/friends/info?targetId=' + targetId
})
}
},
onNavigationBarButtonTap(e) {
this.toPending()
}
},
onNavigationBarButtonTap(e) {
this.toPending()
}
}
</script>
@@ -99,27 +79,30 @@
@include flex;
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;
}
}
// 页面空
.pages-null {
height: 70vh;
}
</style>