时间控件多场景应用

第一种：开始时间可选 结束时间不可选 且开始时间只能选自然周的周一

//起止时间相差7天

var curDate = new Date();
var endDate= new Date(curDate.getTime() - 24*60*60*1000)

$("#datepicker").myDatePicker({
    'startDate':'2014-01-01 18:45:20',
    'endDate':(endDate).Format("yyyy-mm-dd hh:ii:ss"),
    //指定父元素，不指定默认为body
    parent:$("#datepicker").parent()
});

let _radio=$(" input[name='dateType']");
let _input=$(" #datepicker");
_input[0].resetDatePicker({
	'view':3,
});
var d = $("#datepicker").val()
var _date = d.split("-");
$("#datepicker-01").val(moment(new Date(_date).getTime()+6*24*60*60*1000).format('YYYY-MM-DD'))

//改变时间触发事件
_input.on('blur',function(){
	var d = $("#datepicker-1").val()
	var _date = d.split("-");
	$("#datepicker-01").val(moment(new     
    Date(_date).getTime()+6*24*60*60*1000).format('YYYY-MM-DD'))
});

第二种：从五个维度切换时间：昨天、最近7天、最近30天、上个季度、自定义

var start = moment().subtract(6, 'days');
var end = moment();

function cb(start, end) {
    $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
    }

$('#datepicker-filter').daterangepicker({
    locale: { //汉化   
        format: "YYYY/MM/DD", //设置显示格式
        applyLabel: '确定', //确定按钮文本
        cancelLabel: '取消', //取消按钮文本
        customRangeLabel: "自定义",
        daysOfWeek: ['日', '一', '二', '三', '四', '五', '六'],
        monthNames: ['一月', '二月', '三月', '四月', '五月', '六月',
        '七月', '八月', '九月', '十月', '十一月', '十二月']
   },
   startDate: start,
   endDate: end,
   ranges: {
            '昨天': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
            '最近7天': [moment().subtract(6, 'days'), moment() ],
            '最近30天': [moment().subtract(29, 'days'), moment()],
            '上个季度':[moment().quarter(moment().quarter() - 1).startOf('quarter').valueOf(), moment().quarter(moment().quarter() - 1).endOf('quarter').valueOf()]

   }
}, cb);
cb(start, end);
    
    //请求参数取值
    var arrTime = $("#datepicker-filter").val().trim().split('-');
    data.startTime = arrTime[0];
    data.endTime = arrTime[1].replace(/\s+/g,""); 

第三种：选择月份  如果当前时间是每月的一号，则不能选当月

    function time(date) {
        var y = date.getFullYear();
        var m = date.getMonth() + 1;
        m = m < 10 ? '0' + m : m;
        var d = date.getDate()
        d = d < 10 ? '0' + d : d
        return y + '-' + m + '-' + d;
    }
    var nowTime = ''    
    var datepicker_Dates = time(new Date())
    
    if(new Date(datepicker_Dates).getDate() == 1){
        nowTime = moment().month(moment().month() - 1).startOf('month').format('YYYY-MM');  
    }else{
        nowTime = moment().startOf('month').format('YYYY-MM');
    }
    data.timeInterval = nowTime
    $('#datepicker').val(nowTime)
    $('#datepicker').datepicker({    
        format: 'yyyy-mm',
        autoclose:true,
        startView: 1,
        minViewMode: 1,
        maxViewMode: 2,
        language: 'zh-CN',
        endDate:nowTime //控制可选的最晚月份，为当前月
    });