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)