import { Component, OnInit } from '@angular/core'; import {NzTableQueryParams} from "ng-zorro-antd/table"; import {NzModalService} from "ng-zorro-antd/modal"; import {NzNotificationService} from "ng-zorro-antd/notification"; import {AlertDefineService} from "../../../service/alert-define.service"; import {AlertDefine} from "../../../pojo/AlertDefine"; import {finalize, map} from "rxjs/operators"; import {AppDefineService} from "../../../service/app-define.service"; import {TransferChange, TransferItem} from "ng-zorro-antd/transfer"; import {zip} from "rxjs"; import {MonitorService} from "../../../service/monitor.service"; import {Message} from "../../../pojo/Message"; import {AlertDefineBind} from "../../../pojo/AlertDefineBind"; import {Monitor} from "../../../pojo/Monitor"; @Component({ selector: 'app-alert-setting', templateUrl: './alert-setting.component.html', styles: [ ] }) export class AlertSettingComponent implements OnInit { constructor(private modal: NzModalService, private notifySvc: NzNotificationService, private appDefineSvc: AppDefineService, private monitorSvc: MonitorService, private alertDefineSvc: AlertDefineService) { } pageIndex: number = 1; pageSize: number = 8; total: number = 0; defines!: AlertDefine[]; tableLoading: boolean = true; checkedDefineIds = new Set(); appHierarchies!: any[]; ngOnInit(): void { this.loadAlertDefineTable(); // 查询监控层级 const getHierarchy$ = this.appDefineSvc.getAppHierarchy() .pipe(finalize(() => { getHierarchy$.unsubscribe(); })) .subscribe(message => { if (message.code === 0) { this.appHierarchies = message.data; } else { console.warn(message.msg); } }, error => { console.warn(error.msg); }) } sync() { this.loadAlertDefineTable(); } loadAlertDefineTable() { this.tableLoading = true; let alertDefineInit$ = this.alertDefineSvc.getAlertDefines(this.pageIndex - 1, this.pageSize) .subscribe(message => { this.tableLoading = false; this.checkedAll = false; this.checkedDefineIds.clear(); if (message.code === 0) { let page = message.data; this.defines = page.content; this.pageIndex = page.number + 1; this.total = page.totalElements; } else { console.warn(message.msg); } alertDefineInit$.unsubscribe(); }, error => { this.tableLoading = false; alertDefineInit$.unsubscribe(); }); } onNewAlertDefine() { this.define = new AlertDefine(); this.isManageModalAdd = true; this.isManageModalVisible = true; this.isManageModalOkLoading = false; } onEditOneAlertDefine(alertDefineId: number) { if (alertDefineId == null) { this.notifySvc.warning("未选中任何待编辑项!",""); return; } this.editAlertDefine(alertDefineId); } onEditAlertDefine() { // 编辑时只能选中一个 if (this.checkedDefineIds == null || this.checkedDefineIds.size === 0) { this.notifySvc.warning("未选中任何待编辑项!",""); return; } if (this.checkedDefineIds.size > 1) { this.notifySvc.warning("只能对一个选中项进行编辑!",""); return; } let alertDefineId = 0; this.checkedDefineIds.forEach(item => alertDefineId = item); this.editAlertDefine(alertDefineId); } editAlertDefine(alertDefineId: number) { this.isManageModalAdd = false; this.isManageModalVisible = true; this.isManageModalOkLoading = false; // 查询告警定义信息 const getDefine$ = this.alertDefineSvc.getAlertDefine(alertDefineId) .pipe(finalize(() => { getDefine$.unsubscribe(); })) .subscribe(message => { if (message.code === 0) { this.define = message.data; this.cascadeValues = [this.define.app, this.define.metric, this.define.field]; } else { this.notifySvc.error("查询此监控定义详情失败!",message.msg); } }, error => { this.notifySvc.error("查询此监控定义详情失败!",error.msg); }) } onDeleteAlertDefines() { if (this.checkedDefineIds == null || this.checkedDefineIds.size === 0) { this.notifySvc.warning("未选中任何待删除项!",""); return; } this.modal.confirm({ nzTitle: '请确认是否批量删除!', nzOkText: '确定', nzCancelText: '取消', nzOkDanger: true, nzOkType: "primary", nzOnOk: () => this.deleteAlertDefines(this.checkedDefineIds) }); } onDeleteOneAlertDefine(alertDefineId: number) { let defineIds = new Set(); defineIds.add(alertDefineId); this.modal.confirm({ nzTitle: '请确认是否删除!', nzOkText: '确定', nzCancelText: '取消', nzOkDanger: true, nzOkType: "primary", nzOnOk: () => this.deleteAlertDefines(defineIds) }); } deleteAlertDefines(defineIds: Set) { if (defineIds == null || defineIds.size == 0) { this.notifySvc.warning("未选中任何待删除项!",""); return; } this.tableLoading = true; const deleteDefines$ = this.alertDefineSvc.deleteAlertDefines(defineIds) .subscribe(message => { deleteDefines$.unsubscribe(); if (message.code === 0) { this.notifySvc.success("删除成功!", ""); this.loadAlertDefineTable(); } else { this.tableLoading = false; this.notifySvc.error("删除失败!", message.msg); } }, error => { this.tableLoading = false; deleteDefines$.unsubscribe(); this.notifySvc.error("删除失败!", error.msg) }) } // begin: 列表多选分页逻辑 checkedAll: boolean = false; onAllChecked(checked: boolean) { if (checked) { this.defines.forEach(monitor => this.checkedDefineIds.add(monitor.id)); } else { this.checkedDefineIds.clear(); } } onItemChecked(monitorId: number, checked: boolean) { if (checked) { this.checkedDefineIds.add(monitorId); } else { this.checkedDefineIds.delete(monitorId); } } /** * 分页回调 * @param params 页码信息 */ onTablePageChange(params: NzTableQueryParams) { const { pageSize, pageIndex, sort, filter } = params; this.pageIndex = pageIndex; this.pageSize = pageSize; this.loadAlertDefineTable(); } // end: 列表多选逻辑 // start 新增修改告警定义model isManageModalVisible = false; isManageModalOkLoading = false; isManageModalAdd = true; define!: AlertDefine; cascadeValues: string[] = []; onManageModalCancel() { this.isManageModalVisible = false; } onManageModalOk() { this.isManageModalOkLoading = true; this.define.app = this.cascadeValues[0]; this.define.metric = this.cascadeValues[1]; this.define.field = this.cascadeValues[2]; if (this.isManageModalAdd) { const modalOk$ = this.alertDefineSvc.newAlertDefine(this.define) .pipe(finalize(() => { modalOk$.unsubscribe(); this.isManageModalOkLoading = false; })) .subscribe(message => { if (message.code === 0) { this.isManageModalVisible = false; this.notifySvc.success("新增成功!", ""); this.loadAlertDefineTable(); } else { this.notifySvc.error("新增失败!", message.msg); } }, error => { this.notifySvc.error("新增失败!", error.msg); }) } else { const modalOk$ = this.alertDefineSvc.editAlertDefine(this.define) .pipe(finalize(() => { modalOk$.unsubscribe(); this.isManageModalOkLoading = false; })) .subscribe(message => { if (message.code === 0) { this.isManageModalVisible = false; this.notifySvc.success("修改成功!", ""); this.loadAlertDefineTable(); } else { this.notifySvc.error("修改失败!", message.msg); } }, error => { this.notifySvc.error("修改失败!", error.msg); }) } } // end 新增修改告警定义model // start 告警定义与监控关联model isConnectModalVisible = false; isConnectModalOkLoading = false; transferData: TransferItem[] = []; currentAlertDefineId!: number; $asTransferItems = (data: unknown): TransferItem[] => data as TransferItem[]; onOpenConnectModal(alertDefineId: number, app: string) { this.isConnectModalVisible = true; this.currentAlertDefineId = alertDefineId; zip(this.alertDefineSvc.getAlertDefineMonitorsBind(alertDefineId), this.monitorSvc.getMonitorsByApp(app)) .pipe( map(([defineBindData, monitorData]: [Message, Message]) => { let bindRecode: Record = {}; if (defineBindData.data != undefined) { defineBindData.data.forEach(bind => { bindRecode[bind.monitorId] = bind.monitorName; }) } let listTmp: any[] = []; if (monitorData.data != undefined) { monitorData.data.forEach(monitor => { listTmp.push({ id: monitor.id, name: monitor.name, key: monitor.id, direction: bindRecode[monitor.id] == undefined ? 'left' : 'right' }) }) } return listTmp; }) ).subscribe(list => this.transferData = list); } onConnectModalCancel() { this.isConnectModalVisible = false; } onConnectModalOk() { this.isConnectModalOkLoading = true; let defineBinds: AlertDefineBind[] = []; this.transferData.forEach(item => { if (item.direction == 'right') { let bind = new AlertDefineBind(); bind.alertDefineId = this.currentAlertDefineId; bind.monitorId = item.id; bind.monitorName = item.name; defineBinds.push(bind); } }) const applyBind$ = this.alertDefineSvc.applyAlertDefineMonitorsBind(this.currentAlertDefineId, defineBinds) .pipe(finalize(() => { applyBind$.unsubscribe(); })) .subscribe(message => { this.isConnectModalOkLoading = false; if (message.code === 0) { this.notifySvc.success("应用成功!", ""); this.isConnectModalVisible = false; this.loadAlertDefineTable(); } else { this.notifySvc.error("应用失败!", message.msg); } }, error => { this.notifySvc.error("应用失败!", error.msg); }) } change(ret: TransferChange): void { const listKeys = ret.list.map(l => l.key); const hasOwnKey = (e: TransferItem): boolean => e.hasOwnProperty('key'); this.transferData = this.transferData.map(e => { if (listKeys.includes(e.key) && hasOwnKey(e)) { if (ret.to === 'left') { delete e.hide; } else if (ret.to === 'right') { e.hide = false; } } return e; }); } // end 告警定义与监控关联model }