import taskApi from '../../api/taskApi';
import dayjs from 'dayjs';
import { useSubTaskItem } from './subtaskitem-proxy.js';

const app = getApp();

Page({
  behaviors: [useSubTaskItem],
  /**
   * 页面的初始数据
   */
  data: {
    // 日历显示日期范围
    minDate: new Date(2026, 2, 1).getTime(),
    maxDate: new Date(2026, 3, 30).getTime(),

    // 选中的日期
    thisDate: new Date().getTime(),
    // 上次选中的日期
    lastDate: new Date().getTime(),

    // 当月总任务选项及选中的任务
    toptask: {
      options: [],
      value: '',
    },
    // 选中总任务下对应的日任务
    daytasks: [],
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    this.fetchToptask();
    // 页面加载完成后，设定日历的格式化日期函数
    const _formatCalendarDay = this._formatCalendarDay;
    this.setData({
      formatCalendarDay: _formatCalendarDay,
    });

    // 设置日历起止时间
    this.setData({
      minDate: dayjs().startOf('month').add(-1, 'month').toDate().getTime(),
      maxDate: dayjs().endOf('month').toDate().getTime(),
    });
  },

  /**
   * 监听页面滚动
   */
  onPageScroll(e) {
    this.setData({
      scrollTop: e.scrollTop,
    });
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {},

  /**
   * 修改总任务事件处理函数
   */
  onToptaskChange(e) {
    console.log('onToptaskChange', e);
    this.setData({
      'toptask.value': e.detail.value,
    });
    this.fetchDayTasks();
  },

  /**
   * 切换月份或年份事件处理函数
   */
  handelMonthChange(e) {
    // 选中日期同步切换一个月
    const { year, month } = e.detail;
    let thisDay = dayjs(this.data.thisDate);
    thisDay = thisDay.year(year);
    thisDay = thisDay.month(month - 1);

    // 如果切换后的月份为当前日历范围的起始月份，则修改起始月份减少一个月，确保用户可继续查看历史月份
    const _minDate = dayjs(this.data.minDate);
    if (thisDay.month() == _minDate.month()) {
      this.setData({
        minDate: _minDate.add(-1, 'month').toDate().getTime(),
      });
    }

    this.setData({
      thisDate: thisDay.toDate().getTime(),
    });
    this.fetchToptask();
  },

  /**
   * 根据日任务情况，格式化对应日期的样式和内容
   * @param {TDate } day
   * TDate { date: Date; day: number; type: TDateType; className?: string; prefix?: string; suffix?: string;}
   * type TDateType = 'selected' | 'disabled' | 'start' | 'start-end' |'centre' | 'end' | ''
   */
  _formatCalendarDay(day) {
    if (!this) return;
    const { date } = day;
    const { daytasks } = this.data;

    // 查找当天是否有日任务
    const fdt = daytasks.find(d => {
      return dayjs(d.date).isSame(dayjs(date), 'day') && d.totalTaskNum > 0;
    });

    if (fdt) {
      day.suffix = `${fdt.completeTaskNum}/${fdt.totalTaskNum}`;
      day.className = 'has-task';
    }
    return day;
  },

  /**
   * 点击日期事件处理函数
   */
  handleSelectDay(e) {
    console.log('app', app);
    const date = new Date(e.detail.value);
    const { thisDate } = this.data;
    this.setData({
      lastDate: thisDate,
      thisDate: date.getTime(),
    });
    this.fetchSubtaskByDayTask();
  },

  /**
   * 根据所选时段获取总任务
   */
  fetchToptask() {
    this.setData({ pageLoading: true });
    const thisDay = dayjs(this.data.thisDate);
    const starttime = thisDay.startOf('month').format('YYYY-MM-DD HH:mm:ss');
    const endtime = thisDay.endOf('month').format('YYYY-MM-DD HH:mm:ss');
    taskApi.fetchTopTasks({ starttime, endtime }).then(res => {
      const options =
        res.data.length > 0
          ? res.data.map(r => {
              return {
                label: r.name,
                value: r.tguid,
              };
            })
          : [
              {
                label: '本月无监管任务',
                value: null,
              },
            ];
      this.setData({
        toptask: {
          options: options,
          value: options[0].value,
        },
      });
      this.fetchDayTasks();
    });
  },

  /**
   * 获取每日任务统计信息
   */
  fetchDayTasks() {
    this.setData({ pageLoading: true });
    taskApi
      .fetchDayTasks(this.data.toptask.value)
      .then(res => {
        if (res) {
          this.setData({ daytasks: res });
          this.selectThisDay();
        }
      })
      .finally(() => this.setData({ pageLoading: false }));
  },

  // 用于触发日历的日期格式化函数，显示每日任务完成情况
  selectThisDay() {
    setTimeout(() => {
      const { thisDate } = this.data;
      this.setData({
        thisDate,
      });
      this.fetchSubtaskByDayTask();
    }, 200);
  },
});