429 lines
16 KiB
Vue
429 lines
16 KiB
Vue
<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> |