|
|
|
@ -13,19 +13,20 @@ |
|
|
|
|
</view> |
|
|
|
|
<view class="content"> |
|
|
|
|
<view class="amount"> |
|
|
|
|
<view class="list"> |
|
|
|
|
<view class="box" v-for="(amount,index) in amountList" :key="index" @tap="select(amount)" |
|
|
|
|
:class="{'on':amount == inputAmount}"> |
|
|
|
|
{{amount}}元 |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="num"> |
|
|
|
|
<view class="text"> |
|
|
|
|
自定义充值金额 |
|
|
|
|
</view> |
|
|
|
|
<view class="input"> |
|
|
|
|
<input type="number" v-model="inputAmount" /> |
|
|
|
|
</view> |
|
|
|
|
<view class="list"> |
|
|
|
|
<view class="box" v-for="(amount,index) in amountList" :key="index" @tap="select(amount)" |
|
|
|
|
:class="{'on':amount == inputAmount}"> |
|
|
|
|
<view class="heTitle">{{amount}}元</view> |
|
|
|
|
<view class="font14">{{amount * 100}}分</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="num"> |
|
|
|
|
<view class="text font13"> |
|
|
|
|
自定义充值金额(兑:{{inputAmount * 100}}分) |
|
|
|
|
</view> |
|
|
|
|
<view class="input"> |
|
|
|
|
<input type="number" v-model="inputAmount" /> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
@ -205,31 +206,40 @@ |
|
|
|
|
.amount { |
|
|
|
|
width: 100%; |
|
|
|
|
|
|
|
|
|
.list { |
|
|
|
|
display: flow-root; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
padding: 20upx 0; |
|
|
|
|
|
|
|
|
|
.box { |
|
|
|
|
width: 30%; |
|
|
|
|
height: 120rpx; |
|
|
|
|
float: left; |
|
|
|
|
margin-left: 3.333%; |
|
|
|
|
margin-top: 20px; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: center; |
|
|
|
|
align-items: center; |
|
|
|
|
border-radius: 10rpx; |
|
|
|
|
box-shadow: 0rpx 5rpx 20rpx rgba(0, 0, 0, 0.05); |
|
|
|
|
font-size: 36rpx; |
|
|
|
|
background-color: #f1f1f1; |
|
|
|
|
color: 333; |
|
|
|
|
|
|
|
|
|
&.on { |
|
|
|
|
background-color: #0083f5; |
|
|
|
|
color: #fff; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.list { |
|
|
|
|
width: 94%; |
|
|
|
|
margin-left: 3%; |
|
|
|
|
display: flow-root; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
align-items: center; |
|
|
|
|
padding: 20upx 0; |
|
|
|
|
|
|
|
|
|
.box { |
|
|
|
|
width: 30%; |
|
|
|
|
margin-left: 1%; |
|
|
|
|
margin-right: 2%; |
|
|
|
|
margin-top: 20upx; |
|
|
|
|
float: left; |
|
|
|
|
height: 120upx; |
|
|
|
|
// line-height: 120upx; |
|
|
|
|
display: inline-grid; |
|
|
|
|
justify-content: center; |
|
|
|
|
align-items: center; |
|
|
|
|
text-align: center; |
|
|
|
|
box-shadow: 0upx 0upx 4upx #666666; |
|
|
|
|
font-size: 36upx; |
|
|
|
|
color: #089bf5; |
|
|
|
|
background-color: #f1f1f1; |
|
|
|
|
&.on { |
|
|
|
|
background-color: #089bf5; |
|
|
|
|
color: #ffffff; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.heTitle { |
|
|
|
|
width: 100%; |
|
|
|
|
font-size: 15px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.num { |
|
|
|
|