|
@@ -3,7 +3,18 @@ import { computed, defineComponent, onMounted, reactive, ref } from 'vue';
|
|
import styles from './order-detail.module.less';
|
|
import styles from './order-detail.module.less';
|
|
import Addres from './component/addres';
|
|
import Addres from './component/addres';
|
|
import OSticky from '@/components/m-sticky';
|
|
import OSticky from '@/components/m-sticky';
|
|
-import { Button, Cell, CellGroup, Image, Popup, showToast, Tag } from 'vant';
|
|
|
|
|
|
+import {
|
|
|
|
+ Button,
|
|
|
|
+ Cell,
|
|
|
|
+ CellGroup,
|
|
|
|
+ closeToast,
|
|
|
|
+ Image,
|
|
|
|
+ Popup,
|
|
|
|
+ showDialog,
|
|
|
|
+ showLoadingToast,
|
|
|
|
+ showToast,
|
|
|
|
+ Tag
|
|
|
|
+} from 'vant';
|
|
import Payment from '@/views/adapay/payment';
|
|
import Payment from '@/views/adapay/payment';
|
|
import { useRoute, useRouter } from 'vue-router';
|
|
import { useRoute, useRouter } from 'vue-router';
|
|
import request from '@/helpers/request';
|
|
import request from '@/helpers/request';
|
|
@@ -17,6 +28,7 @@ import ODialog from '@/components/m-dialog';
|
|
import { orderStatus } from '@/helpers/constant';
|
|
import { orderStatus } from '@/helpers/constant';
|
|
import QrcodePayment from './qrcode-payment';
|
|
import QrcodePayment from './qrcode-payment';
|
|
import { beforeSubmit } from './order-state';
|
|
import { beforeSubmit } from './order-state';
|
|
|
|
+import { listenerMessage, postMessage } from '@/helpers/native-message';
|
|
|
|
|
|
/**
|
|
/**
|
|
* 接入jsdk
|
|
* 接入jsdk
|
|
@@ -30,13 +42,15 @@ export default defineComponent({
|
|
const route = useRoute();
|
|
const route = useRoute();
|
|
const router = useRouter();
|
|
const router = useRouter();
|
|
const state = reactive({
|
|
const state = reactive({
|
|
- paymentType: 'adapay' as 'wxpay' | 'adapay', // 支付方式
|
|
|
|
|
|
+ // paymentType: '' as any, // 'adapay' as 'wxpay' | 'adapay', // 支付方式
|
|
orderTimer: null as any,
|
|
orderTimer: null as any,
|
|
paymentStatus: false,
|
|
paymentStatus: false,
|
|
showQrcode: false,
|
|
showQrcode: false,
|
|
qrCodeUrl: '',
|
|
qrCodeUrl: '',
|
|
pay_channel: '',
|
|
pay_channel: '',
|
|
orderNo: route.query.orderNo,
|
|
orderNo: route.query.orderNo,
|
|
|
|
+ paymentType: route.query.paymentType,
|
|
|
|
+ paymentChannel: route.query.paymentChannel,
|
|
orderInfo: {} as any, // 订单信息
|
|
orderInfo: {} as any, // 订单信息
|
|
goodsInfos: [] as any, // 订单信息列表
|
|
goodsInfos: [] as any, // 订单信息列表
|
|
config: route.query.config ? JSON.parse(route.query.config as any) : {},
|
|
config: route.query.config ? JSON.parse(route.query.config as any) : {},
|
|
@@ -113,6 +127,15 @@ export default defineComponent({
|
|
const config: any = state.config;
|
|
const config: any = state.config;
|
|
state.pay_channel = val.pay_channel;
|
|
state.pay_channel = val.pay_channel;
|
|
|
|
|
|
|
|
+ // 判断是否为原生支付
|
|
|
|
+ if (
|
|
|
|
+ val.pay_channel.indexOf('wxpay-app') !== -1 ||
|
|
|
|
+ val.pay_channel.indexOf('alipay-app') !== -1
|
|
|
|
+ ) {
|
|
|
|
+ submitNativePay();
|
|
|
|
+ return;
|
|
|
|
+ }
|
|
|
|
+
|
|
const params = qs.stringify({
|
|
const params = qs.stringify({
|
|
pay_channel: val.pay_channel,
|
|
pay_channel: val.pay_channel,
|
|
wxAppId: config.wxAppId,
|
|
wxAppId: config.wxAppId,
|
|
@@ -172,6 +195,72 @@ export default defineComponent({
|
|
}, 5000);
|
|
}, 5000);
|
|
};
|
|
};
|
|
|
|
|
|
|
|
+ const submitNativePay = async () => {
|
|
|
|
+ // 支付...
|
|
|
|
+ try {
|
|
|
|
+ const { data } = await request.post(
|
|
|
|
+ '/edu-app/open/userOrder/executePayment',
|
|
|
|
+ {
|
|
|
|
+ data: {
|
|
|
|
+ ...state.config
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ );
|
|
|
|
+
|
|
|
|
+ const payChannel = state.config.paymentChannel;
|
|
|
|
+ let payStr = payChannel.indexOf('wxpay') !== -1 ? 'wx_app' : 'ali_app';
|
|
|
|
+
|
|
|
|
+ postMessage({
|
|
|
|
+ api: 'paymentOrder',
|
|
|
|
+ content: {
|
|
|
|
+ orderNo: state.orderNo,
|
|
|
|
+ payChannel: payStr,
|
|
|
|
+ payInfo: data.reqParams.body || JSON.stringify(data.reqParams)
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ showLoadingToast({
|
|
|
|
+ message: '支付中...',
|
|
|
|
+ forbidClick: true,
|
|
|
|
+ duration: 3000,
|
|
|
|
+ loadingType: 'spinner'
|
|
|
|
+ });
|
|
|
|
+ // 唤起支付时状态
|
|
|
|
+ listenerMessage('paymentOperation', result => {
|
|
|
|
+ console.log(result, 'init paymentOperation');
|
|
|
|
+ paymentOperation(result?.content);
|
|
|
|
+ });
|
|
|
|
+ } catch (e: any) {
|
|
|
|
+ console.log(e);
|
|
|
|
+ }
|
|
|
|
+ };
|
|
|
|
+
|
|
|
|
+ const paymentOperation = (res: any) => {
|
|
|
|
+ console.log(res, 'paymentOperation');
|
|
|
|
+ // 支付状态
|
|
|
|
+ // paymentOperation 支付成功:success 支付失败:error 支付取消:cancel 未安装:fail
|
|
|
|
+ // error 只有安卓端有
|
|
|
|
+ closeToast();
|
|
|
|
+ if (res.status === 'success' || res.status === 'error') {
|
|
|
|
+ router.replace({
|
|
|
|
+ path: '/payment-result',
|
|
|
|
+ query: {
|
|
|
|
+ orderNo: state.orderNo
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ } else if (res.status === 'cancel') {
|
|
|
|
+ } else if (res.status === 'fail') {
|
|
|
|
+ const payChannel = state.config.paymentChannel;
|
|
|
|
+ const message =
|
|
|
|
+ payChannel.indexOf('wxpay') !== -1
|
|
|
|
+ ? '您尚未安装微信'
|
|
|
|
+ : '您尚未安装支付宝';
|
|
|
|
+ showDialog({
|
|
|
|
+ title: '提示',
|
|
|
|
+ message
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ };
|
|
|
|
+
|
|
// 确定支付
|
|
// 确定支付
|
|
const onSubmit = async () => {
|
|
const onSubmit = async () => {
|
|
clearInterval(state.orderTimer);
|
|
clearInterval(state.orderTimer);
|
|
@@ -470,9 +559,16 @@ export default defineComponent({
|
|
style={{ minHeight: '30%' }}>
|
|
style={{ minHeight: '30%' }}>
|
|
<Payment
|
|
<Payment
|
|
paymentConfig={state.orderInfo}
|
|
paymentConfig={state.orderInfo}
|
|
|
|
+ config={{
|
|
|
|
+ paymentType: state.paymentType,
|
|
|
|
+ paymentChannel: state.paymentChannel
|
|
|
|
+ }}
|
|
onClose={() => (state.paymentStatus = false)}
|
|
onClose={() => (state.paymentStatus = false)}
|
|
onBackOut={onBackOut}
|
|
onBackOut={onBackOut}
|
|
onConfirm={(val: any) => onConfirm(val)}
|
|
onConfirm={(val: any) => onConfirm(val)}
|
|
|
|
+ onConfirmNative={(val: any) => {
|
|
|
|
+ state.config.paymentChannel = val.payChannel;
|
|
|
|
+ }}
|
|
/>
|
|
/>
|
|
</Popup>
|
|
</Popup>
|
|
|
|
|