升级了laydatePlus组件,基于layui的laydate组件扩展,选取日期时间更快捷方便。
This commit is contained in:
parent
18b2d60920
commit
bb7cff81bd
@ -1,37 +1,6 @@
|
|||||||
layui.define(['layer'],function(exports){
|
layui.define(['layer'],function(exports){
|
||||||
//提示:模块也可以依赖其它模块,如:layui.define('layer', callback);
|
//提示:模块也可以依赖其它模块,如:layui.define('layer', callback);
|
||||||
let layer = layui.layer,laydate = layui.laydate, form = layui.form, dropdown = layui.dropdown;
|
let laydate = layui.laydate;
|
||||||
//输出时间样式为 yyyy-mm-dd hh:mm:ss,不满 2 位则前面添 0;
|
|
||||||
function add0(m) {
|
|
||||||
return m < 10 ? '0' + m : m
|
|
||||||
};
|
|
||||||
//获取某月天数
|
|
||||||
function getMonthDays(year, month) {
|
|
||||||
var new_year = year,nextMonth = month++;
|
|
||||||
if (month > 12) {
|
|
||||||
nextMonth -= 12; //月份减
|
|
||||||
new_year++; //年份增
|
|
||||||
}
|
|
||||||
var nextMonthFirstDay = new Date(new_year, nextMonth, 1);
|
|
||||||
//下个月第一天
|
|
||||||
var oneDay = 1000 * 60 * 60 * 24;
|
|
||||||
var dateString = new Date(nextMonthFirstDay - oneDay);
|
|
||||||
var dateTime = dateString.getDate();
|
|
||||||
return dateTime;
|
|
||||||
};
|
|
||||||
|
|
||||||
function getPriorMonthFirstDay(year, month) {
|
|
||||||
//年份为0代表,是本年的第一月,所以不能减
|
|
||||||
if (month == 0) {
|
|
||||||
month = 11; //月份为上年的最后月份
|
|
||||||
year--; //年份减1
|
|
||||||
return new Date(year, month, 1);
|
|
||||||
}
|
|
||||||
//否则,只减去月份
|
|
||||||
month--;
|
|
||||||
return new Date(year, month, 1);
|
|
||||||
};
|
|
||||||
|
|
||||||
const opts={
|
const opts={
|
||||||
"target":'laydateplus',
|
"target":'laydateplus',
|
||||||
"callback": null
|
"callback": null
|
||||||
@ -46,234 +15,159 @@ layui.define(['layer'],function(exports){
|
|||||||
laydatePlus.prototype = {
|
laydatePlus.prototype = {
|
||||||
init: function () {
|
init: function () {
|
||||||
var me = this;
|
var me = this;
|
||||||
var data = [
|
|
||||||
{'id':1,'title':'今天'},
|
|
||||||
{'id':2,'title':'昨天'},
|
|
||||||
{'id':3,'title':'最近7天'},
|
|
||||||
{'id':4,'title':'最近30天'},
|
|
||||||
{'id':5,'title':'本周'},
|
|
||||||
{'id':6,'title':'上周'},
|
|
||||||
{'id':7,'title':'本月'},
|
|
||||||
{'id':8,'title':'上月'},
|
|
||||||
{'id':100,'title':'自定义'},
|
|
||||||
];
|
|
||||||
dropdown.render({
|
|
||||||
elem: '#'+this.settings.target,
|
|
||||||
show: true,
|
|
||||||
data: data,
|
|
||||||
click: function (data, othis) {
|
|
||||||
me.select(data.id);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
select:function(select_type){
|
|
||||||
let me = this;
|
|
||||||
let res=[];
|
|
||||||
//快速选择触发事件
|
|
||||||
switch (select_type) {
|
|
||||||
default:
|
|
||||||
laydate.render({
|
|
||||||
elem: '#'+this.settings.target,
|
|
||||||
type: 'datetime',
|
|
||||||
range: '~',
|
|
||||||
trigger: 'none',
|
|
||||||
show:true
|
|
||||||
});
|
|
||||||
case 1:
|
|
||||||
res = me.getTodayDate();
|
|
||||||
break;
|
|
||||||
case 2:
|
|
||||||
res = me.getYesterdayDate();
|
|
||||||
break;
|
|
||||||
case 3:
|
|
||||||
res = me.getLastSevenDate();
|
|
||||||
break;
|
|
||||||
case 4:
|
|
||||||
res = me.getLastThirtyDate();
|
|
||||||
break;
|
|
||||||
case 5:
|
|
||||||
res = me.getCurrentWeek();
|
|
||||||
break;
|
|
||||||
case 6:
|
|
||||||
res = me.getLastWeek();
|
|
||||||
break;
|
|
||||||
case 7:
|
|
||||||
res = me.getCurrentMonth();
|
|
||||||
break;
|
|
||||||
case 8:
|
|
||||||
res = me.getLastMonth();
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
if(res.length>0){
|
|
||||||
$('#'+this.settings.target).val(res.join(' ~ '));
|
|
||||||
}
|
|
||||||
},
|
|
||||||
//获取当天开始时间结束时间
|
|
||||||
getTodayDate: function () {
|
|
||||||
var today = [];
|
|
||||||
var todayDate = new Date();
|
|
||||||
var y = todayDate.getFullYear();
|
|
||||||
var m = todayDate.getMonth() + 1;
|
|
||||||
var d = todayDate.getDate();
|
|
||||||
var s = y + '-' + add0(m) + '-' + add0(d) + ' 00:00:00';//今日开始
|
|
||||||
var e = y + '-' + add0(m) + '-' + add0(d) + ' 23:59:59';//今日结束
|
|
||||||
return {'start':s,'end':e};
|
|
||||||
},
|
|
||||||
//获取昨天时间
|
|
||||||
getYesterdayDate: function () {
|
|
||||||
var dateTime = [];
|
|
||||||
var today = new Date();
|
|
||||||
var yesterday = new Date(today.setTime(today.getTime() - 24 * 60 * 60 * 1000));
|
|
||||||
var y = yesterday.getFullYear();
|
|
||||||
var m = yesterday.getMonth() + 1;
|
|
||||||
var d = yesterday.getDate();
|
|
||||||
var s = y + '-' + add0(m) + '-' + add0(d) + ' 00:00:00';//开始
|
|
||||||
var e = y + '-' + add0(m) + '-' + add0(d) + ' 23:59:59';//结束
|
|
||||||
return [s,e];
|
|
||||||
},
|
|
||||||
//获取最近7天时间
|
|
||||||
getLastSevenDate: function () {
|
|
||||||
var dateTime = [];
|
|
||||||
var today = new Date();
|
|
||||||
var sevenFirstDay = new Date(today.setTime(today.getTime() - 7 * 24 * 60 * 60 * 1000));
|
|
||||||
var y = sevenFirstDay.getFullYear();
|
|
||||||
var m = sevenFirstDay.getMonth() + 1;
|
|
||||||
var d = sevenFirstDay.getDate();
|
|
||||||
var s = y + '-' + add0(m) + '-' + add0(d) + ' 00:00:00';//开始
|
|
||||||
var e = this.getTodayDate();//结束
|
|
||||||
return [s,e.end];
|
|
||||||
},
|
|
||||||
//获取最近30天时间
|
|
||||||
getLastThirtyDate: function () {
|
|
||||||
var dateTime = [];
|
|
||||||
var today = new Date();
|
|
||||||
var thirtyFirstDay = new Date(today.setTime(today.getTime() - 30 * 24 * 60 * 60 * 1000));
|
|
||||||
var y = thirtyFirstDay.getFullYear();
|
|
||||||
var m = thirtyFirstDay.getMonth() + 1;
|
|
||||||
var d = thirtyFirstDay.getDate();
|
|
||||||
var s = y + '-' + add0(m) + '-' + add0(d) + ' 00:00:00';//开始
|
|
||||||
var e = this.getTodayDate();//结束
|
|
||||||
return [s,e.end];
|
|
||||||
},
|
|
||||||
//获取本周开始时间结束时间
|
|
||||||
getCurrentWeek: function () {
|
|
||||||
var startStop = new Array();
|
|
||||||
//获取当前时间
|
|
||||||
var currentDate = new Date();
|
|
||||||
//返回date是一周中的某一天
|
|
||||||
var week = currentDate.getDay();
|
|
||||||
//返回date是一个月中的某一天
|
|
||||||
var month = currentDate.getDate();
|
|
||||||
//一天的毫秒数
|
|
||||||
var millisecond = 1000 * 60 * 60 * 24;
|
|
||||||
//减去的天数
|
|
||||||
var minusDay = week != 0 ? week - 1 : 6;
|
|
||||||
//alert(minusDay);
|
|
||||||
//本周 周一
|
|
||||||
var monday = new Date(currentDate.getTime() - (minusDay * millisecond));
|
|
||||||
//本周 周日
|
|
||||||
var sunday = new Date(monday.getTime() + (6 * millisecond));
|
|
||||||
var sy = monday.getFullYear();
|
|
||||||
var sm = monday.getMonth() + 1;
|
|
||||||
var sd = monday.getDate();
|
|
||||||
var ey = sunday.getFullYear();
|
|
||||||
var em = sunday.getMonth() + 1;
|
|
||||||
var ed = sunday.getDate();
|
|
||||||
var s = sy + '-' + add0(sm) + '-' + add0(sd) + ' 00:00:00';//开始
|
|
||||||
var e = ey + '-' + add0(em) + '-' + add0(ed) + ' 23:59:59';//结束
|
|
||||||
return [s,e];
|
|
||||||
},
|
|
||||||
//获取上周时间
|
|
||||||
getLastWeek: function () {
|
|
||||||
//起止日期数组
|
|
||||||
var startStop = new Array();
|
|
||||||
//获取当前时间
|
|
||||||
var currentDate = new Date();
|
|
||||||
//返回date是一周中的某一天
|
|
||||||
var week = currentDate.getDay();
|
|
||||||
//返回date是一个月中的某一天
|
|
||||||
var month = currentDate.getDate();
|
|
||||||
//一天的毫秒数
|
|
||||||
var millisecond = 1000 * 60 * 60 * 24;
|
|
||||||
//减去的天数
|
|
||||||
var minusDay = week != 0 ? week - 1 : 6;
|
|
||||||
//获得当前周的第一天
|
|
||||||
var currentWeekDayOne = new Date(currentDate.getTime() - (millisecond * minusDay));
|
|
||||||
//上周最后一天即本周开始的前一天
|
|
||||||
var priorWeekLastDay = new Date(currentWeekDayOne.getTime() - millisecond);
|
|
||||||
//上周的第一天
|
|
||||||
var priorWeekFirstDay = new Date(priorWeekLastDay.getTime() - (millisecond * 6));
|
|
||||||
var sy = priorWeekFirstDay.getFullYear();
|
|
||||||
var sm = priorWeekFirstDay.getMonth() + 1;
|
|
||||||
var sd = priorWeekFirstDay.getDate();
|
|
||||||
var ey = priorWeekLastDay.getFullYear();
|
|
||||||
var em = priorWeekLastDay.getMonth() + 1;
|
|
||||||
var ed = priorWeekLastDay.getDate();
|
|
||||||
var s = sy + '-' + add0(sm) + '-' + add0(sd) + ' 00:00:00';//开始
|
|
||||||
var e = ey + '-' + add0(em) + '-' + add0(ed) + ' 23:59:59';//结束
|
|
||||||
return [s,e];
|
|
||||||
},
|
|
||||||
//获取本月时间
|
|
||||||
getCurrentMonth: function () {
|
|
||||||
//起止日期数组
|
|
||||||
var startStop = new Array();
|
|
||||||
//获取当前时间
|
|
||||||
var currentDate = new Date();
|
|
||||||
//获得当前月份0-11
|
|
||||||
var currentMonth = currentDate.getMonth();
|
|
||||||
//获得当前年份4位年
|
|
||||||
var currentYear = currentDate.getFullYear();
|
|
||||||
//求出本月第一天
|
|
||||||
var firstDay = new Date(currentYear, currentMonth, 1);
|
|
||||||
|
|
||||||
//当为12月的时候年份需要加1
|
let shortcuts = [
|
||||||
//月份需要更新为0 也就是下一年的第一个月
|
{
|
||||||
if (currentMonth == 11) {
|
text: "昨天",
|
||||||
currentYear++;
|
value: function(){
|
||||||
currentMonth = 0; //就为
|
var value = [];
|
||||||
} else {
|
var date1 = new Date();
|
||||||
//否则只是月份增加,以便求的下一月的第一天
|
date1.setDate(date1.getDate() - 1);
|
||||||
currentMonth++;
|
date1.setHours(0, 0, 0, 0);
|
||||||
}
|
value.push(date1);
|
||||||
//一天的毫秒数
|
var date2 = new Date();
|
||||||
var millisecond = 1000 * 60 * 60 * 24;
|
date2.setDate(date2.getDate() - 1);
|
||||||
//下月的第一天
|
date2.setHours(23, 59, 59, 999);
|
||||||
var nextMonthDayOne = new Date(currentYear, currentMonth, 1);
|
value.push(new Date(date2));
|
||||||
//求出上月的最后一天
|
return value;
|
||||||
var lastDay = new Date(nextMonthDayOne.getTime() - millisecond);
|
}()
|
||||||
var sy = firstDay.getFullYear();
|
},
|
||||||
var sm = firstDay.getMonth() + 1;
|
{
|
||||||
var sd = firstDay.getDate();
|
text: "今天",
|
||||||
var ey = lastDay.getFullYear();
|
value: function(){
|
||||||
var em = lastDay.getMonth() + 1;
|
var value = [];
|
||||||
var ed = lastDay.getDate();
|
var date1 = new Date();
|
||||||
var s = sy + '-' + add0(sm) + '-' + add0(sd) + ' 00:00:00';//开始
|
date1.setDate(date1.getDate());
|
||||||
var e = ey + '-' + add0(em) + '-' + add0(ed) + ' 23:59:59';//结束
|
date1.setHours(0, 0, 0, 0);
|
||||||
return [s,e];
|
value.push(date1);
|
||||||
},
|
var date2 = new Date();
|
||||||
//获取上月时间
|
date2.setDate(date2.getDate());
|
||||||
getLastMonth: function () {
|
date2.setHours(23, 59, 59, 999);
|
||||||
var startStop = new Array();
|
value.push(new Date(date2));
|
||||||
//获取当前时间
|
return value;
|
||||||
var currentDate = new Date();
|
}()
|
||||||
//获得当前月份0-11
|
},
|
||||||
var currentMonth = currentDate.getMonth();
|
{
|
||||||
//获得当前年份4位年
|
text: "最近7天",
|
||||||
var currentYear = currentDate.getFullYear();
|
value: function(){
|
||||||
//获得上一个月的第一天
|
var value = [];
|
||||||
var priorMonthFirstDay = getPriorMonthFirstDay(currentYear, currentMonth);
|
var date1 = new Date();
|
||||||
//获得上一月的最后一天
|
date1.setDate(date1.getDate() - 7);
|
||||||
var priorMonthLastDay = new Date(priorMonthFirstDay.getFullYear(), priorMonthFirstDay.getMonth(),
|
date1.setHours(0, 0, 0, 0);
|
||||||
getMonthDays(priorMonthFirstDay.getFullYear(), priorMonthFirstDay.getMonth()));
|
value.push(date1);
|
||||||
var sy = priorMonthFirstDay.getFullYear();
|
var date2 = new Date();
|
||||||
var sm = priorMonthFirstDay.getMonth() + 1;
|
date2.setDate(date2.getDate() - 7);
|
||||||
var sd = priorMonthFirstDay.getDate();
|
date2.setHours(23, 59, 59, 999);
|
||||||
var ey = priorMonthLastDay.getFullYear();
|
value.push(new Date(date2));
|
||||||
var em = priorMonthLastDay.getMonth() + 1;
|
return value;
|
||||||
var ed = priorMonthLastDay.getDate();
|
}()
|
||||||
var s = sy + '-' + add0(sm) + '-' + add0(sd) + ' 00:00:00';//开始
|
},
|
||||||
var e = ey + '-' + add0(em) + '-' + add0(ed) + ' 23:59:59';//结束
|
{
|
||||||
return [s,e];
|
text: "最近30天",
|
||||||
|
value: function(){
|
||||||
|
var value = [];
|
||||||
|
var date1 = new Date();
|
||||||
|
date1.setDate(date1.getDate() - 30);
|
||||||
|
date1.setHours(0, 0, 0, 0);
|
||||||
|
value.push(date1);
|
||||||
|
var date2 = new Date();
|
||||||
|
date2.setDate(date2.getDate() - 30);
|
||||||
|
date2.setHours(23, 59, 59, 999);
|
||||||
|
value.push(new Date(date2));
|
||||||
|
return value;
|
||||||
|
}()
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: "本周",
|
||||||
|
value: function(){
|
||||||
|
var value = [];
|
||||||
|
var today = new Date();
|
||||||
|
var date1 = new Date(today.setDate(today.getDate() - today.getDay() + (today.getDay() === 0 ? -6 : 1)));
|
||||||
|
date1.setHours(0, 0, 0, 0);
|
||||||
|
value.push(date1);
|
||||||
|
var date2 = new Date(today.setDate(today.getDate() + 6));
|
||||||
|
date2.setHours(23, 59, 59, 999);
|
||||||
|
value.push(new Date(date2));
|
||||||
|
return value;
|
||||||
|
}()
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: "上周",
|
||||||
|
value: function(){
|
||||||
|
var value = [];
|
||||||
|
var today = new Date();
|
||||||
|
var lastWeek = new Date(today.getFullYear(), today.getMonth(), today.getDate() - 7);
|
||||||
|
var date1 = new Date(lastWeek.getFullYear(), lastWeek.getMonth(), lastWeek.getDate() - lastWeek.getDay() + 1);
|
||||||
|
date1.setHours(0, 0, 0, 0);
|
||||||
|
value.push(date1);
|
||||||
|
var date2 = new Date(lastWeek.getFullYear(), lastWeek.getMonth(), lastWeek.getDate() - lastWeek.getDay() + 7);
|
||||||
|
date2.setHours(23, 59, 59, 999);
|
||||||
|
value.push(new Date(date2));
|
||||||
|
return value;
|
||||||
|
}()
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: "上个月",
|
||||||
|
value: function(){
|
||||||
|
var value = [];
|
||||||
|
var date1 = new Date();
|
||||||
|
date1.setMonth(date1.getMonth() - 1);
|
||||||
|
date1.setDate(1);
|
||||||
|
date1.setHours(0, 0, 0, 0);
|
||||||
|
value.push(date1);
|
||||||
|
var date2 = new Date();
|
||||||
|
date2.setDate(1);
|
||||||
|
date2.setHours(0, 0, 0, 0);
|
||||||
|
date2 = date2.getTime() - 1;
|
||||||
|
value.push(new Date(date2));
|
||||||
|
return value;
|
||||||
|
}()
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: "这个月",
|
||||||
|
value: function(){
|
||||||
|
var value = [];
|
||||||
|
var date1 = new Date();
|
||||||
|
date1.setDate(1);
|
||||||
|
date1.setHours(0, 0, 0, 0);
|
||||||
|
value.push(date1);
|
||||||
|
var date2 = new Date();
|
||||||
|
date2.setMonth(date2.getMonth() + 1);
|
||||||
|
date2.setDate(1);
|
||||||
|
date2.setHours(0, 0, 0, 0);
|
||||||
|
date2 = date2.getTime() - 1;
|
||||||
|
value.push(new Date(date2));
|
||||||
|
return value;
|
||||||
|
}()
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: "下个月",
|
||||||
|
value: function(){
|
||||||
|
var value = [];
|
||||||
|
var date1 = new Date();
|
||||||
|
date1.setMonth(date1.getMonth() + 1);
|
||||||
|
date1.setDate(1);
|
||||||
|
date1.setHours(0, 0, 0, 0);
|
||||||
|
value.push(date1);
|
||||||
|
var date2 = new Date();
|
||||||
|
date2.setMonth(date2.getMonth() + 2);
|
||||||
|
date2.setDate(1);
|
||||||
|
date2.setHours(0, 0, 0, 0);
|
||||||
|
date2 = date2.getTime() - 1;
|
||||||
|
value.push(new Date(date2));
|
||||||
|
return value;
|
||||||
|
}()
|
||||||
|
}
|
||||||
|
];
|
||||||
|
// 日期时间范围
|
||||||
|
laydate.render({
|
||||||
|
elem: '#'+this.settings.target,
|
||||||
|
type: 'datetime',
|
||||||
|
range: '~',
|
||||||
|
trigger: 'none',
|
||||||
|
shortcuts: shortcuts,
|
||||||
|
show:true
|
||||||
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
//输出接口
|
//输出接口
|
||||||
|
Loading…
x
Reference in New Issue
Block a user