box
/
box-gm


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178
							<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>欢迎页面-X-admin2.0</title>
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
        <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
        <link rel="stylesheet" href="./static/css/font.css">
        <link rel="stylesheet" href="./static/css/xadmin.css">
        <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
        <script src="http://code.highcharts.com/highcharts.js"></script>
    </head>
    <body onload="InitParams({{.Server_id}}, {{.Minutes}}, {{.Days}})">
    <div class="x-body layui-anim layui-anim-up">
        <blockquote class="layui-elem-quote">
          指定服务器:<input id="server_id" type="text" name="服务器ID" />

          时间颗粒度(分钟):<input id="minutes" type="text" name="时间颗粒度" />
              
          过往天数:<input id="days" type="text" name="天数" />
          <br>
          <br>
          <input class="layui-btn" type="button" onclick="submitUpdate()" value=刷新>
              
          <input class="layui-btn" type="button" onclick="submitDownload()" value=下载>
        </blockquote>
    </div>
    <div class="layui-row layui-col-space20">
      <div class="layui-col-md4">
          <!-- 给具体的内容设置背景颜色 -->
          <div style="background-color: powderblue">
            <h1 id="today_regist" style = "text-align:center;" value = "">
            <span id ="cur_online" style="font-size:20px;"> 当前在线 : 0 </span>
            </h1>
          </div>
      </div>
    </div>
    <div id="container" style="width: 1600px; height: 800px; margin: 0 auto"></div>
    <script language="JavaScript">
      $(document).ready(function() {
        var chart = {
          type: 'spline'
        };
        var title = {
            text: '在线人数分布'   
        };
        var subtitle = {
            text: '来源:游戏服'
        };
        var xAxis = {
            title: {
              text: '时间'
            },
            tickPixelInterval: 1,
            categories: {{.Categories}}
        };
        var yAxis = {
            title: {
              text: '人数'
            },
            plotLines: [{
              value: 0,
              width: 1,
              color: '#808080'
            }]
        };   

        var tooltip = {
          valueSuffix: '人'
        }

        var legend = {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'middle',
            borderWidth: 0
        };

        var series =  [
        ];
        var list = {{.Series}}

        var onlineCount = {{.Online_count}};

        for ( var i= 0; i < list.length; i++){

          series.push({"name":list[i].Name, "data":eval(list[i].Data)})
        }
        
        updateCurrentOnline(onlineCount);

        var json = {};

        json.title = title;
        json.subtitle = subtitle;
        json.xAxis = xAxis;
        json.yAxis = yAxis;
        json.tooltip = tooltip;
        json.legend = legend;
        json.series = series;
        json.chart = chart;

        $('#container').highcharts(json);

      });
    
      function InitParams(ServerId, Minutes, Days) {
        if (ServerId.length > 0) {
            document.getElementById("server_id").value = ServerId;
        }
        if (Minutes > 0) {
            document.getElementById("minutes").value = Minutes;
        }
        if (Days > 0) {
            document.getElementById("days").value = Days;
        }
      }
    
      function submitUpdate() {
        var sid = document.getElementById("server_id").value;
        var min = document.getElementById("minutes").value;
        var days = document.getElementById("days").value;
        var text = "server_id=" + encodeURI(sid)  + "&minutes=" + encodeURI(min) + "&days=" + encodeURI(days) ;
        
        $.ajax({
          type:"get",
          url:"/rtonline?" + text,
          success:function (data) {
            // alert(data.status);
            if (data.status){
              window.location.href="/rtonline?"+text;
              if (data.info){
                layer.msg(data.info,{icon:1,time:1000});
              }
            }else{
              if (data.info){
                alert(data.info);
              }else{
                window.location.href="/rtonline?"+text;
              }
            }
          }
        });
      }
      function submitDownload () {
        var sid = document.getElementById("server_id").value;
        var min = document.getElementById("minutes").value;
        var days = document.getElementById("days").value;
        var text = "server_id=" + encodeURI(sid)  + "&minutes=" + encodeURI(min) + "&days=" + encodeURI(days)+ "&querydata=rtonline";
        
        $.ajax({
          type:"get",
          url:"/rtonline?" + text,
          success:function (data) {
            // alert(data.status);
            if (data.status){
              window.location.href="/rtonline?"+text;
              if (data.info){
                layer.msg(data.info,{icon:1,time:1000});
              }
            }else{
              if (data.info){
                alert(data.info);
              }else{
                window.location.href="/rtonline?"+text;
              }
            }
          }
        });
      }

      function updateCurrentOnline (count) {
        document.getElementById('cur_online').innerText="当前在线: "+count;
      }
    </script>
    </body>
</html>