crabapples
/
Sentinel
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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

Signed-off-by: Eric Zhao <sczyh16@gmail.com>
This commit is contained in:
Eric Zhao 2019-07-23 23:16:51 +08:00
parent 5e85965754
commit e50be35a9d
8 changed files with 101 additions and 156 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -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,43 +100,16 @@ 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);
@ -132,8 +117,8 @@ public class SystemController {
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());
@ -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");

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

@ -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;

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

@ -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) {
@ -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,38 +160,37 @@ 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);
alert('失败：' + data.msg);
} else {
alert('失败!');
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);
alert('失败：' + data.msg);
} else {
alert('失败!');
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();
@ -200,9 +198,9 @@ app.controller('SystemCtl', ['$scope', '$stateParams', 'SystemService', 'ngDialo
confirmDialog.close();
}
} else if (data.msg != null) {
alert(data.msg);
alert('失败：' + data.msg);
} else {
alert('失败!');
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 = [];

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

@ -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>
@ -32,15 +31,12 @@
</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>新增匹配规则
<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>
</label>
</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>

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

@ -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>

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

@ -45,10 +45,10 @@
<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.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;">

5
sentinel-dashboard/src/main/webapp/resources/dist/js/app.js vendored
View File

File diff suppressed because one or more lines are too long