转账订单列表;

This commit is contained in:
terrfly 2021-08-13 11:46:11 +08:00
parent 3a9e9ba00b
commit cae3570582
9 changed files with 641 additions and 5 deletions

View File

@ -97,6 +97,8 @@ export const API_URL_ISV_PAYCONFIGS_LIST = '/api/isv/payConfigs'
export const API_URL_MCH_PAYCONFIGS_LIST = '/api/mch/payConfigs' export const API_URL_MCH_PAYCONFIGS_LIST = '/api/mch/payConfigs'
/** 商户支付通道配置 **/ /** 商户支付通道配置 **/
export const API_URL_MCH_PAYPASSAGE_LIST = '/api/mch/payPassages' export const API_URL_MCH_PAYPASSAGE_LIST = '/api/mch/payPassages'
/** 转账订单管理 **/
export const API_URL_TRANSFER_ORDER_LIST = '/api/transferOrders'
/** 上传图片/文件地址 **/ /** 上传图片/文件地址 **/
export const upload = { export const upload = {

View File

@ -31,6 +31,7 @@ export const asyncRouteDefine = {
'MchAppPage': { defaultPath: '/apps', component: () => import ('@/views/mchApp/List') }, // 商户应用列表 'MchAppPage': { defaultPath: '/apps', component: () => import ('@/views/mchApp/List') }, // 商户应用列表
'PayOrderListPage': { defaultPath: '/payOrder', component: () => import('@/views/order/pay/PayOrderList') }, // 支付订单列表 'PayOrderListPage': { defaultPath: '/payOrder', component: () => import('@/views/order/pay/PayOrderList') }, // 支付订单列表
'RefundOrderListPage': { defaultPath: '/refundOrder', component: () => import('@/views/order/refund/RefundOrderList') }, // 退款订单列表 'RefundOrderListPage': { defaultPath: '/refundOrder', component: () => import('@/views/order/refund/RefundOrderList') }, // 退款订单列表
'TransferOrderListPage': { defaultPath: '/transferOrder', component: () => import('@/views/order/transfer/TransferOrderList') }, // 转账订单
'MchNotifyListPage': { defaultPath: '/notify', component: () => import('@/views/order/notify/MchNotifyList') }, // 商户通知列表 'MchNotifyListPage': { defaultPath: '/notify', component: () => import('@/views/order/notify/MchNotifyList') }, // 商户通知列表
'SysConfigPage': { defaultPath: '/config', component: () => import('@/views/sys/config/SysConfig') }, // 系统配置 'SysConfigPage': { defaultPath: '/config', component: () => import('@/views/sys/config/SysConfig') }, // 系统配置
'SysLogPage': { defaultPath: '/log', component: () => import('@/views/sys/log/SysLog') } // 系统日志 'SysLogPage': { defaultPath: '/log', component: () => import('@/views/sys/log/SysLog') } // 系统日志

View File

@ -32,6 +32,7 @@
<a-select-option value="">全部</a-select-option> <a-select-option value="">全部</a-select-option>
<a-select-option value="1">支付</a-select-option> <a-select-option value="1">支付</a-select-option>
<a-select-option value="2">退款</a-select-option> <a-select-option value="2">退款</a-select-option>
<a-select-option value="3">转账</a-select-option>
</a-select> </a-select>
</a-form-item> </a-form-item>
@ -67,9 +68,9 @@
<template slot="orderTypeSlot" slot-scope="{record}"> <template slot="orderTypeSlot" slot-scope="{record}">
<a-tag <a-tag
:key="record.orderType" :key="record.orderType"
:color="record.orderType === 1?'green':record.orderType === 2?'volcano':'orange'" :color="record.orderType === 1?'green':record.orderType === 2?'volcano': record.orderType === 3? 'blue': 'orange'"
> >
{{ record.orderType === 1?'支付':record.orderType === 2?'退款':'未知' }} {{ record.orderType === 1?'支付':record.orderType === 2?'退款':record.orderType === 3? '转账':'未知' }}
</a-tag> </a-tag>
</template> </template>
<template slot="opSlot" slot-scope="{record}"> <!-- 操作列插槽 --> <template slot="opSlot" slot-scope="{record}"> <!-- 操作列插槽 -->
@ -124,8 +125,8 @@
<a-col :sm="12"> <a-col :sm="12">
<a-descriptions> <a-descriptions>
<a-descriptions-item label="订单类型"> <a-descriptions-item label="订单类型">
<a-tag :color="detailData.orderType === 1?'green':detailData.orderType === 2?'volcano':'orange'"> <a-tag :color="detailData.orderType === 1?'green':detailData.orderType === 2?'volcano': detailData.orderType === 3? 'blue' : 'orange'">
{{ detailData.orderType === 1?'支付':detailData.orderType === 2?'退款':'未知' }} {{ detailData.orderType === 1?'支付':detailData.orderType === 2?'退款':detailData.orderType === 3 ? '转账': '未知' }}
</a-tag> </a-tag>
</a-descriptions-item> </a-descriptions-item>
</a-descriptions> </a-descriptions>

View File

@ -0,0 +1,194 @@
<!-- 订单详情抽屉 -->
<template>
<a-drawer
width="50%"
placement="right"
:closable="true"
:visible="isShow"
title="转账订单详情"
@close="isShow = false"
>
<a-row justify="space-between" type="flex">
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="商户类型">
{{ detailData.mchType === 1?'普通商户':detailData.mchType === 2?'特约商户':'未知' }}
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="商户号">{{ detailData.mchNo }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="商户名称">{{ detailData.mchName }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="应用APPID">{{ detailData.appId }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="服务商号">{{ detailData.isvNo }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="转账订单号">
<a-tag color="purple">{{ detailData.transferId }}</a-tag>
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="商户转账单号">{{ detailData.mchOrderNo }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="渠道订单号">{{ detailData.channelOrderNo }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="金额">
<a-tag color="green">{{ detailData.amount/100 }}</a-tag>
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="货币代码">{{ detailData.currency }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="收款账号">
<a-tag color="green">{{ detailData.accountNo }}</a-tag>
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="收款人姓名">{{ detailData.accountName }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="转账备注">{{ detailData.transferDesc }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="订单状态">
<a-tag :color="detailData.state === 0?'blue':detailData.state === 1?'orange':detailData.state === 2?'green':'volcano'">
{{ detailData.state === 0?'订单生成':detailData.state === 1?'转账中':detailData.state === 2?'转账成功':detailData.state === 3?'转账失败':detailData.state === 4?'任务关闭':'未知' }}
</a-tag>
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="转账成功时间">{{ detailData.successTime }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="创建时间">{{ detailData.createdAt }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="更新时间">{{ detailData.updatedAt }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-divider />
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="接口代码">{{ detailData.ifCode }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="入账类型">{{ detailData.entryType }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="客户端IP">{{ detailData.clientIp }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="24">
<a-descriptions>
<a-descriptions-item label="异步通知地址">{{ detailData.notifyUrl }}</a-descriptions-item>
</a-descriptions>
</a-col>
</a-row>
<a-divider />
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="渠道订单号">{{ detailData.channelOrderNo }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="渠道错误码">{{ detailData.errCode }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="渠道错误描述">{{ detailData.errMsg }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="24">
<a-form-model-item label="渠道额外参数">
<a-input
type="textarea"
disabled="disabled"
style="height: 100px;color: black"
v-model="detailData.channelExtra"
/>
</a-form-model-item>
</a-col>
<a-divider />
<a-col :sm="24">
<a-form-model-item label="扩展参数">
<a-input
type="textarea"
disabled="disabled"
style="height: 100px;color: black"
v-model="detailData.extParam"
/>
</a-form-model-item>
</a-col>
</a-drawer>
</template>
<script>
import { API_URL_TRANSFER_ORDER_LIST, req } from '@/api/manage'
export default {
data () {
return {
detailData: {},
isShow: false, // /
recordId: null // ID
}
},
methods: {
show: function (recordId) {
const that = this
req.getById(API_URL_TRANSFER_ORDER_LIST, recordId).then(res => {
that.detailData = res
})
this.isShow = true
}
}
}
</script>

View File

@ -0,0 +1,132 @@
<template>
<page-header-wrapper>
<a-card>
<div class="table-page-search-wrapper">
<a-form layout="inline" class="table-head-ground">
<div class="table-layer">
<a-form-item label="" class="table-head-layout" style="max-width:350px;min-width:300px">
<a-range-picker
@change="onChange"
:show-time="{ format: 'HH:mm:ss' }"
format="YYYY-MM-DD HH:mm:ss"
:disabled-date="disabledDate"
>
<a-icon slot="suffixIcon" type="sync" />
</a-range-picker>
</a-form-item>
<jeepay-text-up :placeholder="'转账订单号'" :msg="searchData.transferId" v-model="searchData.transferId" />
<jeepay-text-up :placeholder="'商户订单号'" :msg="searchData.mchOrderNo" v-model="searchData.mchOrderNo" />
<jeepay-text-up :placeholder="'渠道支付订单号'" :msg="searchData.channelOrderNo" v-model="searchData.channelOrderNo" />
<jeepay-text-up :placeholder="'商户号'" :msg="searchData.mchNo" v-model="searchData.mchNo" />
<jeepay-text-up :placeholder="'应用AppId'" :msg="searchData.appId" v-model="searchData.appId"/>
<a-form-item label="" class="table-head-layout">
<a-select v-model="searchData.state" placeholder="转账状态" default-value="">
<a-select-option value="">全部</a-select-option>
<a-select-option value="0">订单生成</a-select-option>
<a-select-option value="1">转账中</a-select-option>
<a-select-option value="2">转账成功</a-select-option>
<a-select-option value="3">转账失败</a-select-option>
</a-select>
</a-form-item>
<span class="table-page-search-submitButtons">
<a-button type="primary" icon="search" @click="queryFunc" :loading="btnLoading">搜索</a-button>
<a-button style="margin-left: 8px" icon="reload" @click="() => this.searchData = {}">重置</a-button>
</span>
</div>
</a-form>
</div>
<!-- 列表渲染 -->
<JeepayTable
@btnLoadClose="btnLoading=false"
ref="infoTable"
:initData="true"
:reqTableDataFunc="reqTableDataFunc"
:tableColumns="tableColumns"
:searchData="searchData"
rowKey="transferId"
:scrollX="1350"
>
<template slot="transferAmountSlot" slot-scope="{record}"><b>{{ record.amount/100 }}</b></template> <!-- 自定义插槽 -->
<template slot="stateSlot" slot-scope="{record}">
<a-tag
:key="record.state"
:color="record.state === 0?'blue':record.state === 1?'orange':record.state === 2?'green':'volcano'"
>
{{ record.state === 0?'订单生成':record.state === 1?'转账中':record.state === 2?'转账成功':record.state === 3?'转账失败':record.state === 4?'任务关闭':'未知' }}
</a-tag>
</template>
<template slot="opSlot" slot-scope="{record}"> <!-- 操作列插槽 -->
<JeepayTableColumns>
<a-button type="link" v-if="$access('ENT_TRANSFER_ORDER_VIEW')" @click="detailFunc(record.transferId)">详情</a-button>
</JeepayTableColumns>
</template>
</JeepayTable>
</a-card>
<!-- 订单详情 页面组件 -->
<TransferOrderDetail ref="transferOrderDetail" />
</page-header-wrapper>
</template>
<script>
import JeepayTable from '@/components/JeepayTable/JeepayTable'
import JeepayTextUp from '@/components/JeepayTextUp/JeepayTextUp' //
import JeepayTableColumns from '@/components/JeepayTable/JeepayTableColumns'
import TransferOrderDetail from './TransferOrderDetail'
import { API_URL_TRANSFER_ORDER_LIST, req } from '@/api/manage'
import moment from 'moment'
// eslint-disable-next-line no-unused-vars
const tableColumns = [
{ title: '转账金额', scopedSlots: { customRender: 'transferAmountSlot' } },
{ title: '商户名称', dataIndex: 'mchName' },
{ title: '转账订单号', dataIndex: 'transferId' },
{ title: '商户转账单号', dataIndex: 'mchOrderNo' },
{ title: '渠道订单号', dataIndex: 'channelOrderNo' },
{ title: '收款账号', dataIndex: 'accountNo' },
{ title: '收款人姓名', dataIndex: 'accountName' },
{ title: '转账备注', dataIndex: 'transferDesc' },
{ title: '状态', scopedSlots: { customRender: 'stateSlot' }, width: 100 },
{ title: '创建日期', dataIndex: 'createdAt' },
{ title: '操作', width: '100px', fixed: 'right', align: 'center', scopedSlots: { customRender: 'opSlot' } }
]
export default {
name: 'IsvListPage',
components: { JeepayTable, JeepayTableColumns, JeepayTextUp, TransferOrderDetail },
data () {
return {
btnLoading: false,
tableColumns: tableColumns,
searchData: {},
createdStart: '', //
createdEnd: '' //
}
},
methods: {
queryFunc () {
this.btnLoading = true
this.$refs.infoTable.refTable(true)
},
// table
reqTableDataFunc: (params) => {
return req.list(API_URL_TRANSFER_ORDER_LIST, params)
},
searchFunc: function () { //
this.$refs.infoTable.refTable(true)
},
detailFunc: function (recordId) {
this.$refs.transferOrderDetail.show(recordId)
},
moment,
onChange (date, dateString) {
this.searchData.createdStart = dateString[0] //
this.searchData.createdEnd = dateString[1] //
},
disabledDate (current) { //
return current && current > moment().endOf('day')
}
}
}
</script>

View File

@ -86,6 +86,8 @@ export const API_URL_PAYWAYS_LIST = '/api/payWays'
export const API_URL_MCH_PAYCONFIGS_LIST = '/api/mch/payConfigs' export const API_URL_MCH_PAYCONFIGS_LIST = '/api/mch/payConfigs'
/** 商户支付通道配置 **/ /** 商户支付通道配置 **/
export const API_URL_MCH_PAYPASSAGE_LIST = '/api/mch/payPassages' export const API_URL_MCH_PAYPASSAGE_LIST = '/api/mch/payPassages'
/** 转账订单管理 **/
export const API_URL_TRANSFER_ORDER_LIST = '/api/transferOrders'
/** 上传图片/文件地址 **/ /** 上传图片/文件地址 **/
export const upload = { export const upload = {

View File

@ -28,5 +28,7 @@ export const asyncRouteDefine = {
'PayTestPage': { defaultPath: '/paytest', component: () => import ('@/views/payTest/PayTest') }, // 支付测试 'PayTestPage': { defaultPath: '/paytest', component: () => import ('@/views/payTest/PayTest') }, // 支付测试
'PayOrderListPage': { defaultPath: '/payOrder', component: () => import('@/views/order/pay/PayOrderList') }, // 支付订单列表 'PayOrderListPage': { defaultPath: '/payOrder', component: () => import('@/views/order/pay/PayOrderList') }, // 支付订单列表
'RefundOrderListPage': { defaultPath: '/refundOrder', component: () => import('@/views/order/refund/RefundOrderList') } // 退款订单列表 'RefundOrderListPage': { defaultPath: '/refundOrder', component: () => import('@/views/order/refund/RefundOrderList') }, // 退款订单列表
'TransferOrderListPage': { defaultPath: '/transferOrder', component: () => import('@/views/order/transfer/TransferOrderList') } // 转账订单
} }

View File

@ -0,0 +1,172 @@
<!-- 订单详情抽屉 -->
<template>
<a-drawer
width="50%"
placement="right"
:closable="true"
:visible="isShow"
title="转账订单详情"
@close="isShow = false"
>
<a-row justify="space-between" type="flex">
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="应用APPID">{{ detailData.appId }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="转账订单号">
<a-tag color="purple">{{ detailData.transferId }}</a-tag>
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="商户转账单号">{{ detailData.mchOrderNo }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="渠道订单号">{{ detailData.channelOrderNo }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="金额">
<a-tag color="green">{{ detailData.amount/100 }}</a-tag>
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="货币代码">{{ detailData.currency }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="收款账号">
<a-tag color="green">{{ detailData.accountNo }}</a-tag>
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="收款人姓名">{{ detailData.accountName }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="转账备注">{{ detailData.transferDesc }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="订单状态">
<a-tag :color="detailData.state === 0?'blue':detailData.state === 1?'orange':detailData.state === 2?'green':'volcano'">
{{ detailData.state === 0?'订单生成':detailData.state === 1?'转账中':detailData.state === 2?'转账成功':detailData.state === 3?'转账失败':detailData.state === 4?'任务关闭':'未知' }}
</a-tag>
</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="转账成功时间">{{ detailData.successTime }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="创建时间">{{ detailData.createdAt }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="更新时间">{{ detailData.updatedAt }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-divider />
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="接口代码">{{ detailData.ifCode }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="入账类型">{{ detailData.entryType }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="客户端IP">{{ detailData.clientIp }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="24">
<a-descriptions>
<a-descriptions-item label="异步通知地址">{{ detailData.notifyUrl }}</a-descriptions-item>
</a-descriptions>
</a-col>
</a-row>
<a-divider />
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="渠道订单号">{{ detailData.channelOrderNo }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="渠道错误码">{{ detailData.errCode }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="12">
<a-descriptions>
<a-descriptions-item label="渠道错误描述">{{ detailData.errMsg }}</a-descriptions-item>
</a-descriptions>
</a-col>
<a-col :sm="24">
<a-form-model-item label="渠道额外参数">
<a-input
type="textarea"
disabled="disabled"
style="height: 100px;color: black"
v-model="detailData.channelExtra"
/>
</a-form-model-item>
</a-col>
<a-divider />
<a-col :sm="24">
<a-form-model-item label="扩展参数">
<a-input
type="textarea"
disabled="disabled"
style="height: 100px;color: black"
v-model="detailData.extParam"
/>
</a-form-model-item>
</a-col>
</a-drawer>
</template>
<script>
import { API_URL_TRANSFER_ORDER_LIST, req } from '@/api/manage'
export default {
data () {
return {
detailData: {},
isShow: false, // /
recordId: null // ID
}
},
methods: {
show: function (recordId) {
const that = this
req.getById(API_URL_TRANSFER_ORDER_LIST, recordId).then(res => {
that.detailData = res
})
this.isShow = true
}
}
}
</script>

View File

@ -0,0 +1,130 @@
<template>
<page-header-wrapper>
<a-card>
<div class="table-page-search-wrapper">
<a-form layout="inline" class="table-head-ground">
<div class="table-layer">
<a-form-item label="" class="table-head-layout" style="max-width:350px;min-width:300px">
<a-range-picker
@change="onChange"
:show-time="{ format: 'HH:mm:ss' }"
format="YYYY-MM-DD HH:mm:ss"
:disabled-date="disabledDate"
>
<a-icon slot="suffixIcon" type="sync" />
</a-range-picker>
</a-form-item>
<jeepay-text-up :placeholder="'转账订单号'" :msg="searchData.transferId" v-model="searchData.transferId" />
<jeepay-text-up :placeholder="'商户订单号'" :msg="searchData.mchOrderNo" v-model="searchData.mchOrderNo" />
<jeepay-text-up :placeholder="'渠道支付订单号'" :msg="searchData.channelOrderNo" v-model="searchData.channelOrderNo" />
<jeepay-text-up :placeholder="'应用AppId'" :msg="searchData.appId" v-model="searchData.appId"/>
<a-form-item label="" class="table-head-layout">
<a-select v-model="searchData.state" placeholder="转账状态" default-value="">
<a-select-option value="">全部</a-select-option>
<a-select-option value="0">订单生成</a-select-option>
<a-select-option value="1">转账中</a-select-option>
<a-select-option value="2">转账成功</a-select-option>
<a-select-option value="3">转账失败</a-select-option>
</a-select>
</a-form-item>
<span class="table-page-search-submitButtons">
<a-button type="primary" icon="search" @click="queryFunc" :loading="btnLoading">搜索</a-button>
<a-button style="margin-left: 8px" icon="reload" @click="() => this.searchData = {}">重置</a-button>
</span>
</div>
</a-form>
</div>
<!-- 列表渲染 -->
<JeepayTable
@btnLoadClose="btnLoading=false"
ref="infoTable"
:initData="true"
:reqTableDataFunc="reqTableDataFunc"
:tableColumns="tableColumns"
:searchData="searchData"
rowKey="transferId"
:scrollX="1350"
>
<template slot="transferAmountSlot" slot-scope="{record}"><b>{{ record.amount/100 }}</b></template> <!-- 自定义插槽 -->
<template slot="stateSlot" slot-scope="{record}">
<a-tag
:key="record.state"
:color="record.state === 0?'blue':record.state === 1?'orange':record.state === 2?'green':'volcano'"
>
{{ record.state === 0?'订单生成':record.state === 1?'转账中':record.state === 2?'转账成功':record.state === 3?'转账失败':record.state === 4?'任务关闭':'未知' }}
</a-tag>
</template>
<template slot="opSlot" slot-scope="{record}"> <!-- 操作列插槽 -->
<JeepayTableColumns>
<a-button type="link" v-if="$access('ENT_TRANSFER_ORDER_VIEW')" @click="detailFunc(record.transferId)">详情</a-button>
</JeepayTableColumns>
</template>
</JeepayTable>
</a-card>
<!-- 订单详情 页面组件 -->
<TransferOrderDetail ref="transferOrderDetail" />
</page-header-wrapper>
</template>
<script>
import JeepayTable from '@/components/JeepayTable/JeepayTable'
import JeepayTextUp from '@/components/JeepayTextUp/JeepayTextUp' //
import JeepayTableColumns from '@/components/JeepayTable/JeepayTableColumns'
import TransferOrderDetail from './TransferOrderDetail'
import { API_URL_TRANSFER_ORDER_LIST, req } from '@/api/manage'
import moment from 'moment'
// eslint-disable-next-line no-unused-vars
const tableColumns = [
{ title: '转账金额', scopedSlots: { customRender: 'transferAmountSlot' } },
{ title: '转账订单号', dataIndex: 'transferId' },
{ title: '商户转账单号', dataIndex: 'mchOrderNo' },
{ title: '渠道订单号', dataIndex: 'channelOrderNo' },
{ title: '收款账号', dataIndex: 'accountNo' },
{ title: '收款人姓名', dataIndex: 'accountName' },
{ title: '转账备注', dataIndex: 'transferDesc' },
{ title: '状态', scopedSlots: { customRender: 'stateSlot' }, width: 100 },
{ title: '创建日期', dataIndex: 'createdAt' },
{ title: '操作', width: '100px', fixed: 'right', align: 'center', scopedSlots: { customRender: 'opSlot' } }
]
export default {
name: 'IsvListPage',
components: { JeepayTable, JeepayTableColumns, JeepayTextUp, TransferOrderDetail },
data () {
return {
btnLoading: false,
tableColumns: tableColumns,
searchData: {},
createdStart: '', //
createdEnd: '' //
}
},
methods: {
queryFunc () {
this.btnLoading = true
this.$refs.infoTable.refTable(true)
},
// table
reqTableDataFunc: (params) => {
return req.list(API_URL_TRANSFER_ORDER_LIST, params)
},
searchFunc: function () { //
this.$refs.infoTable.refTable(true)
},
detailFunc: function (recordId) {
this.$refs.transferOrderDetail.show(recordId)
},
moment,
onChange (date, dateString) {
this.searchData.createdStart = dateString[0] //
this.searchData.createdEnd = dateString[1] //
},
disabledDate (current) { //
return current && current > moment().endOf('day')
}
}
}
</script>