shangfutong-ui/jeepay-ui-merchant/src/views/order/pay/PayLogDetail.vue

429 lines
16 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<a-drawer
v-model:visible="vdata.visible"
width="50%"
placement="right"
:closable="true"
:title="vdata.visible === true? '订单详情':''"
@close="onClose"
>
<a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">订单信息</a-divider>
<a-row justify="space-between" type="flex">
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="平台订单号">
{{ vdata.detailData.payOrderId }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="通道订单号">
{{ vdata.detailData.channelOrderNo??"--" }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="渠道订单号">
{{ vdata.detailData.platformOrderNo??"--" }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="商户订单号">
{{ vdata.detailData.mchOrderNo??"--" }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="落单订单号">
{{ vdata.detailData.platformMchOrderNo??"--" }}
</a-descriptions-item>
</a-descriptions>
</a-col>
</a-row>
<a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">基础信息</a-divider>
<a-row justify="space-between" type="flex">
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="商户简称">
{{ vdata.detailData.mchName }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="商户号">
{{ vdata.detailData.mchExtNo }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="门店名称">
{{ vdata.detailData.storeName }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="门店编号">
{{ vdata.detailData.storeId }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="应用名称">
{{ vdata.detailData.appName }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="应用ID">
{{ vdata.detailData.appId }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="服务商名称">
{{ vdata.detailData.agentName }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="服务商号">
{{ vdata.detailData.agentNo }} [ {{vdata.detailData.agentContactTel}} ]
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="支付金额(元)">
<a-tag color="green">
{{ vdata.detailData.amount/100 }}
</a-tag>
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="订单状态">
<span v-if="vdata.detailData.state !== 5 ">
<a-tag
:key="vdata.detailData.state"
:color="vdata.detailData.state === 0?'blue':vdata.detailData.state === 1?'orange':vdata.detailData.state === 2?'green':vdata.detailData.state === 6?'':'volcano'"
>
{{ vdata.detailData.state === 0?'订单生成':vdata.detailData.state === 1?'支付中':vdata.detailData.state === 2?'支付成功':vdata.detailData.state === 3?'支付失败':vdata.detailData.state === 4?'已撤销':vdata.detailData.state === 6?'订单关闭':'未知' }}
</a-tag>
</span>
<span v-else-if="vdata.detailData.state === 5 ">
<a-tag
:key="vdata.detailData.refundState"
:color="vdata.detailData.refundState === 0?'red':vdata.detailData.refundState === 1?'orange':vdata.detailData.refundState === 2?'red':'red'"
>
{{ vdata.detailData.refundState === 0?'':vdata.detailData.refundState === 1?'部分退款':vdata.detailData.refundState === 2?'全额退款':'未知' }}
</a-tag>
</span>
</a-descriptions-item>
</a-descriptions>
</a-col>
<!-- <a-col :sm="12">-->
<!-- <a-descriptions><a-descriptions-item label="实际手续费"><a-tag color="pink">{{ vdata.detailData.mchFeeAmount/100 }}</a-tag></a-descriptions-item></a-descriptions>-->
<!-- </a-col>-->
<!-- <a-col :sm="12">-->
<!-- <a-descriptions><a-descriptions-item label="收单手续费"><a-tag color="pink">{{ vdata.detailData.mchOrderFeeAmount/100 }}</a-tag></a-descriptions-item></a-descriptions>-->
<!-- </a-col>-->
<!-- <a-col :sm="12">-->
<!-- <a-descriptions><a-descriptions-item label="商家费率">{{ vdata.detailData.mchFeeRate }}</a-descriptions-item></a-descriptions>-->
<!-- </a-col>-->
<a-col :sm="12">
<a-descriptions><a-descriptions-item label="收单费率">{{ vdata.detailData.mchFeeRateNum }}</a-descriptions-item></a-descriptions>
</a-col>
<a-col :sm="12">
<!-- <a-descriptions><a-descriptions-item label="收单手续费(元)">{{ (vdata.detailData.findAmt / 100).toFixed(2) }} * {{ vdata.detailData.mchFeeRateNum }} = {{ (vdata.detailData.mchOrderFeeAmount / 100).toFixed(2) }}</a-descriptions-item></a-descriptions>-->
收单手续费(元)
<a-popover placement="top">
<template #content>
<p>收单手续费 = 实付金额 - * 收单费率</p>
</template>
<question-circle-outlined/>
</a-popover>
{{ (vdata.detailData.findAmt / 100).toFixed(2) }} * {{ vdata.detailData.mchFeeRateNum }} = {{ (vdata.detailData.mchOrderFeeAmount / 100).toFixed(2) }}
</a-col>
<a-col :sm="12">
<a-descriptions><a-descriptions-item label="垫资费率">{{ vdata.detailData.cashRate }}%</a-descriptions-item></a-descriptions>
</a-col>
<a-col :sm="12">
垫资手续费(元)
<a-popover placement="top">
<template #content>
<p>垫资手续费 = 实付金额 - * 垫资费率</p>
</template>
<question-circle-outlined/>
</a-popover>
{{ (vdata.detailData.findAmt / 100).toFixed(2) }} * {{ vdata.detailData.cashRate }} = {{ (vdata.detailData.cashFee / 100).toFixed(2) }}
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="退款次数">
{{ vdata.detailData.refundTimes }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="退款总额">
<a-tag v-if="vdata.detailData.refundAmount" color="cyan">
{{ (vdata.detailData.refundAmount / 100).toFixed(2)}}
</a-tag>
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions><a-descriptions-item label="优惠金额">¥{{ (vdata.detailData.discountAmt / 100).toFixed(2) }}</a-descriptions-item></a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions><a-descriptions-item label="补贴金额">
¥{{ (vdata.detailData.marketAmt / 100).toFixed(2) }}</a-descriptions-item></a-descriptions>
</a-col>
<a-col :sm="12" style="margin-bottom: 12px">
预计入账金额
<!-- <a-tooltip title="入账金额 = 实付金额 - 收单手续费 - 垫资手续费 - 退款总额" >-->
<!-- <question-circle-outlined style="padding-right: 10px"/>-->
<!-- </a-tooltip>-->
<a-popover placement="top">
<template #content>
<p>入账金额 = 实付金额 - 收单手续费 - 垫资手续费 - 退款总额</p>
</template>
<question-circle-outlined/>
</a-popover>
{{vdata.detailData.findAmt / 100}} - {{vdata.detailData.mchOrderFeeAmount / 100}} - {{vdata.detailData.cashFee / 100}} - {{vdata.detailData.refundAmount / 100}} = {{ ((vdata.detailData.findAmt - vdata.detailData.mchOrderFeeAmount - vdata.detailData.cashFee - vdata.detailData.refundAmount + vdata.detailData.marketAmt) / 100).toFixed(2) }}
</a-col>
<a-col :sm="12"></a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="支付错误码">
{{ vdata.detailData.errCode }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="支付错误描述">
{{ vdata.detailData.errMsg }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="买家备注">
{{ vdata.detailData.buyerRemark }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="卖家备注">
{{ vdata.detailData.sellerRemark }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="订单失效时间">
{{ vdata.detailData.expiredTime }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="创建时间">
{{ vdata.detailData.createdAt }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="更新时间">
{{ vdata.detailData.updatedAt }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="支付成功时间">
{{ vdata.detailData.successTime??"--" }}
</a-descriptions-item>
</a-descriptions>
</a-col>
</a-row>
<a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">其他信息</a-divider>
<a-row justify="space-between" type="flex">
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="商品标题">
{{ vdata.detailData.subject }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="商品描述">
{{ vdata.detailData.body }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="接口代码">
{{ vdata.detailData.ifCode }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="货币代码">
{{ vdata.detailData.currency }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="支付方式">
{{ vdata.detailData.wayCode }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="客户端IP">
{{ vdata.detailData.clientIp }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="用户标识">
{{ vdata.detailData.channelUser }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="异步通知地址">
{{ vdata.detailData.notifyUrl }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="页面跳转地址">
{{ vdata.detailData.returnUrl }}
</a-descriptions-item>
</a-descriptions>
</a-col>
</a-row>
<a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">分账信息</a-divider>
<a-row justify="start" type="flex">
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="订单分账模式">
<span v-if="vdata.detailData.divisionMode == 0">该笔订单不允许分账</span>
<span v-else-if="vdata.detailData.divisionMode == 1">支付成功按配置自动完成分账</span>
<span v-else-if="vdata.detailData.divisionMode == 2">商户手动分账(解冻商户金额)</span>
<span v-else>未知</span>
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="分账状态">
<a-tag v-if="vdata.detailData.divisionState == 0" color="blue">未发生分账</a-tag>
<a-tag v-else-if="vdata.detailData.divisionState == 1" color="orange">待分账</a-tag>
<a-tag v-else-if="vdata.detailData.divisionState == 2" color="red">分账处理中</a-tag>
<a-tag v-else-if="vdata.detailData.divisionState == 3" color="green">任务已结束</a-tag>
<a-tag v-else color="#f50">未知</a-tag>
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions><a-descriptions-item label="最新分账发起时间">{{ vdata.detailData.divisionLastTime }}</a-descriptions-item></a-descriptions>
</a-col>
</a-row>
<!-- <a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">扩展信息</a-divider>-->
<!-- <a-row justify="start" type="flex">-->
<!-- <a-col :sm="24">-->
<!-- <span style="color: black;">扩展参数:</span>-->
<!-- <a-form-item>-->
<!-- <a-input-->
<!-- v-model:value="vdata.detailData.extParam"-->
<!-- type="textarea"-->
<!-- disabled="disabled"-->
<!-- style="height: 100px;color: black;margin-top: 10px;"-->
<!-- />-->
<!-- </a-form-item>-->
<!-- </a-col>-->
<!-- </a-row>-->
</a-drawer>
</template>
<script lang="ts" setup>
import { API_URL_MCH_APPLYMENT_LIST, req } from '@/api/manage'
import {defineProps,reactive, getCurrentInstance} from 'vue'
const { $hasAgentEnt, $SYS_NAME_MAP } = getCurrentInstance()!.appContext.config.globalProperties
const props = defineProps({
callbackFunc: { type: Function,default:null }
})
const vdata:any = reactive({
btnLoading: false,
detailData: {}, // 数据对象
recordId: null, // 更新对象ID
visible: false, // 是否显示弹层/抽屉
termNo: false, // 是否显示弹层/抽屉
})
function show (data) { // 弹层打开事件
vdata.detailData = data // 数据清空
vdata.visible = true
}
function onClose () {
vdata.visible = false
}
defineExpose({
show //抛出show函数给父组件
})
</script>