box
/
box-gm


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153
							<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>欢迎页面-X-admin2.0</title>
        <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>
    指定服务器:
    <input id="server_id" type="text" name="服务器ID" value={{.Server_id}}>
    <br>
    <br>
    时间颗粒度(分钟):
    <input id="minutes" type="text" name="时间颗粒度" value={{.Minutes}}>
    <br>

    <br>
    <input class="layui-btn" type="button" onclick="submitUpdate()" value=刷新>
        
    <input class="layui-btn" type="button" onclick="submitDownload()" value=下载>
    <br><br>

    <div class="layui-row layui-col-space20">
    <div class="layui-col-md4">
       
      <h1 id="today_charge"  value = "">
      <span id ="cur_charge" style="font-size:20px;"> 今日充值 : 0 </span>
      </h1>
       
    </div>

    <br><br>
    <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: 'Source: '
      };
      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}}

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

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

      var TodayCharge = {{.TodayCharge}};
      updateCharge(TodayCharge)

      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 submitUpdate () {
        var sid = document.getElementById("server_id").value;
        var min = document.getElementById("minutes").value;
        var text = "server_id=" + encodeURI(sid)  + "&minutes=" + encodeURI(min) ;
        
        $.ajax({
          type:"get",
          url:"/rtpay?" + text,
          success:function (data) {
            // alert(data.status);
            if (data.status){
              window.location.href="/rtpay?"+text;
            }else{
              if (data.info){
                alert(data.info);
              }else{
                window.location.href="/rtpay?"+text;
              }
            }
          }
        });
      }
      function submitDownload () {
        var sid = document.getElementById("server_id").value;
        var min = document.getElementById("minutes").value;
        var text = "server_id=" + encodeURI(sid)  + "&minutes=" + encodeURI(min) + "&querydata=rtpay";
        
        $.ajax({
          type:"get",
          url:"/rtpay?" + text,
          success:function (data) {
            // alert(data.status);
            if (data.status){
              window.location.href="/rtpay?"+text;
            }else{
              if (data.info){
                alert(data.info);
              }else{
                window.location.href="/rtpay?"+text;
              }
            }
          }
        });
      }

      function updateCharge (today) {
        document.getElementById('cur_charge').innerText="今日充值: "+today+"美分";
      }
    </script>
    </body>
</html>