fix 优化

This commit is contained in:
duanliang
2024-12-20 15:49:26 +08:00
parent 8e9123ca65
commit 818c42f7b0
5 changed files with 76 additions and 7 deletions

View File

@@ -126,6 +126,19 @@
padding:vw(20); padding:vw(20);
.rt-v-box{ .rt-v-box{
overflow-y: auto; overflow-y: auto;
/* 滚动条整体样式 */
&::-webkit-scrollbar {
width: vw(4); /* 滚动条的宽度 */
}
/* 滚动条轨道 */
&::-webkit-scrollbar-track {
background: 'transparent'; /* 轨道的背景色 */
}
/* 滚动条滑块 */
&::-webkit-scrollbar-thumb {
background: rgba(0, 150, 255, 0.63); /* 滑块的背景色 */
border-radius: 5px; /* 滑块的圆角 */
}
height:100%; height:100%;
} }
.title{ .title{

View File

@@ -369,7 +369,7 @@
right:vw(20); right:vw(20);
top:vh(15); top:vh(15);
span{ span{
width: vw(55); min-width: vw(55);
padding:vw(5); padding:vw(5);
background: linear-gradient( 270deg, rgba(8,41,86,0.16) 0%, #0B61B4 100%); background: linear-gradient( 270deg, rgba(8,41,86,0.16) 0%, #0B61B4 100%);
border-radius: vw(50); border-radius: vw(50);

View File

@@ -29,8 +29,19 @@
z-index:99; z-index:99;
padding:0 vw(20); padding:0 vw(20);
.list{ .list{
scrollbar-width: none; /* 滚动条整体样式 */
scrollbar-color: transparent transparent; &::-webkit-scrollbar {
width: vw(4); /* 滚动条的宽度 */
}
/* 滚动条轨道 */
&::-webkit-scrollbar-track {
background: 'transparent'; /* 轨道的背景色 */
}
/* 滚动条滑块 */
&::-webkit-scrollbar-thumb {
background: rgba(0, 150, 255, 0.63); /* 滑块的背景色 */
border-radius: 5px; /* 滑块的圆角 */
}
height:vh(895); height:vh(895);
overflow: auto; overflow: auto;
.li:nth-child(odd){ .li:nth-child(odd){

View File

@@ -26,7 +26,12 @@
<div class="chart-box flex"> <div class="chart-box flex">
<div class="lt-chart"> <div class="lt-chart">
<div class="title-3"><span>异常告警占比</span></div> <div class="title-3"><span>异常告警占比</span></div>
<div class="box"> <div class="box chart-p">
<div class="check-label">
<span class="active">全部</span>
<span>已完成总数</span>
</div>
<v-chart class="line-chart" :option="optionLine" autoresize /> <v-chart class="line-chart" :option="optionLine" autoresize />
</div> </div>
</div> </div>
@@ -395,7 +400,7 @@
}) })
const optionLine = ref({ const optionLine = ref({
backgroundColor:'transparent', backgroundColor:'transparent',
height:240, height:fitChartSize(240),
grid:{ grid:{
top:'30', top:'30',
bottom:'0', bottom:'0',
@@ -499,6 +504,35 @@
.line-chart{ .line-chart{
// margin-top:vh(20); // margin-top:vh(20);
} }
.chart-p{
position:relative;
.check-label{
position:absolute;
right:vw(20);
top:vh(-15);
span{
min-width: vw(55);
padding:vw(5);
background: linear-gradient( 270deg, rgba(8,41,86,0.16) 0%, #0B61B4 100%);
border-radius: vw(50);
// border: 1px solid rgba(0,114,220,0.3);
margin-left:vw(5);
display: inline-block;
font-weight: 400;
font-size: vw(13);
color: #0084FF;
text-align: center;
font-style: normal;
text-transform: none;
}
.active{
background: linear-gradient( 270deg, #37D8FC 0%, #0084FF 100%);
border-radius: vw(50);
border: 1px solid rgba(0,114,220,0.3);
color:#fff;
}
}
}
.work-box-2{ .work-box-2{
width:vw(1522); width:vw(1522);
height:vh(965); height:vh(965);

View File

@@ -210,8 +210,19 @@
z-index:99; z-index:99;
padding:0 vw(20); padding:0 vw(20);
.list{ .list{
scrollbar-width: none; /* 滚动条整体样式 */
scrollbar-color: transparent transparent; &::-webkit-scrollbar {
width: vw(4); /* 滚动条的宽度 */
}
/* 滚动条轨道 */
&::-webkit-scrollbar-track {
background: 'transparent'; /* 轨道的背景色 */
}
/* 滚动条滑块 */
&::-webkit-scrollbar-thumb {
background: rgba(0, 150, 255, 0.63); /* 滑块的背景色 */
border-radius: 5px; /* 滑块的圆角 */
}
height:vh(510); height:vh(510);
overflow: auto; overflow: auto;
.li:nth-child(odd){ .li:nth-child(odd){