gfwleak/nezha-nezha-fronted
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf: label样式变更等

Browse Source 
1.label样式变更
2.用户登录拦截新增一些状态码
This commit is contained in:
chenjinsong
2020-05-11 16:11:06 +08:00
parent a694f0ffbb
commit 64f244aa7a
4 changed files with 122 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTab.vue
View File

@@ -88,10 +88,14 @@
<span v-else>-</span>
</div>-->
<template v-else-if="item.prop == 'labels'">
<el-tag v-if="key != 'alertname' && key != 'severity'"
<nz-alert-tag :label="key" type="info" style="margin: 5px;"
:cursor-point="false"
v-if="key != 'alertname' && key != 'severity'"
v-for="(value, key) in scope.row.labels">{{value}}</nz-alert-tag>
<!--<el-tag v-if="key != 'alertname' && key != 'severity'"
:key="key"
type="info"
size="mini" v-for="(value, key) in scope.row.labels" class="alert-message-tag">{{tagValue(key, value)}}</el-tag>
size="mini" v-for="(value, key) in scope.row.labels" class="alert-message-tag">{{tagValue(key, value)}}</el-tag>-->
</template>
<div v-else-if="item.prop == 'state'">
<span class="">
@@ -162,10 +166,12 @@
</template>
<script>
import axios from 'axios'
import axios from 'axios';
import nzAlertTag from '../../../page/alert/nzAlertTag';
export default {
name: "alertMessageTab",
components: {
'nz-alert-tag': nzAlertTag
},
props: {
from: String, //来自哪个主页面，有："asset"、"alertRule"
@@ -477,7 +483,7 @@
}
},
labelsClassName(row) {
if (row.columnIndex == 2) {
if (row.column.label == this.$t("alert.list.labels")) {
return "alert-message-list-labels";
} else {
return "";

18
nezha-fronted/src/components/page/alert/list.vue
View File

@@ -99,12 +99,17 @@
<span v-else>-</span>
</div>-->
<template v-else-if="item.prop == 'labels'">
<el-tag @click="showTagDetail(scope.row, key)"
<nz-alert-tag :label="key" :type="tagType(key)" style="margin: 5px;"
:cursor-point="tagType(key) == 'info' ? false : true"
@click="showTagDetail(scope.row, key)"
v-if="key != 'alertname' && key != 'severity'"
v-for="(value, key) in scope.row.labels">{{value}}</nz-alert-tag>
<!--<el-tag @click="showTagDetail(scope.row, key)"
:key="key"
:class="{'link': key == 'asset' || key == 'endpoint' || key == 'project' || key == 'module' || key == 'datacenter'}"
v-if="key != 'alertname' && key != 'severity'"
:type="tagType(key)"
size="mini" v-for="(value, key) in scope.row.labels" class="alert-message-tag">{{tagValue(key, value)}}</el-tag>
size="mini" v-for="(value, key) in scope.row.labels" class="alert-message-tag">{{tagValue(key, value)}}</el-tag>-->
</template>
<div v-else-if="item.prop == 'state'">
<span class="">
@@ -184,9 +189,14 @@
<script>
import bus from '../../../libs/bus';
import axios from 'axios'
import nzAlertTag from './nzAlertTag'
var vm;
export default {
name: "alertList",
components: {
'nz-alert-tag': nzAlertTag
},
data() {
vm = this;
return {
@@ -364,7 +374,7 @@
tagType() {
return (key) => {
if (key == 'asset' || key == 'module' || key == 'project' || key == 'datacenter' || key == 'endpoint') {
return "";
return "normal";
} else {
return "info";
}
@@ -556,7 +566,7 @@
}
},
labelsClassName(row) {
if (row.columnIndex == 2) {
if (row.column.label == this.$t("alert.list.labels")) {
return "alert-message-list-labels";
} else {
return "";

96
nezha-fronted/src/components/page/alert/nzAlertTag.vue Normal file
View File

@@ -0,0 +1,96 @@
<template>
<span class="nz-alert-tag" :class="['nz-alert-tag_' + type]" :style="{cursor: cursorPoint ? 'pointer' : 'default'}" @click="$emit('click')">
<span class="nz-alert-tag__label">{{label}}</span>
<span class="nz-alert-tag__content"><slot></slot></span>
</span>
</template>
<script>
export default {
name: "nzAlertTag",
props: {
label: String, //标题
type: {type: String, default: "normal"}, //normal:blue; success:green; info:gray; danger:red; warning:orange;
cursorPoint: {type: Boolean, default: true}, //是否鼠标悬停变手指
},
methods: {
},
computed: {
}
}
</script>
<style scoped lang="scss">
.nz-alert-tag {
border: 1px solid;
height: 20px;
font-size: 12px;
line-height: 20px;
border-radius: 4px;
display: inline-block;
}
.nz-alert-tag__label {
border-radius: 3px 0 0 3px;
padding: 0 4px;
min-width: 36px;
max-width: 100px;
text-align: center;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
word-break: break-all;
display: inline-block;
}
.nz-alert-tag__content {
border-radius: 0 3px 3px 0;
padding: 0 4px;
min-width: 36px;
max-width: 100px;
text-align: center;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
word-break: break-all;
display: inline-block;
}
.nz-alert-tag_normal {
border-color: #409eff;
.nz-alert-tag__label {
border-right: 1px solid #409eff;
background-color: #409eff;
color: white;
}
}
.nz-alert-tag_success {
border-color: #50d050;
.nz-alert-tag__label {
border-right: 1px solid #50d050;
background-color: #50d050;
color: white;
}
}
.nz-alert-tag_info {
border-color: #909399;
.nz-alert-tag__label {
border-right: 1px solid #909399;
background-color: #909399;
color: white;
}
}
.nz-alert-tag_danger {
border-color: #d64f40;
.nz-alert-tag__label {
border-right: 1px solid #d64f40;
background-color: #d64f40;
color: white;
}
}
.nz-alert-tag_warning {
border-color: #e6a23c;
.nz-alert-tag__label {
border-right: 1px solid #e6a23c;
background-color: #e6a23c;
color: white;
}
}
</style>

6
nezha-fronted/src/http.js
View File

@@ -20,14 +20,12 @@ axios.interceptors.request.use(config => {
},
err => Promise.reject(err)
);
const accountErrorCode = [518003, 518004, 518005, 518006, 518007, 518008]; //账号锁定等
axios.interceptors.response.use(
response => {
if(response.status === 200){
if(response.data.code == 518008) {
if(accountErrorCode.indexOf(response.data.code) != -1) {
window.location.href = "/";
/*router.push({
path: "/login"
});*/
}
}
return response