Skip to content

S
smart
Commit 23229ae8 authored by wangqinghua's avatar wangqinghua
Browse files
Options

color

parent 9bb52a79
Hide whitespace changes
Inline Side-by-side
Showing with 73 additions and 63 deletions
src/main/webapp/app/alarm/now-alarm/now-alarm.component.html
View file @ 23229ae8
......@@ -29,8 +29,8 @@
<div class="tag-warn tag-form handle">
<ng-container *ngFor="let item of warnCountList">
<span [ngClass]="{'select-border': selectHostId == item.hostid}" (click)="search(item.hostid)">
<nz-tag *ngIf="item.level == 4 || item.level == 5" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="item.level == 2 || item.level == 3" [nzColor]="color.yellow"></nz-tag>
<nz-tag *ngIf="item.level == 4 || item.level == 5" class="tag-red" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="item.level == 2 || item.level == 3" class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
{{item.name}}({{item.size}})
</span>
</ng-container>
......
src/main/webapp/app/app.constants.ts
View file @ 23229ae8
......@@ -9,5 +9,5 @@ export const color = {
yellow:'#ffc029',
red:'#f44e4e',
gray:'#bfbfbf',
black:'#6064'
black:'#000000'
};
src/main/webapp/app/home/home.component.html
View file @ 23229ae8
......@@ -32,19 +32,19 @@
<div class="flex-center">
<div class="flex-item round-tag tag-form">
<p>
<nz-tag [nzColor]="color.red"></nz-tag>
<nz-tag class="tag-red" [nzColor]="color.red"></nz-tag>
<span class="margin-0-10">严重 {{leftOneData.high}}个，{{leftOneDataPre.highPer}}%</span>
</p>
<p>
<nz-tag [nzColor]="color.yellow"></nz-tag>
<nz-tag class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
<span class="margin-0-10">告警 {{leftOneData.warning}}个，{{leftOneDataPre.warningPer}}% </span>
</p>
<p>
<nz-tag [nzColor]="color.green"></nz-tag>
<nz-tag class="tag-green" [nzColor]="color.green"></nz-tag>
<span class="margin-0-10">正常 {{leftOneData.normal}}个，{{leftOneDataPre.normalPer}}% </span>
</p>
<p>
<nz-tag [nzColor]="color.gray"></nz-tag>
<nz-tag class="tag-gray" [nzColor]="color.gray"></nz-tag>
<span class="margin-0-10">禁止 {{leftOneData.disabled}}个，{{leftOneDataPre.disabledPer}}%</span>
</p>
</div>
......@@ -55,19 +55,19 @@
<div class="flex-center">
<div class="flex-item round-tag tag-form">
<p>
<nz-tag [nzColor]="color.red"></nz-tag>
<nz-tag class="tag-red" [nzColor]="color.red"></nz-tag>
<span class="margin-0-10">严重 {{leftTwoData.high}}个，{{leftTwoDataPre.highPer}}% </span>
</p>
<p>
<nz-tag [nzColor]="color.yellow"></nz-tag>
<nz-tag class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
<span class="margin-0-10">告警 {{leftTwoData.warning}}个，{{leftTwoDataPre.warningPer}}% </span>
</p>
<p>
<nz-tag [nzColor]="color.green"></nz-tag>
<nz-tag class="tag-green" [nzColor]="color.green"></nz-tag>
<span class="margin-0-10">正常 {{leftTwoData.normal}}个，{{leftTwoDataPre.normalPer}}% </span>
</p>
<p>
<nz-tag [nzColor]="color.gray"></nz-tag>
<nz-tag class="tag-gray" [nzColor]="color.gray"></nz-tag>
<span class="margin-0-10">禁止 {{leftTwoData.disabled}}个，{{leftTwoDataPre.disabledPer}}%</span>
</p>
</div>
......@@ -113,8 +113,8 @@
{{data.clock | date:"yyyy-MM-dd HH:mm:ss"}}
</td>
<td class="round-tag tag-form">
<nz-tag *ngIf="data.priority == 4 || data.priority == 5" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="data.priority == 2 || data.priority == 3" [nzColor]="color.yellow"></nz-tag>
<nz-tag *ngIf="data.priority == 4 || data.priority == 5" class="tag-red" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="data.priority == 2 || data.priority == 3" class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
</td>
<td class="cursor main-color" (click)="goToDetail(data)">{{data.hostname}}</td>
<td>{{data.description}}</td>
......@@ -149,9 +149,9 @@
<div class="container-top">
<p>监测点</p>
<p class="round-tag tag-form">
<nz-tag [nzColor]="color.red"></nz-tag>
<nz-tag class="tag-red" [nzColor]="color.red"></nz-tag>
<span style="margin-right: 10px">{{item.item.high}}</span>
<nz-tag [nzColor]="color.yellow"></nz-tag>
<nz-tag class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
<span style="margin-right: 10px"> {{item.item.warning}}</span>
</p>
</div>
......
src/main/webapp/app/overAll/basic/basic-detail/basic-detail.component.html
View file @ 23229ae8
......@@ -30,24 +30,21 @@
<div class="releative" #checkEle>
<div #colorEle class="checkTags tag-form">
<span [ngClass]="{'select-border': changeStates == '正常'}" (click)="changeState('正常')">
<nz-tag [nzColor]="color.green"></nz-tag>
<nz-tag class="tag-green" [nzColor]="color.green"></nz-tag>
<i *ngIf="!checkStatus.normal && checkStatus.normal !=0"
class="anticon anticon-spin anticon-loading" style="font-size: 15px;"></i>{{checkStatus.normal}}
</span>
<span [ngClass]="{'select-border': changeStates == '告警'}" (click)="changeState('告警')"> <nz-tag
[nzColor]="color.yellow"></nz-tag>
<span [ngClass]="{'select-border': changeStates == '告警'}" (click)="changeState('告警')"> <nz-tag class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
<i *ngIf="!checkStatus.warning && checkStatus.warning !=0"
class="anticon anticon-spin anticon-loading" style="font-size: 15px;"></i>
{{checkStatus.warning}}
</span>
<span [ngClass]="{'select-border': changeStates == '严重'}" (click)="changeState('严重')"> <nz-tag
[nzColor]="color.red"></nz-tag>
<span [ngClass]="{'select-border': changeStates == '严重'}" (click)="changeState('严重')"> <nz-tag class="tag-red" [nzColor]="color.red"></nz-tag>
<i *ngIf="!checkStatus.high && checkStatus.high !=0" class="anticon anticon-spin anticon-loading"
style="font-size: 15px;"></i>
{{checkStatus.high}}
</span>
<span [ngClass]="{'select-border': changeStates == '禁用'}" (click)="changeState('禁用')"> <nz-tag
[nzColor]="color.gray"></nz-tag>
<span [ngClass]="{'select-border': changeStates == '禁用'}" (click)="changeState('禁用')"> <nz-tag class="tag-gray" [nzColor]="color.gray"></nz-tag>
<i *ngIf="!checkStatus.disabled && checkStatus.disabled !=0"
class="anticon anticon-spin anticon-loading" style="font-size: 15px;"></i>
{{checkStatus.disabled}}
......@@ -175,14 +172,14 @@
<tr *ngFor="let data of checkTable.data">
<td class="tag-form">
<ng-container *ngIf="data.status == 0">
<nz-tag *ngIf="data.priority == 4 || data.priority == 5" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="data.priority == 2 || data.priority == 3" [nzColor]="color.yellow"></nz-tag>
<nz-tag *ngIf="data.priority == 4 || data.priority == 5" class="tag-red" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="data.priority == 2 || data.priority == 3" class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
<ng-container *ngIf="data.priority != 2 && data.priority != 3 && data.priority != 4 && data.priority != 5">
<nz-tag [nzColor]="color.green"></nz-tag>
<nz-tag class="tag-green" [nzColor]="color.green"></nz-tag>
</ng-container>
</ng-container>
<ng-container *ngIf="data.status == 1">
<nz-tag [nzColor]="color.gray"></nz-tag>
<nz-tag class="tag-gray" [nzColor]="color.gray"></nz-tag>
</ng-container>{{data.name}}
</td>
<td>
......@@ -210,8 +207,7 @@
<td>
<ng-container *ngIf="data.error">
<nz-tooltip [nzTitle]="data.error">
<span class="color-red" nz-tooltip><i
class="anticon anticon-warning"></i></span>
<span class="color-red" nz-tooltip><i class="anticon anticon-warning"></i></span>
</nz-tooltip>
</ng-container>
<ng-container *ngIf="data.info">
......
src/main/webapp/app/overAll/basic/basic.component.html
View file @ 23229ae8
......@@ -31,15 +31,15 @@
<div nz-col nzSpan="12">
<span>监控设备数：{{deviceNo}}</span>
<span>设备状态：
<span style="margin-right: 8px" (click)="search('0')"> <nz-tag [nzColor]="color.green"></nz-tag>
<span style="margin-right: 8px" (click)="search('0')"> <nz-tag class="tag-green" [nzColor]="color.green"></nz-tag>
<i *ngIf="!green && green !=0" class="anticon anticon-spin anticon-loading" style="font-size: 15px;"></i>
{{green}}
</span>
<span (click)="search('2')" style="margin-right: 8px"> <nz-tag [nzColor]="color.yellow"></nz-tag>
<span (click)="search('2')" style="margin-right: 8px"> <nz-tag class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
<i *ngIf="!yellow && yellow != 0" class="anticon anticon-spin anticon-loading" style="font-size: 15px;"></i>
{{yellow}}
</span>
<span (click)="search('3')" style="margin-right: 8px"> <nz-tag [nzColor]="color.red"></nz-tag>
<span (click)="search('3')" style="margin-right: 8px"> <nz-tag class="tag-red" [nzColor]="color.red"></nz-tag>
<i *ngIf="!red && red != 0" class="anticon anticon-spin anticon-loading" style="font-size: 15px;"></i>
{{red}}
</span>
......@@ -107,13 +107,12 @@
<td class="round-tag tag-form default">
<ng-container *ngIf="item.status == 1">
<nz-tag [nzColor]="color.gray"></nz-tag>
<nz-tag class="tag-gray" [nzColor]="color.gray"></nz-tag>
</ng-container>
<ng-container *ngIf="item.status == 0">
<nz-tag *ngIf="item.maxLevel == 4 || item.maxLevel == 5" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="item.maxLevel == 2 || item.maxLevel == 3"
[nzColor]="color.yellow"></nz-tag>
<nz-tag *ngIf="item.maxLevel < 2 " [nzColor]="color.green"></nz-tag>
<nz-tag *ngIf="item.maxLevel == 4 || item.maxLevel == 5" class="tag-red" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="item.maxLevel == 2 || item.maxLevel == 3" class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
<nz-tag *ngIf="item.maxLevel < 2 " class="tag-green" [nzColor]="color.green"></nz-tag>
</ng-container>
</td>
......@@ -209,7 +208,7 @@
<td></td>
<td [nzIndentSize]="item.level*20" nzShowExpand [nzExpand]='item.expand'
(nzExpandChange)="getChildren(item)">
<span>{{item.name}} <span style="color: #1b6b5bcc; margin-left: 10px">主机数量：{{item.hostcount}}</span> </span>
<span>{{item.name}} <span style="color: #1b6b5b; margin-left: 10px">主机数量：{{item.hostcount}}</span> </span>
</td>
</ng-container>
<!--子集-->
......@@ -223,13 +222,12 @@
<td class="round-tag tag-form">
<ng-container *ngIf="item.status == 1">
<nz-tag [nzColor]="color.gray"></nz-tag>
<nz-tag class="tag-gray" [nzColor]="color.gray"></nz-tag>
</ng-container>
<ng-container *ngIf="item.status == 0">
<nz-tag *ngIf="item.maxLevel == 4 || item.maxLevel == 5" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="item.maxLevel == 2 || item.maxLevel == 3"
[nzColor]="color.yellow"></nz-tag>
<nz-tag *ngIf="item.maxLevel < 2 " [nzColor]="color.green"></nz-tag>
<nz-tag *ngIf="item.maxLevel == 4 || item.maxLevel == 5" class="tag-red" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="item.maxLevel == 2 || item.maxLevel == 3" class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
<nz-tag *ngIf="item.maxLevel < 2 " class="tag-green" [nzColor]="color.green"></nz-tag>
</ng-container>
</td>
......@@ -331,12 +329,12 @@
</td>
<td class="round-tag tag-form default">
<ng-container *ngIf="item.status == 1">
<nz-tag [nzColor]="color.gray"></nz-tag>
<nz-tag class="tag-gray" [nzColor]="color.gray"></nz-tag>
</ng-container>
<ng-container *ngIf="item.status == 0">
<nz-tag *ngIf="item.maxLevel == 4 || item.maxLevel == 5" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="item.maxLevel == 2 || item.maxLevel == 3" [nzColor]="color.yellow"></nz-tag>
<nz-tag *ngIf="item.maxLevel < 2 " [nzColor]="color.green"></nz-tag>
<nz-tag *ngIf="item.maxLevel == 4 || item.maxLevel == 5" class="tag-red" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="item.maxLevel == 2 || item.maxLevel == 3" class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
<nz-tag *ngIf="item.maxLevel < 2" class="tag-green" [nzColor]="color.green"></nz-tag>
</ng-container>
</td>
......
src/main/webapp/app/overAll/network-check/network-check.component.html
View file @ 23229ae8
......@@ -26,22 +26,20 @@
<div nz-col nzSpan="12">
<span>网站监测数：{{checkStatus.total}}</span>
<span>监测状态：
<span style="margin-right: 8px"> <nz-tag [nzColor]="color.green"></nz-tag>
<span style="margin-right: 8px"> <nz-tag class="tag-green" [nzColor]="color.green"></nz-tag>
<i *ngIf="!checkStatus.type.normalNum && checkStatus.type.normalNum !=0"
class="anticon anticon-spin anticon-loading" style="font-size: 15px;"></i>
{{checkStatus.type.normalNum}}
</span>
<span style="margin-right: 8px"> <nz-tag [nzColor]="color.yellow"></nz-tag>
<i *ngIf="!checkStatus.type.warnNum && checkStatus.type.warnNum !=0"
class="anticon anticon-spin anticon-loading" style="font-size: 15px;"></i>
<span style="margin-right: 8px"> <nz-tag class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
<i *ngIf="!checkStatus.type.warnNum && checkStatus.type.warnNum !=0" class="anticon anticon-spin anticon-loading" style="font-size: 15px;"></i>
{{checkStatus.type.warnNum}}
</span>
<span style="margin-right: 8px"> <nz-tag [nzColor]="color.red"></nz-tag>
<i *ngIf="!checkStatus.type.seriousNum && checkStatus.type.seriousNum !=0"
class="anticon anticon-spin anticon-loading" style="font-size: 15px;"></i>
<span style="margin-right: 8px"> <nz-tag class="tag-red" [nzColor]="color.red"></nz-tag>
<i *ngIf="!checkStatus.type.seriousNum && checkStatus.type.seriousNum !=0" class="anticon anticon-spin anticon-loading" style="font-size: 15px;"></i>
{{checkStatus.type.seriousNum}}
</span>
<span> <nz-tag [nzColor]="color.gray"></nz-tag>
<span> <nz-tag class="tag-gray" [nzColor]="color.gray"></nz-tag>
<i *ngIf="!checkStatus.type.notNum && checkStatus.type.notNum !=0"
class="anticon anticon-spin anticon-loading" style="font-size: 15px;"></i>
{{checkStatus.type.notNum}}
......
src/main/webapp/app/overAll/template/list/item-list/item-list.component.html
View file @ 23229ae8
......@@ -56,14 +56,14 @@
<tr *ngFor="let data of checkTable.data">
<td class="tag-form">
<ng-container *ngIf="data.status == 0">
<nz-tag *ngIf="data.priority == 4 || data.priority == 5" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="data.priority == 2 || data.priority == 3" [nzColor]="color.yellow"></nz-tag>
<nz-tag *ngIf="data.priority == 4 || data.priority == 5" class="tag-red" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="data.priority == 2 || data.priority == 3" class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
<ng-container *ngIf="data.priority != 2 && data.priority != 3 && data.priority != 4 && data.priority != 5">
<nz-tag [nzColor]="color.green"></nz-tag>
<nz-tag class="tag-green" [nzColor]="color.green"></nz-tag>
</ng-container>
</ng-container>
<ng-container *ngIf="data.status == 1">
<nz-tag [nzColor]="color.gray"></nz-tag>
<nz-tag class="tag-gray" [nzColor]="color.gray"></nz-tag>
</ng-container>
{{data.name}}</td>
<td>{{data.itemType}}</td>
......
src/main/webapp/app/overAll/template/list/tri-list/tri-list.component.html
View file @ 23229ae8
......@@ -50,8 +50,8 @@
<tr *ngFor="let data of triggerList">
<td nzShowCheckbox [(nzChecked)]="data.checked" (nzCheckedChange)="refreshStatus()"></td>
<td class="round-tag tag-form">
<nz-tag *ngIf="data.priority == 4 || data.priority == 5" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="data.priority == 2 || data.priority == 3" [nzColor]="color.yellow"></nz-tag>
<nz-tag *ngIf="data.priority == 4 || data.priority == 5" class="tag-red" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="data.priority == 2 || data.priority == 3" class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
</td>
<td>{{data.description}}</td>
<td>{{data.expression}}</td>
......
src/main/webapp/app/overAll/template/template.component.html
View file @ 23229ae8
......@@ -61,7 +61,7 @@
<td></td>
<td class="cursor" [nzIndentSize]="item.level*20" nzShowExpand [nzExpand]='item.expand'
(nzExpandChange)="getChildren(item)">
<span>{{item.name}}</span> <span style="color: #1b6b5bcc; margin-left: 10px">模版数量：{{item.templatescount}}</span>
<span>{{item.name}}</span> <span style="color: #1b6b5b; margin-left: 10px">模版数量：{{item.templatescount}}</span>
</td>
<td>{{item.description}}</td>
<td></td>
......
src/main/webapp/app/overAll/template/trigger-list/trigger-list.component.html
View file @ 23229ae8
......@@ -49,8 +49,8 @@
<tr *ngFor="let data of triggerList">
<td nzShowCheckbox [(nzChecked)]="data.checked" (nzCheckedChange)="selectItem(data,$event)"></td>
<td class="round-tag tag-form">
<nz-tag *ngIf="data.priority == 4 || data.priority == 5" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="data.priority == 2 || data.priority == 3" [nzColor]="color.yellow"></nz-tag>
<nz-tag *ngIf="data.priority == 4 || data.priority == 5" class="tag-red" [nzColor]="color.red"></nz-tag>
<nz-tag *ngIf="data.priority == 2 || data.priority == 3" class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
</td>
<td>{{data.description}}</td>
<td>{{data.expression}}</td>
......
src/main/webapp/content/css/global.css
View file @ 23229ae8
......@@ -354,3 +354,21 @@ ui bootstrap tweaks
.ant-menu-inline .ant-menu-item, .ant-menu-inline .ant-menu-submenu-title{
width: auto;
}
/*低版本浏览器tag标签的背景色不起作用*/
.tag-green > div.ant-tag{
background-color: #58ca13;
}
.tag-yellow > div.ant-tag{
background-color: #ffc029;
}
.tag-red > div.ant-tag{
background-color: #f44e4e;
}
.tag-gray > div.ant-tag{
background-color: #bfbfbf;
}
.tag-black > div.ant-tag{
background-color: #000000;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment