From cae3570582debc3bea6a0caa7df8a8dd5eb78a42 Mon Sep 17 00:00:00 2001
From: terrfly <tengfei9753@sina.com>
Date: Fri, 13 Aug 2021 11:46:11 +0800
Subject: [PATCH] =?UTF-8?q?=E8=BD=AC=E8=B4=A6=E8=AE=A2=E5=8D=95=E5=88=97?=
 =?UTF-8?q?=E8=A1=A8=EF=BC=9B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 jeepay-ui-manager/src/api/manage.js           |   2 +
 jeepay-ui-manager/src/config/appConfig.js     |   1 +
 .../src/views/order/notify/MchNotifyList.vue  |   9 +-
 .../order/transfer/TransferOrderDetail.vue    | 194 ++++++++++++++++++
 .../order/transfer/TransferOrderList.vue      | 132 ++++++++++++
 jeepay-ui-merchant/src/api/manage.js          |   2 +
 jeepay-ui-merchant/src/config/appConfig.js    |   4 +-
 .../order/transfer/TransferOrderDetail.vue    | 172 ++++++++++++++++
 .../order/transfer/TransferOrderList.vue      | 130 ++++++++++++
 9 files changed, 641 insertions(+), 5 deletions(-)
 create mode 100644 jeepay-ui-manager/src/views/order/transfer/TransferOrderDetail.vue
 create mode 100644 jeepay-ui-manager/src/views/order/transfer/TransferOrderList.vue
 create mode 100644 jeepay-ui-merchant/src/views/order/transfer/TransferOrderDetail.vue
 create mode 100644 jeepay-ui-merchant/src/views/order/transfer/TransferOrderList.vue

diff --git a/jeepay-ui-manager/src/api/manage.js b/jeepay-ui-manager/src/api/manage.js
index b60655b..d3fa904 100644
--- a/jeepay-ui-manager/src/api/manage.js
+++ b/jeepay-ui-manager/src/api/manage.js
@@ -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_PAYPASSAGE_LIST = '/api/mch/payPassages'
+/** 转账订单管理 **/
+export const API_URL_TRANSFER_ORDER_LIST = '/api/transferOrders'
 
 /** 上传图片/文件地址 **/
 export const upload = {
diff --git a/jeepay-ui-manager/src/config/appConfig.js b/jeepay-ui-manager/src/config/appConfig.js
index 85d7e3b..7098e61 100644
--- a/jeepay-ui-manager/src/config/appConfig.js
+++ b/jeepay-ui-manager/src/config/appConfig.js
@@ -31,6 +31,7 @@ export const asyncRouteDefine = {
   'MchAppPage': { defaultPath: '/apps', component: () => import ('@/views/mchApp/List') }, // 商户应用列表
   'PayOrderListPage': { defaultPath: '/payOrder', component: () => import('@/views/order/pay/PayOrderList') }, // 支付订单列表
   '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') }, // 商户通知列表
   'SysConfigPage': { defaultPath: '/config', component: () => import('@/views/sys/config/SysConfig') }, // 系统配置
   'SysLogPage': { defaultPath: '/log', component: () => import('@/views/sys/log/SysLog') } // 系统日志
diff --git a/jeepay-ui-manager/src/views/order/notify/MchNotifyList.vue b/jeepay-ui-manager/src/views/order/notify/MchNotifyList.vue
index 4ea0455..21a6f18 100644
--- a/jeepay-ui-manager/src/views/order/notify/MchNotifyList.vue
+++ b/jeepay-ui-manager/src/views/order/notify/MchNotifyList.vue
@@ -32,6 +32,7 @@
                 <a-select-option value="">全部</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>
 
@@ -67,9 +68,9 @@
         <template slot="orderTypeSlot" slot-scope="{record}">
           <a-tag
             :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>
         </template>
         <template slot="opSlot" slot-scope="{record}">  <!-- 操作列插槽 -->
@@ -124,8 +125,8 @@
           <a-col :sm="12">
             <a-descriptions>
               <a-descriptions-item label="订单类型">
-                <a-tag :color="detailData.orderType === 1?'green':detailData.orderType === 2?'volcano':'orange'">
-                  {{ detailData.orderType === 1?'支付':detailData.orderType === 2?'退款':'未知' }}
+                <a-tag :color="detailData.orderType === 1?'green':detailData.orderType === 2?'volcano': detailData.orderType === 3? 'blue' : 'orange'">
+                  {{ detailData.orderType === 1?'支付':detailData.orderType === 2?'退款':detailData.orderType === 3 ? '转账': '未知' }}
                 </a-tag>
               </a-descriptions-item>
             </a-descriptions>
diff --git a/jeepay-ui-manager/src/views/order/transfer/TransferOrderDetail.vue b/jeepay-ui-manager/src/views/order/transfer/TransferOrderDetail.vue
new file mode 100644
index 0000000..89566a3
--- /dev/null
+++ b/jeepay-ui-manager/src/views/order/transfer/TransferOrderDetail.vue
@@ -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>
diff --git a/jeepay-ui-manager/src/views/order/transfer/TransferOrderList.vue b/jeepay-ui-manager/src/views/order/transfer/TransferOrderList.vue
new file mode 100644
index 0000000..30c346c
--- /dev/null
+++ b/jeepay-ui-manager/src/views/order/transfer/TransferOrderList.vue
@@ -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>
diff --git a/jeepay-ui-merchant/src/api/manage.js b/jeepay-ui-merchant/src/api/manage.js
index f290057..956d984 100644
--- a/jeepay-ui-merchant/src/api/manage.js
+++ b/jeepay-ui-merchant/src/api/manage.js
@@ -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_PAYPASSAGE_LIST = '/api/mch/payPassages'
+/** 转账订单管理 **/
+export const API_URL_TRANSFER_ORDER_LIST = '/api/transferOrders'
 
 /** 上传图片/文件地址 **/
 export const upload = {
diff --git a/jeepay-ui-merchant/src/config/appConfig.js b/jeepay-ui-merchant/src/config/appConfig.js
index 0f986d9..89e6ee3 100644
--- a/jeepay-ui-merchant/src/config/appConfig.js
+++ b/jeepay-ui-merchant/src/config/appConfig.js
@@ -28,5 +28,7 @@ export const asyncRouteDefine = {
   'PayTestPage': { defaultPath: '/paytest', component: () => import ('@/views/payTest/PayTest') }, // 支付测试
 
   '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') } // 转账订单
+
 }
diff --git a/jeepay-ui-merchant/src/views/order/transfer/TransferOrderDetail.vue b/jeepay-ui-merchant/src/views/order/transfer/TransferOrderDetail.vue
new file mode 100644
index 0000000..e88a078
--- /dev/null
+++ b/jeepay-ui-merchant/src/views/order/transfer/TransferOrderDetail.vue
@@ -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>
diff --git a/jeepay-ui-merchant/src/views/order/transfer/TransferOrderList.vue b/jeepay-ui-merchant/src/views/order/transfer/TransferOrderList.vue
new file mode 100644
index 0000000..b624656
--- /dev/null
+++ b/jeepay-ui-merchant/src/views/order/transfer/TransferOrderList.vue
@@ -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>