今天完成的事情:
1.当鼠标移动上去的时候高亮,
2.text和日历相互监听
1.的完成是建立在之前的基础上的,改变对应的类的:hover就行了。
2.主要是利用正则表达式,
在text内利用正则表达式控制输入的值,如果符合日期的格式且符合历法则传入然后转换成对应的年月日并控制日历变化成对应的日期
startCalendarText(val) {
//严格判断日期的正则表达式,包括闰年
let reg = /^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$/
//剔除‘-’直接判断值得大小
this.startDate = val.replace(/[^0-9]/ig , '')
if(val.match(reg) && (this.endDate > 0?this.startDate <= this.endDate:true)) {
let date = new Date(val)
this.startDateMessage = {
year: date.getFullYear(),
mouth: date.getMonth(),
date: date.getDate(),
}
}
},
明天要做的事情:
继续完善日历,
1.日历的日期根据上下左右键变化,
2.限制日历的变化,在text里面输入的时候日期的,end必须大于等于start,如果输入的end小于start,点击搜索的时候end就会等于start,日历上end小于start的部分不可点击,如果不可点击的部分包含今天,则今天的颜色变浅。
3.上传进度条,已经找到了解决方法~~
评论