This is an automated email from the ASF dual-hosted git repository.
zhaoqingran pushed a commit to branch bulletin
in repository https://gitbox.apache.org/repos/asf/hertzbeat.git
The following commit(s) were added to refs/heads/bulletin by this push:
new eca4e7363 [feat(bulletin)] refactor tab and table components for
dynamic data loadingRefactor the bulletin component's tab and table structures
to support dynamic data loading. This change simplifies the HTML template by
removing hardcoded tab definitions and replacing them with a dynamic list of
tabs derived from component properties. Additionally, the table now dynamically
generates columns based on the data it receives, improving flexibility and
reducing code complexity.
eca4e7363 is described below
commit eca4e736302892d059a1c0680040590620a66960
Author: zqr10159 <[email protected]>
AuthorDate: Fri Jul 12 00:14:25 2024 +0800
[feat(bulletin)] refactor tab and table components for dynamic data
loadingRefactor the bulletin component's tab and table structures to support
dynamic data loading. This change simplifies the HTML template by
removing hardcoded tab definitions and replacing them with a dynamic
list of tabs derived from component properties. Additionally, the table
now dynamically generates columns based on the data it receives,
improving flexibility and reducing code complexity.
BREAKING CHANGE: The removal of hardcoded tab definitions and metrics
requires updates to any consumers relying on the previous structure.
---
.../org/apache/hertzbeat/common/util/JsonUtil.java | 8 +++-
.../manager/controller/BulletinController.java | 13 ------
.../manager/service/impl/BulletinServiceImpl.java | 1 -
.../app/routes/bulletin/bulletin.component.html | 13 ++++--
.../src/app/routes/bulletin/bulletin.component.ts | 53 ++++++++++++++++++----
5 files changed, 59 insertions(+), 29 deletions(-)
diff --git
a/common/src/main/java/org/apache/hertzbeat/common/util/JsonUtil.java
b/common/src/main/java/org/apache/hertzbeat/common/util/JsonUtil.java
index 7e8fbed52..b38deacce 100644
--- a/common/src/main/java/org/apache/hertzbeat/common/util/JsonUtil.java
+++ b/common/src/main/java/org/apache/hertzbeat/common/util/JsonUtil.java
@@ -100,11 +100,15 @@ public final class JsonUtil {
* @param jsonStr json string
* @return true if the string is a json string
*/
+
+
public static boolean isJsonStr(String jsonStr) {
- if (!StringUtils.hasText(jsonStr)) {
+ if (jsonStr == null || jsonStr.trim().isEmpty()) {
return false;
}
- if (!jsonStr.startsWith("{") || !jsonStr.endsWith("}")) {
+ jsonStr = jsonStr.trim();
+ if (!(jsonStr.startsWith("{") && jsonStr.endsWith("}")) &&
+ !(jsonStr.startsWith("[") && jsonStr.endsWith("]"))) {
return false;
}
try {
diff --git
a/manager/src/main/java/org/apache/hertzbeat/manager/controller/BulletinController.java
b/manager/src/main/java/org/apache/hertzbeat/manager/controller/BulletinController.java
index 16da51d01..19c35691a 100644
---
a/manager/src/main/java/org/apache/hertzbeat/manager/controller/BulletinController.java
+++
b/manager/src/main/java/org/apache/hertzbeat/manager/controller/BulletinController.java
@@ -97,18 +97,6 @@ public class BulletinController {
criteriaBuilder.like(
criteriaBuilder.lower(root.get("metric")),
"%" + search.toLowerCase() + "%"
- ),
- criteriaBuilder.like(
- criteriaBuilder.lower(root.get("field")),
- "%" + search.toLowerCase() + "%"
- ),
- criteriaBuilder.like(
- criteriaBuilder.lower(root.get("expr")),
- "%" + search.toLowerCase() + "%"
- ),
- criteriaBuilder.like(
- criteriaBuilder.lower(root.get("template")),
- "%" + search.toLowerCase() + "%"
)
);
andList.add(predicate);
@@ -120,7 +108,6 @@ public class BulletinController {
Sort sortExp = Sort.by(new
Sort.Order(Sort.Direction.fromString(order), sort));
PageRequest pageRequest = PageRequest.of(pageIndex, pageSize,
sortExp);
Page<BulletinVo> bulletinsPage =
bulletinService.getBulletins(specification, pageRequest);
-
return ResponseEntity.ok(Message.success(bulletinsPage));
}
diff --git
a/manager/src/main/java/org/apache/hertzbeat/manager/service/impl/BulletinServiceImpl.java
b/manager/src/main/java/org/apache/hertzbeat/manager/service/impl/BulletinServiceImpl.java
index cd5878fd5..2a7f885dd 100644
---
a/manager/src/main/java/org/apache/hertzbeat/manager/service/impl/BulletinServiceImpl.java
+++
b/manager/src/main/java/org/apache/hertzbeat/manager/service/impl/BulletinServiceImpl.java
@@ -116,7 +116,6 @@ public class BulletinServiceImpl implements BulletinService
{
public Page<BulletinVo> getBulletins(Specification<Bulletin>
specification, PageRequest pageRequest) {
List<BulletinVo> voList = new ArrayList<>();
Page<Bulletin> bulletinPage = Page.empty(pageRequest);
-
try {
bulletinPage = bulletinDao.findAll(specification, pageRequest);
voList = bulletinPage.stream().map(bulletin -> {
diff --git a/web-app/src/app/routes/bulletin/bulletin.component.html
b/web-app/src/app/routes/bulletin/bulletin.component.html
index 6bdc05b9f..74ed14b40 100644
--- a/web-app/src/app/routes/bulletin/bulletin.component.html
+++ b/web-app/src/app/routes/bulletin/bulletin.component.html
@@ -57,10 +57,10 @@
</app-toolbar>
<nz-tabset nzType="card">
- <nz-tab *ngFor="let d of defines1" [nzTitle]="d.app">
+ <nz-tab *ngFor="let d of this.tabDefines" [nzTitle]="d.app">
<nz-table
#fixedTable
- [nzData]="defines"
+ [nzData]="listOfData"
[nzPageIndex]="pageIndex"
[nzPageSize]="pageSize"
[nzTotal]="total"
@@ -76,9 +76,8 @@
<thead>
<tr>
<th nzAlign="center" nzLeft nzWidth="3%" [(nzChecked)]="checkedAll"
(nzCheckedChange)="onAllChecked($event)"></th>
- <th nzAlign="center" nzWidth="16%">目标Host</th>
- <ng-container *ngFor="let metric of d.metrics">
- <th nzAlign="center">{{ metric }}</th>
+ <ng-container *ngFor="let column of listOfColumns">
+ <th>{{ column.title }}</th>
</ng-container>
<th nzAlign="center" nzWidth="15%">{{ 'common.edit' | i18n }}</th>
</tr>
@@ -86,6 +85,10 @@
<tbody>
<tr *ngFor="let data of fixedTable.data">
<td nzAlign="center" nzLeft
[nzChecked]="checkedDefineIds.has(data.id)"
(nzCheckedChange)="onItemChecked(data.id, $event)"></td>
+ <ng-container *ngFor="let column of listOfColumns">
+ <td>{{ data[column.key] }}</td>
+ </ng-container>
+ <td nzAlign="center" nzLeft></td>
<td nzAlign="center">
<button
nz-button
diff --git a/web-app/src/app/routes/bulletin/bulletin.component.ts
b/web-app/src/app/routes/bulletin/bulletin.component.ts
index 59029a364..d1005a857 100644
--- a/web-app/src/app/routes/bulletin/bulletin.component.ts
+++ b/web-app/src/app/routes/bulletin/bulletin.component.ts
@@ -40,7 +40,6 @@ import { BulletinDefineService } from
'../../service/bulletin-define.service';
import { MonitorService } from '../../service/monitor.service';
import { TagService } from '../../service/tag.service';
-const AVAILABILITY = 'availability';
@Component({
selector: 'app-bulletin',
@@ -63,6 +62,7 @@ export class BulletinComponent implements OnInit {
pageSize: number = 8;
total: number = 0;
defines!: BulletinDefine[];
+ tabDefines!: BulletinDefine[];
tableLoading: boolean = true;
checkedDefineIds = new Set<number>();
isSwitchExportTypeModalVisible = false;
@@ -74,20 +74,23 @@ export class BulletinComponent implements OnInit {
appEntries: Array<{ value: any; key: string }> = [];
checkedNodeList: NzTreeNode[] = [];
monitors: Monitor[] = [];
- defines1 = [
- {
- id: 1,
- app: 'App1',
- metrics: ['Metric1', 'Metric2']
- }
- ];
+ loading: boolean = false;
+ listOfData: any[] = [];
+ listOfColumns: { key: string, title: string }[] = [];
+ metrics: string[] = [];
+
+
ngOnInit(): void {
this.loadBulletinDefineTable();
+ this.tabDefines = this.defines;
+ this.loadData(399136249983232, "basic");
+
}
sync() {
this.loadBulletinDefineTable();
+ this.tabDefines = this.defines;
}
loadBulletinDefineTable() {
@@ -651,4 +654,38 @@ export class BulletinComponent implements OnInit {
this.define.metrics.push(node.key);
});
}
+
+ loadData(monitorId: number, metric: string) {
+ this.loading = true;
+ let metricData$ = this.monitorSvc
+ .getMonitorMetricsData(monitorId, metric)
+ .pipe(finalize(() => (this.loading = false)))
+ .subscribe(
+ message => {
+ metricData$.unsubscribe();
+ if (message.code === 0 && message.data) {
+ const { id, app, metrics, fields, valueRows } = message.data;
+ this.listOfColumns = fields.map((field: { name: string; unit: any;
}) => ({
+ key: field.name,
+ title: field.name.toUpperCase() + (field.unit ? `
(${field.unit})` : '')
+ }));
+ this.listOfData = valueRows.map((row: { labels: any; values:
any[]; }) => {
+ const rowData: any = { ...row.labels };
+ row.values.forEach((value, index) => {
+ rowData[fields[index].name] = value.origin;
+ });
+ return rowData;
+ });
+
+ } else if (message.code !== 0) {
+ this.notifySvc.warning(`${metric}:${message.msg}`, '');
+ console.info(`${metric}:${message.msg}`);
+ }
+ },
+ error => {
+ console.error(error.msg);
+ metricData$.unsubscribe();
+ }
+ );
+ }
}
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
