|
|
@@ -15,13 +15,17 @@
|
|
|
</span>
|
|
|
</view>
|
|
|
<view class="rechargeMain">
|
|
|
+ <view class="tip-box">
|
|
|
+ 近半年您已花费<span>560元</span>充电，参与充值送折扣卡活动推荐充值<span>500元</span>，预计可省<span>24.8元</span>。
|
|
|
+ </view>
|
|
|
+
|
|
|
<view class="recharge-item" v-for="(item,index) in moneyList" :class="{
|
|
|
active:otherNum==item.rechargeAmount||moneyActiveClass == item.id ,
|
|
|
'recharge-item-rk':item.amountRemark
|
|
|
}"
|
|
|
:key="item.id" @click="moneyClick(item.id,item)">
|
|
|
{{item.amountDesc?item.amountDesc:item.rechargeAmount+'元'}}
|
|
|
- <view class="item-rk" v-if="item.amountRemark">送<span class="item-rk-span" >{{item.amountRemarkNum}}</span>{{item.amountRemarkHtml}}</view>
|
|
|
+ <view class="item-rk" v-if="item.amountRemark">送<span class="item-rk-span" >{{item.amountRemarkNum}}</span>折卡</view>
|
|
|
</view>
|
|
|
<p style=" font-size: 14px;" v-show="selectItem.amountRemark">
|
|
|
充值满
|
|
|
@@ -614,15 +618,18 @@
|
|
|
margin-bottom: 10px;
|
|
|
font-size: 32rpx;
|
|
|
position: relative;
|
|
|
+ font-weight: bold;
|
|
|
//margin-left: 5px;
|
|
|
}
|
|
|
.recharge-item-rk{
|
|
|
- width: 48%;
|
|
|
+ width: 23%;
|
|
|
padding-bottom: 0;
|
|
|
+
|
|
|
.item-rk{
|
|
|
- margin-top: 20rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ // margin-top: 20rpx;
|
|
|
padding: 8rpx 0;
|
|
|
- background-color: rgba(232, 232, 232, 1);
|
|
|
+ // background-color: rgba(232, 232, 232, 1);
|
|
|
color: rgba(51, 51, 51, 1);
|
|
|
font-size: 24rpx;
|
|
|
}
|
|
|
@@ -651,11 +658,11 @@
|
|
|
border-color: #00B962;
|
|
|
color: #00B962;
|
|
|
.item-rk{
|
|
|
- background-color: #53B56B;
|
|
|
- color: #fff;
|
|
|
+ //background-color: #53B56B;
|
|
|
+ color:#53B56B
|
|
|
}
|
|
|
.item-rk-span{
|
|
|
- color: #fff;
|
|
|
+ color: #53B56B
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -705,4 +712,33 @@
|
|
|
border-color: #a7dbc2 !important;
|
|
|
color: #fff !important;
|
|
|
}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ .tip-box {
|
|
|
+ position: relative;
|
|
|
+ background-color: #fff;
|
|
|
+ border: 1px solid #f5a623;
|
|
|
+ border-radius: 8px;
|
|
|
+ padding: 10px 15px;
|
|
|
+ color: #333;
|
|
|
+ width: 400px;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ background: #FEF8E9;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tip-box::before {
|
|
|
+ content: "";
|
|
|
+ position: absolute;
|
|
|
+ top: 100%;
|
|
|
+ left: 20px;
|
|
|
+ border-left: 10px solid transparent;
|
|
|
+ border-right: 10px solid transparent;
|
|
|
+ border-top: 10px solid #f5a623;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tip-box span {
|
|
|
+ color: #f5a623;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
</style>
|
zhengkaixin