fix: Provider和Applications快捷图表添加标题,以及修改增加提示框名称问题

This commit is contained in:
刘洪洪
2022-10-20 16:13:05 +08:00
parent f9e6250e2a
commit ae8918f7f7
2 changed files with 58 additions and 44 deletions

View File

@@ -1,46 +1,57 @@
.network-overview-apps {
height: 100%;
.line-select-metric {
.network-overview-apps-header {
display: flex;
justify-content: flex-end;
align-items: center;
justify-content: space-between;
&>span {
font-size: 12px;
color: #575757;
font-weight: 400;
margin-right: 3px;
.network-overview-apps-title {
font-size: 14px;
color: #353636;
font-weight: 600;
height: 32px;
}
.line-select__operation {
height: 24px;
margin-left: 3px;
box-shadow: none;
border-radius: 2px;
.el-input__inner {
width: 100px;
height: 24px;
padding-left: 4px;
line-height: 24px;
.line-select-metric {
display: flex;
justify-content: flex-end;
align-items: center;
&>span {
font-size: 12px;
color: #2C72C6;
color: #575757;
font-weight: 400;
margin-right: 3px;
}
.el-input__suffix {
display: flex;
.el-input__suffix-inner {
.line-select__operation {
height: 24px;
margin-left: 3px;
box-shadow: none;
border-radius: 2px;
.el-input__inner {
width: 100px;
height: 24px;
padding-left: 4px;
line-height: 24px;
.el-select__caret {
font-size: 12px;
color: #2C72C6;
font-weight: 400;
}
.el-input__suffix {
display: flex;
.el-input__suffix-inner {
line-height: 24px;
width: 16px;
color: #575757;
.el-select__caret {
line-height: 24px;
width: 16px;
color: #575757;
}
}
}
}
}
}
.app-cards {
display: grid;
grid-template-rows: repeat(auto-fill, 100px);

View File

@@ -1,20 +1,24 @@
<template>
<div class="network-overview-apps">
<div class="line-select-metric">
<span>{{$t('network.metric')}}:</span>
<div class="line-select__operation">
<el-select
size="mini"
v-model="metricFilter"
placeholder=""
popper-class="common-select"
:popper-append-to-body="false"
@change="metricChange"
>
<el-option v-for="item in metricOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
<div class="network-overview-apps-header">
<div class="network-overview-apps-title">{{$t('networkOverview.appType.providerAndApp')}}</div>
<div class="line-select-metric">
<span>{{$t('network.metric')}}:</span>
<div class="line-select__operation">
<el-select
size="mini"
v-model="metricFilter"
placeholder=""
popper-class="common-select"
:popper-append-to-body="false"
@change="metricChange"
>
<el-option v-for="item in metricOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</div>
</div>
</div>
<div class="app-cards">
<div class="app-card" v-for="(app, index) in appData" :key="index">
<div class="app-card-title">
@@ -219,7 +223,7 @@ export default {
}
},
timeFilter: {
handler (n) {
handler () {
this.init()
}
}
@@ -463,7 +467,6 @@ export default {
},
addApp (pageNo, val, show) {
this.showAddApp = true
const letter = 'abcdefghijklmnopqrstuvwxyz'
const params = {
startTime: getSecond(this.timeFilter.startTime),
endTime: getSecond(this.timeFilter.endTime),
@@ -482,7 +485,7 @@ export default {
} else {
params.pageNo = 1
}
if (this.appTypeTab == 0) {
if (this.appTypeTab === 0) {
params.type = 'overviewProvide'
get(api.dict, params).then(res => {
if (res.code === 200) {
@@ -507,7 +510,7 @@ export default {
this.loading = false
this.loadingBody = false
})
} else if (this.appTypeTab == 1) {
} else if (this.appTypeTab === 1) {
params.type = 'overviewApp'
get(api.dict, params).then(res => {
res.data.list = res.data.list.filter(l => !this.appData.some(pd => pd.type === 'app' && pd.name === l.value))
@@ -547,7 +550,7 @@ export default {
cancelApp () {
this.showAddApp = false
},
appTypeTabChange (val) {
appTypeTabChange () {
this.pageObj.pageNo = 1
this.searcherApp = ''
this.addApp()