gfwleak/cyber-narrator-cn-ui
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: app 新增多选高亮

Browse Source
This commit is contained in:
@changcode
2022-07-21 19:24:55 +08:00
parent aac1270705
commit 49a25d0f84
2 changed files with 23 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/assets/css/components/views/charts2/networkOverviewApps.scss
View File

@@ -264,15 +264,22 @@
cursor: pointer; cursor: pointer;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.body__app-title { .body__app-content {
display: flex;
justify-content: space-between;
.body__app-left {
display: flex;
.body__app-left-title {
font-family: Helvetica-Bold; font-family: Helvetica-Bold;
font-size: 16px; font-size: 16px;
color: #353636; color: #353636;
font-weight: 700; font-weight: 700;
margin-bottom: 6px; margin-bottom: 6px;
display: flex; }
justify-content: space-between; .body__app-left-title.app-show,
.body__app-title-left { .body__app-left-title.provide-show {
color: #046ECA;
}
span { span {
i { i {
color: green; color: green;
@@ -281,7 +288,7 @@
} }
} }
} }
.body__app-title-right { .body__app-content-right {
span { span {
i { i {
color: #046ECA; color: #046ECA;

16
src/views/charts2/charts/NetworkOverviewApps.vue
View File

@@ -84,12 +84,12 @@
<el-tab-pane :label="$t('networkOverview.appType.provider')" :name="0"> <el-tab-pane :label="$t('networkOverview.appType.provider')" :name="0">
<div class="body__apps"> <div class="body__apps">
<div class="body__app" v-for="app in providerOptions" :key="app.name" @click="appCheckedChange(app, 0)"> <div class="body__app" v-for="app in providerOptions" :key="app.name" @click="appCheckedChange(app, 0)">
<div class="body__app-title"> <div class="body__app-content">
<div class="body__app-title-left"> <div class="body__app-left">
<span><i class="cn-icon cn-icon-mining-pool"></i></span> <span><i class="cn-icon cn-icon-mining-pool"></i></span>
{{app.name}},{{app.desc}} <span class="body__app-left-title" :class="{'provide-show': app.provideShow}">{{app.name}},{{app.desc}}</span>
</div> </div>
<div class="body__app-title-right" v-if="app.provideShow"><span><i class="cn-icon cn-icon-a-allclear"></i></span></div> <div class="body__app-content-right" v-if="app.provideShow"><span><i class="cn-icon cn-icon-a-allclear"></i></span></div>
</div> </div>
<div class="body__app-value">This is a description this is a description this is a description this is a description</div> <div class="body__app-value">This is a description this is a description this is a description this is a description</div>
</div> </div>
@@ -98,12 +98,12 @@
<el-tab-pane :label="$t('networkOverview.appType.app')" :name="1"> <el-tab-pane :label="$t('networkOverview.appType.app')" :name="1">
<div class="body__apps"> <div class="body__apps">
<div class="body__app" v-for="app in appOptions" :key="app.name" @click="appCheckedChange(app, 1)"> <div class="body__app" v-for="app in appOptions" :key="app.name" @click="appCheckedChange(app, 1)">
<div class="body__app-title"> <div class="body__app-content">
<div class="body__app-title-left"> <div class="body__app-left">
<span><i class="cn-icon cn-icon-mining-pool"></i></span> <span><i class="cn-icon cn-icon-mining-pool"></i></span>
{{app.name}},{{app.desc}} <span class="body__app-left-title" :class="{'app-show': app.appShow}">{{app.name}},{{app.desc}}</span>
</div> </div>
<div class="body__app-title-right" v-if="app.appShow"><span><i class="cn-icon cn-icon-a-allclear"></i></span></div> <div class="body__app-content-right" v-if="app.appShow"><span><i class="cn-icon cn-icon-a-allclear"></i></span></div>
</div> </div>
<div class="body__app-value">This is a description this is a description this is a description this is a description</div> <div class="body__app-value">This is a description this is a description this is a description this is a description</div>
</div> </div>