帮洪庆提交 内容：网站域名统计详情

src/main/webapp/WEB-INF/views/dashboard/dashBoardIndex.jsp

@@ -31,7 +31,7 @@
     <div class="data_info">
         <div class="info_1 fl_fc">
             <div class="text_1">
-                <div class="fr_fc" style="width:55%">
+                <div class="fr_fc" style="width:60%">
                  <div class="fl_visual">
                 	<a href="${ctx}/dashboard/traffic/bandwidthList"><i class="fa fa-cloud-download"></i></a>
                  </div>
@@ -45,10 +45,7 @@
                         	<span class="numberRun4">0</span > <span class="numberRun4-unit">bps</span></a>
                     </div>
                 </div>
-                
-                
-                
-                <div class="fr_fc" style="width:45%">
+                <div class="fr_fc" style="width:40%">
                 	<div class="fl_visual">
                 		<a href="${ctx}/dashboard/traffic/trafficBlockList?searchAction=block"><i class="fa fa-ban"></i></a>
                 	 </div>
@@ -77,18 +74,6 @@
                         <a href="${ctx}/dashboard/traffic/trafficBlockList?searchAction=monitor"><p class="numberRun2">0</p></a>
                     </div>
                 </div>
-                <div class="fr_fc">
-             		<div class="fl_visual">
-                		<i class="fa fa-smile-o"> </i>
-                	 </div>
-                    <div class="fl_fc">
-                        <p data-original-title="<spring:message code="pass"/>" 
-                         class="tooltips" data-flag="false" data-html="true" data-placement="top"> 
-                         <!-- pass --><spring:message code="pass"/></p>
-                        <p class="numberRun7">0</p>
-                    </div>
-                </div>
-                
             	<div class="fr_fc">
             		<div class="fl_visual">
                 		<i class="fa fa-trash"> </i>
@@ -128,19 +113,6 @@
                     
                     </div>
                 </div>
-                
-                <div class="fr_fc">
-             		<div class="fl_visual">
-                		<i class="fa fa-heartbeat"> </i>
-                	 </div>
-                    <div class="fl_fc">
-                        <p data-original-title="<spring:message code="live_link"/>" 
-                         class="tooltips" data-flag="false" data-html="true" data-placement="top"> 
-                         <!-- live link--><spring:message code="live_link"/></p>
-                        <p class="numberRun8">0</p>
-                    </div>
-                </div>
-                
                  <div class="fr_fc">
                 	<div class="fl_visual">
                 		<i class="fa fa-unlink"> </i>
@@ -155,8 +127,28 @@
                     </div>
                 </div>
                 
-                
-                
+                <div class="fr_fc">
+             		<div class="fl_visual">
+                		<i class="fa fa-smile-o"> </i>
+                	 </div>
+                    <div class="fl_fc">
+                        <p data-original-title="<spring:message code="pass"/>" 
+                         class="tooltips" data-flag="false" data-html="true" data-placement="top"> 
+                         <!-- pass --><spring:message code="pass"/></p>
+                        <p class="numberRun7">0</p>
+                    </div>
+                </div>
+                <div class="fr_fc">
+             		<div class="fl_visual">
+                		<i class="fa fa-heartbeat"> </i>
+                	 </div>
+                    <div class="fl_fc">
+                        <p data-original-title="<spring:message code="live_link"/>" 
+                         class="tooltips" data-flag="false" data-html="true" data-placement="top"> 
+                         <!-- live link--><spring:message code="live_link"/></p>
+                        <p class="numberRun8">0</p>
+                    </div>
+                </div>
                 
         </div>
     </div>
@@ -172,12 +164,6 @@
                 <div class="main_title">
                 <spring:message code="traffic_ipactive_chart"/>&nbsp;&nbsp;<a href="${ctx}/dashboard/ipActiveList"><i class="fa fa-line-chart"></i></a> <a href="javascipt:void(0)" onclick="ipActiveList();return false;"><i class="fa fa-refresh"></i></a>
                 </div>
-                <div style="margin-left:150px;margin-top:19px;position:absolute;z-index:1000;">
-	                <input id="ipBeginDate" name="beginDate" type="text" readonly="readonly" class="Wdate" style="font-size:10px;width:125px;background-color: #424242;border:0;color:#fff"
-						value="" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true,maxDate:'#F{$dp.$D(\'ipEndDate\')}'});"/>
-	                <input id="ipEndDate" name="endDate" type="text" readonly="readonly" class="Wdate" style="font-size:10px;width:125px;background-color: #424242;border:0;color:#fff""
-						value="" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true,minDate:'#F{$dp.$D(\'ipBeginDate\')}'});"/>
-				</div>
                <!-- 活跃IP图 --> <div id="chart_main" style="width:100%;height:400px;"></div>
             </div>
         </div>
@@ -235,7 +221,7 @@
           <div class="main_center1 fl">
             <div class="bottom_web fl">
 	            <div class="main_title_web">
-                    <spring:message code="traffic_website_list"/>&nbsp;&nbsp;<%-- <a href="${ctx}/dashboard/traffic/webTypeList"><i class="fa fa-line-chart"></i></a> --%>
+                    <spring:message code="traffic_website_list"/>&nbsp;&nbsp;<a href="${ctx}/dashboard/traffic/webTypeList"><i class="fa fa-line-chart"></i></a>
                     <a href="javascipt:void(0)" onclick="websiteList();return false;"><i class="fa fa-refresh"></i></a>
                 </div>
 	             <div class="main_table_web">
@@ -587,14 +573,11 @@ function protocolList(){
   }
 //活跃IP统计
 function ipActiveList(){
-	var begin=$("#ipBeginDate").val();
-	var end=$("#ipEndDate").val();
 	loading();
 	$.ajax({
 		url: '${ctx}/dashboard/ipActive',
 		type : "get" ,
 		dataType:"json",
-		data:{"beginDate":begin,"endDate":end},
 		cache:false,
 		async:true,
 		timeout:60000,//超时时间设置，查询接口时间过长超时

src/main/webapp/WEB-INF/views/dashboard/trafficDomainTrans.jsp

@@ -0,0 +1,130 @@
+<%@ page contentType="text/html;charset=UTF-8"%>
+<%@ include file="/WEB-INF/include/taglib.jsp"%>
+<html>
+<head>
+<title>
+	<spring:message code="traffic_ip_active"></spring:message>
+</title>
+</head>
+
+<body >
+
+<div class="page-content">
+	<div class="theme-panel hidden-xs hidden-sm">
+<%-- 	<button type="button" class="btn btn-default" onClick="javascript:window.location='${ctx}/dashboard/ipActiveList'"><i class="fa fa-refresh"></i></button> --%>
+<%-- 	<button type="button" class="btn btn-default" onClick="javascript:window.location='${ctx}/dashboard/logChart'"><i class="fa fa-history"></i></button> --%>
+	</div>
+<%-- 	<h3 class="page-title">
+		<spring:message code="domain_name"></spring:message>
+	</h3> --%>
+		<div class="row" >
+			<form:form id="searchForm" action="${ctx}/dashboard/traffic/ajaxDomainTrans" method="get" class="form-search">
+			<input id="beginDate" type="hidden" value="${beginDate}"/>
+			<input id="endDate" type="hidden" value="${endDate}"/>
+			<input id="domain" type="hidden" value="${domain}"/>
+			<input id="entranceId" type="hidden" value="${entranceId}"/>
+			<input id="domainName" type="hidden" value="${domainName}"/>
+			<!-- 搜索内容与操作按钮栏 -->
+	
+			<!-- 搜索内容与操作按钮栏 -->
+					</form:form>
+				</div>
+	<div id="chart" style="width:95%;height:500px;"></div>
+	
+</div>
+<script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/highcharts.js"></script>
+<script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/exporting.js"></script>
+<script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/series-label.js"></script>
+<script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/offline-exporting.js"></script>
+<%-- <script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/themes/grid.js"></script> --%>
+<script type="text/javascript">
+$(document).ready(function(){
+	domainTrans();
+});
+	//活跃IP一小时间隔五分钟统计
+	function domainTrans(){
+		var beginDate=$("#beginDate").val();
+		var endDate=$("#endDate").val();
+		var entranceId=$("#entranceId").val();
+		var domain=$("#domain").val();
+		loading();
+		$.ajax({
+			url: '${ctx}/dashboard/traffic/ajaxDomainTrans',
+			type : "get" ,
+			dataType:"json",
+			data:{"beginDate":beginDate,"endDate":endDate,"entranceId":entranceId,"domain":domain},
+			cache:false,
+			async:false,
+			timeout:40000,
+			success:function (rs) {
+				$("#tbodyData").html("");
+				if(rs!=null&&rs.length>0){
+					showDomainTrans(rs);
+				}
+				closeTip();
+			},  
+			error: function(data, textStatus, errorThrown){
+				closeTip();
+//	 			warning_prompt("获取实时列表数据失败！",1500);
+			},
+			complete:function(XMLHttpRequest,status){//超时设置
+				closeTip();
+			}
+		});
+		 
+	  }
+function showDomainTrans(rs){
+	var domainName= $("#domainName").val();
+	var data=new Array();
+	var xData=new Array();
+		xData=rs[0].statTime;
+	var series=new Array();
+	console.log(rs[0].statTime)
+	console.log(rs[0].count)
+// 	$(rs).each(function(i, d) {
+	series.push({
+		name: ' ',
+		data: rs[0].count
+	});
+// 	})
+	var chart = Highcharts.chart('chart', {
+		 chart:{
+// 			type: 'area',
+			 zoomType: 'x'
+		},
+		exporting: {
+			filename:'Domain',
+			scale:1,
+			sourceWidth: 1280,
+			sourceHeight: 500,
+		},
+	    title: {
+	        text: domainName
+	    },
+		xAxis: {
+			type:'category',
+			categories: xData,
+			title: {
+					text: 'time',
+					align:'high',
+			},
+
+	},
+	    yAxis: {
+	        title: {
+	            text: ''
+	        }
+	    },
+	    credits:{//是否有highcharts水印
+	        enabled:false
+	    },
+	    legend: {
+	    	enabled:false
+	    },
+	    series: series,
+	});
+}
+
+</script>
+</body>
+</html>

src/main/webapp/WEB-INF/views/dashboard/trafficWebTypeList.jsp

@@ -3,27 +3,14 @@
 <html>
 <head>
 <title>网站主题服务分类</title>
-<link rel="stylesheet"
-	href="${pageContext.request.contextPath}/static/pages/css/dashboard.css">
-<link rel="stylesheet"
-	href="${pageContext.request.contextPath}/static/pages/css/pagination.css">
+ <link rel="stylesheet" href="${pageContext.request.contextPath}/static/pages/css/dashboard.css">
+ <link rel="stylesheet" href="${pageContext.request.contextPath}/static/pages/css/pagination.css">
+
+ <script src="${pageContext.request.contextPath}/static/pages/scripts/jquery.pagination.js"></script>
+ <script src="${ctxStatic }/global/plugins/tableExport-3.3.13/xlsx.core.js"></script>
+ <script src="${ctxStatic }/global/plugins/tableExport-3.3.13/FileSaver.js"></script>
+ <script src="${ctxStatic }/global/plugins/tableExport-3.3.13/tableexport.js"></script>
 
-<script
-	src="${pageContext.request.contextPath}/static/pages/scripts/jquery.pagination.js"></script>
-<script
-	src="${ctxStatic }/global/plugins/tableExport-3.3.13/xlsx.core.js"></script>
-<script
-	src="${ctxStatic }/global/plugins/tableExport-3.3.13/FileSaver.js"></script>
-<script
-	src="${ctxStatic }/global/plugins/tableExport-3.3.13/tableexport.js"></script>
-<script
-	src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/highcharts.js"></script>
-<script
-	src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/exporting.js"></script>
-<script
-	src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/series-label.js"></script>
-<script
-	src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/offline-exporting.js"></script>
 </head>
 
 <style type="text/css">
@@ -33,18 +20,19 @@
 	<div class="page-content">
 		<div class="theme-panel hidden-xs hidden-sm">
 			<button type="button" class="btn btn-default"
-				onClick="javascript:window.location='${ctx}/dashboard/webTypeList'">
-				<spring:message code="refresh" />
+				onClick="javascript:window.location='${ctx}/dashboard/traffic/webTypeList'">
+				<i class="fa fa-refresh"></i>
 			</button>
 			<button type="button" class="btn btn-default"
 				onClick="javascript:window.location='${ctx}/dashboard/logChart'">
-				<spring:message code="back" />
+				<i class="fa fa-history"></i>
 			</button>
 		</div>
 		<h3 class="page-title">
-			<spring:message code="traffic_website_type_chart"></spring:message>
+			<spring:message code="domain_name"></spring:message>
 		</h3>
 		<h5 class="page-header"></h5>
+		<div class="row">
 		<form:form id="searchForm"
 			action="${ctx}/dashboard/traffic/websiteList" method="get"
 			class="form-search">
@@ -59,9 +47,9 @@
 									code="begin_date" /></span>
 						</div>
 						<input id="beginDate" name="beginDate" type="text"
-							readonly="readonly" class="form-control Wdate input-medium"
+							readonly="readonly" class="form-control" style="width:200px"
 							value=""
-							onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true,maxDate:'${beginDate}'});" />
+							onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true,maxDate:'#F{$dp.$D(\'endDate\')}'});"/>
 					</div>
 				</div>
 				<div class="pull-left">
@@ -71,11 +59,37 @@
 									code="end_date" /></span>
 						</div>
 						<input id="endDate" name="endDate" type="text" readonly="readonly"
-							class="form-control Wdate input-medium" value=""
-							onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true,maxDate:'${endDate}'});" />
+							class="form-control" value="" style="width:200px"
+							onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true,minDate:'#F{$dp.$D(\'beginDate\')}',maxDate:'${endDate}'});"/>
 					</div>
 				</div>
 
+					<div class="pull-left">	
+		 				  <div class="input-group">
+		                     <div class="input-group-btn">
+								<span class="selectpicker form-control" ><spring:message code="domain_name"/></span>
+                          	</div>
+                              	<select id="domain" name="domain" class="selectpicker form-control" width="100px" data-live-search="true" data-live-search-placeholder="search">
+									<option value=""><spring:message code="select"/></option>
+									<c:forEach items="${domainList}" var="dict" >
+										<option value="${dict.id}"><spring:message code="${dict.domain}"></spring:message></option>
+									</c:forEach>
+								</select>
+						</div>
+                    		</div>
+					<div class="pull-left">	
+		 				  <div class="input-group">
+		                     <div class="input-group-btn">
+								<span class="selectpicker form-control" ><spring:message code="entrance_id"/></span>
+                          	</div>
+                              	<select id="entranceId" name="entranceId" class="selectpicker form-control" width="100px" data-live-search="true" data-live-search-placeholder="search">
+									<option value=""><spring:message code="select"/></option>
+									<c:forEach items="${fns:getDictList('AREA_NAME')}" var="dict" >
+										<option value="${dict.itemCode}"><spring:message code="${dict.itemValue}"></spring:message></option>
+									</c:forEach>
+								</select>
+						</div>
+                    		</div>
 				<div class="pull-left">
 					<button type="button" class="btn blue"
 						onClick="return searchList()">
@@ -88,24 +102,20 @@
 					</button>
 					
 				</div>
-				<div class="pull-right">
-				<button type="button" class="btn btn-default" id="export-btn" >
-							<i class="fa fa-download"> <spring:message code="export" /></i>
-				</button>
-				</div>
+				
 			</div>
 			<!-- 搜索内容与操作按钮栏 -->
 		</form:form>
+		</div>
+		<div class="row" >
+			<div id="chart"  style="width:98%;height: 510px; -moz-user-select: none; position: relative;"></div>
+		</div>
 		<%-- <ul class="nav nav-tabs">
 			<li class="active"><a href="#">网站</a></li>
 			<li><a href="${ctx}/dashboard/ipActiveList">主题</a></li>
 			<li><a href="${ctx}/dashboard/ipActiveList">服务</a></li>
 		</ul> --%>
-		<%-- 
-	<embed width="700px" height="500px" src="${pageContext.request.contextPath}/static/global/plugins/highcharts/svg.svg"></embed>
-	 --%>
-		<!--  -->
-		<!-- <div id="chart" style="width:100%;height:400px;"></div> -->
+
 
 		<div class="col-md-12">
 			<div class="portlet">
@@ -155,19 +165,26 @@
 						});
 					</script>
 					<sys:message content="${message}" type="${messageType }" />
-					
+					<div class="row">
+						<div class="pull-right">
+						<button type="button" class="btn btn-default" id="export-btn" >
+									<i class="fa fa-download"> <spring:message code="export" /></i>
+						</button>
+						</div>
+					</div>
+					<div class="row">
 					<div class="table-responsive">
 						<table id="contentTable" style="width: 100%;"
 							class="table table-hover table-striped table-bordered table-condensed text-nowrap">
 							<thead>
 								<tr>
-									<th><spring:message code="Domain" /></th>
-									<th><spring:message code="Link Times" /></th>
-									<th><spring:message code="Percentage(Link Times)" /></th>
-									<th><spring:message code="Packets" /></th>
-									<th><spring:message code="Percentage(Packets)" /></th>
-									<th><spring:message code="Gbyte" /></th>
-									<th><spring:message code="Percentage(Gbyte)" /></th>
+									<th><spring:message code="domain_name"/></th>
+									<th><spring:message code="unique_num"/></th>
+									<th><spring:message code="entrance_id"/></th>
+									<th><spring:message code="packets"/></th>
+									<th><spring:message code="percentage"/> (<spring:message code="packets"/>)</th>
+									<th><spring:message code="Gbyte"/></th>
+									<th><spring:message code="percentage"/> (<spring:message code="Gbyte"/>)</th>
 								</tr>
 							</thead>
 							<tbody id="tableData"></tbody>
@@ -181,94 +198,33 @@
 							<spring:message code="noneData" />
 						</div>
 					</div>
-					<%-- <div class="right-table" style="width: 30%;float: right;" >
-				<h3>
-					<span class="title-num">&nbsp;1 </span>
-					<label>分类流量统计</label>
-				</h3>
-					<table id="contentTable2" class="table table-striped table-bordered table-condensed text-nowrap">
-						<tbody>
-								<tr><td><spring:message code="新闻"/></td><td>12131</td></tr>
-								<tr><td><spring:message code="军事"/></td><td>241241</td></tr>
-								<tr><td><spring:message code="娱乐"/></td><td>31412</td></tr>
-								<tr><td><spring:message code="游戏"/></td><td>34655</td></tr>
-								<tr><td><spring:message code="科技"/></td><td>37457</td></tr>
-								<tr><td><spring:message code="。。"/></td><td>33457</td></tr>
-								<tr><td><spring:message code="。。"/></td><td>38468</td></tr>
-								<tr><td><spring:message code="。。"/></td><td>3367</td></tr>
-								<tr><td><spring:message code="。。"/></td><td>33456</td></tr>
-						</tbody>
-					</table>
-					<div id="page"><div class="M-box" style="float: right"></div></div>
-        			<div class="none-data"><i class="fa fa-warning font-red-flamingo"></i>&nbsp;&nbsp;<spring:message code="noneData"/></div>
-				</div> --%>
+					</div>
 				</div>
 			</div>
 		</div>
 	</div>
-	<script
-		src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/highcharts.js"></script>
+<script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/highcharts.js"></script>
+<script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/exporting.js"></script>
+<script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/series-label.js"></script>
+<script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/offline-exporting.js"></script>
 	<script type="text/javascript">
-		/* $(document).ready(function(){
-		 var chart = Highcharts.chart('chart', {
-		 title: {
-		 text: '网站分类'
-		 },
-		 yAxis: {
-		 title: {
-		 text: 'bps'
-		 }
-		 },
-		 legend: {
-		 layout: 'vertical',
-		 align: 'right',
-		 verticalAlign: 'middle'
-		 },
-		 xAxis:{
-		 type:'datetime',
-		 dateTimeLabelFormats:{
-		 day:'%Y-%m-%d %h'
-		 }
-		 },
-		 plotOptions: {
-		 series: {
-		 pointStart: Date.UTC(2018, 8, 16,1),
-		 pointInterval: 3600*1000,
-		 // 	            pointIntervalUnit:'day'
-		 }
-		 },
-
-		 series: [{
-		 name: 'Installation',
-		 data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175]
-		 }],
-
-		 responsive: {
-		 rules: [{
-		 condition: {
-		 maxWidth: 500
-		 },
-		 chartOptions: {
-		 legend: {
-		 layout: 'horizontal',
-		 align: 'center',
-		 verticalAlign: 'bottom'
-		 }
-		 }
-		 }]
-		 }
-
-		 });
-		
-		 }); */
-
-		$(document).ready(
-				function() {
-					var starth = $("#beginDateh").val();
-					var endh = $("#endDateh").val();
-					$("#beginDate").val(starth);
-					$("#endDate").val(endh);
-					ajaxWebTypeList(starth, endh);
+	$(document).ready(function(){
+			var starth = $("#beginDateh").val();
+			var endh = $("#endDateh").val();
+			$("#beginDate").val(starth);
+			$("#endDate").val(endh);
+			
+			//筛选功能初始化
+			$("#resetBtn").on("click",function(){
+					$("select.selectpicker").each(function(){
+						$(this).selectpicker('val',$(this).find('option:first').val());
+						$(this).find("option").attr("selected",false);
+						$(this).find("option:first").attr("selected",true);
+					});
+					$(".Wdate").attr("value",'');
+					$("#searchForm")[0].reset();
+				}); 
+				ajaxWebTypeList(starth, endh);
 
 					setInterval(function() {
 						ajaxWebTypeList(starth, new Date()
@@ -286,18 +242,21 @@
 			}
 		}
 		function ajaxWebTypeList(start, end) {
+			var domain = $("#domain").val();
+			var entranceId = $("#entranceId").val();
 			loading();
-			$
-					.ajax({
+			$.ajax({
 						url : '${ctx}/dashboard/traffic/websiteList',
 						type : 'get',
 						dataType : "json",
 						data : {
 							"beginDate" : start,
-							"endDate" : end
+							"endDate" : end,
+							"domain" : domain,
+							"entranceId" : entranceId
 						},
 						async : false,
-						timeout : 10000,
+						timeout : 40000,
 						success : function(data) {
 							if (data != null && data.length > 0
 									&& data[0].error != null) {
@@ -307,7 +266,7 @@
 												"<spring:message code='info'/>");
 								return;
 							}
-							console.log(JSON.stringify(data));
+							webTypeChart(data)
 							fileData = data;
 							getPageData(1, 10);//初始化第一页的数据
 							pageJuan(10);//初始化分页
@@ -335,7 +294,7 @@
 				headings : true,
 				footers : true,
 				formats : [ "xlsx" ],
-				fileName : "website",
+				fileName : "Domain",
 				bootstrap : false
 			});
 			$("#myexport").click();
@@ -379,12 +338,11 @@
 				$.each(fileDataS, function(index, data) {
 					if (data != null) {
 
-						var html = "<tr>";
-						html += "<td class='tc'>"
-								+ data.website + "</td>";
-						html += "<td class='tc'>" + data.linkNum + "</td>";
-						html += "<td class='tc'>" + data.perLink + "</td>";
-						html += "<td class='tc'>" + data.packets + "</td>";
+						var html = '<tr onclick="searchByDomain(\''+data.webId+'\',\''+data.website+'\')">';
+						html += "<td class='tc'>" + data.website + "</td>";
+						html += "<td class='tc'>" + data.uniqueNum + "</td>";
+						html += "<td class='tc'>" + data.entranceId + "</td>";
+						html += "<td class='tc'>" + data.pktCount + "</td>";
 						html += "<td class='tc'>" + data.perPackets + "</td>";
 						html += "<td class='tc'>" + data.Gbyte + "</td>";
 						html += "<td class='tc'>" + data.perGbyte + "</td>";
@@ -395,36 +353,22 @@
 			}
 		}
 
-		function chartData(websiteId) {
-			loading();
-			$
-					.ajax({
-						url : '${ctx}/dashboard/traffic/websiteChart',
-						type : 'get',
-						dataType : "json",
-						data : {
-							"websiteId" : websiteId
-						},
-						async : false,
-						timeout : 10000,
-						success : function(data) {
-							if (data != null && data.length > 0
-									&& data[0].error != null) {
-								top.$.jBox
-										.tip(
-												"<spring:message code='request_service_failed'/>",
-												"<spring:message code='info'/>");
-								return;
-							}
-							webTypeChart(data);
-						},
-						error : function(data, textStatus, errorThrown) {
-							closeTip();
-						},
-						complete : function(XMLHttpRequest, status) {//超时设置
-							closeTip();
-						}
-					});
+		function searchByDomain(domain,domainName){
+			var beginDate = $("#beginDate").val();
+			var endDate = $("#endDate").val();
+			var entranceId = $("#entranceId").val();
+			var url= "${ctx}/dashboard/traffic/domainTrans?beginDate="+beginDate+"&endDate="+endDate+"&domain="+domain+"&domainName="+domainName+"&entranceId="+entranceId;
+			openPicWindow(url);
+		}
+		function openPicWindow(url){
+			$.jBox("iframe:"+url, {
+				title: "",
+			    top: '1%',
+			    draggable:false,
+			    width: $(document).width()*0.9,
+			    height:$(document).height()*0.9,
+			    buttons: { 'close': true }
+			});
 		}
 		/**
 		 * 分页控件处理
@@ -447,113 +391,114 @@
 				});
 			}
 		}
-		// 比例协议统计图
-		/* function webTypeChart(rs){
-		 //终端用户 分操作系统与浏览器 
-		 var data=new Array();
-		 $(rs).each(function(i, d) {
-		 data.push({
-		 name: d.website,
-		 y: d.count,
-		 });
-		 });
-		 // 创建图例
-		 var chart = Highcharts.chart('chart',{
-		 chart: {
-		 plotBackgroundColor:null,
-		 plotBorderWidth:null,
-		 plotShadow:false,
-		 type: 'pie'
-		 },
-		 navigation: {
-		 buttonOptions: {
-		 x:-25,
-		 }
-		 },
-		 exporting: {
-		 allowHTML:true,
-		 filename:"Website",
-		 scale:1,
-		 sourceWidth: 1280,
-		 sourceHeight: 500,
-		 },
-		 noData:{
-		 style: {//设置字体颜色
-		 color: '#000',
-		 },	
-		 },
-		 // 				legend:{// 底部平鋪图例
-		 // 					width:1280,
-		 // 	    	    	x:40,
-		 // 	    	    	itemWidth:100,
-		 // 	    	    	itemDistance:2,
-		 // 	    	    	itemHoverStyle:{
-		 // 	    	    		color:'#61D2F7',
-		 // 	    	    	},
-		 // 	    	    },
-		 legend: {
-		 // 	    			layout: 'vertical',
-		 align: 'right',
-		 verticalAlign: 'middle',
-		 width:380,
-		 itemWidth:100,
-		 itemDistance:2,
-		 itemHoverStyle:{
-		 color:'#61D2F7',
-		 },
-		 },
-		 // 				colors:['#f36f8a', '#44A9A8', '#ffff43','#25f3e6','#964CEC','#32B0ED','#2b6ed7','#7278DD','#2DA9D8','#C66FE6'],
-		 title: {
-		 text: null,
-		 },
-		 plotOptions: {
-		 series: {
-		 dataLabels: {
-		 enabled: true,
-		 softConnector: true,   // 是否使用曲线
-		 formatter: function () {
-		 // 通过函数判断是否显示数据标签，为了防止数据标签过于密集
-		 return this.percentage > 1 ? '<b>' + this.point.name + ' :</b> '  +this.percentage.toFixed(2)+' %'  : null;
-		 },
-		 style: {
-		 color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
-		 }
-		 },
-		 },
-		 pie:{
-		 allowPointSelect: true,
-		 showInLegend: true,	
-		 point: {
-		 events: {
-		 mouseOver: function(e) { 
-		 this.slice();
-		 },
-		 // 鼠标移出时，收回突出显示
-		 mouseOut: function() {
-		 this.slice();
-		 },
-		 // 默认是点击突出，这里屏蔽掉
-		 click: function() {
-		 return false;
-		 }
-		 },
-		 },
-		 }
-		 },
-		 credits:{//是否有highcharts水印
-		 enabled:false
-		 },
-		 tooltip: {
-		 headerFormat: '{series.name}<br>',
-		 pointFormat: '{point.name}: <b>{point.percentage:.2f}%</b>'
-		 },
-		 series: [{
-		 name: "Website",
-		 colorByPoint: true,
-		 data: data
-		 }],
-		 });
-		 } */
+		// 比例域名统计图
+
+function webTypeChart(rs){
+	   //终端用户 分操作系统与浏览器 
+		var data=new Array();
+		$(rs).each(function(i, d) {
+			data.push({
+				name: d.website,
+				y: parseFloat(d.Gbyte),
+			});
+	   });
+		// 创建图例
+		var chart = Highcharts.chart('chart',{
+				chart: {
+		    			plotBackgroundColor:null,
+		    			plotBorderWidth:null,
+		    			plotShadow:false,
+						type: 'pie'
+				},
+				navigation: {
+	    			buttonOptions: {
+	    				x:-25,
+	    			}
+	    		},
+				exporting: {
+	    			allowHTML:true,
+	    			filename:"Domain",
+	    			scale:1,
+	    			sourceWidth: 1280,
+	    			sourceHeight: 500,
+	    		},
+				noData:{
+					style: {//设置字体颜色
+						color: '#000',
+					},	
+	    		},
+// 				legend:{// 底部平鋪图例
+// 					width:1280,
+// 	    	    	x:40,
+// 	    	    	itemWidth:100,
+// 	    	    	itemDistance:2,
+// 	    	    	itemHoverStyle:{
+// 	    	    		color:'#61D2F7',
+// 	    	    	},
+// 	    	    },
+	    	    legend: {
+// 	    			layout: 'vertical',
+	    			align: 'right',
+	    			verticalAlign: 'middle',
+	    			width:380,
+	    	    	itemWidth:100,
+	    	    	itemDistance:2,
+	    	    	itemHoverStyle:{
+	    	    		color:'#61D2F7',
+	    	    	},
+	    		},
+// 				colors:['#f36f8a', '#44A9A8', '#ffff43','#25f3e6','#964CEC','#32B0ED','#2b6ed7','#7278DD','#2DA9D8','#C66FE6'],
+				title: {
+						text: null,
+				},
+				plotOptions: {
+						series: {
+							dataLabels: {
+								enabled: true,
+								softConnector: true,   // 是否使用曲线
+								formatter: function () {
+				                    // 通过函数判断是否显示数据标签，为了防止数据标签过于密集
+				                    return this.percentage > 1 ? '<b>' + this.point.name + ' :</b> '  +this.percentage.toFixed(2)+' %'  : null;
+				                },
+				                style: {
+									color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
+							}
+							},
+						},
+						pie:{
+							allowPointSelect: true,
+							showInLegend: true,	
+							point: {
+								events: {
+									mouseOver: function(e) { 
+											this.slice();
+									},
+									// 鼠标移出时，收回突出显示
+									mouseOut: function() {
+											this.slice();
+									},
+									// 默认是点击突出，这里屏蔽掉
+									click: function() {
+											return false;
+									}
+								},
+							},
+						}
+				},
+				credits:{//是否有highcharts水印
+			        enabled:false
+			    },
+			    tooltip: {
+					headerFormat: '{series.name}<br>',
+					pointFormat: '{point.name}: <b>{point.percentage:.2f}%</b>'
+				},
+				series: [{
+						name: "Domain",
+						colorByPoint: true,
+						data: data
+				}],
+		});
+}
 	</script>
 </body>
 </html>

src/main/webapp/static/pages/scripts/echart.js

@@ -29,7 +29,7 @@
 //				drilldown: d.protoType,
     		});
     		
-    		pktNum[0]="pktNum";
+    		/*pktNum[0]="pktNum";
     		pktNum[1]=parseInt(d.pktNum);
     		byteLen[0]="byteLen";
     		byteLen[1]=parseInt(d.byteLen);
@@ -40,7 +40,7 @@
     			type:'pie',
 				innerSize: '70%',
 				data: [pktNum,byteLen],
-    		});
+    		});*/
     		
 	   });
     	var chart = Highcharts.chart('chart_1', {
@@ -144,7 +144,7 @@
     										mouseOver: function(e) {  // 鼠标滑过时动态更新标题
     												// 标题更新函数，API 地址：https://api.hcharts.cn/highcharts#Chart.setTitle
     												chart.setTitle({
-    														text:e.target.name.length>10? this.percentage.toFixed(2)+"%<br><span>"+e.target.name.substring(0,10)+"...</span>":this.percentage.toFixed(2)+"%<br><span>"+e.target.name.substring(0,10)+"</span>",
+    														text:e.target.name.length>10? this.percentage.toFixed(2)+"%<br><span>"+(e.target.name+"").substring(0,10)+"...</span>":this.percentage.toFixed(2)+"%<br><span>"+e.target.name+"</span>",
     														floating:true,
     														y:120,
     														style: {//设置字体颜色
@@ -416,8 +416,8 @@
         	var inoctetsNum=d.count;
         	unit=changeUnit(inoctetsNum);
         	inoctetsNum=changeNum(inoctetsNum);
-    		var pktNum=new Array();
-    		var byteLen=new Array();
+//    		var pktNum=new Array();
+//    		var byteLen=new Array();
     		xData.push(d.appType);
     		data.push({
 				name: d.appType,
@@ -1157,7 +1157,7 @@ function echart_topic_domain(rs){
 		});
 		/****主题中的子域名*******/
 		$(d.domainData).each(function(j,t){
-			var domainNum=t.count;
+			var domainNum=t.byteCount;
 	    	unit=changeUnit(domainNum);
 	    	domainNum=changeNum(domainNum);
 			data.push({