/**index.wxss**/ .iconPanel { display: flex; padding: 40rpx 0; background: #007dff; } .iconPanel .item { flex: 1; width: 0; } .iconPanel .item .iconfont { display: block; margin: 0 auto; width: 64rpx; height: 64rpx; font-size: 64rpx; color: #fff; } .iconPanel .item .text { display: block; margin-top: 34rpx; height: 30rpx; line-height: 30rpx; font-size: 30rpx; color: #fefefe; text-align: center; } .topWrapper { padding: 0 24rpx; background: #fff; box-shadow: 0 0 10rpx rgba(215, 217, 227, .35); } .companySwitch { display: flex; align-items: center; justify-content: space-between; padding: 40rpx 0; font-size: 30rpx; } .companySwitch .name { flex: 1; width: 0; font-weight: 450; } .companySwitch .switch { display: flex; align-items: center; } .companySwitch .switch .text { height: 30rpx; line-height: 30rpx; color: #b3b6c3; } .companySwitch .switch .iconfont { margin-bottom: 4rpx; margin-left: 18rpx; height: 32rpx; line-height: 32rpx; font-size: 32rpx; color: #007dff; } .swiper { width: 100%; height: 330rpx; } .swiper .pic { width: 100%; height: 330rpx; border-radius: 20rpx; box-shadow: 0 0 20rpx rgba(0, 125, 255, .3); } .iconList { padding: 23rpx 0; overflow: hidden; } .iconList .item { padding: 17rpx 0; float: left; width: 25%; text-align: center; } .iconList .item .icon { display: block; margin: 0 auto; width: 70rpx; height: 70rpx; } .iconList .item .text { margin-top: 16rpx; display: block; height: 26rpx; line-height: 26rpx; font-weight: 400; } .bottomWrapper { padding: 24rpx 24rpx 60rpx; } .notice { display: flex; align-items: center; height: 70rpx; background: #fff; border-radius: 35rpx; box-shadow: 0 0 10rpx rgba(215, 217, 227, .35); } .notice .label { padding-left: 24rpx; display: flex; align-items: center; } .notice .label .text { display: block; height: 70rpx; line-height: 70rpx; color: #383838; } .notice .label .icon { margin-left: 4rpx; width: 57rpx; height: 28rpx; } .notice .content { padding: 0 36rpx 0 16rpx; flex: 1; width: 0; height: 70rpx; overflow: hidden; } .notice .content .text { display: block; height: 70rpx; line-height: 70rpx; font-size: 24rpx; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .notice .detail { position: relative; height: 70rpx; line-height: 70rpx; padding: 0 24rpx; font-size: 24rpx; color: #fc5260; } .notice .detail:before { content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 0; background: #d2d2d2; height: 30rpx; width: 2rpx; } .lineGroup { margin-top: 24rpx; display: flex; align-items: center; border-radius: 16rpx; background: #fff; box-shadow: 0 0 10rpx rgba(215, 217, 227, .35); } .lineGroup .item { position: relative; flex: 1; width: 0; height: 88rpx; display: flex; align-items: center; justify-content: center; } .lineGroup .item+.item:before { content: ""; content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 0; background: #dbdce2; height: 48rpx; width: 2rpx; } .lineGroup .item .label { display: block; height: 88rpx; line-height: 88rpx; color: #b3b6c3; } .lineGroup .item .content { display: flex; align-items: center; } .lineGroup .item .content .text { display: block; height: 88rpx; line-height: 88rpx; } .blue { color: #007bff; } .green { color: #3ccbc7; } .warning { color: #ff8c42; } .danger { color: #fd2d61; } .lineGroup .item .content .iconfont { margin-left: 30rpx; width: 36rpx; height: 88rpx; line-height: 88rpx; font-size: 36rpx; color: #007dff; } .lineGroup .item .content .icon-fail { color: #d81e06; } .totalHead { padding: 40rpx 0; line-height: 30rpx; font-size: 30rpx; font-weight: 450; } .lineGroup2 { display: flex; align-items: center; border-radius: 16rpx; background: #fff; box-shadow: 0 0 10rpx rgba(215, 217, 227, .35); } .lineGroup2+.lineGroup2 { margin-top: 24rpx; } .lineGroup2 .item { position: relative; padding: 40rpx 0; flex: 1; width: 0; text-align: center; } .lineGroup2 .item+.item:before { content: ""; content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 0; background: #dbdce2; height: 88rpx; width: 2rpx; } .lineGroup2 .item .content { display: block; height: 48rpx; line-height: 48rpx; font-size: 48rpx; font-weight: 450; color: #383838; } .lineGroup2 .item .content .unit{ font-size:26rpx; } .lineGroup2 .item .label { margin-top: 26rpx; display: block; height: 26rpx; line-height: 26rpx; color: #b3b6c3; } .tabWrapper { margin-top: 24rpx; padding: 30rpx 30rpx 40rpx; border-radius: 16rpx; background: #fff; box-shadow: 0 0 10rpx rgba(215, 217, 227, .35); } .tabBar { display: flex; align-items: center; justify-content: center; margin-bottom: 48rpx; } .tabBar .item { width: 126rpx; height: 46rpx; line-height: 46rpx; text-align: center; color: #007dff; background: #fff; transition: all .3s ease; border: solid #eee 1rpx; box-sizing: content-box; } .tabBar .item+.item { border-left: none; } .tabBar .item.active { color: #b3b6c3; background: #f8f9fb; } .tabWrapper .lineItem { display: flex; align-items: center; height: 30rpx; font-size: 30rpx; } .tabWrapper .lineItem+.lineItem { margin-top: 40rpx; } .tabWrapper .lineItem .label { padding-left: 78rpx; flex: 1; width: 0; color: #767b89; } .tabWrapper .lineItem .content { padding-left: 78rpx; flex: 1; width: 0; text-align: left; font-weight: 450; }