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

好友列表，统一风格

Browse Source
This commit is contained in:
Jason.Chen
2022-01-24 09:23:11 +08:00
parent a30f2f9bd0
commit 33b4fb304d
2 changed files with 25 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,17 +1,20 @@
<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>
</u-list-item>
</u-list>
<block v-if="friends.length > 0"> <block v-if="friends.length > 0">
<u-list height="auto"> <u-list height="auto">
<u-list-item v-for="(item, index) in friends" :key="index"> <u-list-item v-for="(item, index) in friends" :key="index">
@@ -74,33 +77,6 @@
</script> </script>
<style lang="scss"> <style lang="scss">
.list {
&__item {
@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 { .pages-null {
height: 70vh; height: 70vh;

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

@@ -14,7 +14,8 @@
<view class="chat-avatar"> <view class="chat-avatar">
<u-avatar v-if="item.messageDirection == 2" bg-color="#ffffff" :src="userInfo.portraitUrl" <u-avatar v-if="item.messageDirection == 2" bg-color="#ffffff" :src="userInfo.portraitUrl"
@click="showFriend(targetId)"></u-avatar> @click="showFriend(targetId)"></u-avatar>
<u-avatar v-else @click="showMine" bg-color="#ffffff" :src="$store.getters.sender.portraitUrl" /> <u-avatar v-else @click="showMine" bg-color="#ffffff"
:src="$store.getters.sender.portraitUrl" />
</view> </view>
</view> </view>
<view class="chat-item-time" :id="'chatId_'+index"> <view class="chat-item-time" :id="'chatId_'+index">
@@ -26,7 +27,7 @@
<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>
@@ -51,7 +52,7 @@
} }
} }
}, },
onLoad(e) { onLoad(e) {
this.targetId = e.targetId this.targetId = e.targetId
this.conversationType = e.conversationType // 会话类型 this.conversationType = e.conversationType // 会话类型
// 消息总数量 // 消息总数量
@@ -86,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) {
@@ -317,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;
} }