code review:优化收银台的实现,解决 TODO

This commit is contained in:
YunaiV 2023-08-10 23:30:37 +08:00
parent 551ebbd41d
commit 7625e6757c
8 changed files with 55 additions and 184 deletions

View File

@ -22,16 +22,6 @@ export interface AppPageReqVO extends PageParam {
createTime?: Date[]
}
export interface AppExportReqVO {
name?: string
status?: number
remark?: string
payNotifyUrl?: string
refundNotifyUrl?: string
merchantName?: string
createTime?: Date[]
}
export interface AppUpdateStatusReqVO {
id: number
status: number
@ -67,16 +57,7 @@ export const deleteApp = (id: number) => {
return request.delete({ url: '/pay/app/delete?id=' + id })
}
// 导出支付应用
export const exportApp = (params: AppExportReqVO) => {
return request.download({ url: '/pay/app/export-excel', params })
}
// 根据商ID称搜索应用列表
export const getAppListByMerchantId = (merchantId: number) => {
return request.get({ url: '/pay/app/list-merchant-id', params: { merchantId: merchantId } })
}
// 获得支付应用列表
export const getAppList = () => {
return request.get({
url: '/pay/app/list'

View File

@ -1,5 +1,6 @@
import request from '@/config/axios'
// 获得支付通知明细
export const getNotifyTaskDetail = (id) => {
return request.get({
url: '/pay/notify/get-detail?id=' + id

View File

@ -93,21 +93,11 @@ export const getOrderDetail = async (id: number) => {
return await request.get({ url: '/pay/order/get-detail?id=' + id })
}
// 新增支付订单
export const createOrder = async (data: OrderVO) => {
// 提交支付订单
export const submitOrder = async (data: any) => {
return await request.post({ url: '/pay/order/submit', data })
}
// 修改支付订单
export const updateOrder = async (data: OrderVO) => {
return await request.put({ url: '/pay/order/update', data })
}
// 删除支付订单
export const deleteOrder = async (id: number) => {
return await request.delete({ url: '/pay/order/delete?id=' + id })
}
// 导出支付订单
export const exportOrder = async (params: OrderExportReqVO) => {
return await request.download({ url: '/pay/order/export-excel', params })

View File

@ -177,80 +177,6 @@ export const PayOrderStatusEnum = {
}
}
/**
*
*/
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: '退款关闭'
}
}
/**
* SPU
*/

View File

@ -130,13 +130,8 @@ export enum DICT_TYPE {
BPM_OA_LEAVE_TYPE = 'bpm_oa_leave_type',
// ========== PAY 模块 ==========
PAY_CHANNEL_WECHAT_VERSION = 'pay_channel_wechat_version', // 微信渠道版本
PAY_CHANNEL_ALIPAY_SIGN_TYPE = 'pay_channel_alipay_sign_type', // 支付渠道支付宝算法类型
PAY_CHANNEL_ALIPAY_MODE = 'pay_channel_alipay_mode', // 支付宝公钥类型
PAY_CHANNEL_ALIPAY_SERVER_TYPE = 'pay_channel_alipay_server_type', // 支付宝网关地址
PAY_CHANNEL_CODE = 'pay_channel_code', // 支付渠道编码类型
PAY_CHANNEL_CODE_TYPE = 'pay_channel_code_type', // 支付渠道编码类型
// PAY_ORDER_NOTIFY_STATUS = 'pay_order_notify_status', // 商户支付订单回调状态
PAY_ORDER_STATUS = 'pay_order_status', // 商户支付订单状态
PAY_ORDER_REFUND_STATUS = 'pay_order_refund_status', // 商户支付订单退款状态
PAY_REFUND_ORDER_STATUS = 'pay_refund_order_status', // 退款订单状态

View File

@ -21,8 +21,8 @@
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="支付结果的回调地址" prop="payNotifyUrl">
<el-input v-model="formData.payNotifyUrl" placeholder="请输入支付结果的回调地址" />
<el-form-item label="支付结果的回调地址" prop="orderNotifyUrl">
<el-input v-model="formData.orderNotifyUrl" placeholder="请输入支付结果的回调地址" />
</el-form-item>
<el-form-item label="退款结果的回调地址" prop="refundNotifyUrl">
<el-input v-model="formData.refundNotifyUrl" placeholder="请输入退款结果的回调地址" />
@ -66,7 +66,7 @@ const formData = ref({
const formRules = reactive({
name: [{ required: true, message: '应用名不能为空', trigger: 'blur' }],
status: [{ required: true, message: '开启状态不能为空', trigger: 'blur' }],
payNotifyUrl: [{ required: true, message: '支付结果的回调地址不能为空', trigger: 'blur' }],
orderNotifyUrl: [{ required: true, message: '支付结果的回调地址不能为空', trigger: 'blur' }],
refundNotifyUrl: [{ required: true, message: '退款结果的回调地址不能为空', trigger: 'blur' }]
})
const formRef = ref() // Ref
@ -122,7 +122,7 @@ const resetForm = () => {
name: undefined,
status: CommonStatusEnum.ENABLE,
remark: undefined,
payNotifyUrl: undefined,
orderNotifyUrl: undefined,
refundNotifyUrl: undefined
}
formRef.value?.resetFields()

View File

@ -54,15 +54,6 @@
>
<Icon icon="ep:plus" class="mr-5px" /> 新增
</el-button>
<el-button
type="success"
plain
@click="handleExport"
:loading="exportLoading"
v-hasPermi="['system:tenant:export']"
>
<Icon icon="ep:download" class="mr-5px" /> 导出
</el-button>
</el-form-item>
</el-form>
</ContentWrap>
@ -392,20 +383,6 @@ const handleDelete = async (id: number) => {
} catch {}
}
/** 导出按钮操作 */
const handleExport = async () => {
try {
//
await message.exportConfirm()
//
exportLoading.value = true
const data = await AppApi.exportApp(queryParams)
download.excel(data, '支付应用信息.xls')
} finally {
exportLoading.value = false
}
}
/**
* 根据渠道编码判断渠道列表中是否存在
*

View File

@ -5,15 +5,15 @@
<el-descriptions-item label="支付单号">{{ payOrder.id }}</el-descriptions-item>
<el-descriptions-item label="商品标题">{{ payOrder.subject }}</el-descriptions-item>
<el-descriptions-item label="商品内容">{{ payOrder.body }}</el-descriptions-item>
<el-descriptions-item label="支付金额"
>{{ (payOrder.price / 100.0).toFixed(2) }}</el-descriptions-item
>
<el-descriptions-item label="创建时间">{{
formatDate(payOrder.createTime)
}}</el-descriptions-item>
<el-descriptions-item label="过期时间">{{
formatDate(payOrder.expireTime)
}}</el-descriptions-item>
<el-descriptions-item label="支付金额">
{{ (payOrder.price / 100.0).toFixed(2) }}
</el-descriptions-item>
<el-descriptions-item label="创建时间">
{{ formatDate(payOrder.createTime) }}
</el-descriptions-item>
<el-descriptions-item label="过期时间">
{{ formatDate(payOrder.expireTime) }}
</el-descriptions-item>
</el-descriptions>
</el-card>
@ -61,7 +61,7 @@
</el-card>
<!-- 展示形式二维码 URL -->
<el-dialog
<Dialog
:title="qrCode.title"
v-model="qrCode.visible"
width="350px"
@ -69,10 +69,10 @@
:close-on-press-escape="false"
>
<qrcode-vue :value="qrCode.url" :size="310" level="L" />
</el-dialog>
</Dialog>
<!-- 展示形式BarCode 条形码 -->
<el-dialog
<Dialog
:title="barCode.title"
v-model="barCode.visible"
width="500px"
@ -93,8 +93,9 @@
type="danger"
target="_blank"
href="https://baike.baidu.com/item/条码支付/10711903"
>(扫码枪/扫码盒)</el-link
>
(扫码枪/扫码盒)
</el-link>
扫码
</div>
</el-col>
@ -105,21 +106,22 @@
type="primary"
@click="submit0(barCode.channelCode)"
:disabled="barCode.value.length === 0"
>确认支付</el-button
>
确认支付
</el-button>
<el-button @click="barCode.visible = false"> </el-button>
</template>
</el-dialog>
</Dialog>
</template>
<script setup lang="ts" name="PayCashier">
<script lang="ts" setup>
import QrcodeVue from 'qrcode.vue'
import { getOrder, createOrder } from '@/api/pay/order'
import { getOrder, submitOrder } from '@/api/pay/order'
import { PayChannelEnum, PayDisplayModeEnum, PayOrderStatusEnum } from '@/utils/constants'
import { ref, onMounted } from 'vue'
import { formatDate } from '@/utils/formatTime'
import { useTagsViewStore } from '@/store/modules/tagsView'
// TODO: ugly
//
import svg_alipay_pc from '@/assets/svgs/pay/icon/alipay_pc.svg'
import svg_alipay_wap from '@/assets/svgs/pay/icon/alipay_wap.svg'
import svg_alipay_app from '@/assets/svgs/pay/icon/alipay_app.svg'
@ -132,11 +134,14 @@ import svg_wx_native from '@/assets/svgs/pay/icon/wx_native.svg'
import svg_wx_bar from '@/assets/svgs/pay/icon/wx_bar.svg'
import svg_mock from '@/assets/svgs/pay/icon/mock.svg'
const message = useMessage() //
const route = useRoute()
const router = useRouter()
defineOptions({ name: 'PayCashier' })
const id = ref(undefined) //
const message = useMessage() //
const route = useRoute() //
const { push, currentRoute } = useRouter() //
const { delView } = useTagsViewStore() //
const id = ref(undefined) //
const returnUrl = ref<string | undefined>(undefined) //
const loading = ref(false) // loading
const payOrder = ref({}) //
@ -167,7 +172,6 @@ const channelsAlipay = [
code: 'alipay_bar'
}
]
const channelsWechat = [
{
name: '微信公众号支付',
@ -195,7 +199,6 @@ const channelsWechat = [
code: 'wx_bar'
}
]
const channelsMock = [
{
name: '模拟支付',
@ -220,14 +223,6 @@ const barCode = ref({
visible: false
})
onMounted(() => {
id.value = route.query.id
if (route.query.returnUrl) {
returnUrl.value = decodeURIComponent(route.query.returnUrl)
}
getDetail()
})
/** 获得支付信息 */
const getDetail = () => {
// 1.1
@ -297,7 +292,7 @@ const submit = (channelCode) => {
const submit0 = (channelCode) => {
submitLoading.value = true
createOrder({
submitOrder({
id: id.value,
channelCode: channelCode,
returnUrl: location.href, // {@link returnUrl}
@ -308,7 +303,7 @@ const submit0 = (channelCode) => {
if (data.status === PayOrderStatusEnum.SUCCESS.status) {
clearQueryInterval()
message.success('支付成功!')
goReturnUrl()
goReturnUrl('success')
return
}
@ -396,13 +391,13 @@ const createQueryInterval = () => {
if (data.status === PayOrderStatusEnum.SUCCESS.status) {
clearQueryInterval()
message.success('支付成功!')
goReturnUrl()
goReturnUrl('success')
}
//
if (data.status === PayOrderStatusEnum.CLOSED.status) {
clearQueryInterval()
message.error('支付已关闭!')
goReturnUrl()
goReturnUrl('close')
}
})
}, 1000 * 2)
@ -435,8 +430,7 @@ const goReturnUrl = (payResult) => {
//
if (!returnUrl.value) {
// TODO: dhb52 $tab
// this.$tab.closePage()
delView(unref(currentRoute))
return
}
@ -448,14 +442,21 @@ const goReturnUrl = (payResult) => {
if (returnUrl.value.indexOf('http') === 0) {
location.href = url
} else {
// TODO: dhb52 $tab
// this.$tab.closePage(() => {
// router.push({
// path: url
// })
// })
delView(unref(currentRoute))
push({
path: url
})
}
}
/** 初始化 */
onMounted(() => {
id.value = route.query.id
if (route.query.returnUrl) {
returnUrl.value = decodeURIComponent(route.query.returnUrl)
}
getDetail()
})
</script>
<style lang="scss" scoped>
@ -464,7 +465,7 @@ const goReturnUrl = (payResult) => {
margin-top: -10px;
.box {
width: 130px;
width: 160px;
border: 1px solid #e6ebf5;
cursor: pointer;
text-align: center;