From 662617b5acc471895d0e392e06d143b09e9e64ad Mon Sep 17 00:00:00 2001
From: czm <2192718639@qq.com>
Date: Mon, 12 Dec 2022 10:48:10 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=88=20perf(=E4=BC=98=E5=8C=96=E6=94=AF?=
=?UTF-8?q?=E4=BB=98):?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/app.tsx | 1 +
src/common/constant.ts | 5 ++-
.../components/payment/index.module.scss | 24 +++++++++++-
src/pages/order/components/payment/index.tsx | 22 +++--------
src/use/usePayBank.ts | 37 +++++++++++++------
5 files changed, 59 insertions(+), 30 deletions(-)
diff --git a/src/app.tsx b/src/app.tsx
index ae59bbe..7ca76a5 100644
--- a/src/app.tsx
+++ b/src/app.tsx
@@ -5,6 +5,7 @@ import configStore from './store'
import { shareShop } from './common/util'
import ContextBlueTooth from '@/use/contextBlueTooth'
import './app.scss'
+import { BANk_WX_APPID } from './common/constant'
const store = configStore()
const App: FC = (params: { children?: React.ReactNode }) => {
diff --git a/src/common/constant.ts b/src/common/constant.ts
index e8850b0..2f06165 100644
--- a/src/common/constant.ts
+++ b/src/common/constant.ts
@@ -1,4 +1,4 @@
-// export const BASE_URL = CURRENT_BASE_URL
+export const BASE_URL = CURRENT_BASE_URL
// export const BASE_URL = `http://192.168.0.75:50001/lymarket`
// export const BASE_URL = `http://192.168.0.89:50001/lymarket`
// export const BASE_URL = `http://10.0.0.5:50001/lymarket`
@@ -40,6 +40,9 @@ export const CDN_UPLOAD_IMG = `${UPLOAD_CDN_URL || ''}`
// appid
export const WX_APPID = 'wx68d92d7cbf0b6963'
+// 招商银行小程序appid
+export const BANk_WX_APPID = 'wx65934ee32a88d726'
+
// 支付码单跳转链接
export const PAY_H5_CODE_URL = CURRENT_PAY_H5_CODE_URL
diff --git a/src/pages/order/components/payment/index.module.scss b/src/pages/order/components/payment/index.module.scss
index 55041de..bc5e958 100644
--- a/src/pages/order/components/payment/index.module.scss
+++ b/src/pages/order/components/payment/index.module.scss
@@ -27,6 +27,29 @@ $top: 190px;
line-height: 182px;
text-align: center;
border-bottom: 3px dashed #daddea;
+ position: relative;
+ &::before {
+ content: '';
+ width: 60px;
+ height: 60px;
+ background-color: #f7f7f7ff;
+ position: absolute;
+ bottom: 0;
+ right: 0;
+ border-radius: 50%;
+ transform: translate(50%, 50%);
+ }
+ &::after {
+ content: '';
+ width: 60px;
+ height: 60px;
+ background-color: #f7f7f7ff;
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ border-radius: 50%;
+ transform: translate(-50%, 50%);
+ }
}
.playMode {
width: 100%;
@@ -38,7 +61,6 @@ $top: 190px;
.payment_list {
background-color: #fff;
- // box-shadow: 2px 2px 6px 0px rgba(0,0,0,0.16);
min-height: 300px;
border-radius: 10px;
padding-bottom: 100px;
diff --git a/src/pages/order/components/payment/index.tsx b/src/pages/order/components/payment/index.tsx
index 6f6db3f..f68d6a1 100644
--- a/src/pages/order/components/payment/index.tsx
+++ b/src/pages/order/components/payment/index.tsx
@@ -180,22 +180,12 @@ const Payment = ({ show = false, onClose, orderInfo, onSubmitSuccess }: Param) =
}, [orderInfo, payInfo])
// 直接微信支付事件
- const { pullBank, payStatus } = usePayBank()
- const onBankPay = useCallback(() => {
- pullBank({ merchId: payInfo.merch_id, custMerchId: payInfo.pay_no })
- }, [payInfo])
-
const { fetchData: SubmitTradeOrderPayData } = SubmitTradeOrderPayApi()
- useEffect(() => {
- if (payStatus) {
- (async() => {
- const res = await SubmitTradeOrderPayData()
- if (res.success) {
- onSubmitSuccess?.()
- }
- })()
- }
- }, [payStatus])
+ const bankCallBack = useCallback(async() => {
+ const res = await SubmitTradeOrderPayData({ pay_no: payInfo?.pay_no })
+ if (res.success) { onSubmitSuccess?.() }
+ }, [payInfo])
+ const { pullBank, payStatus } = usePayBank({ merchId: payInfo?.merch_id, custMerchId: payInfo?.pay_no, callBack: bankCallBack })
return (
@@ -239,7 +229,7 @@ const Payment = ({ show = false, onClose, orderInfo, onSubmitSuccess }: Param) =
onClose={() => advanceSelectData(null)}
/>
-
+
diff --git a/src/use/usePayBank.ts b/src/use/usePayBank.ts
index ad0ca89..a13bd84 100644
--- a/src/use/usePayBank.ts
+++ b/src/use/usePayBank.ts
@@ -1,24 +1,36 @@
import { Button, View } from '@tarojs/components'
-import Taro, { useDidShow, useRouter } from '@tarojs/taro'
-import { useEffect, useState } from 'react'
+import Taro, { useDidShow, useLoad, useRouter } from '@tarojs/taro'
+import { useEffect, useRef, useState } from 'react'
+import { BANk_WX_APPID } from '@/common/constant'
interface Param {
merchId: string
custMerchId: string
needCashier?: '1'|'0'
+ callBack?: (val: any) => void // 从招商银行返回时的回调函数
}
-export default () => {
+export default (props: Param) => {
+ const { merchId = '', custMerchId = '', needCashier = '1', callBack } = props
const [payStatus, setPayStatus] = useState(false)
- Taro.onAppShow((res) => {
- if (res?.referrerInfo?.appId == 'wx65934ee32a88d726') {
- const tf = res?.referrerInfo?.extraData?.payStatus == 'success'
- setPayStatus(() => tf)
- }
- })
- const pullBank = ({ merchId = '', custMerchId = '', needCashier = '1' }: Param) => {
+ const openStatus = useRef(false)
+ console.log('openstatus::', openStatus)
+ useEffect(() => {
+ Taro.onAppShow((res) => {
+ if (res?.referrerInfo?.appId == BANk_WX_APPID && !openStatus.current) {
+ console.log('onAppShow::', res)
+ callBack?.(res)
+ const tf = res?.referrerInfo?.extraData?.payStatus == 'success'
+ setPayStatus(() => tf)
+ openStatus.current = true
+ }
+ })
+ }, [])
+
+ const pullBank = () => {
+ console.log('merchId::', `${merchId}&&${custMerchId}`)
Taro.navigateToMiniProgram({
- appId: CURRENT_PAY_Bank_APPID, // 生产环境Id【UAT测试环境appId:wx0fb358ee24237c71】
- // appId: 'wx0fb358ee24237c71', // 生产环境Id【UAT测试环境appId:wx0fb358ee24237c71】
+ // appId: CURRENT_PAY_Bank_APPID, // 生产环境Id【UAT测试环境appId:wx0fb358ee24237c71】
+ appId: 'wx65934ee32a88d726', // 生产环境Id【UAT测试环境appId:wx0fb358ee24237c71】
path: 'pages/index/index',
extraData: {
merchId, // 传商户号（必填，此处传JE开头的商户号）
@@ -27,6 +39,7 @@ export default () => {
},
success(res) { // 打开成功的回调函数
console.log('打开成功::', res)
+ openStatus.current = false
},
fail(res) {
console.log('打开失败::', res)