You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
274 lines
4.4 KiB
274 lines
4.4 KiB
.Project{
|
|
width: 711rpx;
|
|
height: auto;
|
|
background: #fff;
|
|
margin:20rpx 20rpx 20rpx 19rpx;
|
|
border-radius: 10rpx;
|
|
overflow: hidden;
|
|
padding-bottom: 20rpx;
|
|
|
|
}
|
|
.header{
|
|
height: 108rpx;
|
|
/* border: 1rpx solid red; */
|
|
margin-top: 45rpx;
|
|
position: relative;
|
|
}
|
|
.num{
|
|
width: 200rpx;
|
|
height: 100%;
|
|
text-align: center;
|
|
border-right: 1rpx solid #E8E8E8;
|
|
}
|
|
.text1{
|
|
display: block;
|
|
color: #333333;
|
|
font-size: 50rpx;
|
|
font-weight: bold;
|
|
}
|
|
.text2{
|
|
color: #92949B;
|
|
font-size: 26rpx;
|
|
}
|
|
.type{
|
|
position: absolute;
|
|
left: 240rpx;
|
|
top: 0;
|
|
color: #666666;
|
|
font-size: 30rpx;
|
|
height: 100%;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.type-view{
|
|
margin-bottom: 30rpx;
|
|
}
|
|
.text3,.text4{
|
|
color: #92949B;
|
|
font-size: 26rpx;
|
|
}
|
|
.circle{
|
|
width: 106rpx;
|
|
height:46rpx;
|
|
}
|
|
.image{
|
|
position: absolute;
|
|
right: 0;
|
|
top: 20%;
|
|
transform: translate(-15%, -50%);
|
|
}
|
|
.image2{
|
|
position: absolute;
|
|
right: 0;
|
|
top: 85%;
|
|
transform: translate(-15%, -50%);
|
|
}
|
|
.image text{
|
|
position: absolute;
|
|
left: 50%;
|
|
top: 40%;
|
|
transform: translate(-50%, -50%);
|
|
font-size: 26rpx;
|
|
color: #F5F6FA;
|
|
}
|
|
ec-canvas {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.container{
|
|
width: 100%;
|
|
height: 220rpx;
|
|
box-sizing: border-box;
|
|
margin-top: 20rpx;
|
|
/* margin-bottom: 20rpx; */
|
|
display: flex;
|
|
flex-shrink: 0;
|
|
/* padding: 20rpx; */
|
|
}
|
|
.echarts1{
|
|
width: 190rpx;
|
|
height: 190rpx;
|
|
margin-left: 16px;
|
|
flex-shrink: 0;
|
|
}
|
|
.echarts{
|
|
width: 190rpx;
|
|
height: 190rpx;
|
|
}
|
|
.echarts2{
|
|
width: 138rpx;
|
|
height: 138rpx;
|
|
margin-top: 30rpx;
|
|
margin-left: 40rpx;
|
|
flex-shrink: 0;
|
|
}
|
|
.echarts-circle{
|
|
width: 138rpx;
|
|
height: 138rpx;
|
|
|
|
}
|
|
.top{
|
|
width: 204rpx;
|
|
height: 1rpx;
|
|
background: red;
|
|
position: absolute;
|
|
left: 306rpx;
|
|
top: 861rpx;
|
|
transform: rotate(8.5deg);
|
|
}
|
|
.bottom{
|
|
width: 254rpx;
|
|
height: 1rpx;
|
|
background: #E6E6E6;
|
|
/* background: red; */
|
|
position: fixed;
|
|
left: 273rpx;
|
|
top: 988rpx;
|
|
transform: rotate(-7deg);
|
|
}
|
|
.left{
|
|
margin-left: 15px;
|
|
color: #999999;
|
|
font-size: 22rpx;
|
|
vertical-align: middle;
|
|
margin-top: 60rpx;
|
|
width: 120rpx;
|
|
flex-shrink: 0;
|
|
}
|
|
.left-circle{
|
|
width: 10rpx;
|
|
height: 10rpx;
|
|
background: #29B9A5;
|
|
border-radius: 50%;
|
|
display: inline-block;
|
|
}
|
|
.des{
|
|
width: 120rpx;
|
|
height: 72rpx;
|
|
margin-top: 10rpx;
|
|
}
|
|
.percent{
|
|
color: #29B9A5;
|
|
margin-left: 25rpx;
|
|
}
|
|
.right{
|
|
color: #999999;
|
|
font-size: 22rpx;
|
|
vertical-align: middle;
|
|
width: 160rpx;
|
|
height: 50rpx;
|
|
box-sizing: border-box;
|
|
}
|
|
.right2{
|
|
color: #999999;
|
|
font-size: 22rpx;
|
|
vertical-align: middle;
|
|
width: 160rpx;
|
|
height: 50rpx;
|
|
box-sizing: border-box;
|
|
margin-top: 10rpx;
|
|
}
|
|
.per{
|
|
display: inline-block;
|
|
margin-top: 50rpx;
|
|
}
|
|
.bacColor1{
|
|
background: #63CFED;
|
|
}
|
|
.bacColor2{
|
|
background: #FF773F;
|
|
}
|
|
.right text{
|
|
color: #63CFED;
|
|
font-size: 24rpx;
|
|
}
|
|
.right2 text{
|
|
color: #FF773F;
|
|
font-size: 24rpx;
|
|
}
|
|
.footer{
|
|
box-sizing: border-box;
|
|
width: 670rpx;
|
|
height: auto;
|
|
margin: auto;
|
|
background: #F5F6F8;
|
|
padding: 5rpx 17rpx 15rpx 49rpx;
|
|
color: #9DA9B2;
|
|
}
|
|
.footer-num{
|
|
width: 163rpx;
|
|
/* height: 72rpx; */
|
|
border-right: 1rpx solid #DFE0E1;
|
|
display: inline-block;
|
|
text-align: center;
|
|
}
|
|
.footer-num-text{
|
|
display: block;
|
|
color: #00A8D6;
|
|
font-size: 34rpx;
|
|
font-weight: bold;
|
|
box-sizing: border-box;
|
|
}
|
|
.footer-num-text2{
|
|
font-size: 24rpx;
|
|
}
|
|
.resolve,.unresolved{
|
|
font-size: 24rpx;
|
|
color: #9DA9B2;
|
|
display: inline-block;
|
|
/* vertical-align: middle; */
|
|
margin-left: 40rpx;
|
|
/* margin-top: 20rpx; */
|
|
margin-top: 23rpx;
|
|
vertical-align: top;
|
|
|
|
}
|
|
.resolve-text1,.resolve-text2{
|
|
color:#666666;
|
|
font-size: 26rpx;
|
|
font-weight: bold;
|
|
}
|
|
.unresolved{
|
|
/* left: 420rpx; */
|
|
}
|
|
.footer-icon{
|
|
width: 36rpx;
|
|
height: 36rpx;
|
|
line-height: 36rpx;
|
|
border-radius: 50%;
|
|
border: 1rpx solid #FF773F;
|
|
color: #FF773F;
|
|
text-align: center;
|
|
display: inline-block;
|
|
margin-left: 80rpx;
|
|
vertical-align: top;
|
|
margin-top: 23rpx;
|
|
}
|
|
.state{
|
|
color: #B6BAC6;
|
|
font-size: 20rpx;
|
|
margin-top: 5rpx;
|
|
display: block;
|
|
|
|
}
|
|
.clearfix:after{
|
|
|
|
content: "020";
|
|
|
|
display: block;
|
|
|
|
height: 0;
|
|
|
|
clear: both;
|
|
|
|
visibility: hidden;
|
|
|
|
}
|
|
|
|
.clearfix {
|
|
|
|
/* 触发 hasLayout */
|
|
|
|
zoom: 1;
|
|
|
|
}
|
|
|