ref 对账差异明细

src/views/payment/order/reconcile/diff/ReconcileDiffList.vue

@@ -1,144 +0,0 @@
-<template>
-  <basic-drawer forceRender v-bind="$attrs" title="差异明细" width="60%" :visible="visible" @close="visible = false">
-    <b-query :query-params="model.queryParam" :default-item-count="3" :fields="fields" @query="queryPage" @reset="resetQueryParams" />
-    <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="订单标题" min-width="120" />
-      <vxe-column field="orderType" title="订单类型" min-width="120">
-        <template #default="{ row }">
-          <a-tag>{{ dictConvert('ReconcileTrade', row.orderType) }}</a-tag>
-        </template>
-      </vxe-column>
-      <vxe-column field="diffType" title="差异类型" min-width="120">
-        <template #default="{ row }">
-          <a-tag>{{ dictConvert('ReconcileDiffType', row.diffType) }}</a-tag>
-        </template>
-      </vxe-column>
-      <vxe-column field="tradeNo" title="交易号" min-width="120" />
-      <vxe-column field="outOrderNo" title="外部交易号" min-width="170" />
-      <vxe-column field="amount" title="交易金额" sortable min-width="120">
-        <template #default="{ row }"> {{ row.amount ? (row.amount / 100).toFixed(2) : 0 }} </template>
-      </vxe-column>
-      <vxe-column field="outAmount" title="外部交易金额" sortable min-width="120">
-        <template #default="{ row }"> {{ row.outAmount ? (row.outAmount / 100).toFixed(2) : 0 }} </template>
-      </vxe-column>
-      <vxe-column field="tradeTime" title="交易时间" sortable min-width="150" />
-      <vxe-column fixed="right" width="100" :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"
-    />
-    <reconcile-diff-info ref="reconcileDiffInfo" />
-  </basic-drawer>
-</template>
-
-<script setup lang="ts">
-  import { computed, nextTick, onMounted } from 'vue'
-  import { $ref } from 'vue/macros'
-  import { page } from './ReconcileDiff.api'
-  import useTablePage from '/@/hooks/bootx/useTablePage'
-  import ReconcileDiffInfo from './ReconcileDiffInfo.vue'
-  import { VxeTable, VxeTableInstance, VxeToolbarInstance } from 'vxe-table'
-  import { useMessage } from '/@/hooks/web/useMessage'
-  import { LIST, QueryField, STRING } from '/@/components/Bootx/Query/Query'
-  import BasicDrawer from '/@/components/Drawer/src/BasicDrawer.vue'
-  import BQuery from '/@/components/Bootx/Query/BQuery.vue'
-  import { LabeledValue } from 'ant-design-vue/lib/select'
-  import { useDict } from '/@/hooks/bootx/useDict'
-  import { ReconcileDetail } from '/@/views/payment/order/reconcile/detail/ReconcileDetail.api'
-
-  // 使用hooks
-  const { handleTableChange, pageQueryResHandel, resetQueryParams, sortChange, pagination, pages, sortParam, model, loading } =
-    useTablePage(queryPage)
-  const { notification, createMessage } = useMessage()
-  const { dictDropDown, dictConvert } = useDict()
-
-  let orderTypeList = $ref<LabeledValue[]>([])
-  let diffTypeList = $ref<LabeledValue[]>([])
-
-  // 查询条件
-  const fields = computed(() => {
-    return [
-      { field: 'title', type: STRING, name: '订单名称', placeholder: '请输入订单名称' },
-      { field: 'orderType', type: LIST, name: '订单类型', placeholder: '请选择订单类型', selectList: orderTypeList },
-      { field: 'diffType', type: LIST, name: '差异类型', placeholder: '请选择差异类型', selectList: diffTypeList },
-      { field: 'orderId', type: STRING, name: '本地定单', placeholder: '请输入本地定单ID' },
-      { field: 'gatewayOrderNo', type: STRING, name: '外部订单号', placeholder: '请输入外部订单号' },
-    ] as QueryField[]
-  })
-  let visible = $ref(false)
-  let reconcileDetail = $ref<ReconcileDetail>()
-
-  const xTable = $ref<VxeTableInstance>()
-  const xToolbar = $ref<VxeToolbarInstance>()
-  const reconcileDiffInfo = $ref<any>()
-
-  nextTick(() => {
-    xTable?.connect(xToolbar as VxeToolbarInstance)
-  })
-
-  onMounted(() => {
-    initData()
-  })
-
-  /**
-   * 初始化基础数据
-   */
-  async function initData() {
-    orderTypeList = await dictDropDown('ReconcileTrade')
-    diffTypeList = await dictDropDown('ReconcileDiffType')
-  }
-  /**
-   * 入口
-   */
-  function init(record: ReconcileDetail) {
-    visible = true
-    reconcileDetail = record
-    model.queryParam = {}
-    xTable?.clearSort()
-    queryPage()
-  }
-
-  /**
-   * 分页查询
-   */
-  function queryPage() {
-    loading.value = true
-    page({
-      ...model.queryParam,
-      ...pages,
-      ...sortParam,
-      reconcileId: reconcileDetail?.id,
-    }).then(({ data }) => {
-      pageQueryResHandel(data)
-    })
-  }
-  /**
-   * 查看
-   */
-  function show(record) {
-    reconcileDiffInfo.init(record)
-  }
-  defineExpose({
-    init,
-  })
-</script>
-
-<style scoped lang="less"></style>

src/views/payment/reconcile/diff/ReconcileDiff.api.ts

@@ -6,7 +6,7 @@ import { BaseEntity } from '/#/web'
  * 对账差异分页
  */
 export function page(params) {
-  return defHttp.get<Result<PageResult<ReconcileRecord>>>({
+  return defHttp.get<Result<PageResult<ReconcileDiff>>>({
     url: '/order/reconcile/diff/page',
     params,
   })
@@ -16,7 +16,7 @@ export function page(params) {
  * 对账差异详情
  */
 export function get(id: string) {
-  return defHttp.get<Result<ReconcileRecord>>({
+  return defHttp.get<Result<ReconcileDiff>>({
     url: '/order/reconcile/diff/findById',
     params: { id },
   })
@@ -25,29 +25,37 @@ export function get(id: string) {
 /**
  * 通用支付对账记录
  */
-export interface ReconcileRecord extends BaseEntity {
-  // 关联对账订单ID
-  recordOrderId?: string
-  // 交易类型
-  type?: string
-  // 订单id
-  paymentId?: string
-  // 订单id
-  refundId?: string
-  // 外部订单号
-  gatewayOrderNo?: string
-  // 交易金额
-  amount?: string
+export interface ReconcileDiff extends BaseEntity {
   // 商品名称
   title?: string
+  // 关联对账订单ID
+  recordOrderId?: string
+  // 对账号
+  reconcileNo?: string
+  // 对账日期
+  reconcileDate?: string
+  // 交易类型
+  tradeType?: string
+  // 本地交易号
+  tradeNo?: string
+  // 外部交易号
+  outTradeNo?: string
+  // 交易时间
+  tradeTime?: string
+  // 交易金额
+  amount?: number
+  // 外部交易金额
+  outAmount?: number
+  // 差异类型
+  diffType?: string
   // 差异内容
-  diffs?: ReconcileDiff[]
+  diffs?: DiffInfo[]
 }
 
 /**
  * 差异内容
  */
-export interface ReconcileDiff {
+export interface DiffInfo {
   // 字段名
   fieldName?: string
   // 本地订单字段值

src/views/payment/reconcile/diff/ReconcileDiffInfo.vue

@@ -12,30 +12,33 @@
       <a-descriptions-item label="订单标题">
         {{ form.title }}
       </a-descriptions-item>
+      <a-descriptions-item label="对账号">
+        {{ form.reconcileNo }}
+      </a-descriptions-item>
+      <a-descriptions-item label="对账日期">
+        {{ form.reconcileDate }}
+      </a-descriptions-item>
+      <a-descriptions-item label="本地交易号">
+        {{ form.tradeNo }}
+      </a-descriptions-item>
+      <a-descriptions-item label="外部交易号">
+        {{ form.outTradeNo }}
+      </a-descriptions-item>
+      <a-descriptions-item label="外部交易号">
+        {{ form.tradeTime }}
+      </a-descriptions-item>
       <a-descriptions-item label="交易金额">
-        {{ form.amount }}
+        {{ form.amount ? (form.amount / 100).toFixed(2) : '无' }}
       </a-descriptions-item>
-      <a-descriptions-item label="对账单ID">
-        {{ form.recordId }}
+      <a-descriptions-item label="外部交易金额">
+        {{ form.outAmount ? (form.outAmount / 100).toFixed(2) : '无' }}
       </a-descriptions-item>
-      <a-descriptions-item v-if="form.detailId" label="对账单明细ID">
-        {{ form.detailId }}
-      </a-descriptions-item>
-      <a-descriptions-item label="本地订单ID">
-        {{ form.orderId }}
-      </a-descriptions-item>
-      <a-descriptions-item v-if="form.gatewayOrderNo" label="外部订单号">
-        {{ form.gatewayOrderNo }}
-      </a-descriptions-item>
-      <a-descriptions-item label="订单类型">
-        <a-tag>{{ dictConvert('ReconcileTrade', form.orderType) }}</a-tag>
+      <a-descriptions-item label="交易类型">
+        <a-tag>{{ dictConvert('ReconcileTrade', form.tradeType) }}</a-tag>
       </a-descriptions-item>
       <a-descriptions-item label="差异类型">
         <a-tag>{{ dictConvert('ReconcileDiffType', form.diffType) }}</a-tag>
       </a-descriptions-item>
-      <a-descriptions-item label="订单时间">
-        {{ form.orderTime }}
-      </a-descriptions-item>
       <template v-if="form.diffs">
         <a-descriptions-item :label="`${item.fieldName}[差异]`" :key="item" v-for="item in form.diffs">
           <a-tag>本地</a-tag> : {{ item.localValue }}<br /><a-tag>远程</a-tag> : {{ item.gatewayValue }}
@@ -55,12 +58,11 @@
   import useFormEdit from '/@/hooks/bootx/useFormEdit'
   import { BasicModal } from '/@/components/Modal'
   import { useDict } from '/@/hooks/bootx/useDict'
-  import { get } from './ReconcileDiff.api'
-  import { ReconcileOrder } from '/@/views/payment/order/reconcile/order/ReconcileOrder.api'
+  import { get, ReconcileDiff } from './ReconcileDiff.api'
   const { handleCancel, confirmLoading, visible, showable } = useFormEdit()
   const { dictConvert } = useDict()
   // 表单
-  let form = $ref<ReconcileOrder>({})
+  let form = $ref<ReconcileDiff>({})
 
   // 事件
   const emits = defineEmits(['ok'])

src/views/payment/reconcile/diff/ReconcileDiffList.vue

@@ -0,0 +1,153 @@
+<template>
+  <div>
+    <div class="m-3 p-3 pt-5 bg-white">
+      <b-query :query-params="model.queryParam" :default-item-count="3" :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="订单标题" min-width="120" />
+        <vxe-column field="tradeType" title="交易类型" min-width="120">
+          <template #default="{ row }">
+            <a-tag>{{ dictConvert('PaymentType', row.tradeType) }}</a-tag>
+          </template>
+        </vxe-column>
+        <vxe-column field="diffType" title="差异类型" min-width="120">
+          <template #default="{ row }">
+            <a-tag>{{ dictConvert('ReconcileDiffType', row.diffType) }}</a-tag>
+          </template>
+        </vxe-column>
+        <vxe-column field="reconcileDate" title="对账日期" sortable min-width="120" />
+        <vxe-column field="tradeNo" title="交易号" min-width="180" />
+        <vxe-column field="outTradeNo" title="外部交易号" min-width="220" />
+        <vxe-column field="amount" title="交易金额(元)" sortable min-width="120">
+          <template #default="{ row }"> {{ row.amount ? (row.amount / 100).toFixed(2) : '无' }} </template>
+        </vxe-column>
+        <vxe-column field="outAmount" title="外部交易金额(元)" sortable min-width="120">
+          <template #default="{ row }"> {{ row.outAmount ? (row.outAmount / 100).toFixed(2) : '无' }} </template>
+        </vxe-column>
+        <vxe-column field="tradeTime" title="交易时间" sortable min-width="150" />
+        <vxe-column field="reconcileNo" title="对账单号" min-width="170" />
+        <vxe-column field="channel" title="通道" min-width="120">
+          <template #default="{ row }">
+            <a-tag>{{ dictConvert('PayChannel', row.channel) }}</a-tag>
+          </template>
+        </vxe-column>
+        <vxe-column fixed="right" width="100" :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"
+      />
+    </div>
+    <reconcile-diff-info ref="reconcileDiffInfo" />
+  </div>
+</template>
+
+<script setup lang="ts">
+  import { computed, nextTick, onMounted } from 'vue'
+  import { $ref } from 'vue/macros'
+  import { page } from './ReconcileDiff.api'
+  import useTablePage from '/@/hooks/bootx/useTablePage'
+  import ReconcileDiffInfo from './ReconcileDiffInfo.vue'
+  import { VxeTable, VxeTableInstance, VxeToolbarInstance } from 'vxe-table'
+  import { useMessage } from '/@/hooks/web/useMessage'
+  import { LIST, QueryField, STRING } from '/@/components/Bootx/Query/Query'
+  import BQuery from '/@/components/Bootx/Query/BQuery.vue'
+  import { LabeledValue } from 'ant-design-vue/lib/select'
+  import { useDict } from '/@/hooks/bootx/useDict'
+
+  // 使用hooks
+  const { handleTableChange, pageQueryResHandel, resetQueryParams, sortChange, pagination, pages, sortParam, model, loading } =
+    useTablePage(queryPage)
+  const { notification, createMessage } = useMessage()
+  const { dictDropDown, dictConvert } = useDict()
+
+  let tradeTypeList = $ref<LabeledValue[]>([])
+  let diffTypeList = $ref<LabeledValue[]>([])
+  let payChannelList = $ref<LabeledValue[]>([])
+
+  // 查询条件
+  const fields = computed(() => {
+    return [
+      { field: 'reconcileNo', type: STRING, name: '对账单号', placeholder: '请输入对账单号' },
+      { field: 'title', type: STRING, name: '订单名称', placeholder: '请输入订单名称' },
+      { field: 'tradeType', type: LIST, name: '交易类型', placeholder: '请选择交易类型', selectList: tradeTypeList },
+      { field: 'diffType', type: LIST, name: '差异类型', placeholder: '请选择差异类型', selectList: diffTypeList },
+      { field: 'channel', type: LIST, name: '对账通道', placeholder: '请选择对账', selectList: payChannelList },
+      { field: 'tradeNo', type: STRING, name: '本地交易号', placeholder: '请输入本地交易号' },
+      { field: 'outOrderNo', type: STRING, name: '外部交易号', placeholder: '请输入外部交易号' },
+    ] as QueryField[]
+  })
+
+  const xTable = $ref<VxeTableInstance>()
+  const xToolbar = $ref<VxeToolbarInstance>()
+  const reconcileDiffInfo = $ref<any>()
+
+  nextTick(() => {
+    xTable?.connect(xToolbar as VxeToolbarInstance)
+  })
+
+  onMounted(() => {
+    initData()
+    init()
+  })
+
+  /**
+   * 初始化基础数据
+   */
+  async function initData() {
+    tradeTypeList = await dictDropDown('PaymentType')
+    diffTypeList = await dictDropDown('ReconcileDiffType')
+    payChannelList = await dictDropDown('PayChannel')
+  }
+  /**
+   * 入口
+   */
+  function init() {
+    model.queryParam = {}
+    xTable?.clearSort()
+    queryPage()
+  }
+
+  /**
+   * 分页查询
+   */
+  function queryPage() {
+    loading.value = true
+    page({
+      ...model.queryParam,
+      ...pages,
+      ...sortParam,
+    }).then(({ data }) => {
+      pageQueryResHandel(data)
+    })
+  }
+  /**
+   * 查看
+   */
+  function show(record) {
+    reconcileDiffInfo.init(record)
+  }
+  defineExpose({
+    init,
+  })
+</script>
+
+<style scoped lang="less"></style>

src/views/payment/reconcile/order/ReconcileOrderList.vue

@@ -52,7 +52,7 @@
         <vxe-column field="compare" title="比对">
           <template #default="{ row }">
             <a-tag v-if="row.compare" color="green">已比对</a-tag>
-            <a-link v-else :disabled="!row.down" color="red" @click="compareOrder(row)">比对</a-link>
+            <a-link v-else :disabled="!row.downOrUpload" color="red" @click="compareOrder(row)">比对</a-link>
           </template>
         </vxe-column>
         <vxe-column field="result" title="对账结果">
@@ -99,7 +99,6 @@
     </div>
     <reconcile-order-create ref="reconcileOrderCreate" @ok="queryPage" />
     <reconcile-order-info ref="reconcileOrderInfo" />
-    <reconcile-diff-list ref="reconcileDiffList" />
   </div>
 </template>
 <script setup lang="ts">
@@ -115,7 +114,6 @@
   import ReconcileOrderInfo from './ReconcileOrderInfo.vue'
   import ReconcileOrderCreate from './ReconcileOrderCreate.vue'
   import ALink from '/@/components/Link/Link.vue'
-  import ReconcileDiffList from '../diff/ReconcileDiffList.vue'
   import { useUpload } from '/@/hooks/bootx/useUpload'
   import { useUserStoreWithOut } from '/@/store/modules/user'
   import { getAppEnvConfig } from '/@/utils/env'
@@ -160,7 +158,6 @@
   const xToolbar = $ref<VxeToolbarInstance>()
   const reconcileOrderCreate = $ref<any>()
   const reconcileOrderInfo = $ref<any>()
-  const reconcileDiffList = $ref<any>()
 
   onMounted(() => {
     initData()