参考了小友那个谁的，具体也忘记了，改be改be即用了，因为是日历，里面有一个算空格的地方，嘻嘻~，也是小友提供的，再次感谢！

html：

<view><view class="flex flex-wrap padding bg-white justify-center"><view class="t-txt text-orange margin-top">挑战连续签到30天</view><view class="w-text text-blue">挑战签到任务，领取更多奖励</view></view><view class="padding"><view class="flex justify-between padding bg-white radius"><view class="jhx_f4">签到记录</view><text class="q-text">已签到{{signDays}}天</text></view><view class="calendar"><view class="time"><view><text class="t_blue">{{year}}</text>年<text class="t_blue">{{month}}</text>月<text class="t_blue">{{date}}</text>日</view></view><view class="weekName"><view>日</view><view class="monday">一</view><view class="tuesday">二</view><view class="wednesday">三</view><view class="thursday">四</view><view class="friday">五</view><view>六</view></view><view class="week"><!-- 填补空格--><view wx:for="{{nbsp}}" wx:key="index" style="color:#fff;">空</view><view wx:for="{{calendarSignData}}" wx:key="index"><text wx:if="{{item.sign}}" class="qiandao iconfont icon-qiandaolingjiang"></text><text wx:else>{{item.monthDay}}</text> </view></view><view class="calendarSign"><button size="large" wx:if="{{!isSign}}" bindtap="calendarSign">签到</button><button size="large" wx:else bindtap="calendarSign">今日已签到</button></view></view></view><view class="padding bg-white"><view>签到规则：</view><view class="tips"><view>{{rules}}</view></view></view>
</view>

---

js：

const util = require('../../../utils/util.js');
const api = require('../../../config/api.js');const app = getApp();
var that;Page({data: {year: '',month: '',nbsp: '',date: '',monthDaySize: '',calendarSignData: [],continueSignDays: 0,signDays: 0,rules: [],isSign: false   //今日签到状态},//签到calendarSign() {let date = this.getNowFormatDate();util.request(api.SignCheckIn, {yearMonthDay: date}).then(res=> {if (res.errno === 0) {this.getCheckedInRecord(this.data.year, this.data.month, this.data.monthDaySize);wx.showToast({title: '签到成功',icon: 'success',duration: 2000})this.getMonthSign(this.data.year, this.data.month);  //签到汇总}});},//当前时间getNowFormatDate() {let date = new Date();let seperator1 = "-";let month = date.getMonth() + 1;let strDate = date.getDate();if (month >= 1 && month <= 9) {month = "0" + month;}if (strDate >= 0 && strDate <= 9) {strDate = "0" + strDate;}let currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate;return currentdate;},//获取已签到日期getCheckedInRecord(year, month, monthDaySize) {const yearMonth = year+'-'+month; const date = that.data.date>9? that.data.date: '0'+that.data.date;const Tdate = year+'-'+month+'-'+date;util.request(api.SignRecord, {yearMonth: yearMonth}).then(res=> {if (res.errno === 0) {const todayInfo = res.data.find(item=>{ return item.date == Tdate})this.setData({calendarSignData: res.data,isSign: todayInfo.sign})}});},// 签到汇总数据getMonthSign(year, month) {const date = year+'-'+month;    util.request(api.signInfo).then(res=> {if (res.errno === 0) {console.log(res.data)this.setData({// continueSignDays: res.data.continueSignDays,calendarSignData: res.data.signCalendar,signDays: res.data.signDays,rules: res.data.rules})}}).catch(err=>{console.log(err)});},//初始化init() {let mydate = new Date(); //本地时间let year = mydate.getFullYear(); //年let month = mydate.getMonth() + 1; //月let date = mydate.getDate(); //今日let monthDaySize; //天数if(month == 1||month == 3||month == 5||month == 7||month == 8||month == 10||month == 12) {monthDaySize = 31;} else if (month == 4|| month == 6|| month == 9|| month == 11) {monthDaySize = 30;} else if (month == 2) { //计算是否是闰年,如果是二月份则是29天if ((year - 2000) % 4 == 0) {monthDaySize = 29;} else {monthDaySize = 28;}};var day = new Date(year,month-1,1);let nbsp = day.getDay(); //空格this.setData({year: year,month: month,nbsp: nbsp,date: date,monthDaySize: monthDaySize})this.getCheckedInRecord(year, month, monthDaySize) //获取已签到日期this.getMonthSign(year, month);  //签到汇总},onLoad() {that = this;that.init() //初始化}
})

---

css：

.t-txt{font-size: 50rpx;margin-bottom: 10rpx;
}.w-text{font-size: 26rpx;
}.q-text{font-size: 26rpx;
}.calendar {padding: 10rpx;border-radius: 15rpx;background-color: #fff;
}
.time {display: flex;align-items: center;padding: 20rpx 20rpx 0 20rpx;text-align: center;border-top-left-radius: 15rpx;border-top-right-radius: 15rpx;background-color: #fff;
}
.time view {flex: 1;font-size: 38rpx;font-weight: bold;color: #f95c4b;
}
.weekName {display: flex;font-size: 30rpx;padding: 16rpx 0;margin: 15rpx 15rpx 0 15rpx;border-top-left-radius: 15rpx;border-top-right-radius: 15rpx;background-color: #f95c4b;
}
.weekName view {flex: 1;text-align: center;color: #fff;
}
.week {margin: 0 15rpx 15rpx 15rpx;font-size: 30rpx;
}
.week view {width: 14.2%;height: 70rpx;line-height: 70rpx;display: inline-block;margin: 10rpx 0;text-align: center;
}
.week view text {width: 100%;height: 100%;display: inline-block;font-family: '微软雅黑';
}
.calendarSign {margin: 20rpx;
}.qiandao{font-size: 38rpx;font-weight: 600;color: #f95c4b;
}button{padding:20rpx;margin:0;line-height:normal;background-color:#f8f8f8;}.tips{line-height: 40rpx;margin-top: 10rpx;
}