/**
* YvanUI
*
* Copyright (c) 2018 www.yvanui.com. All rights reserved.
* @author luoyifan@qq.com
* @time 2018-11-27 11:16:00
*/
(function ($) {
function setSize(target, param) {
var opts = $.data(target, 'calendar').options;
var t = $(target);
if (param) {
$.extend(opts, {
width: param.width,
height: param.height
});
}
t._size(opts, t.parent());
t.find('.calendar-body')._outerHeight(t.height() - t.find('.calendar-header')._outerHeight());
if (t.find('.date-year-list').is(':visible')) {
opts.startYear = opts.year - 7;
showSelectYear(target);
} else if (t.find('.date-month-list').is(':visible')) {
showSelectMonth(target);
}
}
function init(target) {
$(target).addClass('calendar').html(
'
' +
'' +
' ' +
' ' +
'
' +
'
' +
' 时
' +
' 分
' +
' 秒
' +
'
' +
'
' +
'
'
);
var html = [];
for (var i = 0; i < 24; i++) {//时
if (i < 10) {
html.push('0' + i + '');
} else {
html.push('' + i + '');
}
}
$(target).find('.add-time-list .v-hh').html(html.join(''));
html = [];
for (var i = 0; i < 60; i++) {//分-秒
if (i < 10) {
html.push('0' + i + '');
} else {
html.push('' + i + '');
}
}
$(target).find('.add-time-list .v-mm').html(html.join(''));
$(target).find('.add-time-list .v-ss').html(html.join(''));
$(target).bind('_resize', function (e, force) {
if ($(this).hasClass('easyui-fluid') || force) {
setSize(target);
}
return false;
});
}
function restSelect(target) {
$(target).find('.date-set').show();
$(target).find('.year-range').hide();
$(target).find('.calendar-menu').hide();
$(target).find('.calendar-prevmonth').show();
$(target).find('.calendar-nextmonth').show();
$(target).find('.calendar-prevyear').show();
$(target).find('.calendar-nextyear').show();
}
function resetTimePanel(target) {
var opts = $.data(target, 'calendar').options;
var $panel = $(target).find('.calendar-add-time');
var $dom = $(target);
if (!opts.showTime) {
$panel.hide();
$dom.removeClass('show-time');
return;
}
$dom.addClass('show-time');
$dom.find('.calendar-dtable').width(opts.width - 180);
$dom.find('.calendar-menu').width(opts.width - 180);
$panel.show();
}
//显示年份
function showSelectYear(target) {
var opts = $.data(target, 'calendar').options;
restSelect(target);
$(target).find('.calendar-prevmonth').hide();
$(target).find('.calendar-nextmonth').hide();
$(target).find('.date-set').hide();
$(target).find('.year-range').show();
var $ul = $(target).find('.date-year-list');
$ul.show();
var startYear = opts.startYear;
$ul.empty();
for (var i = 0; i < 15; i++) {
$('').attr('abbr', startYear + i).html(opts.yearFmt(startYear + i)).appendTo($ul);
}
$(target).find('.calendar-title .year-range').html(opts.yearFmt(startYear) + ' - ' + opts.yearFmt(startYear + 14));
if ($ul.find('.date-year-this').attr('abbr') !== opts.year) {
$ul.find('.date-year-this').removeClass('date-year-this');
$ul.find('li[abbr="' + opts.year + '"]').addClass('date-year-this');
}
}
//显示月份
function showSelectMonth(target) {
var opts = $.data(target, 'calendar').options;
restSelect(target);
$(target).find('.calendar-prevmonth').hide();
$(target).find('.calendar-nextmonth').hide();
var $ul = $(target).find('.date-month-list');
$ul.show();
if ($ul.is(':empty')) {
$ul.empty();
for (var i = 0; i < 12; i++) {
$('').attr('abbr', i + 1).html(opts.months[i]).appendTo($ul);
}
}
if ($ul.find('.date-month-this').attr('abbr') !== opts.month) {
$ul.find('.date-month-this').removeClass('date-month-this');
$ul.find('li[abbr="' + opts.month + '"]').addClass('date-month-this');
}
}
//显示时间
function showSelectTime(target) {
var opts = $.data(target, 'calendar').options;
restSelect(target);
$(target).find('.calendar-prevmonth').hide();
$(target).find('.calendar-nextmonth').hide();
$(target).find('.calendar-prevyear').hide();
$(target).find('.calendar-nextyear').hide();
var $ul = $(target).find('.date-time-list');
$ul.show();
}
function bindEvents(target) {
var opts = $.data(target, 'calendar').options;
var menu = $(target).find('.calendar-menu');
menu.find('.calendar-menu-year').unbind('.calendar').bind('keypress.calendar', function (e) {
if (e.keyCode == 13) {
setDate(true);
}
});
//$('.add-time-list li ol li').click(function () {
// $(this).addClass('date-this').siblings().removeClass('date-this');
//});
//$('.add-time-list li ol li:nth-child(1)').addClass('date-this');
$(target)
.unbind('.calendar')
.bind('mouseover.calendar', function (e) {
var t = toTarget(e.target);
if (t.hasClass('calendar-nav') || t.hasClass('calendar-text') || (t.hasClass('calendar-day') && !t.hasClass('calendar-disabled'))) {
t.addClass('calendar-nav-hover');
}
})
.bind('mouseout.calendar', function (e) {
var t = toTarget(e.target);
if (t.hasClass('calendar-nav') || t.hasClass('calendar-text') || (t.hasClass('calendar-day') && !t.hasClass('calendar-disabled'))) {
t.removeClass('calendar-nav-hover');
}
})
.bind('click.v-mm', function (e) {
console.log('hh', $(e.target).html());
})
.bind('click.calendar', function (e) {
var t = toTarget(e.target);
if (t.hasClass('dateYear')) {
//点击年份
opts.startYear = opts.year - 7;
showSelectYear(target);
} else if (t.hasClass('dateMonth')) {
//点击月份
showSelectMonth(target);
//showSelectTime(target);
} else if (t.hasClass('calendar-menu-next') || t.hasClass('calendar-nextyear')) {
//下一年
if ($(target).find('.date-year-list').is(':visible')) {
//下15年
opts.startYear += 15;
showSelectYear(target);
} else {
showYear(1);
}
} else if (t.hasClass('calendar-menu-prev') || t.hasClass('calendar-prevyear')) {
//上一年
if ($(target).find('.date-year-list').is(':visible')) {
//上15年
opts.startYear -= 15;
showSelectYear(target);
} else {
showYear(-1);
}
} else if (t.hasClass('calendar-prevmonth')) {
//上个月
showMonth(-1);
} else if (t.hasClass('calendar-nextmonth')) {
//下个月
showMonth(1);
} else if (t.hasClass('calendar-month')) {
//月份
$(target).find('.date-month-list').find('.date-month-this').removeClass('date-month-this');
t.addClass('date-month-this');
setDate(true);
} else if (t.hasClass('calendar-year')) {
//年份
$(target).find('.date-year-list').find('.date-year-this').removeClass('date-year-this');
t.addClass('date-year-this');
setDate(true);
} else if (t.hasClass('calendar-day')) {
//选择了日期
if (t.hasClass('calendar-disabled')) {
return;
}
var oldValue = opts.current;
t.closest('div.calendar-body').find('.calendar-selected').removeClass('calendar-selected');
t.addClass('calendar-selected');
var parts = t.attr('abbr').split(',');
var y = parseInt(parts[0]);
var m = parseInt(parts[1]);
var d = parseInt(parts[2]);
opts.current = new Date(y, m - 1, d);
opts.onSelect.call(target, opts.current);
if (!oldValue || oldValue.getTime() != opts.current.getTime()) {
opts.onChange.call(target, opts.current, oldValue);
}
if (opts.year !== y || opts.month !== m) {
opts.year = y;
opts.month = m;
show(target);
}
}
});
function toTarget(t) {
var day = $(t).closest('.calendar-day');
if (day.length) {
return day;
} else {
return $(t);
}
}
function setDate(hideMenu) {
var opts = $.data(target, 'calendar').options;
var $yearUl = $(target).find('.date-year-this');
var $monthUl = $(target).find('.date-month-this');
var year = $yearUl.attr('abbr') || opts.year;
var month = $monthUl.attr('abbr') || opts.month;
if (!isNaN(year)) {
opts.year = parseInt(year);
opts.month = parseInt(month);
show(target);
}
if (hideMenu) {
restSelect(target);
}
}
function showYear(delta) {
opts.year += delta;
show(target);
menu.find('.calendar-menu-year').val(opts.year);
}
function showMonth(delta) {
opts.month += delta;
if (opts.month > 12) {
opts.year++;
opts.month = 1;
} else if (opts.month < 1) {
opts.year--;
opts.month = 12;
}
show(target);
var $ul = menu.parent().find('.date-month-list');
if ($ul.find('.date-month-this').attr('abbr') !== opts.month) {
$ul.find('.date-month-this').removeClass('date-month-this');
$ul.find('li[abbr="' + opts.month + '"]').addClass('date-month-this');
}
}
}
/**
* get weeks data.
*/
function getWeeks(target, year, month) {
var opts = $.data(target, 'calendar').options;
var dates = [];
var lastDay = new Date(year, month, 0).getDate();
for (var i = 1; i <= lastDay; i++) dates.push([year, month, i]);
// group date by week
var weeks = [], week = [];
var memoDay = -1;
while (dates.length > 0) {
var date = dates.shift();
week.push(date);
var day = new Date(date[0], date[1] - 1, date[2]).getDay();
if (memoDay == day) {
day = 0;
} else if (day == (opts.firstDay == 0 ? 7 : opts.firstDay) - 1) {
weeks.push(week);
week = [];
}
memoDay = day;
}
if (week.length) {
weeks.push(week);
}
var firstWeek = weeks[0];
if (firstWeek.length < 7) {
while (firstWeek.length < 7) {
var firstDate = firstWeek[0];
var date = new Date(firstDate[0], firstDate[1] - 1, firstDate[2] - 1);
firstWeek.unshift([date.getFullYear(), date.getMonth() + 1, date.getDate()]);
}
} else {
var firstDate = firstWeek[0];
var week = [];
for (var i = 1; i <= 7; i++) {
var date = new Date(firstDate[0], firstDate[1] - 1, firstDate[2] - i);
week.unshift([date.getFullYear(), date.getMonth() + 1, date.getDate()]);
}
weeks.unshift(week);
}
var lastWeek = weeks[weeks.length - 1];
while (lastWeek.length < 7) {
var lastDate = lastWeek[lastWeek.length - 1];
var date = new Date(lastDate[0], lastDate[1] - 1, lastDate[2] + 1);
lastWeek.push([date.getFullYear(), date.getMonth() + 1, date.getDate()]);
}
if (weeks.length < 6) {
var lastDate = lastWeek[lastWeek.length - 1];
var week = [];
for (var i = 1; i <= 7; i++) {
var date = new Date(lastDate[0], lastDate[1] - 1, lastDate[2] + i);
week.push([date.getFullYear(), date.getMonth() + 1, date.getDate()]);
}
weeks.push(week);
}
return weeks;
}
/**
* show the calendar day.
*/
function show(target) {
var opts = $.data(target, 'calendar').options;
if (opts.current && !opts.validator.call(target, opts.current)) {
opts.current = null;
}
var now = new Date();
var todayInfo = now.getFullYear() + ',' + (now.getMonth() + 1) + ',' + now.getDate();
var currentInfo = opts.current ? (opts.current.getFullYear() + ',' + (opts.current.getMonth() + 1) + ',' + opts.current.getDate()) : '';
// calulate the saturday and sunday index
var saIndex = 6 - opts.firstDay;
var suIndex = saIndex + 1;
if (saIndex >= 7) saIndex -= 7;
if (suIndex >= 7) suIndex -= 7;
//$(target).find('.calendar-title span').html(opts.months[opts.month - 1] + ' ' + opts.year);
$(target).find('.calendar-title .date-set .dateYear').html(opts.yearFmt(opts.year));
$(target).find('.calendar-title .date-set .dateMonth').html(opts.months[opts.month - 1]);
var body = $(target).find('div.calendar-body');
body.children('table').remove();
var data = [''];
data.push('');
if (opts.showWeek) {
data.push('' + opts.weekNumberHeader + ' | ');
}
for (var i = opts.firstDay; i < opts.weeks.length; i++) {
data.push('' + opts.weeks[i] + ' | ');
}
for (var i = 0; i < opts.firstDay; i++) {
data.push('' + opts.weeks[i] + ' | ');
}
data.push('
');
data.push('');
var weeks = getWeeks(target, opts.year, opts.month);
for (var i = 0; i < weeks.length; i++) {
var week = weeks[i];
var cls = '';
if (i == 0) {
cls = 'calendar-first';
}
else if (i == weeks.length - 1) {
cls = 'calendar-last';
}
data.push('');
if (opts.showWeek) {
var weekNumber = opts.getWeekNumber(new Date(week[0][0], parseInt(week[0][1]) - 1, week[0][2]));
data.push('' + weekNumber + ' | ');
}
for (var j = 0; j < week.length; j++) {
var day = week[j];
var s = day[0] + ',' + day[1] + ',' + day[2];
var dvalue = new Date(day[0], parseInt(day[1]) - 1, day[2]);
var d = opts.formatter.call(target, dvalue);
var css = opts.styler.call(target, dvalue);
var classValue = '';
var styleValue = '';
if (typeof css == 'string') {
styleValue = css;
} else if (css) {
classValue = css['class'] || '';
styleValue = css['style'] || '';
}
var cls = 'calendar-day';
if (!(opts.year == day[0] && opts.month == day[1])) {
cls += ' calendar-other-month';
}
if (s == todayInfo) {
cls += ' calendar-today';
}
if (s == currentInfo) {
cls += ' calendar-selected';
}
if (j == saIndex) {
cls += ' calendar-saturday';
}
else if (j == suIndex) {
cls += ' calendar-sunday';
}
if (j == 0) {
cls += ' calendar-first';
}
else if (j == week.length - 1) {
cls += ' calendar-last';
}
cls += ' ' + classValue;
if (!opts.validator.call(target, dvalue)) {
cls += ' calendar-disabled';
}
data.push('' + d + ' | ');
}
data.push('
');
}
data.push('');
data.push('
');
body.append(data.join(''));
body.children('table.calendar-dtable').prependTo(body);
resetTimePanel(target);
opts.onNavigate.call(target, opts.year, opts.month);
}
$.fn.calendar = function (options, param) {
if (typeof options == 'string') {
return $.fn.calendar.methods[options](this, param);
}
options = options || {};
return this.each(function () {
var state = $.data(this, 'calendar');
if (state) {
$.extend(state.options, options);
} else {
state = $.data(this, 'calendar', {
options: $.extend({}, $.fn.calendar.defaults, $.fn.calendar.parseOptions(this), options)
});
init(this);
}
if (state.options.border == false) {
$(this).addClass('calendar-noborder');
}
setSize(this);
bindEvents(this);
show(this);
//$(this).find('.calendar-menu').hide(); // hide the calendar menu
});
};
$.fn.calendar.methods = {
options: function (jq) {
return $.data(jq[0], 'calendar').options;
},
resize: function (jq, param) {
return jq.each(function () {
setSize(this, param);
});
},
moveTo: function (jq, date) {
return jq.each(function () {
if (!date) {
var now = new Date();
$(this).calendar({
year: now.getFullYear(),
month: now.getMonth() + 1,
current: date
});
return;
}
var opts = $(this).calendar('options');
if (opts.validator.call(this, date)) {
var oldValue = opts.current;
$(this).calendar({
year: date.getFullYear(),
month: date.getMonth() + 1,
current: date
});
if (!oldValue || oldValue.getTime() != date.getTime()) {
opts.onChange.call(this, opts.current, oldValue);
}
}
});
}
};
$.fn.calendar.parseOptions = function (target) {
var t = $(target);
return $.extend({}, $.parser.parseOptions(target, [
'weekNumberHeader', {firstDay: 'number', fit: 'boolean', border: 'boolean', showWeek: 'boolean'}
]));
};
$.fn.calendar.defaults = {
width: 272,
height: 284,
showTime: false,
fit: false,
border: true,
showWeek: false,
firstDay: 1,
weeks: ['日', '一', '二', '三', '四', '五', '六'],
months: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
//weeks: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],
//months: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
year: new Date().getFullYear(),
month: new Date().getMonth() + 1,
current: (function () {
var d = new Date();
return new Date(d.getFullYear(), d.getMonth(), d.getDate());
})(),
weekNumberHeader: '周次',
getWeekNumber: function (date) {
var checkDate = new Date(date.getTime());
checkDate.setDate(checkDate.getDate() + 4 - (checkDate.getDay() || 7));
var time = checkDate.getTime();
checkDate.setMonth(0);
checkDate.setDate(1);
return Math.floor(Math.round((time - checkDate) / 86400000) / 7) + 1;
},
yearFmt: function (v) {
return v + '年';
},
formatter: function (date) {
return date.getDate();
},
styler: function (date) {
return '';
},
validator: function (date) {
return true;
},
onSelect: function (date) {
},
onChange: function (newDate, oldDate) {
},
onNavigate: function (year, month) {
}
};
})(jQuery);