微信鉴权

App.vue

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2019-04-01 01:47:12
  * @LastEditors: ch
- * @LastEditTime: 2022-04-22 14:47:06
+ * @LastEditTime: 2022-04-28 16:44:46
  * @Description: file content
 -->
 <script>
@@ -12,8 +12,6 @@
 		},
 		onShow: function() {
 			// console.log('App Show')
-
-		// console.log(this.$route);
 		},
 		onHide: function() {
 			// console.log('App Hide')

common/api/order.js

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-03-29 17:38:17
  * @LastEditors: ch
- * @LastEditTime: 2022-04-27 11:41:20
+ * @LastEditTime: 2022-04-28 16:34:02
  * @Description: file content
  */
 import {ToAsyncAwait, MsbRequestTk} from '@/common/utils';
@@ -43,6 +43,14 @@ export const  ApiGetOrderDetail = (id) =>
 export const  ApiGetOrderProductDetail = ({orderProductId}) =>
 	ToAsyncAwait(MsbRequestTk.get(`${BASE_URL}/app/tradeOrder/product/${orderProductId}`));
 
+/**
+* 提交订单
+* @param {*} data 
+*/
+export const ApiGetOrderPaySatus = ({orderId}) => 
+	ToAsyncAwait(MsbRequestTk.get(`${BASE_URL}/app/tradeOrder/payResult/${orderId}`));
+   
+
 /**
  * 获取物流信息
  * @param {*} orderId 
@@ -69,13 +77,6 @@ export const ApiPostSubmitOrder = (data) =>
 export const ApiPutCancelOrder = (data) => 
 	ToAsyncAwait(MsbRequestTk.put(`${BASE_URL}/app/tradeOrder/cancel`, data));
 
-/**
- * 获取支付参数
- * @param {*} data 
- */
-export const ApiPostWxPay = (data) => 
-	ToAsyncAwait(MsbRequestTk.post(`${BASE_URL}/pay/wxPay/h5`, data));
-	// ToAsyncAwait(MsbRequestTk.get(`${BASE_URL}/pay/payTest`, data));
 
 /**
  * 获取订单统计数据

common/api/wx.js

@@ -0,0 +1,31 @@
+/*
+ * @Author: ch
+ * @Date: 2022-04-28 16:30:54
+ * @LastEditors: ch
+ * @LastEditTime: 2022-04-28 17:00:54
+ * @Description: file content
+ */
+
+import {ToAsyncAwait, MsbRequest, MsbRequestTk} from '@/common/utils';
+
+const BASE_URL = '/mall/trade';
+const APPID = 'wx0643970a8e86d028'
+/**
+ * 获取授权页面地址
+ * @param {*} data 
+ */
+export const ApiGetAuthUrl = (params) => 
+	ToAsyncAwait(MsbRequest.get(`${BASE_URL}/wx/mp/getAuthorizationUrl/${APPID}`, params));
+/**
+ * 获取openId
+ * @param {*} data 
+ */
+export const ApiGetOpenId = ({code}) => 
+	ToAsyncAwait(MsbRequest.get(`${BASE_URL}/wx/mp/getOpenId/${APPID}`, {code}));
+
+/**
+ * 获取支付参数
+ * @param {*} data 
+ */
+export const ApiPostWxPay = (data) => 
+	ToAsyncAwait(MsbRequestTk.post(`${BASE_URL}/pay/wxPay/h5`, data));

common/store/index.js

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-03-22 18:28:52
  * @LastEditors: ch
- * @LastEditTime: 2022-04-25 19:24:25
+ * @LastEditTime: 2022-04-28 16:45:47
  * @Description: file content
  */
 import Vue from 'vue'
@@ -23,8 +23,8 @@ export default new Vuex.Store({
 		userInfo : JSON.parse(uni.getStorageSync(USER_INFO) || '{}'),
 		address : JSON.parse(uni.getStorageSync(ADDRESS) || '[]'),
 		sessionData : [],
-		sessionMsgData : {},
-		sessionMsgCount : 0
+		sessionMsgCount : 0,
+		openId : ''
 	},
 	mutations:{
 		SET_TOKEN (state, token = ''){

common/utils/requset.js

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-03-17 17:42:32
  * @LastEditors: ch
- * @LastEditTime: 2022-04-27 21:37:21
+ * @LastEditTime: 2022-04-28 17:04:33
  * @Description: 项目接口请求统一处理器，返回一个需要token和不需要token的请求封装方法
  */
 

common/utils/utils.js

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-03-17 19:15:10
  * @LastEditors: ch
- * @LastEditTime: 2022-04-26 15:49:50
+ * @LastEditTime: 2022-04-28 16:53:27
  * @Description: 一些无法归类的公共方法容器
  */
 
@@ -139,6 +139,20 @@ const createUUID = (len,radix) => {
 
   return uuid.join('');
 }
+
+const toSearchJson = (search)=>{
+    search = search.replace(/\?/g,'&');
+    let searchArr = search.split('&'),
+        obj = {};
+    searchArr.forEach(i =>{
+        const me = i.split('=');
+        if(me[0]){
+            obj[me[0]] = decodeURIComponent(me[1]);
+        }
+    });
+    return obj;
+}
+export default toSearchJson;
 // 工具类的文件需要把文件提供的工具类统一放最下方做一个统一输出
 export {
     // async await 标识结果处理
@@ -155,5 +169,6 @@ export {
     IsDouble,
     // 时间格式化
     formatDate,
-    createUUID
+    createUUID,
+    toSearchJson
 }

h5/index.html

@@ -1,2 +1,2 @@
 <!DOCTYPE html><html lang=zh-CN><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><title>马士兵严选</title><script>var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') || CSS.supports('top: constant(a)'))
-            document.write('<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' + (coverSupport ? ', viewport-fit=cover' : '') + '" />')</script><link rel=stylesheet href=/static/index.a5c69d49.css></head><body><noscript><strong>Please enable JavaScript to continue.</strong></noscript><div id=app></div><script src=/static/js/chunk-vendors.b5602bf5.js></script><script src=/static/js/index.47712c4f.js></script></body></html>
+            document.write('<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' + (coverSupport ? ', viewport-fit=cover' : '') + '" />')</script><link rel=stylesheet href=/static/index.a5c69d49.css></head><body><noscript><strong>Please enable JavaScript to continue.</strong></noscript><div id=app></div><script src=/static/js/chunk-vendors.b5602bf5.js></script><script src=/static/js/index.5fd286ec.js></script></body></html>

main.js

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2021-07-26 23:22:16
  * @LastEditors: ch
- * @LastEditTime: 2022-04-26 17:45:58
+ * @LastEditTime: 2022-04-28 17:03:52
  * @Description: file content
  */
 import Vue from 'vue';
@@ -12,6 +12,9 @@ import {router,RouterMount} from '@/common/router/index.js';
 import uView from 'uview-ui'; 
 import store from '@/common/store';
 import Confirm from '@/components/mount/index';
+import route from 'uview-ui/libs/util/route';
+import {toSearchJson} from '@/common/utils';
+import {ApiGetOpenId, ApiGetAuthUrl} from '@/common/api/wx';
 // import {MsbWebSkt, createUUID} from '@/common/utils';
 
 // 进入应用则向IM发起心跳包 以及获取IM会话数据
@@ -36,6 +39,37 @@ import Confirm from '@/components/mount/index';
 // });
 
 
+// 微信打开需要授权
+if(ua.includes('micromessenger')) {
+    if(!store.state.openId){
+        let query = toSearchJson(window.location.search)
+        if(query.code){
+            ApiGetOpenId({
+                code : query.code
+            }).then(({error, result}) => {
+                if(error){
+                    uni.$u.toast(error.message);
+                    return false;
+                }
+                store.commit('SET_OPEN_ID', result.openId);
+            })
+        }else{
+            ApiGetAuthUrl({
+                redirectUrl : window.location.href,
+                scope : 'snsapi_base'
+            }).then(({result, error}) => {
+                if(error){
+                    uni.$u.toast(error.message);
+                    return false;
+                }
+                window.location.href = result;
+            })
+        }
+    }
+    // 微信JSAPI
+    
+}
+
 Vue.use(router);
 Vue.use(uView);
 Vue.use(Confirm);

manifest.json

@@ -79,16 +79,16 @@
         "devServer" : {
             "proxy" : {
                 "/uc/" : {
-                    "target" : "http://192.168.10.9:8090/"
+                    "target" : "https://k8s-horse-gateway.mashibing.cn"
                 },
                 "/mall/" : {
-                    "target" : "http://192.168.10.9:8090/"
+                    "target" : "https://k8s-horse-gateway.mashibing.cn"
                 },
                 "/pay/" : {
-                    "target" : "http://192.168.10.9:8090/"
+                    "target" : "https://k8s-horse-gateway.mashibing.cn"
                 },
                 "/oss/" : {
-                    "target" : "http://192.168.10.9:8090/"
+                    "target" : "https://k8s-horse-gateway.mashibing.cn"
                 }
             }
         }

pages.json

@@ -184,6 +184,13 @@
 				"navigationBarTitleText": "支付失败"
 			}
 		},
+		{
+			"path": "pages/order/payResult",
+			"aliasPath" : "/payResult",
+			"style": {
+				"navigationBarTitleText": "支付中"
+			}
+		},
 		{
 			"path": "pages/order/saleAfter/saleAfterList",
 			"aliasPath" : "/saleAfterList",

pages/order/detail/components/StatusTips.vue

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-03-31 17:53:43
  * @LastEditors: ch
- * @LastEditTime: 2022-04-22 18:20:00
+ * @LastEditTime: 2022-04-28 16:26:46
  * @Description: file content
 -->
 <template>
@@ -55,7 +55,7 @@ export default {
 				this.timer();
 
 			}else if(orderStatus === '2'){
-				this.ctxCon.tips = this.orderInfo.closeReason;
+				this.ctxCon.tips = this.orderInfo.cancelReason;
 			}
 		}
 	},

pages/order/detail/index.vue

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-03-31 14:26:09
  * @LastEditors: ch
- * @LastEditTime: 2022-04-22 21:11:38
+ * @LastEditTime: 2022-04-28 16:26:32
  * @Description: file content
 -->
 <template>
@@ -72,7 +72,7 @@ export default {
 		 * 超时自动关闭订单
 		 */
 		timerCloseOrder(){
-			this.orderInfo = {...this.orderInfo, orderStatus : 2, closeReason:'超时未支付'};
+			this.orderInfo = {...this.orderInfo, orderStatus : 2, cancelReason:'超时未支付'};
 			this.getOrderInfo();
 		}
 		

pages/order/payFail.vue

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-03-28 17:16:44
  * @LastEditors: ch
- * @LastEditTime: 2022-04-09 15:02:41
+ * @LastEditTime: 2022-04-28 15:34:43
  * @Description: file content
 -->
 <template>
@@ -16,8 +16,7 @@
 <script>
 import UiButton from '@/components/UiButton.vue'
 export default {
-	components: { UiButton },
-	
+	components: { UiButton }
 }
 </script>
 <style lang="scss" scoped>

pages/order/payResult.vue

@@ -0,0 +1,117 @@
+<!--
+ * @Author: ch
+ * @Date: 2022-04-28 15:01:41
+ * @LastEditors: ch
+ * @LastEditTime: 2022-04-28 15:46:19
+ * @Description: file content
+-->
+
+<template>
+	<view>
+		<template v-if="!orderInfo">
+			<view class="title">交易中</view>
+			<view class="desc">正在交易中，请您耐心等待...</view>
+		</template>
+		<template v-else>
+			<template v-if="orderInfo.isSuccess">
+				<image class="icon" src="@/static/order/paySuccess.png"/>
+				<view class="title">支付成功</view>
+				<view class="desc">您的包裹整装待发</view>
+				<view class="btns">
+					<UiButton class="btn" type="primaryLine" @click="$Router.replaceAll('/')">返回首页</UiButton>
+					<UiButton class="btn" type="solid"  @click="$Router.replace(`/orderDetail?id=${$Route.query.ordId}`)">查看订单</UiButton>
+				</view>
+				<view class="recommend-title">为您推荐</view>
+				<BsChoiceGoods></BsChoiceGoods>
+			</template>
+			<template v-else>
+				<image class="icon" src="@/static/order/payFail.png"/>
+				<view class="title">支付失败</view>
+				<view class="desc">请重新试试</view>
+				<UiButton class="btn">返回商品详情</UiButton>
+			</template>
+		</template>
+	</view>
+</template>
+<script>
+import UiButton from '@/components/UiButton.vue';
+import {ApiGetOrderPaySatus} from '@/common/api/order';
+export default {
+	components: { UiButton },
+	data(){
+		return {
+			orderInfo : '',
+			reuqestNum : 0
+		}
+	},
+	onShow(){
+		this.getOrderInfo();
+	},
+	methods : {
+		async getOrderInfo(){
+			this.reuqestNum++;
+			const {error, result} = await ApiGetOrderPaySatus({orderId : this.$Route.query.orderId});
+			if(error){
+				uin.$u.toast(error.message);
+				return false
+			}
+			if(!result.isSuccess && this.reuqestNum < 10){
+				setTimeout(()=>{
+					this.getOrderInfo();
+				}, 1000)
+				return false;
+			}
+			this.orderInfo = result;
+			uni.setNavigationBarTitle({title:result.isSuccess ? '支付成功' : '支付失败'});
+		}
+	}
+	
+}
+</script>
+<style lang="scss" scoped>
+page{
+	text-align: center;
+}
+.icon{
+	width: 400rpx;
+	height: 256rpx;
+	margin: 169rpx auto 42rpx;
+}
+.title{
+	font-size: $font-size-lg;
+	line-height: 44rpx;
+	color: $color-grey6;
+}
+.desc{
+	font-size: $font-size-sm;
+	line-height: 34rpx;
+	color: $color-grey4;
+}
+.btns{
+	margin: 74rpx 105rpx 0;
+	display: flex;
+	justify-content: space-between;
+}
+
+.recommend-title{
+	font-size: $font-size-lg;
+	text-align: center;
+	margin: 51rpx auto 30rpx auto;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	width: 500rpx;
+	&::after,&::before{
+		display: inline-block;
+		content: '';
+		width: 160rpx;
+		height: 2rpx;
+		background: linear-gradient(90deg, $color-grey3 0%, rgba(204, 204, 204, 0) 100%);
+		
+	}
+	&::before{
+		
+		background: linear-gradient(270deg, $color-grey3 0%, rgba(204, 204, 204, 0) 100%);
+	}
+}
+</style>

pages/order/submit.vue

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-03-20 14:14:53
  * @LastEditors: ch
- * @LastEditTime: 2022-04-27 11:56:07
+ * @LastEditTime: 2022-04-28 16:34:21
  * @Description: file content
 -->
 <template>
@@ -80,7 +80,8 @@
 
 <script>
 import UiCell from '@/components/UiCell';
-import {ApiPostSubmitOrder, ApiPostWxPay, ApiGetBeforeOrder, ApiGetBeforeCartOrder} from '@/common/api/order';
+import {ApiPostSubmitOrder, ApiGetBeforeOrder, ApiGetBeforeCartOrder} from '@/common/api/order';
+import { ApiPostWxPay } from '@/common/api/wx';
 import UiButton from '@/components/UiButton.vue';
 import UiWhiteBox from '../../components/UiWhiteBox.vue';
 export default {
@@ -180,44 +181,23 @@ export default {
 			}
 		},
 		async wxpay(orderId){
-			const {error, result} = await ApiPostWxPay({orderId});
-			if(error){
-				this.$Router.replace(`/payFail?ordId=${orderId}`)
-			}else{
-				this.$msb.confirm({
-					content : '确认微信支付是否已完成' ,
-					cancelText : '未支付',
-					confirmText : '支付已完成',
-					confirm(){
-						this.$Router.replace(`/paySuccess?ordId=${orderId}`)
-					},
-					cancel(){
-						this.$Router.replace(`/payFail?ordId=${orderId}`);
-					}
-				})
-				window.location.href = result.dataInfo.payUrl;
+			var ua   = navigator.userAgent.toLowerCase();   
 
+			if(ua.includes('micromessenger')) {
+				// 微信JSAPI
 				
+			}else{
+				//  h5支付
+				const {error, result} = await ApiPostWxPay({orderId});
+				if(error){
+					uni.$u.toast(error.message);
+					return false;
+				}
+				const redirect_url = decodeURIComponent(`https://like-app.mashibing.com/payResult?orderId=${orderId}`);
+				window.location.href = `${result.dataInfo.payUrl}&redirect_url=${redirect_url}`;
 			}
 
-			// this.$msb.confirm({
-			// 	content : '您确定要支付吗？',
-			// 	cancelText : '暂不支付',
-			// 	confirmText : '立即支付',
-			// 	confirm : async () => {
-			// 		const {error, result} = await ApiPostWxPay({orderId,payTypeEnum:'WXPAY'});
-			// 		if(error){
-			// 			this.$Router.replace(`/payFail?ordId=${orderId}`)
-			// 		}else{
-			// 			this.$Router.replace(`/paySuccess?ordId=${orderId}`)
-			// 		}
-			// 	},
-			// 	cancel : ()=>{
-			// 		this.$Router.replace(`/orderDetail?id=${orderId}`)
-			// 	}
-			// })
 			
-
 		}
 	}
 }