style: endpoint Configuration列,鼠标移入弹框样式调整

This commit is contained in:
@changcode
2021-10-27 10:59:54 +08:00
parent ffb6cb23ea
commit 586246d34f
3 changed files with 36 additions and 6 deletions

View File

@@ -103,6 +103,32 @@
<div class="alert-label-title">Name</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData ? alertLabelData.name : '--'}}</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Module</div>
<div class="alert-label-value">
<i style="cursor: pointer" class="nz-icon nz-icon-overview-module monitorColor"/>&nbsp;
<span>{{alertLabelData && alertLabelData.module && alertLabelData.module.name ? alertLabelData.module.name : '--'}}</span></div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Endpoint</div>
<div class="alert-label-value">
<i class="nz-icon nz-icon-overview-endpoint monitorColor"></i>&nbsp;
<span>{{alertLabelData && alertLabelData.endpointNum ? alertLabelData.endpointNum : '--'}}</span></div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Asset</div>
<div class="alert-label-value">
<i v-if="alertLabelData" class="nz-icon nz-icon-cabinet monitorColor" :class="alertLabelData && alertLabelData.assetName > 0 ? 'colorEF7458' : 'color23BF9A'"/>&nbsp;
<span>{{alertLabelData && alertLabelData.assetNum ? alertLabelData.assetNum: 0}}</span>
</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Alert</div>
<div class="alert-label-value">
<i v-if="alertLabelData" :class="alertLabelData && alertLabelData.alertNum > 0 ? 'red' : 'green'" class="nz-icon nz-icon-overview-alert"></i>&nbsp;
<span>{{alertLabelData && alertLabelData.alertNum ? alertLabelData.alertNum : 0 + ' ' + alertActiveStr()}}</span>
</div>
</div>
<div class="alert-label-box">
<div class="alert-label-title">Description</div>
<div class="alert-label-value">{{alertLabelData && alertLabelData.remark ? alertLabelData.remark : '--'}}</div>

View File

@@ -243,6 +243,7 @@ export default {
text-align: left;
color: #1a1a1a;
padding: 0 3px 0 13px;
width: 159px;
word-wrap: break-word;
white-space: normal;
overflow: hidden;

View File

@@ -110,7 +110,7 @@
<!-- </div>-->
<!-- </el-tooltip>-->
<el-tooltip placement="left" effect="light" :popper-class="'endpointConfigsTips data-column__endpoint'" v-if="scope.row.configs[0].enable || scope.row.configs[1].enable">
<el-tooltip placement="left" effect="light" :popper-class="'endpointConfigsTips'" v-if="scope.row.configs[0].enable || scope.row.configs[1].enable">
<span class="configs-endpoint metrics">[{{scope.row.configs[0].enable ? 'Metrics':''}}{{scope.row.configs[0].enable&&scope.row.configs[1].enable?',':''}}{{scope.row.configs[1].enable ? 'logs' : ''}}]</span>
<div class="endpointConfigsTips" slot="content">
<span class="copy-value-content"> <i class="nz-icon nz-icon-override" @click="copyValue(clConfigs(scope.row))"></i></span>
@@ -403,10 +403,14 @@ export default {
}
</style>
<style>
.endpointConfigsTips{
min-width: 150px;
padding:3px 3px 0 8px ;
}
.copy-value-content{
position: absolute;
right: 18px;
top: 5px;
right: 6px;
top: 6px;
}
.data-column__endpoint {
background: #FFFFFF;
@@ -415,9 +419,8 @@ export default {
border-radius: 3px 3px 3px 3px 0 0;
}
.copy-value-content__pre {
min-width: 150px;
height: 185px;
margin: 10px;
height: 200px;
margin-top: 20px;
overflow-y: auto;
overflow-x: hidden;
}