import dayjs from 'dayjs';
Component({
  props: {
    onSelectDate: () => {},
    onCloseDate: () => {}
  },
  data: {
    years: [],
    months: [],
    tapIndex: 'startTime',
    startValue: [4, 2],
    endValue: [],
    startTime: '',
    endTime: '',
    showAttentionOne: false,
    showAttentionTwo: false
  },

  didMount() {
    this.initData();
  },

  methods: {
    // 初始化数据
    initData() {
      // 初始化日期模态框数据
      const date = new Date();
      const years = [];
      const months = [];
      let startValue = [];
      let endValue = [];

      for (let i = date.getFullYear() - 5; i <= date.getFullYear(); i++) {
        years.push(String(i));
      }

      for (let i = 1; i <= 12; i++) {
        months.push(padStart(i));
      } // 初始化日期模态框value


      if (this.props.startProps) {
        startValue = [years.indexOf(this.props.startProps.slice(0, 4)), months.indexOf(this.props.startProps.slice(5, 7))];
      } else {
        startValue = [years.length - 1, months.indexOf(padStart(date.getMonth() + 1))];
      }

      if (this.props.endProps) {
        endValue = [years.indexOf(this.props.endProps.slice(0, 4)), months.indexOf(this.props.endProps.slice(5, 7))];
      } else {
        endValue = [];
      }

      this.setData({
        years,
        months,
        startTime: this.props.startProps,
        endTime: this.props.endProps,
        startValue,
        endValue
      });
    },

    onTapTimeIndex(e) {
      this.setData({
        tapIndex: e.currentTarget.dataset.type
      });
    },

    // 滑动选项  设置时间
    onPickerChange(e) {
      const {
        value
      } = e.detail;

      if (this.data.tapIndex === 'startTime') {
        this.setData({
          startValue: value,
          startTime: `${this.data.years[value[0]]}-${this.data.months[value[1]]}`
        });
      } else {
        this.setData({
          endValue: value,
          endTime: `${this.data.years[value[0]]}-${this.data.months[value[1]]}`
        });
      }

      this.maxSixMonths(this.data.startTime, this.data.endTime);
    },

    // 最长查找时间跨度六个月的记录 且 结束时间必须晚于开始时间
    maxSixMonths(startTime, endTime) {
      if (startTime && endTime) {
        const diffNumber = dayjs(endTime).diff(startTime, 'month');
        this.setData({
          showAttentionOne: Math.abs(diffNumber) > 6,
          showAttentionTwo: diffNumber < 0
        });
      }
    },

    // 确定
    onSure() {
      if (!this.data.showAttentionOne && !this.data.showAttentionTwo) {
        // 只选择开始时间 或者 只选择结束时间，强制开始时间与结束时间相同
        if (this.data.startTime && !this.data.endTime) {
          this.setData({
            endTime: this.data.startTime
          });
        }

        if (!this.data.startTime && this.data.endTime) {
          this.setData({
            startTime: this.data.endTime
          });
        }

        this.props.onSelectDate(this.data.startTime, this.data.endTime);
        this.props.onCloseDate();
      }
    },

    // 重置
    onReset() {
      this.setData({
        startTime: '',
        endTime: ''
      });
      this.props.onSelectDate(this.data.startTime, this.data.endTime);
      this.props.onCloseDate();
    },

    // 关闭蒙层
    onPopupClose() {
      this.props.onCloseDate();
    }

  }
}); // 月份补0

function padStart(i) {
  return i < 10 ? `0${String(i)}` : String(i);
}