小程序时间预约

1.功能介绍

1.单击按钮弹出日期选择

2.单击日期选择外的空白部分以关闭选择

3.预约最后一周

4.超出当前时间的时间点不可选（如果当前时间为10:xx，则10点之前的时间不可选）

2.渲染

图像.png

3.逻辑

第页({

数据：{

//日期

timeList:[]，

//预订天数

yyDay:30，

//任命期限

小时列表：[{hour:“8:00”，n:8，isShow:true}，

｛小时：“9:00”，n:9，isShow:true｝，

{小时：“10:00”，n:10，isShow:真}，

｛小时：“12:00”，n:11，isShow:真｝，

{小时：“13:00”，n:13，isShow:真}，

{小时：“14:00”，n:14，isShow:真}，

{小时：“15:00”，n:15，isShow:真}，

｛小时：“16:00”，n:16，isShow:真｝，

{小时：“17:00”，n:17，isShow:真}，

{小时：“18:00”，n:18，isShow:真}，

｛小时：“19:00”，n:19，isShow:真｝

],

//是否显示

timeShow：假，

当前选项卡：0，

//选择时间

chooseHour:“”，

//选择日期

选择时间：“”，

小时索引：-1

},

//弹出按钮

showTimeModel:函数（）{

this.set数据({

timeShow:！此数据时间显示，

chooseTime：this.data.timeList[0].date，

});

},

//单击外部取消

modelCancel:函数（）{

this.set数据({

timeShow:！此数据时间显示，

chooseTime：this.data.timeList[0].date，

});

},

//日期选择

timeClick:函数（e）{

//不是今天-不要判断是否超过当前时间点（可以选择所有时间点）

如果（e.currentTarget.dataset.index！=0）{

var列表=this.data.hourList；

对于（var i=0；i<列表长度；i++）{

列表[i]。isShow=真；

}

this.set数据({

小时列表：列表

})

}其他{

//今天-过期不可预订

var hour=新日期（）.getHours（）；

对于（var i=0；i

var列表=this.data.hourList；

if（this.data.hourList[i].n<=小时）{

列表[i]。isShow=假；

this.set数据({

小时列表：列表

})

}

}

}

this.set数据({

当前选项卡：e.currentTarget.dataset.index，

chooseTime：this.data.timeList[e.currentTarget.dataset.index].date，

chooseHour:“”，

小时索引：-1

});

console.log（this.data.chooseTime）

},

//时间选择

小时单击：函数（e）{

var=这个；

//无法选择时间

if（！e.currentTarget.dataset.isshow）{

返回false；

}

this.set数据({

小时索引：e.currentTarget.dataset.index，

chooseHour:this.data.hourList[e.currentTarget.dataset.index].hour

});

var chooseTime=新日期（）。getFullYear（）+“-”+此数据。选择时间+“”+this.data.chooseHour

console.log（选择时间）

},

onLoad:函数（选项）{

日期.原型。格式=函数