fanzherong
/
baozhangfang


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171
							<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<% String basePath = request.getScheme()+ "://" + request.getServerName() + ":" +request.getServerPort() + request.getContextPath(); %>
<!DOCTYPE html>
<!--[if IE 9]><html class="no-js ie9"><![endif]-->
<!--[if gt IE 9]><!--><html class="no-js"><!--<![endif]-->
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
		<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
		<link rel="stylesheet" type="text/css" href="<%=basePath %>/My/Calendario/css/calendar.css" />
		<link rel="stylesheet" type="text/css" href="<%=basePath %>/My/Calendario/css/custom_2.css" />
		<style type="text/css">
		.custom-prev{
			width: 16px;
			height: 16px;
			cursor: pointer;
			float: left;
			margin-top:11px;
			line-height:40px;
			background-image: url('images/pagination_icons.png');
			background-position: -16px 0px;
		}
		
		.custom-next{
			width: 16px;
			height: 16px;
			cursor: pointer;
			float: left;
			margin-top:11px;
			background-image: url('images/pagination_icons.png');
			background-position: -32px 0px;
		}
		</style>
		<script src="<%=basePath %>/My/Calendario/js/modernizr.custom.63321.js"></script>
		<script type="text/javascript">
			/**查询*/
			function searchState(day){
				parent.searchState(day);
			}
		</script>
		</head>
		<body>
				<div class="container" style="height:330px;width:340px;">	
					<div style="width: 320px;margin-left: auto;margin-right: auto;text-align: center;">
						<div style="width: 300px;height: 40px;overflow: hidden;margin-left: auto;margin-right: auto;text-align: center;background-color: #fff;">
							<div style="width:200px;height: 40px;line-height:40px; font-size:20px; font-weight:bold; margin-left:auto;margin-right:auto; text-align: center;color: #1369d8;">
								<div id="custom-prev" class="custom-prev" style="cursor: pointer;"></div>
								<div id="mydate" style="width: 166px;height: 38px;float: left;text-align: center;margin-left:auto;margin-right:auto;">
									
								</div>
								<div id="custom-year" style="float:left;display: none;"></div>
								<div id="custom-month"style="float:left;display: none;"></div>
								<div id="custom-next" class="custom-next" style="cursor: pointer;"></div>
							</div>
						</div>
						<div id="calendar" class="fc-calendar-container"></div>
					</div>
					
					<div style="width:300px;height:180px;margin-left: auto;margin-right: auto;text-align: center;margin-top: 5px;">
						<div style="margin-left:auto;margin-right:auto;text-align:center;width:260px;height:174px;overflow:hidden;background-image: url(images/tips.png)">
							<div style="margin-top: 45px;font-size: 18px;font-weight:bold; color: white;">温馨提示</div>
							<div style="margin-top: 10px;font-size: 14px;font-weight:bold; text-align: left;margin-left:10px;">
							<span id="month1"></span>月中低收入人员收件数：<span id="count1"></span>
							</div>
							<div style="margin-top: 10px;font-size: 14px;font-weight:bold;text-align: left;margin-left:10px;">
							<span id="month2"></span>月新就业人员收件数：<span id="count2"></span>
							</div>
						</div>
					</div>
					
				</div>
		
		<script src="<%=basePath %>/My/Calendario/js/jquery.min.js"></script>
		<script type="text/javascript" src="<%=basePath %>/My/Calendario/js/jquery.calendario.js"></script>
		<script type="text/javascript">	
			
			var transEndEventNames = {
				'WebkitTransition' : 'webkitTransitionEnd',
				'MozTransition' : 'transitionend',
				'OTransition' : 'oTransitionEnd',
				'msTransition' : 'MSTransitionEnd',
				'transition' : 'transitionend'
			},
			transEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ],
			$wrapper = $( '#custom-inner' ),
			$calendar = $( '#calendar' ),
			cal,
			$day,
			$week,
			$month,
			$year;
			$(function() {
				updateTask();
				
				$( '#custom-next' ).on( 'click', function() {
					cal.gotoNextMonth( updateMonthYear );
				} );
				$( '#custom-prev' ).on( 'click', function() {
					cal.gotoPreviousMonth( updateMonthYear );
				} );
				//alert(cal.getYear());
				//$("#mydate").html(cal.getYear()  + "年" + cal.getMonthName() + "月");
				
				 var date=new Date;
				 var month=date.getMonth()+1;
 				 $("#month1").text(month);
 				 $("#month2").text(month);
				//当前月份中低收入人员收件数
				$.ajax({
					type: "post",//使用post方法访问后台
				    dataType: "json",//返回json格式的数据
				    url: "securityPersonApplyAction_pickUpCount?type=1",
				    complete :function(){$("#load").hide();},
				    success: function(msg){
				    	$("#count1").text(msg.obj);
				    }
				});
				//当前月份新就业人员收件数
				$.ajax({
					type: "post",//使用post方法访问后台
				    dataType: "json",//返回json格式的数据
				    url: "securityPersonApplyAction_pickUpCount?type=2",
				    complete :function(){$("#load").hide();},
				    success: function(msg){
				    	$("#count2").text(msg.obj);
				    }
				});
			});
			
			function updateMonthYear() {				
				$month.html( cal.getMonthName() + "月");
				$year.html( cal.getYear()  + "年");
				$("#mydate").html(cal.getYear()  + "年" + cal.getMonthName() + "月");
			}
		
			function showEvents( $contentEl, dateProperties ) {
				searchState(dateProperties.year + "-" + dateProperties.month + "-" + dateProperties.day);
			}
			
			function updateTask(){
				$.ajax({
				    type: "post",//使用post方法访问后台
				    dataType: "json",//返回json格式的数据
				    url: "taskAction_listMyTask",//要访问的后台地址
				    complete :function(){$("#load").hide();},//AJAX请求完成时隐藏loading提示
				    success: function(msg){//msg为返回的数据，在这里做数据绑定
				    	if(msg.success){
				    		var codropsEvents = {};
				    		for(var i =  0;i<msg.obj.length;i++){
				    			codropsEvents[msg.obj[i].date] = msg.obj[i].cnt;
				    		}
				    		cal = $calendar.calendario( {
								onDayClick : function( $el, $contentEl, dateProperties ) {
									if( $contentEl.length > 0 ) {
										showEvents( $contentEl, dateProperties );
									}
								},
								caldata : codropsEvents,
								displayWeekAbbr : true
							} ),
							$month = $( '#custom-month' ).html( cal.getMonthName() + "月"),
							$year = $( '#custom-year' ).html( cal.getYear() + "年");
				    		$("#mydate").html(cal.getYear()  + "年" + cal.getMonthName() + "月");
				    	}
				    }
				});
			}
		</script>
	</body>
</html>