dromara/dax-pay-h5
1
0
Fork 0
mirror of https://gitee.com/bootx/dax-pay-h5.git synced 2025-10-14 14:10:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat 码牌支付对接

Browse Source
This commit is contained in:
bootx
2025-04-12 20:55:45 +08:00
parent c6baf81744
commit 0d5eea8b23
19 changed files with 124 additions and 771 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
.env.development
View File

@@ -5,8 +5,8 @@ VITE_PORT=9100
VITE_PUBLIC_PATH=/
# 跨域代理，可以配置多个，请注意不要换行
VITE_PROXY=[["/server","http://daxpay-api.test.yibeiguangnian.cn/"]]
# VITE_PROXY=[["/server","https://pay1.bootx.cn/"]]
# VITE_PROXY=[["/server","http://daxpay-api.test.yibeiguangnian.cn/"]]
VITE_PROXY=[["/server","http://127.0.0.1:19999/"]]
# API 接口地址
VITE_GLOB_API_URL=

12
src/enums/daxpay/DaxPayEnum.ts
View File

@@ -50,3 +50,15 @@ export enum GatewayCallTypeEnum {
// 二维码
qr_code = 'qr_code',
}
/**
* 码牌类型
*/
export enum CashierCodeTypeEnum {
// 微信码牌
WECHAT_PAY = 'wechat_pay',
// 支付宝码牌
ALIPAY = 'alipay',
// 云闪付码牌
UNION_PAY = 'union_pay',
}

28
src/router/base.ts
View File

@@ -50,31 +50,3 @@ export const routeModuleList: Array<RouteRecordRaw> = [
],
},
]
/**
* 业务模块路由
*/
export const BusinessRoute: RouteRecordRaw = {
path: '/',
name: '',
redirect: PageEnum.BASE_HOME,
component: Layout,
children: [
{
path: '/result/success',
name: 'SuccessResult',
component: () => import('@/views/result/SuccessResult.vue'),
meta: {
title: '操作成功',
},
},
{
path: '/result/error',
name: 'ErrorResult',
component: () => import('@/views/result/ErrorResult.vue'),
meta: {
title: '错误页',
},
},
],
}

1
src/router/daxpay.ts
View File

@@ -131,6 +131,5 @@ export const DaxPayPcRoute: RouteRecordRaw = {
title: '支付失败页面',
},
},
],
}

3
src/router/index.ts
View File

@@ -1,7 +1,7 @@
import type { App } from 'vue'
import type { RouteRecordRaw } from 'vue-router'
import { createRouter, createWebHistory } from 'vue-router'
import { BusinessRoute, ErrorPageRoute, routeModuleList } from '@/router/base'
import { ErrorPageRoute, routeModuleList } from '@/router/base'
import { useRouteStoreWidthOut } from '@/store/modules/route'
// 菜单
@@ -12,7 +12,6 @@ export const constantRouter: RouteRecordRaw[] = [
DaxPayH5Route,
DaxPayPcRoute,
ErrorPageRoute,
BusinessRoute,
]
const routeStore = useRouteStoreWidthOut()

5
src/views/daxpay/h5/aggregate/Aggregate.vue
View File

@@ -19,8 +19,9 @@ else if (ua === 'alipay') {
}
else {
router.replace({
path: '/payFail',
query: { msg: '请使用支付宝、微信等软件进行扫码支付' },
name: 'payFail',
query: { msg: '请使用支付宝、微信等软件进行扫码支付', title: '操作失败' },
replace: true,
})
}
</script>

4
src/views/daxpay/h5/aggregate/alipay/AlipayAggregate.vue
View File

@@ -110,7 +110,7 @@ function init() {
if (code !== 0) {
// 如果异常，跳转异常页面
router.replace({
path: '/payFail',
name: 'payFail',
query: { msg },
})
return
@@ -147,7 +147,7 @@ function pay() {
if (code !== 0) {
// 如果异常，跳转异常页面
router.replace({
path: '/payFail',
name: 'payFail',
query: { msg },
})
return

10
src/views/daxpay/h5/aggregate/wechat/WechatAggregate.vue
View File

@@ -127,7 +127,7 @@ function init() {
if (code !== 0) {
// 如果异常，跳转异常页面
router.replace({
path: '/payFail',
name: 'payFail',
query: { msg },
})
return
@@ -143,7 +143,7 @@ function init() {
if (res.code !== 0) {
// 如果异常，跳转异常页面
router.replace({
path: '/payFail',
name: 'payFail',
query: { msg },
})
return
@@ -151,7 +151,7 @@ function init() {
location.replace(res.data)
}).catch((res) => {
router.replace({
path: '/payFail',
name: 'payFail',
query: { msg: res.message },
})
})
@@ -188,7 +188,7 @@ async function wxAuth() {
await auth(authParam.value).then(({ data }) => {
openId.value = data.openId as string
}).catch((res) => {
router.push({ name: 'ErrorResult', query: { msg: res.message }, replace: true })
router.push({ name: 'payFail', query: { msg: res.message }, replace: true })
})
}
@@ -237,7 +237,7 @@ function jsapiPay(data: WxJsapiSignResult) {
else {
// 跳转到失败页面
router.replace({
path: '/payFail',
name: 'payFail',
query: { msg: '支付已取消' },
})
}

4
src/views/daxpay/h5/cashier/Cashier.vue
View File

@@ -194,7 +194,7 @@ function payClick() {
if (code !== 0) {
// 如果异常，跳转错误页面
router.replace({
path: '/payFail',
name: 'payFail',
query: { msg },
})
return
@@ -284,7 +284,7 @@ function init() {
if (code !== 0) {
// 如果异常，跳转异常页面
router.replace({
path: '/payFail',
name: 'payFail',
query: { msg },
})
return

24
src/views/daxpay/h5/checkout/CheckAggregate.vue
View File

@@ -1,24 +0,0 @@
<template>
</template>
<script setup lang="ts">
import { useRoute } from 'vue-router'
import router from '@/router'
const route = useRoute()
const { orderNo } = route.params
const ua = navigator.userAgent
if (ua.includes('MicroMessenger')) {
router.push({ path: `/aggregate/wechat/${orderNo}`, replace: true })
}
else if (ua.includes('Alipay')) {
router.push({ path: `/aggregate/alipay/${orderNo}`, replace: true })
}
else {
router.push({ name: 'ErrorResult', query: { msg: '请使用支付宝、微信等软件进行扫码支付' }, replace: true })
}
</script>
<style scoped lang="less">
</style>

213
src/views/daxpay/h5/checkout/CheckoutPay.api.ts
View File

@@ -1,213 +0,0 @@
import { http } from '@/utils/http/axios'
import type { Result } from '#/axios'
import type { AuthResult } from '@/views/daxpay/h5/auth/ChannelAuth.api'
import type { PayResult } from '@/views/daxpay/h5/aggregate/Aggregate.api'
/**
* 获取收银台订单和配置信息
*/
export function getOrderAndConfig(orderNo, checkoutType) {
return http.request<Result<CheckoutOrderAndConfigResult>>({
url: '/unipay/checkout/getOrderAndConfig',
method: 'GET',
params: {
orderNo,
checkoutType,
},
})
}
/**
* 获取聚合支付配置
*/
export function getAggregateConfig(orderNo, aggregateType) {
return http.request<Result<AggregateOrderAndConfigResult>>({
url: '/unipay/checkout/getAggregateConfig',
method: 'GET',
params: {
orderNo,
aggregateType,
},
})
}
/**
* 获取收银台所需授权链接, 用于获取OpenId一类的信息
*/
export function generateAuthUrl(param: CheckoutAuthUrlParam) {
return http.request<Result<string>>({
url: '/unipay/checkout/generateAuthUrl',
method: 'post',
data: param,
})
}
/**
* 获取授权结果
*/
export function auth(param: CheckoutAuthCodeParam) {
return http.request<Result<AuthResult>>({
url: '/unipay/checkout/auth',
method: 'post',
data: param,
})
}
/**
* 发起普通支付
*/
export function checkoutPay(param: CheckoutPayParam) {
return http.request<Result<PayResult>>({
url: '/unipay/checkout/pay',
method: 'post',
data: param,
})
}
/**
* 发起聚合支付
*/
export function aggregatePay(param: CheckoutAggregatePayParam) {
return http.request<Result<PayResult>>({
url: '/unipay/checkout/aggregatePay',
method: 'post',
data: param,
})
}
/**
* 收银台认证链接生成参数
*/
export interface CheckoutAuthUrlParam {
/** 要支付的订单号 */
orderNo?: string
/** 聚合支付类型 */
aggregateType?: string
}
/**
* 获取收银台认证结果参数
*/
export interface CheckoutAuthCodeParam {
/** 要支付的订单号 */
orderNo?: string
/** 聚合支付类型 */
aggregateType?: string
/** 认证Code */
authCode?: string
}
/**
* 收银台支付参数
*/
export interface CheckoutPayParam {
/** 订单号 */
orderNo?: string
/** 支付配置项ID */
itemId?: string
/** 唯一标识 */
openId?: string
/** 付款码 */
barCode?: string
}
/**
* 聚合支付参数
*/
export interface CheckoutAggregatePayParam {
/** 订单号 */
orderNo?: string
/** 聚合支付类型 */
aggregateType?: string
/** 唯一标识 */
openId?: string
}
/**
* 收银台配置
*/
export interface CheckoutOrderAndConfigResult {
/** 订单信息 */
order: CheckoutOrderResult
/** 收银台配置信息 */
config: CheckoutConfigResult
/** 收银台分类配置信息 */
groupConfigs: CheckoutGroupConfigResult[]
}
/**
* 收银台聚合支付配置
*/
export interface AggregateOrderAndConfigResult {
/** 订单信息 */
order: CheckoutOrderResult
/** 收银台配置信息 */
config: CheckoutConfigResult
/** 收银台聚合配置信息 */
aggregateConfig: AggregateConfigResult
}
/**
* 订单信息
*/
export interface CheckoutOrderResult {
/** 商户订单号 */
bizOrderNo?: string
/** 订单号 */
orderNo?: string
/** 标题 */
title?: string
/** 描述 */
description?: string
/** 金额(元) */
amount?: number
}
/**
* 收银台配置信息
*/
export interface CheckoutConfigResult {
/** 收银台名称 */
name?: string
/** PC收银台是否同时显示聚合收银码 */
aggregateShow?: boolean
/** h5收银台自动升级聚合支付 */
h5AutoUpgrade?: boolean
}
/**
* 收银台分类配置
*/
export interface CheckoutGroupConfigResult {
/** 主键 */
id?: string
/** 名称 */
name?: string
/** 配置项列表 */
items?: CheckoutItemConfigResult[]
}
/**
* 收银台配置项
*/
export interface CheckoutItemConfigResult {
/** 主键 */
id?: string
/** 发起调用的类型 */
callType?: string
/** 名称 */
name?: string
/** 支付通道 */
channel?: string
/** 支付方式 */
payMethod?: string
}
/**
* 收银台聚合配置信息
*/
export interface AggregateConfigResult {
/** 支付类型 */
type?: string
/** 通道 */
channel?: string
/** 支付方式 */
payMethod?: string
/** 自动拉起支付 */
autoLaunch?: boolean
}

118
src/views/daxpay/h5/checkout/CheckoutPay.vue
View File

@@ -1,118 +0,0 @@
<template>
<div v-if="show">
<van-overlay :show="loading">
<div class="loading-wrapper" @click.stop>
<van-loading size="24px">
支付中...
</van-loading>
</div>
</van-overlay>
<van-cell-group inset title="订单信息">
<van-cell title="金额" title-style="font-size: 22px;color: red">
<template #default>
<span style="font-size: 22px;color: red">{{ orderAndConfig.order.amount }}元</span>
</template>
</van-cell>
<van-field label="标题" :model-value="orderAndConfig.order.title" readonly />
<van-field label="订单号" :model-value="orderAndConfig.order.bizOrderNo" readonly />
<van-field label="支付号" :model-value="orderAndConfig.order.orderNo" readonly />
<van-field label="描述" rows="2" type="textarea" :model-value="orderAndConfig.order.description" readonly />
</van-cell-group>
<van-cell-group v-for="group in orderAndConfig.groupConfigs" :key="group.id" inset :title="group.name">
<van-space direction="vertical" fill>
<van-button v-for="config in group.items" :key="config.id" type="primary" block @click="pay(config)">
{{ config.name }}
</van-button>
</van-space>
</van-cell-group>
</div>
</template>
<script setup lang="ts">
import { useRoute } from 'vue-router'
import { onMounted, ref } from 'vue'
import type {
CheckoutItemConfigResult,
CheckoutOrderAndConfigResult,
CheckoutPayParam,
} from './CheckoutPay.api'
import {
checkoutPay
, getOrderAndConfig,
} from './CheckoutPay.api'
import { CashierTypeEnum } from '@/enums/daxpay/DaxPayEnum'
import router from '@/router'
const route = useRoute()
const { orderNo } = route.params
const ua = navigator.userAgent
const show = ref(false)
const loading = ref(false)
const orderAndConfig = ref<CheckoutOrderAndConfigResult>({
order: {},
config: {},
groupConfigs: [],
})
/**
* 初始化
*/
onMounted(() => {
initData()
})
/**
* 初始化数据
*/
async function initData() {
// 获取收银台配置
await getOrderAndConfig(orderNo, CashierTypeEnum.H5).then(({ data }) => {
orderAndConfig.value = data
}).catch((res) => {
router.push({ name: 'ErrorResult', query: { msg: res.message }, replace: true })
})
// 判断是否自动升级为聚合控制台
if (orderAndConfig.value.config.h5AutoUpgrade) {
goAggregate()
return
}
show.value = true
}
/**
* 跳转到聚合收银台
*/
function goAggregate() {
if (ua.includes('MicroMessenger')) {
router.push({ path: `/aggregate/wechat/${orderNo}`, replace: true })
}
else if (ua.includes('Alipay')) {
router.push({ path: `/aggregate/alipay/${orderNo}`, replace: true })
}
else {
show.value = true
}
}
/**
* 发起支付
*/
function pay(config: CheckoutItemConfigResult) {
loading.value = true
const from = {
orderNo,
itemId: config.id,
} as CheckoutPayParam
checkoutPay(from).then(({ data }) => {
loading.value = false
// 跳转到支付页面
location.replace(data.payBody)
})
}
</script>
<style scoped lang="less">
</style>

89
src/views/daxpay/h5/checkout/alipay/AliAggregate.vue
View File

@@ -1,89 +0,0 @@
<template>
<div>
<van-overlay :show="loading">
<div class="loading-wrapper" @click.stop>
<van-loading size="24px">
支付中...
</van-loading>
</div>
</van-overlay>
<van-cell-group inset title="订单信息">
<van-cell title="金额" title-style="font-size: 22px;color: red">
<template #default>
<span style="font-size: 22px;color: red">{{ aggregateInfo.order.amount }}元</span>
</template>
</van-cell>
<van-field label="标题" :model-value="aggregateInfo.order.title" readonly />
<van-field label="订单号" :model-value="aggregateInfo.order.bizOrderNo" readonly />
<van-field label="支付号" :model-value="aggregateInfo.order.orderNo" readonly />
<van-field label="描述" rows="2" type="textarea" :model-value="aggregateInfo.order.description" readonly />
</van-cell-group>
<van-submit-bar safe-area-inset-bottom :price="(aggregateInfo.order.amount || 0) * 100" button-text="支付" @submit="pay" />
</div>
</template>
<script setup lang="ts">
import { onMounted, ref } from 'vue'
import { useRoute } from 'vue-router'
import { AggregateEnum } from '@/enums/daxpay/DaxPayEnum'
import router from '@/router'
import type {
AggregateOrderAndConfigResult,
CheckoutAggregatePayParam,
} from '@/views/daxpay/h5/checkout/CheckoutPay.api'
import {
aggregatePay,
getAggregateConfig,
} from '@/views/daxpay/h5/checkout/CheckoutPay.api'
const route = useRoute()
const { orderNo } = route.params
const loading = ref<boolean>(false)
const aggregateInfo = ref<AggregateOrderAndConfigResult>({
aggregateConfig: {},
config: {},
order: {},
})
onMounted(() => {
initData()
})
/**
* 初始化数据
*/
async function initData() {
// 查询订单和配置
await getAggregateConfig(orderNo, AggregateEnum.ALI).then(({ data }) => {
aggregateInfo.value = data
}).catch((res) => {
router.push({ name: 'ErrorResult', query: { msg: res.message }, replace: true })
})
// 判断是否自动拉起支付
if (aggregateInfo.value.aggregateConfig.autoLaunch) {
pay()
}
}
/**
* 支付
*/
function pay() {
loading.value = true
const from = {
orderNo: aggregateInfo.value.order.orderNo,
aggregateType: AggregateEnum.ALI,
} as CheckoutAggregatePayParam
aggregatePay(from)
.then(({ data }) => {
loading.value = false
// 跳转到H5/扫码支付页面
location.replace(data.payBody)
})
}
</script>
<style scoped lang="less">
</style>

152
src/views/daxpay/h5/checkout/wechat/WechatAggregate.vue
View File

@@ -1,152 +0,0 @@
<template>
<div v-if="show">
<van-overlay :show="loading">
<div class="loading-wrapper" @click.stop>
<van-loading size="24px">
支付中...
</van-loading>
</div>
</van-overlay>
<van-cell-group inset>
<van-cell title="金额" title-style="font-size: 22px;color: red">
<template #default>
<span style="font-size: 22px;color: red">{{ aggregateInfo.order.amount }}元</span>
</template>
</van-cell>
<van-field label="标题" :model-value="aggregateInfo.order.title" readonly />
<van-field label="订单号" :model-value="aggregateInfo.order.bizOrderNo" readonly />
<van-field label="支付号" :model-value="aggregateInfo.order.orderNo" readonly />
<van-field label="描述" rows="2" type="textarea" :model-value="aggregateInfo.order.description" readonly />
</van-cell-group>
<van-submit-bar safe-area-inset-bottom :price="(aggregateInfo.order.amount || 0) * 100" button-text="支付" @submit="pay" />
</div>
</template>
<script setup lang="ts">
import { onMounted, ref } from 'vue'
import { useRoute } from 'vue-router'
import { AggregateEnum } from '@/enums/daxpay/DaxPayEnum'
import router from '@/router'
import type {
AggregateOrderAndConfigResult,
CheckoutAggregatePayParam,
CheckoutAuthCodeParam,
} from '@/views/daxpay/h5/checkout/CheckoutPay.api'
import { aggregatePay, auth, generateAuthUrl, getAggregateConfig } from '@/views/daxpay/h5/checkout/CheckoutPay.api'
import type { WxJsapiSignResult } from '@/views/daxpay/h5/aggregate/Aggregate.api'
const route = useRoute()
const { orderNo } = route.params
const { code: authCode } = route.query
const show = ref<boolean>(false)
const loading = ref<boolean>(false)
const openId = ref<string>('')
// 认证参数
const authParam = ref<CheckoutAuthCodeParam>({
orderNo: orderNo as string,
aggregateType: AggregateEnum.WECHAT,
})
const aggregateInfo = ref<AggregateOrderAndConfigResult>({
aggregateConfig: {},
config: {},
order: {},
})
onMounted(() => {
init()
})
/**
* 进入页面的初始化
*/
function init() {
// 如果不是重定向跳转过来， 跳转到到重定向授权地址
if (!authCode) {
// 重定向跳转到微信授权地址
generateAuthUrl({ orderNo: orderNo as string, aggregateType: AggregateEnum.WECHAT }).then((res) => {
const url = res.data
location.replace(url)
}).catch((res) => {
router.push({ name: 'ErrorResult', query: { msg: res.message }, replace: true })
})
}
else {
authParam.value.authCode = authCode as string
// 初始化数据
initData()
}
}
/**
* 初始化数据
*/
async function initData() {
show.value = true
// 获取聚合配置
getAggregateConfig(orderNo, AggregateEnum.WECHAT).then(({ data }) => {
aggregateInfo.value = data
}).catch((res) => {
router.push({ name: 'ErrorResult', query: { msg: res.message }, replace: true })
})
// 认证获取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 })
})
// 判断是否自动拉起支付
if (aggregateInfo.value.aggregateConfig.autoLaunch) {
pay()
}
}
/**
* 微信jsapi方式支付
*/
function pay() {
loading.value = true
const from = {
orderNo: orderNo as string,
aggregateType: AggregateEnum.WECHAT,
openId: openId.value,
} as CheckoutAggregatePayParam
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">
</style>

97
src/views/daxpay/h5/code/CashierCode.api.ts
View File

@@ -1,34 +1,35 @@
import { http } from '@/utils/http/axios'
import type { Result } from '#/axios'
import type { AuthResult } from '@/views/daxpay/h5/auth/ChannelAuth.api'
/**
* 获取商户名称
* 获取码牌配置
*/
export function getMchName(cashierCode, cashierType) {
return http.request<Result<string>>({
url: '/unipay/gateway/getCashierCodeConfig',
export function getCashierCodeConfig(cashierCode, cashierType) {
return http.request<Result<GatewayCashierConfig>>({
url: '/unipay/gateway/cashier/getCodeConfig',
method: 'GET',
params: { cashierCode, cashierType },
})
}
/**
* 获取收银台信息
* 获取码牌收银台所需授权链接, 用于获取OpenId一类的信息
*/
export function getCashierInfo(cashierType: string, appId: string) {
return http.request<Result<ChannelCashierConfigResult>>({
url: '/unipay/ext/channel/cashier/getCashierType',
method: 'GET',
params: { cashierType, appId },
export function generateAuthUrl(cashierCode, cashierType) {
return http.request<Result<string>>({
url: '/unipay/gateway/cashier/code/generateAuthUrl',
method: 'POST',
data: { cashierCode, cashierType },
})
}
/**
* 获取收银台所需授权链接, 用于获取OpenId一类的信息
* 获取授权信息
*/
export function generateAuthUrl(param: CashierAuthParam) {
return http.request<Result<string>>({
url: '/unipay/ext/channel/cashier/generateAuthUrl',
export function auth(param: CashierCodeAuthParam) {
return http.request<Result<AuthResult>>({
url: '/unipay/gateway/cashier/code/auth',
method: 'POST',
data: param,
})
@@ -39,34 +40,18 @@ export function generateAuthUrl(param: CashierAuthParam) {
*/
export function cashierPay(param: CashierPayParam) {
return http.request<Result<PayResult>>({
url: '/unipay/gateway/cashierCodePay',
url: '/unipay/gateway/cashier/code/pay',
method: 'POST',
data: param,
})
}
/**
* 通道认证参数
*/
export interface CashierAuthParam {
// 商户号
mchNo?: string
// 应用号
appId?: string
// 收银台类型
cashierType?: string
// 授权码
authCode?: string
}
/**
* 通道收银支付参数
* 码牌收银支付参数
*/
export interface CashierPayParam {
// 商户号
mchNo?: string
// 应用号
appId?: string
// 收银码牌编码
cashierCode?: string
// 收银台类型
cashierType?: string
// 支付金额
@@ -112,31 +97,25 @@ export interface WxJsapiSignResult {
/**
* 收银台配置信息
*/
export interface ChannelCashierConfigResult {
// 商户号
mchNo?: string
// 应用号
appId?: string
// 收银台类型
cashierType?: string
// 收银台名称
cashierName?: string
// 支付通道
channel?: string
// 支付方式
payMethod?: string
// 是否开启分账
allocation?: boolean
// 自动分账
autoAllocation?: boolean
export interface GatewayCashierConfig {
// 商家名称
name?: string
// 支付调起方式
callType?: string
// 判断是否需要
needOpenId?: boolean
// 备注
remark?: string
}
// 码牌支付检查信息
export interface getNameConfig {
// 商家名称
name: string
// 判断是否需要
needOpenId: boolean
// 备注
remark: string
/**
* 码牌用户标识认证类
*/
export interface CashierCodeAuthParam {
// 收银码牌编码
cashierCode?: string
// 收银台类型
cashierType?: string
// 授权码
authCode: string
}

6
src/views/daxpay/h5/code/CashierCode.vue
View File

@@ -11,6 +11,7 @@ const route = useRoute()
const { code } = route.params
const ua = getBrowserUA()
console.log(code)
if (ua === 'wechat') {
router.push({ path: `/wechat/cashier/code/${code}`, replace: true })
}
@@ -19,8 +20,9 @@ else if (ua === 'alipay') {
}
else {
router.replace({
path: '/payFail',
query: { msg: '请使用支付宝、微信等软件进行扫码支付' },
name: 'payFail',
query: { msg: '请使用支付宝、微信等软件进行扫码支付', title: '操作失败' },
replace: true,
})
}
</script>

13
src/views/daxpay/h5/code/alipay/AlipayCashierCode.vue
View File

@@ -62,10 +62,9 @@
import { onMounted, ref } from 'vue'
import { useRoute } from 'vue-router'
import { showNotify } from 'vant'
import type { CashierPayParam, getNameConfig } from '../CashierCode.api'
import { cashierPay, getMchName } from '../CashierCode.api'
import { AggregateEnum } from '@/enums/daxpay/DaxPayEnum'
import router from '@/router'
import type { CashierPayParam, GatewayCashierConfig } from '../CashierCode.api'
import { cashierPay, getCashierCodeConfig } from '../CashierCode.api'
import { AggregateEnum, CashierCodeTypeEnum } from '@/enums/daxpay/DaxPayEnum'
import { useKeyboard } from '@/hooks/daxpay/useKeyboard'
const route = useRoute()
@@ -73,7 +72,7 @@ const { code } = route.params
const showRemark = ref<boolean>(false) // 是否展示备注
const loading = ref<boolean>(false) // 加载状态
const cashierInfo = ref<getNameConfig>()
const cashierInfo = ref<GatewayCashierConfig>()
const amount = ref<string>('0') // 金额
const description = ref<string>('') // 描述
@@ -89,14 +88,14 @@ onMounted(() => {
function initData() {
// 获取信息
loading.value = true
getMchName(code, AggregateEnum.ALI)
getCashierCodeConfig(code, CashierCodeTypeEnum.ALIPAY)
.then(({ data }) => {
loading.value = false
cashierInfo.value = data as any
})
.catch((error) => {
console.log(error)
// router.push({ name: 'ErrorResult', query: { msg: res.message } })
// router.push({ name: 'payFail', query: { msg: res.message } })
})
}

85
src/views/daxpay/h5/code/wechat/WechatCashierCode.vue
View File

@@ -1,12 +1,9 @@
<template>
<div v-if="show">
<div class="container">
<div style="font-size: 28px;margin-top: 10px;">
{{ cashierInfo.cashierName || '微信收银台' }}
</div>
<div class="amount-display">
<p style="font-size: 20px">
付款给{{ mchName }}
付款给{{ cashierInfo?.name }}
</p>
<p style="font-size: 32px;">
¥ {{ amount }}
@@ -64,89 +61,74 @@ import { onMounted, ref } from 'vue'
import { useRoute } from 'vue-router'
import { showNotify } from 'vant'
import type {
CashierAuthParam,
CashierPayParam,
ChannelCashierConfigResult,
GatewayCashierConfig,
WxJsapiSignResult,
} from '../CashierCode.api'
import {
auth,
cashierPay,
generateAuthUrl,
getCashierInfo,
getMchName,
getCashierCodeConfig,
} from '../CashierCode.api'
import { AggregateEnum, CashierTypeEnum } from '@/enums/daxpay/DaxPayEnum'
import { AggregateEnum, CashierCodeTypeEnum } from '@/enums/daxpay/DaxPayEnum'
import router from '@/router'
import { useKeyboard } from '@/hooks/daxpay/useKeyboard'
const route = useRoute()
const { mchNo, appId } = route.params
const { code } = route.query
const { code: cashierCode } = route.params
const { code: authCode } = route.query
const show = ref<boolean>(false)
const showRemark = ref<boolean>(false)
const loading = ref<boolean>(false)
const cashierInfo = ref<ChannelCashierConfigResult>({})
const cashierInfo = ref<GatewayCashierConfig>({})
const amount = ref<string>('0')
const description = ref<string>('')
const mchName = ref<string>('')
const openId = ref<string>('')
// 认证参数
const authParam = ref<CashierAuthParam>({
mchNo: mchNo as string,
appId: appId as string,
cashierType: AggregateEnum.WECHAT,
})
const { input, del } = useKeyboard(amount)
onMounted(() => {
// init()
show.value = true
init()
})
/**
* 初始化
*/
function init() {
async function init() {
loading.value = true
getCashierCodeConfig(cashierCode, AggregateEnum.WECHAT)
.then(({ data }) => {
cashierInfo.value = data as any
// 判断是否需要获取OpenId
if (data.needOpenId) {
// 如果不是重定向跳转过来， 跳转到到重定向地址
if (!code) {
if (!authCode) {
// 重定向跳转到微信授权地址
generateAuthUrl(authParam.value).then((res) => {
generateAuthUrl(cashierCode, CashierCodeTypeEnum.WECHAT_PAY).then((res) => {
const url = res.data
location.replace(url)
}).catch((res) => {
router.push({ name: 'ErrorResult', query: { msg: res.message } })
router.push({ name: 'payFail', query: { msg: res.message } })
})
}
else {
authParam.value.authCode = code as string
// 初始化数据
initData()
}
}
/**
* 初始化数据
*/
function initData() {
show.value = true
getCashierInfo(AggregateEnum.WECHAT, appId as string).then(({ data }) => {
cashierInfo.value = data
}).catch((res) => {
router.push({ name: 'ErrorResult', query: { msg: res.message } })
})
getMchName(mchNo as string).then(({ data }) => {
mchName.value = data
}).catch((res) => {
router.push({ name: 'ErrorResult', query: { msg: res.message } })
})
auth(authParam.value).then(({ data }) => {
// 认证获取OpenId
auth({ cashierCode: cashierCode as string, cashierType: CashierCodeTypeEnum.WECHAT_PAY, authCode: authCode as string }).then(({ data }) => {
openId.value = data.openId as string
show.value = true
}).catch((res) => {
router.push({ name: 'ErrorResult', query: { msg: res.message } })
router.push({ name: 'payFail', query: { msg: res.message }, replace: true })
})
}
}
})
.catch((error) => {
console.log(error)
router.push({ name: 'payFail', query: { msg: error } })
})
}
@@ -163,11 +145,10 @@ function pay() {
loading.value = true
const from = {
amount: amountValue,
appId,
cashierCode,
openId: openId.value,
cashierType: CashierTypeEnum.WECHAT_PAY,
cashierType: CashierCodeTypeEnum.WECHAT_PAY,
description: description.value,
mchNo,
} as CashierPayParam
cashierPay(from)
.then(({ data }) => {

7
src/views/daxpay/h5/result/PayFail.vue
View File

@@ -13,7 +13,7 @@
</template>
<script setup lang="ts">
import { useRoute, useRouter } from 'vue-router'
import { useRoute } from 'vue-router'
// 获取路由参数
const route = useRoute()
const { msg: errorMsg, title } = route.query
@@ -30,6 +30,11 @@ function closeClick() {
AlipayJSBridge.call('closeWebview')
}
catch {}
try {
window.close()
}
catch {
}
}
</script>