<!--packageF/wxFriendExtend/friendRanking/friendRanking.wxml-->

<view class="rank-wrap size-con" style="--bgColor: {{details.bg_color}};">

  <!-- 头部用户信息 -->
  <view class="user-info">
    <view class="avatar">
      <image class="img" src="{{details.member.avatar_image}}" mode='widthFix'></image>
    </view>
    <view class="user-content">
      <view class="user-name text-overHide">{{details.member.nickname}}</view>
      <view class="user-rank">
        <view class="user-rank-bg">{{details.rank== -1 ? '未上榜' : 'NO.'+details.rank}}</view>
      </view>
    </view>
  </view>

  <view class="invitation">
    <view class="invitation_text">
      邀请人数：<text class="num">{{details.invite_count}}</text>人
    </view>
    <view class="invitation_see" bindtap="gotoInvitation">查看</view>
    <i class="iconfont icon-advertise-next"></i>
  </view>

  <!-- 排行榜信息 -->
  <view class="rank-info">
    <view class="rank-top">
      <view class="title">邀请排行榜</view>
      <view class="hander">
        <view class="hander-left">排行</view>
        <view class="hander-center">会员</view>
        <view class="hander-right">累计邀请人数</view>
      </view>
      <view class="title-bg"></view>
    </view>
    <view class="rank-list">
      <block wx:if="{{listData.length>0}}">
        <view class="item" wx:for="{{listData}}" wx:key="index">
          <view class="left size-con">
            <image class="friend-img size-con" src="{{item.has_one_member.avatar_image}}"></image>
            <text class="friend-rank">{{index+1}}</text>
          </view>
          <view class="center">{{item.has_one_member.nickname}}</view>
          <view class="right">
            {{item.active_num}}人
          </view>
          <view class="item-bg"></view>
        </view>
        <view class="more" wx:if="{{!noMore}}" bindtap="loadMore">查看更多
          <van-icon name="arrow-down" style="margin-left: 2rpx;" color="red" />
        </view>
      </block>

      <block wx:else>
        <view class="blank">
          <image src="https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/blank.png" mode='widthFix' />
          <!-- <view style="text-align: center;font-size:28rpx;color:#666;">---暂无排名---</view> -->
        </view>
      </block>


    </view>

  </view>

</view>


<footer wx:if="{{details}}" auto_poster="{{details.auto_poster}}" staff_data="{{details.staff_data}}"
  activity_id="{{activity_id}}" isset_poster="{{details.isset_poster}}" chat_data="{{details.chat_data}}"
  isRanking="{{true}}"></footer>