充值界面完善

pages/member/index.vue

@@ -36,8 +36,17 @@
 			</view>
 		</view>
 		
-		<view>
-			
+		<view class="explain">
+			<view class="explain-top flex-between">
+				<text class="explain-top_title">适用门店</text>
+				<text class="shopName">{{ userInfo.shopName }}</text>
+			</view>
+			<view class="explain_content">
+				<text class="explain_content_title">充值说明</text>
+				<text class="explain_content_text">1.充值金额1家门店可用</text>
+				<text class="explain_content_text">2.储值完成后不支持自助退款，可联系商家处理</text>
+				<text class="explain_content_text">3.钱包余额不支持转赠，不可提现，长期有效</text>
+			</view>
 		</view>
 		
 		<view class="rechargeBox">
@@ -389,6 +398,44 @@
 				padding-left: 20rpx;
 			}
 		}
+		
+		.explain{
+			background-color: #fff;
+			border-radius: 12rpx;
+			display: flex;
+			flex-direction: column;
+			padding: 22rpx 24rpx;
+			.explain-top{
+				// align-items: center;
+				margin-bottom: 18rpx;
+				.explain-top_title{
+					font-weight: 500;
+					font-size: 32rpx;
+					color: #333333;
+				}
+				.shopName{
+					font-weight: 400;
+					font-size: 24rpx;
+					color: #333333;
+				}
+			}
+			.explain_content{
+				display: flex;
+				flex-direction: column;
+				.explain_content_title{
+					font-weight: 500;
+					font-size: 32rpx;
+					color: #333333;
+					margin-bottom: 20rpx;
+				}
+				.explain_content_text{
+					font-weight: 400;
+					font-size: 24rpx;
+					color: #666666;
+					margin-bottom: 14rpx;
+				}
+			}
+		}
 
 		.rechargeBox{
 			width: 100%;