<template>
  <view class="slide-box">
    <tantan ref="jmList"  @onChange="getDiscoverList" @onClickImage="clickImage"></tantan>
  </view>
</template>

<script>
import tantan from '@/components/dgex-tantan/dgex-tantan.vue'
import {getDiscoverList} from "@/api/discovery";
import tools from "@/service/tools";
export default {
  name: "slide-item",
  components: {
    tantan
  },
  props: {},
  data() {
    return {
      page:1,
      total:undefined,
      isAjax:false,
      list:[],
    }
  },
  watch: {},

  mounted() {

    this.getDiscoverList()
  },
  methods: {
    getDiscoverList(){
      if(this.isAjax){
        return
      }
      this.isAjax=true
      getDiscoverList({'count':10}).then((res)=>{
        this.isAjax=false
        if(res.code===0){
          this.list=res
          let arr=[]
          res.data.forEach((item)=>{
            let galleryUrls=item.galleryUrls
            let age=tools.getAge(item.dateOfBirth)
            if(galleryUrls.length>0){
              if(galleryUrls.length>8){
                galleryUrls=galleryUrls.slice(0,7)
              }
              let newdata = {
                image: galleryUrls[0],
                images: galleryUrls,
                imgIndex:0,
                title:  item.nickname,
                userId:  item.userId,
                age:  age,
                online:  item.online,
                longitude:  item.longitude,
                latitude:  item.latitude,
                distance: 17,
                city:  item.province+' '+item.city,
                weChat:  item.wechatId,
                animation:{}
              }
              console.log(newdata)
              arr.push(newdata)
            }

          })
          this.$refs.jmList.setData(arr)
        }

      })
    },
    clickImage(data) {
      console.log(data);
    }
  }
}
</script>

<style scoped lang="scss">
.slide-box{
  margin-top: 10rpx;
  box-sizing: border-box;
}

</style>
