toutoukan_front/miniprogram/pages/daily/daily.ts

// 定义日历日期类型
interface CalendarDay {
  type: 'current' | 'empty'; // current:当月日期, empty:空占位（上月/下月）
  day: number; // 日期数字
  date: string; // 完整日期（YYYY-MM-DD）
  isChecked: boolean; // 是否已签到
  isToday: boolean; // 是否是今天
}

Page({
  data: {
    currentYear: new Date().getFullYear(), // 当前年
    currentMonth: new Date().getMonth(), // 当前月（0-11）
    calendarDays: [] as CalendarDay[], // 日历日期列表
    checkinHistory: [] as string[], // 签到历史（存储YYYY-MM-DD格式日期）
    continuousCheckinDays: 0, // 连续签到天数
    totalCheckinDays: 0, // 本月总签到天数
    isCheckedToday: false, // 今日是否已签到
    isAnimating: false // 是否正在执行签到动画
  },

  onLoad() {
    // 从本地缓存加载签到历史
    this.loadCheckinHistory();
    // 生成当月日历数据
    this.generateCalendarDays();
    // 计算签到统计数据
    this.calculateCheckinStats();
  },

  /**
   * 从本地缓存加载签到历史
   */
  loadCheckinHistory() {
    const history = wx.getStorageSync('checkinHistory') || [];
    this.setData({ checkinHistory: history });
    
    // 检查今日是否已签到
    const today = this.formatDate(new Date());
    const isCheckedToday = history.includes(today);
    this.setData({ isCheckedToday });
  },

  /**
   * 生成当月日历数据
   */
  generateCalendarDays() {
    const { currentYear, currentMonth, checkinHistory } = this.data;
    const calendarDays: CalendarDay[] = [];

    // 获取当月第一天是星期几（0=周日，1=周一...6=周六）
    const firstDayOfMonth = new Date(currentYear, currentMonth, 1).getDay();
    // 获取当月总天数
    const totalDaysOfMonth = new Date(currentYear, currentMonth + 1, 0).getDate();
    // 获取今日日期（YYYY-MM-DD）
    const today = this.formatDate(new Date());

    // 添加上月残留日期（空占位）
    for (let i = 0; i < firstDayOfMonth; i++) {
      calendarDays.push({
        type: 'empty',
        day: 0,
        date: '',
        isChecked: false,
        isToday: false
      });
    }

    // 添加当月日期
    for (let day = 1; day <= totalDaysOfMonth; day++) {
      const date = new Date(currentYear, currentMonth, day);
      const dateStr = this.formatDate(date);
      const isChecked = checkinHistory.includes(dateStr);
      const isToday = dateStr === today;

      calendarDays.push({
        type: 'current',
        day,
        date: dateStr,
        isChecked,
        isToday
      });
    }

    // 添加下月占位日期（确保日历满6行，共42个格子）
    const totalCells = 42; // 6行×7列=42个格子
    const remainingCells = totalCells - calendarDays.length;
    for (let i = 0; i < remainingCells; i++) {
      calendarDays.push({
        type: 'empty',
        day: 0,
        date: '',
        isChecked: false,
        isToday: false
      });
    }

    this.setData({ calendarDays });
  },

  /**
   * 计算签到统计数据
   */
  calculateCheckinStats() {
    const { checkinHistory, currentYear, currentMonth } = this.data;
    const today = new Date();
    
    // 计算本月总签到天数
    const monthStart = new Date(currentYear, currentMonth, 1);
    const monthEnd = new Date(currentYear, currentMonth + 1, 0);
    const monthStartStr = this.formatDate(monthStart);
    const monthEndStr = this.formatDate(monthEnd);
    
    const monthlyCheckins = checkinHistory.filter(date => {
      return date >= monthStartStr && date <= monthEndStr;
    });
    
    // 计算连续签到天数
    let continuousDays = 0;
    const sortedHistory = [...checkinHistory].sort();
    
    // 从今天开始往前查连续签到
    const checkDate = new Date(today);
    while (true) {
      const dateStr = this.formatDate(checkDate);
      if (sortedHistory.includes(dateStr)) {
        continuousDays++;
        // 往前推一天
        checkDate.setDate(checkDate.getDate() - 1);
      } else {
        break;
      }
    }
    
    this.setData({
      totalCheckinDays: monthlyCheckins.length,
      continuousCheckinDays: continuousDays
    });
  },

  /**
   * 处理签到逻辑
   */
  handleCheckin() {
    if (this.data.isCheckedToday || this.data.isAnimating) return;
    
    // 开始动画
    this.setData({ isAnimating: true });
    
    // 记录当前日期
    const today = this.formatDate(new Date());
    const { checkinHistory } = this.data;
    
    // 添加到签到历史
    const newHistory = [...checkinHistory, today];
    wx.setStorageSync('checkinHistory', newHistory);
    
    // 更新数据
    setTimeout(() => {
      this.setData({
        checkinHistory: newHistory,
        isCheckedToday: true,
        isAnimating: false
      });
      
      // 更新日历和统计
      this.generateCalendarDays();
      this.calculateCheckinStats();
      
      // 显示成功提示
      wx.showToast({
        title: '签到成功！',
        icon: 'success',
        duration: 1500
      });
    }, 1000); // 动画持续1秒
  },

  /**
   * 格式化日期为YYYY-MM-DD
   */
  formatDate(date: Date): string {
    const year = date.getFullYear();
    const month = String(date.getMonth() + 1).padStart(2, '0');
    const day = String(date.getDate()).padStart(2, '0');
    return `${year}-${month}-${day}`;
  }
});