<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <%@ include file="/WEB-INF/views/include/taglib.jsp"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <style type="text/css"> </style> <meta name="decorator" content="default" /> <link href="${ctxStatic }/modules/exhi/css/exhitab.css?v=${version}" rel="stylesheet" type="text/css"> <script type="text/javascript" src="${ctxStatic }/layer/layer.js"></script> <script type="text/javascript" src="${ctxStatic }/jquery/jquery-1.8.3.min.js"></script> <script type="text/javascript" src="${ctxStatic }/highcharts/highcharts.js"></script> <script type="text/javascript" src="${ctxStatic }/highcharts/exporting.js"></script> <script type="text/javascript"> $(function () { load(); }); function selectData(){ var startTime = $("#startTime").val(); var endTime = $("#endTime").val(); var data={"startTime":startTime,"endTime":endTime}; load(data); } var load = function(data){ $.post("${ctx}/loadData",data,function(result){ var seriesData = eval(result.series); var categoriesData = eval(result.categories); $('#container').highcharts({ chart: { type: 'column' }, title: { text: '广州万秀网后台数据统计' }, subtitle: { //text: 'Source: WorldClimate.com' }, xAxis: { categories: categoriesData }, yAxis: { min: 0, title: { text: '数量 (个)' } }, tooltip: { shared: true, formatter: function() { var dataVal=""; for(var i = 0;i<this.points.length;i++){ var series=this.points[i].series.name.replace(/\d+/g,''); var s=series.replace('<br/>','') dataVal += s+":" +this.points[i].y+ "<br>"; } return dataVal; } }, credits: {//去掉默认的highcharts.com enabled: false }, plotOptions: { column: { pointPadding: 0.2, borderWidth: 0, } }, series: seriesData }); },"json"); } </script> <body> <table width="87%"> <tr> <td align="right"><label></label> <input type="text" value="<fmt:formatDate value="${startTime }"/>" id="startTime" class="input-mini Wdate" onclick="WdatePicker({dateFmt:'yyyy-MM',isShowClear:false,maxDate:'#F{$dp.$D(\'endTime\')||\'%y-%M\'}' });" readonly="true" style="margin-bottom: 0px"> -- <input type="text" id="endTime" value="<fmt:formatDate value="${endTime }"/>" class="input-mini Wdate" onclick="WdatePicker({dateFmt:'yyyy-MM',isShowClear:false,minDate: '#F{$dp.$D(\'startTime\')}',maxDate:'%y-%M' });" readonly="true" style="margin-bottom: 0px"></td> <td ><input id="btnSubmit" class="btn btn-primary" type="submit" value="查询" onclick="return selectData();"/> </li></td> </tr> </table> <div id="container" style="min-width:700px;height:400px;width:75%;"></div> </body> </html>
//后台java 代码
/** * 异步加载后台首页 * @param model * @return */ @ResponseBody @RequestMapping("/loadData") public Map<Object, Object> loadData(HttpSession session, HttpServletResponse response, Model model, HttpServletRequest request,String startTime,String endTime) { AdminIndexData adminIndexData = new AdminIndexData(); if(("".equals(startTime) || startTime==null) || ("".equals(endTime) || endTime == null)){ adminIndexData.setStartTime(adminIndexService.getNewDate("yyyy-MM", 11));//开始时间默认为当前时间的前11个月的时间 adminIndexData.setEndTime(adminIndexService.getDate("yyyy-MM",0));//结束时间为当前时间 }else{ adminIndexData.setStartTime(startTime); adminIndexData.setEndTime(endTime); } HashMap<Object, Object> map = Maps.newHashMap(); List<Chart> listChar = new ArrayList<Chart>(); List<AdminIndexData> zhuBanFanList= RedisCacheManager.getAllZhuBanFanCount(model, "zhuBanfangcount", adminIndexService,adminIndexData);// 按年月份统计展会主办方 List<AdminIndexData> daiLiShangList = RedisCacheManager.getAllDaiLiShang(model, "daiLiShanCount", adminIndexService,adminIndexData);// 按年月份统展会代理商 List<AdminIndexData> accountList = RedisCacheManager.getAllCountAccount(model, "accountCount", adminIndexService,adminIndexData);//按年月份统计用户账号 List<AdminIndexData> exhiMainList = RedisCacheManager.getAllExhiMain(model, "exhiMainCount", adminIndexService,adminIndexData);//按年月份统计展览 List<AdminIndexData> huiYiMainList = RedisCacheManager.getAllHuiYiMain(model, "huiYiMainCount", adminIndexService,adminIndexData);//按年月份统计会议 List<AdminIndexData> orderList = RedisCacheManager.getAllOrder(model, "orderCount", adminIndexService,adminIndexData);//按年月份统计订单 listChar.add(RedisCacheManager.getStatisticalData(zhuBanFanList, "展会主办方",adminIndexData.getStartTime(),adminIndexData.getEndTime(),adminIndexService,adminIndexData));//将主办方的数据放到集合里面 listChar.add(RedisCacheManager.getStatisticalData(daiLiShangList, "展会代理商",adminIndexData.getStartTime(),adminIndexData.getEndTime(),adminIndexService,adminIndexData));//将展会代理商的数据放到集合里面 listChar.add(RedisCacheManager.getStatisticalData(accountList, "用户账号",adminIndexData.getStartTime(),adminIndexData.getEndTime(),adminIndexService,adminIndexData));//将用户账号的数据放到集合里面 listChar.add(RedisCacheManager.getStatisticalData(exhiMainList, "展览",adminIndexData.getStartTime(),adminIndexData.getEndTime(),adminIndexService,adminIndexData));//将展览总数的数据放到集合里面 listChar.add(RedisCacheManager.getStatisticalData(huiYiMainList, "会议",adminIndexData.getStartTime(),adminIndexData.getEndTime(),adminIndexService,adminIndexData));//将会议总数的数据放到集合里面 listChar.add(RedisCacheManager.getStatisticalData(orderList, "订单",adminIndexData.getStartTime(),adminIndexData.getEndTime(),adminIndexService,adminIndexData));//将订单总数的数据放到集合里面 map.put("series", listChar); map.put("categories", adminIndexService.getYearMonth(adminIndexData.getStartTime(), adminIndexData.getEndTime())); return map; }