diff --git a/src/main/java/com/nis/web/controller/dashboard/DashboardController.java b/src/main/java/com/nis/web/controller/dashboard/DashboardController.java
index 0962220b2..2ce2d1381 100644
--- a/src/main/java/com/nis/web/controller/dashboard/DashboardController.java
+++ b/src/main/java/com/nis/web/controller/dashboard/DashboardController.java
@@ -19,6 +19,7 @@ import com.google.gson.Gson;
 import com.google.gson.GsonBuilder;
 import com.google.gson.reflect.TypeToken;
 import com.nis.domain.Page;
+import com.nis.domain.PageLog;
 import com.nis.util.CodeDicUtils;
 import com.nis.util.Constants;
 import com.nis.util.StringUtil;
@@ -408,16 +409,19 @@ public class DashboardController extends BaseController{
 	
 	@RequestMapping(value="ipActiveList")
 	public String ipActiveList(  HttpServletRequest request, HttpServletResponse response, Model model){
-		Page<TrafficIpActiveStatistic> page = new Page<TrafficIpActiveStatistic>(request, response);
-		TrafficIpActiveStatistic ip = new TrafficIpActiveStatistic();
-		ip.setIpAddr("1.1.1.1");
-		ip.setAreaId("11");
-		ip.setLinkNum(1212);
+		PageLog<TrafficIpActiveStatistic> page = new PageLog<TrafficIpActiveStatistic>(request, response);
 		List list = new ArrayList();
-		list.add(ip);
+		for (int i = 1; i < 10; i++) {
+			TrafficIpActiveStatistic ip = new TrafficIpActiveStatistic();
+			ip.setId(i);
+			ip.setIpAddr(3+i+".1.1."+i);
+			ip.setAreaId("11");
+			ip.setLinkNum(1212);
+			list.add(ip);
+		}
 		page.setList(list);
         model.addAttribute("page", page);
-		return "/dashboard/trafficIpActiveList";
+		return "/dashboard/trafficConnList";
 	}
 	
 	
@@ -450,6 +454,7 @@ public class DashboardController extends BaseController{
 		return "/dashboard/trafficIpActiveChart";
 	}
 	public class TrafficIpActiveStatistic{
+		Integer id=1;
 		String ipAddr="10.1.1.2";
 		String areaId="1045";
 		Integer linkNum=3121;
@@ -459,6 +464,12 @@ public class DashboardController extends BaseController{
 		Integer s2cByteLen=23323;
 		String statTime;
 		
+		public Integer getId() {
+			return id;
+		}
+		public void setId(Integer id) {
+			this.id = id;
+		}
 		public String getStatTime() {
 			return statTime;
 		}
diff --git a/src/main/webapp/WEB-INF/views/dashboard/dashBoardIndex.jsp b/src/main/webapp/WEB-INF/views/dashboard/dashBoardIndex.jsp
index 80f5170c9..ecb78c464 100644
--- a/src/main/webapp/WEB-INF/views/dashboard/dashBoardIndex.jsp
+++ b/src/main/webapp/WEB-INF/views/dashboard/dashBoardIndex.jsp
@@ -8,6 +8,9 @@
     <title>数据概览</title>
     <link rel="stylesheet" href="${pageContext.request.contextPath}/static/global/plugins/highcharts/css/common.css">
     <link rel="stylesheet" href="${pageContext.request.contextPath}/static/global/plugins/highcharts/css/data_text.css">
+    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/pages/css/dashboard.css">
+    
+    <script src="${pageContext.request.contextPath}/static/pages/scripts/dashboard.js"></script>
 
     <!--[if lt IE 9]>
     <script src="js/html5shiv.min.js"></script>
@@ -24,80 +27,88 @@
         <div class="title-center fl"><a href="javascript:window.location.reload()"><i class="fa fa-line-chart"></i>&nbsp;网络流量分析</a></div>
         <div class="title-right fr"></div>
 </div> -->
+<div class="header">
     <div class="data_info">
-        <div class="info_1 fl">
+        <div class="info_1 fl_fc">
             <div class="text_1">
-                <div class="fr">
-                    <div class="fl">
+                <div class="fr_fc">
+                    <div class="fl_fc">
                         <a href="#">
                          <span>
-                        <p>业务总量</p>
-                        <p>15802</p>
+                        <p><i class="fa fa-ban"> </i> 阻断链接数</p>
+                        <p class="numberRun">15802</p>
                          </span>
                         </a>
                        
                     </div>
                 </div>
-                <div class="fr">
-                    <div class="fl">
+                <div class="fr_fc">
+                    <div class="fl_fc">
                         <a href="#">
                          <span>
-                        <p>异常IP</p>
-                        <p>15802</p>
-                         </span>
-                        </a>
-                    </div>
-                </div>
-                <div class="fr">
-<!--                 <i class="fa fa-bar-chart"></i> -->
-                    <div class="fl">
-                        <a href="#">
-                         <span>
-                        <p>丢包数</p>
-                        <p>15802</p>
+                        <p><i class="fa fa-external-link"></i> 新建链接数</p>
+                        <p class="numberRun1">15802</p>
                          </span>
                         </a>
                     </div>
                 </div>
+               
             </div>
 
         </div>
-        <div class="info_2 fl">
+      <div class="info_2 fl_fc">
             <div class="text_2">
-                <div class="fr">
-                    <div class="fl">
-                        <p>活跃网站流量</p>
-                        <p>15802</p>
+             <div class="fr_fc">
+<!--                 <i class="fa fa-bar-chart"></i> -->
+                    <div class="fl_fc">
+                        <a href="#">
+                         <span>
+                        <p><i class="fa fa-trash"> </i> 丢弃链接数</p>
+                        <p class="numberRun2">15802</p>
+                         </span>
+                        </a>
                     </div>
                 </div>
-                <div class="fr">
-                    <div class="fl">
-                        <p>境外IP流量</p>
-                        <p>15802</p>
+            <div class="fr_fc">
+                    <div class="fl_fc">
+                     <a href="${ctx}/dashboard/ipActiveList">
+                    	<span>
+                        <p><i class="fa fa-heartbeat"> </i> 活跃链接数</p>
+                        <p class="numberRun3">15802</p>
+                        </span>
+                 	</a>
+                    </div>
+                </div>
+                <div class="fr_fc">
+                    <div class="fl_fc">
+                    <a href="${ctx}/dashboard/ipActiveList">
+                    	<span>
+                        <p><i class="fa fa-cloud-download"></i> 网络带宽</p>
+                 			<p clas="csNum">c2s 83%<i class="fa fa-arrow-up" style="color: green"></i> | s2c 17%<i class="fa fa-arrow-down" style="color: red"></i></p>
+                        	<p class="numberRun4">15802</p>
+                    	</span>
+                 	</a>
                     </div>
                 </div>
-            </div>
 
         </div>
-        <div class="info_3 fl">
+        <%--   <div class="info_3 fl_fc">
             <div class="text_3">
-                <div class="fr">
-                    <div class="fl">
-                        <p>热门网站流量</p>
-                        <p>15802</p>
-                    </div>
-                </div>
-                <div class="fr">
-                    <div class="fl">
-                        <p>互联网流量包数</p>
-                        <p>15802</p>
+                <div class="fr_fc">
+                    <div class="fl_fc">
+                    <a href="${ctx}/dashboard/ipActiveList">
+                     <span>
+                        <p>网络带宽</p>
+                        <p class="numberRun5">15802</p>
+                    </span>
+                        </a>
                     </div>
                 </div>
             </div>
 
-        </div>
+        </div> --%>
     </div>
-
+</div>
 <!--header结束-->
 
     <div class="data_main">
@@ -175,41 +186,6 @@
                         <td>Linux</td>
                         <td>0</td>
                     </tr>
-                    <tr>
-                        <td>4</td>
-                        <td>DOS</td>
-                        <td>0</td>
-                    </tr>
-                    <tr>
-                        <td>5</td>
-                        <td>windows</td>
-                        <td>0</td>
-                    </tr>
-                    <tr>
-                        <td>6</td>
-                        <td>iOS</td>
-                        <td>0</td>
-                    </tr>
-                    <tr>
-                        <td>7</td>
-                        <td>windows</td>
-                        <td>0</td>
-                    </tr>
-                    <tr>
-                        <td>8</td>
-                        <td>windows</td>
-                        <td>0</td>
-                    </tr>
-                    <tr>
-                        <td>9</td>
-                        <td>windows</td>
-                        <td>0</td>
-                    </tr>
-                    <tr>
-                        <td>10</td>
-                        <td>windows</td>
-                        <td>0</td>
-                    </tr>
                     </tbody>
                 </table>
             </div>
@@ -254,41 +230,6 @@
                             <td>Google</td>
                             <td>0</td>
                         </tr>
-                        <tr>
-                            <td>4</td>
-                            <td>Yahoo</td>
-                            <td>0</td>
-                        </tr>
-                        <tr>
-                            <td>5</td>
-                            <td>qq</td>
-                            <td>0</td>
-                        </tr>
-                        <tr>
-                            <td>6</td>
-                            <td>Googleusercontent</td>
-                            <td>0</td>
-                        </tr>
-                        <tr>
-                            <td>7</td>
-                            <td>Microsoftonline</td>
-                            <td>0</td>
-                        </tr>
-                        <tr>
-                            <td>8</td>
-                            <td>Pornhub</td>
-                            <td>0</td>
-                        </tr>
-                        <tr>
-                            <td>9</td>
-                            <td>Youtube</td>
-                            <td>0</td>
-                        </tr>
-                        <tr>
-                            <td>10</td>
-                            <td>Facebook</td>
-                            <td>0</td>
-                        </tr>
                         </tbody>
                     </table>
                 </div>
@@ -313,27 +254,15 @@
 <script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/no-data-to-display.js"></script>
 <script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/echart.js"></script>
 <%-- <script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/themes/grid.js"></script> --%>
-<!--     <style type="text/css">
-		
-		a:link {
-			color:#fff !important;
-			text-decoration:none
-		}
-		a:visited {
-			background-color:yellow !important;
-			text-decoration:none
-		}
-		a:hover {
-			color:green !important;
-			text-decoration:none
-		}
-		a:active {
-			color:green !important;
-			text-decoration:none;
-		} 
-    </style> -->
 <script type="text/javascript">
 $(document).ready(function(){
+	//动态显示数据
+	  dataScroll(".numberRun",43113);
+	  dataScroll(".numberRun1",13414);
+	  dataScroll(".numberRun2",1235137653);
+	  dataScroll(".numberRun3",2134634);
+	  dataScroll(".numberRun4",1234656);
+
 	
 	protocolList();//协议统计
 	ipActiveList();//活跃IP
@@ -348,7 +277,17 @@ $(document).ready(function(){
 		uaSelectChange($('#uaSelect').val());
 	});
 	
-})
+});
+//动态显示数据
+function dataScroll(index,num){
+	  var numRun = $(index).numberAnimate({num:num, speed:2000, symbol:","});
+	  var nums = 1000;
+	  setInterval(function(){
+	    nums-= 1000;
+	    numRun.resetData(nums);
+	  },2000);
+	
+}
 
 //切换下拉列表-操作系统与浏览器
 function uaSelectChange(ua){
diff --git a/src/main/webapp/WEB-INF/views/dashboard/trafficConnList.jsp b/src/main/webapp/WEB-INF/views/dashboard/trafficConnList.jsp
new file mode 100644
index 000000000..be871c4b6
--- /dev/null
+++ b/src/main/webapp/WEB-INF/views/dashboard/trafficConnList.jsp
@@ -0,0 +1,180 @@
+<%@ 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'"><spring:message code="refresh"/></button>
+	<button type="button" class="btn btn-default" onClick="javascript:window.location='${ctx}/dashboard/logChart'"><spring:message code="back"/></button>
+	</div>
+	<h3 class="page-title">
+		<spring:message code="网络带宽"></spring:message>
+	</h3>
+	<h5 class="page-header"></h5>
+		<ul class="nav nav-tabs">
+			<li class="active"><a href="${ctx}/dashboard/ipActiveList">发送</a></li>
+			<li><a href="${ctx}/dashboard/ipActiveList">接收</a></li>
+			<li><a href="${ctx}/dashboard/ipActiveList">总计</a></li>
+		</ul>
+	
+	<div id="chart" style="width:100%;height:400px;"></div>
+	
+	<div class="col-md-12">
+		<div class="portlet">
+			<div class="portlet-body">
+			
+				<div class="row" >
+					<form:form id="searchForm" modelAttribute="entry" action="${ctx}/traffic/ipActiveList" method="post" class="form-search">
+						<input id="pageNo" name="pageNo" type="hidden" value="${page.pageNo}"/>
+						<input id="pageSize" name="pageSize" type="hidden" value="${page.pageSize}"/>
+					</form:form>
+				</div>
+				<style>
+					.show-two{
+						display: inline-block;
+					}
+					.title-num{
+						margin-right:8px;
+						border-radius:40px !important;
+						background-color: #f34b60;
+						color:#fff;
+						width:40px;
+						text-align: center;
+						font-size: 20px;
+					}
+				</style>
+				<script type="text/javascript">
+				$(function(){
+					$("#contentTable tbody tr").bind('click',function(){
+						$("tbody tr").removeClass("active");
+						$(this).addClass("active");
+						$("span[class='title-num']").html('&nbsp;'+($(this).index()+1)+'&nbsp;')
+					});
+				});
+				</script>
+				<div class="table-responsive show-two">
+					<sys:message content="${message}"/>
+					<table id="contentTable" style="width: 40%;" class="table table-hover table-active table-striped table-bordered table-condensed text-nowrap">
+						<thead>
+							<tr>
+								<th><spring:message code="sort"/></th>
+								<th><spring:message code="ip_addr"/></th>
+								<th><spring:message code="area_id"/></th>
+								<th><spring:message code="link_num"/></th>
+								<th><spring:message code="c2s_pkt_num"/></th>
+								<th><spring:message code="s2c_pkt_num"/></th>
+								<th><spring:message code="c2s_byte_len"/></th>
+								<th><spring:message code="s2c_byte_len"/></th>
+								<th><spring:message code="stat_time"/></th>
+							</tr>
+						</thead>
+						<tbody>
+							<c:forEach var="entry" items="${page.list }" varStatus="status">
+								<tr>
+									<td>${entry.id }</td>
+									<td>${entry.ipAddr }</td>
+									<td>${entry.areaId }</td>
+									<td>${entry.linkNum }</td>
+									<td>${entry.c2sPktNum }</td>
+									<td>${entry.s2cPktNum }</td>
+									<td>${entry.c2sByteLen }</td>
+									<td>${entry.s2cByteLen }</td>
+									<td><fmt:formatDate value="${entry.statTime }" pattern="yyyy-MM-dd HH:mm:ss"/></td>
+								</tr>
+							</c:forEach>
+						</tbody>
+					</table>
+					<div class="page">${page}</div>
+				</div>
+				<div class="right-table" style="width: 32%;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="chart"/></td><td>12131</td></tr>
+								<tr><td><spring:message code="ip_addr"/></td><td>241241</td></tr>
+								<tr><td><spring:message code="area_id"/></td><td>31412</td></tr>
+								<tr><td><spring:message code="link_num"/></td><td>34655</td></tr>
+								<tr><td><spring:message code="c2s_pkt_num"/></td><td>37457</td></tr>
+								<tr><td><spring:message code="s2c_pkt_num"/></td><td>33457</td></tr>
+								<tr><td><spring:message code="c2s_byte_len"/></td><td>38468</td></tr>
+								<tr><td><spring:message code="s2c_byte_len"/></td><td>3367</td></tr>
+								<tr><td><spring:message code="stat_time"/></td><td>33456</td></tr>
+						</tbody>
+					</table>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
+<script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/highcharts.js"></script>
+<script type="text/javascript">
+$(document).ready(function(){
+	var chart = Highcharts.chart('chart', {
+	    title: {
+	        text: '网络带宽'
+	    },
+	    yAxis: {
+	        title: {
+	            text: 'Pkt'
+	        }
+	    },
+	    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'
+	                }
+	            }
+	        }]
+	    }
+
+	});
+	
+});
+
+function showIpActiveChart(){
+	
+}
+
+</script>
+</body>
+</html>
\ No newline at end of file
diff --git a/src/main/webapp/WEB-INF/views/dashboard/trafficIpActiveList.jsp b/src/main/webapp/WEB-INF/views/dashboard/trafficIpActiveList.jsp
index 8b8f6ca33..56e46263c 100644
--- a/src/main/webapp/WEB-INF/views/dashboard/trafficIpActiveList.jsp
+++ b/src/main/webapp/WEB-INF/views/dashboard/trafficIpActiveList.jsp
@@ -17,6 +17,9 @@
 		<spring:message code="活跃IP实时统计TOP100"></spring:message>
 	</h3>
 	<h5 class="page-header"></h5>
+	
+	<div id="chart" style="width:100%;height:400px;"></div>
+	
 	<div class="col-md-12">
 		<div class="portlet">
 			<div class="portlet-body">
@@ -64,9 +67,72 @@
 		</div>
 	</div>
 </div>
-<script src="${pageContext.request.contextPath}/static/layouts/layout/scripts/layout.js" type="text/javascript"></script>
-
+<script src="${pageContext.request.contextPath}/static/global/plugins/highcharts/js/highcharts.js"></script>
 <script type="text/javascript">
+$(document).ready(function(){
+	var chart = Highcharts.chart('chart', {
+	    title: {
+	        text: 'Traffic IP Active Total'
+	    },
+	    yAxis: {
+	        title: {
+	            text: 'IP'
+	        }
+	    },
+	    legend: {
+	        layout: 'vertical',
+	        align: 'right',
+	        verticalAlign: 'middle'
+	    },
+
+	    plotOptions: {
+	        series: {
+	            label: {
+	                connectorAllowed: false
+	            },
+	            pointStart: 2010
+	        }
+	    },
+
+	    series: [{
+	        name: 'Installation',
+	        data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175]
+	    }, {
+	        name: 'Manufacturing',
+	        data: [24916, 24064, 29742, 29851, 32490, 30282, 38121, 40434]
+	    }, {
+	        name: 'Sales & Distribution',
+	        data: [11744, 17722, 16005, 19771, 20185, 24377, 32147, 39387]
+	    }, {
+	        name: 'Project Development',
+	        data: [null, null, 7988, 12169, 15112, 22452, 34400, 34227]
+	    }, {
+	        name: 'Other',
+	        data: [12908, 5948, 8105, 11248, 8989, 11816, 18274, 18111]
+	    }],
+
+	    responsive: {
+	        rules: [{
+	            condition: {
+	                maxWidth: 500
+	            },
+	            chartOptions: {
+	                legend: {
+	                    layout: 'horizontal',
+	                    align: 'center',
+	                    verticalAlign: 'bottom'
+	                }
+	            }
+	        }]
+	    }
+
+	});
+	
+});
+
+function showIpActiveChart(){
+	
+}
 
 	function openChart(){
 		var url = "${ctx}/traffic/showChart";
diff --git a/src/main/webapp/static/global/plugins/highcharts/css/common.css b/src/main/webapp/static/global/plugins/highcharts/css/common.css
index 00631575a..0ee7ca2cc 100644
--- a/src/main/webapp/static/global/plugins/highcharts/css/common.css
+++ b/src/main/webapp/static/global/plugins/highcharts/css/common.css
@@ -1,7 +1,7 @@
 *{
     margin: 0;
     padding: 0;
-    font-family: PingFangSC-Light, 微软雅黑;
+    font-family: PingFangSC-Light, Microsoft YaHei;
 }
 body,html{
     width: 100%;
@@ -45,42 +45,7 @@ a {
 .fr{
     float: right;
 }
-/* header开始 */
 
-.header-title {
-	width: 100%;
-	height: 115px;
-	padding: 30px 0 35px 0;
-	box-sizing: border-box;
-}
-.header-title>.title-center {
-    width: 440px;
-    height: 40px;
-    box-sizing: border-box;
-    border-right: 5px solid #333333;
-    border-left: 5px solid #333333;
-/* 	background: url(../img/title.png) no-repeat; */
-}
-.header-title>.title-center>a {
-	margin-top: 1px;
-	margin-left: 130px;
-    color: #fff;
-	font-size: 30px;
-	font-weight: 600;
-	position: absolute;
-}
-.header-title>.title-left, .header-title>.title-right {
-    width: calc(50% - 220px);
-    height: 3px;
-    background: #333333;
-    margin-top: 10px;
-}
-.fl {
-    float: left;
-}
-.fr {
-    float: right;
-}
 
 td a {
 	color:#fff
diff --git a/src/main/webapp/static/global/plugins/highcharts/css/data_text.css b/src/main/webapp/static/global/plugins/highcharts/css/data_text.css
index 205bad8bb..3326ba7f9 100644
--- a/src/main/webapp/static/global/plugins/highcharts/css/data_text.css
+++ b/src/main/webapp/static/global/plugins/highcharts/css/data_text.css
@@ -1,53 +1,65 @@
+
+/* 页面整体布局 */
 .data_content{
     /*overflow-x: hidden;*/
     /* min-width: 1366px; */
     background-color: #303030;
-    padding-top: 40px;
+    padding-top: 30px;
     padding-bottom: 10px;
 }
 
-/*  */
+/********************  info start  *************************/
+p{
+	margin: 10px
+}
 .data_content .data_info{
-    width: calc(100% - 30px);
+    width: calc(100% - 20px);
     margin-bottom: 40px;
     height: 110px;
     margin-left: 15px;
     text-align: center;
 }
-.data_content .data_info .info_1{
-    width: 40%;
+.data_content .data_info .info_2{
+    width: 60%;
     height: 110px;
 }
 
-.data_content .data_info .fr{
-    width: 40%;
+.data_content .data_info .fr_fc{
+    width: 155%;
+    height: 110px;
+	border: 1px solid #303030;
+	border-width: 0 1px;
+}
+.data_content .data_info .fr_fc .fl_fc{
+    width: 100%;
+    height: 110px;
 	border: 1px solid #303030;
 	border-width: 0 1px;
 	margin-left: 0px;
 }
-.data_content .data_info .info_1>.text_1{
-    width: calc(100% - 15px);
+.data_content .data_info .info_2>.text_2{
+    width: calc(100% - 10px);
     background-color: #3D3D3D;
     height: 110px;
 }
 
-.data_content .data_info .info_2{
-    width: 31%;
+.data_content .data_info .info_1{
+    width: 40%;
     height: 110px;
 }
-.data_content .data_info .info_1 .fr:first-child{
+.data_content .data_info .info_2 .fr_fc:first-child{
 	 border-left: none;
 }
-.data_content .data_info .info_1 .fr:last-child{
+.data_content .data_info .info_2 .fr_fc:last-child{
 	 border-right: none;
 }
-.data_content .data_info .info_2>.text_2{
-    width: calc(100% - 15px);
+.data_content .data_info .info_1>.text_1{
+    width: calc(100% - 1px);
     background-color: #3D3D3D;
     height: 110px;
 }
 
-.data_content .data_info .info_3{
+/* .data_content .data_info .info_3{
     width: 29%;
     height: 110px;
 }
@@ -56,46 +68,81 @@
     background-color: #3D3D3D;
     height: 110px;
 
-}
+} */
 
-.data_content .data_info>div.info_1>.text_1>div{
+.data_content .data_info>div.info_2>.text_2>div{
     width: 33.333%;
     position: relative;
 }
-.data_content .data_info>div.info_2>div>div,
-.data_content .data_info>div.info_3>div>div{
+.data_content .data_info>div.info_1>div>div,
+.data_content .data_info>div.info_2>div>div{
     width: 50%;
     position: relative;
 }
 
 .data_content .data_info>div>div>div>div{
-    margin-left:40px;
+    margin-left:10px;
     margin-top: 1px;
 }
-.data_content .data_info>div.info_2>div>div>div{
-    margin-left: 40px;
+.data_content .data_info>div.info_1>div>div>div{
+    margin-left: 10px;
     margin-top: 1px;
 }
 .data_content .data_info p:nth-child(1){
     color:#fff;
     font-size: 12.8px;
+    text-align: center;
 }
-.data_content .data_info p:nth-child(2){
+.data_content .data_info>div.info_1 p:nth-child(2){
     font-weight: 600;
-    font-size: 28px;
-    color:#ffff43;
+    font-size: 16px;
+    color:#288dce;
+    margin-top: 2.1em;
 }
-.data_content .data_info>div.info_2 p:nth-child(2){
+.data_content .data_info .info_2 .fr_fc .numberRun2{
     font-weight: 600;
-    font-size: 28px;
-    color:#25f3e6;
+    font-size: 16px;
+    color:#288dce;
+    margin-top: 2.1em;
 }
-.data_content .data_info>div.info_3 p:nth-child(2){
+.data_content .data_info .info_2 .fr_fc .numberRun3{
     font-weight: 600;
-    font-size: 28px;
-    color:#ff4e4e;
+    font-size: 16px;
+    color:#288dce;
+    margin-top: 2.1em;
 }
-/* info end */
+.data_content .data_info>div.info_2 .fl_fc .numberRun4{
+    font-weight: 600;
+    font-size: 16px;
+    color:#288dce;
+    margin-top: 1px;
+}
+.data_content .data_info>div.info_2 .fl_fc .csNum{
+    font-size: 5px;
+    color:#ff4e4e !important;
+   	margin-top: 1px;
+}
+/* .data_info{
+	float: right;
+	margin-right: 15px;
+} */
+.fl_fc{
+    float: left;
+}
+.fr_fc{
+    float: left;
+}
+.clearfix:after,.clearfix:before{
+	content:".";
+	display: table;
+}
+.clearfix:after{
+	clear: both;
+}
+.clearfix {
+    *zoom: 1; /*IE/7/6*/
+}
+/************** info end ***********************/
 
 .data_content .data_main{
     width: calc(100% - 30px);
diff --git a/src/main/webapp/static/global/plugins/highcharts/echart.js b/src/main/webapp/static/global/plugins/highcharts/echart.js
index 92cccd123..4279316f1 100644
--- a/src/main/webapp/static/global/plugins/highcharts/echart.js
+++ b/src/main/webapp/static/global/plugins/highcharts/echart.js
@@ -28,7 +28,6 @@
     		});
     		
 	   });
-    	console.log(data)
     	var chart = Highcharts.chart('chart_1', {
     		chart: {
     				type: 'pie',
@@ -41,9 +40,6 @@
     				
     		},
     		noData:{
-    			position:{
-    				align:'center'
-    			},
     			style: {//设置字体颜色
 					color: '#fff',
 				},
@@ -118,7 +114,7 @@
     				type: 'pie',
     				innerSize: '70%',//圆环的大小
     				name: 'count',
-    				data: []
+    				data: data
     		}],
     		drilldown:{
     			series:drillData,
diff --git a/src/main/webapp/static/pages/css/dashboard.css b/src/main/webapp/static/pages/css/dashboard.css
new file mode 100644
index 000000000..049cf7dbf
--- /dev/null
+++ b/src/main/webapp/static/pages/css/dashboard.css
@@ -0,0 +1,5 @@
+/*数字滚动插件的CSS可调整样式*/
+.mt-number-animate{ font-family: 'Microsoft YaHei'; line-height:20px; height: 20px;/*设置数字显示高度*/; /*设置数字大小*/ overflow: hidden; display: inline-block; position: relative; }
+.mt-number-animate .mt-number-animate-dot{ width: 10px;/*设置分割符宽度*/ line-height: 20px; float: left; text-align: center;}
+.mt-number-animate .mt-number-animate-dom{ width: 10px;/*设置单个数字宽度*/ text-align: center; float: left; position: relative; top: 0;}
+.mt-number-animate .mt-number-animate-dom .mt-number-animate-span{ width: 100%; float: left;}
diff --git a/src/main/webapp/static/pages/scripts/dashboard.js b/src/main/webapp/static/pages/scripts/dashboard.js
new file mode 100644
index 000000000..2f2dea9ab
--- /dev/null
+++ b/src/main/webapp/static/pages/scripts/dashboard.js
@@ -0,0 +1,129 @@
+/**
+*  数字滚动插件 v1.0
+*/
+(function($) {
+  $.fn.numberAnimate = function(setting) {
+    var defaults = {
+      speed : 1000,//动画速度
+      num : "", //初始化值
+      iniAnimate : true, //是否要初始化动画效果
+      symbol : '',//默认的分割符号，千，万，千万
+      dot : 0 //保留几位小数点
+    }
+    //如果setting为空，就取default的值
+    var setting = $.extend(defaults, setting);
+  
+    //如果对象有多个，提示出错
+    if($(this).length > 1){
+      alert("just only one obj!");
+      return;
+    }
+  
+    //如果未设置初始化值。提示出错
+    if(setting.num == ""){
+      alert("must set a num!");
+      return;
+    }
+    var nHtml = '<div class="mt-number-animate-dom" data-num="{{num}}">\
+            <span class="mt-number-animate-span">0</span>\
+            <span class="mt-number-animate-span">1</span>\
+            <span class="mt-number-animate-span">2</span>\
+            <span class="mt-number-animate-span">3</span>\
+            <span class="mt-number-animate-span">4</span>\
+            <span class="mt-number-animate-span">5</span>\
+            <span class="mt-number-animate-span">6</span>\
+            <span class="mt-number-animate-span">7</span>\
+            <span class="mt-number-animate-span">8</span>\
+            <span class="mt-number-animate-span">9</span>\
+            <span class="mt-number-animate-span">.</span>\
+          </div>';
+  
+    //数字处理
+    var numToArr = function(num){
+      num = parseFloat(num).toFixed(setting.dot);
+      if(typeof(num) == 'number'){
+        var arrStr = num.toString().split("");  
+      }else{
+        var arrStr = num.split("");
+      }
+      //console.log(arrStr);
+      return arrStr;
+    }
+  
+    //设置DOM symbol:分割符号
+    var setNumDom = function(arrStr){
+      var shtml = '<div class="mt-number-animate">';
+      for(var i=0,len=arrStr.length; i<len; i++){
+        if(i != 0 && (len-i)%3 == 0 && setting.symbol != "" && arrStr[i]!="."){
+          shtml += '<div class="mt-number-animate-dot">'+setting.symbol+'</div>'+nHtml.replace("{{num}}",arrStr[i]);
+        }else{
+          shtml += nHtml.replace("{{num}}",arrStr[i]);
+        }
+      }
+      shtml += '</div>';
+      return shtml;
+    }
+  
+    //执行动画
+    var runAnimate = function($parent){
+      $parent.find(".mt-number-animate-dom").each(function() {
+        var num = $(this).attr("data-num");
+        num = (num=="."?10:num);
+        var spanHei = $(this).height()/11; //11为元素个数
+        var thisTop = -num*spanHei+"px";
+        if(thisTop != $(this).css("top")){
+          if(setting.iniAnimate){
+            //HTML5不支持
+            if(!window.applicationCache){
+              $(this).animate({
+                top : thisTop
+              }, setting.speed);
+            }else{
+              $(this).css({
+                'transform':'translateY('+thisTop+')',
+                '-ms-transform':'translateY('+thisTop+')',   /* IE 9 */
+                '-moz-transform':'translateY('+thisTop+')',  /* Firefox */
+                '-webkit-transform':'translateY('+thisTop+')', /* Safari 和 Chrome */
+                '-o-transform':'translateY('+thisTop+')',
+                '-ms-transition':setting.speed/1000+'s',
+                '-moz-transition':setting.speed/1000+'s',
+                '-webkit-transition':setting.speed/1000+'s',
+                '-o-transition':setting.speed/1000+'s',
+                'transition':setting.speed/1000+'s'
+              }); 
+            }
+          }else{
+            setting.iniAnimate = true;
+            $(this).css({
+              top : thisTop
+            });
+          }
+        }
+      });
+    }
+  
+    //初始化
+    var init = function($parent){
+      //初始化
+      $parent.html(setNumDom(numToArr(setting.num)));
+      runAnimate($parent);
+    };
+  
+    //重置参数
+    this.resetData = function(num){
+      var newArr = numToArr(num);
+      var $dom = $(this).find(".mt-number-animate-dom");
+      if($dom.length < newArr.length){
+        $(this).html(setNumDom(numToArr(num)));
+      }else{
+        $dom.each(function(index, el) {
+          $(this).attr("data-num",newArr[index]);
+        });
+      }
+      runAnimate($(this));
+    }
+    //init
+    init($(this));
+    return this;
+  }
+})(jQuery);
\ No newline at end of file