From 73d7c0cd5b353897b3f0026e9a2e46f2dda33d0a Mon Sep 17 00:00:00 2001 From: tomsun28 Date: Thu, 2 Dec 2021 21:34:05 +0800 Subject: [PATCH] =?UTF-8?q?[web-app]=20dashboard=E6=A8=A1=E6=8B=9F?= =?UTF-8?q?=E6=95=B0=E6=8D=AE=E5=B1=95=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../java/com/usthe/manager/dao/ParamDao.java | 7 +++ .../routes/dashboard/dashboard.component.html | 28 ++++++++- .../routes/dashboard/dashboard.component.ts | 57 ++++++++++++++++++- .../monitor-list/monitor-list.component.ts | 2 + web-app/src/app/routes/routes.module.ts | 4 +- 5 files changed, 94 insertions(+), 4 deletions(-) diff --git a/manager/src/main/java/com/usthe/manager/dao/ParamDao.java b/manager/src/main/java/com/usthe/manager/dao/ParamDao.java index 87d03c1..a0a3126 100644 --- a/manager/src/main/java/com/usthe/manager/dao/ParamDao.java +++ b/manager/src/main/java/com/usthe/manager/dao/ParamDao.java @@ -4,6 +4,7 @@ import com.usthe.manager.pojo.entity.Param; import org.springframework.data.jpa.repository.JpaRepository; import java.util.List; +import java.util.Set; /** * ParamDao 数据库操作 @@ -24,4 +25,10 @@ public interface ParamDao extends JpaRepository { * @param monitorId 监控ID */ void deleteParamsByMonitorId(long monitorId); + + /** + * 根据监控ID列表删除与之关联的参数列表 + * @param monitorIds 监控ID列表 + */ + void deleteParamsByMonitorIdIn(Set monitorIds); } diff --git a/web-app/src/app/routes/dashboard/dashboard.component.html b/web-app/src/app/routes/dashboard/dashboard.component.html index 3f21015..4954878 100644 --- a/web-app/src/app/routes/dashboard/dashboard.component.html +++ b/web-app/src/app/routes/dashboard/dashboard.component.html @@ -1 +1,27 @@ - + +
+
+ + + + +
+
+ +
+ +
+ +
+
diff --git a/web-app/src/app/routes/dashboard/dashboard.component.ts b/web-app/src/app/routes/dashboard/dashboard.component.ts index e8e56f1..6002576 100644 --- a/web-app/src/app/routes/dashboard/dashboard.component.ts +++ b/web-app/src/app/routes/dashboard/dashboard.component.ts @@ -1,4 +1,6 @@ -import { ChangeDetectionStrategy, Component } from '@angular/core'; +import {ChangeDetectionStrategy, Component, ViewChild} from '@angular/core'; +import {NzMessageService} from "ng-zorro-antd/message"; +import {G2PieClickItem, G2PieComponent, G2PieData} from "@delon/chart/pie"; @Component({ selector: 'app-dashboard', @@ -6,4 +8,55 @@ import { ChangeDetectionStrategy, Component } from '@angular/core'; styleUrls: ['./dashboard.component.less'], changeDetection: ChangeDetectionStrategy.OnPush }) -export class DashboardComponent {} +export class DashboardComponent { + + @ViewChild('pie', { static: false }) readonly pie!: G2PieComponent; + salesPieData: G2PieData[] = []; + total = ''; + + constructor(private msg: NzMessageService){} + + ngOnInit(): void { + this.refresh(); + } + + refresh(): void { + const rv = (min: number = 0, max: number = 5000) => Math.floor(Math.random() * (max - min + 1) + min); + this.salesPieData = [ + { + x: '应用服务', + y: rv(), + }, + { + x: '数据库', + y: rv(), + }, + { + x: '中间件', + y: rv(), + }, + { + x: '自定义', + y: rv(), + }, + { + x: '其它', + y: rv(), + }, + ]; + this.total = `${this.salesPieData.reduce((pre, now) => now.y + pre, 0).toFixed(2)}`; + if (this.pie) { + // 等待组件渲染 + setTimeout(() => this.pie.changeData()); + } + } + + format(val: number): string { + return `${val.toFixed()}`; + } + + handleClick(data: G2PieClickItem): void { + this.msg.info(`${data.item.x} - ${data.item.y}`); + } + +} diff --git a/web-app/src/app/routes/monitor/monitor-list/monitor-list.component.ts b/web-app/src/app/routes/monitor/monitor-list/monitor-list.component.ts index 21770b1..8edff5c 100644 --- a/web-app/src/app/routes/monitor/monitor-list/monitor-list.component.ts +++ b/web-app/src/app/routes/monitor/monitor-list/monitor-list.component.ts @@ -5,6 +5,7 @@ import {Monitor} from "../../../pojo/Monitor"; import {Page} from "../../../pojo/Page"; import {NzModalService} from "ng-zorro-antd/modal"; import {NzNotificationService} from "ng-zorro-antd/notification"; +import {NzMessageService} from "ng-zorro-antd/message"; @Component({ selector: 'app-monitor-list', @@ -18,6 +19,7 @@ export class MonitorListComponent implements OnInit { private router: Router, private modal: NzModalService, private notifySvc: NzNotificationService, + private msg: NzMessageService, private monitorSvc: MonitorService) { } app!: string; diff --git a/web-app/src/app/routes/routes.module.ts b/web-app/src/app/routes/routes.module.ts index 8eb5843..ceca254 100644 --- a/web-app/src/app/routes/routes.module.ts +++ b/web-app/src/app/routes/routes.module.ts @@ -1,5 +1,7 @@ import { NgModule, Type } from '@angular/core'; import { SharedModule } from '@shared'; +import {G2PieModule} from "@delon/chart/pie"; +import {G2WaterWaveModule} from "@delon/chart/water-wave"; // dashboard pages import { DashboardComponent } from './dashboard/dashboard.component'; // single pages @@ -23,7 +25,7 @@ const COMPONENTS: Array> = [ ]; @NgModule({ - imports: [SharedModule, RouteRoutingModule], + imports: [SharedModule, RouteRoutingModule, G2PieModule, G2WaterWaveModule], declarations: COMPONENTS, }) export class RoutesModule {}