calendar.js 6.48 KB
import util from '../../../utils/util';
Component({
	properties:{
		date:{
			type:String,
			value:util.unixtoTime(new Date()/1000,'YYYY-MM-DD'),
		},
		marklist:{
			type:Array,
			value:[]
		}
	},
	data: {
		showprev:false
	},
	observers: {
		'date': function(newdate,newmarklist) {
			let showYearMonth=this.getshowmonth();
			let obj={
				...showYearMonth,
				action:'defalut'
			}
			if(newdate!=''){
				if(this.data.showYearMonth){     //周历点击
					if(showYearMonth.showyear==this.data.showYearMonth.showyear && showYearMonth.showmonth==this.data.showYearMonth.showmonth){
						this.changedatestyle(newdate);
					}else{
						this.setData({
							showYearMonth:showYearMonth,
							showprev:this.isShowPrev(showYearMonth)
						})
						this.getdayslist(showYearMonth.showyear,showYearMonth.showmonth);
						this.triggerEvent('tellmonth',obj);
						
					}
				}else{
					//初始化---默认
					console.log('默认')
					this.setData({
						showYearMonth:showYearMonth,
						showprev:this.isShowPrev(showYearMonth)
					})
					this.getdayslist(showYearMonth.showyear,showYearMonth.showmonth);
					this.triggerEvent('tellmonth',obj);
				}
				
			}
			
		},
		'marklist'(newmarklist){
			if(this.data.daylist){
				this.markdaylist(newmarklist)
			}
		}
	},
	attached(){
		this.getweeklist();
	},
    ready(){
    },
	detached(){
		console.log('在组件实例被从页面节点树移除时执行')
	},
	methods:{
		//获取当前选中日期
		getshowmonth(){
			let datearr=this.data.date.split('-');
			return{
				showyear:Number(datearr[0]),
				showmonth:Number(datearr[1]),
			}
		},
		//获得周列表
		getweeklist(){
			let week=['日','一','二','三','四','五','六'];
			let weeklist=[];
			for(let i=0;i<week.length;i++){
				weeklist.push({
					weekfont:week[i],
					weeknum:i
				})
			}
			this.setData({
				weeklist:weeklist,
			})
		},
		//获取显示月份天数
		getMonthdays(year,month){
		    var d = new Date(year,month,0);
		    return d.getDate();
		},
		//获取某一天是星期几
		getdayweek:function(year,month,day){
		    var tmpdate=new Date(year,month-1,day);
		    return tmpdate.getDay()
		},
		//获取当月日期
		getdayslist(year,month){
			this.today={
				curdate:util.unixtoTime(new Date()/1000,'YYYY-MM-DD'),
				curtimestamp:new Date()/1000
			}
			//当前显示月份天数
			let monthdays=this.getMonthdays(year,month);
			//当前月1号星期几
			let dayweek=this.getdayweek(year,month,1);
			let daylist=[];
			//多少行
			let singlelen=Math.ceil((monthdays+dayweek)/7);
			for(let i=0;i<singlelen;i++){
				daylist.push({
					list:[]
				})
			}
			//本月日期
			for(let i=0;i<singlelen*7;i++){
				let thisdayobj={};
				if(i>=dayweek && i<monthdays+dayweek){
					let thisday=i-dayweek+1;
					let thisdate=year+'-'+(month<10 ? '0'+month : month)+'-'+(thisday<10 ? '0'+thisday : thisday);
					let thistimestamp=Number(util.timetouUnix(thisdate+' 00:00:00'));
					thisdayobj={
						year:year,
						month:month,
						day:thisday,
						week:i%7,
						date:thisdate,
						istoday:false,
						overdate:thistimestamp<=(new Date()/1000)-86400 ? true : false,         //日期是否过期,
					}
					if(thisdate==this.today.curdate){
						thisdayobj.automark=true;
						thisdayobj.istoday=true;
						thisdayobj.mark='今'
					}
					if(util.unixtoTime(this.today.curtimestamp+86400,'YYYY-MM-DD')==thisdate){
						thisdayobj.automark=true;
						thisdayobj.mark='明'
					}
					thisdayobj.isselected=this.data.date==thisdate ? true : false;
				}
				daylist[Math.floor(i/7)].list.push(thisdayobj)
			}
			this.setData({
				daylist:daylist
			})
			console.log(daylist)
		},
		//选择日期
		selectdate(e){
			let _target=e.currentTarget.dataset;
			this.changedatestyle(_target.date);
			this.triggerEvent('tellselectdate',{date:_target.date,action:'click'});
		},
		//修改日期列表
		changedatestyle(selecteddate){
			let daylist=this.data.daylist;
			let prevsingle,previndex,cursingle,curindex;
			daylist.forEach((v,i)=>{
				v.list.forEach((r,n)=>{
					if(r.isselected){
						prevsingle=i;
						previndex=n;
						let prevkey='daylist['+prevsingle+'].list['+previndex+'].isselected';
						this.setData({
							[prevkey]:false,
						})
					}
					if(r.date==selecteddate){
						cursingle=i;
						curindex=n;
					}
				})
			})
			let currentkey='daylist['+cursingle+'].list['+curindex+'].isselected';
			this.setData({
				[currentkey]:true
			})
		},
		//计算是否显示prev
		isShowPrev(showYearMonth){
			let curyear=new Date().getFullYear();
			let curmonth=new Date().getMonth() + 1;
			let curtitle=''+curyear+(curmonth<10 ? '0'+curmonth : curmonth);
			let showtitle=''+showYearMonth.showyear+(showYearMonth.showmonth< 10 ? '0'+showYearMonth.showmonth : showYearMonth.showmonth)
			return Number(showtitle)>Number(curtitle);
		},
		//回退月份
		prevmonth(){
			var showyear=this.data.showYearMonth.showyear;
			var showmonth=this.data.showYearMonth.showmonth;
			if(showmonth==1){
			      showmonth=12;
			      showyear=showyear-1;
			}else{
			     showmonth-=1;
			}
			let showYearMonth={
				showyear:showyear,
				showmonth:showmonth
			}
			let obj={
				...showYearMonth,
				action:'click'
			}
			this.setData({
				showYearMonth:showYearMonth,
				showprev:this.isShowPrev(showYearMonth)
			})
			this.getdayslist(showYearMonth.showyear,showYearMonth.showmonth);
			this.triggerEvent('tellmonth',obj);
		},
		//推前月份
		nextmonth(){
			var showyear=this.data.showYearMonth.showyear;
			var showmonth=this.data.showYearMonth.showmonth;
			if(showmonth==12){
			    showmonth=1;
			    showyear=showyear+1;
			}else{
			    showmonth+=1;
			}
			let showYearMonth={
				showyear:showyear,
				showmonth:showmonth
			}
			this.setData({
				showYearMonth:showYearMonth,
				showprev:this.isShowPrev(showYearMonth)
			})
			this.getdayslist(showYearMonth.showyear,showYearMonth.showmonth);
			let obj={
				...showYearMonth,
				action:'click'
			}
			this.triggerEvent('tellmonth',obj);
		},
		//标记满房
		markdaylist(marklist){
			console.log('xxxxxx')
			let daylist=this.data.daylist;
			daylist.forEach((v,i)=>{
				v.list.forEach((r,n)=>{
					if(r.mark){
						if(r.automark){
							if(r.mark!='今' || r.mark!='明'){
								if(r.istoday){
									r.mark='今'
								}else{
									r.mark='明'
								}
							}
						}else{
							r.mark=null	
						}
					}
					marklist.forEach((r1,n1)=>{
						if(r.date && r1.date==r.date){
							r.mark=r1.mark
						}
					})
				})
			})
			this.setData({
				daylist:daylist
			})
		},
    }
  
})