Skip to content

Commit

Permalink
support display metrics i18n label when threshold setting (#1225)
Browse files Browse the repository at this point in the history
  • Loading branch information
@tomsun28
tomsun28 authored Sep 5, 2023
1 parent 1a415ea commit 3aee36b
Show file tree
Hide file tree
Showing 6 changed files with 65 additions and 54 deletions.
31 changes: 16 additions & 15 deletions web-app/src/app/routes/alert/alert-center/alert-center.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -85,25 +85,18 @@
<thead>
<tr>
<th nzAlign="center" nzLeft nzWidth="3%" [(nzChecked)]="checkedAll" (nzCheckedChange)="onAllChecked($event)"></th>
<th nzAlign="center" nzWidth="15%">{{ 'alert.center.monitor' | i18n }}</th>
<th nzAlign="center" nzWidth="15%">{{ 'alert.center.target' | i18n }}</th>
<th nzAlign="center" nzWidth="17%">{{ 'alert.center.target' | i18n }}</th>
<th nzAlign="center" nzWidth="9%">{{ 'alert.center.priority' | i18n }}</th>
<th nzAlign="center" nzWidth="16%">{{ 'alert.center.content' | i18n }}</th>
<th nzAlign="center" nzWidth="16%">{{ 'alert.center.tags' | i18n }}</th>
<th nzAlign="center" nzWidth="8%">{{ 'alert.center.status' | i18n }}</th>
<th nzAlign="center" nzWidth="20%">{{ 'alert.center.content' | i18n }}</th>
<th nzAlign="center" nzWidth="17%">{{ 'alert.center.tags' | i18n }}</th>
<th nzAlign="center" nzWidth="9%">{{ 'alert.center.status' | i18n }}</th>
<th nzAlign="center" nzWidth="12%">{{ 'alert.center.time' | i18n }}</th>
<th nzAlign="center" nzWidth="12%">{{ 'common.edit' | i18n }}</th>
<th nzAlign="center" nzWidth="13%">{{ 'common.edit' | i18n }}</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of fixedTable.data">
<td nzAlign="center" nzLeft [nzChecked]="checkedAlertIds.has(data.id)" (nzCheckedChange)="onItemChecked(data.id, $event)"></td>
<td nzAlign="left">
<button nz-button nzSize="default" nzType="link" [routerLink]="['/monitors/' + data.tags.monitorId]">
{{ data.tags.monitorName }}
<span nz-icon nzType="area-chart"></span>
</button>
</td>
<td nzAlign="center">{{ renderAlertTarget(data.target) }}</td>
<td nzAlign="center">
<nz-tag *ngIf="data.priority == 0" nzColor="red">
Expand All @@ -121,9 +114,17 @@
</td>
<td nzAlign="left">{{ data.content }}</td>
<td nzAlign="left">
<nz-tag style="margin-top: 2px" *ngFor="let tag of data?.tmp; let i = index">
{{ sliceTagName(tag) }}
</nz-tag>
<span *ngFor="let tag of data?.tmp; let i = index">
<a [routerLink]="['/monitors/' + tag.value]" *ngIf="tag.name == 'monitorId'">
<nz-tag class="hoverClass" nzColor="magenta" style="margin-top: 2px">
<span nz-icon nzType="area-chart"></span>
{{ sliceTagName(tag) }}
</nz-tag>
</a>
<nz-tag *ngIf="tag.name != 'monitorId'" style="margin-top: 2px">
{{ sliceTagName(tag) }}
</nz-tag>
</span>
</td>
<td nzAlign="center">
<nz-tag [nzColor]="data.status == 3 ? '' : 'orange'">
Expand Down
27 changes: 16 additions & 11 deletions web-app/src/app/routes/alert/alert-setting/alert-setting.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -163,7 +163,14 @@
<nz-list nzSize="small" nzSplit="false">
<nz-list-item *ngFor="let item of currentMetrics; let i = index">
<code>
{{ item.value }} : {{ i == 0 ? ('alert.setting.target.tip' | i18n) : ('alert.setting.target.other' | i18n) }}
{{ item.value }} :
{{
item.value == item.label
? i == 0
? ('alert.setting.target.tip' | i18n)
: ('alert.setting.target.other' | i18n)
: item.label
}}
</code>
<nz-tag [nzColor]="item.type === 0 ? 'success' : 'processing'">
{{ item.type === 0 ? ('alert.setting.number' | i18n) : ('alert.setting.string' | i18n) }}
Expand All @@ -172,12 +179,6 @@
<nz-list-item *ngIf="currentMetrics.length > 1">
<code>instance : {{ 'alert.setting.target.instance' | i18n }}</code>
</nz-list-item>
<nz-list-item>
<code>system_value_row_count : {{ 'alert.setting.target.system_value_row_count' | i18n }}</code>
<nz-tag [nzColor]="'success'">
{{ 'alert.setting.number' | i18n }}
</nz-tag>
</nz-list-item>
<nz-list-item>
<code>
{{ 'alert.setting.operator' | i18n }} : equals(str1,str2), contains(str1,str2), exists(keyName), matches(str,regex), ==,
Expand Down Expand Up @@ -377,11 +378,15 @@
<nz-list-item *ngIf="cascadeValues.length == 3">
<code>&#36;&#123;metric&#125; : {{ 'alert.setting.template.metric-name' | i18n }}</code>
</nz-list-item>
<nz-list-item *ngIf="cascadeValues.length == 3">
<code>&#36;{{ '{' + cascadeValues[2] + '}' }} : {{ 'alert.setting.template.metric-value' | i18n }}</code>
</nz-list-item>
<nz-list-item *ngFor="let item of filterMetrics(currentMetrics, cascadeValues)">
<code>&#36;{{ '{' + item.value + '}' }} : {{ 'alert.setting.template.other-value' | i18n }}</code>
<code
>&#36;{{ '{' + item.value + '}' }} :
{{
item.value == item.label
? ('alert.setting.template.other-value' | i18n)
: ('alert.setting.template.metric-value' | i18n) + '-' + item.label
}}</code
>
</nz-list-item>
<nz-list-item *ngIf="cascadeValues.length == 3">
<code>&#36;&#123;instance&#125; : {{ 'alert.setting.template.instance-value' | i18n }}</code>
Expand Down
11 changes: 8 additions & 3 deletions web-app/src/app/routes/alert/alert-setting/alert-setting.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -654,12 +654,17 @@ export class AlertSettingComponent implements OnInit {
});
}
filterMetrics(currentMetrics: any[], cascadeValues: any): any[] {
// 检查是否需要过滤
if (cascadeValues.length !== 3) {
return currentMetrics;
}
// 过滤与cascadeValues[2]不相等的元素
return currentMetrics.filter(item => item.value !== cascadeValues[2]);
// sort the cascadeValues[2] to first
return currentMetrics.sort((a, b) => {
if (a.value !== cascadeValues[2]) {
return 1;
} else {
return -1;
}
});
}
// end 告警定义与监控关联model
}
18 changes: 9 additions & 9 deletions web-app/src/assets/i18n/en-US.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -141,7 +141,7 @@
"alert.setting.template.monitor-type": "Monitor Type Name",
"alert.setting.template.metrics-name": "Metrics Name",
"alert.setting.template.metric-name": "Metric Name",
"alert.setting.template.metric-value": "Metric Target Value",
"alert.setting.template.metric-value": "Metric Value",
"alert.setting.template.other-value": "Other Metric Value",
"alert.setting.template.instance-value": "Instance Value",
"alert.setting.default": "Global Default",
Expand Down Expand Up @@ -212,15 +212,15 @@
"alert.center.confirm.mark-done": "Please confirm whether to mark processed!",
"alert.center.confirm.mark-no-batch": "Please confirm whether to mark Pending in batch!",
"alert.center.confirm.mark-no": "Please confirm whether to mark Pending!",
"alert.help.notice": "This part specified the receiver of alarm information and receiving method. The alarm information will be sent to the receiver by specified way(currently support email, Webhook, etc.). <a href='https://hertzbeat.com/zh-cn/docs/help/alert_webhook'>Click here to look over configuration steps.</a> <br><span class='help_module_span'>⚠\uFE0FNote：After configuring the “<i>New Recivier</i>”, you also need to congigure the“<i>New Notice Policy</i>”to specify which massages are sent to which receivers.</span><a href='https://hertzbeat.com/zh-cn/docs/help/alert_email#%E9%82%AE%E4%BB%B6%E9%80%9A%E7%9F%A5%E5%B8%B8%E8%A7%81%E9%97%AE%E9%A2%98'> Click here to look over potential issues you may encounter</a>",
"alert.help.notice": "Notification is used to specify the receiver of alarm message and receiving method. The alarm message will be sent to the receiver by specified way(currently support email, Webhook, etc.). <a href='https://hertzbeat.com/zh-cn/docs/help/alert_webhook'>Click here to look over configuration steps.</a> <br><span class='help_module_span'>⚠\uFE0FNote：After configuring the “<i>New Recivier</i>”, you also need to congigure the“<i>New Notice Policy</i>”to specify which massages are sent to which receivers.</span><a href='https://hertzbeat.com/zh-cn/docs/help/alert_email#%E9%82%AE%E4%BB%B6%E9%80%9A%E7%9F%A5%E5%B8%B8%E8%A7%81%E9%97%AE%E9%A2%98'> Click here to look over potential issues you may encounter</a>",
"alert.help.notice.link":"https://hertzbeat.com/docs/help/alert_threshold",
"alert.help.converge": "Click \"<i>New Converge Strategy</i>\" and configure the time period to avoiding a large number of repetitive alarms that may numb the receiver's alarm.",
"alert.help.converge": "Alarm Converge supports deduplication and convergence of repeated alarm messages within a specified time period. <br> Click \"<i>New Converge Strategy</i>\" and configure the time period to avoiding a large number of repetitive alarms that may numb the receiver's alarm.",
"alert.help.converge.link":"https://hertzbeat.com",
"alert.help.center": "In this part, you can check the alarm messages which triggered by the your alarm threshold. Hertzbeat support batch operations such as alarm processing, unprocessed alarm markers, and alarm deletion and clearing.",
"alert.help.center": "Alarm Center displays an overview of triggered alarms and supports external channel alarms. <br> Hertzbeat support batch operations such as alarm processing, unprocessed alarm markers, and alarm deletion and clearing.",
"alert.help.center.link":"https://hertzbeat.com/docs/help/guide",
"alert.help.setting": "Click the \"<i>New Threshold</i>\" to configure the alarm threshold for monitoring indicators. Hertzbeat will trigger alarms based on the configuration and collection of indicator data.<br> ⚠\uFE0FNote: The alarm information that has been successfully triggered can be checked in [Alter Center], and you can also set the notification method and personnel in [Notification].",
"alert.help.setting": "Threshold Rules are used for metrics alarm threshold rule management. Click the \"<i>New Threshold</i>\" to configure the alarm threshold for monitoring metrics. Hertzbeat will trigger alarms based on the configuration and collection of metrics data.<br> ⚠\uFE0FNote: The alarm information that has been successfully triggered can be checked in [Alter Center], and you can also set the notification method and personnel in [Notification].",
"alert.help.setting.link":"https://hertzbeat.com/docs/help/alert_threshold",
"alert.help.silence": "Click \"<i>New Silence Strategy</i>\" and configure the time period to block messages so you would not get disturbed during weekends and breaks.",
"alert.help.silence": "Alarm Silence management is used when you don’t want to be disturbed during system maintenance or on weekend nights. <br> Click \"<i>New Silence Strategy</i>\" and configure the time period to block messages so you would not get disturbed during weekends and breaks.",
"alert.help.silence.link":"https://hertzbeat.com/docs",
"alert.notice.receiver": "Message Receiver",
"alert.notice.receiver.new": "New Receiver",
Expand Down Expand Up @@ -376,7 +376,7 @@
"monitor_icon.alert_notice": "notification",
"monitor_icon.setting_tags": "tags",
"monitor_icon.setting_modules": "code",
"monitors.center.help": "This page displays the currently added monitors in the form of list, and we supports tag grouping, query filtering, and access to view monitoring details. You can add, modify, delete, cancel monitoring, import/export, batch management, and other operations on the monitors.",
"monitors.center.help": "Monitoring Center is the monitoring resource management portal of HertzBeat. Displays the currently added monitors in the form of list, and supports tag grouping, query filtering, and access to view monitoring details. <br> You can add, modify, delete, cancel monitoring, import/export, batch management, and other operations on the monitors.",
"monitors.center.help.link": "https://hertzbeat.com/docs/",
"monitors.list": "Monitor List",
"monitors.spinning-tip.detecting": "Available Detecting",
Expand Down Expand Up @@ -577,6 +577,6 @@
"validation.date.required": "Please select the start and end date",
"validation.goal.required": "Please enter a description of the goal",
"validation.standard.required": "Please enter a metric",
"expand": "expand",
"collapse": "collapse"
"expand": "Expand",
"collapse": "Collapse"
}
Loading

0 comments on commit 3aee36b

Please sign in to comment.