dashboard: code and frontend style refinement for #927 and #869

Signed-off-by: Eric Zhao <sczyh16@gmail.com>

sentinel-dashboard/src/main/java/com/alibaba/csp/sentinel/dashboard/controller/SystemController.java

@@ -23,42 +23,38 @@ import javax.servlet.http.HttpServletRequest;
 import com.alibaba.csp.sentinel.dashboard.auth.AuthService;
 import com.alibaba.csp.sentinel.dashboard.auth.AuthService.AuthUser;
 import com.alibaba.csp.sentinel.dashboard.auth.AuthService.PrivilegeType;
+import com.alibaba.csp.sentinel.dashboard.repository.rule.RuleRepository;
 import com.alibaba.csp.sentinel.util.StringUtil;
 
 import com.alibaba.csp.sentinel.dashboard.datasource.entity.rule.SystemRuleEntity;
 import com.alibaba.csp.sentinel.dashboard.discovery.MachineInfo;
 import com.alibaba.csp.sentinel.dashboard.client.SentinelApiClient;
 import com.alibaba.csp.sentinel.dashboard.domain.Result;
-import com.alibaba.csp.sentinel.dashboard.repository.rule.InMemSystemRuleStore;
 
 import org.slf4j.Logger;
 import org.slf4j.LoggerFactory;
 import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.http.MediaType;
-import org.springframework.stereotype.Controller;
+import org.springframework.web.bind.annotation.GetMapping;
 import org.springframework.web.bind.annotation.RequestMapping;
-import org.springframework.web.bind.annotation.ResponseBody;
+import org.springframework.web.bind.annotation.RestController;
 
 /**
  * @author leyou(lihao)
  */
-@Controller
-@RequestMapping(value = "/system", produces = MediaType.APPLICATION_JSON_VALUE)
+@RestController
+@RequestMapping("/system")
 public class SystemController {
-    private static Logger logger = LoggerFactory.getLogger(SystemController.class);
+
+    private final Logger logger = LoggerFactory.getLogger(SystemController.class);
 
     @Autowired
-    private InMemSystemRuleStore repository;
+    private RuleRepository<SystemRuleEntity, Long> repository;
     @Autowired
     private SentinelApiClient sentinelApiClient;
     @Autowired
     private AuthService<HttpServletRequest> authService;
 
-    @ResponseBody
-    @RequestMapping("/rules.json")
-    Result<List<SystemRuleEntity>> queryMachineRules(HttpServletRequest request, String app, String ip, Integer port) {
-        AuthUser authUser = authService.getAuthUser(request);
-        authUser.authTarget(app, PrivilegeType.READ_RULE);
+    private <R> Result<R> checkBasicParams(String app, String ip, Integer port) {
         if (StringUtil.isEmpty(app)) {
             return Result.ofFail(-1, "app can't be null or empty");
         }
@@ -68,12 +64,28 @@ public class SystemController {
         if (port == null) {
             return Result.ofFail(-1, "port can't be null");
         }
+        if (port <= 0 || port > 65535) {
+            return Result.ofFail(-1, "port should be in (0, 65535)");
+        }
+        return null;
+    }
+
+    @GetMapping("/rules.json")
+    public Result<List<SystemRuleEntity>> apiQueryMachineRules(HttpServletRequest request, String app, String ip,
+                                                               Integer port) {
+        AuthUser authUser = authService.getAuthUser(request);
+        authUser.authTarget(app, PrivilegeType.READ_RULE);
+
+        Result<List<SystemRuleEntity>> checkResult = checkBasicParams(app, ip, port);
+        if (checkResult != null) {
+            return checkResult;
+        }
         try {
             List<SystemRuleEntity> rules = sentinelApiClient.fetchSystemRuleOfMachine(app, ip, port);
             rules = repository.saveAll(rules);
             return Result.ofSuccess(rules);
         } catch (Throwable throwable) {
-            logger.error("queryApps error:", throwable);
+            logger.error("Query machine system rules error", throwable);
             return Result.ofThrowable(-1, throwable);
         }
     }
@@ -88,65 +100,38 @@ public class SystemController {
         return notNullCount;
     }
 
-    /**
-     * @modify
-     * 目前代码里做了如下几点修改：
-     * 1】修改属性名称avgLoad 修改为highestSystemLoad
-     * 2】修改属性名称avgCpu 修改为highestCpuUsage
-     * 3】调用countNotNullAndNotNegative非空校验方法里增加参数highestCpuUsage,
-     * 4】修改notNullCount部分判断错误提示语,因为目前countNotNullAndNotNegative里针对=0的情况也做了限制
-     * 5】对于highestSystemLoad、highestCpuUsage增加>1 的这个判断
-     * @author tianyang5@yeah.net
-     * @time 2019年7月17日 18:30:32
-     * @modify
-     *
-     * @param request
-     * @param app
-     * @param ip
-     * @param port
-     * @param highestSystemLoad
-     * @param highestCpuUsage
-     * @param avgRt
-     * @param maxThread
-     * @param qps
-     * @return
-     */
-    @ResponseBody
     @RequestMapping("/new.json")
-    Result<?> add(HttpServletRequest request,
-                  String app, String ip, Integer port, Double highestSystemLoad,Double highestCpuUsage, Long avgRt, Long maxThread, Double qps) {
+    public Result<SystemRuleEntity> apiAdd(HttpServletRequest request, String app, String ip, Integer port,
+                                           Double highestSystemLoad, Double highestCpuUsage, Long avgRt,
+                                           Long maxThread, Double qps) {
         AuthUser authUser = authService.getAuthUser(request);
         authUser.authTarget(app, PrivilegeType.WRITE_RULE);
-        if (StringUtil.isBlank(app)) {
-            return Result.ofFail(-1, "app can't be null or empty");
-        }
-        if (StringUtil.isBlank(ip)) {
-            return Result.ofFail(-1, "ip can't be null or empty");
-        }
-        if (port == null) {
-            return Result.ofFail(-1, "port can't be null");
+
+        Result<SystemRuleEntity> checkResult = checkBasicParams(app, ip, port);
+        if (checkResult != null) {
+            return checkResult;
         }
 
-        int notNullCount = countNotNullAndNotNegative(highestSystemLoad, avgRt, maxThread, qps,highestCpuUsage);
+        int notNullCount = countNotNullAndNotNegative(highestSystemLoad, avgRt, maxThread, qps, highestCpuUsage);
         if (notNullCount != 1) {
             return Result.ofFail(-1, "only one of [highestSystemLoad, avgRt, maxThread, qps,highestCpuUsage] "
                 + "value must be set > 0, but " + notNullCount + " values get");
         }
-        if (  null!=highestCpuUsage && 1 < highestCpuUsage ) {
-            return Result.ofFail(-1, "highestCpuUsage must <= 1");
+        if (null != highestCpuUsage && highestCpuUsage > 1) {
+            return Result.ofFail(-1, "highestCpuUsage must between [0.0, 1.0]");
         }
         SystemRuleEntity entity = new SystemRuleEntity();
         entity.setApp(app.trim());
         entity.setIp(ip.trim());
         entity.setPort(port);
         // -1 is a fake value
-        if ( null != highestSystemLoad  ) {
+        if (null != highestSystemLoad) {
             entity.setHighestSystemLoad(highestSystemLoad);
         } else {
             entity.setHighestSystemLoad(-1D);
         }
 
-        if ( null !=  highestCpuUsage ) {
+        if (null != highestCpuUsage) {
             entity.setHighestCpuUsage(highestCpuUsage);
         } else {
             entity.setHighestCpuUsage(-1D);
@@ -173,39 +158,19 @@ public class SystemController {
         try {
             entity = repository.save(entity);
         } catch (Throwable throwable) {
-            logger.error("add error:", throwable);
+            logger.error("Add SystemRule error", throwable);
             return Result.ofThrowable(-1, throwable);
         }
         if (!publishRules(app, ip, port)) {
-            logger.info("publish system rules fail after rule add");
+            logger.warn("Publish system rules fail after rule add");
         }
         return Result.ofSuccess(entity);
     }
 
-    /**
-     * @modify
-     * 目前代码里做了如下几点修改：
-     * 1】修改属性名称avgLoad 修改为highestSystemLoad
-     * 2】修改属性名称avgCpu 修改为highestCpuUsage
-     * 1】对于highestSystemLoad、highestCpuUsage增加>1 的这个判断,调整原先<0的判断,调整为<=0  等于0的这种规则设置了也没有意义
-     * @author tianyang5@yeah.net
-     * @time 2019年7月17日 18:30:32
-     * @modify
-     *
-     * @param request
-     * @param id
-     * @param app
-     * @param highestSystemLoad
-     * @param highestCpuUsage
-     * @param avgRt
-     * @param maxThread
-     * @param qps
-     * @return
-     */
-    @ResponseBody
-    @RequestMapping("/save.json")
-    Result<?> updateIfNotNull(HttpServletRequest request,
-                              Long id, String app, Double highestSystemLoad,Double highestCpuUsage, Long avgRt, Long maxThread, Double qps) {
+    @GetMapping("/save.json")
+    public Result<SystemRuleEntity> apiUpdateIfNotNull(HttpServletRequest request,
+                                        Long id, String app, Double highestSystemLoad, Double highestCpuUsage,
+                                        Long avgRt, Long maxThread, Double qps) {
         AuthUser authUser = authService.getAuthUser(request);
         if (id == null) {
             return Result.ofFail(-1, "id can't be null");
@@ -219,7 +184,7 @@ public class SystemController {
             entity.setApp(app.trim());
         }
         if (highestSystemLoad != null) {
-            if (highestSystemLoad <= 0) {
+            if (highestSystemLoad < 0) {
                 return Result.ofFail(-1, "highestSystemLoad must >= 0");
             }
             entity.setHighestSystemLoad(highestSystemLoad);
@@ -265,9 +230,8 @@ public class SystemController {
         return Result.ofSuccess(entity);
     }
 
-    @ResponseBody
     @RequestMapping("/delete.json")
-    Result<?> delete(HttpServletRequest request, Long id) {
+    public Result<?> delete(HttpServletRequest request, Long id) {
         AuthUser authUser = authService.getAuthUser(request);
         if (id == null) {
             return Result.ofFail(-1, "id can't be null");

sentinel-dashboard/src/main/java/com/alibaba/csp/sentinel/dashboard/datasource/entity/rule/SystemRuleEntity.java

@@ -29,20 +29,10 @@ public class SystemRuleEntity implements RuleEntity {
     private String app;
     private String ip;
     private Integer port;
-    /**
-     * 对应SystemRule 里的属性highestSystemLoad,这里做下调整
-     * @author tianyang5@yeah.net
-     * @time 2019年7月17日 18:30:32
-     */
     private Double highestSystemLoad;
     private Long avgRt;
     private Long maxThread;
     private Double qps;
-    /**
-     * 对应SystemRule 里的属性highestCpuUsage
-     * @author tianyang5@yeah.net
-     * @time 2019年7月17日 18:30:32
-     */
     private Double highestCpuUsage;
 
     private Date gmtCreate;

sentinel-dashboard/src/main/webapp/resources/app/scripts/controllers/system.js

@@ -31,13 +31,12 @@ app.controller('SystemCtl', ['$scope', '$stateParams', 'SystemService', 'ngDialo
       if (!$scope.macInputModel) {
         return;
       }
-      var mac = $scope.macInputModel.split(':');
+      let mac = $scope.macInputModel.split(':');
       SystemService.queryMachineRules($scope.app, mac[0], mac[1]).success(
         function (data) {
-          if (data.code == 0 && data.data) {
+          if (data.code === 0 && data.data) {
             $scope.rules = data.data;
             $.each($scope.rules, function (idx, rule) {
-              // rule.orginEnable = rule.enable;
               if (rule.highestSystemLoad >= 0) {
                 rule.grade = 0;
               } else if (rule.avgRt >= 0) {
@@ -46,7 +45,7 @@ app.controller('SystemCtl', ['$scope', '$stateParams', 'SystemService', 'ngDialo
                 rule.grade = 2;
               } else if (rule.qps >= 0) {
                 rule.grade = 3;
-              }else if (rule.highestCpuUsage >= 0) {
+              } else if (rule.highestCpuUsage >= 0) {
                   rule.grade = 4;
               }
             });
@@ -56,7 +55,8 @@ app.controller('SystemCtl', ['$scope', '$stateParams', 'SystemService', 'ngDialo
             $scope.rulesPageConfig.totalCount = 0;
           }
         });
-    };
+    }
+
     $scope.getMachineRules = getMachineRules;
     var systemRuleDialog;
     $scope.editRule = function (rule) {
@@ -96,13 +96,12 @@ app.controller('SystemCtl', ['$scope', '$stateParams', 'SystemService', 'ngDialo
     };
 
     $scope.saveRule = function () {
-      if ($scope.systemRuleDialog.type == 'add') {
+      if ($scope.systemRuleDialog.type === 'add') {
         addNewRule($scope.currentRule);
-      } else if ($scope.systemRuleDialog.type == 'edit') {
+      } else if ($scope.systemRuleDialog.type === 'edit') {
         saveRule($scope.currentRule, true);
       }
-    }
-
+    };
 
     var confirmDialog;
     $scope.deleteRule = function (rule) {
@@ -110,7 +109,7 @@ app.controller('SystemCtl', ['$scope', '$stateParams', 'SystemService', 'ngDialo
       var ruleTypeDesc = '';
       var ruleTypeCount = null;
       if (rule.highestSystemLoad != -1) {
-        ruleTypeDesc = '系统LOAD';
+        ruleTypeDesc = 'LOAD';
         ruleTypeCount = rule.highestSystemLoad;
       } else if (rule.avgRt != -1) {
         ruleTypeDesc = 'RT';
@@ -142,7 +141,7 @@ app.controller('SystemCtl', ['$scope', '$stateParams', 'SystemService', 'ngDialo
 
 
     $scope.confirm = function () {
-      if ($scope.confirmDialog.type == 'delete_rule') {
+      if ($scope.confirmDialog.type === 'delete_rule') {
         deleteRule($scope.currentRule);
         // } else if ($scope.confirmDialog.type == 'enable_rule') {
         //     $scope.currentRule.enable = true;
@@ -161,48 +160,47 @@ app.controller('SystemCtl', ['$scope', '$stateParams', 'SystemService', 'ngDialo
 
     function deleteRule(rule) {
       SystemService.deleteRule(rule).success(function (data) {
-        if (data.code == 0) {
+        if (data.code === 0) {
           getMachineRules();
           confirmDialog.close();
-        }  else if(data.msg!=null){
-            alert(data.msg);
-        } else{
-            alert('失败!');
+        } else if (data.msg != null) {
+            alert('失败：' + data.msg);
+        } else {
+            alert('失败：未知错误');
         }
       });
-    };
+    }
 
     function addNewRule(rule) {
+      if (rule.grade == 4 && (rule.highestCpuUsage < 0 || rule.highestCpuUsage > 1)) {
+        alert('CPU 使用率模式的取值范围应为 [0.0, 1.0]，对应 0% - 100%');
+        return;
+      }
       SystemService.newRule(rule).success(function (data) {
-        if (data.code == 0) {
+        if (data.code === 0) {
           getMachineRules();
           systemRuleDialog.close();
-        } else if(data.msg!=null){
-          alert(data.msg);
-        }else{
-            alert('失败!');
+        } else if (data.msg != null) {
+          alert('失败：' + data.msg);
+        } else {
+          alert('失败：未知错误');
         }
       });
-    };
+    }
 
     function saveRule(rule, edit) {
       SystemService.saveRule(rule).success(function (data) {
-        if (data.code == 0) {
-          // if (rule.enable) {
-          //    rule.orginEnable = true;
-          // } else {
-          //    rule.orginEnable = false;
-          // }
+        if (data.code === 0) {
           getMachineRules();
           if (edit) {
             systemRuleDialog.close();
           } else {
             confirmDialog.close();
           }
-        } else if(data.msg!=null){
-            alert(data.msg);
-        }else{
-            alert('失败!');
+        } else if (data.msg != null) {
+          alert('失败：' + data.msg);
+        } else {
+          alert('失败：未知错误');
         }
       });
     }
@@ -210,7 +208,7 @@ app.controller('SystemCtl', ['$scope', '$stateParams', 'SystemService', 'ngDialo
     function queryAppMachines() {
       MachineService.getAppMachines($scope.app).success(
         function (data) {
-          if (data.code == 0) {
+          if (data.code === 0) {
             // $scope.machines = data.data;
             if (data.data) {
               $scope.machines = [];

sentinel-dashboard/src/main/webapp/resources/app/scripts/services/systemservice.js

@@ -28,7 +28,7 @@ app.service('SystemService', ['$http', function ($http) {
       param.maxThread = rule.maxThread;
     } else if (rule.grade == 3) {// qps
       param.qps = rule.qps;
-    }else if (rule.grade == 4) {// cpu
+    } else if (rule.grade == 4) {// cpu
       param.highestCpuUsage = rule.highestCpuUsage;
     }
 
@@ -51,7 +51,7 @@ app.service('SystemService', ['$http', function ($http) {
       param.maxThread = rule.maxThread;
     } else if (rule.grade == 3) {// qps
       param.qps = rule.qps;
-    }else if (rule.grade == 4) {// cpu
+    } else if (rule.grade == 4) {// cpu
         param.highestCpuUsage = rule.highestCpuUsage;
     }
 

sentinel-dashboard/src/main/webapp/resources/app/views/dialog/gateway/api-dialog.html

@@ -2,7 +2,6 @@
 	<span class="brand" style="font-weight:bold;">{{gatewayApiDialog.title}}</span>
 	<div class="card" style="margin-top: 20px;margin-bottom: 10px;">
 		<div class="panel-body">
-			<div class="row">
 				<form role="form" class="form-horizontal">
 					<div class="form-group">
 						<label class="col-sm-2 control-label">API 名称</label>
@@ -28,19 +27,16 @@
 						</div>
 						<div class="col-sm-1 control-label" align="center">
 							<button class="btn btn-outline-danger" ng-click="removeMatchPattern($index)"
-									align="center" ng-if="currentApi.predicateItems.length>1">X</button>
+									align="center" ng-if="currentApi.predicateItems.length > 1">X</button>
 						</div>
 					</div>
 
-					<div class="form-group">
-						<label class="col-sm-11 control-label" style="text-align: center;">
-								<button class="btn btn-outline-primary" ng-click="addNewMatchPattern()" align="center">
-									<i class="fa fa-plus"></i>新增匹配规则
-								</button>
-						</label>
+					<div class="form-group" style="text-align: center">
+						<button class="btn btn-outline-primary" ng-click="addNewMatchPattern()">
+							<i class="fa fa-plus"></i>&nbsp;新增匹配规则
+						</button>
 					</div>
 				</form>
-			</div>
 			<div class="separator"></div>
 			<div clss="row" style="margin-top: 20px;">
 				<button class="btn btn-outline-danger" style="float:right; height: 30px;font-size: 12px;margin-left: 10px;" ng-click="closeThisDialog()">取消</button>

sentinel-dashboard/src/main/webapp/resources/app/views/dialog/system-rule-dialog.html

@@ -10,26 +10,26 @@
             <div class="col-sm-9">
               <div class="form-control" ng-if="systemRuleDialog.type == 'edit'" align="center">
                 <!--highestSystemLoad -->
-                <input type="radio" name="grade" value="0" ng-model='currentRule.grade' ng-disabled="systemRuleDialog.type == 'edit'" />&nbsp;系统LOAD&nbsp;&nbsp;
+                <input type="radio" name="grade" value="0" checked ng-model='currentRule.grade' ng-disabled="systemRuleDialog.type == 'edit'" />&nbsp;LOAD&nbsp;&nbsp;
                 <!--avgRt -->
                 <input type="radio" name="grade" value="1" ng-model='currentRule.grade' ng-disabled="systemRuleDialog.type == 'edit'" />&nbsp;RT&nbsp;&nbsp;
                 <!--maxThread -->
                 <input type="radio" name="grade" value="2" ng-model='currentRule.grade' ng-disabled="systemRuleDialog.type == 'edit'" />&nbsp;线程数&nbsp;&nbsp;
                 <!--qps -->
-                <input type="radio" name="grade" value="3" ng-model='currentRule.grade' ng-disabled="systemRuleDialog.type == 'edit'"/>&nbsp;入口 QPS
+                <input type="radio" name="grade" value="3" ng-model='currentRule.grade' ng-disabled="systemRuleDialog.type == 'edit'"/>&nbsp;入口 QPS&nbsp;&nbsp;
                 <!--highestCpuUsage -->
-                <input type="radio" name="grade" value="4" checked ng-model='currentRule.grade' ng-disabled="systemRuleDialog.type == 'edit'" />&nbsp;CPU 使用率&nbsp;&nbsp;
+                <input type="radio" name="grade" value="4" ng-model='currentRule.grade' ng-disabled="systemRuleDialog.type == 'edit'" />&nbsp;CPU 使用率&nbsp;&nbsp;
 
               </div>
               <div class="form-control highlight-border" ng-if="systemRuleDialog.type == 'add'" align="center">
                 <!--highestSystemLoad -->
-                <input type="radio" name="grade" value="0" ng-model='currentRule.grade' ng-disabled="systemRuleDialog.type == 'edit'" />&nbsp;系统LOAD&nbsp;&nbsp;
+                <input type="radio" name="grade" value="0" ng-model='currentRule.grade' ng-disabled="systemRuleDialog.type == 'edit'" />&nbsp;LOAD&nbsp;&nbsp;
                 <!--avgRt -->
                 <input type="radio" name="grade" value="1" ng-model='currentRule.grade' ng-disabled="systemRuleDialog.type == 'edit'" />&nbsp;RT&nbsp;&nbsp;
                 <!--maxThread -->
                 <input type="radio" name="grade" value="2" ng-model='currentRule.grade' ng-disabled="systemRuleDialog.type == 'edit'" />&nbsp;线程数&nbsp;&nbsp;
                 <!--qps -->
-                <input type="radio" name="grade" value="3" ng-model='currentRule.grade' ng-disabled="systemRuleDialog.type == 'edit'"/>&nbsp;入口 QPS
+                <input type="radio" name="grade" value="3" ng-model='currentRule.grade' ng-disabled="systemRuleDialog.type == 'edit'"/>&nbsp;入口 QPS&nbsp;&nbsp;
                 <!--highestCpuUsage -->
                 <input type="radio" name="grade" value="4" checked ng-model='currentRule.grade' ng-disabled="systemRuleDialog.type == 'edit'" />&nbsp;CPU 使用率&nbsp;&nbsp;
 
@@ -39,11 +39,11 @@
           <div class="form-group">
             <label class="col-sm-2 control-label">阈值</label>
             <div class="col-sm-9">
-              <input type='number' class="form-control highlight-border" ng-model='currentRule.highestSystemLoad' placeholder="[0, ~)的正整数" ng-if="currentRule.grade == 0"/>
-              <input type='number' class="form-control highlight-border" ng-model='currentRule.avgRt' placeholder="[0, ~)的正整数" ng-if="currentRule.grade == 1"/>
-              <input type='number' class="form-control highlight-border" ng-model='currentRule.maxThread' placeholder="[0, ~)的正整数" ng-if="currentRule.grade == 2"/>
-              <input type='number' class="form-control highlight-border" ng-model='currentRule.qps' placeholder="[0, ~)的正整数" ng-if="currentRule.grade == 3"/>
-              <input type='number' class="form-control highlight-border" ng-model='currentRule.highestCpuUsage' placeholder="[0, 1)的小数" ng-if="currentRule.grade == 4"/>
+              <input type='number' min="0" class="form-control highlight-border" ng-model='currentRule.highestSystemLoad' placeholder="[0, ~)的正整数" ng-if="currentRule.grade == 0"/>
+              <input type='number' min="0" class="form-control highlight-border" ng-model='currentRule.avgRt' placeholder="[0, ~)的正整数" ng-if="currentRule.grade == 1"/>
+              <input type='number' min="0" class="form-control highlight-border" ng-model='currentRule.maxThread' placeholder="[0, ~)的正整数" ng-if="currentRule.grade == 2"/>
+              <input type='number' min="0" class="form-control highlight-border" ng-model='currentRule.qps' placeholder="[0, ~)的正整数" ng-if="currentRule.grade == 3"/>
+              <input type='number' min="0" class="form-control highlight-border" ng-model='currentRule.highestCpuUsage' placeholder="[0, 1]的小数，代表百分比" ng-if="currentRule.grade == 4"/>
             </div>
           </div>
         </form>

sentinel-dashboard/src/main/webapp/resources/app/views/system.html

@@ -45,11 +45,11 @@
               <tr dir-paginate="rule in rules | filter : searchKey | itemsPerPage: rulesPageConfig.pageSize " current-page="rulesPageConfig.currentPageIndex"
                 pagination-id="entriesPagination">
                 <td style="word-wrap:break-word;word-break:break-all;">
-                  <span ng-if="rule.highestSystemLoad >= 0">系统LOAD</span>
-                  <span ng-if="rule.avgRt >= 0">RT</span>
-                  <span ng-if="rule.maxThread >= 0">线程数</span>
-                  <span ng-if="rule.qps >= 0">QPS</span>
-                  <span ng-if="rule.highestCpuUsage >= 0">CPU使用率</span>
+                  <span ng-if="rule.highestSystemLoad >= 0">系统 load</span>
+                  <span ng-if="rule.avgRt >= 0">平均 RT</span>
+                  <span ng-if="rule.maxThread >= 0">并发数</span>
+                  <span ng-if="rule.qps >= 0">入口 QPS</span>
+                  <span ng-if="rule.highestCpuUsage >= 0">CPU 使用率</span>
                 </td>
                 <td style="word-wrap:break-word;word-break:break-all;">
                   <span ng-if="rule.highestSystemLoad >= 0">{{rule.highestSystemLoad}}</span>