微信支付

common/apiurl.js

@@ -60,7 +60,7 @@ const apiurl = {
 	payGzbankUrl: '/pay/gzbank/quick',
 	
 	// 贵州银行支付
-	gzbankurl:'http://wx.hw.hongweisoft.com/pay/client/gzbank/paygate',
+	gzbankurl:'http://wx.hw.hongweisoft.com/pay/client/gzbank/paygate'
 }
 
 export {

common/http.api.js

@@ -52,7 +52,6 @@ const install = (Vue, vm) => {
 	//贵州银行支付
 	let gzbank = (params = {}) => vm.$u.post(apiurl.gzbankurl, params);
 	
-	
 	// 将各个定义的接口名称，统一放进对象挂载到vm.$u.api(因为vm就是this，也即this.$u.api)下
 	vm.$u.api = {
 		feedbackAdd,

common/http.interceptor.js

@@ -54,8 +54,8 @@ const install = (Vue, vm) => {
 			storage.setItem('backUrl',location.href);
 			alert('还未登录,即将跳转登录');		
 			//setTimeout(()=>{location.href = 'http://h5.pdzhtc.com/#/pages/center/phoneLogin/phoneLogin';});//正式
-			// setTimeout(()=>{location.href = 'http://parkingh5.hw.hongweisoft.com/#/pages/center/phoneLogin/phoneLogin';});//64
-			setTimeout(()=>{location.href = 'http://127.0.0.1:8080/#/pages/center/phoneLogin/phoneLogin';});//本地
+			setTimeout(()=>{location.href = 'http://wx.hw.hongweisoft.com/wxpaydemoh5/#/pages/center/phoneLogin/phoneLogin';});//64
+			// setTimeout(()=>{location.href = 'http://172.16.90.127:8080/#/pages/center/phoneLogin/phoneLogin';});//本地
 			
 		}else return res;
 	}

pages.json

@@ -169,6 +169,17 @@
 		    }
 		    
 		}
+        ,{
+            "path" : "pages/favourableActivity/favourableActivity",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "一分钱停车",
+                "enablePullDownRefresh": false,
+                "navigationBarBackgroundColor": "#008CFF",
+                "navigationBarTextStyle": "white"
+            }
+            
+        }
     ],
 	"globalStyle": {
 		"navigationBarTextStyle": "black",

pages/center/phoneLogin/phoneLogin.vue

@@ -135,7 +135,14 @@ export default {
 					let switchTabList = ['/pages/use/use'];
 					if(switchTabList.includes(res.data)){}
 					console.log('backUrl',backUrl);
-					location.href = backUrl;
+					const local = window.location.href 
+					alert(backUrl)
+					if (backUrl) {
+						location.href = backUrl;
+					} else {
+						location.href = 'http://wx.hw.hongweisoft.com/wxpaydemoh5'
+					}
+					// location.href = backUrl;
 					// this.$refs.uToast.show({
 					// 	title: '操作成功',
 					// 	url: backUrl,

pages/favourableActivity/favourableActivity.scss

@@ -0,0 +1,90 @@
+.container {
+	height: calc(100vh - 88rpx);
+	.penny-parking {
+		height: 100%;
+		background-color: #B3DDFF;
+		padding-top: 39rpx;
+		.penny-parking-icon {
+			width: calc(100% - 56rpx);
+			height: 141rpx;
+			margin: 0 auto;
+			background-image: url('/static/img/penny-parking-icon.png');
+			background-position: center center;
+			background-size: 100% 100%;
+		}
+		.penny-parking-content {
+			width: 100%;
+			background-image: url('/static/img/penny-parking-bg.png');
+			background-size: 100% 100%;
+			background-position: center 50rpx;
+			view {
+				&:nth-child(1) {
+					color: #4E4E4E;
+					font-size: 28rpx;
+					font-weight: 300;
+					text-align: center;
+				}
+				&:nth-child(2) {
+					margin-top: 290rpx;
+					color: #1A517E;
+					font-weight: 400;
+					font-size: 26rpx;
+					line-height: 52rpx;
+					padding: 0 39rpx;
+				}
+				&:nth-child(3) {
+					margin-top: 60rpx;
+					color: #1A517E;
+					font-weight: 400;
+					font-size: 26rpx;
+					line-height: 52rpx;
+					padding: 0 39rpx;
+				}
+			}
+		}
+	}
+	.eighty-percent-of-parking {
+		height: 100%;
+		background-color: #FFECEC;
+		padding-top: 39rpx;
+		.penny-parking-icon {
+			width: calc(100% - 84rpx);
+			height: 141rpx;
+			margin: 0 auto;
+			background-image: url('/static/img/eighty-percent-parking-icon.png');
+			background-position: center center;
+			background-size: 100% 100%;
+		}
+		.penny-parking-content {
+			width: 100%;
+			background-image: url('/static/img/eighty-percent-parking-bg.png');
+			background-size: 554rpx 551rpx;
+			background-position: top;
+			background-repeat: no-repeat;
+			view {
+				&:nth-child(1) {
+					color: #4F4F4F;
+					font-size: 30rpx;
+					font-weight: 300;
+					text-align: center;
+				}
+				&:nth-child(2) {
+					margin-top: 500rpx;
+					color: #946969;
+					font-weight: 400;
+					font-size: 26rpx;
+					line-height: 52rpx;
+					padding: 0 39rpx;
+				}
+				&:nth-child(3) {
+					margin-top: 60rpx;
+					color: #946969;
+					font-weight: 400;
+					font-size: 26rpx;
+					line-height: 52rpx;
+					padding: 0 39rpx;
+				}
+			}
+		}
+	}
+}

pages/favourableActivity/favourableActivity.vue

@@ -0,0 +1,47 @@
+<template>
+	<!-- 优惠活动 -->
+	<view class="container">
+		<view class="penny-parking" v-if="id == 1">
+			<view class="penny-parking-icon"></view>
+			<view class="penny-parking-content">
+				<view>使用贵州银行支付可一分钱停车</view>
+				<view>从客户启用贵州银行行卡支付的第四个月开始，使用我行卡支付永久享受八折优惠（单日不限次数）。时间计算同上。三个月最后一天，假如车主跨天的话，拆分账单计算：三个月内一分钱或八折，三个月外时段八折。
+				</view>
+				<view>如果停车场、路边停车位有15分钟内等免费政策的，我行客户自然享受后再按“一分钱停车”、“八折停车”执行。</view>
+			</view>
+		</view>
+		<view class="eighty-percent-of-parking" v-if="id == 2">
+			<view class="penny-parking-icon"></view>
+			<view class="penny-parking-content">
+				<view>使用贵州银行支付可享永久八折优惠</view>
+				<view>从客户启用贵州银行行卡支付的第四个月开始，使用我行卡支付永久享受八折优惠（单日不限次数）。时间计算同上。三个月最后一天，假如车主跨天的话，拆分账单计算：三个月内一分钱或八折，三个月外时段八折。
+				</view>
+				<view>如果停车场、路边停车位有15分钟内等免费政策的，我行客户自然享受后再按“一分钱停车”、“八折停车”执行。</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				id: ''
+			}
+		},
+		onLoad(page) {
+			uni.setNavigationBarTitle({
+				title: page.title
+			})
+			this.id = page.id
+		},
+		onShow() {
+			console.log(this.id == 1)
+		},
+		methods: {
+		}
+	}
+</script>
+<style lang="scss" scoped>
+@import './favourableActivity.scss'
+</style>

pages/index/index.scss

@@ -231,4 +231,25 @@ page{background-color: $my-page-bg-color;}
 	padding: 32rpx 0 25rpx 30rpx;
 	border-radius: 15rpx;
 	overflow: hidden;
+}
+/* 优惠活动 */
+.promotion-box {
+	padding: 10px 20px;
+	.promotion-title {
+		text {
+			color: #3A3A3A;
+			font-size: 36rpx;
+			font-family: PingFangSC-Regular, PingFang SC;
+		}
+	}
+	.promotion-banner {
+		margin-top: 20rpx;
+		/deep/ .u-indicator-item-round {
+			background-color: #AAD8FF;
+		}
+		/deep/ .u-indicator-item-round-active {
+			background-color: #008CFF;
+			width: 20rpx;
+		}
+	}
 }

pages/index/index.vue

@@ -110,7 +110,7 @@
 				</view>
 			</u-card>
 		</template>
-		<view class="promotion" @click="$refs.uToast.show({title: '建设中'})">
+		<!-- <view class="promotion" @click="$refs.uToast.show({title: '建设中'})">
 			<view class="promotion-header u-flex u-row-between">
 				<view class="promotion-header-til">优惠活动</view>
 				<view class="promotion-header-con">去领取</view>
@@ -119,6 +119,33 @@
 				<view class="promotion-body-til">八折停车</view>
 				<view class="promotion-body-con">从客户启用贵州银行行卡支付的第四个月开始，使用我行卡支付永久享受八折优惠（单日不限次数)...</view>
 			</view>
+		</view> -->
+		<view class="promotion-box">
+			<view class="promotion-title">
+				<text>优惠活动</text>
+			</view>
+			<view class="promotion-banner">
+				<!-- <swiper
+					class="promotion-banner-swiper"
+					:indicator-dots="true"
+					indicator-color="rgba(170, 216, 255, 1)"
+					indicator-active-color="#008CFF"
+					:autoplay="true"
+					:duration="500"
+					mode="dot"
+					:interval="3000"
+					:circular="true">
+					<swiper-item v-for="(item, index) in promotionBannerList" :key="'bannner' + index">
+						<view class="promotion-banner-item">
+							<image :src="item.image" mode=""></image>
+						</view>
+					</swiper-item>
+				</swiper> -->
+				<u-swiper
+					:list="promotionBannerList"
+					@click="promotionBannerClick"
+					height="221"></u-swiper>
+			</view>
 		</view>
 		
 		<u-modal 
@@ -166,8 +193,20 @@
 				bindCarShow:false,//绑定车询问弹窗
 				showOrderDetails:false,//是否线上订单细节
 				popupOrderDetails:[],
-				noticeList:[]
-				
+				noticeList:[],
+				// 优惠活动广告图
+				promotionBannerList: [
+					{
+						id: 1,
+						image: '/static/img/promotion-banner-1.png',
+						title: '1分钱停车'
+					},
+					{
+						id: 2,
+						image: '/static/img/promotion-banner-2.png',
+						title: '八折停车'
+					}
+				]
 			}
 		},
 		onShow() {
@@ -277,7 +316,22 @@
 				    phoneNumber: phone
 				});
 			},
-			
+			/**
+			 * 点击优惠活动的广告图
+			 * */
+			promotionBannerClick(cur) {
+				this.promotionBannerList.forEach((item, index) => {
+					if (cur === index) {
+						this.$u.route({
+							url:'pages/favourableActivity/favourableActivity',
+							params: {
+								title: item.title,
+								id: item.id
+							}
+						})
+					}
+				})
+			}
 
 		}
 	}

pages/payLists/payLists.scss

@@ -66,3 +66,39 @@
 		z-index: 999;
 	}
 }
+.pay-tips {
+	width: calc(100% - 34rpx);
+	margin: 23rpx auto;
+	border-top: solid 1px #979797;
+	padding: 38rpx 0;
+	color: #5F5F5F;
+	text {
+		color: #3397FA;
+		padding: 0 10rpx;
+	}
+}
+.pay-way {
+	display: flex;
+	justify-content: space-between;
+	width: calc(100% - 34rpx);
+	border-top: solid 1px #979797;
+	margin: 23rpx auto;
+	padding: 38rpx 86rpx;
+	.pay-way-item {
+		text-align: center;
+		font-size: 30rpx;
+		color: #5F5F5F;
+		image {
+			width: 143rpx;
+			height: 143rpx;
+		}
+	}
+}
+.pay-way-close-btn {
+	width: calc(100% - 34rpx);
+	margin: 0 auto 68rpx;
+	border: none;
+	background-color: #3397FA;
+	color: #fff;
+	border-radius: 10rpx;
+}

pages/payLists/payLists.vue

@@ -20,21 +20,64 @@
 							<view class="pay-center-item">应付金额：<span class="pay-amount">{{payItem.payAmount}}</span></view>
 						</view>
 						<view class="pay-bottom">
-							<u-cell-item title="去支付" @click="paythis(payItem.orderId)" style="color: #008CFF;"></u-cell-item>
+							<!-- <u-cell-item title="去支付" @click="paythis(payItem.orderId)" style="color: #008CFF;"></u-cell-item> -->
+							<u-cell-item title="去支付" @click="choosePayWay(payItem.orderId)" style="color: #008CFF;"></u-cell-item>
 						</view>
 					</view>
 				</view>
 			</scroll-view>
 		</mescroll-body>
 		<view class="button-wrap" v-if="payList.length&&payList.length>=1">
-			<button class="button" type="primary" @click="all()">全部缴费</button>
+			<!-- <button class="button" type="primary" @click="all()">全部缴费</button> -->
+			<button class="button" type="primary" @click="confirmPrice()">全部缴费</button>
 		</view>
+		<!-- 缴费提示-->
+		<u-modal
+		v-model="payTipsPop"
+		:title-style="{color: '#404040'}"
+		title="缴费提示"
+		:show-confirm-button="true"
+		confirm-text="立即缴费"
+		:confirm-style="{backgroundColor: '#3397FA', color: '#fff'}"
+		:show-cancel-button="true"
+		cancel-text="取消"
+		:cancel-style="{backgroundColor: '#EBF1FF', color: '#3397FA'}"
+		@confirm="payTipsPopConfirm">
+			<view class="slot-content">
+				<view class="pay-tips">
+					<text>{{payTipsItem.num}}</text>场停车欠费，共
+					<text>{{payTipsItem.price}}</text>元
+				</view>
+			</view>
+		</u-modal>
+		<!-- 缴费方式-->
+		<u-modal
+		v-model="payWayPop"
+		:title-style="{color: '#404040'}"
+		title="缴费方式"
+		: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>
+				<button class="pay-way-close-btn" @click="payWayPop = false">关闭</button>
+			</view>
+		</u-modal>
 		<u-toast ref="uToast" />
 	</view>
 </template>
 
 <script>
 	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
+	import getUrlParams from "../../utils/getUrlParams.js";
 	export default {
 		mixins: [MescrollMixin], // 使用mixin
 		data() {
@@ -46,6 +89,16 @@
 				],
 				orderList: [],
 				PayUrl: "",
+				payTipsPop: false,
+				payWayPop: false,
+				// 选中去支付的单条条目
+				currentItem: [],
+				// 缴费提示类目
+				payTipsItem: {
+					num: '',
+					price: ''
+				},
+				code: null,
 			};
 		},
 		computed: {
@@ -64,6 +117,19 @@
 				};
 			}
 		},
+		onLoad(){
+			// let locationLocaturl = window.location.hash;
+			// this.orderId = getUrlParams(locationLocaturl,"orderId"); // 截取orderId
+			// console.log('this.orderId',this.orderId);
+			// if (this.orderId) {
+			// 	this.handleGetOrderinfo(this.orderId);
+			// }
+			// this.code = getUrlParams(locationLocaturl,"code");
+			// if (this.code) {
+			// 	this.handleGetWXInfo(this.code)
+			// }
+			
+		},
 		methods: {
 			customBack(){
 				this.$u.route({
@@ -157,7 +223,142 @@
 						type: 'error',
 					});
 				});
-			}
+			},
+			// 去支付,选择支付方式
+			choosePayWay(item) {
+				console.log(item)
+				this.currentItem = []
+				this.currentItem.push(item)
+				this.payWayPop = true
+			},
+			// 贵阳银行支付
+			gyBankPay(list) {
+				this.$u.api.payGzbank({orderList: this.currentItem}).then(res=>{
+					let payUrl = res.data.url;
+					this.currentPayUrl=encodeURIComponent(res.data.url);
+					// console.log('this.currentPayUrl',this.currentPayUrl);
+					// return;
+					this.$u.route({
+						url: 'pages/payLists/pay',
+						params: {
+							currentPayUrl:this.currentPayUrl
+						}
+					});
+				}).catch(err=>{
+					this.$refs.uToast.show({
+						title: err.msg,
+						type: 'error',
+					});
+				});
+			},
+			// 微信支付
+			wechatPay() {
+				const openId = this.$store.state.vuex_wxinfo.openId
+				if (openId) {
+					this.getWXPay(this.currentItem)
+				} else {
+					this.getCode()
+				}
+			},
+			// 全部缴费确认
+			confirmPrice() {
+				let orderNum = 0, price = 0
+				this.currentItem = []
+				this.payList.forEach(item => {
+					console.log(item)
+					if (item.orderStatus !== 2 && item.payStatus !== 1 ) {
+						price += item.payAmount
+						orderNum ++
+						this.currentItem.push(item.orderId)
+					}
+				})
+				this.payTipsItem.num = orderNum
+				this.payTipsItem.price = price
+				if (orderNum !== 0 && price !== 0) {
+					this.payTipsPop = true
+				} else {
+					this.$refs.uToast.show({
+						title: '没有需要支付的订单',
+						type: 'warning'
+					})
+				}
+			},
+			// 缴费提示弹框确认
+			payTipsPopConfirm() {
+				this.payWayPop = true
+			},
+			getCode () {
+				var local = window.location.href // 获取页面url
+				let locationLocaturl = window.location.search;
+				this.code = getUrlParams(locationLocaturl,"code"); // 截取code
+				if (this.code == null || this.code === '') { // 如果没有code，则去请求
+					window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${this.config.wxAppid}&redirect_uri=${encodeURIComponent(local)}&response_type=code&scope=snsapi_userinfo&#wechat_redirect`
+				} else {
+					this.handleGetWXInfo(this.code) //把code传给后台获取用户信息
+				}
+			},
+			handleGetWXInfo (code) { // 通过code获取 openId等用户信息，/api/user/wechat/login 为后台接口
+				let _this = this
+				this.$u.api.getWXInfo(code).then((res) => {
+					if (res.code === 200 ) {
+						this.$u.vuex('vuex_wxinfo', res.data);
+						// 继续支付
+						this.getWXPay(this.currentItem)
+					}
+				}).catch((err) => {
+					this.$refs.uToast.show({
+						title: err.msg,
+						type: 'error',
+					});
+				})
+			},
+			async getWXPay(list){
+				let params = {
+					orderList: list,
+					openid:this.$store.state.vuex_wxinfo.openId
+				};
+				await this.$wxApi.config();
+				this.$pay.wechatPay(params).then(res =>{
+					if(res.code == 0){
+						// 成功
+						this.$u.route({
+							url:'pages/payLists/payLists',
+							// params: {
+							// 	keyword: this.keyword
+							// }
+						});
+					}else if(res.code == 1){
+						// 取消
+						// uni.redirectTo({
+						// 	url: '/pages/userCenter/myOrder/myOrder'
+						// })
+					}else if(res.code == 2){
+						this.$refs.uToast.show({
+							title: '支付失败，请检查!',
+							type: 'error',
+							// url: '/pages/user/index'
+						});
+					}
+				});
+			},
+			handleGetOrderinfo(orderId){
+				this.$u.api.getOrderinfo({id:orderId})
+				.then(res=>{
+					// this.$refs.uToast.show({
+					// 	title: res.msg,
+					// 	type: 'success',
+					// });
+					this.orderInfo = res.data;
+					console.log('handleGetOrderinfo',JSON.parse(JSON.stringify(res)));
+				}).catch(err=>{
+					this.$refs.uToast.show({
+						title: err.msg,
+						type: 'error',
+					});
+					console.log('handleGetOrderinfo ',err)
+				});
+				
+			},
 		}
 	};
 </script>

pay.js

@@ -29,6 +29,24 @@ export default {
 				})
 		});
 	},
+	//微信支付
+	wechatPay(obj = {}) {
+		uni.showLoading({
+			title: '支付中'
+		});
+		return new Promise(r => {
+			$http.post("/pay/wechat",obj)
+				.then(res=>{
+					//#ifdef H5
+					$wxApi.JSAPI(res.data.wx).then(r);
+					//#endif
+					this.payError(res);
+				}).catch(err =>{
+					alert(err.msg);
+					console.log('pay err',err);
+				})
+		});
+	},
 	//支付错误处理
 	payError(res){
 		uni.hideLoading();