pay.tpl 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8" />
  5. <title>欢迎页面-X-admin2.0</title>
  6. <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
  7. <script src="http://code.highcharts.com/highcharts.js"></script>
  8. </head>
  9. <body>
  10. 指定服务器:
  11. <input id="server_id" type="text" name="服务器ID" value={{.Server_id}}>
  12. <br>
  13. <br>
  14. 时间颗粒度(分钟):
  15. <input id="minutes" type="text" name="时间颗粒度" value={{.Minutes}}>
  16. <br>
  17. <br>
  18. 过往天数:
  19. <input id="days" type="text" name="天数" value={{.Days}}>
  20. <br>
  21. <br>
  22. <input class="layui-btn" type="button" onclick="submitUpdate()" value=刷新>
  23. <input class="layui-btn" type="button" onclick="submitDownload()" value=下载>
  24. <br><br>
  25. <div class="layui-row layui-col-space20">
  26. <div class="layui-col-md4">
  27. <h1 id="today_charge" value = "">
  28. <span id ="cur_charge" style="font-size:20px;"> 今日充值 : 0 </span>
  29. </h1>
  30. <h1 id="total_charge" value = "">
  31. <span id ="tol_charge" style="font-size:20px;"> 累计充值 : 0 </span>
  32. </h1>
  33. </div>
  34. <br><br>
  35. <div id="container" style="width: 1600px; height: 800px; margin: 0 auto"></div>
  36. <script language="JavaScript">
  37. $(document).ready(function() {
  38. var chart = {
  39. type: 'spline'
  40. };
  41. var title = {
  42. text: '支付金额统计'
  43. };
  44. var subtitle = {
  45. text: 'Source: '
  46. };
  47. var xAxis = {
  48. title: {
  49. text: '时间'
  50. },
  51. tickPixelInterval: 1,
  52. categories: {{.Categories}}
  53. };
  54. var yAxis = {
  55. title: {
  56. text: '金额(美分)'
  57. },
  58. plotLines: [{
  59. value: 0,
  60. width: 1,
  61. color: '#808080'
  62. }]
  63. };
  64. var tooltip = {
  65. valueSuffix: '美分'
  66. }
  67. var legend = {
  68. layout: 'vertical',
  69. align: 'right',
  70. verticalAlign: 'middle',
  71. borderWidth: 0
  72. };
  73. var series = [
  74. ];
  75. var list = {{.Series}}
  76. for ( var i= 0; i < list.length; i++){
  77. series.push({"name":list[i].Name, "data":eval(list[i].Data)})
  78. }
  79. var TodayCharge = {{.TodayCharge}};
  80. var TotalCharge = {{.TotalCharge}};
  81. updateCharge(TodayCharge,TotalCharge)
  82. var json = {};
  83. json.title = title;
  84. json.subtitle = subtitle;
  85. json.xAxis = xAxis;
  86. json.yAxis = yAxis;
  87. json.tooltip = tooltip;
  88. json.legend = legend;
  89. json.series = series;
  90. json.chart = chart;
  91. $('#container').highcharts(json);
  92. });
  93. function submitUpdate () {
  94. var sid = document.getElementById("server_id").value;
  95. var min = document.getElementById("minutes").value;
  96. var days = document.getElementById("days").value;
  97. var text = "server_id=" + encodeURI(sid) + "&minutes=" + encodeURI(min) + "&days=" + encodeURI(days) ;
  98. $.ajax({
  99. type:"get",
  100. url:"/pay?" + text,
  101. success:function (data) {
  102. // alert(data.status);
  103. if (data.status){
  104. window.location.href="/pay?"+text;
  105. }else{
  106. if (data.info){
  107. alert(data.info);
  108. }else{
  109. window.location.href="/pay?"+text;
  110. }
  111. }
  112. }
  113. });
  114. }
  115. function submitDownload () {
  116. var sid = document.getElementById("server_id").value;
  117. var min = document.getElementById("minutes").value;
  118. var days = document.getElementById("days").value;
  119. var text = "server_id=" + encodeURI(sid) + "&minutes=" + encodeURI(min) + "&days=" + encodeURI(days) + "&querydata=pay";
  120. $.ajax({
  121. type:"get",
  122. url:"/pay?" + text,
  123. success:function (data) {
  124. // alert(data.status);
  125. if (data.status){
  126. window.location.href="/pay?"+text;
  127. }else{
  128. if (data.info){
  129. alert(data.info);
  130. }else{
  131. window.location.href="/pay?"+text;
  132. }
  133. }
  134. }
  135. });
  136. }
  137. function updateCharge (today,total) {
  138. document.getElementById('cur_charge').innerText="今日充值: "+today+"美分";
  139. document.getElementById('tol_charge').innerText="累计充值: "+total+"美分";
  140. }
  141. </script>
  142. </body>
  143. </html>