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

style修改样式：折线图下面的table

Browse Source
This commit is contained in:
晶晶 张
2021-07-09 19:42:11 +08:00
parent cca3cb3534
commit 23e78b0a84
1 changed files with 8 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/components/charts/StatisticsLegend.vue
View File

@@ -9,12 +9,12 @@
<div class="chart__table-below"> <div class="chart__table-below">
<div v-for="(item,index) in data" :key="index" class="table-below-box"> <div v-for="(item,index) in data" :key="index" class="table-below-box">
<div class="table-below-account"> <div class="table-below-account">
<div :style="{backgroundColor: getChartColor(index)}" class="table__below-color"></div> <div :style="{backgroundColor: getChartColor(index)}" class="table__below-color" :title="getChartColor(index)"></div>
<div class="table__below-title">{{item.legend}}</div> <div class="table__below-title" :title="item.legend">{{item.legend}}</div>
</div> </div>
<div class="table__below-flashback"> <div class="table__below-flashback">
<div class="table__below-max">{{item.aggregation.max}}</div> <div class="table__below-max qq" :title="item.aggregation.max">{{item.aggregation.max}}</div>
<div class="table__below-avg">{{item.aggregation.avg}}</div> <div class="table__below-avg qq" :title="item.aggregation.avg">{{item.aggregation.avg}}</div>
</div> </div>
</div> </div>
</div> </div>
@@ -35,7 +35,6 @@ export default {
immediate: true, immediate: true,
deep: true, deep: true,
handler (n) { handler (n) {
console.log(n)
} }
} }
}, },
@@ -77,8 +76,8 @@ export default {
} }
.chart__table-below{ .chart__table-below{
width: 455px; width: 455px;
overflow: auto;
height: calc(100% - 30px); height: calc(100% - 30px);
overflow: auto;
.table-below-box{ .table-below-box{
width: 100%; width: 100%;
display: flex; display: flex;
@@ -86,14 +85,12 @@ export default {
align-items: center; align-items: center;
.table-below-account{ .table-below-account{
width: 310px; width: 310px;
height: calc(100% - 30px);
display: flex; display: flex;
align-items: center; align-items: center;
padding-left: 16px; padding-left: 16px;
} }
.table__below-flashback{ .table__below-flashback{
width: 211px; width: 211px;
height: calc(100% - 30px);
display: flex; display: flex;
flex-direction:row-reverse; flex-direction:row-reverse;
align-items: center; align-items: center;
@@ -111,14 +108,13 @@ export default {
border-radius: 24%; border-radius: 24%;
} }
.table__below-title{ .table__below-title{
max-width: 141px; max-width: 226px;
overflow: hidden; overflow: hidden;
text-overflow:ellipsis; text-overflow:ellipsis;
white-space: nowrap; white-space: nowrap;
} }
.table__below-avg{ .qq{
width: 39px;
} }
} }
.table__below-max{
}
</style> </style>