|  |  | 
 |  |  |  | 
 |  |  | .base-wrapper { | 
 |  |  |   background-color: #f5f5f5; | 
 |  |  |   width: 100%; | 
 |  |  |   height: 100vh; | 
 |  |  |   overflow: hidden; | 
 |  |  |   /* 防止底部区域滚动 */ | 
 |  |  |   display: flex; | 
 |  |  |   flex-direction: column; | 
 |  |  | } | 
 |  |  |  | 
 |  |  | .top-wrapper { | 
 |  |  | 
 |  |  | } | 
 |  |  |  | 
 |  |  |  | 
 |  |  | .top-one{ | 
 |  |  | .top-one { | 
 |  |  |   display: flex; | 
 |  |  |   flex-direction: row; | 
 |  |  |   justify-content: space-between; | 
 |  |  |   height: 20vh; | 
 |  |  | } | 
 |  |  | .top-wallet-bg{ | 
 |  |  |  width: 40%; | 
 |  |  |  height: 100%; | 
 |  |  |  | 
 |  |  | .top-wallet-bg { | 
 |  |  |   width: 40%; | 
 |  |  |   height: 100%; | 
 |  |  | } | 
 |  |  | .top-wallet-bg image{ | 
 |  |  |  | 
 |  |  | .top-wallet-bg image { | 
 |  |  |   width: 100%; | 
 |  |  |   height: 100%; | 
 |  |  | } | 
 |  |  |  | 
 |  |  | .top-money-button{ | 
 |  |  | .top-money-button { | 
 |  |  |   display: flex; | 
 |  |  |   flex-direction: column; | 
 |  |  |   justify-content: space-around; | 
 |  |  | 
 |  |  |  | 
 |  |  |  | 
 |  |  |  | 
 |  |  | .top-wrapper-button{ | 
 |  |  | .top-wrapper-button { | 
 |  |  |   display: flex; | 
 |  |  |   flex-direction: row; | 
 |  |  |   justify-content: space-between; | 
 |  |  |   margin-right: 30rpx; | 
 |  |  | } | 
 |  |  |  | 
 |  |  | .button-refund{ | 
 |  |  | .button-refund { | 
 |  |  |   font-size: 35rpx; | 
 |  |  |   border-radius: 90px; | 
 |  |  |   width: 30%; | 
 |  |  | 
 |  |  |   display: flex; | 
 |  |  |   align-items: center; | 
 |  |  |   padding-top: 10rpx; | 
 |  |  |   padding-bottom: 10rpx; | 
 |  |  |   padding-bottom: 15rpx; | 
 |  |  |   padding-left: 30rpx; | 
 |  |  |   padding-right: 30rpx; | 
 |  |  |   justify-content: center; | 
 |  |  |   text-align: center; | 
 |  |  |   color: #fff; | 
 |  |  | } | 
 |  |  | .button-recharge{ | 
 |  |  |  | 
 |  |  | .button-recharge { | 
 |  |  |   color: #000; | 
 |  |  |   font-size: 35rpx; | 
 |  |  |   border-radius: 90px; | 
 |  |  | 
 |  |  |   padding-bottom: 10rpx; | 
 |  |  |   padding-left: 30rpx; | 
 |  |  |   padding-right: 30rpx; | 
 |  |  | } | 
 |  |  |  | 
 |  |  | .list-item { | 
 |  |  |   background-color: #fff; | 
 |  |  |   margin-top: 10rpx; | 
 |  |  |   display: flex; | 
 |  |  |   justify-content: space-between; | 
 |  |  |   align-items: center; | 
 |  |  |   padding-left: 30rpx; | 
 |  |  |   padding-right: 30rpx; | 
 |  |  |   padding-top: 40rpx; | 
 |  |  |   padding-bottom: 40rpx; | 
 |  |  |   margin-left: 20rpx; | 
 |  |  |   margin-right: 20rpx; | 
 |  |  | } | 
 |  |  |  | 
 |  |  | .scroll-view { | 
 |  |  |   margin-top: 30rpx; | 
 |  |  |   flex: 1; | 
 |  |  |   overflow-y: auto; | 
 |  |  |   /* 允许垂直滚动 */ | 
 |  |  |   z-index: 0; | 
 |  |  | } | 
 |  |  |  | 
 |  |  | .order-right { | 
 |  |  |   display: flex; | 
 |  |  |   flex-direction: column; | 
 |  |  |   align-items: center; | 
 |  |  | } | 
 |  |  |  | 
 |  |  | .money-wrapper text { | 
 |  |  |   font-size: 50rpx; | 
 |  |  |   color: #1890FF; | 
 |  |  | } | 
 |  |  |  | 
 |  |  | .order-state { | 
 |  |  |   font-size: 30rpx; | 
 |  |  |   color: #000000; | 
 |  |  |   opacity: 0.7; | 
 |  |  |    | 
 |  |  | } | 
 |  |  | .order-code text{ | 
 |  |  |   font-size: 35rpx; | 
 |  |  |   color: #000000; | 
 |  |  | } | 
 |  |  | .order-time{ | 
 |  |  |   font-size: 35rpx; | 
 |  |  |   color: #000000; | 
 |  |  |   opacity: 0.7; | 
 |  |  | } |