mirror of
https://gitee.com/bootx/dax-pay-h5.git
synced 2025-10-14 06:04:51 +00:00
feat 微信和支付宝聚合支付对接
This commit is contained in:
@@ -23,14 +23,6 @@ export enum PayMethodEnum {
|
||||
* 收银台类型
|
||||
*/
|
||||
export enum CashierTypeEnum {
|
||||
WECHAT_PAY = 'wechat_pay',
|
||||
ALIPAY = 'alipay',
|
||||
}
|
||||
|
||||
/**
|
||||
* 收银台类型
|
||||
*/
|
||||
export enum CheckoutTypeEnum {
|
||||
H5 = 'h5',
|
||||
PC = 'pc',
|
||||
MINI_APP = 'mini_app',
|
||||
@@ -40,7 +32,19 @@ export enum CheckoutTypeEnum {
|
||||
/**
|
||||
* 收银台聚合支付类型
|
||||
*/
|
||||
export enum CheckoutAggregateEnum {
|
||||
export enum AggregateEnum {
|
||||
ALI = 'alipay',
|
||||
WECHAT = 'wechat_pay',
|
||||
}
|
||||
|
||||
/**
|
||||
* 网关支付调用类型
|
||||
*/
|
||||
export enum GatewayCallTypeEnum {
|
||||
// 跳转链接
|
||||
link = 'link',
|
||||
// JSAPI
|
||||
jsapi = 'jsapi',
|
||||
// 表单方式
|
||||
from = 'from',
|
||||
}
|
||||
|
@@ -41,7 +41,7 @@ export function auth(param: GatewayAuthCodeParam) {
|
||||
*/
|
||||
export function aggregatePay(param: AggregatePayParam) {
|
||||
return http.request<Result<PayResult>>({
|
||||
url: '/unipay/cashier/code/pay',
|
||||
url: '/unipay/gateway/aggregatePay',
|
||||
method: 'POST',
|
||||
data: param,
|
||||
})
|
||||
@@ -75,6 +75,8 @@ export interface AggregateConfig {
|
||||
autoLaunch?: boolean
|
||||
/** 需要获取OpenId */
|
||||
needOpenId?: boolean
|
||||
/** 调起方式 */
|
||||
callType?: string
|
||||
}
|
||||
|
||||
/**
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div v-if="orderAndConfig" class="aggeegateWeixin">
|
||||
<div v-if="show" class="aggeegateWeixin">
|
||||
<div class="aggBox">
|
||||
<img src="@/assets/images/bill_logo.png" alt="">
|
||||
<div class="payPrice">
|
||||
@@ -40,23 +40,124 @@
|
||||
<script setup lang="ts">
|
||||
import { useRoute } from 'vue-router'
|
||||
import { ref } from 'vue'
|
||||
import type { AggregateOrderAndConfig } from '@/views/daxpay/aggregate/Aggregate.api'
|
||||
import { getAggregateConfig } from '@/views/daxpay/aggregate/Aggregate.api'
|
||||
import type {
|
||||
AggregateOrderAndConfig,
|
||||
AggregatePayParam,
|
||||
GatewayAuthCodeParam,
|
||||
WxJsapiSignResult,
|
||||
} from '@/views/daxpay/aggregate/Aggregate.api'
|
||||
import { aggregatePay, auth, generateAuthUrl, getAggregateConfig } from '@/views/daxpay/aggregate/Aggregate.api'
|
||||
|
||||
import { AggregateEnum, GatewayCallTypeEnum } from "@/enums/daxpay/DaxPayEnum";
|
||||
import router from '@/router'
|
||||
|
||||
const route = useRoute()
|
||||
const { orderNo } = route.params
|
||||
const { code: authCode } = route.query
|
||||
const show = ref<boolean>(false)
|
||||
|
||||
const orderAndConfig = ref<AggregateOrderAndConfig>()
|
||||
const openId = ref<string>('')
|
||||
const loading = ref<boolean>(false)
|
||||
|
||||
// 认证参数
|
||||
const authParam = ref<GatewayAuthCodeParam>({
|
||||
orderNo: orderNo as string,
|
||||
aggregateType: AggregateEnum.WECHAT,
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
getAggregateConfig(orderNo, 'wechat_pay').then(({ data, code, msg }) => {
|
||||
init()
|
||||
})
|
||||
|
||||
/**
|
||||
* 初始化
|
||||
*/
|
||||
function init() {
|
||||
// 获取订单和配置信息
|
||||
getAggregateConfig(orderNo, 'wechat_pay').then(async ({ data, code, msg }) => {
|
||||
// 判断是否需要获取OpenId
|
||||
if (data.aggregateConfig.needOpenId) {
|
||||
|
||||
// 判断是否已经获取到了authCode, 如果没有则重定向进行获取authCode
|
||||
if (!authCode) {
|
||||
generateAuthUrl({
|
||||
orderNo: orderNo as string,
|
||||
aggregateType: AggregateEnum.WECHAT,
|
||||
}).then((res) => {
|
||||
location.replace(res.data)
|
||||
}).catch((res) => {
|
||||
router.push({ name: 'ErrorResult', query: { msg: res.message }, replace: true })
|
||||
})
|
||||
return
|
||||
}
|
||||
else {
|
||||
authParam.value.authCode = authCode as string
|
||||
// 获取openId
|
||||
await wxAuth()
|
||||
}
|
||||
}
|
||||
show.value = true
|
||||
orderAndConfig.value = data
|
||||
// 判断是否自动拉起支付
|
||||
if (orderAndConfig.value.aggregateConfig.autoLaunch) {
|
||||
pay()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 微信认证
|
||||
*/
|
||||
async function wxAuth() {
|
||||
// 认证获取OpenId
|
||||
await auth(authParam.value).then(({ data }) => {
|
||||
openId.value = data.openId as string
|
||||
}).catch((res) => {
|
||||
router.push({ name: 'ErrorResult', query: { msg: res.message }, replace: true })
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 调起支付, 需要根据调用类型发起
|
||||
*/
|
||||
function pay() {
|
||||
loading.value = true
|
||||
if (orderAndConfig.value?.aggregateConfig.callType === GatewayCallTypeEnum.jsapi){
|
||||
const from = {
|
||||
orderNo: orderNo as string,
|
||||
aggregateType: AggregateEnum.WECHAT,
|
||||
openId: openId.value,
|
||||
} as AggregatePayParam
|
||||
aggregatePay(from)
|
||||
.then(({ data }) => {
|
||||
loading.value = false
|
||||
// 拉起jsapi支付
|
||||
const json = JSON.parse(data.payBody)
|
||||
jsapiPay(json)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 拉起Jsapi支付窗口
|
||||
*/
|
||||
function jsapiPay(data: WxJsapiSignResult) {
|
||||
const form = {
|
||||
appId: data.appId, // 公众号ID,由商户传入
|
||||
timeStamp: data.timeStamp, // 时间戳,自1970年以来的秒数
|
||||
nonceStr: data.nonceStr, // 随机串
|
||||
package: data.package, // 预支付ID
|
||||
signType: data.signType, // 微信签名方式:
|
||||
paySign: data.paySign, // 微信签名
|
||||
}
|
||||
// 使用微信JsSdk拉起支付
|
||||
WeixinJSBridge.invoke('getBrandWCPayRequest', form, (res) => {
|
||||
if (res.err_msg === 'get_brand_wcpay_request:ok') {
|
||||
// 跳转到成功页面
|
||||
router.push({ name: 'SuccessResult', query: { msg: '支付成功' }, replace: true })
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
|
@@ -42,7 +42,7 @@ import {
|
||||
, getOrderAndConfig,
|
||||
} from './CheckoutPay.api'
|
||||
|
||||
import { CheckoutTypeEnum } from '@/enums/daxpay/DaxPayEnum'
|
||||
import { CashierTypeEnum } from '@/enums/daxpay/DaxPayEnum'
|
||||
import router from '@/router'
|
||||
|
||||
const route = useRoute()
|
||||
@@ -69,7 +69,7 @@ onMounted(() => {
|
||||
*/
|
||||
async function initData() {
|
||||
// 获取收银台配置
|
||||
await getOrderAndConfig(orderNo, CheckoutTypeEnum.H5).then(({ data }) => {
|
||||
await getOrderAndConfig(orderNo, CashierTypeEnum.H5).then(({ data }) => {
|
||||
orderAndConfig.value = data
|
||||
}).catch((res) => {
|
||||
router.push({ name: 'ErrorResult', query: { msg: res.message }, replace: true })
|
||||
|
@@ -26,7 +26,7 @@
|
||||
import { onMounted, ref } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
|
||||
import { CheckoutAggregateEnum } from '@/enums/daxpay/DaxPayEnum'
|
||||
import { AggregateEnum } from '@/enums/daxpay/DaxPayEnum'
|
||||
import router from '@/router'
|
||||
import type {
|
||||
AggregateOrderAndConfigResult,
|
||||
@@ -56,7 +56,7 @@ onMounted(() => {
|
||||
*/
|
||||
async function initData() {
|
||||
// 查询订单和配置
|
||||
await getAggregateConfig(orderNo, CheckoutAggregateEnum.ALI).then(({ data }) => {
|
||||
await getAggregateConfig(orderNo, AggregateEnum.ALI).then(({ data }) => {
|
||||
aggregateInfo.value = data
|
||||
}).catch((res) => {
|
||||
router.push({ name: 'ErrorResult', query: { msg: res.message }, replace: true })
|
||||
@@ -74,7 +74,7 @@ function pay() {
|
||||
loading.value = true
|
||||
const from = {
|
||||
orderNo: aggregateInfo.value.order.orderNo,
|
||||
aggregateType: CheckoutAggregateEnum.ALI,
|
||||
aggregateType: AggregateEnum.ALI,
|
||||
} as CheckoutAggregatePayParam
|
||||
aggregatePay(from)
|
||||
.then(({ data }) => {
|
||||
|
@@ -26,7 +26,7 @@
|
||||
import { onMounted, ref } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
|
||||
import { CheckoutAggregateEnum } from '@/enums/daxpay/DaxPayEnum'
|
||||
import { AggregateEnum } from '@/enums/daxpay/DaxPayEnum'
|
||||
import router from '@/router'
|
||||
import type {
|
||||
AggregateOrderAndConfigResult, CheckoutAggregatePayParam,
|
||||
@@ -49,7 +49,7 @@ const openId = ref<string>('')
|
||||
// 认证参数
|
||||
const authParam = ref<CheckoutAuthCodeParam>({
|
||||
orderNo: orderNo as string,
|
||||
aggregateType: CheckoutAggregateEnum.WECHAT,
|
||||
aggregateType: AggregateEnum.WECHAT,
|
||||
})
|
||||
|
||||
const aggregateInfo = ref<AggregateOrderAndConfigResult>({
|
||||
@@ -69,7 +69,7 @@ function init() {
|
||||
// 如果不是重定向跳转过来, 跳转到到重定向授权地址
|
||||
if (!authCode) {
|
||||
// 重定向跳转到微信授权地址
|
||||
generateAuthUrl({ orderNo: orderNo as string, aggregateType: CheckoutAggregateEnum.WECHAT }).then((res) => {
|
||||
generateAuthUrl({ orderNo: orderNo as string, aggregateType: AggregateEnum.WECHAT }).then((res) => {
|
||||
const url = res.data
|
||||
location.replace(url)
|
||||
}).catch((res) => {
|
||||
@@ -89,7 +89,7 @@ function init() {
|
||||
async function initData() {
|
||||
show.value = true
|
||||
// 获取聚合配置
|
||||
getAggregateConfig(orderNo, CheckoutAggregateEnum.WECHAT).then(({ data }) => {
|
||||
getAggregateConfig(orderNo, AggregateEnum.WECHAT).then(({ data }) => {
|
||||
aggregateInfo.value = data
|
||||
}).catch((res) => {
|
||||
router.push({ name: 'ErrorResult', query: { msg: res.message }, replace: true })
|
||||
@@ -114,7 +114,7 @@ function pay() {
|
||||
loading.value = true
|
||||
const from = {
|
||||
orderNo: orderNo as string,
|
||||
aggregateType: CheckoutAggregateEnum.WECHAT,
|
||||
aggregateType: AggregateEnum.WECHAT,
|
||||
openId: openId.value,
|
||||
} as CheckoutAggregatePayParam
|
||||
aggregatePay(from)
|
||||
|
Reference in New Issue
Block a user