PickDtae.js 5.73 KB
/**
 * @author zzf
 */
/**
 *  提货日期组件 
 */
var PickDtae = function(_view, _date, _hours, _fun){
	var _bDelivery = true;
	var _vSelfDelivery = null;
	var _sDelivery = '';
	var _sDay = '';
    var _sTime = '';
    var _FullYear = '';
    var self = this;
    var scope = [];
    var _day = 0;
    
	function addEvent (){
		//数字移动
		$(_view+' .data li').hover(function(){
			var _row = $(this).attr('row');
			var _col = $(this).attr('col');
			if(_vSelfDelivery){
				_vSelfDelivery.css({'background':'#fff', 'color':'#999'});
			};
			$(_view+' .date-delivery .checkbox').css({'background':'#fff'});
			$(_view+' .date-delivery .th span').css({'background':'#fff'});
			_sTime = $(_view+' .date-delivery .time span').eq(parseInt(_row) - 1).html();
			_sDay = $(_view+' .date-delivery .date span').eq(parseInt(_col) - 1).html();
			_FullYear = $(_view+' .date-delivery .date span').eq(parseInt(_col) - 1).attr('years');
			if($.browser.msie){
				_sDay = _sDay.split('<BR>');
			}else{
				_sDay = _sDay.split('<br>');
			};
			$(_view+' .date-delivery .checkbox').each(function(){
				if($(this).attr('row') == _row){
					$(this).css({'background':'#ffe5e5'});
				};
				if($(this).attr('col') == _col){
					$(this).css({'background':'#ffe5e5'});
				}
			});
			$(_view+' .date-delivery .th span').each(function(){
				if($(this).attr('row') == _row){
					$(this).css({'background':'#ffe5e5'});
				};
				if($(this).attr('col') == _col){
					$(this).css({'background':'#ffe5e5'});
				};
			});
			$(this).css({'background':'#e44846', 'color':'#fff'});
			_vSelfDelivery = $(this);
		}, function(){
			if(_bDelivery){
				$(this).css({'background':'#fff', 'color':'#e44846'});
			};
		});
	};
	
	$(_view+' .data').live({
		mouseenter:function(){}, 
		mouseleave:function(){
			if(_vSelfDelivery){
				_vSelfDelivery.css({'background':'#e44846', 'color':'#fff'});
			};
	}});
	$(_view+' .data li').live('click', function(){
		if($(this).hasClass('disabled')){
			return false;
		};
		$(this).css({'background':'#e44846', 'color':'#fff'});
		_vSelfDelivery = $(this);
		$(_view+' .date-delivery').hide();
		_sTime = _sTime.split('-');
		$(_view+' input.inp1').val(_FullYear+'-'+_sDay[0]+' '+_sTime[0]);
		$(_view+' input.inp2').val(_FullYear+'-'+_sDay[0]+' '+_sTime[1]);
		_fun(_FullYear+'-'+_sDay[0]+' '+_sTime[0], _FullYear+'-'+_sDay[0]+' '+_sTime[1]);
		_bDelivery = false;
	});
	
	$(_view+' input').live('focus',function(){
		$(_view+' .date-delivery').show();
		_bDelivery = true;
	});
	$(_view+' .o-chg').live('click', function(){
		$(_view+' .date-delivery').show();
		_bDelivery = true;
	});
	$(_view+' .o-chg1').live('click', function(){
		$(_view+' .date-delivery').show();
		_bDelivery = true;
	});
	$(_view+' .date-delivery').live({
		"mouseenter" : function(){
			
		},
		"mouseleave" : function(){
			$(this).hide();
		}
	});
	
	
	var weeks = ['日', '一', '二', '三', '四', '五', '六'];
	//初始化
	this.start = function(){
		_day = Math.ceil(_hours / 24);
		var _stime = '';
		var _strtime = 0;
		var _periodDtae = _date.split(' ');
		_stime = _periodDtae[1];
		_stime = _stime.split(':');
		_stime = parseInt(_stime[0]);
		var _remainder = (_hours - (24 - _stime)) % 24;
		var _periodView = '';
		
		for (var i=0; i < 4; i++) {
		   if(_stime < (i * 6)){
		      _periodView += '<li class="checkbox" col="1" row="'+(i + 1)+'" data-status="0" >可选</li>';
		      _strtime = (i * 6);
		   }else{
		   	  _periodView += '<li class="checkbox disabled" col="1" row="'+(i + 1)+'" data-status="0" ></li>';
		   };
		};
		if(_remainder > 0){
			_day += 1;
		};
		var _ndate = new Date(_periodDtae[0]);
		for (var i=0; i < _day; i++) {
		    var _Year = 0;
		   _Year = _ndate.getTime() + i * 24 * 60 * 60 * 1000 +  _stime * 60 * 60 * 1000;	  
		   var isDate = new Date(_Year);
		   scope.push({'date':(isDate.getMonth()+1)+'-'+isDate.getDate(), 'Day':'周'+weeks[isDate.getDay()], 'hours':(isDate.getHours() + 1), 'years':isDate.getFullYear()});
		};
		var _dateView = '';
		for (var i=0; i < scope.length; i++) {
		    _dateView += '<span col="'+(i+1)+'" years="'+scope[i].years+'" row="-1">'+scope[i].date+'<BR>'+scope[i].Day+'</span>';
		};
		var _s_view = '';
		var _s_i = 2;
		scope.shift();
		for (var i=0; i < scope.length; i++) {
			_s_view += '<ul>';
			if(i != (scope.length - 1)){
				_s_view += '<li class="checkbox" val="" col="'+(_s_i+i)+'" row="1" data-status="0" >可选</li>'
						   +'<li class="checkbox" val="" col="'+(_s_i+i)+'" row="2" data-status="0" >可选</li>'
						   +'<li class="checkbox" val="" col="'+(_s_i+i)+'" row="3" data-status="0" >可选</li>'
						   +'<li class="checkbox" val="" col="'+(_s_i+i)+'" row="4" data-status="0" >可选</li>';
			}else{
				for (var k=0; k < 4; k++) {
				    if(_remainder > (k * 6) || _remainder == 0){
						_s_view += '<li class="checkbox" val="" col="'+(_s_i+i)+'" row="'+(k+1)+'" data-status="0" >可选</li>';
					}else{
						_s_view += '<li class="checkbox disabled" val="" col="'+(_s_i+i)+'" row="'+(k+1)+'" data-status="0" ></li>';
					};
				};
			};
			_s_view += '</ul>';
		};
		
		var view = '<input type="text" class="inp1" readonly="true" />'
					+'<div class="o-chg"></div>至<input type="text" class="inp2" readonly="true" /><div class="o-chg1"></div><div class="date-delivery"><div class="inner">'
					+'<dl class="th"><dt>时间段</dt><dd class="date">'+_dateView+'</dd><dd class="time">'
					+'<span col="-1" row="1">00:00-06:00</span>'
					+'<span col="-1" row="2">06:00-12:00</span>'
					+'<span col="-1" row="3">12:00-18:00</span>'
					+'<span col="-1" row="4">18:00-24:00</span></dd></dl></div>'
					+'<div class="data"><ul>'+_periodView+'</ul>'+_s_view+'</div></div>';
					
		$(_view).html(view);
		$(_view +' .date-delivery').width((101 + (51 * _day)));
		addEvent();
	};
	
	self.start();
	
	return this;
};