feat 样式优化和功能调试

2026-08-09 14:36:00 +08:00 · 2024-08-18 22:28:00 +08:00
parent 616c580c17
commit b590bee978
11 changed files with 207 additions and 77 deletions
--- a/src/enums/daxpay/TradeStatusEnum.ts
+++ b/src/enums/daxpay/TradeStatusEnum.ts
@@ -94,8 +94,24 @@ export enum TransferStatusEnum {
  PROGRESS = 'progress',
  /** 转账成功 */
  SUCCESS = 'success',
-  /** 转账关闭 */
-  FAIL = 'fail',
  /** 转账失败 */
+  FAIL = 'fail',
+  /** 转账关闭 */
  CLOSE = 'close',
 }
+
+/**
+ * 支付回调处理状态
+ */
+export enum CallbackStatusEnum {
+  /** 成功 */
+  SUCCESS = 'success',
+  /** 失败 */
+  FAIL = 'fail',
+  /** 忽略 */
+  IGNORE = 'ignore',
+  /** 异常 */
+  EXCEPTION = 'exception',
+  /** 未找到 */
+  NOT_FOUND = 'not_found',
+}
--- a/src/views/daxpay/admin/order/pay/PayOrderInfo.vue
+++ b/src/views/daxpay/admin/order/pay/PayOrderInfo.vue
@@ -49,7 +49,7 @@
        <a-descriptions-item label="错误信息" v-if="order.errorMsg" :span="16">
          {{ order.errorMsg || '无' }}
        </a-descriptions-item>
-        <a-descriptions-item label="客户IP" :span="8">
+        <a-descriptions-item label="终端IP" :span="8">
          {{ order.clientIp }}
        </a-descriptions-item>
        <a-descriptions-item label="描述" :span="16">
--- a/src/views/daxpay/admin/order/refund/RefundOrder.api.ts
+++ b/src/views/daxpay/admin/order/refund/RefundOrder.api.ts
@@ -1,6 +1,12 @@
 import { defHttp } from '@/utils/http/axios'
 import { PageResult, Result } from '#/axios'
 import { MchEntity } from '#/web'
+import {
+  PayAllocStatusEnum,
+  PayRefundStatusEnum,
+  PayStatusEnum,
+  RefundStatusEnum,
+} from '@/enums/daxpay/TradeStatusEnum'

 /**
 * 分页
@@ -82,6 +88,27 @@ export function getTotalAmount(param) {
  })
 }

+/**
+ * 显示样式优化
+ */
+export function cellStyle({ row, column }) {
+  // 支付状态
+  if (column.field == 'status') {
+    if (row.status == RefundStatusEnum.SUCCESS) {
+      return { color: 'green' }
+    }
+    if (row.status == RefundStatusEnum.FAIL) {
+      return { color: 'red' }
+    }
+    if (row.status == RefundStatusEnum.PROGRESS) {
+      return { color: 'orange' }
+    }
+    if (row.status == RefundStatusEnum.CLOSE) {
+      return { color: 'gray' }
+    }
+  }
+}
+
 /**
 * 退款记录
 */
--- a/src/views/daxpay/admin/order/refund/RefundOrderList.vue
+++ b/src/views/daxpay/admin/order/refund/RefundOrderList.vue
@@ -54,7 +54,7 @@
              {{ row.amount ? row.amount : 0 }}
            </template>
          </vxe-column>
-          <vxe-column field="refundStatus" title="状态" :min-width="80">
+          <vxe-column field="status" title="状态" :min-width="100">
            <template #default="{ row }">
              {{ dictConvert('refund_status', row.status) }}
            </template>
@@ -107,7 +107,14 @@

 <script lang="ts" setup>
  import { computed, onMounted, ref } from 'vue'
-  import { closeRefund, getTotalAmount, page, retryRefund, syncOrder } from './RefundOrder.api'
+  import {
+    closeRefund,
+    getTotalAmount,
+    page,
+    retryRefund,
+    syncOrder,
+    cellStyle,
+  } from './RefundOrder.api'
  import useTablePage from '@/hooks/bootx/useTablePage'
  import RefundOrderInfo from './RefundOrderInfo.vue'
  import { VxeTable, VxeTableInstance, VxeToolbar, VxeToolbarInstance } from 'vxe-table'
@@ -118,11 +125,7 @@
  import PayOrderInfo from '../pay/PayOrderInfo.vue'
  import { LabeledValue } from 'ant-design-vue/lib/select'
  import ALink from '@/components/Link/Link.vue'
-  import {
-    PayAllocStatusEnum,
-    PayStatusEnum,
-    RefundStatusEnum,
-  } from '@/enums/daxpay/TradeStatusEnum'
+  import { RefundStatusEnum } from '@/enums/daxpay/TradeStatusEnum'
  import { Icon } from '@/components/Icon'

  // 使用hooks
@@ -244,7 +247,7 @@
    createConfirm({
      iconType: 'warning',
      title: '警告',
-      content: '请确定该退款订单是否处理失败并结束！',
+      content: '请确定该退款订单处理失败并处理完成！',
      onOk: () => {
        loading.value = true
        closeRefund(record.id).then(() => {
@@ -286,38 +289,6 @@
  function showPayOrder(record) {
    payOrderInfo.value.init(record.orderNo)
  }
-
-  function cellStyle({ row, column }) {
-    if (column.field == 'refundStatus') {
-      if (row.status == 'success') {
-        return { color: 'green' }
-      }
-      if (row.status == 'fail') {
-        return { color: 'red' }
-      }
-      if (row.status == 'progress') {
-        return { color: 'orange' }
-      }
-      if (row.status == 'close') {
-        return { color: 'gray' }
-      }
-      return { color: 'red' }
-    }
-    if (column.field == 'async') {
-      if (row.asyncPay) {
-        return { color: 'green' }
-      } else {
-        return { color: 'gray' }
-      }
-    }
-    if (column.field == 'combinationPay') {
-      if (row.combinationPay) {
-        return { color: 'green' }
-      } else {
-        return { color: 'gray' }
-      }
-    }
-  }
 </script>

 <style lang="less" scoped></style>
--- a/src/views/daxpay/admin/order/transfer/TransferOrder.api.ts
+++ b/src/views/daxpay/admin/order/transfer/TransferOrder.api.ts
@@ -1,6 +1,7 @@
 import { defHttp } from '@/utils/http/axios'
 import { PageResult, Result } from '#/axios'
-import { BaseEntity } from '#/web'
+import { MchEntity} from '#/web'
+import { TransferStatusEnum } from '@/enums/daxpay/TradeStatusEnum'

 /**
 * 分页
@@ -45,19 +46,29 @@ export function transfer(params) {
 /**
 * 转账信息同步
 */
-export function syncByTransferNo(transferNo) {
+export function syncByTransferNo(id) {
  return defHttp.post<Result<void>>({
-    url: '/order/transfer/syncByTransferNo',
-    params: { transferNo },
+    url: '/order/transfer/sync',
+    params: { id },
  })
 }

 /**
 * 转账重试
 */
-export function resetTransfer(id) {
+export function retryTransfer(id) {
  return defHttp.post<Result<void>>({
-    url: '/order/transfer/resetTransfer',
+    url: '/order/transfer/retry',
+    params: { id },
+  })
+}
+
+/**
+ * 关闭转账订单
+ */
+export function closeTransfer(id) {
+  return defHttp.post<Result<void>>({
+    url: '/order/transfer/close',
    params: { id },
  })
 }
@@ -72,10 +83,30 @@ export function getTotalAmount(param) {
  })
 }

+/**
+ * 显示样式优化
+ */
+export function cellStyle({ row, column }) {
+  if (column.field == 'status') {
+    if (row.status == TransferStatusEnum.SUCCESS) {
+      return { color: 'green' }
+    }
+    if (row.status == TransferStatusEnum.FAIL) {
+      return { color: 'red' }
+    }
+    if (row.status == TransferStatusEnum.PROGRESS) {
+      return { color: 'orange' }
+    }
+    if (row.status == TransferStatusEnum.CLOSE) {
+      return { color: 'gray' }
+    }
+  }
+}
+
 /**
 * 转账记录
 */
-export interface TransferOrder extends BaseEntity {
+export interface TransferOrder extends MchEntity {
  // 商户转账号
  bizTransferNo?: string
  // 转账号
@@ -100,8 +131,8 @@ export interface TransferOrder extends BaseEntity {
  payeeName?: string
  // 状态
  status?: string
-  // 成功时间
-  successTime?: string
+  // 完成时间
+  finishTime?: string
  // 异步通知地址
  notifyUrl?: string
  // 商户扩展参数
--- a/src/views/daxpay/admin/order/transfer/TransferOrderInfo.vue
+++ b/src/views/daxpay/admin/order/transfer/TransferOrderInfo.vue
@@ -33,17 +33,17 @@
      <a-descriptions-item label="收款人姓名" :span="2">
        {{ order.payeeName || '空' }}
      </a-descriptions-item>
-      <a-descriptions-item label="收款人账号" :span="2">
+      <a-descriptions-item label="收款人账号" :span="4">
        {{ order.payeeAccount }}
      </a-descriptions-item>
      <a-descriptions-item label="状态" :span="2">
        <a-tag>{{ dictConvert('transfer_status', order.status) || '空' }}</a-tag>
      </a-descriptions-item>
-      <a-descriptions-item label="转账时间" :span="2">
+      <a-descriptions-item label="创建时间" :span="2">
        {{ order.createTime }}
      </a-descriptions-item>
      <a-descriptions-item label="完成时间" :span="2">
-        {{ order.successTime }}
+        {{ order.finishTime }}
      </a-descriptions-item>
      <a-descriptions-item v-if="order.errorCode" label="错误码" :span="2">
        {{ order.errorCode }}
@@ -51,9 +51,18 @@
      <a-descriptions-item v-if="order.errorMsg" label="错误信息" :span="2">
        {{ order.errorMsg }}
      </a-descriptions-item>
-      <a-descriptions-item label="终端ip">
+      <a-descriptions-item label="终端ip" :span="4">
        {{ order.clientIp }}
      </a-descriptions-item>
+      <a-descriptions-item label="商户号" :span="2">
+        {{ order.mchNo }}
+      </a-descriptions-item>
+      <a-descriptions-item label="应用AppId" :span="2">
+        {{ order.appId }}
+      </a-descriptions-item>
+      <a-descriptions-item label="商户扩展参数" :span="4">
+        {{ order.attach || '无' }}
+      </a-descriptions-item>
    </a-descriptions>
    <template #footer>
      <a-button key="cancel" @click="handleCancel">取消</a-button>
--- a/src/views/daxpay/admin/order/transfer/TransferOrderList.vue
+++ b/src/views/daxpay/admin/order/transfer/TransferOrderList.vue
@@ -22,6 +22,7 @@
          height="auto"
          row-id="id"
          ref="xTable"
+          :cell-style="cellStyle"
          :sort-config="{ remote: true, trigger: 'cell' }"
          :data="pagination.records"
          :loading="loading"
@@ -39,7 +40,7 @@
          <vxe-column field="title" title="标题" :min-width="160" />
          <vxe-column field="channel" title="转账通道" :min-width="120">
            <template #default="{ row }">
-              {{ dictConvert('PayChannel', row.channel) }}
+              {{ dictConvert('channel', row.channel) }}
            </template>
          </vxe-column>
          <vxe-column field="amount" title="金额(元)" :min-width="140">
@@ -49,18 +50,42 @@
          </vxe-column>
          <vxe-column field="status" title="状态" :min-width="80">
            <template #default="{ row }">
-              {{ dictConvert('TransferStatus', row.status) }}
+              {{ dictConvert('transfer_status', row.status) }}
            </template>
          </vxe-column>
          <vxe-column field="reason" title="转账原因" :min-width="160" />
          <vxe-column field="createTime" title="创建时间" sortable :min-width="230" />
-          <vxe-column fixed="right" width="150" :showOverflow="false" title="操作">
+          <vxe-column fixed="right" :width="120" :showOverflow="false" title="操作">
            <template #default="{ row }">
              <a-link @click="show(row)">查看</a-link>
              <a-divider type="vertical" />
-              <a-link @click="sync(row)">同步</a-link>
-              <a-divider type="vertical" />
-              <a-link @click="reset(row)">重试</a-link>
+              <a-dropdown>
+                <a>
+                  更多
+                  <icon icon="ant-design:down-outlined" :size="12" />
+                </a>
+                <template #overlay>
+                  <a-menu>
+                    <a-menu-item
+                      v-if="
+                        [TransferStatusEnum.FAIL, TransferStatusEnum.PROGRESS].includes(row.status)
+                      "
+                    >
+                      <a-link @click="sync(row)">同步</a-link>
+                    </a-menu-item>
+                    <a-menu-item
+                      v-if="
+                        [TransferStatusEnum.FAIL, TransferStatusEnum.PROGRESS].includes(row.status)
+                      "
+                    >
+                      <a-link @click="reset(row)">重试</a-link>
+                    </a-menu-item>
+                    <a-menu-item v-if="[TransferStatusEnum.FAIL].includes(row.status)">
+                      <a-link @click="closeOrder(row)" danger>关闭</a-link>
+                    </a-menu-item>
+                  </a-menu>
+                </template>
+              </a-dropdown>
            </template>
          </vxe-column>
        </vxe-table>
@@ -80,7 +105,14 @@

 <script lang="ts" setup>
  import { computed, onMounted, ref } from 'vue'
-  import { getTotalAmount, page, resetTransfer, syncByTransferNo } from './TransferOrder.api'
+  import {
+    closeTransfer,
+    getTotalAmount,
+    page,
+    retryTransfer,
+    syncByTransferNo,
+    cellStyle
+  } from './TransferOrder.api'
  import useTablePage from '@/hooks/bootx/useTablePage'
  import TransferOrderInfo from './TransferOrderInfo.vue'
  import { VxeTable, VxeTableInstance, VxeToolbar, VxeToolbarInstance } from 'vxe-table'
@@ -90,6 +122,8 @@
  import { useDict } from '@/hooks/bootx/useDict'
  import { LabeledValue } from 'ant-design-vue/lib/select'
  import ALink from '/@/components/Link/Link.vue'
+  import { TransferStatusEnum } from '@/enums/daxpay/TradeStatusEnum'
+  import { Icon } from '@/components/Icon'

  // 使用hooks
  const {
@@ -162,7 +196,9 @@
    }).then(({ data }) => {
      pageQueryResHandel(data)
    })
-    // 汇总数据
+    /**
+     * 汇总数据
+     */
    getTotalAmount({
      ...model.queryParam,
    }).then(({ data }) => {
@@ -196,16 +232,33 @@
    createConfirm({
      iconType: 'warning',
      title: '警告',
-      content: '是否同步退款信息',
+      content: '是否重新发起转账请求信息',
      onOk: () => {
        loading.value = true
-        resetTransfer(record.id).then(() => {
+        retryTransfer(record.id).then(() => {
          createMessage.success('提交成功')
          queryPage()
        })
      },
    })
-    createMessage.warn('下版本支持...')
+  }
+
+  /**
+   * 关闭转账订单
+   */
+  function closeOrder(record) {
+    createConfirm({
+      iconType: 'warning',
+      title: '警告',
+      content: '请确定该转账订单处理失败并处理完成！',
+      onOk: () => {
+        loading.value = true
+        closeTransfer(record.id).then(() => {
+          createMessage.success('关闭成功')
+          queryPage()
+        })
+      },
+    })
  }

  /**
--- a/src/views/daxpay/admin/record/callback/TradeCallbackRecord.api.ts
+++ b/src/views/daxpay/admin/record/callback/TradeCallbackRecord.api.ts
@@ -1,6 +1,7 @@
 import { defHttp } from '@/utils/http/axios'
 import { PageResult, Result } from '#/axios'
 import { MchEntity } from '#/web'
+import { CallbackStatusEnum } from '@/enums/daxpay/TradeStatusEnum'

 /**
 * 分页
@@ -22,6 +23,27 @@ export function get(id) {
  })
 }

+/**
+ * 显示样式优化
+ */
+export function cellStyle({ row, column }) {
+  // 支付状态
+  if (column.field == 'status') {
+    if (row.status == CallbackStatusEnum.SUCCESS) {
+      return { color: 'green' }
+    }
+    if (row.status == CallbackStatusEnum.FAIL || row.status == CallbackStatusEnum.EXCEPTION) {
+      return { color: 'red' }
+    }
+    if (row.status == CallbackStatusEnum.NOT_FOUND) {
+      return { color: 'orange' }
+    }
+    if (row.status == CallbackStatusEnum.IGNORE) {
+      return { color: 'gray' }
+    }
+  }
+}
+
 /**
 * 支付回调记录
 */
--- a/src/views/daxpay/admin/record/callback/TradeCallbackRecordInfo.vue
+++ b/src/views/daxpay/admin/record/callback/TradeCallbackRecordInfo.vue
@@ -17,13 +17,13 @@
          {{ form.outTradeNo }}
        </a-descriptions-item>
        <a-descriptions-item label="支付通道" :span="2">
-          <a-tag>{{ dictConvert('PayChannel', form.channel) || '无' }}</a-tag>
+          <a-tag>{{ dictConvert('channel', form.channel) || '无' }}</a-tag>
        </a-descriptions-item>
        <a-descriptions-item label="回调类型" :span="2">
-          <a-tag>{{ dictConvert('PaymentType', form.callbackType) || '无' }}</a-tag>
+          <a-tag>{{ dictConvert('trade_type', form.callbackType) || '无' }}</a-tag>
        </a-descriptions-item>
-        <a-descriptions-item label="状态" :span="2">
-          {{ dictConvert('PayCallbackStatus', form.status) || '无' }}
+        <a-descriptions-item label="处理状态" :span="2">
+          {{ dictConvert('callback_status', form.status) || '无' }}
        </a-descriptions-item>
        <a-descriptions-item label="通知时间">
          {{ form.createTime }}
--- a/src/views/daxpay/admin/record/callback/TradeCallbackRecordList.vue
+++ b/src/views/daxpay/admin/record/callback/TradeCallbackRecordList.vue
@@ -15,6 +15,7 @@
          height="auto"
          row-id="id"
          ref="xTable"
+          :cell-style="cellStyle"
          :data="pagination.records"
          :loading="loading"
          :sort-config="{ remote: true, trigger: 'cell' }"
@@ -30,17 +31,17 @@
          </vxe-column>
          <vxe-column field="channel" title="支付通道" :min-width="100">
            <template #default="{ row }">
-              <a-tag>{{ dictConvert('PayChannel', row.channel) || '无' }}</a-tag>
+              <a-tag>{{ dictConvert('channel', row.channel) || '无' }}</a-tag>
            </template>
          </vxe-column>
          <vxe-column field="callbackType" title="回调类型" :min-width="100">
            <template #default="{ row }">
-              <a-tag>{{ dictConvert('PaymentType', row.callbackType) || '无' }}</a-tag>
+              <a-tag>{{ dictConvert('trade_type', row.callbackType) || '无' }}</a-tag>
            </template>
          </vxe-column>
          <vxe-column field="status" title="处理状态" :min-width="100">
            <template #default="{ row }">
-              <a-tag>{{ dictConvert('PayCallbackStatus', row.status) || '无' }}</a-tag>
+              {{ dictConvert('callback_status', row.status) || '无' }}
            </template>
          </vxe-column>
          <vxe-column field="msg" title="提示信息" :min-width="250" />
@@ -71,7 +72,7 @@

 <script lang="ts" setup>
  import { computed, onMounted, ref } from 'vue'
-  import { page, TradeCallbackRecord } from './TradeCallbackRecord.api'
+  import { page, TradeCallbackRecord, cellStyle } from './TradeCallbackRecord.api'
  import useTablePage from '@/hooks/bootx/useTablePage'
  import { VxeTable, VxeTableInstance, VxeToolbarInstance } from 'vxe-table'
  import BQuery from '/@/components/Bootx/Query/BQuery.vue'
--- a/src/views/daxpay/admin/record/sync/TradeSyncRecordList.vue
+++ b/src/views/daxpay/admin/record/sync/TradeSyncRecordList.vue
@@ -21,7 +21,7 @@
          </template>
        </vxe-column>
        <vxe-column field="bizTradeNo" title="商户交易号" :min-width="230" />
-        <vxe-column field="outTradeNo" title="通道交易号" :min-width="230" />
+        <vxe-column field="outTradeNo" title="通道交易号" :min-width="250" />
        <vxe-column field="outTradeStatus" title="通道状态" :min-width="150" />
        <vxe-column field="type" title="同步类型" :min-width="120">
          <template #default="{ row }">
@@ -41,7 +41,7 @@
        </vxe-column>
        <vxe-column field="errorMsg" title="错误消息" :min-width="160" />
        <vxe-column field="createTime" title="同步时间" :min-width="160" />
-        <vxe-column fixed="right" :min-width="60" :showOverflow="false" title="操作">
+        <vxe-column fixed="right" :min-width="50" :showOverflow="false" title="操作">
          <template #default="{ row }">
            <span>
              <a-link @click="show(row)">查看</a-link>