123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535 |
- Namespace.register("U.MD.UI.calendar");
- U.MD.UI.Calendar = U.MD.UI.calendar = function (el, parentnode, datetimeboolean) {
- if (!el)
- return
- if(typeof datetimeboolean == 'boolean' && datetimeboolean == false){
- U.MD.UI.calendar.datetimeformat = datetimeboolean
- }else{
- U.MD.UI.calendar.datetimeformat = true;
- }
- U.MD.UI.calendar.create(el, parentnode);
- }
- U.MD.UI.calendar.NOW = new Date();
- U.MD.UI.calendar.CURRENTYEAR = U.MD.UI.calendar.NOW.getFullYear();
- U.MD.UI.calendar.CURRENTMONTH = U.MD.UI.calendar.NOW.getMonth();
- U.MD.UI.calendar.CURRENTDAY = U.MD.UI.calendar.NOW.getDate();
- U.MD.UI.calendar.year = U.MD.UI.calendar.CURRENTYEAR;
- U.MD.UI.calendar.month = U.MD.UI.calendar.CURRENTMONTH;
- U.MD.UI.calendar.day = U.MD.UI.calendar.CURRENTDAY;
- U.MD.UI.calendar.hour = '00';
- U.MD.UI.calendar.minute = '00';
- U.MD.UI.calendar.second = '00';
- U.MD.UI.calendar.datetimeformat = true;
- U.MD.UI.calendar.fouseinp = null;
- U.MD.UI.calendar.board = null;
- U.MD.UI.calendar.tit = null;
- U.MD.UI.calendar.mark = 1;
- U.MD.UI.calendar.template = [
- '<div class="U_MD_UI_calendar_features">' +
- '<div class="U_MD_UI_calendar_closeBtn" id="U_MD_UI_calendar_closeBtn">关闭</div>' +
- '<div class="U_MD_UI_calendar_features_a">' +
- '<div class="U_MD_UI_calendar_prev U_MD_UI_calendar_btn" id="prevDate"></div>' +
- '<div class="U_MD_UI_calendar_tit" id="calendar_tit"></div>' +
- '<input type="text" id="calendar_tit_btn" style="display: none;">' +
- '<div class="U_MD_UI_calendar_next U_MD_UI_calendar_btn" id="nextDate"></div>' +
- '</div>' +
- '<i></i>' +
- '</div>',
- '<div id="calendar_day">' +
- '<ul class="U_MD_UI_calendar_week">' +
- '<li>日</li>' +
- '<li>一</li>' +
- '<li>二</li>' +
- '<li>三</li>' +
- '<li>四</li>' +
- '<li>五</li>' +
- '<li>六</li>' +
- '</ul>' +
- '<ul class="U_MD_UI_calendar_c" id="calendar_week_c"></ul>' +
- '</div>',
- '<div class="U_MD_UI_calendar_month" id="calendar_month" style="display: none">' +
- '<ul class="U_MD_UI_calendar_month_c">' +
- '<li><span>1月</span></li>' +
- '<li><span>2月</span></li>' +
- '<li><span>3月</span></li>' +
- '<li><span>4月</span></li>' +
- '<li><span>5月</span></li>' +
- '<li><span>6月</span></li>' +
- '<li><span>7月</span></li>' +
- '<li><span>8月</span></li>' +
- '<li><span>9月</span></li>' +
- '<li><span>10月</span></li>' +
- '<li><span>11月</span></li>' +
- '<li><span>12月</span></li>' +
- '</ul>' +
- '</div>',
- '<div id="calendar_year" class="U_MD_UI_calendar_month" style="display: none">' +
- '<ul class="U_MD_UI_calendar_month_c">' +
- '<li></li>' +
- '<li></li>' +
- '<li></li>' +
- '<li></li>' +
- '<li></li>' +
- '<li></li>' +
- '<li></li>' +
- '<li></li>' +
- '<li></li>' +
- '<li></li>' +
- '<li></li>' +
- '<li></li>' +
- '</ul>' +
- '</div>',
- '<span id="U_MD_UI_calendar_timeText" class="U_MD_UI_calendar_timeText">选择时间</span>' +
- '<div class="U_MD_UI_calendar_timeBox">' +
- '<div id="U_MD_UI_calendar_clearText" class="U_MD_UI_calendar_timeBtn">清空</div>' +
- '<div id="U_MD_UI_calendar_nowTime" class="U_MD_UI_calendar_timeBtn">现在</div>' +
- '<div id="U_MD_UI_calendar_okBtn" class="U_MD_UI_calendar_timeBtn">确定</div>' +
- '</div>',
- '<div id="calendar_timeChoose" class="U_MD_UI_calendar_timeChoose" style="display: none">' +
- '</div>'
- ];
- U.MD.UI.calendar.create = function (els, parentnode) {
- if (els == U.MD.UI.calendar.fouseinp && U.MD.UI.calendar.board.style.display == 'block')
- return
- if (parentnode && U.MD.UI.calendar.board) {
- U.MD.UI.calendar.board.parentNode.removeChild(U.MD.UI.calendar.board);
- U.MD.UI.calendar.board = null;
- }
- var _top = document.documentElement.scrollTop || document.body.scrollTop,
- _left = document.documentElement.scrollLeft || document.body.scrollLeft;
- var _offsetHtml = [Math.abs(els.getBoundingClientRect().left) + _left, Math.abs(els.getBoundingClientRect().top) + _top];
- U.MD.UI.calendar.fouseinp = els;
- if (!U.MD.UI.calendar.board) {
- U.MD.UI.calendar.showBoard(els, _offsetHtml, parentnode);
- } else {
- U.MD.UI.calendar.resetData(_offsetHtml);
- }
- U.MD.UI.calendar.showDay();
- }
- U.MD.UI.calendar.toggleChooseText = function (that) {
- var _child = U.selectEl('.U_MD_UI_calendar_c_a')[0].children,
- _len = _child.length;
- if (that.innerText == '返回日期') {
- U.MD.UI.calendar.changeDisplay(_lastTemplate, _child[_len - 1]);
- that.innerText = "选择时间";
- U.selectEl(that).removeClass("U_MD_UI_calendar_timeTextClick");
- return;
- }
- for (var i = 0; i < _len - 1; i++) {
- _child[i].style.display != 'none' && (_child[i].style.display = 'none', _lastTemplate = _child[i]);
- }
- _child[_len - 1].style.display = 'block';
- that.innerText = "返回日期";
- U.selectEl(that).addClass("U_MD_UI_calendar_timeTextClick");
- }
- U.MD.UI.calendar.resetData = function (offsethtml) {
-
- U.MD.UI.calendar.board.style.display = 'block';
- U.MD.UI.calendar.mark = 1;
- U.selectEl('#calendar_day')[0].style.display = 'block';
- U.selectEl('#calendar_month')[0].style.display = 'none';
- U.selectEl('#calendar_year')[0].style.display = 'none';
- U.MD.UI.calendar.board.style.left = offsethtml[0] + 'px';
- U.MD.UI.calendar.board.style.top = offsethtml[1] + U.MD.UI.calendar.fouseinp.clientHeight + 10 + 'px';
- U.MD.UI.calendar.year = U.MD.UI.calendar.CURRENTYEAR;
- U.MD.UI.calendar.month = U.MD.UI.calendar.CURRENTMONTH;
- U.MD.UI.calendar.ChooseDefault(true);
- }
- U.MD.UI.calendar.createChooseTime = function (addel) {
- var _dataObj = [["时", "分", "秒"], [24, 60, 60], ["hour", "minute", "second"]],
- _lastTemplate;
- var _ct = $$('div', { id: 'calendar_time', className: 'U_MD_UI_calendar_time', innerHTML: U.MD.UI.calendar.template[4] }, U.MD.UI.calendar.board);
- for (var i = 0; i < _dataObj[0].length; i++) {
- var _row = $$('div', { className: "U_MD_UI_calendar_timeRow" }, addel);
- $$('span', { className: "U_MD_UI_calendar_timeRowText", innerText: _dataObj[0][i] }, _row);
- var _rowCon = $$('div', { className: "U_MD_UI_calendar_timeRowCon" }, _row),
- _ul = $$('ul', { className: "U_MD_UI_calendar_timeRowUl", name: _dataObj[2][i] }, _rowCon);
- for (var j = 0; j < _dataObj[1][i]; j++) {
- var _text = j.toString().length == 1 ? '0' + j : j;
- $$('li', { innerText: _text, onclick: function () {
- var _parentUl = this.parentNode,
- _activeLi = _parentUl.querySelector('.U_MD_UI_calendar_timeRowActive');
- U.selectEl(_activeLi).removeClass('U_MD_UI_calendar_timeRowActive');
- U.selectEl(this).addClass('U_MD_UI_calendar_timeRowActive');
- switch (_parentUl.name) {
- case 'hour': U.MD.UI.calendar.hour = this.innerText; break;
- case 'minute': U.MD.UI.calendar.minute = this.innerText; break;
- case 'second': U.MD.UI.calendar.second = this.innerText; break;
- }
- }
- }, _ul);
- }
- }
- if (!U.MD.UI.calendar.datetimeformat) {
- _ct.style.display = 'none';
- }
- U.selectEl('#U_MD_UI_calendar_timeText')[0].onclick = function () {
- U.MD.UI.calendar.toggleChooseText(this)
- }
- U.selectEl('#U_MD_UI_calendar_clearText')[0].onclick = function () {
- U.MD.UI.calendar.fouseinp.value ? U.MD.UI.calendar.fouseinp.value = '' : U.MD.UI.calendar.fouseinp.innerText = '';
- U.MD.UI.calendar.ChooseDefault(true);
- U.MD.UI.calendar.board.style.display = 'none';
- }
- U.selectEl('#U_MD_UI_calendar_nowTime')[0].onclick = function () {
- U.MD.UI.calendar.outPutDate(true);
- }
- U.selectEl('#U_MD_UI_calendar_okBtn')[0].onclick = function () {
- U.MD.UI.calendar.outPutDate(false);
- }
- }
- U.MD.UI.calendar.showBoard = function (input, offsetHtml, parentnode) {
- var _template = U.MD.UI.calendar.template,
- _parentNode = parentnode || document.body,
- _templateHTML = _template[1] + _template[2] + _template[3] + _template[5];
- if (!parentnode) {
- U.MD.UI.calendar.board = $$('div', { "className": "U_MD_UI_calendar_bigboard", style: { left: offsetHtml[0] + "px", top: offsetHtml[1] + input.clientHeight + 10 + "px"} }, _parentNode);
- } else {
- U.MD.UI.calendar.board = $$('div', { "className": "U_MD_UI_calendar_bigboard" }, parentnode);
- }
- U.MD.UI.calendar.board.innerHTML = _template[0];
- _dayC = $$('div', { "className": 'U_MD_UI_calendar_c_a', innerHTML: _templateHTML }, U.MD.UI.calendar.board);
- U.MD.UI.calendar.tit = U.selectEl('#calendar_tit')[0];
- _mc = U.selectEl('#calendar_month > ul > li');
- _titInp = U.selectEl('#calendar_tit_btn')[0];
- _timer = null;
- U.MD.UI.calendar.createChooseTime($('#calendar_timeChoose')[0]);
- U.MD.UI.calendar.tit.onclick = function () {
- clearTimeout(_timer);
- if (U.MD.UI.calendar.mark == 1) {
- U.MD.UI.calendar.tit.innerText = U.MD.UI.calendar.year;
- U.MD.UI.calendar.changeDisplay($('#calendar_month')[0], U.selectEl('#calendar_day')[0]);
- U.MD.UI.calendar.mark = 2;
- U.MD.UI.calendar.ChooseDefault();
- } else if (U.MD.UI.calendar.mark == 2) {
- _timer = setTimeout(function () {
- U.MD.UI.calendar.changeDisplay($('#calendar_year')[0], U.selectEl('#calendar_month')[0]);
- U.MD.UI.calendar.dateTenYear();
- U.MD.UI.calendar.mark = 3;
- U.MD.UI.calendar.ChooseDefault();
- }, 250);
- }
- }
- U.MD.UI.calendar.tit.ondblclick = function () {
- clearTimeout(_timer);
- if (U.MD.UI.calendar.mark === 2) {
- _obj = U.MD.UI.calendar.changeDisplay(_titInp, this, 'inline-block');
- _obj[0].value = this.innerText;
- _obj[0].focus();
- }
- }
- _titInp.onkeydown = function (e) {
- switch (e.keyCode) {
- case 13:
- var _arr2 = U.MD.UI.calendar.changeDisplay(U.MD.UI.calendar.tit, this, 'inline-block');
- _arr2[0].innerText = U.MD.UI.calendar.year = !isNaN(parseInt(this.value)) ? parseInt(this.value) : U.MD.UI.calendar.CURRENTYEAR;
- break;
- }
- };
- _titInp.onblur = function () {
- var _arr3 = U.MD.UI.calendar.changeDisplay(U.MD.UI.calendar.tit, this, 'inline-block');
- _arr3[0].innerText = U.MD.UI.calendar.year = !isNaN(parseInt(this.value)) ? parseInt(this.value) : U.MD.UI.calendar.CURRENTYEAR;
- }
- U.selectEl('#prevDate')[0].onclick = function () {
- if (U.MD.UI.calendar.mark == 1) { _lessNum = -1 }
- else if (U.MD.UI.calendar.mark == 2) { _lessNum = -12 }
- else if (U.MD.UI.calendar.mark == 3) { _lessNum = -120 };
- U.MD.UI.calendar.fullDate(_lessNum, false);
- };
- U.selectEl('#nextDate')[0].onclick = function () {
- if (U.MD.UI.calendar.mark == 1) { _addNum = 1 }
- else if (U.MD.UI.calendar.mark == 2) { _addNum = 12 }
- else if (U.MD.UI.calendar.mark == 3) { _addNum = 120 };
- U.MD.UI.calendar.fullDate(_addNum, true);
- };
- for (var i = 0; i < _mc.length; i++) {
- _mc[i].onclick = function () {
- U.MD.UI.calendar.changeDisplay($('#calendar_day')[0], U.selectEl('#calendar_month')[0]);
- U.MD.UI.calendar.month = parseInt(this.innerText) - 1;
- U.MD.UI.calendar.showDay();
- U.MD.UI.calendar.mark = 1;
- }
- }
- U.selectEl('#U_MD_UI_calendar_closeBtn')[0].onclick = function () {
- U.UF.EV.stopBubble();
- U.MD.UI.calendar.board.style.display = 'none';
- }
- }
- U.MD.UI.calendar.showDay = function () {
- _monthFristDay = new Date(U.MD.UI.calendar.year, U.MD.UI.calendar.month, 1).getDay();
- _lastMonthDay = new Date(U.MD.UI.calendar.year, U.MD.UI.calendar.month, 0).getDate();
- _fullDay = new Date(U.MD.UI.calendar.year, U.MD.UI.calendar.month + 1, 0).getDate();
- _totalDay = (_t = _monthFristDay + _fullDay) % 7 === 0 ? _t : _t + (7 - _t % 7);
- _dayC = U.selectEl('#calendar_week_c')[0];
- _dayC.innerHTML = '';
- for (var _i = 0; _i < _totalDay; _i++) {
- _li = $$('li', {}, _dayC);
- if (_i < _monthFristDay) {
- $$('span', { "className": 'U_MD_UI_calendar_unavailable', innerText: (_lastMonthDay - _monthFristDay + _i + 1) }, _li);
- } else if (_i < (_fullDay + _monthFristDay)) {
- var _d = _i - _monthFristDay + 1, _week = new Date(U.MD.UI.calendar.year, U.MD.UI.calendar.month, _d).getDay(), _today = U.MD.UI.calendar.NOW.getDate() === _d && (U.MD.UI.calendar.CURRENTMONTH === U.MD.UI.calendar.month && U.MD.UI.calendar.CURRENTYEAR === U.MD.UI.calendar.year);
- _dayV = _d;
- if (_week === 6 || _week === 0) {
- _today ? $$('span', { "className": 'U_MD_UI_calendar_day U_MD_UI_calendar_today U_MD_UI_calendar_weekend', innerText: _d, "onclick": function () { U.MD.UI.calendar.day = this.innerText; U.MD.UI.calendar.outPutDate() } }, _li) : $$('span', { "className": 'U_MD_UI_calendar_day U_MD_UI_calendar_weekend', innerText: _d, "onclick": function () { U.MD.UI.calendar.day = this.innerText; U.MD.UI.calendar.outPutDate() } }, _li);
- } else if (_today) {
- $$('span', { "className": 'U_MD_UI_calendar_day U_MD_UI_calendar_today', innerText: _d, "onclick": function () { U.MD.UI.calendar.day = this.innerText; U.MD.UI.calendar.outPutDate() } }, _li)
- } else {
- $$('span', { "className": 'U_MD_UI_calendar_day', innerText: _d, "onclick": function () { U.MD.UI.calendar.day = this.innerText; U.MD.UI.calendar.outPutDate() } }, _li)
- }
- } else {
- $$('span', { "className": 'U_MD_UI_calendar_unavailable', innerText: (_i - (_fullDay + _monthFristDay) + 1) }, _li)
- }
- }
- U.MD.UI.calendar.tit.innerText = U.MD.UI.calendar.year + '-' + (U.MD.UI.calendar.month + 1) + '月';
- }
- U.MD.UI.calendar.fullDate = function (num, check) {
- var _year = (_n = Math.abs(num) / 12) >= 1 ? _n >>> 0 : 0,
- _month = Math.abs(num) % 12;
- !check && (_month = -_month);
- !check && (_year = -_year);
- U.MD.UI.calendar.month += _month;
- U.MD.UI.calendar.year += _year;
- if (check) {
- if (U.MD.UI.calendar.month > 11) {
- U.MD.UI.calendar.month = 0;
- U.MD.UI.calendar.year++;
- }
- } else {
- if (U.MD.UI.calendar.month < 0) {
- U.MD.UI.calendar.month = 11;
- U.MD.UI.calendar.year--;
- }
- }
- if (U.MD.UI.calendar.mark == 1) { U.MD.UI.calendar.showDay() };
- if (U.MD.UI.calendar.mark == 2) { U.MD.UI.calendar.tit.innerText = U.MD.UI.calendar.year };
- if (U.MD.UI.calendar.mark == 3) { U.MD.UI.calendar.dateTenYear() };
- }
- U.MD.UI.calendar.formartDate = function (symbol, isnow) {
- var _symbol, y, m, d, h, m, s;
- _symbol = symbol || '-'
- y = isnow ? U.MD.UI.calendar.CURRENTYEAR : U.MD.UI.calendar.year;
- m = isnow ? U.MD.UI.calendar.CURRENTMONTH + 1 : U.MD.UI.calendar.month + 1;
- d = isnow ? U.MD.UI.calendar.CURRENTDAY : U.MD.UI.calendar.day;
- m = (m.toString())[1] ? m : '0' + m;
- d = (d.toString())[1] ? d : '0' + d;
- var _dateStr = y + _symbol + m + _symbol + d;
- if (typeof U.MD.UI.calendar.datetimeformat == 'boolean' && U.MD.UI.calendar.datetimeformat) {
- if (isnow) {
- var _nowDate = new Date();
- U.MD.UI.calendar.hour = _nowDate.getHours();
- U.MD.UI.calendar.minute = _nowDate.getMinutes();
- U.MD.UI.calendar.second = _nowDate.getSeconds();
- }
- h = (U.MD.UI.calendar.hour.toString())[1] ? U.MD.UI.calendar.hour : '0' + U.MD.UI.calendar.hour;
- m = (U.MD.UI.calendar.minute.toString())[1] ? U.MD.UI.calendar.minute : '0' + U.MD.UI.calendar.minute;
- s = (U.MD.UI.calendar.second.toString())[1] ? U.MD.UI.calendar.second : '0' + U.MD.UI.calendar.second;
- _dateStr += " " + h + ":" + m + ":" + s;
- }
- return _dateStr;
- }
- U.MD.UI.calendar.outPutDate = function (isNow) {
- if (U.MD.UI.calendar.fouseinp.tagName === 'INPUT') {
- U.MD.UI.calendar.fouseinp.value = U.MD.UI.calendar.formartDate('-', isNow);
- } else {
- U.MD.UI.calendar.fouseinp.innerText = U.MD.UI.calendar.formartDate('-', isNow);
- }
- U.MD.UI.calendar.CheckedDay && U.MD.UI.calendar.CheckedDay();
- U.MD.UI.calendar.board.style.display = 'none';
- }
- U.MD.UI.calendar.changeDisplay = function (blockEl, noneEl, val) {
- val = val || 'block';
- if (blockEl && typeof blockEl === 'object') { blockEl.setAttribute('style', 'display:' + val) }
- if (noneEl && typeof noneEl === 'object') { noneEl.setAttribute('style', 'display:none') };
- return [blockEl, noneEl];
- }
- U.MD.UI.calendar.dateTenYear = function () {
- _yearArr = U.selectEl('#calendar_year > ul > li');
- _startYear = U.MD.UI.calendar.year - (U.MD.UI.calendar.year % 10);
- for (var i = 0; i < _yearArr.length; i++) {
- _yearArr[i].onclick = function () {
- U.MD.UI.calendar.mark = 2;
- U.MD.UI.calendar.year = parseInt(this.innerText);
- U.MD.UI.calendar.changeDisplay($('#calendar_month')[0], U.selectEl('#calendar_year')[0]);
- U.MD.UI.calendar.tit.innerText = this.innerText;
- }
- _yearArr[i].innerHTML = '';
- if (i == 0 || i == _yearArr.length - 1) {
- $$('span', { "className": "U_MD_UI_calendar_unavailable", innerText: (_startYear + i - 1) }, _yearArr[i]);
- } else if ((_startYear + i - 1) === U.MD.UI.calendar.CURRENTYEAR) {
- $$('span', { style: { "background-color": "#eed1bc" }, innerText: (_startYear + i - 1) }, _yearArr[i])
- } else {
- $$('span', { innerText: (_startYear + i - 1) }, _yearArr[i])
- }
- }
- U.MD.UI.calendar.tit.innerText = (t = (U.MD.UI.calendar.year - (U.MD.UI.calendar.year % 10))) + '-' + (t + 9);
- }
- U.MD.UI.calendar.ChooseDefault = function (deafultflag) {
- if (U.MD.UI.calendar.datetimeformat) {
- if (deafultflag) {
- U.MD.UI.calendar.hour = '00';
- U.MD.UI.calendar.minute = '00';
- U.MD.UI.calendar.second = '00';
- U.selectEl(U.MD.UI.calendar.board).find('.U_MD_UI_calendar_timeRowActive').removeClass('U_MD_UI_calendar_timeRowActive');
- !$('#U_MD_UI_calendar_timeText').length && U.MD.UI.calendar.createChooseTime($('#calendar_timeChoose')[0]);
- }
- U.selectEl('#calendar_time')[0].style.display = "block";
- U.selectEl('#calendar_timeChoose')[0].style.display = 'none';
- U.selectEl('#U_MD_UI_calendar_timeText')[0].innerText = "选择时间";
- U.selectEl('#U_MD_UI_calendar_timeText').removeClass("U_MD_UI_calendar_timeTextClick");
- } else {
- U.selectEl('#calendar_time')[0].style.display = 'none';
- U.selectEl('#calendar_timeChoose')[0].style.display = 'none';
- }
- }
- U.MD.UI.calendar.SetCallBack = function (funcname, func) {
- if (typeof func != 'function' || !"CheckedDay ".match(funcname + ' '))
- return 0;
- U.MD.UI.calendar[funcname] = func
- }
|