[ISSUE #30]Added DLQ message management (#31)

* [ISSUE #30]Added DLQ message management

* remove the specific namesrvAddr in application.properties.

Co-authored-by: zhangjidi <zhangjidi@cmss.chinamobile.com>
This commit is contained in:
zhangjidi2016
2021-10-31 11:29:55 +08:00
committed by GitHub
parent d5fed12773
commit 4b2b61e394
16 changed files with 936 additions and 20 deletions

View File

@@ -34,6 +34,7 @@
<li ng-class="path =='consumer' ? 'active':''"><a ng-href="#/consumer">{{'CONSUMER' | translate}}</a></li>
<li ng-class="path =='producer' ? 'active':''"><a ng-href="#/producer">{{'PRODUCER' | translate}}</a></li>
<li ng-class="path =='message' ? 'active':''"><a ng-href="#/message">{{'MESSAGE' | translate}}</a></li>
<li ng-class="path =='dlqMessage' ? 'active':''"><a ng-href="#/dlqMessage">{{'DLQ_MESSAGE' | translate}}</a></li>
<li ng-class="path =='messageTrace' ? 'active':''"><a ng-href="#/messageTrace">{{'MESSAGETRACE' | translate}}</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">

View File

@@ -209,8 +209,8 @@
<div class="modal-body " ng-repeat="item in ngDialogData.consumerRequestList">
<form id="addAppForm" name="addAppForm" class="form-horizontal" novalidate>
<div class="form-group" ng-hide="ngDialogData.bIsUpdate">
<label class="control-label col-sm-4">clusterName:</label>
<div class="col-sm-8">
<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">
@@ -219,8 +219,8 @@
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-4">brokerName:</label>
<div class="col-sm-8">
<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"
@@ -230,16 +230,16 @@
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-4">groupName:</label>
<div class="col-sm-8">
<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-4">consumeEnable:</label>
<div class="col-sm-8">
<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>
@@ -257,8 +257,8 @@
<!--</div>-->
<!--</div>-->
<div class="form-group">
<label class="control-label col-sm-4">consumeBroadcastEnable:</label>
<div class="col-sm-8">
<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">
@@ -266,8 +266,8 @@
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-4">retryQueueNums:</label>
<div class="col-sm-8">
<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/>
@@ -284,16 +284,16 @@
<!--</div>-->
<!--</div>-->
<div class="form-group">
<label class="control-label col-sm-2">brokerId:</label>
<div class="col-sm-8">
<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-2">whichBrokerWhenConsumeSlowly:</label>
<div class="col-sm-8">
<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/>

View File

@@ -0,0 +1,266 @@
<!--
~ Licensed to the Apache Software Foundation (ASF) under one or more
~ contributor license agreements. See the NOTICE file distributed with
~ this work for additional information regarding copyright ownership.
~ The ASF licenses this file to You under the Apache License, Version 2.0
~ (the "License"); you may not use this file except in compliance with
~ the License. You may obtain a copy of the License at
~
~ http://www.apache.org/licenses/LICENSE-2.0
~
~ Unless required by applicable law or agreed to in writing, software
~ distributed under the License is distributed on an "AS IS" BASIS,
~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
<div class="container-fluid" id="deployHistoryList">
<div class="modal-body">
<div ng-cloak="" class="tabsdemoDynamicHeight">
<md-content>
<md-tabs md-dynamic-height="" md-border-bottom="">
<md-tab label="Consumer">
<h5 class="md-display-5">Total {{paginationConf.totalItems}} Messages</h5>
<md-content class="md-padding" style="min-height:600px">
<div class="row">
<form class="form-inline pull-left">
<div class="form-group">
<label>{{'CONSUMER' | translate}}:</label>
</div>
<div class="form-group ">
<div style="width: 300px">
<select name="mySelectGroup" chosen
ng-model="selectedConsumerGroup"
ng-options="item for item in allConsumerGroupList"
ng-change="onChangeQueryCondition()"
required>
<option value=""></option>
</select>
</div>
</div>
<div class="form-group ">
<label>{{'BEGIN' | translate}}:</label>
<div class="input-group">
<input class="form-control" datetimepicker
ng-change="onChangeQueryCondition()" ng-model="timepickerBegin"
options="timepickerOptions"/>
<span class="input-group-addon"><span
class="glyphicon glyphicon-calendar"></span></span>
</div>
</div>
<div class="form-group">
<label>{{'END' | translate}}:</label>
<div class="input-group">
<input class="form-control" datetimepicker
ng-change="onChangeQueryCondition()" ng-model="timepickerEnd"
options="timepickerOptions"/>
<span class="input-group-addon"><span
class="glyphicon glyphicon-calendar"></span></span>
</div>
</div>
<button id="searchAppsButton" type="button"
class="btn btn-raised btn-sm btn-primary"
data-toggle="modal"
ng-click="queryDlqMessageByConsumerGroup()">
<span class="glyphicon glyphicon-search"></span> {{ 'SEARCH' | translate}}
</button>
</form>
<table class="table table-bordered text-middle">
<tr>
<th class="text-center">Message ID</th>
<th class="text-center">Tag</th>
<th class="text-center">Key</th>
<th class="text-center">StoreTime</th>
<th class="text-center">Operation</th>
</tr>
<tr style="display: none" id="noMsgTip">
<td colspan="6" style="text-align: center">{{'NO_MATCH_RESULT' | translate}}</td>
</tr>
<tr ng-repeat="item in messageShowList">
<td class="text-center">{{item.msgId}}</td>
<td class="text-center">{{item.properties.TAGS}}</td>
<td class="text-center">{{item.properties.KEYS}}</td>
<td class="text-center">{{item.storeTimestamp | date:'yyyy-MM-dd HH:mm:ss'}}
</td>
<td class="text-center">
<button class="btn btn-raised btn-sm btn-primary" type="button"
ng-click="queryDlqMessageDetail(item.msgId, selectedConsumerGroup)">
{{'MESSAGE_DETAIL' | translate}}
</button>
<button class="btn btn-raised btn-sm btn-primary" type="button"
ng-click="resendDlqMessage(item, selectedConsumerGroup)">
{{'RESEND_MESSAGE' | translate}}
</button>
<button class="btn btn-raised btn-sm btn-primary" type="button"
ng-click="exportDlqMessage(item.msgId, selectedConsumerGroup)">
{{'EXPORT' | translate}}
</button>
</td>
</tr>
</table>
<tm-pagination conf="paginationConf"></tm-pagination>
</div>
</md-content>
</md-tab>
<md-tab label="Message ID">
<h5 class="md-display-5">topic can't be empty if you producer client version>=v3.5.8</h5>
<md-content class="md-padding" style="min-height:600px">
<div class="row">
<form class="form-inline pull-left">
<div class="form-group">
<label>{{'CONSUMER' | translate}}:</label>
</div>
<div class="form-group ">
<div style="width: 300px">
<select name="mySelectGroup" chosen
ng-model="selectedConsumerGroup"
ng-options="item for item in allConsumerGroupList"
ng-change="onChangeQueryCondition()"
required>
<option value=""></option>
</select>
</div>
</div>
<div class="form-group">
<label>MessageId:</label>
<input class="form-control" style="width: 450px" type="text" ng-model="messageId"
required/>
</div>
<button type="button" class="btn btn-raised btn-sm btn-primary" data-toggle="modal"
ng-click="queryDlqMessageByMessageId(messageId, selectedConsumerGroup)">
<span class="glyphicon glyphicon-search"></span> {{ 'SEARCH' | translate}}
</button>
</form>
<table class="table table-bordered text-middle">
<tr>
<th class="text-center">Message ID</th>
<th class="text-center">Tag</th>
<th class="text-center">Key</th>
<th class="text-center">StoreTime</th>
<th class="text-center">Operation</th>
</tr>
<tr ng-repeat="item in queryDlqMessageByMessageIdResult">
<td class="text-center">{{item.msgId}}</td>
<td class="text-center">{{item.properties.TAGS}}</td>
<td class="text-center">{{item.properties.KEYS}}</td>
<td class="text-center">{{item.storeTimestamp | date:'yyyy-MM-dd HH:mm:ss'}}
</td>
<td class="text-center">
<button class="btn btn-raised btn-sm btn-primary" type="button"
ng-click="queryDlqMessageDetail(item.msgId, selectedConsumerGroup)">
{{'MESSAGE_DETAIL' | translate}}
</button>
<button class="btn btn-raised btn-sm btn-primary" type="button"
ng-click="resendDlqMessage(item, selectedConsumerGroup)">
{{'RESEND_MESSAGE' | translate}}
</button>
<button class="btn btn-raised btn-sm btn-primary" type="button"
ng-click="exportDlqMessage(item.msgId, selectedConsumerGroup)">
{{'EXPORT' | translate}}
</button>
</td>
</tr>
</table>
</div>
</md-content>
</md-tab>
</md-tabs>
</md-content>
</div>
</div>
</div>
<script type="text/ng-template" id="dlqMessageDetailViewDialog">
<md-content class="md-padding">
<div>
<form id="addAppForm" name="addAppForm" class="form-horizontal" novalidate>
<div class="form-group">
<label class="control-label col-sm-2">Message ID:</label>
<div class="col-sm-10">
<label class="form-control">{{ngDialogData.messageView.msgId}}</label>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2">Topic:</label>
<div class="col-sm-10">
<label class="form-control">{{ngDialogData.messageView.topic}}</label>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2">Properties:</label>
<div class="col-sm-10">
<textarea class="form-control"
style="min-height:60px; resize: none"
readonly>{{ngDialogData.messageView.properties}}</textarea>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2">ReconsumeTimes:</label>
<div class="col-sm-10">
<label class="form-control">{{ngDialogData.messageView.reconsumeTimes}}</label>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2">Tag:</label>
<div class="col-sm-10">
<label class="form-control">{{ngDialogData.messageView.properties.TAGS}}</label>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2">Key:</label>
<div class="col-sm-10">
<label class="form-control">{{ngDialogData.messageView.properties.KEYS}}</label>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2">Storetime:</label>
<div class="col-sm-10">
<label class="form-control">{{ngDialogData.messageView.storeTimestamp | date:'yyyy-MM-dd HH:mm:ss'}}</label>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2">StoreHost:</label>
<div class="col-sm-10">
<label class="form-control">{{ngDialogData.messageView.storeHost}}</label>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2">Message body:</label>
<div class="col-sm-10">
<textarea class="form-control"
ng-model="ngDialogData.messageView.messageBody"
style="min-height:100px; resize: none"
readonly></textarea>
</div>
</div>
</form>
</div>
</md-content>
<div class="modal-footer">
<div class="ngdialog-buttons">
<button type="button" class="ngdialog-button ngdialog-button-secondary"
ng-click="closeThisDialog('Cancel')">{{ 'CLOSE' | translate }}
</button>
</div>
</div>
</script>
<script type="text/ng-template" id="operationResultDialog">
<div class="modal-header">
<h4 class="modal-title">Result</h4>
</div>
<div class="modal-body ">
<form class="form-horizontal" novalidate>
{{ngDialogData.result}}
</form>
</div>
<div class="modal-footer">
<div class="ngdialog-buttons">
<button type="button" class="ngdialog-button ngdialog-button-secondary"
ng-click="closeThisDialog('Cancel')">{{ 'CLOSE' | translate }}
</button>
</div>
</div>
</script>

View File

@@ -228,7 +228,7 @@
</form>
</div>
<p>messageTrackList:</p>
<table class="table-bordered table">
<table class="table-bordered table text-middle">
<tr>
<th class="text-center">consumerGroup</th>
<th class="text-center">trackType</th>