gfwleak/k18-ntcs-web-ntc
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

流量统计-解决traffic详情时折线图最后时间点数据为0问题。解决用户行为统计中用户名跟ip可能为空无用户名登录时报错问题。app,协议，traffic详情时间查询条件格式化,默认时间显示为最近一小时，列表数据保留两位小数。

Browse Source
This commit is contained in:
zhanghongqing
2018-12-13 20:37:13 +08:00
parent d623414376
commit 4c18346d87
7 changed files with 218 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
src/main/java/com/nis/web/controller/dashboard/TrafficStatisticsInfoController.java
View File

@@ -115,9 +115,9 @@ public class TrafficStatisticsInfoController extends BaseController {
public String bandwidthList(Model model){ public String bandwidthList(Model model){
Calendar cal = Calendar. getInstance (); Calendar cal = Calendar. getInstance ();
cal.setTime(new Date()); cal.setTime(new Date());
String now = new SimpleDateFormat( "yyyy-MM-dd HH:mm:ss" ).format(cal.getTime());//获取到完整的时间 String now = new SimpleDateFormat( "yyyy-MM-dd HH:mm:00" ).format(cal.getTime());//获取到完整的时间
cal.set(Calendar.HOUR_OF_DAY, cal.get(Calendar.HOUR_OF_DAY) - 1); cal.set(Calendar.HOUR_OF_DAY, cal.get(Calendar.HOUR_OF_DAY) - 1);
String oneHoursAgo = new SimpleDateFormat( "yyyy-MM-dd HH:mm:ss" ).format(cal.getTime()); String oneHoursAgo = new SimpleDateFormat( "yyyy-MM-dd HH:mm:00" ).format(cal.getTime());
model.addAttribute("beginDate", oneHoursAgo); model.addAttribute("beginDate", oneHoursAgo);
model.addAttribute("endDate", now); model.addAttribute("endDate", now);
return "/dashboard/trafficBandwidthList"; return "/dashboard/trafficBandwidthList";
@@ -126,7 +126,14 @@ public class TrafficStatisticsInfoController extends BaseController {
* 流量统计滚动动作查看详情页面 * 流量统计滚动动作查看详情页面
*/ */
@RequestMapping(value={"trafficBlockList","trafficMonitorList"}) @RequestMapping(value={"trafficBlockList","trafficMonitorList"})
public String serviceBlockList(@RequestParam("searchAction")String searchAction,HttpServletRequest request, HttpServletResponse response, Model model){ public String serviceBlockList(@RequestParam("searchAction")String searchAction,Model model){
Calendar cal = Calendar. getInstance ();
cal.setTime(new Date());
String now = new SimpleDateFormat( "yyyy-MM-dd HH:mm:00" ).format(cal.getTime());//获取到完整的时间
cal.set(Calendar.HOUR_OF_DAY, cal.get(Calendar.HOUR_OF_DAY) - 1);
String oneHoursAgo = new SimpleDateFormat( "yyyy-MM-dd HH:mm:00" ).format(cal.getTime());
model.addAttribute("beginDate", oneHoursAgo);
model.addAttribute("endDate", now);
model.addAttribute("searchAction", searchAction); model.addAttribute("searchAction", searchAction);
return "/dashboard/trafficActionTransList"; return "/dashboard/trafficActionTransList";
} }
@@ -135,12 +142,13 @@ public class TrafficStatisticsInfoController extends BaseController {
*/ */
@RequestMapping(value="actionEntranceTrans") @RequestMapping(value="actionEntranceTrans")
@ResponseBody @ResponseBody
public List actionTrans(@RequestParam("searchAction")String searchAction){ public List actionTrans(String beginDate,String endDate,@RequestParam("searchAction")String searchAction){
Map<String, Object> fromJsonList = new HashMap<String, Object>(); Map<String, Object> fromJsonList = new HashMap<String, Object>();
List resultList = new ArrayList(); List resultList = new ArrayList();
String url = Constants.DASHBOARD_URL+Constants.NTC_ACTION_ENTRANCE_REPORT; String url = Constants.DASHBOARD_URL+Constants.NTC_ACTION_ENTRANCE_REPORT;
url=url+"?searchAction="+searchAction; url=url+"?searchAction="+searchAction;
try { try {
url = urlAddDate(url,beginDate,endDate);
String string = HttpClientUtil.get(url); String string = HttpClientUtil.get(url);
Gson gson = new GsonBuilder().create(); Gson gson = new GsonBuilder().create();
fromJsonList = gson.fromJson(string, new TypeToken<Map>(){}.getType()); fromJsonList = gson.fromJson(string, new TypeToken<Map>(){}.getType());
@@ -153,13 +161,23 @@ public class TrafficStatisticsInfoController extends BaseController {
} }
return resultList; return resultList;
} }
/**
*
*
* url路径时间参数格式化
* @param url
* @param beginDate
* @param endDate
* @return
* @throws URISyntaxException
*/
public String urlAddDate(String url,String beginDate,String endDate) throws URISyntaxException{ public String urlAddDate(String url,String beginDate,String endDate) throws URISyntaxException{
if(StringUtil.isBlank(beginDate)||StringUtil.isBlank(endDate)){ if(StringUtil.isBlank(beginDate)||StringUtil.isBlank(endDate)){
Calendar cal = Calendar. getInstance (); Calendar cal = Calendar. getInstance ();
cal.setTime(new Date()); cal.setTime(new Date());
endDate = new SimpleDateFormat( "yyyy-MM-dd HH:mm:ss" ).format(cal.getTime());//获取到完整的时间 endDate = new SimpleDateFormat( "yyyy-MM-dd HH:mm:00" ).format(cal.getTime());//获取到完整的时间
cal.set(Calendar.HOUR_OF_DAY, cal.get(Calendar.HOUR_OF_DAY) - 1); cal.set(Calendar.HOUR_OF_DAY, cal.get(Calendar.HOUR_OF_DAY) - 1);
beginDate = new SimpleDateFormat( "yyyy-MM-dd HH:mm:ss" ).format(cal.getTime()); beginDate = new SimpleDateFormat( "yyyy-MM-dd HH:mm:00" ).format(cal.getTime());
} }
URIBuilder uriBuilder = new URIBuilder(url); URIBuilder uriBuilder = new URIBuilder(url);
uriBuilder.addParameter("beginDate",beginDate); uriBuilder.addParameter("beginDate",beginDate);
@@ -239,11 +257,11 @@ public class TrafficStatisticsInfoController extends BaseController {
public String protocolTypeList(Model model){ public String protocolTypeList(Model model){
Calendar cal = Calendar. getInstance (); Calendar cal = Calendar. getInstance ();
cal.setTime(new Date()); cal.setTime(new Date());
String now = new SimpleDateFormat( "yyyy-MM-dd HH:mm:ss" ).format(cal.getTime());//获取到完整的时间 String now = new SimpleDateFormat( "yyyy-MM-dd HH:mm:00" ).format(cal.getTime());//获取到完整的时间
cal.set(Calendar.HOUR_OF_DAY, cal.get(Calendar.HOUR_OF_DAY) - 1); cal.set(Calendar.HOUR_OF_DAY, cal.get(Calendar.HOUR_OF_DAY) - 1);
String oneHoursAgo = new SimpleDateFormat( "yyyy-MM-dd HH:mm:ss" ).format(cal.getTime()); String oneHoursAgo = new SimpleDateFormat( "yyyy-MM-dd HH:mm:00" ).format(cal.getTime());
model.addAttribute("searchFoundStartTime", oneHoursAgo); model.addAttribute("beginDate", oneHoursAgo);
model.addAttribute("searchFoundEndTime", now); model.addAttribute("endDate", now);
return "/dashboard/trafficProtocolTypeList"; return "/dashboard/trafficProtocolTypeList";
} }
/** /**
@@ -251,16 +269,12 @@ public class TrafficStatisticsInfoController extends BaseController {
*/ */
@RequestMapping(value="protocolList") @RequestMapping(value="protocolList")
@ResponseBody @ResponseBody
public List protocolList(Model model,@RequestParam(required=false)String searchFoundStartTime,@RequestParam(required=false)String searchFoundEndTime){ public List protocolList(Model model,@RequestParam(required=false)String beginDate,@RequestParam(required=false)String endDate){
Map<String, Object> fromJsonList = new HashMap<String, Object>(); Map<String, Object> fromJsonList = new HashMap<String, Object>();
List list = new ArrayList(); List list = new ArrayList();
String url = Constants.DASHBOARD_URL+Constants.TRAFFIC_PROTOCOL_LIST; String url = Constants.DASHBOARD_URL+Constants.TRAFFIC_PROTOCOL_LIST;
try { try {
if(!StringUtil.isBlank(searchFoundStartTime)&&!StringUtil.isBlank(searchFoundEndTime)){ url=urlAddDate(url,beginDate,endDate);
searchFoundStartTime=URLEncoder.encode(searchFoundStartTime, "UTF-8");
searchFoundEndTime=URLEncoder.encode(searchFoundEndTime, "UTF-8");
url+="?searchFoundStartTime="+searchFoundStartTime+"&searchFoundEndTime="+searchFoundEndTime;
}
String string = HttpClientUtil.get(url); String string = HttpClientUtil.get(url);
Gson gson = new GsonBuilder().create(); Gson gson = new GsonBuilder().create();
fromJsonList = gson.fromJson(string, new TypeToken<Map>(){}.getType()); fromJsonList = gson.fromJson(string, new TypeToken<Map>(){}.getType());
@@ -311,7 +325,14 @@ public class TrafficStatisticsInfoController extends BaseController {
* App类型详细列表 * App类型详细列表
*/ */
@RequestMapping(value="appTypeList") @RequestMapping(value="appTypeList")
public String appTypeList(){ public String appTypeList(Model model){
Calendar cal = Calendar. getInstance ();
cal.setTime(new Date());
String now = new SimpleDateFormat( "yyyy-MM-dd HH:mm:00" ).format(cal.getTime());//获取到完整的时间
cal.set(Calendar.HOUR_OF_DAY, cal.get(Calendar.HOUR_OF_DAY) - 1);
String oneHoursAgo = new SimpleDateFormat( "yyyy-MM-dd HH:mm:00" ).format(cal.getTime());
model.addAttribute("beginDate", oneHoursAgo);
model.addAttribute("endDate", now);
return "/dashboard/trafficAppTypeList"; return "/dashboard/trafficAppTypeList";
} }
/** /**
@@ -319,16 +340,12 @@ public class TrafficStatisticsInfoController extends BaseController {
*/ */
@RequestMapping(value="appList") @RequestMapping(value="appList")
@ResponseBody @ResponseBody
public List appList(@RequestParam(value="searchFoundStartTime",required=false)String searchFoundStartTime,@RequestParam(value="searchFoundEndTime",required=false)String searchFoundEndTime){ public List appList(@RequestParam(value="beginDate",required=false)String beginDate,@RequestParam(value="endDate",required=false)String endDate){
Map<String, Object> fromJsonList = new HashMap<String, Object>(); Map<String, Object> fromJsonList = new HashMap<String, Object>();
List list = new ArrayList(); List list = new ArrayList();
String url = Constants.DASHBOARD_URL+Constants.TRAFFIC_APP_LIST; String url = Constants.DASHBOARD_URL+Constants.TRAFFIC_APP_LIST;
try { try {
if(!StringUtil.isBlank(searchFoundStartTime)&&!StringUtil.isBlank(searchFoundEndTime)){ url=urlAddDate(url,beginDate,endDate);
searchFoundStartTime=URLEncoder.encode(searchFoundStartTime, "UTF-8");
searchFoundEndTime=URLEncoder.encode(searchFoundEndTime, "UTF-8");
url+="?searchFoundStartTime="+searchFoundStartTime+"&searchFoundEndTime="+searchFoundEndTime;
}
String string = HttpClientUtil.get(url); String string = HttpClientUtil.get(url);
Gson gson = new GsonBuilder().create(); Gson gson = new GsonBuilder().create();
fromJsonList = gson.fromJson(string, new TypeToken<Map>(){}.getType()); fromJsonList = gson.fromJson(string, new TypeToken<Map>(){}.getType());

32
src/main/java/com/nis/web/controller/dashboard/TrafficStatisticsReportController.java
View File

@@ -94,23 +94,29 @@ public class TrafficStatisticsReportController extends BaseController {
model.addAttribute("accountList", accountList); model.addAttribute("accountList", accountList);
if(StringUtil.isBlank(account)&&accountList!=null&&accountList.size()>0&&!"3".equals(searchBusinessType)) { if(StringUtil.isBlank(account)&&accountList!=null&&accountList.size()>0&&!"3".equals(searchBusinessType)) {
Map accountMap = (Map) accountList.get(0); Map accountMap = (Map) accountList.get(0);
String firstAccount=(String) accountMap.get("account"); String firstAccount="";
String userString = HttpClientUtil.get(userUrl+"&searchAccount="+firstAccount); if(accountMap!=null&&accountMap.get("account")!=null){
// 指定用户 查询 firstAccount=(String) accountMap.get("account");
Gson usergson = new GsonBuilder().create(); String userString = HttpClientUtil.get(userUrl+"&searchAccount="+firstAccount);
userJsonList = usergson.fromJson(userString, new TypeToken<Map>(){}.getType()); // 指定用户 查询
userList = (ArrayList) userJsonList.get("data"); Gson usergson = new GsonBuilder().create();
userJsonList = usergson.fromJson(userString, new TypeToken<Map>(){}.getType());
userList = (ArrayList) userJsonList.get("data");
}
model.addAttribute("userList", userList); model.addAttribute("userList", userList);
model.addAttribute("searchAccount", firstAccount); model.addAttribute("searchAccount", firstAccount);
} }
if(StringUtil.isBlank(nasIp)&&nasIpList!=null&&nasIpList.size()>0&&!"2".equals(searchBusinessType)) { if(StringUtil.isBlank(nasIp)&&nasIpList!=null&&nasIpList.size()>0&&!"2".equals(searchBusinessType)) {
Map IpMap = (Map) nasIpList.get(0); Map ipMap = (Map) nasIpList.get(0);
String firstIp=(String) IpMap.get("nasIp"); String firstIp="";
String ipString = HttpClientUtil.get(ipUrl+"&searchNasIp="+firstIp); if(ipMap!=null&&ipMap.get("nasIp")!=null){
// 指定IP查询 firstIp=(String) ipMap.get("nasIp");
Gson ipgson = new GsonBuilder().create(); String ipString = HttpClientUtil.get(ipUrl+"&searchNasIp="+firstIp);
ipJsonList = ipgson.fromJson(ipString, new TypeToken<Map>(){}.getType()); // 指定IP查询
ipList = (ArrayList) ipJsonList.get("data"); Gson ipgson = new GsonBuilder().create();
ipJsonList = ipgson.fromJson(ipString, new TypeToken<Map>(){}.getType());
ipList = (ArrayList) ipJsonList.get("data");
}
model.addAttribute("ipList", ipList); model.addAttribute("ipList", ipList);
model.addAttribute("searchNasIp", firstIp); model.addAttribute("searchNasIp", firstIp);

82
src/main/webapp/WEB-INF/views/dashboard/trafficActionTransList.jsp
View File

@@ -17,10 +17,42 @@
<h3 class="page-title"> <h3 class="page-title">
<spring:message code="${searchAction}"></spring:message> <spring:message code="${searchAction}"></spring:message>
</h3> </h3>
<div class="row" >
<form:form id="searchForm" method="get" class="form-search">
<!-- 搜索内容与操作按钮栏 -->
<div class="col-md-12">
<div class="pull-left">
<div class="input-group">
<div class="input-group-btn">
<span class="selectpicker form-control" ><spring:message code="begin_date"/></span>
</div>
<input id="beginDate" name="beginDate" type="text" readonly="readonly" class="form-control Wdate input-medium"
value="" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:00',isShowClear:true,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="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:00',isShowClear:true,maxDate:'${endDate}'});"/>
</div>
</div>
<div class="pull-left">
<button type="button" class="btn blue" onClick="return searchList()"> <i class="fa fa-search"></i> <spring:message code="search"/> </button>
<button type="button" class="btn btn-default" id="resetBtn" > <i class="fa fa-refresh"></i> <spring:message code="reset"/> </button>
</div>
</div>
<!-- 搜索内容与操作按钮栏 -->
</form:form>
</div>
<div id="chart" style="width:97%;height:550px;"></div> <div id="chart" style="width:97%;height:550px;"></div>
<input id="searchAction" name="searchAction" type="hidden" value="${searchAction}"/> <input id="searchAction" name="searchAction" type="hidden" value="${searchAction}"/>
<input id="beginDateh" type="hidden" value="${beginDate}"/>
<input id="endDateh" type="hidden" value="${endDate}"/>
</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>
@@ -30,8 +62,36 @@
<%-- <script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/themes/grid.js"></script> --%> <%-- <script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/themes/grid.js"></script> --%>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function(){ $(document).ready(function(){
actionTransAjax($("#searchAction").val()); var starth=$("#beginDateh").val();
var endh=$("#endDateh").val();
$("#beginDate").val(starth);
$("#endDate").val(endh);
actionTransAjax($("#searchAction").val(),starth,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();
});
setInterval(function(){
actionTransAjax($("#searchAction").val(),starth,new Date().Format("yyyy-MM-dd HH:mm:00"));
},500000);// 五分钟调用一次
}); });
function searchList(){
loading();
var start=$("#beginDate").val();
var end=$("#endDate").val();
if(start==''||end==''||end==null||start==null){
window.location.reload();
}else{
actionTransAjax($("#searchAction").val(),start,end);
}
}
// 局点信息 // 局点信息
function showActionTransChart(rs){ function showActionTransChart(rs){
var data=new Array(); var data=new Array();
@@ -52,9 +112,10 @@ function showActionTransChart(rs){
}); });
}) })
var chart = Highcharts.chart('chart', { var chart = Highcharts.chart('chart', {
/* chart:{ chart:{
type: 'area', // type: 'area',
}, */ zoomType: 'x'
},
exporting: { exporting: {
filename:'Action-Trans', filename:'Action-Trans',
scale:1, scale:1,
@@ -71,6 +132,9 @@ function showActionTransChart(rs){
text: 'time', text: 'time',
align:'high', align:'high',
}, },
labels: {
rotation: -45, //倾斜的角度
},
}, },
yAxis: { yAxis: {
title: { title: {
@@ -100,10 +164,10 @@ function showActionTransChart(rs){
}); });
} }
// 动作一小时，间隔五分钟统计数据 // 动作一小时，间隔五分钟统计数据
function actionTransAjax(searchAction){ function actionTransAjax(searchAction,beginDate,endDate){
loading(); loading();
$.ajax({ $.ajax({
url: "${ctx}/dashboard/traffic/actionEntranceTrans?searchAction="+searchAction, url: "${ctx}/dashboard/traffic/actionEntranceTrans?searchAction="+searchAction+"&beginDate="+beginDate+"&endDate="+endDate,
type : "get" , type : "get" ,
dataType:"json", dataType:"json",
cache:false, cache:false,
@@ -115,7 +179,9 @@ function showActionTransChart(rs){
error: function(data, textStatus, errorThrown){ error: function(data, textStatus, errorThrown){
closeTip(); closeTip();
}, },
complete:function(XMLHttpRequest,status){//超时设置
closeTip();
}
}); });
} }

39
src/main/webapp/WEB-INF/views/dashboard/trafficAppTypeList.jsp
View File

@@ -33,6 +33,8 @@
<div class="row" > <div class="row" >
<form:form id="searchForm" action="${ctx}/dashboard/traffic/appTypeList" method="get" class="form-search"> <form:form id="searchForm" action="${ctx}/dashboard/traffic/appTypeList" method="get" class="form-search">
<input id="beginDateh" type="hidden" value="${beginDate}"/>
<input id="endDateh" type="hidden" value="${endDate}"/>
<!-- 搜索内容与操作按钮栏 --> <!-- 搜索内容与操作按钮栏 -->
<div class="col-md-12"> <div class="col-md-12">
<div class="pull-left"> <div class="pull-left">
@@ -40,8 +42,8 @@
<div class="input-group-btn"> <div class="input-group-btn">
<span class="selectpicker form-control" ><spring:message code="begin_date"/></span> <span class="selectpicker form-control" ><spring:message code="begin_date"/></span>
</div> </div>
<input id="searchFoundStartTime" name="searchFoundStartTime" type="text" readonly="readonly" class="form-control Wdate input-medium" <input id="beginDate" name="beginDate" type="text" readonly="readonly" class="form-control Wdate input-medium"
value="${searchFoundStartTime}" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true});"/> value="${beginDate}" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true,maxDate:'${endDate}'});"/>
</div> </div>
</div> </div>
<div class="pull-left"> <div class="pull-left">
@@ -49,8 +51,8 @@
<div class="input-group-btn"> <div class="input-group-btn">
<span class="selectpicker form-control" ><spring:message code="end_date"/></span> <span class="selectpicker form-control" ><spring:message code="end_date"/></span>
</div> </div>
<input id="searchFoundEndTime" name="searchFoundEndTime" type="text" readonly="readonly" class="form-control Wdate input-medium" <input id="endDate" name="endDate" type="text" readonly="readonly" class="form-control Wdate input-medium"
value="${searchFoundStartTime}" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true});"/> value="${endDate}" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true,maxDate:'${endDate}'});"/>
</div> </div>
</div> </div>
@@ -95,7 +97,11 @@
<script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/offline-exporting.js"></script> <script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/offline-exporting.js"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function(){ $(document).ready(function(){
ajaxProtocolList(); var starth=$("#beginDateh").val();
var endh=$("#endDateh").val();
$("#beginDate").val(starth);
$("#endDate").val(endh);
ajaxAppList(starth,endh);
//筛选功能初始化 //筛选功能初始化
$("#resetBtn").on("click",function(){ $("#resetBtn").on("click",function(){
$("select.selectpicker").each(function(){ $("select.selectpicker").each(function(){
@@ -106,26 +112,27 @@ $(document).ready(function(){
$(".Wdate").attr("value",''); $(".Wdate").attr("value",'');
$("#searchForm")[0].reset(); $("#searchForm")[0].reset();
}); });
setInterval(function(){
ajaxAppList(starth,new Date().Format("yyyy-MM-dd HH:mm:00"));
},500000);// 五分钟调用一次
}); });
function searchList(){ function searchList(){
loading(); loading();
var start=$("#searchFoundStartTime").val(); var start=$("#beginDate").val();
var end=$("#searchFoundEndTime").val(); var end=$("#endDate").val();
if(start==''||end==''||end==null||start==null){ if(start==''||end==''||end==null||start==null){
start=""; window.location.reload();
end=""; }else{
$("#searchFoundStartTime").val(""); ajaxAppList(start,end);
$("#searchFoundEndTime").val("");
} }
ajaxProtocolList(start,end);
} }
function ajaxProtocolList(start,end){ function ajaxAppList(start,end){
loading(); loading();
$.ajax({ $.ajax({
url: '${ctx}/dashboard/traffic/appList', url: '${ctx}/dashboard/traffic/appList',
type: 'get', type: 'get',
dataType: "json", dataType: "json",
data:{"searchFoundStartTime":start,"searchFoundEndTime":end}, data:{"beginDate":start,"endDate":end},
async:false, async:false,
timeout:10000, timeout:10000,
success:function (data){ success:function (data){
@@ -224,9 +231,9 @@ function htmlData(fileDataS){
html+= "<td class='tc'>"+data.appName+"</td>"; html+= "<td class='tc'>"+data.appName+"</td>";
html+= "<td class='tc'>"+data.linkNum+"</td>"; html+= "<td class='tc'>"+data.linkNum+"</td>";
html+= "<td class='tc'>"+linkper+"%"+"</td>"; html+= "<td class='tc'>"+linkper+"%"+"</td>";
html+= "<td class='tc'>"+data.packets+"</td>"; html+= "<td class='tc'>"+Math.round(data.packets*100)/100+"</td>";
html+= "<td class='tc'>"+packper+"%"+"</td>"; html+= "<td class='tc'>"+packper+"%"+"</td>";
html+= "<td class='tc'>"+data.GByte+"</td>"; html+= "<td class='tc'>"+Math.round(data.GByte*100)/100+"</td>";
html+= "<td class='tc'>"+gbytper+"%"+"</td>"; html+= "<td class='tc'>"+gbytper+"%"+"</td>";
html+="</tr>" html+="</tr>"
} }

27
src/main/webapp/WEB-INF/views/dashboard/trafficBandwidthList.jsp
View File

@@ -21,7 +21,9 @@
</h3> </h3>
<h5 class="page-header"></h5> <h5 class="page-header"></h5>
<div class="row" > <div class="row" >
<form:form id="searchForm" action="${ctx}/dashboard/traffic/protocolTypeList" method="get" class="form-search"> <form:form id="searchForm" action="${ctx}/dashboard/traffic/bandwidthList" method="get" class="form-search">
<input id="beginDateh" type="hidden" value="${beginDate}"/>
<input id="endDateh" type="hidden" value="${endDate}"/>
<!-- 搜索内容与操作按钮栏 --> <!-- 搜索内容与操作按钮栏 -->
<div class="col-md-12"> <div class="col-md-12">
<div class="pull-left"> <div class="pull-left">
@@ -30,7 +32,7 @@
<span class="selectpicker form-control" ><spring:message code="begin_date"/></span> <span class="selectpicker form-control" ><spring:message code="begin_date"/></span>
</div> </div>
<input id="beginDate" name="beginDate" type="text" readonly="readonly" class="form-control Wdate input-medium" <input id="beginDate" name="beginDate" type="text" readonly="readonly" class="form-control Wdate input-medium"
value="" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true});"/> value="" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true,maxDate:'${endDate}'});"/>
</div> </div>
</div> </div>
<div class="pull-left"> <div class="pull-left">
@@ -39,7 +41,7 @@
<span class="selectpicker form-control" ><spring:message code="end_date"/></span> <span class="selectpicker form-control" ><spring:message code="end_date"/></span>
</div> </div>
<input id="endDate" name="endDate" type="text" readonly="readonly" class="form-control Wdate input-medium" <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});"/> value="" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true,maxDate:'${endDate}'});"/>
</div> </div>
</div> </div>
@@ -83,22 +85,23 @@
<script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/offline-exporting.js"></script> <script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/offline-exporting.js"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function(){ $(document).ready(function(){
var starth=$("#beginDateh").val();
var endh=$("#endDateh").val();
$("#beginDate").val(starth);
$("#endDate").val(endh);
var unitType=$("#unitType").val(); var unitType=$("#unitType").val();
var start=$("#beginDate").val(); changeBandwidth(unitType,starth,endh);
var end=$("#endDate").val(); changeBandwidth2(unitType,starth,endh);
changeBandwidth(unitType,start,end);
changeBandwidth2(unitType,start,end);
$("#unitType").on("change",function(){ $("#unitType").on("change",function(){
changeBandwidth($("#unitType").val(),$("#beginDate").val(),$("#endDate").val()); changeBandwidth($("#unitType").val(),$("#beginDate").val(),$("#endDate").val());
changeBandwidth2($("#unitType").val(),$("#beginDate").val(),$("#endDate").val()); changeBandwidth2($("#unitType").val(),$("#beginDate").val(),$("#endDate").val());
}); });
setInterval(function(){ setInterval(function(){
changeBandwidth($("#unitType").val(),$("#beginDate").val(),$("#endDate").val()); changeBandwidth($("#unitType").val(),$("#beginDate").val(),new Date().Format("yyyy-MM-dd HH:mm:00"));
changeBandwidth2($("#unitType").val(),$("#beginDate").val(),$("#endDate").val()); changeBandwidth2($("#unitType").val(),$("#beginDate").val(),new Date().Format("yyyy-MM-dd HH:mm:00"));
},500000);// 五分钟调用一次 },500000);// 五分钟调用一次
//筛选功能初始化 //筛选功能初始化
$("#resetBtn").on("click",function(){ $("#resetBtn").on("click",function(){
$("select.selectpicker").each(function(){ $("select.selectpicker").each(function(){
@@ -115,8 +118,12 @@ function searchList(){
loading(); loading();
var start=$("#beginDate").val(); var start=$("#beginDate").val();
var end=$("#endDate").val(); var end=$("#endDate").val();
if(start==''||end==''||end==null||start==null){
window.location.reload();
}else{
changeBandwidth($("#unitType").val(),start,end); changeBandwidth($("#unitType").val(),start,end);
changeBandwidth2($("#unitType").val(),start,end); changeBandwidth2($("#unitType").val(),start,end);
}
} }
// 默认显示四条线 ip46,tcp,udp // 默认显示四条线 ip46,tcp,udp

40
src/main/webapp/WEB-INF/views/dashboard/trafficProtocolTypeList.jsp
View File

@@ -23,6 +23,8 @@
<h5 class="page-header"></h5> <h5 class="page-header"></h5>
<div class="row" > <div class="row" >
<form:form id="searchForm" action="${ctx}/dashboard/traffic/protocolTypeList" method="get" class="form-search"> <form:form id="searchForm" action="${ctx}/dashboard/traffic/protocolTypeList" method="get" class="form-search">
<input id="beginDateh" type="hidden" value="${beginDate}"/>
<input id="endDateh" type="hidden" value="${endDate}"/>
<!-- 搜索内容与操作按钮栏 --> <!-- 搜索内容与操作按钮栏 -->
<div class="col-md-12"> <div class="col-md-12">
<div class="pull-left"> <div class="pull-left">
@@ -30,17 +32,17 @@
<div class="input-group-btn"> <div class="input-group-btn">
<span class="selectpicker form-control" ><spring:message code="begin_date"/></span> <span class="selectpicker form-control" ><spring:message code="begin_date"/></span>
</div> </div>
<input id="searchFoundStartTime" name="searchFoundStartTime" type="text" readonly="readonly" class="form-control Wdate input-medium" <input id="beginDate" name="beginDate" type="text" readonly="readonly" class="form-control Wdate input-medium"
value="${searchFoundStartTime}" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true});"/> value="" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true,maxDate:'${endDate}'});"/>
</div> </div>
</div> </div>
<div class="pull-left"> <div class="pull-left">
<div class="input-group"> <div class="input-group">
<div class="input-group-btn"> <div class="input-group-btn">
<span class="selectpicker form-control" ><spring:message code="end_date"/></span> <span class="selectpicker form-control" ><spring:message code="end_date"/></span>
</div> </div>
<input id="searchFoundEndTime" name="searchFoundEndTime" type="text" readonly="readonly" class="form-control Wdate input-medium" <input id="endDate" name="endDate" type="text" readonly="readonly" class="form-control Wdate input-medium"
value="${searchFoundEndTime}" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true});"/> value="" onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:true,maxDate:'${endDate}'});"/>
</div> </div>
</div> </div>
@@ -85,7 +87,11 @@
<script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/offline-exporting.js"></script> <script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/offline-exporting.js"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function(){ $(document).ready(function(){
ajaxProtocolList(); var starth=$("#beginDateh").val();
var endh=$("#endDateh").val();
$("#beginDate").val(starth);
$("#endDate").val(endh);
ajaxProtocolList(starth,endh);
//筛选功能初始化 //筛选功能初始化
$("#resetBtn").on("click",function(){ $("#resetBtn").on("click",function(){
$("select.selectpicker").each(function(){ $("select.selectpicker").each(function(){
@@ -96,18 +102,20 @@ $(document).ready(function(){
$(".Wdate").attr("value",''); $(".Wdate").attr("value",'');
$("#searchForm")[0].reset(); $("#searchForm")[0].reset();
}); });
setInterval(function(){
ajaxProtocolList(starth,new Date().Format("yyyy-MM-dd HH:mm:00"));
},500000);// 五分钟调用一次
}); });
function searchList(){ function searchList(){
loading(); loading();
var start=$("#searchFoundStartTime").val(); var start=$("#beginDate").val();
var end=$("#searchFoundEndTime").val(); var end=$("#endDate").val();
if(start==''||end==''||end==null||start==null){ if(start==''||end==''||end==null||start==null){
start=""; window.location.reload();
end=""; }else{
$("#searchFoundStartTime").val(""); ajaxProtocolList(start,end);
$("#searchFoundEndTime").val("");
} }
ajaxProtocolList(start,end);
} }
function ajaxProtocolList(start,end){ function ajaxProtocolList(start,end){
loading(); loading();
@@ -115,7 +123,7 @@ function ajaxProtocolList(start,end){
url: '${ctx}/dashboard/traffic/protocolList', url: '${ctx}/dashboard/traffic/protocolList',
type: 'get', type: 'get',
dataType: "json", dataType: "json",
data:{"searchFoundStartTime":start,"searchFoundEndTime":end}, data:{"beginDate":start,"endDate":end},
async:false, async:false,
timeout:10000, timeout:10000,
success:function (data){ success:function (data){
@@ -213,9 +221,9 @@ function htmlData(fileDataS){
html+= "<td class='tc'>"+data.protocolType+"</td>"; html+= "<td class='tc'>"+data.protocolType+"</td>";
html+= "<td class='tc'>"+data.linkNum+"</td>"; html+= "<td class='tc'>"+data.linkNum+"</td>";
html+= "<td class='tc'>"+linkper+"%"+"</td>"; html+= "<td class='tc'>"+linkper+"%"+"</td>";
html+= "<td class='tc'>"+data.packets+"</td>"; html+= "<td class='tc'>"+Math.round(data.packets*100)/100+"</td>";
html+= "<td class='tc'>"+packper+"%"+"</td>"; html+= "<td class='tc'>"+packper+"%"+"</td>";
html+= "<td class='tc'>"+data.GByte+"</td>"; html+= "<td class='tc'>"+Math.round(data.GByte*100)/100+"</td>";
html+= "<td class='tc'>"+gbytper+"%"+"</td>"; html+= "<td class='tc'>"+gbytper+"%"+"</td>";
html+="</tr>" html+="</tr>"
} }

21
src/main/webapp/static/pages/scripts/pageLogs.js
View File

@@ -89,4 +89,25 @@ function back(){
var url = sessionStorage.getItem('cfgUrl'); var url = sessionStorage.getItem('cfgUrl');
switchMenu("86"); switchMenu("86");
window.location.href = url; window.location.href = url;
}
//对Date的扩展，将 Date 转化为指定格式的String
//月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符，
//年(y)可以用 1-4 个占位符，毫秒(S)只能用 1 个占位符(是 1-3 位的数字)
//例子：
//(new Date()).Format("yyyy-MM-dd hh:mm:ss.S") ==> 2006-07-02 08:09:04.423
//(new Date()).Format("yyyy-M-d h:m:s.S") ==> 2006-7-2 8:9:4.18
Date.prototype.Format = function (fmt) {
var o = {
"M+": this.getMonth() + 1, //月份
"d+": this.getDate(), //日
"H+": this.getHours(), //小时
"m+": this.getMinutes(), //分
"s+": this.getSeconds(), //秒
"q+": Math.floor((this.getMonth() + 3) / 3), //季度
"S": this.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
for (var k in o)
if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
return fmt;
} }