feat: pay
xingyu
parent
044be6bd11
commit
a5f3cfb4f9
|
|
@ -128,7 +128,7 @@ export const PayChannelEnum = {
|
|||
}
|
||||
|
||||
/**
|
||||
* 支付的展示模式每局
|
||||
* 支付的展示模式枚举
|
||||
*/
|
||||
export const PayDisplayModeEnum = {
|
||||
URL: {
|
||||
|
|
@ -143,6 +143,9 @@ export const PayDisplayModeEnum = {
|
|||
QR_CODE: {
|
||||
mode: 'qr_code',
|
||||
},
|
||||
APP: {
|
||||
mode: 'app',
|
||||
},
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -168,81 +171,7 @@ export const PayOrderStatusEnum = {
|
|||
},
|
||||
CLOSED: {
|
||||
status: 20,
|
||||
name: '支付关闭',
|
||||
},
|
||||
}
|
||||
|
||||
/**
|
||||
* 支付订单回调状态枚举
|
||||
*/
|
||||
export const PayOrderNotifyStatusEnum = {
|
||||
NO: {
|
||||
status: 0,
|
||||
name: '未通知',
|
||||
},
|
||||
SUCCESS: {
|
||||
status: 10,
|
||||
name: '通知成功',
|
||||
},
|
||||
FAILURE: {
|
||||
status: 20,
|
||||
name: '通知失败',
|
||||
},
|
||||
}
|
||||
|
||||
/**
|
||||
* 支付订单退款状态枚举
|
||||
*/
|
||||
export const PayOrderRefundStatusEnum = {
|
||||
NO: {
|
||||
status: 0,
|
||||
name: '未退款',
|
||||
},
|
||||
SOME: {
|
||||
status: 10,
|
||||
name: '部分退款',
|
||||
},
|
||||
ALL: {
|
||||
status: 20,
|
||||
name: '全部退款',
|
||||
},
|
||||
}
|
||||
|
||||
/**
|
||||
* 支付退款订单状态枚举
|
||||
*/
|
||||
export const PayRefundStatusEnum = {
|
||||
CREATE: {
|
||||
status: 0,
|
||||
name: '退款订单生成',
|
||||
},
|
||||
SUCCESS: {
|
||||
status: 1,
|
||||
name: '退款成功',
|
||||
},
|
||||
FAILURE: {
|
||||
status: 2,
|
||||
name: '退款失败',
|
||||
},
|
||||
PROCESSING_NOTIFY: {
|
||||
status: 3,
|
||||
name: '退款中，渠道通知结果',
|
||||
},
|
||||
PROCESSING_QUERY: {
|
||||
status: 4,
|
||||
name: '退款中，系统查询结果',
|
||||
},
|
||||
UNKNOWN_RETRY: {
|
||||
status: 5,
|
||||
name: '状态未知，请重试',
|
||||
},
|
||||
UNKNOWN_QUERY: {
|
||||
status: 6,
|
||||
name: '状态未知，系统查询结果',
|
||||
},
|
||||
CLOSE: {
|
||||
status: 99,
|
||||
name: '退款关闭',
|
||||
name: '未支付',
|
||||
},
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -77,6 +77,7 @@ export const channelsAlipay = [
|
|||
code: 'alipay_bar',
|
||||
},
|
||||
]
|
||||
|
||||
export const channelsWechat = [
|
||||
{
|
||||
name: '微信公众号支付',
|
||||
|
|
@ -104,6 +105,7 @@ export const channelsWechat = [
|
|||
code: 'wx_bar',
|
||||
},
|
||||
]
|
||||
|
||||
export const channelsMock = [
|
||||
{
|
||||
name: '模拟支付',
|
||||
|
|
|
|||
|
|
@ -1,125 +1,5 @@
|
|||
<script lang="ts" setup>
|
||||
import { onMounted, ref } from 'vue'
|
||||
import { Card, List } from 'ant-design-vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { descSchema } from './submit.data'
|
||||
import { Description } from '@/components/Description'
|
||||
import { getOrder, submitOrder } from '@/api/pay/order'
|
||||
import { DICT_TYPE, getDictOptions } from '@/utils/dict'
|
||||
import alipay_qr from '@/assets/images/pay/icon/alipay_qr.svg'
|
||||
import alipay_app from '@/assets/images/pay/icon/alipay_app.svg'
|
||||
import alipay_wap from '@/assets/images/pay/icon/alipay_wap.svg'
|
||||
import alipay_pc from '@/assets/images/pay/icon/alipay_pc.svg'
|
||||
import alipay_bar from '@/assets/images/pay/icon/alipay_bar.svg'
|
||||
import wx_app from '@/assets/images/pay/icon/wx_app.svg'
|
||||
import wx_lite from '@/assets/images/pay/icon/wx_lite.svg'
|
||||
import wx_pub from '@/assets/images/pay/icon/wx_pub.svg'
|
||||
import mock from '@/assets/images/pay/icon/mock.svg'
|
||||
|
||||
defineOptions({ name: 'PayCashier' })
|
||||
|
||||
const ListItem = List.Item
|
||||
|
||||
const icons = {
|
||||
alipay_qr,
|
||||
alipay_app,
|
||||
alipay_wap,
|
||||
alipay_pc,
|
||||
alipay_bar,
|
||||
wx_app,
|
||||
wx_lite,
|
||||
wx_pub,
|
||||
mock,
|
||||
}
|
||||
|
||||
const { query } = useRoute()
|
||||
const orderData = ref()
|
||||
const aliPayChannels = ref<any[]>([])
|
||||
const wxPayChannels = ref<any[]>([])
|
||||
const otherPayChannels = ref<any[]>([])
|
||||
|
||||
function initPayChannels() {
|
||||
// 微信支付
|
||||
for (const dict of getDictOptions(DICT_TYPE.PAY_CHANNEL_CODE_TYPE, 'string')) {
|
||||
const payChannel = {
|
||||
name: dict.label,
|
||||
code: dict.value as string,
|
||||
}
|
||||
if (payChannel.code.startsWith('wx_'))
|
||||
wxPayChannels.value.push(payChannel)
|
||||
else if (payChannel.code.startsWith('alipay_'))
|
||||
aliPayChannels.value.push(payChannel)
|
||||
else if (payChannel.code)
|
||||
otherPayChannels.value.push(payChannel)
|
||||
}
|
||||
}
|
||||
async function getDetail() {
|
||||
const queryId = query.id as unknown as number
|
||||
if (!queryId)
|
||||
return
|
||||
|
||||
const res = await getOrder(queryId)
|
||||
orderData.value = res
|
||||
}
|
||||
|
||||
function submit(channelCode) {
|
||||
submitOrder({ id: query.id as unknown as number, channelCode })
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
await initPayChannels()
|
||||
await getDetail()
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<Card>
|
||||
<Description :bordered="false" :column="3" :data="orderData" :schema="descSchema" />
|
||||
</Card>
|
||||
<Card class="mt-4 justify-center">
|
||||
<List :grid="{ column: 8 }" header="选择支付宝支付" :data-source="aliPayChannels">
|
||||
<template #renderItem="{ item }">
|
||||
<ListItem>
|
||||
<Card hoverable class="mt-3 h-28 w-30 pb-3" @click="submit(item.code)">
|
||||
<template #cover>
|
||||
<img class="mt-2 h-40px w-40px" :src="icons[item.code]">
|
||||
<p class="mt-3 text-center">
|
||||
{{ item.name }}
|
||||
</p>
|
||||
</template>
|
||||
</Card>
|
||||
</ListItem>
|
||||
</template>
|
||||
</List>
|
||||
<List :grid="{ column: 8 }" class="mt-4" header="选择微信支付" :data-source="wxPayChannels">
|
||||
<template #renderItem="{ item }">
|
||||
<ListItem>
|
||||
<Card hoverable class="h-28 w-30 pb-3 pt-3">
|
||||
<template #cover>
|
||||
<img class="mt-2 h-40px w-40px" :src="icons[item.code]">
|
||||
<p class="mt-3 text-center">
|
||||
{{ item.name }}
|
||||
</p>
|
||||
</template>
|
||||
</Card>
|
||||
</ListItem>
|
||||
</template>
|
||||
</List>
|
||||
<List :grid="{ column: 8 }" class="mt-4" header="选择其它支付" :data-source="otherPayChannels">
|
||||
<template #renderItem="{ item }">
|
||||
<ListItem>
|
||||
<Card hoverable class="h-28 w-30 pb-3 pt-3">
|
||||
<template #cover>
|
||||
<img class="mt-2 h-40px w-40px" :src="icons[item.code]">
|
||||
<p class="mt-3 text-center">
|
||||
{{ item.name }}
|
||||
</p>
|
||||
</template>
|
||||
</Card>
|
||||
</ListItem>
|
||||
</template>
|
||||
</List>
|
||||
</Card>
|
||||
待开发
|
||||
</div>
|
||||
</template>
|
||||
</template>>
|
||||
|
|
|
|||
Loading…
Reference in New Issue