[web-app] 监控状态映射图标展示

web-app/src/app/core/startup/startup.service.ts

@@ -49,7 +49,7 @@ export class StartupService {
           // Application information: including site name, description, year
           this.settingService.setApp(appData.app);
           // User information: including name, avatar, email address
-          this.settingService.setUser(appData.user);
+          // this.settingService.setUser(appData.user);
           // ACL: Set the permissions to full, https://ng-alain.com/acl/getting-started
           this.aclService.setFull(true);
           // Menu data, https://ng-alain.com/theme/menu

web-app/src/app/pojo/Monitor.ts

@@ -4,6 +4,7 @@ export class Monitor {
   app!: string;
   host!: string;
   intervals: number = 600;
+  // 监控状态 0:未监控,1:可用,2:不可用,3:不可达,4:挂起
   status!: number;
   description!: string;
   creator!: string;

web-app/src/app/routes/monitor/monitor-list/monitor-list.component.html

@@ -59,9 +59,35 @@
   <tr *ngFor="let data of fixedTable.data">
     <td nzAlign="center" nzLeft [nzChecked]="checkedMonitorIds.has(data.id)" (nzCheckedChange)="onItemChecked(data.id, $event)"></td>
     <td nzAlign="center">{{ data.name }}</td>
-    <td nzAlign="center">{{ data.status }}</td>
+    <td nzAlign="center">
+      <nz-tag *ngIf="data.status == 0" nzColor="default">
+        <i nz-icon nzType="sync"></i>
+        <span>未监控</span>
+      </nz-tag>
+      <nz-tag *ngIf="data.status == 1" nzColor="success">
+        <i nz-icon nzType="sync"></i>
+        <span>正常监控</span>
+      </nz-tag>
+      <nz-tag *ngIf="data.status == 2" nzColor="warning">
+        <i nz-icon nzType="sync"></i>
+        <span>监控不可用</span>
+      </nz-tag>
+      <nz-tag *ngIf="data.status == 3" nzColor="error">
+        <i nz-icon nzType="sync"></i>
+        <span>监控不可大达</span>
+      </nz-tag>
+      <nz-tag *ngIf="data.status == 4" nzColor="default">
+        <i nz-icon nzType="sync"></i>
+        <span>监控已挂起</span>
+      </nz-tag>
+    </td>
     <td nzAlign="center">{{ data.host }}</td>
-    <td nzAlign="center">{{ data.app }}</td>
+    <td nzAlign="center">
+      <nz-tag nzColor="processing">
+        <i nz-icon nzType="cloud"></i>
+        <span>{{ data.app }}</span>
+      </nz-tag>
+    </td>
     <td nzAlign="center">{{ data.gmtUpdate? data.gmtUpdate : data.gmtCreate }}</td>
     <td nzAlign="center" nzRight>
       <button nz-button nzType="primary" (click)="onEditOneMonitor(data.id)">

web-app/src/app/routes/monitor/monitor.module.ts

@@ -8,6 +8,7 @@ import {MonitorDetailComponent} from "./monitor-detail/monitor-detail.component"
 import {NzBreadCrumbModule} from "ng-zorro-antd/breadcrumb";
 import {NzDividerModule} from "ng-zorro-antd/divider";
 import {NzSwitchModule} from "ng-zorro-antd/switch";
+import {NzTagModule} from "ng-zorro-antd/tag";
 
 const COMPONENTS: Type<void>[] = [
   MonitorNewComponent,
@@ -22,7 +23,8 @@ const COMPONENTS: Type<void>[] = [
         MonitorRoutingModule,
         NzBreadCrumbModule,
         NzDividerModule,
-        NzSwitchModule
+        NzSwitchModule,
+        NzTagModule
     ],
   declarations: COMPONENTS,
 })

web-app/src/app/routes/passport/login/login.component.ts

@@ -10,6 +10,7 @@ import { NzTabChangeEvent } from 'ng-zorro-antd/tabs';
 import { finalize } from 'rxjs/operators';
 import {Message} from "../../../pojo/Message";
 import {LocalStorageService} from "../../../service/local-storage.service";
+import {User} from "@delon/theme/src/services/settings/types";
 
 @Component({
   selector: 'passport-login',
@@ -136,6 +137,12 @@ export class UserLoginComponent implements OnDestroy {
         // 设置用户Token信息
         this.storageSvc.storageAuthorizationToken(message.data.token);
         this.storageSvc.storageRefreshToken(message.data.refreshToken);
+        let user:User = {
+          name: this.userName.value,
+          avatar: "./assets/tmp/img/avatar.svg",
+          email: ""
+        }
+        this.settingsService.setUser(user);
         // 重新获取 StartupService 内容，我们始终认为应用信息一般都会受当前用户授权范围而影响
         this.startupSrv.load().subscribe(() => {
           let url = this.tokenService.referrer!.url || '/';

web-app/src/styles/theme.less

@@ -11,6 +11,5 @@
 @alain-default-header-hg: 52px;
 @alain-default-header-bg: #722ED1;
 @alain-default-header-padding: 8px;
-@alain-default-aside-bg: #eca7a7;
 @alain-default-aside-nav-text-hover-color: #722ED1;
 @alain-default-aside-nav-selected-text-color: #722ED1;