Newer
Older
<div nz-row class="breadcrumbs">
<div nz-col nzSpan="16">
<nz-breadcrumb class="padding-8-0">
<nz-breadcrumb-item>
首页
</nz-breadcrumb-item>
<nz-breadcrumb-item>
<a>综合监控</a>
</nz-breadcrumb-item>
<nz-breadcrumb-item>
基础资源监控
</nz-breadcrumb-item>
</nz-breadcrumb>
</div>
<div nz-col nzSpan="8" class="text-right">
<!--<button nz-button nzType="primary"><i class="anticon anticon-search"></i></button>-->
<!--<button nz-button nzType="primary"><i class="anticon anticon-sync"></i></button>-->
<!--<button nz-button nzType="primary"><i class="anticon anticon-arrows-alt"></i></button>-->
</div>
<div nz-col nzSpan="12">
<span>监控设备数：{{deviceNo}}</span>
<span>设备状态：
<span> <nz-tag [nzColor]="'#64ad58'"></nz-tag>110 </span>
<span> <nz-tag [nzColor]="'#ed9e2e'"></nz-tag>120 </span>
<span> <nz-tag [nzColor]="'#dd4127'"></nz-tag>119 </span>
<span> <nz-tag [nzColor]="'#aaaaaa'"></nz-tag>112 </span>
</span>
<nz-select style="width: 200px;" nzShowSearch nzAllowClear nzPlaceHolder="按组分开" [(ngModel)]="selectedValue"
(ngModelChange)="select()">
<nz-option nzLabel="按设备类型展开" nzValue="type"></nz-option>
<nz-option nzLabel="按资源分组展开" nzValue="group"></nz-option>
</nz-select>
</div>
<div nz-col nzSpan="12" class="text-right">
<button nz-button nzType="default" (click)="showGroupModal()" *ngIf="selectedValue == 'group'"><i
class="anticon anticon-plus"></i>添加分组
</button>
<!--<button nz-button nzType="default"><i class="anticon anticon-pause-circle-o"></i>关闭监控</button>-->
<!--<button nz-button nzType="default"><i class="anticon anticon-play-circle-o"></i>开启监控</button>-->
<button nz-button nzType="default"><i class="anticon anticon-close-circle"></i>删除资源</button>
</div>
<nz-table #nzTable [nzData]="dataSet" nzSingleSort [nzLoading]="loading">
<thead>
<tr>
<th nzShowCheckbox [nzChecked]="allChecked" (nzCheckedChange)="checkAll($event)"></th>
<th nzShowSort>名称</th>
<th nzShowSort>告警状态</th>
<th nzShowSort nzWidth="20%">状态</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<!--设备类型-->
<ng-container *ngIf="selectedValue == 'type'">
<ng-template ngFor let-data [ngForOf]="nzTable.data">
<ng-template ngFor let-item [ngForOf]="expandDataCache[data.host]">
<tr *ngIf="(item.parent&&item.parent.expand)||!(item.parent)">
<td nzShowCheckbox [(nzChecked)]="item.checked"></td>
<td class="cursor" [nzIndentSize]="item.level*20" [nzShowExpand]="!!item.list"
[(nzExpand)]="item.expand" (nzExpandChange)="collapse(expandDataCache[data.host],item,$event)">
<span *ngIf="!item.level" (click)="getChildrenType(item)">{{item.equipmentType}}</span>
<span *ngIf="item.level" (click)="goDetail(item)">{{item.name}}</span>
</td>
<td class="round-tag">
<nz-tag *ngIf="item.maxLevel == 4 || item.maxLevel == 5" [nzColor]="'#fc0d1b'"></nz-tag>
<nz-tag *ngIf="item.maxLevel == 2 || item.maxLevel == 3" [nzColor]="'#fd9827'"></nz-tag>
<span *ngIf="item.maxLevel < 2">正常</span>
</td>
<td>
<span *ngIf="item.status == 0">已监控</span>
<span *ngIf="item.status == 1">未监控</span>
</td>
<td class="handle">
<ng-container *ngIf="!item.level">
<span (click)="showBasicEditModal(item)">添加资源</span>
<!--<span (click)="showDeleteGroupConfirm(item)">删除</span>-->
</ng-container>
<ng-container *ngIf="item.level">
<span (click)="showBasicCheckModal(item.hostid)">添加监测点</span>
<span (click)="editBasicModal(item)">编辑</span>
<span (click)="showDeleteConfirm(item)">删除</span>
<a nz-dropdown>更多 <i class="anticon anticon-down"></i>
</a>
<ul nz-menu nzSelectable>
<li (click)="showTempStop(item)" nz-menu-item><a>临时暂停</a></li>
<li nz-menu-item><a>查看监测点</a></li>
<li nz-menu-item><a>添加告警</a></li>
</ul>
</nz-dropdown>
</ng-container>
</td>
</tr>
</ng-template>
</ng-template>
</ng-container>
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
<!--资源分组-->
<ng-container *ngIf="selectedValue == 'group'">
<ng-template ngFor let-data [ngForOf]="nzTable.data">
<ng-template ngFor let-item [ngForOf]="expandDataCache[data.host]">
<tr *ngIf="(item.parent&&item.parent.expand)||!(item.parent)">
<td nzShowCheckbox [(nzChecked)]="item.checked"></td>
<td class="cursor" [nzIndentSize]="item.level*20" [nzShowExpand]="!!item.list"
[(nzExpand)]="item.expand" (nzExpandChange)="collapse(expandDataCache[data.host],item,$event)">
<span *ngIf="!item.level" (click)="getChildren(item)">{{item.name}}</span>
<span *ngIf="item.level" (click)="goDetail(item)">{{item.name}}</span>
</td>
<td class="round-tag">
<nz-tag *ngIf="item.maxLevel == 4 || item.maxLevel == 5" [nzColor]="'#fc0d1b'"></nz-tag>
<nz-tag *ngIf="item.maxLevel == 2 || item.maxLevel == 3" [nzColor]="'#fd9827'"></nz-tag>
<span *ngIf="item.maxLevel < 2">正常</span>
</td>
<td>
<span *ngIf="item.status == 0">已监控</span>
<span *ngIf="item.status == 1">未监控</span>
</td>
<td class="handle">
<ng-container *ngIf="!item.level">
<span (click)="showBasicEditModal(item)">添加资源</span>
</ng-container>
<ng-container *ngIf="item.level">
<span (click)="showBasicCheckModal(item.hostid)">添加监测点</span>
<span (click)="editBasicModal(item)">编辑</span>
<span (click)="showDeleteConfirm(item)">删除</span>
<a nz-dropdown>更多 <i class="anticon anticon-down"></i>
</a>
<ul nz-menu nzSelectable>
<li (click)="showTempStop(item)" nz-menu-item><a>临时暂停</a></li>
<li (click)="openHost(item)" nz-menu-item><a>
<ng-container *ngIf="item.status == 1">开启</ng-container>
<ng-container *ngIf="item.status == 0">停止</ng-container>
监控
</a></li>
<li nz-menu-item><a>查看监测点</a></li>
<li nz-menu-item><a>添加告警</a></li>
</ul>
</nz-dropdown>
</ng-container>
</td>
</tr>
</ng-template>
</ng-template>
</ng-container>
</tbody>
</nz-table>
<!-- 添加资源-->
<smart-basic-edit #basicEdit (done)="handleOk($event)"></smart-basic-edit>
<!--添加监测点-->
<smart-basi-check #smartCheck></smart-basi-check>
<!--添加分组-->
<smart-create-group #smartCreateGroup (add)="handleOk($event)"></smart-create-group>