// component/calendar/calendar.js
const dayjs = require('dayjs');
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    calendarAllList: {
      type: Array
    }
    // isShow:{
    //   type:Boolean,
    //   value:false
    // },
  },

  /**
   * 组件的初始数据
   */
  data: {
    calendarWeek: ['一', '二', '三', '四', '五', '六', '日'],
    currentTime: '',
    nowYear: '',
    nowMonth: '',
    swiperHeight: '',
    calendarPageIndex: 1,
    selectedIndex: '',
    isShow: false //是否展开
  },
  lifetimes: {
    attached: function () {
      //在组件实例进入页面节点树时执行
      this.setData({
        currentTime: `${new Date().getFullYear()}/${
          new Date().getMonth() + 1
        }/${new Date().getDate()}`,
        nowYear: new Date().getFullYear(),
        nowMonth:
          new Date().getMonth() + 1 > 9
            ? new Date().getMonth() + 1
            : '0' + (new Date().getMonth() + 1)
      });
      this.getMonthDate();
    }
  },
  /**
   * 组件的方法列表
   */
  methods: {
    setSwiperHeight() {
      // swiper高度
      const query = wx.createSelectorQuery().in(this);
      if (this.data.isShow) {
        query
          .select('.currentBox')
          .boundingClientRect(res => {
            this.setData({
              swiperHeight: res.height
            });
          })
          .exec();
      }
    },
    changeSwiper(e) {
      let index = this.data.calendarPageIndex;
      const diff = e.detail.current - index;
      if (diff == 1 || diff == -2) {
        // 向右边滑动，显示swiper左边内容
        this.nextMonth();
      } else if (diff == -1 || diff == 2) {
        // 向左边滑动 显示swiper右边内容
        this.prevMonth();
      }
    },
    transitionStop(e) {
      //更新轮播图当前index
      this.setData({
        calendarPageIndex: e.detail.current
      });
      this.setSwiperHeight();
    },
    prevMonth() {
      //上一个月
      if (!this.data.isShow) {
        //收起时切换上下月有问题所以做了限制
        return;
      }
      const index = this.data.calendarPageIndex;
      let pre = index == 0 ? 2 : index - 1;
      this.setData({
        calendarPageIndex: pre
      });
      let year = new Date(this.data.currentTime).getFullYear();
      let month = new Date(this.data.currentTime).getMonth() - 1;
      if (month < 0) {
        month = 11;
        year--;
      }
      this.initDate(new Date(year, month, 1));
      this.getMonthDate();
    },
    nextMonth() {
      //下一个月
      if (!this.data.isShow) {
        return;
      }
      const index = this.data.calendarPageIndex;
      let next = index == 2 ? 0 : index + 1;
      this.setData({
        calendarPageIndex: next
      });
      let year = new Date(this.data.currentTime).getFullYear();
      let month = new Date(this.data.currentTime).getMonth() + 1;
      if (month > 11) {
        month = 0;
        year++;
      }
      this.initDate(new Date(year, month, 1));
      this.getMonthDate();
    },
    initDate(date = new Date()) {
      //初始化日期
      const year = date.getFullYear();
      const month =
        date.getMonth() < 9 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
      const day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
      const currentDate = year + '/' + month + '/' + day;
      this.setData({
        currentTime: currentDate,
        nowYear: year,
        nowMonth: month
      });
    },
    getMonthDate() {
      let showMonthList = this.getShowMonthList();
      const calendarAllList = [];
      showMonthList.forEach(item => {
        calendarAllList.push(this.getAllMonthDay(item));
      });
      let allList = [];
      const index = this.data.calendarPageIndex;
      if (index == 1) {
        allList = [calendarAllList[0], calendarAllList[1], calendarAllList[2]];
      } else if (index == 2) {
        allList = [calendarAllList[2], calendarAllList[0], calendarAllList[1]];
      } else if (index == 0) {
        allList = [calendarAllList[1], calendarAllList[2], calendarAllList[0]];
      }
      this.setData({
        calendarAllList: allList
      });
      if (!this.data.selectedIndex) {
        //初始化才进
        let day = new Date().getDate();
        let index = allList[1].list.findIndex(
          x => x.day == day && (!x.isLastMon || !x.isNextMon)
        );
        this.setData({
          selectedIndex: index,
          selectDate: allList[1].month,
          currentSelectDate: allList[1].month + '-' + allList[1].list[index].day
        });
      }
      this.setSwiperHeight();
      if (!this.data.isShow) {
        this.getCurrentWeek();
      }
      let params = {
        date: this.data.nowYear + '-' + this.data.nowMonth,
        calendarAllList: this.data.calendarAllList,
        isShow: this.data.isShow
      };
      this.triggerEvent('selectMonth', params);
    },
    getAllMonthDay(time) {
      //获取每月的每一天
      const timeArr = time.split('-');
      let dayLenth = new Date(timeArr[0], timeArr[1], 0).getDate();
      let dayList = [];
      for (let i = 0; i < dayLenth; i++) {
        dayList.push({
          day: i + 1,
          // timestamp: new Date(`${timeArr[0]}-${Number(timeArr[1])}-${i+1}`).getTime(),
          week: new Date(timeArr[0], timeArr[1] * 1 - 1, i + 1).getDay(),
          date: dayjs(timeArr[0] + '-' + timeArr[1] + '-' + (i + 1)).format(
            'YYYY-M-D'
          ),
          isClock: 0
        });
      }

      for (let j = 0; j < 7; j++) {
        if (dayList[0].week != 1) {
          // 补全月首日期
          let month = Number(timeArr[1]) - 1 == 0 ? 12 : Number(timeArr[1]) - 1;
          let year =
            Number(timeArr[1]) - 1 == 0 ? Number(timeArr[0]) - 1 : timeArr[0];
          const lastMonthDay = new Date(
            timeArr[0],
            Number(timeArr[1]) - 1,
            0
          ).getDate();
          const day = {
            day: lastMonthDay - j,
            // timestamp: new Date(`${year}-${month}-${lastMonthDay - j}`).getDay(),
            week: new Date(year, month - 1, lastMonthDay - j).getDay(),
            isLastMon: true,
            date: dayjs(year + '-' + month + '-' + (lastMonthDay - j)).format(
              'YYYY-M-D'
            )
          };
          dayList.unshift(day);
        }
        if (dayList[dayList.length - 1].week != 0) {
          // 补全末位 下月日期
          let month = Number(timeArr[1]) + 1 > 12 ? 1 : Number(timeArr[1]) + 1;
          let year =
            Number(timeArr[1]) + 1 > 12 ? Number(timeArr[0]) + 1 : timeArr[0];
          const day = {
            day: j + 1,
            // timestamp: new Date(`${year}-${month}-${j + 1}`).getTime(),
            week: new Date(year, month - 1, j + 1).getDay(),
            date: dayjs(year + '-' + month + '-' + (j + 1)).format('YYYY-M-D'),
            isNextMon: true
          };
          dayList.push(day);
        }
      }

      return {
        month: `${timeArr[0]}-${Number(timeArr[1])}`,
        list: dayList
      };
    },
    getShowMonthList() {
      //获取前后三个月的月份
      const timeArr = this.data.currentTime.split('/');
      let searchMonthList = [`${timeArr[0]}-${timeArr[1]}`];
      if (Number(timeArr[1]) > 1 && Number(timeArr[1]) < 12) {
        const preMonth = Number(timeArr[1]) - 1;
        const nextMonth = Number(timeArr[1]) + 1;
        searchMonthList = [
          `${timeArr[0]}-${preMonth}`,
          searchMonthList[0],
          `${timeArr[0]}-${nextMonth}`
        ];
      } else if (Number(timeArr[1]) == 1) {
        const preYear = Number(timeArr[0]) - 1;
        searchMonthList = [
          `${preYear}-12`,
          searchMonthList[0],
          `${timeArr[0]}-02`
        ];
      } else if (Number(timeArr[1]) == 12) {
        const nextYear = Number(timeArr[0]) + 1;
        searchMonthList = [
          `${timeArr[0]}-11`,
          searchMonthList[0],
          `${nextYear}-01`
        ];
      }
      return searchMonthList;
    },
    selectWeekDay(e) {
      let item = e.currentTarget.dataset.item;
      if (item.isLastMon || item.isNextMon) {
        return false;
      }
      this.setData({
        currentSelectDate: item.date
      });
      this.triggerEvent('getSelectDate', this.data.currentSelectDate);
    },
    selectDay(e) {
      //选择日期
      let { arr_item, item, index } = e.currentTarget.dataset;
      if (item.isLastMon || item.isNextMon || !this.data.isShow) {
        return false;
      }
      this.setData({
        selectedIndex: index,
        selectDate: arr_item.month
      });
      let currentSelectDate = arr_item.month + '-' + arr_item.list[index].day;
      this.setData({
        currentSelectDate
      });
      this.triggerEvent('getSelectDate', currentSelectDate);
    },
    changeShowStatus() {
      this.setData({
        isShow: !this.data.isShow
      });
      this.setData({
        currentTime: dayjs(this.data.currentSelectDate).format('YYYY/M/D')
      });
      this.getMonthDate();
      this.setSwiperHeight();
    },
    getCurrentWeek() {
      //初始化选择项的这一周
      let list = [];
      let currentMonth = dayjs(this.data.currentSelectDate).format('YYYY-M');
      let item = this.data.calendarAllList.filter(
        x => x.month === currentMonth
      )[0];
      item.list.map(x => (x.date = dayjs(x.date).format('YYYY-MM-DD')));
      let weekOfDay = dayjs(this.data.currentSelectDate).format('d'); //计算今天是这周第几天
      for (let i = 1; i < 8; i++) {
        let dayTime;
        if (weekOfDay == 0) {
          dayTime = dayjs(this.data.currentSelectDate).subtract(7 - i, 'days');
        } else {
          if (i == 7) {
            dayTime = dayjs(this.data.currentSelectDate).add(
              i - weekOfDay,
              'days'
            );
          } else {
            dayTime = dayjs(this.data.currentSelectDate).subtract(
              weekOfDay - i,
              'days'
            );
          }
        }
        let obj = {
          day: dayTime.format('D'),
          date: dayTime.format('YYYY-M-D'),
          isNextMon: dayTime.format('YYYY-M') > currentMonth ? true : false,
          isLastMon: dayTime.format('YYYY-M') < currentMonth ? true : false,
          isClock: item.list.filter(
            x => x.date == dayTime.format('YYYY-MM-DD')
          )[0].isClock
        };
        list.push(obj);
      }
      this.setData({
        nowYear: dayjs(this.data.currentSelectDate).format('YYYY'),
        nowMonth: dayjs(this.data.currentSelectDate).format('MM'),
        showFalseList: list
      });
    }
  }
});