<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<title>私塾家</title>

	<script type="text/javascript" th:src="@{/static/js/echarts.min.js}"></script>
	<script type="text/javascript" th:src="@{/static/sys/js/meun/jquery/jquery-1.9.1.min.js}"></script>

	<!-- bootstrap-css -->
	<link rel="stylesheet" th:href="@{/static/sys/css/counter/bootstrap.min.css}" >
	<link th:href="@{/static/sys/css/counter/style.css}" rel='stylesheet' type='text/css' />
	<link th:href="@{/static/sys/css/counter/styletop.css}" rel='stylesheet' type='text/css' />

	<link rel="stylesheet" th:href="@{/static/sys/css/counter/font-awesome.min.css}">
	<link rel="stylesheet" th:href="@{/static/sys/css/counter/bootstrapDatepickr-1.0.0.css}">
	<script th:src="@{/static/sys/js/counter/bootstrapDatepickr-1.0.0.min.js}"></script>

	<script src="sys/js/My97DatePicker/WdatePicker.js" th:src="@{/static/sys/js/My97DatePicker/WdatePicker.js}"></script>

	<style type="text/css">
		.input-group{
			width: 200px;
			float: left;
			margin-bottom:0px;
			margin-left: 10px;
			margin-right: 10px
		}

		.s-index-side .title h3{
			padding-left: 10px;
			font-weight: 800;
			border-bottom: 0px solid #d8d8d8;
			line-height: 50px;
		}

		.s-index-side .title {
			height: 50px;
			line-height: 50px;
		}
		td{
			background: #f5f5f5;
		}
		.market-update-block{
			padding: 0em 0em;
		}

		.market-update-left{
			height: 120px
		}

		.market-update-left h4{
			height: 30px;
			background: #ccc;
			line-height: 30px;
			margin: 0px
		}

		.market-update-block{
			background: #f5f5f5;
			color: #000;
		}

		.market-update-block h3{
			color: #000;
			padding-left: 10px;
			padding: 10px;
		}

		.market-update-block p {
			color: #000;
			padding-left: 10px
		}

		.market-update-block h4 {
			color: #000;
			padding-left: 10px
		}
		table{
			border: 1px solid #999;
		}
		td{
			border: 1px solid #999;
		}
	</style>

</head>
<body>
<section class="wrapper">
	<div style="text-align: center"><h1>周数据汇总分析</h1></div>
</section>

<div style="width: 98%; padding-left: 20px;">
	<div class="s-index-side" style="width: 100%;margin-bottom: 30px">
		<div class="title">
			<h3 style="color: #FF4E00;float: left;">小塾学伴新增数据</h3>
			<div style="height: 40px;padding-top: 11px;float: left;">
				<div >
					<div class="input-group">
						<span class="input-group-addon addonclick_id-calendar" id="basic-addon1"><i class="fa fa-calendar"></i></span>
						<input type="text" id="calendar" placeholder="test" class="form-control"  autocomplete="off" th:value="${weekDate}"  onclick="WdatePicker({isShowWeek:true,onpicked:funccc,errDealMode:3})">
					</div>
				</div>
			</div>
			<div style="height: 40px;padding-top: 3px;float: left;">
				<button class="btn btn-large btn-primary" type="button" id="calendarBtu">刷新</button>
				<form id="seachform"  method="post" style="float: right;margin-left: 10px;">
					<input type="button" id="button" class="btn btn-large btn-primary" value="导出" />
				</form>
			</div>
		</div>

		<!-- --------------------------------------------- -->
		<div class="market-updates" >

			<div class="col-md-3 market-update-gd" style="width: 20%;margin-bottom: 20px">
				<div class="market-update-block clr-block-6">
					<div class="col-md-12 market-update-left">
						<h4>新签机构1周内账号开通数（校长&教师）</h4>
						<h3 id="count_1_source_1">0个</h3>
						<p id="count_1_source_1_p">
							新签开通率：<span>0%</span>
						</p>
					</div>
					<div class="clearfix"> </div>
				</div>

			</div>

			<div class="col-md-3 market-update-gd" style="width: 20%;margin-bottom: 20px">
				<div class="market-update-block clr-block-6">
					<div class="col-md-12 market-update-left">
						<h4>新签机构2周内学生账号激活</h4>
						<h3 id="count_1_source_2">0个</h3>
						<p id="count_1_source_2_p">
							新签激活率：<span>0%</span>
						</p>
					</div>
					<div class="clearfix"> </div>
				</div>
			</div>

		</div>


	</div>
</div>


<div style="width: 98%; padding-left: 20px;">
	<div class="s-index-side" style="width: 100%;margin-bottom: 30px">
		<div class="title">
			<h3 style="color: #FF4E00;float: left;">小塾学伴活泼用户数据</h3>
			<div style="height: 40px;padding-top: 11px;float: left;">
				<div >
					<div class="input-group">
						<span class="input-group-addon addonclick_id-calendar" id="basic-addon1"><i class="fa fa-calendar"></i></span>
						<input type="text" id="calendar2" placeholder="test" class="form-control"  autocomplete="off" th:value="${weekDate}"  onclick="WdatePicker({isShowWeek:true,onpicked:funccc2,errDealMode:3})">
					</div>
				</div>
			</div>
			<div style="height: 40px;padding-top: 3px;float: left;">
				<button class="btn btn-large btn-primary" type="button" id="calendar2Btu">刷新</button>
				<form id="seachform2"  method="post" style="float: right;margin-left: 10px;">
					<input type="button" id="button2" class="btn btn-large btn-primary" value="导出" />
				</form>
			</div>
		</div>

		<!-- --------------------------------------------- -->
		<div class="market-updates" >
			<div class="col-md-3 market-update-gd" style="width: 20%;margin-bottom: 20px">
				<div class="market-update-block clr-block-6">
					<div class="col-md-12 market-update-left">
						<h4>机构活泼数（账号活跃占比50%以上）</h4>
						<h3 id="count_2_source_1">0个</h3>
						<p id="count_2_source_1_p_1">
							环比：<span style="color: #ccc">-0%-</span>
						</p>
						<p id="count_2_source_1_p_2">
							占总体签约机构数：<span>0%</span>
						</p>
					</div>
					<div class="clearfix"> </div>
				</div>
			</div>

			<div class="col-md-3 market-update-gd" style="width: 20%;margin-bottom: 20px">
				<div class="market-update-block clr-block-6">
					<div class="col-md-12 market-update-left">
						<h4>新机构（1个月内）活泼数</h4>
						<h3 id="count_2_source_2">0个</h3>
						<p id="count_2_source_2_p">占总体签约机构数：0%</p>
					</div>
					<div class="clearfix"> </div>
				</div>
			</div>

			<div class="col-md-3 market-update-gd" style="width: 20%;margin-bottom: 20px">
				<div class="market-update-block clr-block-6">
					<div class="col-md-12 market-update-left">
						<h4>账号活跃数（周上传作业3天以上）</h4>
						<h3 id="count_2_source_3">0个</h3>
						<p id="count_2_source_3_p">
							环比：<span style="color: #ccc">-0%-</span>
						</p>
					</div>
					<div class="clearfix"> </div>
				</div>

			</div>

			<div class="col-md-3 market-update-gd" style="width: 20%;margin-bottom: 20px">
				<div class="market-update-block clr-block-6">
					<div class="col-md-12 market-update-left">
						<h4>老机构（持续用3个月）</h4>
						<h3 id="count_2_source_4">0个</h3>
						<p id="count_2_source_4_p">占总体签约机构数：0%</p>
					</div>
					<div class="clearfix"> </div>
				</div>

			</div>

			<div class="col-md-3 market-update-gd" style="width: 20%;margin-bottom: 20px">
				<div class="market-update-block clr-block-6">
					<div class="col-md-12 market-update-left">
						<h4>召回机构数据（1周不用机构）</h4>
						<h3 id="count_2_source_5">0个</h3>
						<p  id="count_2_source_5_p">
							环比：<span style="color: #ccc">-0%-</span>
						</p>
					</div>
					<div class="clearfix"> </div>
				</div>

			</div>

		</div>

	</div>
</div>



<div style="width: 98%; padding-left: 20px;">
	<div class="s-index-side" style="width: 100%;margin-bottom: 30px">
		<div class="title">
			<h3 style="color: #FF4E00;float: left;">小塾学伴功能使用数据</h3>
			<div style="height: 40px;padding-top: 11px;float: left;">
				<div >
					<div class="input-group">
						<span class="input-group-addon addonclick_id-calendar" id="basic-addon1"><i class="fa fa-calendar"></i></span>
						<input type="text" id="calendar3" placeholder="test" class="form-control"  autocomplete="off" th:value="${weekDate}"  onclick="WdatePicker({isShowWeek:true,onpicked:funccc3,errDealMode:3})">
					</div>
				</div>
			</div>
			<div style="height: 40px;padding-top: 3px;float: left;">
				<button class="btn btn-large btn-primary" type="button" id="calendar3Btu">刷新</button>
				<form id="seachform3" method="post" style="float: right;margin-left: 10px;">
					<input type="button" id="button3" class=" btn btn-large btn-primary" value="导出" />
				</form>
			</div>
		</div>

		<!-- --------------------------------------------- -->

		<table style="width: 98%;height: 100px;text-align: center;margin: 10px;margin-top: 30px"  >
			<tr>
				<td rowspan="5" style="width: 100px;background: #999;">教师端</td>
				<td >签到签离</td>
				<td >作业标注</td>
				<td >作业反馈编辑</td>
				<td >错题本</td>
				<td >定制练习</td>
				<td >学期回顾</td>
				<td >学习成长报告</td>
			</tr>

			<tr id="source_3">
				<td ></td>
				<td ></td>
				<td ></td>
				<td ></td>
				<td ></td>
				<td ></td>
				<td ></td>
			</tr>
			<tr style="height: 4px"></tr>
			<tr>
				<td >计时</td>
				<td >作业登记本</td>
				<td >成长报告·周报</td>
				<td >成长报告·月报</td>
				<td >成长报告·学期</td>
				<td >上传作业</td>
				<td >查看批改结果</td>
			</tr>
			<tr id="source_4">
				<td ></td>
				<td ></td>
				<td ></td>
				<td ></td>
				<td ></td>
				<td ></td>
				<td ></td>
			</tr>
		</table>



		<table style="width: 98%;height: 100px;text-align: center;margin: 10px;margin-top: 30px"  >
			<tr>
				<td rowspan="2" style="width: 100px;background: #999;">学生端</td>
				<td >作业登记本</td>
				<td >计时</td>
				<td >上传作业</td>
				<td >查看批改结果</td>
			</tr>
			<tr id="source_1">
				<td ></td>
				<td ></td>
				<td ></td>
				<td ></td>
			</tr>
		</table>


		<table style="width: 98%;height: 100px;text-align: center;margin: 10px;margin-top: 30px;margin-bottom: 50px"  >
			<tr>
				<td rowspan="2" style="width: 100px;background: #999;">家长端</td>
				<td >作业任务</td>
				<td >错题本</td>
				<td >成长报告·周报</td>
				<td >成长报告·月报</td>
				<td >成长报告·学期</td>
				<td >定制练习</td>
			</tr>
			<tr id="source_2">
				<td ></td>
				<td ></td>
				<td ></td>
				<td ></td>
				<td ></td>
				<td ></td>
			</tr>
		</table>


	</div>
</div>

<script type="text/javascript">
	$(function () {
		$("#button").on('click',function(){
			document.getElementById("seachform").action = "[[${sysUrl}]]/sys/analysis/week/data/count_1/export.html?weekDate="+$("#calendar").val();
			$("#seachform").submit();
		});

		$("#button2").on('click',function(){
			document.getElementById("seachform2").action = "[[${sysUrl}]]/sys/analysis/week/data/count_2/export.html?weekDate="+$("#calendar2").val();
			$("#seachform2").submit();
		});

		$("#button3").on('click',function(){
			document.getElementById("seachform3").action = "[[${sysUrl}]]/sys/analysis/week/data/count_3/export.html?weekDate="+$("#calendar3").val();
			$("#seachform3").submit();
		});
	})
</script>

<script>
	function funccc(){
		$dp.$('calendar').value=$dp.cal.getP('y')+'年-第'+$dp.cal.getP('W','WW')+'周';
	};
	function funccc2(){
		$dp.$('calendar2').value=$dp.cal.getP('y')+'年-第'+$dp.cal.getP('W','WW')+'周';
	};
	function funccc3(){
		$dp.$('calendar3').value=$dp.cal.getP('y')+'年-第'+$dp.cal.getP('W','WW')+'周';
	};
</script>

<script>
	$(function(){
		funccc_count_1();
		funccc_count_2();
		funccc_count_3();

		$("#calendarBtu").on('click',function(){
			funccc_count_1();
		});

		$("#calendar2Btu").on('click',function(){
			funccc_count_2();
		});

		$("#calendar3Btu").on('click',function(){
			funccc_count_3();
		});
	})


	function funccc_count_1(){
		$.ajax({
			url:"[[${sysUrl}]]/sys/analysis/week/data/count_1",
			dataType:'json',
			cache:false,
			type:'get',
			data:{
				weekDate:$("#calendar").val()
			},
			error:function(){return false;},
			success:function(data){
				var source_1=data.data.source_1;
				var source_2=data.data.source_2;

				$("#count_1_source_1").html(source_1.count_0+"个");
				$("#count_1_source_1_p").html("新签开通率：<span>"+parseInt(source_1.count_0/source_1.count_1*100)+"%</span>");

				$("#count_1_source_2").html(source_2.count_0+"个");
				$("#count_1_source_2_p").html("新签激活率：<span>"+parseInt(source_2.count_0/source_2.count_1*100)+"%</span>");

			}
		});
	}


	function funccc_count_2(){
		$.ajax({
			url:"[[${sysUrl}]]/sys/analysis/week/data/count_2",
			dataType:'json',
			cache:false,
			type:'get',
			data:{
				weekDate:$("#calendar2").val()
			},
			error:function(){return false;},
			success:function(data){
				var source_1=data.data.source_1;
				var source_2=data.data.source_2;
				var source_3=data.data.source_3;
				var source_4=data.data.source_4;
				var source_5=data.data.source_5;

				var source_1_count=run_source_count_count(source_1.count_0,source_1.count_1);
				$("#count_2_source_1").html(source_1.count_0+"个");
				$("#count_2_source_1_p_2").html("占总体签约机构数："+parseInt(source_1.count_0/source_1.count_2*100)+"%");
				if(source_1_count > 0){
					$("#count_2_source_1_p_1").html('环比：<span style="color: #0066ff">+'+source_1_count+'% &#8593;</span>');
				}else if(source_1_count ==0 ){
					$("#count_2_source_1_p_1").html('环比：<span style="color: #ccc">-0%- </span>');
				}else{
					$("#count_2_source_1_p_1").html('环比：<span style="color: red">'+source_1_count+'% &#8595;</span>');
				}


				$("#count_2_source_2").html(source_2.count_0+"个");
				$("#count_2_source_2_p").html("占总体签约机构数："+parseInt(source_2.count_0/source_2.count_1*100)+"%");


				var source_3_count=run_source_count_count(source_3.count_0,source_3.count_1);
				$("#count_2_source_3").html(source_3.count_0+"个");
				if(source_3_count > 0){
					$("#count_2_source_3_p").html('环比：<span style="color: #0066ff">+'+source_3_count+'% &#8593;</span>');
				}else if(source_3_count ==0 ){
					$("#count_2_source_3_p").html('环比：<span style="color: #ccc">-0%- </span></p>');
				}else{
					$("#count_2_source_3_p").html('环比：<span style="color: red">'+source_3_count+'% &#8595;</span>');
				}


				$("#count_2_source_4").html(source_4.count_0+"个");
				$("#count_2_source_4_p").html("占总体签约机构数："+parseInt(source_4.count_0/source_4.count_1*100)+"%");

				var source_5_count=run_source_count_count(source_5.count_0,source_5.count_1);
				$("#count_2_source_5").html(source_5.count_0+"个");
				if(source_5_count > 0){
					$("#count_2_source_5_p").html('环比：<span style="color: #0066ff">+'+source_5_count+'% &#8593;</span>');
				}else if(source_5_count ==0 ){
					$("#count_2_source_5_p").html('环比：<span style="color: #ccc">-0%- </span>');
				}else{
					$("#count_2_source_5_p").html('环比：<span style="color: red">'+source_5_count+'% &#8595;</span>');
				}

			}
		});
	}

	function funccc_count_3(){
		$.ajax({
			url:"[[${sysUrl}]]/sys/analysis/week/data/count_3",
			dataType:'json',
			cache:false,
			type:'get',
			data:{
				weekDate:$("#calendar3").val()
			},
			error:function(){return false;},
			success:function(data){
				var source_1=data.data.source_1;
				var source_2=data.data.source_2;
				var source_3=data.data.source_3;

				var source_1_count_0=run_source_count_count(source_1.count_0,source_1.count_0_0);
				var source_1_count_1=run_source_count_count(source_1.count_1,source_1.count_1_1);
				var source_1_count_2=run_source_count_count(source_1.count_2,source_1.count_2_2);
				var source_1_count_3=run_source_count_count(source_1.count_3,source_1.count_3_3);


				var source_2_count_0=run_source_count_count(source_2.count_0,source_2.count_0_0);
				var source_2_count_1=run_source_count_count(source_2.count_1,source_2.count_1_1);
				var source_2_count_2=run_source_count_count(source_2.count_2,source_2.count_2_2);
				var source_2_count_3=run_source_count_count(source_2.count_3,source_2.count_3_3);
				var source_2_count_4=run_source_count_count(source_2.count_4,source_2.count_4_4);
				var source_2_count_5=run_source_count_count(source_2.count_5,source_2.count_5_5);

				var source_3_count_0=run_source_count_count(source_3.count_0,source_3.count_0_0);
				var source_3_count_1=run_source_count_count(source_3.count_1,source_3.count_1_1);
				var source_3_count_2=run_source_count_count(source_3.count_2,source_3.count_2_2);
				var source_3_count_3=run_source_count_count(source_3.count_3,source_3.count_3_3);
				var source_3_count_4=run_source_count_count(source_3.count_4,source_3.count_4_4);
				var source_3_count_5=run_source_count_count(source_3.count_5,source_3.count_5_5);
				var source_3_count_6=run_source_count_count(source_3.count_6,source_3.count_6_6);
				var source_3_count_7=run_source_count_count(source_3.count_7,source_3.count_7_7);
				var source_3_count_8=run_source_count_count(source_3.count_8,source_3.count_8_8);
				var source_3_count_9=run_source_count_count(source_3.count_9,source_3.count_9_9);
				var source_3_count_10=run_source_count_count(source_3.count_10,source_3.count_10_10);
				var source_3_count_11=run_source_count_count(source_3.count_11,source_3.count_11_11);
				var source_3_count_12=run_source_count_count(source_3.count_12,source_3.count_12_12);
				var source_3_count_13=run_source_count_count(source_3.count_13,source_3.count_13_13);

				//------------------
				show_source("#source_1",0,source_1.count_0,source_1_count_0);
				show_source("#source_1",1,source_1.count_1,source_1_count_1);
				show_source("#source_1",2,source_1.count_2,source_1_count_2);
				show_source("#source_1",3,source_1.count_3,source_1_count_3);

				//------------------

				show_source("#source_2",0,source_2.count_0,source_2_count_0);
				show_source("#source_2",1,source_2.count_1,source_2_count_1);
				show_source("#source_2",2,source_2.count_2,source_2_count_2);
				show_source("#source_2",3,source_2.count_3,source_2_count_3);
				show_source("#source_2",4,source_2.count_4,source_2_count_4);
				show_source("#source_2",5,source_2.count_5,source_2_count_5);

				//------------------

				show_source("#source_3",0,source_3.count_0,source_3_count_0);
				show_source("#source_3",1,source_3.count_1,source_3_count_1);
				show_source("#source_3",2,source_3.count_2,source_3_count_2);
				show_source("#source_3",3,source_3.count_3,source_3_count_3);
				show_source("#source_3",4,source_3.count_4,source_3_count_4);
				show_source("#source_3",5,source_3.count_5,source_3_count_5);
				show_source("#source_3",6,source_3.count_6,source_3_count_6);
				show_source("#source_4",0,source_3.count_7,source_3_count_7);
				show_source("#source_4",1,source_3.count_8,source_3_count_8);
				show_source("#source_4",2,source_3.count_9,source_3_count_9);
				show_source("#source_4",3,source_3.count_10,source_3_count_10);
				show_source("#source_4",4,source_3.count_11,source_3_count_11);
				show_source("#source_4",5,source_3.count_12,source_3_count_12);
				show_source("#source_4",6,source_3.count_13,source_3_count_13);

			}
		});
	}


	function run_source_count_count(count,count_count){
		count=parseInt(count);
		count_count=parseInt(count_count);
		return parseInt(((count/(count+count_count==0 ? 1 : count+count_count))-(count_count/(count+count_count==0 ? 1 : count+count_count)))*100);
	}


	function show_source(obj,index,source_count,source_count_count){
		if(source_count_count > 0){
			$(obj).children('td:eq('+index+')').html('<h2>'+source_count+'次</h2><p>环比：<span style="color: #0066ff">+'+source_count_count+'% &#8593;</span></p>');
		}else if(source_count_count ==0 ){
			$(obj).children('td:eq('+index+')').html('<h2>'+source_count+'次</h2><p>环比：<span style="color: #ccc">-0%- </span></p>');
		}else{
			$(obj).children('td:eq('+index+')').html('<h2>'+source_count+'次</h2><p>环比：<span style="color: red">'+source_count_count+'% &#8595;</span></p>');
		}
	}


</script>


</body>
</html>
