From 08bca7b34a1632860db3cb08c8cbf98741fed29c Mon Sep 17 00:00:00 2001
From: zpc <zpc1131@gamil.com>
Date: Mon, 24 Mar 2025 04:07:13 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/mall/index.vue | 1040 +++++++++++++++++++++---------------------
 1 file changed, 509 insertions(+), 531 deletions(-)

diff --git a/pages/mall/index.vue b/pages/mall/index.vue
index d07963b..c2d05d9 100644
--- a/pages/mall/index.vue
+++ b/pages/mall/index.vue
@@ -5,24 +5,11 @@
 				<view class="title">
 					商城好物
 				</view>
-				<image v-if="advert!=null&&advert.length>0" :src="advert[0].imgurl" style="width: 100%; margin-top: ;"
+				<image v-if="advert != null && advert.length > 0" :src="advert[0].imgurl" style="width: 100%; margin-top: ;"
 					mode=""></image>
-				<!-- <view style="background-image: url('https://xinglanmh.shequtuangou.vip/static/image/20240711134727.png');background-size: 100% 100%;height:600rpx;">
-					<view style="height:200rpx;"></view>
-					<view style="width:90%;height:286rpx;margin-left: 5%;">
-						<swiper class="swiper-box" :autoplay="true" :indicator-dots="false" :circular="true" :interval="3000">
-							<swiper-item v-for="(v, i) in advert" :key="i" @click="$c.navTo(v)">
-								<image class="yh_bg" :src="v.imgurl" style="width: 100%;height: 100%;"></image>
-							</swiper-item>
-						</swiper>
-					</view>
-				</view> -->
-
-
 			</view>
-
 			<view class="grid-container">
-				<view v-for="(item,index) in datas" :key="index" class="grid-item" @click="order_money(item)">
+				<view v-for="(item, index) in datas" :key="index" class="grid-item" @click="order_money(item)">
 
 					<view class=""
 						style="background-color: #D8D8D8;  height: 324rpx; border-radius: 16rpx  16rpx  0rpx  0rpx;">
@@ -33,12 +20,12 @@
 
 
 					<view class="goods-name hang1" style=" width: 290rpx;">
-						<text style="color: #333333; font-size: 27rpx;">{{item.title}}</text>
+						<text style="color: #333333; font-size: 27rpx;">{{ item.title }}</text>
 					</view>
 
 					<view class="price-box">
 						<view class="price">
-							<text>￥{{item.price}}</text>
+							<text>￥{{ item.price }}</text>
 						</view>
 					</view>
 					<view class="num-box">
@@ -91,7 +78,7 @@
 							微信支付
 						</view>
 						<view class="icon">
-							<image v-if="zhifu==0" :src="$img1('common/check_act.png')" lazy-load></image>
+							<image v-if="zhifu == 0" :src="$img1('common/check_act.png')" lazy-load></image>
 
 							<image v-else :src="$img1('common/check.png')" lazy-load></image>
 						</view>
@@ -99,12 +86,12 @@
 					<view class="pay-type" @click="changePay(1)">
 
 						<view class="" style="width: 100%;	color: #333333;">
-							吧唧币
-							{{ orderData.goods.price*100 }} (剩余:{{ orderData.use_integral }})
+							{{ $config.getAppSetting('currency2_name') }}
+							{{ orderData.goods.price * 100 }} (剩余:{{ orderData.use_integral }})
 						</view>
 
 						<view class="icon">
-							<image v-if="zhifu==1" :src="$img1('common/check_act.png')" lazy-load></image>
+							<image v-if="zhifu == 1" :src="$img1('common/check_act.png')" lazy-load></image>
 							<image v-else :src="$img1('common/check.png')" lazy-load></image>
 						</view>
 					</view>
@@ -136,15 +123,15 @@
 
 
 
-				<view class="pay-btn" v-if="zhifu==0" @click="$c.noDouble(confirmSubmit(1))">
+				<view class="pay-btn" v-if="zhifu == 0" @click="$c.noDouble(confirmSubmit(1))">
 					<text>
 						{{
-						 ` ¥${orderData.price}`
+							` ¥${orderData.price}`
 						}}
 					</text>
 				</view>
-				<view class="pay-btn" v-if="zhifu==1" @click="$c.noDouble(pay(1))">
-					<text>{{orderData.price*100}}吧唧币</text>
+				<view class="pay-btn" v-if="zhifu == 1" @click="$c.noDouble(pay(1))">
+					<text>{{ orderData.price * 100 }}{{ $config.getAppSetting('currency2_name') }}</text>
 				</view>
 			</view>
 		</uni-popup>
@@ -155,578 +142,569 @@
 </template>
 
 <script>
-	export default {
+export default {
 
-		data() {
-			return {
-				statusBarHeight: 0,
-				datas: [],
-				advert: [],
-				sendRuleData: '',
-				goodsId: "",
-				orderData: null,
-				isAgree: true,
-				isWXPay: true,
-				useMoney: false,
-				integral: true,
-				zhifu: 0,
+	data() {
+		return {
+			statusBarHeight: 0,
+			datas: [],
+			advert: [],
+			sendRuleData: '',
+			goodsId: "",
+			orderData: null,
+			isAgree: true,
+			isWXPay: true,
+			useMoney: false,
+			integral: true,
+			zhifu: 0,
+		}
+	},
+	onLoad() {
+		// 获取系统信息
+		uni.getSystemInfo({
+			success: (res) => {
+				// 状态栏的高度
+				this.statusBarHeight = res.statusBarHeight + 20;
 			}
-		},
-		onLoad() {
-			// 获取系统信息
-			uni.getSystemInfo({
-				success: (res) => {
-					// 状态栏的高度
-					this.statusBarHeight = res.statusBarHeight + 20;
-				}
-			});
+		});
 
-			this.getData();
-			this.load();
-			this.$c.getRule(10).then(res => {
-				if (res.status == 1) {
-					this.sendRuleData = res.data
+		this.getData();
+		this.load();
+		this.$c.getRule(10).then(res => {
+			if (res.status == 1) {
+				this.sendRuleData = res.data
+			}
+		});
+	},
+	onShow() {
+
+		const curPages = getCurrentPages()[0]; // 获取当前页面实例
+		if (typeof curPages.getTabBar === 'function' && curPages.getTabBar()) {
+			this.$mp.page.getTabBar().setData({
+				selected: 2
+			});
+		}
+	},
+	methods: {
+		load() {
+			let that = this
+			that.req({
+				url: 'getAdvert?type_id=3',
+				success(res) {
+					if (res.status == 1) {
+						that.advert = res.data
+					}
+				}
+			})
+
+		},
+		getStatusBarHeight() {
+			const systemInfo = uni.getSystemInfoSync();
+			this.statusBarHeight = systemInfo.statusBarHeight;
+			console.log('statusBarHeight', this.statusBarHeight);
+		},
+
+		getData() {
+			let that = this
+			that.req({
+				url: 'goods',
+				data: {
+					type: '10',
+					page: 1,
+					use_money_is: this.useMoney ? 1 : 2,
+					use_integral_is: this.isWXPay ? 1 : 2,
+				},
+				success(res) {
+					that.datas = res.data.data
 				}
 			});
 		},
-		onShow() {
 
-			const curPages = getCurrentPages()[0]; // 获取当前页面实例
-			if (typeof curPages.getTabBar === 'function' && curPages.getTabBar()) {
-				this.$mp.page.getTabBar().setData({
-					selected: 2
-				});
+
+		order_money(data) {
+			console.log(234);
+			this.goodsId = data.id;
+			var that = this;
+			this.req({
+				url: 'mall_ordermoney',
+				data: {
+					prize_num: 1,
+					goods_id: data.id,
+					goods_num: 1,
+				},
+				success(res) {
+					if (res.status == 1) {
+
+						that.orderData = res.data
+						that.zhifu = 0;
+						that.$refs.pop.open()
+					}
+				}
+			})
+		},
+
+		close(e) {
+			this.$refs[e].close()
+		},
+
+		changePay(e) {
+			if (this.zhifu != e) {
+				this.zhifu = e;
 			}
+			if (this.zhifu == 1) {
+
+			}
+			// this[e] = !this[e]
+
+			// this.confirmSubmit(0)
 		},
-		methods: {
-			load() {
-				let that = this
-				that.req({
-					url: 'getAdvert?type_id=3',
-					success(res) {
-						if (res.status == 1) {
-							that.advert = res.data
-						}
-					}
-				})
 
-			},
-			getStatusBarHeight() {
-				const systemInfo = uni.getSystemInfoSync();
-				this.statusBarHeight = systemInfo.statusBarHeight;
-				console.log('statusBarHeight', this.statusBarHeight);
-			},
+		confirmSubmit(type) {
 
-			getData() {
-				let that = this
-				that.req({
-					url: 'goods',
-					data: {
-						type: '10',
-						page: 1,
-						use_money_is: this.useMoney ? 1 : 2,
-						use_integral_is: this.isWXPay ? 1 : 2,
-					},
-					success(res) {
-						that.datas = res.data.data
-					}
+			if (!this.useMoney && !this.isWXPay) {
+				uni.showToast({
+					title: '请选择支付方式',
+					icon: 'none',
 				});
-			},
+				return;
+			}
+
+			console.log("type", type);
+
+			var that = this;
+
+			let url = 'mall_ordermoney'
+
+			let data = {
+				goods_id: this.goodsId,
+				prize_num: 1,
+				goods_num:1,
+				use_money_is: 2,
+				use_integral_is: 2,
+				coupon_id:  "",
+				use_money2_is: this.useMoney ? 1 : 2
+			}
+
+			if (type == 1) {
+				url = 'orderbuy'
+			}
 
 
-			order_money(data) {
-				console.log(234);
-				this.goodsId = data.id;
-				var that = this;
-				this.req({
-					url: 'mall_ordermoney',
-					data: {
-						prize_num: 1,
-						goods_id: data.id,
-						goods_num: 1,
-					},
-					success(res) {
-						if (res.status == 1) {
-
-							that.orderData = res.data
-							that.zhifu = 0;
-							that.$refs.pop.open()
+			this.req({
+				url,
+				data,
+				success: async res => {
+					if (res.status == 1) {
+						if (type == 0) {
+							console.log("res.data", res.data);
+							this.orderData = res.data;
 						}
-					}
-				})
-			},
 
-			close(e) {
-				this.$refs[e].close()
-			},
+						if (type == 1) {
+							that.close('pop')
+							if (res.data.status == 1) {
 
-			changePay(e) {
-				if (this.zhifu != e) {
-					this.zhifu = e;
-				}
-				if (this.zhifu == 1) {
-
-				}
-				// this[e] = !this[e]
-
-				// this.confirmSubmit(0)
-			},
-
-			confirmSubmit(type) {
-
-				if (!this.useMoney && !this.isWXPay) {
-					uni.showToast({
-						title: '请选择支付方式',
-						icon: 'none',
-					});
-					return;
-				}
-
-				console.log("type", type);
-
-				var that = this;
-
-				let url = 'mall_ordermoney'
-
-				let data = {
-					goods_id: this.goodsId,
-					prize_num: 1,
-				}
-
-				if (type == 1) {
-					url = 'infinite_orderbuy'
-
-					// if (this.pageTabCur == 1) {
-					// 	url = 'infinite_mibao_orderbuy'
-					// 	data = {
-					// 		goods_id: this.pageData.goods.id,
-					// 		prize_num: this.buyNum,
-					// 		// is_mibao: this.pageTabCur
-					// 	}
-					// }
-
-					// if (!uni.getStorageSync('_agree_buy_notice') && !fromNotice) {
-					// 	this.$refs.buyNotice.getRule(6)
-					// 	return
-					// }
-				}
+								const status = await that.$c.wxMpPay({
+									data: res.data.res
+								})
+								if (status == 'success') {
+									// that.getPrize(res.data.order_num)
+									that.getData();
+								}
 
 
-				this.req({
-					url,
-					data,
-					success: async res => {
-						if (res.status == 1) {
-							if (type == 0) {
-								console.log("res.data", res.data);
-								this.orderData = res.data;
-							}
 
-							if (type == 1) {
-								that.close('pop')
-								if (res.data.status == 1) {
 
-									const status = await that.$c.wxMpPay({
-										data: res.data.res
-									})
-									if (status == 'success') {
+							} else {
+								that.$c.toast({
+									title: res.msg,
+									duration: 500,
+									success: () => {
 										// that.getPrize(res.data.order_num)
 										that.getData();
 									}
-
-
-
-
-								} else {
-									that.$c.toast({
-										title: res.msg,
-										duration: 500,
-										success: () => {
-											// that.getPrize(res.data.order_num)
-											that.getData();
-										}
-									})
-								}
+								})
 							}
 						}
 					}
-				})
-
-			},
-
-
-			pay(type) {
-				//orderData.price
-				//{{ orderData.goods.price*100 }} (剩余:{{ orderData.use_integral }})
-				var pri = this.orderData.goods.price * 100;
-				if (this.orderData.use_integral < pri) {
-					uni.showToast({
-						title: '吧唧币不足',
-						icon: 'none',
-					});
-					return;
 				}
-
-				console.log("type", type);
-
-				var that = this;
-
-				let url = 'mall_orderbuy'
-
-				let data = {
-					goods_id: this.goodsId,
-					prize_num: 1,
-				}
-
-				this.req({
-					url,
-					data,
-					success: async res => {
-						if (res.status == 1) {
-							if (type == 0) {
-								console.log("res.data", res.data);
-								this.orderData = res.data;
-							}
-
-							if (type == 1) {
-								that.close('pop')
-								if (res.data.status == 1) {
-
-									const status = await that.$c.wxMpPay({
-										data: res.data.res
-									})
-									if (status == 'success') {
-										// that.getPrize(res.data.order_num)
-										that.getData();
-									}
-
-
-
-
-								} else {
-									that.$c.toast({
-										title: res.msg,
-										duration: 500,
-										success: () => {
-											// that.getPrize(res.data.order_num)
-											that.getData();
-										}
-									})
-								}
-							}
-						}
-					}
-				})
-
-			},
-
+			})
 
 		},
-	}
+
+
+		pay(type) {
+			//orderData.price
+			//{{ orderData.goods.price*100 }} (剩余:{{ orderData.use_integral }})
+			var pri = this.orderData.goods.price * 100;
+			if (this.orderData.use_integral < pri) {
+				uni.showToast({
+					title: '吧唧币不足',
+					icon: 'none',
+				});
+				return;
+			}
+
+			console.log("type", type);
+
+			var that = this;
+
+			let url = 'mall_orderbuy'
+
+			let data = {
+				goods_id: this.goodsId,
+				prize_num: 1,
+			}
+
+			this.req({
+				url,
+				data,
+				success: async res => {
+					if (res.status == 1) {
+						if (type == 0) {
+							console.log("res.data", res.data);
+							this.orderData = res.data;
+						}
+
+						if (type == 1) {
+							that.close('pop')
+							if (res.data.status == 1) {
+
+								const status = await that.$c.wxMpPay({
+									data: res.data.res
+								})
+								if (status == 'success') {
+									// that.getPrize(res.data.order_num)
+									that.getData();
+								}
+
+
+
+
+							} else {
+								that.$c.toast({
+									title: res.msg,
+									duration: 500,
+									success: () => {
+										// that.getPrize(res.data.order_num)
+										that.getData();
+									}
+								})
+							}
+						}
+					}
+				}
+			})
+
+		},
+
+
+	},
+}
 </script>
 
 <style lang="scss">
-	.title {
-		width: 100%;
-		top: 108rpx;
+.title {
+	width: 100%;
+	top: 108rpx;
+	position: absolute;
+	display: flex;
+	align-items: center;
+	font-size: 34rpx;
+	justify-content: center;
+	color: black;
+	z-index: 100;
+}
+
+.grid-container {
+	display: grid;
+	margin: 33rpx;
+	padding-bottom: 200rpx;
+	grid-template-columns: repeat(2, 1fr);
+	gap: 16px;
+}
+
+.grid-item {
+	height: 487rpx;
+	position: relative;
+	background-color: #F8F8F8;
+	border-radius: 0rpx 0rpx 16rpx 16rpx;
+}
+
+.goods-name {
+	position: absolute;
+	left: 25rpx;
+	font-size: 20rpx;
+	bottom: 90rpx;
+}
+
+.price-box {
+	display: flex;
+	position: absolute;
+	left: 18rpx;
+	bottom: 24rpx;
+	justify-content: space-between;
+	align-items: center;
+
+	.price {
+		font-weight: 500;
+		font-size: 16rpx;
+		color: #333333;
+	}
+}
+
+.num-box {
+	display: flex;
+	align-items: center;
+	position: absolute;
+	bottom: 24rpx;
+	right: 20rpx;
+
+	.num {
+		font-size: 16rpx;
+		font-family: Source Han Sans CN;
+		font-weight: 400;
+		color: #6C6C6C;
+	}
+
+	.box {
+		width: 18rpx;
+		height: 16rpx;
+		margin-left: 6rpx;
+	}
+
+	.icon {}
+}
+
+.buy-pop {
+	padding: 0 30rpx;
+	box-sizing: border-box;
+	background: #F7F7F7;
+	padding-bottom: 200rpx;
+	z-index: 999;
+	border-radius: 16rpx 16rpx 0rpx 0rpx;
+
+	&::after {
+		content: '';
 		position: absolute;
+		top: -62rpx;
+		left: 0;
+		width: 750rpx;
+		height: 62rpx;
+	}
+
+	.buy-pop-hd {
+		padding: 40rpx 0;
+		padding-left: 10rpx;
 		display: flex;
-		align-items: center;
-		font-size: 34rpx;
-		justify-content: center;
-		color: black;
-		z-index: 100;
-	}
-
-	.grid-container {
-		display: grid;
-		margin: 33rpx;
-		padding-bottom: 200rpx;
-		grid-template-columns: repeat(2, 1fr);
-		gap: 16px;
-	}
-
-	.grid-item {
-		height: 487rpx;
-		position: relative;
-		background-color: #F8F8F8;
-		border-radius: 0rpx 0rpx 16rpx 16rpx;
-	}
-
-	.goods-name {
-		position: absolute;
-		left: 25rpx;
-		font-size: 20rpx;
-		bottom: 90rpx;
-	}
-
-	.price-box {
-		display: flex;
-		position: absolute;
-		left: 18rpx;
-		bottom: 24rpx;
 		justify-content: space-between;
 		align-items: center;
 
-		.price {
+		>text {
+			font-size: 32rpx;
 			font-weight: 500;
-			font-size: 16rpx;
 			color: #333333;
 		}
+
+		.close {
+			width: 24rpx;
+			height: 24rpx;
+		}
 	}
 
-	.num-box {
-		display: flex;
-		align-items: center;
-		position: absolute;
-		bottom: 24rpx;
-		right: 20rpx;
+	.buy-card {
+		border-radius: 20rpx;
+		padding: 30rpx 30rpx 30rpx 30rpx;
+		background: #FFFFFF;
 
-		.num {
-			font-size: 16rpx;
-			font-family: Source Han Sans CN;
+		.buy-info {
+			display: flex;
+
+			.pic {
+				width: 190rpx;
+				height: 190rpx;
+				border-radius: 10rpx;
+			}
+
+			.info-r {
+				width: calc(100% - 190rpx);
+				box-sizing: border-box;
+				display: flex;
+				flex-flow: column nowrap;
+				justify-content: space-between;
+				padding: 10rpx 10rpx 10rpx 30rpx;
+
+				.title {
+					font-size: 32rpx;
+					font-weight: 400;
+					color: #333333;
+				}
+
+
+				.type {
+					font-size: 20rpx;
+					font-weight: 400;
+					color: #999999;
+				}
+
+				.price-num {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					font-size: 16rpx;
+
+					.price {
+						ffont-weight: 500;
+						font-size: 35rpx;
+						color: #333333;
+						font-size: 28rpx;
+					}
+
+					.num {
+						font-size: 20rpx;
+						font-family: Source Han Sans CN;
+						font-weight: 400;
+						color: #999999;
+					}
+				}
+			}
+		}
+
+		.line {
+			height: 1px;
+			background: #222222;
+			margin: 30rpx 0 10rpx;
+		}
+
+		.yhfs {
 			font-weight: 400;
-			color: #6C6C6C;
+			font-size: 28rpx;
+			color: #FFFFFF;
 		}
 
-		.box {
-			width: 18rpx;
-			height: 16rpx;
-			margin-left: 6rpx;
-		}
-
-		.icon {}
-	}
-
-	.buy-pop {
-		padding: 0 30rpx;
-		box-sizing: border-box;
-		background: #F7F7F7;
-		padding-bottom: 200rpx;
-		z-index: 999;
-		border-radius: 16rpx 16rpx 0rpx 0rpx;
-
-		&::after {
-			content: '';
-			position: absolute;
-			top: -62rpx;
-			left: 0;
-			width: 750rpx;
-			height: 62rpx;
-		}
-
-		.buy-pop-hd {
-			padding: 40rpx 0;
-			padding-left: 10rpx;
+		.card-row {
+			padding: 16rpx 0;
 			display: flex;
 			justify-content: space-between;
 			align-items: center;
 
-			>text {
-				font-size: 32rpx;
-				font-weight: 500;
-				color: #333333;
-			}
-
-			.close {
-				width: 24rpx;
-				height: 24rpx;
-			}
-		}
-
-		.buy-card {
-			border-radius: 20rpx;
-			padding: 30rpx 30rpx 30rpx 30rpx;
-			background: #FFFFFF;
-
-			.buy-info {
-				display: flex;
-
-				.pic {
-					width: 190rpx;
-					height: 190rpx;
-					border-radius: 10rpx;
+			.title {
+				>image {
+					width: 32rpx;
+					height: 32rpx;
 				}
 
-				.info-r {
-					width: calc(100% - 190rpx);
-					box-sizing: border-box;
-					display: flex;
-					flex-flow: column nowrap;
-					justify-content: space-between;
-					padding: 10rpx 10rpx 10rpx 30rpx;
-
-					.title {
-						font-size: 32rpx;
-						font-weight: 400;
-						color: #333333;
-					}
-
-
-					.type {
-						font-size: 20rpx;
-						font-weight: 400;
-						color: #999999;
-					}
-
-					.price-num {
-						display: flex;
-						justify-content: space-between;
-						align-items: center;
-						font-size: 16rpx;
-
-						.price {
-							ffont-weight: 500;
-							font-size: 35rpx;
-							color: #333333;
-							font-size: 28rpx;
-						}
-
-						.num {
-							font-size: 20rpx;
-							font-family: Source Han Sans CN;
-							font-weight: 400;
-							color: #999999;
-						}
-					}
+				>text {
+					font-weight: 400;
+					font-size: 24rpx;
+					color: #FFFFFF;
 				}
 			}
 
-			.line {
-				height: 1px;
-				background: #222222;
-				margin: 30rpx 0 10rpx;
-			}
-
-			.yhfs {
-				font-weight: 400;
-				font-size: 28rpx;
-				color: #FFFFFF;
-			}
-
-			.card-row {
-				padding: 16rpx 0;
+			.row-r {
 				display: flex;
-				justify-content: space-between;
 				align-items: center;
 
-				.title {
-					>image {
-						width: 32rpx;
-						height: 32rpx;
-					}
-
-					>text {
-						font-weight: 400;
-						font-size: 24rpx;
-						color: #FFFFFF;
-					}
-				}
-
-				.row-r {
-					display: flex;
-					align-items: center;
-
-					font-size: 24rpx;
-					font-family: Source Han Sans CN;
-					font-weight: 400;
-					color: #FFFFFF;
-
-					.icon {
-						width: 32rpx;
-						height: 32rpx;
-					}
-				}
-			}
-
-			.card-row {
-				.title {}
-
-				.row-r {
-					.icon {}
-				}
-			}
-		}
-
-		.pay-title {
-			margin-top: 30rpx;
-			font-size: 38rpx;
-			font-weight: 400;
-			color: #ffffff;
-		}
-
-		.pay-type {
-			padding: 30rpx;
-			border-radius: 20rpx;
-			display: flex;
-			align-items: center;
-			flex-direction: row;
-
-			.icon {
-				width: 32rpx;
-				height: 32rpx;
-			}
-
-			.title {
-				flex: 1;
-				padding: 0 20rpx;
-				font-size: 28rpx;
+				font-size: 24rpx;
 				font-family: Source Han Sans CN;
 				font-weight: 400;
-				color: #ffffff;
+				color: #FFFFFF;
+
+				.icon {
+					width: 32rpx;
+					height: 32rpx;
+				}
 			}
 		}
 
-		.agree {
-			display: flex;
-			margin-top: 30rpx;
+		.card-row {
+			.title {}
 
-			font-size: 20rpx;
-			font-family: Source Han Sans CN;
-			font-weight: 400;
-			color: #999999;
-			line-height: 32rpx;
-
-			.icon {
-				width: 32rpx;
-				height: 32rpx;
-				margin-right: 10rpx;
-			}
-		}
-
-		.rule {
-			padding: 20rpx;
-			background: #F9F8E1;
-			border-radius: 20rpx;
-			box-sizing: border-box;
-			margin: 20rpx 0 0;
-
-			.rule-inner {
-				max-height: 160rpx;
-				font-size: 20rpx;
-				font-weight: 400;
-				color: #999999;
-			}
-		}
-
-		.pay-btn {
-			margin: 30rpx auto 0;
-			width: 686rpx;
-			height: 84rpx;
-			background: url($imgurl+'common/payBtn.png') no-repeat 0 0 / 100% 100%;
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			font-weight: 500;
-			color: #CDEF27;
-
-			>text:nth-child(1) {
-				font-size: 28rpx;
-			}
-
-			>text:nth-child(2) {
-				font-size: 36rpx;
+			.row-r {
+				.icon {}
 			}
 		}
 	}
+
+	.pay-title {
+		margin-top: 30rpx;
+		font-size: 38rpx;
+		font-weight: 400;
+		color: #ffffff;
+	}
+
+	.pay-type {
+		padding: 30rpx;
+		border-radius: 20rpx;
+		display: flex;
+		align-items: center;
+		flex-direction: row;
+
+		.icon {
+			width: 32rpx;
+			height: 32rpx;
+		}
+
+		.title {
+			flex: 1;
+			padding: 0 20rpx;
+			font-size: 28rpx;
+			font-family: Source Han Sans CN;
+			font-weight: 400;
+			color: #ffffff;
+		}
+	}
+
+	.agree {
+		display: flex;
+		margin-top: 30rpx;
+
+		font-size: 20rpx;
+		font-family: Source Han Sans CN;
+		font-weight: 400;
+		color: #999999;
+		line-height: 32rpx;
+
+		.icon {
+			width: 32rpx;
+			height: 32rpx;
+			margin-right: 10rpx;
+		}
+	}
+
+	.rule {
+		padding: 20rpx;
+		background: #F9F8E1;
+		border-radius: 20rpx;
+		box-sizing: border-box;
+		margin: 20rpx 0 0;
+
+		.rule-inner {
+			max-height: 160rpx;
+			font-size: 20rpx;
+			font-weight: 400;
+			color: #999999;
+		}
+	}
+
+	.pay-btn {
+		margin: 30rpx auto 0;
+		width: 686rpx;
+		height: 84rpx;
+		background: url($imgurl+'common/payBtn.png') no-repeat 0 0 / 100% 100%;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		font-weight: 500;
+		color: #CDEF27;
+
+		>text:nth-child(1) {
+			font-size: 28rpx;
+		}
+
+		>text:nth-child(2) {
+			font-size: 36rpx;
+		}
+	}
+}
 </style>
\ No newline at end of file