Kaynağa Gözat

增加微信支付

杨再金 2 yıl önce
ebeveyn
işleme
6553029a14

+ 28 - 10
pages/paymentMethod/paymentMethod.scss

@@ -17,26 +17,26 @@
 }
 .pay-way-new {
 	display: flex;
-	justify-content: space-between;
-	width: calc(100% - 80rpx);
+	justify-content: space-around;
+	width: calc(100% - 60rpx);
 	border-top: solid 1px #979797;
-	margin: 23rpx auto;
-	padding: 36rpx 0;
+	margin: 23rpx auto 0;
+	padding: 36rpx 0 10rpx;
 	.pay-way-item {
-		width: calc(50% - 9rpx);
+		width: calc(33% - 9rpx);
 		border-radius: 20rpx;
 		text-align: center;
 		padding: 30rpx 0;
 		image {
-			width: 159rpx;
-			height: 159rpx;
+			width: 110rpx;
+			height: 110rpx;
 		}
 		.title {
-			font-size: 30rpx;
+			font-size: 28rpx;
 			font-weight: 400;
 			font-family: 'PingFangSC-Regular, PingFang SC';
 			color: #fff;
-			margin: 15rpx 0;
+			margin: 10rpx 0;
 		}
 		.subtitle {
 			font-size: 14rpx;
@@ -49,9 +49,27 @@
 	.pay-way-item-hy {
 		background: linear-gradient(153deg, #FA9460 0%, #FF5065 100%)
 	}
-	.pay-way-item-jh {
+	.pay-way-item-wx {
 		background: linear-gradient(155deg, #5EE3A6 0%, #3EB9C8 100%);
 	}
+	.pay-way-item-jh {
+		background: linear-gradient(155deg, #5AA6FF 0%, #C782FF 100%);
+	}
+}
+.pay-way-subtitle {
+	display: flex;
+	justify-content: space-around;
+	width: calc(100% - 60rpx);
+	margin: 0 auto 60rpx;
+	&-item {
+		width: calc(33% - 9rpx);
+		border-radius: 20rpx;
+		text-align: center;
+		font-size: 20rpx;
+		font-weight: 400;
+		font-family: 'PingFangSC-Regular, PingFang SC';
+		opacity: 0.73;
+	}
 }
 .pay-way-close-btn {
 	width: calc(100% - 80rpx);

+ 54 - 22
pages/paymentMethod/paymentMethod.vue

@@ -4,24 +4,15 @@
 	 -->
 	<view>
 		<u-modal
-		v-model="payWayPop"
-		:title-style="{color: '#404040'}"
-		title="缴费方式"
-		:show-confirm-button="false"
-		:show-cancel-button="false">
+			v-model="payWayPop"
+			:title-style="{color: '#404040'}"
+			title="缴费方式"
+			width="660rpx"
+			:show-confirm-button="false"
+			:show-cancel-button="false">
 			<view class="slot-content">
-				<!-- <view class="pay-way">
-					<view class="pay-way-item" @click="gyBankPay">
-						<image src="../../static/img/gy-bank-pay-icon.png" mode=""></image>
-						<view>贵州银行</view>
-					</view>
-					<view class="pay-way-item" @click="wechatPay">
-						<image src="../../static/img/wechat-pay-icon.png" mode=""></image>
-						<view>微信支付</view>
-					</view>
-				</view> -->
 				<view class="pay-way-new">
-					<view class="pay-way-item pay-way-item-hy" @click="gyBankPay">
+					<!-- <view class="pay-way-item pay-way-item-hy" @click="gyBankPay">
 						<image src="../../static/img/guiyang-bank-icon.png" mode=""></image>
 						<view class="title">贵州银行</view>
 						<view class="subtitle">前三个月每天首次一分钱<br/>长期八折优惠</view>
@@ -29,6 +20,33 @@
 					<view class="pay-way-item pay-way-item-jh" @click="wechatPay">
 						<image src="../../static/img/juhe-icon.png" mode=""></image>
 						<view class="title">微信/支付宝</view>
+					</view> -->
+					<view class="pay-way-item pay-way-item-hy" @click="gyBankPay">
+						<image src="/static/img/gyyh-icon.svg" mode=""></image>
+						<view class="title">贵州银行</view>
+					</view>
+					<!-- #ifdef H5 || MP-WEIXIN -->
+					<view class="pay-way-item pay-way-item-wx" @click="wechatPay" v-if="wxEnv">
+						<image src="/static/img/weixin-icon.svg" mode=""></image>
+						<view class="title">微信支付</view>
+					</view>
+					<!-- #endif -->
+					<view class="pay-way-item pay-way-item-jh" @click="juhePay">
+						<image src="/static/img/juhe-icon.svg" mode=""></image>
+						<view class="title">聚合支付</view>
+					</view>
+				</view>
+				<view class="pay-way-subtitle">
+					<view class="pay-way-subtitle-item">
+						前三个月每天首次一分钱,长期八折优惠
+					</view>
+					<!-- #ifdef H5 || MP-WEIXIN -->
+					<view class="pay-way-subtitle-item" v-if="wxEnv">
+						&nbsp;
+					</view>
+					<!-- #endif -->
+					<view class="pay-way-subtitle-item">
+						&nbsp;
 					</view>
 				</view>
 				<button class="pay-way-close-btn" @click="closePaymentMethod">关闭</button>
@@ -40,9 +58,9 @@
 
 <script>
 	import getUrlParams from "@/utils/getUrlParams.js";
-	// import {
-	// 	getEnvIsWx
-	// } from '@/utils/judgEnvironment.js'
+	import {
+		getEnvIsWx
+	} from '@/utils/judgEnvironment.js'
 	export default {
 		props: {
 			// 弹框显示
@@ -77,7 +95,12 @@
 			}
 		},
 		data() {
-			return {}
+			return {
+				wxEnv: true
+			}
+		},
+		created() {
+			this.wxEnv = getEnvIsWx()
 		},
 		methods: {
 			/**
@@ -118,19 +141,28 @@
 				});
 			},
 			/**
-			 * 微信支付
+			 * 聚合支付
 			 * 判断vuex中是否存在openId
 			 * 存在直接调起微信支付
 			 * 不存在则通过微信登录去获取用户的code
 			 * 完成后通过code去获取用户的openId等信息
 			 * 最后再调起微信支付
 			 * */
-			wechatPay() {
+			juhePay() {
 				uni.showLoading({
 				    title: '加载中'
 				});
 				this.getWXPayByJava(this.curOrderList, this.deviceNo)
 			},
+			/**
+			 * 微信支付
+			 */
+			wechatPay() {
+				this.$refs.uToast.show({
+					title: '暂不支持',
+					type: 'info',
+				});
+			},
 			/**
 			 * 调起微信支付接口
 			 * @param {Array} list 需要支付的订单组合数组

Dosya farkı çok büyük olduğundan ihmal edildi
+ 20 - 0
static/img/gyyh-icon.svg


Dosya farkı çok büyük olduğundan ihmal edildi
+ 14 - 0
static/img/juhe-icon.svg


Dosya farkı çok büyük olduğundan ihmal edildi
+ 14 - 0
static/img/weixin-icon.svg