page { background-color: #f5f5f5; } .filter { margin: 0 10rpx 10rpx 10rpx; width: calc(100vw - 20rpx); height: 80rpx; display: flex; flex-direction: row; background-color: white; border-radius: 10rpx; align-items: center; position: sticky; top: 0; border-bottom: 1rpx solid #f5f5f5; } .filter picker { flex: 1; display: flex; align-items: center; justify-content: center; } .cu-item { font-size: 30rpx; font-weight: bold; } .search { height: 90rpx; background-color: #f5f5f5; } .cu-bar .search-form { background: #FFFFFF; box-shadow: 0rpx 0rpx 12rpx 2rpx #DDECF3; border-radius: 12rpx; } .item-bg { padding: 0 32rpx 20rpx 32rpx; background-color: #f5f5f5; } .item { background-color: #ffffff; padding: 32rpx 20rpx 20rpx 20rpx; position: relative; border-radius: 10rpx; z-index: 2; } .item .head { margin: 0 -20rpx; margin-top: -32rpx; background-color: #CDE5FC; padding: 16rpx; border-radius: 10rpx 10rpx 0 0; } .item .head .single { width: 8rpx; height: 36rpx; background: #4882EE; border-radius: 4rpx; } .item .head .title { flex: 1; margin-left: 16rpx; font-size: 28rpx; font-weight: bold; color: #4882EE; } .item .head .status { font-weight: bold; font-size: 28rpx; } .item .tv { font-size: 32rpx; color: #222222; padding-top: 20rpx; margin-bottom: 10rpx; } .item .time { font-size: 26rpx; color: #666666; padding-top: 10rpx; } .item .done { color: rgb(12, 118, 240); border-radius: 8rpx; padding: 5rpx 20rpx; background-color: rgba(0, 0, 0, 0.2); } .item .bottom { font-size: 26rpx; font-weight: bold; color: #222222; } .item .g-container { flex: 1; height: 16rpx; border-radius: 50rpx; background: #eee; margin: 20rpx 0; } .item .g-progress { width: 50%; height: inherit; border-radius: 50rpx; } .item .val { font-size: 26rpx; font-weight: 500; color: #222222; margin-left: 20rpx; } .item .line { margin: 20rpx -20rpx; border-top: 2rpx dashed #f5f5f5; } .item .bottom-img { width: calc(100vw - 65rpx); max-width: calc(100vw - 65rpx); height: 40rpx; margin: 0 -20rpx; position: absolute; bottom: 0; z-index: -1; } .center{ display: flex; justify-content: space-between; align-items: center; } .content_img{ width: 180rpx; height: 140rpx; } .content_img image{ width: 100%; height: 100%; }