Files
PetCommunity/miniprogram/pages/friends/friends.wxml
2026-06-05 17:46:51 +08:00

67 lines
2.4 KiB
Plaintext

<view class="friends-page">
<view class="safe-top" style="height: {{statusBarHeight}}px"></view>
<view class="topbar">
<view class="topbar-logo">汪<text class="logo-accent">友</text></view>
<view class="topbar-tabs">
<view class="ftab {{activeTab === 'following' ? 'ftab-active' : ''}}" bindtap="switchTab" data-tab="following">
关注 <text class="ftab-count">{{followingCount}}</text>
</view>
<view class="ftab {{activeTab === 'followers' ? 'ftab-active' : ''}}" bindtap="switchTab" data-tab="followers">
粉丝 <text class="ftab-count">{{followersCount}}</text>
</view>
</view>
<view class="topbar-btn" bindtap="onFindFriends">+</view>
</view>
<!-- 空态 -->
<view wx:if="{{!loading && list.length === 0}}" class="empty-wrap">
<view class="empty-inner">
<text class="empty-emoji">🐾</text>
<text class="empty-title">还没有{{activeTab === 'following' ? '关注' : '粉丝'}}</text>
<text class="empty-desc">去附近认识新朋友,一起遛狗打卡吧</text>
<view class="btn-primary go-btn" bindtap="onGoNearby">去附近找</view>
</view>
</view>
<!-- 列表 -->
<scroll-view
wx:else
scroll-y="true"
class="friends-scroll"
enhanced="true"
show-scrollbar="false"
refresher-enabled="true"
bindrefresherrefresh="onRefresh"
refresher-triggered="{{refreshing}}"
>
<view
wx:for="{{list}}"
wx:key="_id"
class="friend-item"
bindtap="onItemTap"
data-uid="{{item._id}}"
>
<view class="friend-avatar" style="background: {{item.gradient}}">
<text>{{item.nickName[0]}}</text>
</view>
<view class="friend-info">
<view class="friend-name-row">
<text class="friend-name">{{item.nickName}}</text>
<view wx:if="{{item.isOnline}}" class="online-tag">在线</view>
</view>
<text class="friend-bio">{{item.pets[0] ? item.pets[0].emoji + ' ' + item.pets[0].name + ' · ' + item.pets[0].breed : item.bio || '宠物爱好者'}}</text>
</view>
<view
class="follow-btn {{activeTab === 'following' ? 'following' : ''}}"
catchtap="onFollowTap"
data-uid="{{item._id}}"
>
{{activeTab === 'following' ? '已关注' : '关注'}}
</view>
</view>
<view style="height: {{tabBarHeight}}px"></view>
</scroll-view>
</view>