fix:alert silence 列表页面增加 alerts 列、告警详情页面 样式优化

This commit is contained in:
likexuan
2022-04-20 17:16:07 +08:00
parent 5fe712c7d0
commit 5f4f8f0e3d
7 changed files with 646 additions and 288 deletions

View File

@@ -285,6 +285,9 @@
.el-dialog__body {
.alert-message-info-box {
.info-box-right {
#alert .name-labe {
display: none;
}
.el-timeline {
.el-timeline-item {
.el-timeline-item__wrapper {
@@ -375,9 +378,22 @@
}
.info-box-left {
.alert .name-labe {
display: block;
}
.name-labe{
display: none;
}
.alert-message-info-tab {
.el-tabs.el-tabs--card.el-tabs--top {
.el-tabs__content {
#pane-alertRule{
.alert-rule-nfo{
.alert-rule-box{
display: flex;
}
}
}
#pane-detail {
.info-box-header {
.info-box-content {
@@ -433,6 +449,7 @@
.alert-label-info {
.alert-label-box {
margin-bottom: 25px;
display: flex;
.alert-label-title {
margin-right: 30px;
@@ -445,7 +462,7 @@
.alert-label-info {
.alert-label-box {
margin-bottom: 25px;
display: flex;
.alert-label-title {
margin-right: 30px;
}
@@ -457,7 +474,7 @@
.alert-label-info {
.alert-label-box {
margin-bottom: 25px;
display: flex;
.alert-label-title {
margin-right: 30px;
}
@@ -469,7 +486,7 @@
.alert-label-info {
.alert-label-box {
margin-bottom: 25px;
display: flex;
.alert-label-title {
margin-right: 30px;
}
@@ -481,7 +498,7 @@
.alert-label-info {
.alert-label-box {
margin-bottom: 25px;
display: flex;
.alert-label-title {
margin-right: 30px;
}
@@ -502,3 +519,6 @@
}
}
}

File diff suppressed because it is too large Load Diff

View File

@@ -8,12 +8,14 @@
<div v-else-if="(activeName === item.key) && infoData[item.key]" class="no-position-alert-label">
<!-- <searchItemInfo :obj="findData(item.key)" :severityData="severityData" :fa-loading="false"></searchItemInfo>-->
<alertLabel
class="alert"
v-if="item.key !=='alertRule'"
:id="infoData[item.key].id"
:that="findData2(item.key)"
:alertTableDialog="true"
:type="item.key"/>
<alertRuleInfo
class="alert"
v-else
:id="infoData[item.key].id"
:severity-data="severityData"
@@ -152,5 +154,7 @@ export default {
</script>
<style scoped>
.alert .name-labe{
display: block;
}
</style>

View File

@@ -1,5 +1,5 @@
<template>
<div style="height: 100%; width: 100%">
<div style="height: 100%; width: 100%" id="alert">
<div class="time-line-header">
<span>{{ $t("alert.relatedAlerts") }}</span>
<div class="scope-icon-box">

View File

@@ -13,6 +13,10 @@
<div class="alert-rule-title">ID</div>
<div class="alert-rule-value">{{alertRuleData.id ? alertRuleData.id : '--'}}</div>
</div>
<div class="alert-rule-box name-labe">
<div class="alert-rule-title">Name</div>
<div class="alert-rule-value">{{alertRuleData.name ? alertRuleData.name : '--'}}</div>
</div>
<!-- <div class="alert-rule-box">-->
<!-- <div class="alert-rule-title">{{$t('alert.name')}}</div>-->
<!-- <div class="alert-rule-value">{{alertRuleData.name ? alertRuleData.name : '&#45;&#45;'}}</div>-->

View File

@@ -239,8 +239,8 @@ export default {
{
label: this.$t("alert.alert"),
prop: "alertNum",
show: true,
minWidth: 120,
show: false,
width: 120,
sortable: "custom",
},
{

View File

@@ -262,7 +262,7 @@ export default {
label: this.$t('project.endpoint.alerts'),
prop: 'alerts',
show: true,
minWidth: 180,
Width: 120,
sortable: 'custom'
},
{