fix:修改tooltip的样式 以及内置 alert rule expression 显示 -

This commit is contained in:
zhangyu
2020-10-16 16:11:23 +08:00
parent 4036055932
commit fed3af50f8

View File

@@ -11,14 +11,21 @@
<!--</div>--> <!--</div>-->
<div class="alert-rule-box"> <div class="alert-rule-box">
<div class="alert-rule-title">Expression</div> <div class="alert-rule-title">Expression</div>
<div class="alert-rule-value">{{alertRuleData?(alertRuleData.expr + alertRuleData.operator + formatThreshold(alertRuleData.threshold,alertRuleData.unit)):''}}</div> <div class="alert-rule-value" v-if="alertRuleData.buildIn!==1">{{alertRuleData?(alertRuleData.expr + alertRuleData.operator + formatThreshold(alertRuleData.threshold,alertRuleData.unit)):'-'}}</div>
<div class="alert-rule-value" v-if="alertRuleData.buildIn===1">-</div>
</div> </div>
<div class="alert-rule-box"> <div class="alert-rule-box">
<div class="alert-rule-title">Level</div> <div class="alert-rule-title">Level</div>
<div class="alert-rule-value"> <div class="alert-rule-value severity">
<span v-if="alertRuleData && alertRuleData.severity === 'P1'"><i class="nz-icon nz-icon-arrow-up"></i>&nbsp;{{$CONSTANTS.alertMessage.severityData.find(s => {return s.value == 'P1'}).label}}</span> <span v-if="alertRuleData && alertRuleData.severity === 'P1'" class="P1">
<span style="padding-left: 18px;" v-if="alertRuleData && alertRuleData.severity === 'P2'">{{$CONSTANTS.alertMessage.severityData.find(s => {return s.value == 'P2'}).label}}</span> {{$CONSTANTS.alertMessage.severityData.find(s => {return s.value == 'P1'}).label}}
<span v-if="alertRuleData && alertRuleData.severity === 'P3'"><i class="nz-icon nz-icon-arrow-down"></i>&nbsp;{{$CONSTANTS.alertMessage.severityData.find(s => {return s.value == 'P3'}).label}}</span> </span>
<span v-if="alertRuleData && alertRuleData.severity === 'P2'" class="P2">
{{$CONSTANTS.alertMessage.severityData.find(s => {return s.value == 'P2'}).label}}
</span>
<span v-if="alertRuleData && alertRuleData.severity === 'P3'" class="P3">
{{$CONSTANTS.alertMessage.severityData.find(s => {return s.value == 'P3'}).label}}
</span>
</div> </div>
</div> </div>
</div> </div>
@@ -192,6 +199,27 @@
white-space: normal; white-space: normal;
overflow: hidden; overflow: hidden;
} }
.severity .P1{
background: #F5846A;
border-radius: 2px;
font-size: 12px;
color: #FFFFFF;
padding: 2px 6px;
}
.severity .P2{
background: #F7A54A;
border-radius: 2px;
font-size: 12px;
color: #FFFFFF;
padding: 2px 6px;
}
.severity .P3{
background: #F1C13D;
border-radius: 2px;
font-size: 12px;
color: #FFFFFF;
padding: 2px 6px;
}
/* .alert-rule-info::after { /* .alert-rule-info::after {
content: ''; content: '';
display: block; display: block;