jiulinxiri/rocketmq-dashboard
1
0
Fork 0
mirror of https://github.com/apache/rocketmq-dashboard.git synced 2025-09-10 11:40:01 +08:00
Code Issues Packages Projects Releases Wiki Activity

Support FIFO-Type SubGroup Add、Update and Query For V5 (#204)

Browse Source 
* Support dashboard v4-v5 switch And query for v5 topic

* Modify tag name

* Support subGroup FIFO Type Query and Update

---------

Co-authored-by: yuanziwei <yuanziwei@xiaomi.com>
This commit is contained in:
Akai
2024-06-11 10:53:36 +08:00
committed by GitHub
parent 21dc2acfdc
commit e7cb315050
5 changed files with 159 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/main/java/org/apache/rocketmq/dashboard/model/GroupConsumeInfo.java
View File

@@ -27,6 +27,8 @@ public class GroupConsumeInfo implements Comparable<GroupConsumeInfo> {
private MessageModel messageModel;
private int consumeTps;
private long diffTotal = -1;
private String subGroupType = "NORMAL";
public String getGroup() {
return group;
@@ -91,4 +93,12 @@ public class GroupConsumeInfo implements Comparable<GroupConsumeInfo> {
public void setVersion(String version) {
this.version = version;
}
public String getSubGroupType() {
return subGroupType;
}
public void setSubGroupType(String subGroupType) {
this.subGroupType = subGroupType;
}
}

11
src/main/java/org/apache/rocketmq/dashboard/service/impl/ConsumerServiceImpl.java
View File

@@ -177,6 +177,10 @@ public class ConsumerServiceImpl extends AbstractCommonService implements Consum
}
ConsumerConnection consumerConnection = null;
boolean isFifoType = examineSubscriptionGroupConfig(consumerGroup)
.stream().map(ConsumerConfigInfo::getSubscriptionGroupConfig)
.allMatch(SubscriptionGroupConfig::isConsumeMessageOrderly);
try {
consumerConnection = mqAdminExt.examineConsumerConnectionInfo(consumerGroup);
}
@@ -185,6 +189,13 @@ public class ConsumerServiceImpl extends AbstractCommonService implements Consum
}
groupConsumeInfo.setGroup(consumerGroup);
if (SYSTEM_GROUP_SET.contains(consumerGroup)) {
groupConsumeInfo.setSubGroupType("SYSTEM");
} else if (isFifoType) {
groupConsumeInfo.setSubGroupType("FIFO");
} else {
groupConsumeInfo.setSubGroupType("NORMAL");
}
if (consumeStats != null) {
groupConsumeInfo.setConsumeTps((int)consumeStats.getConsumeTps());

29
src/main/resources/static/src/consumer.js
View File

@@ -45,6 +45,7 @@ module.controller('consumerController', ['$scope', 'ngDialog', '$http', 'Notific
$scope.writeOperationEnabled = $scope.userRole == null ? true : ($scope.userRole == 1 ? true : false);
$scope.filterNormal = true;
$scope.filterSystem = false;
$scope.filterFIFO = false;
$scope.doSort = function () {// todo how to change this fe's code ? (it's dirty)
if ($scope.sortKey == 'diffTotal') {
@@ -75,7 +76,10 @@ module.controller('consumerController', ['$scope', 'ngDialog', '$http', 'Notific
$http({
method: "GET",
url: "consumer/groupList.query"
url: "consumer/groupList.query",
params: {
skipSysGroup: false,
}
}).success(function (resp) {
if (resp.status == 0) {
$scope.allConsumerGrouopList = resp.data;
@@ -135,16 +139,28 @@ module.controller('consumerController', ['$scope', 'ngDialog', '$http', 'Notific
$scope.filterList(1);
});
$scope.filterByType = function (str) {
$scope.$watch('filterFIFO', function () {
$scope.filterList(1);
});
$scope.filterByType = function (str, type,version) {
if ($scope.filterSystem) {
if (str.startsWith("%S")) {
if (type === "SYSTEM") {
return true
}
}
if ($scope.filterNormal) {
if (str.startsWith("%") == false) {
if (type === "NORMAL") {
return true
}
if(!version && type === "FIFO"){
return true;
}
}
if ($scope.filterFIFO) {
if (type === "FIFO") {
return true;
}
}
return false;
};
@@ -154,7 +170,7 @@ module.controller('consumerController', ['$scope', 'ngDialog', '$http', 'Notific
var canShowList = [];
$scope.allConsumerGrouopList.forEach(function (element) {
console.log(element)
if ($scope.filterByType(element.group)) {
if ($scope.filterByType(element.group, element.subGroupType, $scope.rmqVersion)) {
if (element.group.toLowerCase().indexOf(lowExceptStr) != -1) {
canShowList.push(element);
}
@@ -189,6 +205,7 @@ module.controller('consumerController', ['$scope', 'ngDialog', '$http', 'Notific
subscriptionGroupConfig: {
groupName: "",
consumeEnable: true,
consumeMessageOrderly: false,
consumeFromMinEnable: true,
consumeBroadcastEnable: true,
retryQueueNums: 1,
@@ -211,7 +228,7 @@ module.controller('consumerController', ['$scope', 'ngDialog', '$http', 'Notific
// Refresh topic list
$scope.refreshConsumerData();
},
template: 'consumerModifyDialog',
template: $scope.rmqVersion ? 'consumerModifyDialogForV5' : 'consumerModifyDialog',
controller: 'consumerModifyDialogController',
data: {
consumerRequestList: request,

5
src/main/resources/static/src/controller.js
View File

@@ -15,7 +15,7 @@
* limitations under the License.
*/
app.controller('AppCtrl', ['$scope','$window','$translate','$http','Notification', function ($scope,$window,$translate, $http, Notification) {
$scope.rmqVersion = localStorage.getItem("isV5") === "true" ? true : false;
$scope.rmqVersion = localStorage.getItem("isV5");
$scope.changeTranslate = function(langKey){
$translate.use(langKey);
@@ -23,7 +23,8 @@ app.controller('AppCtrl', ['$scope','$window','$translate','$http','Notification
$scope.changeRMQVersion = function (version) {
$scope.rmqVersion = version === 5;
localStorage.setItem("isV5", $scope.rmqVersion);
var v = version === 5;
localStorage.setItem("isV5", v);
}
$scope.logout = function(){

112
src/main/resources/static/view/pages/consumer.html
View File

@@ -26,6 +26,8 @@
</div>
<md-checkbox aria-label="Checkbox" ng-model="filterNormal" class="md-primary">{{'NORMAL' | translate}}
</md-checkbox>
<md-checkbox aria-label="Checkbox" ng-show="rmqVersion" ng-model="filterFIFO" class="md-primary">{{'FIFO' | translate}}
</md-checkbox>
<md-checkbox aria-label="Checkbox" ng-model="filterSystem" class="md-primary">{{'SYSTEM' | translate}}
</md-checkbox>
<button class="btn btn-raised btn-sm btn-primary" type="button" ng-show="{{writeOperationEnabled}}"
@@ -320,6 +322,116 @@
</div>
</script>
<script type="text/ng-template" id="consumerModifyDialogForV5">
<div>
<div>
<div class="modal-header">
<h4 class="modal-title">{{'SUBSCRIPTION_CHANGE'|translate}}</h4>
</div>
<div class="modal-body " ng-repeat="item in ngDialogData.consumerRequestList">
<form id="addAppForm1" name="addAppForm" class="form-horizontal" novalidate>
<div class="form-group" ng-hide="ngDialogData.bIsUpdate">
<label class="control-label col-sm-3">clusterName:</label>
<div class="col-sm-9">
<select name="mySelectClusterNameList" multiple chosen
ng-model="item.clusterNameList"
ng-options="clusterNameItem for clusterNameItem in ngDialogData.allClusterNameList">
<option value=""></option>
</select>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">brokerName:</label>
<div class="col-sm-9">
<select name="mySelectBrokerNameList" multiple chosen
ng-disabled="ngDialogData.bIsUpdate"
ng-model="item.brokerNameList"
ng-options="brokerNameItem for brokerNameItem in ngDialogData.allBrokerNameList">
<option value=""></option>
</select>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">groupName:</label>
<div class="col-sm-9">
<input class="form-control" ng-model="item.subscriptionGroupConfig.groupName" type="text"
ng-disabled="ngDialogData.bIsUpdate" required/>
<span class="text-danger" ng-show="addAppForm.name.$error.required">编号不能为空.</span>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">consumeEnable:</label>
<div class="col-sm-9">
<md-switch class="md-primary" ng-disabled="{{!ngDialogData.writeOperationEnabled}}" md-no-ink
aria-label="Switch No Ink" ng-model="item.subscriptionGroupConfig.consumeEnable">
</md-switch>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">consumeOrderlyEnable:</label>
<div class="col-sm-9">
<md-switch class="md-primary custom-md-switch" eng-disabled="{{!ngDialogData.writeOperationEnabled}}" md-no-ink
aria-label="Switch No Ink" ng-model="item.subscriptionGroupConfig.consumeMessageOrderly">
</md-switch>
<span style="font-size: 12px;">[Pay Attention: FIFO ConsumerGroup Need Open 'consumeOrderlyEnable' Option]</span>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">consumeBroadcastEnable:</label>
<div class="col-sm-9">
<md-switch class="md-primary" ng-disabled="{{!ngDialogData.writeOperationEnabled}}" md-no-ink
aria-label="Switch No Ink"
ng-model="item.subscriptionGroupConfig.consumeBroadcastEnable">
</md-switch>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">retryQueueNums:</label>
<div class="col-sm-9">
<input class="form-control" ng-model="item.subscriptionGroupConfig.retryQueueNums"
type="text" ng-disabled="{{!ngDialogData.writeOperationEnabled}}"
required/>
<span class="text-danger" ng-show="addAppForm.name.$error.required">编号不能为空.</span>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">brokerId:</label>
<div class="col-sm-9">
<input class="form-control" ng-model="item.subscriptionGroupConfig.brokerId" type="text"
ng-disabled="{{!ngDialogData.writeOperationEnabled}}" required/>
<span class="text-danger" ng-show="addAppForm.name.$error.required">编号不能为空.</span>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">whichBrokerWhenConsumeSlowly:</label>
<div class="col-sm-9">
<input class="form-control"
ng-model="item.subscriptionGroupConfig.whichBrokerWhenConsumeSlowly" type="text"
ng-disabled="{{!ngDialogData.writeOperationEnabled}}" required/>
<span class="text-danger" ng-show="addAppForm.name.$error.required">编号不能为空.</span>
</div>
</div>
</form>
<div class="modal-footer">
<div class="ngdialog-buttons">
<button type="button" class="ngdialog-button ngdialog-button-primary"
ng-disabled="addAppForm.$invalid"
ng-show="{{ngDialogData.writeOperationEnabled}}"
ng-click="postConsumerRequest(item)">{{ 'COMMIT' | translate }}
</button>
<button type="button" class="ngdialog-button ngdialog-button-secondary"
ng-click="closeThisDialog('Cancel')">{{ 'CLOSE' | translate }}
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</script>
<!--consumer monitor config-->
<script type="text/ng-template" id="consumerMonitorDialog">
<div class="modal-header">