<template>

  <div class="view-friends-container screen" v-if="config">
    <flat-list
        @fetch="fetch"
        indexes="uid"
        ref="flat"
    >
      <template v-slot:item="{item,index}">
        <aside class="view-friends-item rowACenter cursor-pointer"
          :key="'view-friends-'+item.uid"
               @click="openDetail(item)"
        >
          <v-image radius="50%" :src="item.head_pic" class="view-friends-avatar"></v-image>
          <div class="flex-1">
            <div class="line-1 view-friends-title">{{item.nick_name}}</div>
            <layout-sex
              :type="item.sex"
              :birthday="item.birthday"
            ></layout-sex>
          </div>
          <div v-if="item.is_follow===2" class="view-friends-introduce">互相关注</div>
        </aside>
      </template>

    </flat-list>

  </div>

</template>

<script>
import {
  vImage,
  FlatList
} from '$components';
import props from '../props';
import layoutSex from '$layout/layout-sex';
import mixins from '../mixins';
export default {
  name: "view-friends",

  components:{
    FlatList,
    vImage,
    layoutSex
  },
  props,
  mixins
}
</script>

<style scoped lang="scss" src="../style.scss"></style>
