challengeFamily/pages/public/calendar/calendar.js

const app = getApp();
const util = require('../../../utils/util.js');
Page({
  data: {
    activeData:[],//活动列表
    // 新版
    selectDay:{
      year:new Date().getFullYear(),
      month:new Date().getMonth() + 1,
      day:new Date().getDate()
    },
    today: {},//今天
    todaySecond: new Date().getTime(),//今天的秒
    haveActDays:[],//当日有活动的天
    imgPath: util.config.imgPath,
  },
  onLoad: function () {
    let date = new Date()
    this.setData({ 
      today: this.formatDate()
    });
    this.generateAllDays(date.getFullYear(), date.getMonth() + 1)
    this.setNavigationBarTitle()
  },
  setNavigationBarTitle(){
    wx.setNavigationBarTitle({
      title: app.globalData.city.city + '活动日历',
    })
  },
  digit: function (n) {
    if (n == null || n === "" || n == undefined) {
      return "";
    } else {
      return parseInt(n)>=10?n:'0'+n;
    }
  },
  //生成日期格式：2019-5-7
  formatDate: function (date = new Date()) {
    // 年月日
    var year = date.getFullYear()
    var month = date.getMonth() + 1
    var day = date.getDate()
    // 返回值
    let obj={year,month,day,dateStr:[year, this.digit(month), this.digit(day)].join('-')
    }
    return obj;
  },
  //生成当前需要显示的全部日期
  generateAllDays(year, month) {
    let that =this,detaultDay=-1,thisMonth = this.currentMonthDays(year, month)
    util.ajax({
      func: "article/calendar/getCalendarList",
      data: { "starDate": thisMonth[0].date, "endDate": thisMonth[thisMonth.length-1].date },
      load:false
    }, function (res) {
      if (res.code == 0) {
        let data = res.data;
        if (!util.isObjEmpty(data)&&data.length>0) {
          for (let i = 0; i < data.length; i++) {
            const el = data[i];
            let sec=new Date(el.date).getTime();
            if (sec>=that.data.todaySecond) {
              detaultDay=el.date.split('-')[2];
              that.getActiveDetail(el.date);
              break;
            }
          }
        }
        that.setData({haveActDays:data,'selectDay.day':parseInt(detaultDay)});
        that.dateInit()
      }else{
        util.showTips(res.reason);
      }
    })
  },
  //生成本月的值
  currentMonthDays(year, month) {
    const numOfDays = this.getNumOfDays(year, month)
    return this.generateDays(year, month, numOfDays)
  },
  //生成本月的上，或者中，或者下
  generateDays(year, month, daysNum, option = {startNum: 1, notCurrent: false}) {
    const weekMap = ['一', '二', '三', '四', '五', '六', '日']
    let days = []
    for (let i = option.startNum; i <= daysNum; i++) {
      let week = weekMap[new Date(year, month - 1, i).getUTCDay()]
      let day = i;
      days.push({
        date: `${year}-${month}-${day}`,
        event: false,
        day,
        week,
        month,
        year,
        dateSecond: new Date(`${year}/${month}/${day}`).getTime()
      })
    }
    return days
  },
  getNumOfDays(year, month, day = 0) {
    return new Date(year, month, day).getDate()
  },
  getActiveDetail(date){
    let that = this;
    util.ajax({
      func: "article/calendar/getArticleCalendarList",
      data: {date},
      load:false
    }, function (res) {
      if (res.code == 0) {
        res.data.map(el => {
          if (!util.isEmpty(el.discount)) {
            let arr =[];
            if (el.discount.indexOf('+')==-1) {
              arr.push(el.discount);
            } else {
              arr=el.discount.split('+');
            }
            el.discount=arr;
          }
        });
        let activeData = res.data;
        that.setData({ activeData})
      } else {
        util.showTips(res.reason);
      }
    })
  },
  onShareAppMessage() {
    return {
      title: '活动日历，按日历查活动',
      path: '/pages/public/calendar/calendar'
    }
  },
  /**
   * 时间戳转化为年 月 日 时 分 秒
   * time: 需要被格式化的时间，可以被new Date()解析即可
   * format：格式化之后返回的格式，年月日时分秒分别为Y, M, D, h, m, s，这个参数不填的话则显示多久前
   */
  formatTime(time, format) {
    function formatNumber(n) {
      n = n.toString()
      return n[1] ? n : '0' + n
    }

    function getDate(time, format) {
      const formateArr = ['Y', 'M', 'D', 'h', 'm', 's']
      const returnArr = []
      const date = new Date(time)
      returnArr.push(date.getFullYear())
      returnArr.push(formatNumber(date.getMonth() + 1))
      returnArr.push(formatNumber(date.getDate()))
      returnArr.push(formatNumber(date.getHours()))
      returnArr.push(formatNumber(date.getMinutes()))
      returnArr.push(formatNumber(date.getSeconds()))
      for (const i in returnArr) {
        format = format.replace(formateArr[i], returnArr[i])
      }
      return format
    }

    function getDateDiff(time) {
      let r = ''
      const ft = new Date(time)
      const nt = new Date()
      const nd = new Date(nt)
      nd.setHours(23)
      nd.setMinutes(59)
      nd.setSeconds(59)
      nd.setMilliseconds(999)
      const d = parseInt((nd - ft) / 86400000)
      switch (true) {
        case d === 0:
          const t = parseInt(nt / 1000) - parseInt(ft / 1000)
          switch (true) {
            case t < 60:
              r = '刚刚'
              break
            case t < 3600:
              r = parseInt(t / 60) + '分钟前'
              break
            default:
              r = parseInt(t / 3600) + '小时前'
          }
          break
        case d === 1:
          r = '昨天'
          break
        case d === 2:
          r = '前天'
          break
        case d > 2 && d < 30:
          r = d + '天前'
          break
        default:
          r = getDate(time, 'Y-M-D')
      }
      return r
    }
    if (!format) {
      return getDateDiff(time)
    } else {
      return getDate(time, format)
    }
  },
  //上月切换按钮点击
  lastMonth() {
    const lastMonth = new Date(this.data.selectDay.year, this.data.selectDay.month - 2)
    const year = lastMonth.getFullYear()
    const month = lastMonth.getMonth() + 1
    this.setData({'selectDay.year':year,'selectDay.month':month,activeData:[]})
    this.generateAllDays(year, month)
  },
  //下月切换按钮点击
  nextMonth() {
    const nextMonth = new Date(this.data.selectDay.year, this.data.selectDay.month)
    const year = nextMonth.getFullYear()
    const month = nextMonth.getMonth() + 1
    this.setData({'selectDay.year':year,'selectDay.month':month,activeData:[]})
    this.generateAllDays(year, month)
  },
  //设置月份
  setMonth(setYear, setMonth, setDay,index, sid,bol) {
    if (!util.isEmpty(index)) {
      this.setData({selectedMonth:index})
    }
      const data = {
        selectDay: {
          year: setYear,
          month: setMonth,
          day: setDay ? setDay : 0,
          dateString: setYear+'-'+setMonth+'-'+(setDay||0)
        }
      }
      if (!setDay) {
        data.open = true;
      }
      this.setData({selectDay:data.selectDay,s1Sid:sid})
      this.dateInit(setYear, setMonth)
      this.data.selectDay.bol=bol;
      this.triggerEvent("change", this.data.selectDay)
  },
  //日历主体的渲染方法
  dateInit(setYear = this.data.selectDay.year, setMonth = this.data.selectDay.month) {
    let dateList = []; //需要遍历的日历数组数据
    let now = new Date(setYear, setMonth - 1)//当前月份的1号
    let startWeek = now.getDay(); //目标月1号对应的星期
    let dayNum = new Date(setYear, setMonth, 0).getDate() //当前月有多少天
    let forNum = Math.ceil((startWeek + dayNum) / 7) * 7 //当前月跨越的天数（包括当前月天数周所涉及的上下月日期）
      //展开状态，需要渲染完整的月份
      for (let i = 0; i < forNum; i++) {
        const now2 = new Date(now)
        let obj = {};
        if (i>=startWeek && i<(dayNum+startWeek)) {
          now2.setDate(i - startWeek + 1)
          let dayStatus=this.matchDay({y:now2.getFullYear(),m:now2.getMonth()+1,d:now2.getDate()})
          obj = {
            day: now2.getDate(),
            month: now2.getMonth() + 1,
            year: now2.getFullYear(),
            dateString: this.formatTime(now2, "Y-M-D"),
            dateSecond:new Date(this.formatTime(now2, "Y-M-D")).getTime()
          };
          if (!util.isEmpty(dayStatus)&&dayStatus>0) {
            obj.count=dayStatus;
          }
        } else {
          obj = {}
        }
        dateList[i] = obj;
      }
    this.setData({
      dateList: dateList
    })
  },
  // 匹配日历-天
  matchDay(date){
    let count=0;
    if (!util.isObjEmpty(this.data.haveActDays)) {
      this.data.haveActDays.map(el => {
        let date1 = el.date.split('-');
        if (date.y==date1[0] && date.m==parseInt(date1[1])&&date.d==parseInt(date1[2])) {
          count=el.count;
        }
      });
    }
    return count;
  },
  //一天被点击时
  selectChange(e) {
    const year = e.currentTarget.dataset.year
    const month = e.currentTarget.dataset.month
    const day = e.currentTarget.dataset.day
    const dateString = e.currentTarget.dataset.dateString
    const selectDay = {
      year: year,
      month: month,
      day: day,
      dateString: dateString
    }
    if (this.data.selectDay.year == year && this.data.selectDay.month == month && this.data.selectDay.day == day) {
      return false;
    }else{
      this.getActiveDetail(dateString)
    }
    this.setData({selectDay})
  }
})