.header { width: 100%; padding: 16rpx 34rpx 0; box-sizing: border-box; position: relative; height: 400rpx; } .bg { position: absolute; width: 100%; height: 302rpx; left: 0; top: 0; z-index: -99; } .amount { z-index: 10; } .priceBox { position: absolute; bottom: 0; left: 34rpx; height: 120rpx; width: 682rpx; box-sizing: border-box; background: #F3F5F7; border-radius: 16rpx; display: flex; align-items: center; padding: 0 24rpx; box-sizing: border-box; } .titleBox { position: relative; width: 100%; height: 302rpx; display: flex; flex-direction: column; z-index: 1; } .title { padding-left: 24rpx; padding-top: 24rpx; color: #ffffff; font-size: 36rpx; font-weight: 700; } .amount { display: flex; justify-content: space-evenly; flex: 1; align-content: center; } .amount .detail { display: flex; flex-direction: column; justify-content: center; align-items: center; } .detail .number { color: #ffffff; text-align: center; font-size: 48rpx; letter-spacing: 1rpx; } .detail .desc { margin-top: 8rpx; color: #ffffff; text-align: center; font-size: 32rpx; font-weight: 500; } .cooPriceBox { margin-top: 46rpx; display: flex; justify-content: space-between; width: 100%; align-items: center; z-index: 10; } .cooPrice { display: flex; align-items: center; } .cooPrice .desc { color: #808080; text-align: center; font-size: 28rpx; font-weight: 500; } .cooPrice .num { margin-left: 8rpx; display: flex; color: #367df9; text-align: center; font-size: 36rpx; font-weight: 700; } .edit image { margin-top: 46rpx; margin-left: 72rpx; display: block; width: 32rpx; height: 32rpx; z-index: 10; } .main { /* margin-top: 24rpx; */ padding: 0 34rpx; height: calc(100% - 400rpx); box-sizing: border-box; } .scroll { height: calc(100% - 110rpx); } .mainHeader { display: flex; justify-content: space-between; align-items: center; height: 106rpx; padding-top: 24rpx; box-sizing: border-box; } .mainHeader .desc { color: #393939; text-align: center; font-size: 36rpx; font-weight: 700; } .search { position: relative; color: #808080; font-size: 24rpx; font-weight: 500; margin-right: 32rpx; } .search::after { position: absolute; content: ''; right: -30rpx; top: 50%; width: 0px; height: 0px; border-left: 12rpx solid transparent; border-right: 12rpx solid transparent; border-top: 12rpx solid #808080; } .emptyData { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 250px; } .emptyData image { display: block; width: 166px; height: 194px; } .emptyDataText { margin-top: 24px; color: #898989ff; font-size: 13px; font-weight: 400; text-align: center; } .input-body { position: fixed; left: 0; top: 0; right: 0; width: 100vw; height: 100vh; background: rgba(0, 0, 0, 0.5); z-index: 10; } .input-body .input-modal { position: absolute; left: 50%; top: 50%; border-radius: 16rpx; width: 540rpx; transform: translate(-50%, -50%); background-color: #fff; } .input-body .input-modal .modal-headr { padding: 32rpx 0 16rpx; text-align: center; color: #434343; height: 64rpx; color: #363636; text-align: center; font-size: 32rpx; font-weight: 700; line-height: 44rpx; } .input-body .input-modal .modal-body { display: flex; flex-direction: row; margin: 50rpx 20rpx; padding: 0 20rpx; } .input-modal .modal-footer { position: relative; display: flex; } .modal-footer::after { position: absolute; content: ''; left: 50%; top: 50%; width: 2rpx; height: 50%; background: #F3F5F7; transform: translateY(-50%) } .input-modal .modal-footer>view { flex-grow: 1; height: 90rpx; box-sizing: border-box; text-align: center; line-height: 90rpx; } .oil-footer { font-size: 32rpx; } .editInput { display: flex; font-size: 30rpx; justify-content: space-between; height: 68rpx; padding: 0 16rpx; align-items: center; border-radius: 8rpx; background: #F5F8FE; margin-left: 24rpx; margin-right: 42rpx; box-sizing: border-box; margin-bottom: 16rpx; } .oilInput { flex: 1; } .price { display: flex; flex: 1; } .price .desc { position: relative; display: flex; align-items: center; width: 112rpx; color: #363636; font-size: 28rpx; font-weight: 500; } .price .desc::after { position: absolute; right: 16rpx; top: 50%; content: ''; width: 2rpx; height: 50%; background: #8A8E9B; transform: translateY(-50%) } .unit { width: 40rpx; top: 14rpx; color: #191b27; font-size: 26rpx; font-weight: 400; } .modify { color: #f3c010; border: 1rpx solid #f3c010; margin-left: 10rpx; border-radius: 10rpx; padding: 0 8rpx; } .scan{ position: fixed; bottom: 120rpx; right: 72rpx; width: 104rpx; height: 104rpx; }