cairuisen_citu
/
RecruitmentService


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191
							<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
	<title>套餐统计</title>
	<meta name="decorator" content="default"/>
	<%@ taglib prefix = "c" uri = "http://java.sun.com/jsp/jstl/core" %>
	<script type="text/javascript" src="${ctxStatic}/recruitment/common/js/highcharts.js"></script>
	<script type="text/javascript" src="${ctxStatic}/recruitment/common/js/pic.js"></script>
	<style>
        .container{
            width: 100%;
            overflow: hidden;
        }
        .box{
            width: 50px;
            height: 50px;
            text-align: center;
            display: inline-block;
        }
        .container .box{
        	width: 33.333%;
        	float:left;
        }
    </style>
	<script type="text/javascript">
	    var chart = null; // 定义全局变量
		$(document).ready(function() {
			$('#bmccid').change(function(){
				$("#bmccidTrans").val($('#bmccid').val());
				if ($("#isAdmin").val() == '1') {
					$("#xxidList").select2('val', '')
					$('#xxlx').select2('val', '请选择');
				}
			});
			var options=$("#xnid option:selected");
			//xChanged(options.val(),"${ctx}/registration/tIndex/getCcList",$("#isAdmin").val());
			
			Highcharts.setOptions({  
				   colors: ['#44B548', '#40ABE9', '#FFCF54','#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263', '#6AF9C4']  
			});
			// 订单来源统计
			var dataPie =[];
			var	pc={};
			pc.name = "PC端";
			pc.y = ${fromPC};
			pc.id = 0;
			pc.size = 50;
			pc.color="#40ABE9";
			dataPie.push(pc);
			var	wx={};
			wx.name = "移动端";
			wx.size = 50;
			wx.y = ${fromWX};
			wx.id = 1;
			wx.color="#D58364";
			dataPie.push(wx);
			var divId ='orderFromStatistics';// 挂载Id
			var title = "订单来源统计";// 标题
			var seriesName = "订单来源统计";
			chart = creatPie(divId, title,seriesName,dataPie);
			
			$(function () {
				var categories = [];
				var datas = [];
				
				<c:forEach items="${stats.categories}" var="result">
					categories.push('${result}');
				</c:forEach> 
				<c:forEach items="${stats.series}" var="result" varStatus="varstatus">
					var obj = {};
					obj.name = '${result.name}';
					var da = [];
					<c:forEach items="${result.data}" var="d">
					da.push(parseInt('${d}'));
					</c:forEach> 
					obj.data=da;
					datas.push(obj);
				</c:forEach> 
				
				$('#salesCountStatistics').highcharts({
					chart: {type: 'column'},
					title: {text: "套餐销量统计"},
					subtitle: {text: ''},
					xAxis: {
						categories: categories,
						crosshair: true
					},
					yAxis: {
						min: 0,
						title: {text: '数量'},
						allowDecimals:false
					},
					tooltip: {
						headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
						pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
						'<td style="padding:0"><b>{point.y}</b></td></tr>',
						footerFormat: '</table>',
						shared: true,
						useHTML: true
					},
					plotOptions: {
						column: {borderWidth: 0}
					},
					series: datas
				});
			}); 
		});
		function page(n,s){
			$("#pageNo").val(n);
			$("#pageSize").val(s);
			$("#searchForm").submit();
        	return false;
        }
		function xChanged(xn,url,isAdmin) {
			var $bmccid = $('#bmccid');
			var $xxid = $('#xxidList');
			
			$bmccid.empty().append('<option value="">请选择</option>');
			$bmccid.select2('val', '');
 
			$.ajax({
				type : "post",
				url : url + '?xn=' + xn +'&isAdmin='+isAdmin,
				cache : false,
				async : false,
				dataType : "json",
				contentType : "application/json",
				success : function(data) {
					if (data && data.ccList && data.ccList.length > 0) {
						var len = data.ccList.length;
						
						for (var i = 0; i < len; i++) {
							var option = $('<option></option>').text(data.ccList[i].label).val(data.ccList[i].value);
							$bmccid.append(option);
						}
					}
				}
			});
		}
	</script>
</head>
<body>
	<ul class="nav nav-tabs">
		<li class="active"><a href="${ctx}/recruitment/packageStatistic/">套餐统计</a></li>
	</ul>
	<form:form id="searchForm" modelAttribute="packageStatistic" action="${ctx}/recruitment/packageStatistic/" method="post" class="breadcrumb form-search" >
		<input id="pageNo" name="pageNo" type="hidden" value="${page.pageNo}"/>
		<input id="pageSize" name="pageSize" type="hidden" value="${page.pageSize}"/>
		<ul class="ul-form">
			<li><label style="width:150px;">选择年份：</label>
				<input id="saleStatisticYear" name="saleStatisticYear" type="text" readonly="readonly" maxlength="20" class="input-medium Wdate"
					value="<fmt:formatDate value="${packageStatistic.saleStatisticYear}" pattern="yyyy-MM-dd"/>"
					onclick="WdatePicker({dateFmt:'yyyy-MM-dd',isShowClear:true,minDate:'2017-01-01'});"/>
					
			</li>
			<li><label style="width:150px;">选择统计类别：</label>
				<form:select path="statisticType" class="input-medium">
					<form:option value="1" label="按月统计"/>
					<form:option value="2" label="按季度统计"/>
					<form:option value="3" label="按年统计"/>
				</form:select>
			</li>
			<li class="btns"><input class="btn btn-primary" type="submit" value="查询"/></li>
			<li class="clearfix"></li>
			<br/>
			<br/>
			<div id="salesCountStatistics" style="width: 90%; height:400px;display: inline-block;margin-left: 30px"></div>
			<br/>
			<br/>
			<li><label style="width:150px;">来源统计时间段：</label>
				<input id="orderSourceStartDate" name="orderSourceStartDate" type="text" readonly="readonly" maxlength="20" class="input-medium Wdate"
					value="<fmt:formatDate value="${packageStatistic.orderSourceStartDate}" pattern="yyyy-MM-dd"/>"
					onclick="WdatePicker({dateFmt:'yyyy-MM-dd',isShowClear:true,maxDate:'#F{$dp.$D(\'orderSourceEndDate\')}'});"/>
					&nbsp;~&nbsp;
				<input id="orderSourceEndDate" name="orderSourceEndDate" type="text" readonly="readonly" maxlength="20" class="input-medium Wdate"
					value="<fmt:formatDate value="${packageStatistic.orderSourceEndDate}" pattern="yyyy-MM-dd"/>"
					onclick="WdatePicker({dateFmt:'yyyy-MM-dd',isShowClear:true,minDate:'#F{$dp.$D(\'orderSourceStartDate\')}'});"/>
			</li>
			<li class="btns"><input class="btn btn-primary" type="submit" value="查询"/></li>
			<li class="clearfix"></li>
			<br/>
			<br/>
			<div id="orderFromStatistics" style="width: 600px; height:400px;display: inline-block;margin-left: 100px"></div>
			
			
		</ul>
	</form:form>
	
</body>
</html>