微信小程序日历

源码下载地址：https://github.com/lengyue1084/wxapp-calendar

小程序开发群：478374409 欢迎交流

项目需要一个日历功能，花了一天时间实现的微信小程序日历,js大小只有几k,引入了bootstrap字体图标(文件icon.wxss,该字体已经bootstrap字体图标需要的字体)看起来有80k,出去icon.wxss整个只有几k，有问题欢迎指正

如图：

index.wxml

  
    
      
        
          
        
      
      
        {{currentDate}}
      
      
        
          
        
      
    
    
      
        一
      
      
        二
      
      
        三
      
      
        四
      
      
        五
      
      
        六
      
      
        日
      
    
    
      
          {{vo}}
          {{vo}}
      
    
  

index.wxss

@import '../../dist/css/icon.wxss';
page {
  background-color: #2a8cef;
  background:-webkit-gradient(linear, 0 0, 0 bottom, from(#2a8cef), to(#8A2BE2));
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: stretch;
  font-size: 14px;
}

.box {
  display: block;
  margin: 10px;
}

.box-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  flex-wrap: wrap;
}

.flex-item {
  flex-flow: nowrap;
  flex-grow: 1;
  flex-shrink: 1;
  width: 14.2%;
}

.item-content {
  margin: 5px;
  padding: 0 10px;
  text-align: center;
  background-color: #000;
  height: 2rem;
  line-height: 2rem;
  color: #fff;
}

.bk-color-day {
  background-color: #8A2BE2;
}

.item-content-current-day {
  flex-grow: 2;
}

index.js

var app = getApp();
Page({
    data: {
        currentDate: "2017年05月03日",
        dayList: '',
        currentDayList: '',
        currentObj: '',
        currentDay: ''
    },
    onLoad: function (options) {
        var currentObj = this.getCurrentDayString()
        this.setData({
            currentDate: currentObj.getFullYear() + '年' + (currentObj.getMonth() + 1) + '月' + currentObj.getDate() + '日',
            currentDay: currentObj.getDate(),
            currentObj: currentObj
        })
        this.setSchedule(currentObj)
    },
    doDay: function (e) {
        var that = this
        var currentObj = that.data.currentObj
        var Y = currentObj.getFullYear();
        var m = currentObj.getMonth() + 1;
        var d = currentObj.getDate();
        var str = ''
        if (e.currentTarget.dataset.key == 'left') {
            m -= 1
            if (m <= 0) {
                str = (Y - 1) + '/' + 12 + '/' + d
            } else {
                str = Y + '/' + m + '/' + d
            }
        } else {
            m += 1
            if (m <= 12) {
                str = Y + '/' + m + '/' + d
            } else {
                str = (Y + 1) + '/' + 1 + '/' + d
            }
        }
        currentObj = new Date(str)
        this.setData({
            currentDate: currentObj.getFullYear() + '年' + (currentObj.getMonth() + 1) + '月' + currentObj.getDate() + '日',
            currentObj: currentObj
        })
        this.setSchedule(currentObj);
    },
    getCurrentDayString: function () {
        var objDate = this.data.currentObj
        if (objDate != '') {
            return objDate
        } else {
            var c_obj = new Date()
            var a = c_obj.getFullYear() + '/' + (c_obj.getMonth() + 1) + '/' + c_obj.getDate()
            return new Date(a)
        }
    },
    setSchedule: function (currentObj) {
        var that = this
        var m = currentObj.getMonth() + 1
        var Y = currentObj.getFullYear()
        var d = currentObj.getDate();
        var dayString = Y + '/' + m + '/' + currentObj.getDate()
        var currentDayNum = new Date(Y, m, 0).getDate()
        var currentDayWeek = currentObj.getUTCDay() + 1
        var result = currentDayWeek - (d % 7 - 1);
        var firstKey = result <= 0 ? 7 + result : result;
        var currentDayList = []
        var f = 0
        for (var i = 0; i < 42; i++) {
            let data =[]
            if (i < firstKey - 1) {
                currentDayList[i] = ''
            } else {
                if (f < currentDayNum) {
                    currentDayList[i] = f + 1
                    f = currentDayList[i]
                } else if (f >= currentDayNum) {
                    currentDayList[i] = ''
                }
            }
        }
        that.setData({
            currentDayList: currentDayList
        })
    }
})