show proxy detail

assets/static/js/index-server-info.js

@@ -1,19 +1,26 @@
 var loadServerInfo = (function ($) {
     var size = filesize.partial({base: 2, standard: "jedec"});
+    var i18n = {};
 
     /**
      * get server info
      * @param lang {{}} language json
+     * @param title page title
      */
     function loadServerInfo(lang, title) {
-        console.log(title)
+        i18n = lang;
         $("#title").text(title);
         $('#content').empty();
         var loading = layui.layer.load();
 
         $.getJSON('/proxy/api/serverinfo').done(function (result) {
             if (result.success) {
-                renderServerInfo(JSON.parse(result.data));
+                var data = JSON.parse(result.data);
+                data.proxy_counts = 0;
+                for (var proxy in data.proxy_type_count) {
+                    data.proxy_counts = data.proxy_counts + data.proxy_type_count[proxy];
+                }
+                renderServerInfo(data);
             } else {
                 layui.layer.msg(result.message);
             }
@@ -22,6 +29,10 @@ var loadServerInfo = (function ($) {
         });
     }
 
+    /**
+     * render server info page
+     * @param data server info data
+     */
     function renderServerInfo(data) {
         var html = layui.laytpl($('#serverInfoTemplate').html()).render(data);
         $('#content').html(html);
@@ -30,10 +41,14 @@ var loadServerInfo = (function ($) {
         renderCountChart(data);
     }
 
+    /**
+     * render traffic chart with echarts
+     * @param data traffic data
+     */
     function renderTrafficChart(data) {
         var chartData = [
-            {value: data.total_traffic_in, name: 'total_traffic_in'},
-            {value: data.total_traffic_out, name: 'total_traffic_out'}
+            {value: data.total_traffic_in, name: 'Traffic In'},
+            {value: data.total_traffic_out, name: 'Traffic Out'}
         ];
         var chartDom = document.getElementById('trafficChart');
         var chart = echarts.init(chartDom);
@@ -74,6 +89,10 @@ var loadServerInfo = (function ($) {
         option && chart.setOption(option);
     }
 
+    /**
+     * render proxy count chat with echarts
+     * @param data proxy count data
+     */
     function renderCountChart(data) {
         var proxies = data.proxy_type_count;
         var charLegend = [];
@@ -81,7 +100,7 @@ var loadServerInfo = (function ($) {
 
         for (var type in proxies) {
             var temp = {
-                name: type,
+                name: type.toUpperCase(),
                 value: proxies[type]
             };
             charLegend.push(type);