feat 云闪付支付记录

src/views/payment/channel/union/record/UnionPayRecord.api.ts

@@ -0,0 +1,43 @@
+import { defHttp } from '/@/utils/http/axios'
+import { Result, PageResult } from '/#/axios'
+import { BaseEntity } from '/#/web'
+
+/**
+ * 分页
+ */
+export function page(params) {
+ return defHttp.get<Result<PageResult<UnionPayRecord>>>({
+ url: '/union/pay/record/page',
+ params,
+ })
+}
+
+/**
+ * 获取详情
+ */
+export function get(id) {
+ return defHttp.get<Result<UnionPayRecord>>({
+ url: '/union/pay/record/findById',
+ params: { id },
+ })
+}
+
+/**
+ * 记录
+ */
+export interface UnionPayRecord extends BaseEntity {
+ // 标题
+ title?: string
+ // 业务类型
+ type?: string
+ // 金额
+ amount?: string
+ // 交易订单号
+ orderId?: string
+ // 交易订单号
+ gatewayOrderNo?: string
+ // 终端ip
+ ip?: string
+ // 网关时间
+ gatewayTime?: string
+}

src/views/payment/channel/union/record/UnionPayRecordInfo.vue

@@ -0,0 +1,90 @@
+<template>
+ <basic-modal
+ title="查看"
+ v-bind="$attrs"
+ :loading="confirmLoading"
+ :width="modalWidth"
+ :visible="visible"
+ :mask-closable="showable"
+ @cancel="handleCancel"
+ >
+ <a-spin :spinning="confirmLoading">
+ <a-descriptions bordered title="" :column="{ md: 1, sm: 1, xs: 1 }">
+ <a-descriptions-item label="标题">
+ {{ unionPayRecord.title }}
+ </a-descriptions-item>
+ <a-descriptions-item label="金额(分)">
+ {{ unionPayRecord.amount }}
+ </a-descriptions-item>
+ <a-descriptions-item label="本地订单号">
+ {{ unionPayRecord.orderId }}
+ </a-descriptions-item>
+ <a-descriptions-item label="网关订单号">
+ {{ unionPayRecord.gatewayOrderNo }}
+ </a-descriptions-item>
+ <a-descriptions-item label="业务类型">
+ <a-tag>{{ dictConvert('unionPayRecordType', unionPayRecord.type) }}</a-tag>
+ </a-descriptions-item>
+ <a-descriptions-item label="网关时间">
+ {{ unionPayRecord.gatewayTime }}
+ </a-descriptions-item>
+ <a-descriptions-item label="记录时间">
+ {{ unionPayRecord.createTime }}
+ </a-descriptions-item>
+ </a-descriptions>
+ </a-spin>
+ <template #footer>
+ <a-button key="cancel" @click="handleCancel">取消</a-button>
+ </template>
+ </basic-modal>
+</template>
+
+<script setup lang="ts">
+ import { get, UnionPayRecord } from './UnionPayRecord.api'
+ import { $ref } from 'vue/macros'
+ import { BasicModal } from '/@/components/Modal'
+ import useFormEdit from '/@/hooks/bootx/useFormEdit'
+ import { useDict } from '/@/hooks/bootx/useDict'
+
+ const {
+ initFormEditType,
+ handleCancel,
+ search,
+ labelCol,
+ wrapperCol,
+ modalWidth,
+ title,
+ confirmLoading,
+ visible,
+ editable,
+ showable,
+ formEditType,
+ } = useFormEdit()
+ const { dictConvert } = useDict()
+
+ let loading = $ref(false)
+ let unionPayRecord = $ref<UnionPayRecord>({})
+
+ /**
+ * 入口
+ */
+ function init(record: UnionPayRecord) {
+ visible.value = true
+ unionPayRecord = record
+ initData(record.id as string)
+ }
+
+ /**
+ * 初始化数据
+ */
+ async function initData(alipayId) {
+ loading = true
+ const { data } = await get(alipayId)
+ loading = false
+ unionPayRecord = data
+ }
+
+ defineExpose({ init })
+</script>
+
+<style scoped lang="less"></style>

src/views/payment/channel/union/record/UnionPayRecordList.vue

@@ -0,0 +1,110 @@
+<template>
+ <div>
+ <div class="m-3 p-3 pt-5 bg-white">
+ <b-query :query-params="model.queryParam" :fields="fields" @query="queryPage" @reset="resetQueryParams" />
+ </div>
+ <div class="m-3 p-3 bg-white">
+ <vxe-toolbar ref="xToolbar" custom :refresh="{ queryMethod: queryPage }" />
+ <vxe-table
+ row-id="id"
+ ref="xTable"
+ :data="pagination.records"
+ :loading="loading"
+ :sort-config="{ remote: true, trigger: 'cell' }"
+ @sort-change="sortChange"
+ >
+ <vxe-column type="seq" title="序号" width="60" />
+ <vxe-column field="title" title="标题" />
+ <vxe-column field="type" title="类型">
+ <template #default="{ row }">
+ <a-tag>{{ dictConvert('UnionPayRecordType', row.type) }}</a-tag>
+ </template>
+ </vxe-column>
+ <vxe-column field="amount" title="金额" />
+ <vxe-column field="orderId" title="本地订单ID" width="170" />
+ <vxe-column field="gatewayOrderNo" title="网关订单号" width="170" />
+ <vxe-column field="gatewayTime" title="网关时间" sortable />
+ <vxe-column fixed="right" width="50" :showOverflow="false" title="操作">
+ <template #default="{ row }">
+ <a-link @click="show(row)">查看</a-link>
+ </template>
+ </vxe-column>
+ </vxe-table>
+ <vxe-pager
+ size="medium"
+ :loading="loading"
+ :current-page="pagination.current"
+ :page-size="pagination.size"
+ :total="pagination.total"
+ @page-change="handleTableChange"
+ />
+ <union-pay-record-info ref="unionPayRecordInfo" />
+ </div>
+ </div>
+</template>
+
+<script setup lang="ts">
+ import { onMounted } from 'vue'
+ import { $ref } from 'vue/macros'
+ import { page } from './UnionPayRecord.api'
+ import useTablePage from '/@/hooks/bootx/useTablePage'
+ import { VxeTable, VxeTableInstance, VxeToolbarInstance } from 'vxe-table'
+ import { useMessage } from '/@/hooks/web/useMessage'
+ import { useDict } from '/@/hooks/bootx/useDict'
+ import ALink from '/@/components/Link/Link.vue'
+ import BQuery from '/@/components/Bootx/Query/BQuery.vue'
+ import { STRING } from '/@/components/Bootx/Query/Query'
+ import UnionPayRecordInfo from './UnionPayRecordInfo.vue'
+
+ // 使用hooks
+ const { handleTableChange, pageQueryResHandel, resetQueryParams, pagination, sortChange, sortParam, pages, model, loading } =
+ useTablePage(queryPage)
+ const { notification, createMessage, createConfirm } = useMessage()
+ const { dictConvert, dictDropDown } = useDict()
+
+ let unionPayRecordInfo = $ref<any>()
+
+ const xTable = $ref<VxeTableInstance>()
+ const xToolbar = $ref<VxeToolbarInstance>()
+
+ const fields = [
+ { field: 'title', type: STRING, name: '标题', placeholder: '请输入标题' },
+ { field: 'orderId', type: STRING, name: '本地订单ID', placeholder: '请输入完整本地订单ID' },
+ { field: 'gatewayOrderNo', type: STRING, name: '网关订单号', placeholder: '请输入完整网关订单号' },
+ ]
+ onMounted(() => {
+ vxeBind()
+ queryPage()
+ })
+
+ /**
+ * 绑定
+ */
+ function vxeBind() {
+ xTable?.connect(xToolbar as VxeToolbarInstance)
+ }
+
+ /**
+ * 查看
+ */
+ function show(record) {
+ unionPayRecordInfo.init(record)
+ }
+
+ /**
+ * 分页查询
+ */
+ function queryPage() {
+ loading.value = true
+ page({
+ ...model.queryParam,
+ ...pages,
+ ...sortParam,
+ }).then(({ data }) => {
+ pageQueryResHandel(data)
+ })
+ return Promise.resolve()
+ }
+</script>
+
+<style scoped lang="less"></style>