This commit is contained in:
2022-02-22 17:20:58 +08:00
2 changed files with 71 additions and 28 deletions

View File

@@ -6,8 +6,15 @@
:disabled="true" :show-action="false" />
</view>
</u-sticky>
<view v-for="(item, index) in pendings" :key="index">
<apply-cell :message="item.latestMessage" @success="getPendingList" />
<block v-if="pendings.length > 0">
<view v-for="(item, index) in pendings" :key="index">
<apply-cell :message="item.latestMessage" @success="getPendingList" />
</view>
</block>
<view class="no-lists" v-else>
<u-image class="cover" radius="4" width="400rpx" height="400rpx"
:src="require('@/static/imgs/no-friend.png')" :lazy-load="true" />
<span> 暂无好友申请 ~</span>
</view>
</view>
</template>
@@ -15,14 +22,15 @@
<script>
import applyCell from '../components/friendApplyCell'
import im from '@/utils/im/index.js'
export default {
components: {
applyCell
},
data() {
return {
pendings: []
pendings: [],
bg: '#fff'
}
},
onLoad() {
@@ -31,7 +39,12 @@
},
methods: {
getPendingList() {
im.getPendingList((pendings) => {
im.getPendingList((pendings) => {
if (pendings.length > 0) {
this.bg = '#f9f9f9'
} else {
this.bg = '#fff'
}
this.pendings = pendings
})
}
@@ -45,18 +58,18 @@
background: $window-color;
}
.no-lists {
padding-top: $padding * 3;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-sizing: border-box;
font-size: $title-size-m;
color: $text-gray-m;
span {
padding-top: $padding;
}
.no-lists {
padding-top: $padding * 5;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-sizing: border-box;
font-size: $title-size-m;
color: $text-gray-m;
span {
padding-top: $padding;
}
}
</style>

View File

@@ -1,13 +1,20 @@
<template>
<view class="group">
<view class="title"> 群聊 </view>
<view v-for="(item, index) in groups" :key="index" class="friend-flex" @click="toGroup(item.targetId)">
<u-avatar size="38" shape="square" :src="contact(item.targetId).portraitUrl" />
<view class="info">
<view class="name">{{ item.name }}</view>
<view class="group" :style="`background-color:${bg};`">
<block v-if="groups.length > 0">
<view class="title"> 群聊 </view>
<view v-for="(item, index) in groups" :key="index" class="friend-flex" @click="toGroup(item.targetId)">
<u-avatar size="38" shape="square" :src="contact(item.targetId).portraitUrl" />
<view class="info">
<view class="name">{{ item.name }}</view>
</view>
</view>
<view class="group-count"> {{groups.length}}个群聊 </view>
</block>
<view class="no-lists" v-else>
<u-image class="cover" radius="4" width="400rpx" height="400rpx"
:src="require('@/static/imgs/no-friend.png')" :lazy-load="true" />
<span>空空如也~</span>
</view>
<view class="group-count"> {{groups.length}}个群聊 </view>
<u-modal negativeTop="300" :show="createModal" title="创建群聊" showCancelButton @cancel="onHideModal"
@confirm="onCreateGroup">
<view class="slot-content">
@@ -28,7 +35,8 @@
return {
groups: [],
createModal: false,
groupName: ''
groupName: '',
bg: '#fff'
}
},
computed: {
@@ -48,6 +56,11 @@
methods: {
initData() {
getMyGroups().then((res) => {
if (res.length > 0) {
this.bg = '#f9f9f9'
} else {
this.bg = '#fff'
}
this.groups = res
res.map(item => {
this.$store.dispatch('updateContact', item)
@@ -88,12 +101,14 @@
.group {
min-height: 100vh;
background-color: $window-color;
.title{
.title {
font-size: $title-size-m;
color: $text-gray-m;
padding: 10rpx $padding;
}
.group-count{
.group-count {
text-align: center;
font-size: $title-size;
color: $text-gray;
@@ -130,4 +145,19 @@
}
}
}
.no-lists {
padding-top: $padding * 5;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-sizing: border-box;
font-size: $title-size-m;
color: $text-gray-m;
span {
padding-top: $padding;
}
}
</style>