import TouchEvent from "./utils/touchEvent";
const app = getApp()
Component({
  properties: {
    data: Array,
    imgData:{
      type:Array,
      value:[]
    },
    back: {
      type: String,
      value: '#fff'
    },
    swiperCurIndex:{
      type:Number,
      value: 0,
      observer: function(newVal, oldVal) {
        if(newVal){

        }// 在这里可以对接收到的数据进行相应的处理
    }

    }
  },

  options: {
    multipleSlots: true
  },

  data: {
    isLoading: false,
    swiperData: [],
    // swiperCurIndex: 0,
    slideClass: "",
    lockSwipe: false
  },

  lifetimes: {
    created() {
      this.data.swiperData = this.data.swiperData.concat(this.data.data);
      new TouchEvent(this, "touchCard", {
        swipe: evt => {
          if (evt.direction === "Left") this.next(evt);
          if (evt.direction === "Right") this.prev(evt);
        }
      });
    },
    async attached() {
      const res = await this.getImgData()
      this.setData({
        imgData:res.data.skuImgageList
      }, () => {
        let imgList =  [ ].concat.apply([],this.data.imgData)
        let swiperData = imgList.map(item=>{
          return { url:item }
        })
        this.setData({
          swiperData
        })
      })
    },
    ready(){

    },
  },

  methods: {
     getImgData(){
      return app.utils.doPost({
          url: '/junYao/homeSkuInfo.json',
          params: {}
      },true)
    },
    next(e) {
      if (this.data.lockSwipe) return;
      this.data.lockSwipe = true;
      if (-this.data.swiperCurIndex >= this.data.swiperData.length - 1)
        return (this.data.lockSwipe = false);

      if (-this.data.swiperCurIndex >= this.data.swiperData.length - 3) {
        this.loadMore();
      }

      const index = e.currentTarget.dataset["index"];
      const { src } = e.currentTarget.dataset
      let mySwiperIndex = this.data.swiperData.findIndex(item=>item.url==src)

      const tabIndex = this.data.imgData.findIndex(item => item.includes(this.data.swiperData[mySwiperIndex + 1].url));

      this.triggerEvent('updateTab',{ tabIndex })

      this.setData({ ["swiperData[" + index + "].slideClass"]: " ani-slide-up" }, () => {
        this.setData({
          swiperCurIndex: --this.data.swiperCurIndex
        });
      })

      setTimeout(() => {
        this.data.lockSwipe = false;
        this.setData({
          ["swiperData[" + index + "].slideClass"]: ""
        });
      }, 360);
    },

    prev(e) {
      const index = e.currentTarget.dataset["index"] - 1;
      const { src } = e.currentTarget.dataset
      if (this.data.lockSwipe || index < 0) return;
      this.data.lockSwipe = true;

      let mySwiperIndex = this.data.swiperData.findIndex(item=>item.url==src)

      const tabIndex = this.data.imgData.findIndex(item => item.includes(this.data.swiperData[mySwiperIndex - 1].url));

       this.triggerEvent('updateTab',{ tabIndex })

      this.setData({
        swiperCurIndex: ++this.data.swiperCurIndex
      });

      setTimeout(() => {
        this.data.lockSwipe = false;
        this.setData({
          ["swiperData[" + index + "].slideClass"]: ""
        });
      }, 360);
    },

    loadMore() {
      this.isLoading = true;
      this.triggerEvent("loadmore", { addToList: this.addToList.bind(this) });
    },

    addToList(list) {
      this.isLoading = false;
      this.setData({
        swiperData: this.data.swiperData.concat(list)
      });
    }
  }
});