此代码有严重的bug

1.(现在发现有bug,时间：2018年10月15日20:20:46，以后再改)

2.最近，小程序云开发来了，结合云开发我实现了一个签到功能。奈何技术不够，弄了大半天。

3.好，，我们进入正题：

4.签到功能--

5.我的想法：

6.1.结合云开发数据库特点，当点击敲签到时-向数据库插入记录来记录那天签到了。

7.2.进入签到详细页面，获取数据库里的记录，进行相应的算法设计（见下面详细设计）进行判断那天签到了，并显示出来。

8.（这里感谢两位大佬，1.部分ui用的是：https://color.weilanwl.com，

9.2.日历显示用的是：https://blog.csdn.net/qq_24308471/article/details/79481118博主）

10.首先先看一下我的效果：

11.

12.3.详细设计：

13.3.1点击签到向数据库插入数据

Singnin:function(){//先判断是否登录if(this.data.userInfo!='点击登录'){varmyDate=newDate();//获得当前时间if((myDate.getMonth()+1)10){varyu='0'+(myDate.getMonth()+1);}else{varyu=''+(myDate.getMonth()+1);}if(myDate.getDate()10){varri='0'+(myDate.getDate());}else{varri=''+(myDate.getDate());}constdb=wx.cloud.database()//引用数据库//签到数据存入数据库db.collection('signin').add({//data字段表示需新增的JSON数据data:{_id:'id_'+myDate.getFullYear()+yu+ri,//可选自定义_id，在此处场景下用数据库自动分配的就可以了date:newDate(""+myDate.getFullYear()+'-'+yu+'-'+ri),//签到时间done:true//是否签到},success:function(res){//res是一个对象，其中有_id字段标记刚创建的记录的idconsole.log("数据插入成功")},fail:function(res){console.log("数据插入失败")}})//跳到签到详细页wx.navigateTo({url:'../../pages/SignIn/SignIn'})}else{wx.showModal({title:'请先登录',content:'请先登录再签到'})}}

14.插入数据主要有：_id（_id:'id_'+myDate.getFullYear()+yu+ri,//用当前年月日来作为id）,那天签到date,done判断是否签到（其实有点多余，因为签到栏就插入了当天时间，这个没有必要）。

15.3.2获取数据

//index.js//获取应用实例constapp=getApp()Page({data:{year:0,month:0,date:['日','一','二','三','四','五','六'],dateArr:[],isToday:0,isTodayWeek:false,todayIndex:0,showLoading:true,//加载中dateR:[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,]},onLoad:function(){letnow=newDate();letyear=now.getFullYear();letmonth=now.getMonth()+1;this.dateInit();this.setData({year:year,month:month,isToday:''+year+month+now.getDate()})this.setData({showLoading:false,//加载中})varthat=this;constdb=wx.cloud.database()//引用数据库db.collection('signin').get({//数据读取，查询签到的记录，保存到ResD中success:function(res){//res.data包含该记录的数据console.log(res.data)that.setData({ResD:res.data})/**签到算法设计：**1.点击签到时向数据库里插入数据。*2.加载签到页面获取数据，并把数据保存到ResD。*3.用dateR（保存了当前月那天签到了）来与dateArr需要遍历的日历数组数据进行比较。*--*详细步骤：*1.先获得1号对应的星期几，再获得日历最后一天所在的位置。*2.获得数据库记录中id的长度,再用字符串截取倒数两位表示该月的几号（数据库里的记录id就是日期）*3.用两个计数器，i用来记录日历从第一个位置到日历最后一天所在的位置，j用来记录从数据库里获得的记录下标*4.利用for循环赋值，parseInt((that.data.ResD[j++]._id).substring(i_j-2,i_j)--截取)--转换，*把RseD中_id最后两位转换截取，并转换为数字。然后把parseInt((that.data.ResD[j++]._id).substring(i_j-2,i_j))*赋值给签到的位置。*5.签到的位置为：that.data.startWeek1号对应的星期几加上签到的号数parseInt((that.data.ResD[j++]._id).substring(i_j-2,i_j))*6.最后在wxml页面通过id与当天所在位置比较（item.dateNum==dateR[index]）来显示用户那天签到了*/vari_j=that.data.ResD[0]._id.length;//数据库记录中id的长度varj=0;//用来计数签到的天for(vari=that.data.arrLen-1;i=0;i--){that.data.dateR[(that.data.startWeek+parseInt(((that.data.ResD[j]._id).substring(i_j-2,i_j)-1)))]=parseInt((that.data.ResD[j++]._id).substring(i_j-2,i_j))//赋值that.setData({dateR:that.data.dateR})}}})},dateInit:function(setYear,setMonth){//全部时间的月份都是按0~11基准，显示月份才+1letdateArr=[];//需要遍历的日历数组数据letarrLen=0;//dateArr的数组长度letnow=setYear?newDate(setYear,setMonth):newDate();letyear=setYear||now.getFullYear();letnextYear=0;letmonth=setMonth||now.getMonth();//没有+1方便后面计算当月总天数letnextMonth=(month+1)11?1:(month+1);letstartWeek=newDate(year+','+(month+1)+','+1).getDay();//目标月1号对应的星期letdayNums=newDate(year,nextMonth,0).getDate();//获取目标月有多少天letobj={};letnum=0;if(month+111){nextYear=year+1;dayNums=newDate(nextYear,nextMonth,0).getDate();}arrLen=startWeek+dayNums;for(leti=0;iarrLen;i++){if(i=startWeek){num=i-startWeek+1;obj={isToday:''+year+(month+1)+num,dateNum:num,}}else{obj={};}dateArr[i]=obj;}this.setData({dateArr:dateArr})this.setData({arrLen:arrLen,//日历最后一天所在的位置，startWeek:startWeek////目标月1号对应的星期})letnowDate=newDate();letnowYear=nowDate.getFullYear();letnowMonth=nowDate.getMonth()+1;letnowWeek=nowDate.getDay();letgetYear=setYear||nowYear;letgetMonth=setMonth=0?(setMonth+1):nowMonth;if(nowYear==getYear&&nowMonth==getMonth){this.setData({isTodayWeek:true,todayIndex:nowWeek})}else{this.setData({isTodayWeek:false,todayIndex:-1})}},lastMonth:function(){//全部时间的月份都是按0~11基准，显示月份才+1letyear=this.data.month-20?this.data.year-1:this.data.year;letmonth=this.data.month-20?11:this.data.month-2;this.setData({year:year,month:(month+1)})this.dateInit(year,month);},nextMonth:function(){//全部时间的月份都是按0~11基准，显示月份才+1letyear=this.data.month11?this.data.year+1:this.data.year;letmonth=this.data.month11?0:this.data.month;this.setData({year:year,month:(month+1)})this.dateInit(year,month);}})

16.这是签到页面的详细js代码，其中还包括了我的详细设计：

17./**签到算法设计：

18.*

19.*1.点击签到时向数据库里插入数据。

20.*2.加载签到页面获取数据，并把数据保存到ResD。

21.*3.用dateR（保存了当前月那天签到了）来与dateArr需要遍历的日历数组数据进行比较。

22.*--

23.*详细步骤：

24.*1.先获得1号对应的星期几，再获得日历最后一天所在的位置。

25.*2.获得数据库记录中id的长度,再用字符串截取倒数两位表示该月的几号（数据库里的记录id就是日期）

26.*3.用两个计数器，i用来记录日历从第一个位置到日历最后一天所在的位置，j用来记录从数据库里获得的记录下标

27.*4.利用for循环赋值，parseInt((that.data.ResD[j++]._id).substring(i_j-2,i_j)--截取)--转换，

28.*把RseD中_id最后两位转换截取，并转换为数字。然后把parseInt((that.data.ResD[j++]._id).substring(i_j-2,i_j))

29.*赋值给签到的位置。

30.*5.签到的位置为：that.data.startWeek1号对应的星期几加上签到的号数parseInt((that.data.ResD[j++]._id).substring(i_j-2,i_j))

31.*6.最后在wxml页面通过id与当天所在位置比较（item.dateNum==dateR[index]）来显示用户那天签到了

32.*/