From cfd30ec5ba7f67aee8fd2fd6fc9413f8a66b55ca Mon Sep 17 00:00:00 2001
From: yeg <1347747024@qq.com>
Date: 星期五, 18 九月 2026 12:56:25 +0800
Subject: [PATCH] fix(settlement): 结算记录页下发查询条件，切标签不再被过期响应覆盖
---
talent-card-admin/src/api/admin.ts | 4 ++--
talent-card-admin/src/views/MerchantSettlementView.vue | 35 +++++++++++++++++++++++++++++------
2 files changed, 31 insertions(+), 8 deletions(-)
diff --git a/talent-card-admin/src/api/admin.ts b/talent-card-admin/src/api/admin.ts
index ee1d938..8cf9759 100644
--- a/talent-card-admin/src/api/admin.ts
+++ b/talent-card-admin/src/api/admin.ts
@@ -111,8 +111,8 @@
endDate?: string
}
export function getMerchantSettlement(kind: 'onboardings' | 'bank-cards', params: MerchantSettlementQuery = {}) { return http.get<PageResult<any>, PageResult<any>>(`/api/admin/management/merchant-settlement/${kind}`, { params }) }
-/** 结算记录直接来自斗拱：按日期区间返回真实结算流水，用于监控每天自动结算了多少到银行卡。 */
-export function getMerchantSettlements(params: { beginDate?: string; endDate?: string; size?: number } = {}) {
+/** 结算记录直接来自斗拱：按结算日期区间返回真实结算流水，用于监控每天自动结算了多少到银行卡。 */
+export function getMerchantSettlements(params: { beginDate?: string; endDate?: string; size?: number; merchantName?: string; contactMobile?: string; merchantType?: string; status?: string } = {}) {
return http.get<{ records: Record<string, any>[]; total: number; failures: string[] }, { records: Record<string, any>[]; total: number; failures: string[] }>('/api/admin/management/merchant-settlement/settlements', { params })
}
export function getMerchantOnboardingDetail(id: number | string) { return http.get<Record<string, any>, Record<string, any>>(`/api/admin/management/merchant-settlement/onboardings/${id}`) }
diff --git a/talent-card-admin/src/views/MerchantSettlementView.vue b/talent-card-admin/src/views/MerchantSettlementView.vue
index 1d545c8..dfb98d3 100644
--- a/talent-card-admin/src/views/MerchantSettlementView.vue
+++ b/talent-card-admin/src/views/MerchantSettlementView.vue
@@ -32,9 +32,13 @@
]
const merchantTypes = ['餐饮服务', '住宿服务', '购房服务', '购车服务', '体检服务', '金融服务', '行政审批', '景区服务']
-// 结算记录直接来自斗拱，没有本地状态可选；进件与银行卡才按审核状态筛选。
+// 结算记录没有本地审核状态：它的「状态」是通道流水的结算状态（S/F/P），与表格那一列同一套取值。
const statusOptions = computed(() => kind.value === 'settlements'
- ? []
+ ? [
+ { value: 'S', label: '已结算' },
+ { value: 'F', label: '结算失败' },
+ { value: 'P', label: '处理中' },
+ ]
: [
{ value: 'pending', label: '待审核' },
{ value: 'approved', label: '已通过' },
@@ -81,17 +85,33 @@
return String(value).replace('T', ' ').replace(/\.\d+$/, '')
}
+/**
+ * 每次查询的序号。切 tab、改条件、翻页都会自增，只有最新那一次的结果允许写回表格。
+ *
+ * 结算记录要逐商户去问斗拱，是最慢的一次请求；先切到别的 tab 的话，它的响应会最后落地。
+ * 少了这道闸，它就会把已经切过去的那个 tab 的表格覆盖成结算流水——表头是进件/银行卡的列，
+ * 内容却是结算记录（连带分页总数也变成结算的条数）。
+ */
+let latestRequest = 0
+
async function load() {
+ const request = ++latestRequest
loading.value = true
try {
if (kind.value === 'settlements') {
- // 结算记录来自斗拱，按日期区间查询，没有分页与审核状态筛选。
- // 条数上限 50 是通道的硬限制：传更大的值通道会判基础参数校验失败，整页查不出流水。
+ // 结算记录来自斗拱，逐商户查询后合并；条数上限 50 是通道的硬限制，传更大的值通道会判
+ // 基础参数校验失败、整页查不出流水。商家、联系电话、商家类型送后端去筛商户（顺带少查几家），
+ // 状态是通道流水的结算状态，只能由后端在拿到流水后筛。
const result = await getMerchantSettlements({
beginDate: normalizeDate(filters.dateRange[0]),
endDate: normalizeDate(filters.dateRange[1]),
size: 50,
+ merchantName: filters.merchantName.trim() || undefined,
+ contactMobile: filters.contactMobile.trim() || undefined,
+ merchantType: filters.merchantType || undefined,
+ status: filters.status || undefined,
})
+ if (request !== latestRequest) return
rows.value = result.records || []
total.value = Number(result.total || 0)
failures.value = result.failures || []
@@ -107,11 +127,13 @@
startDate: filters.dateRange[0],
endDate: filters.dateRange[1],
})
+ if (request !== latestRequest) return
rows.value = result.records || []
total.value = Number(result.total || 0)
failures.value = []
} finally {
- loading.value = false
+ // 转圈只归最新那次请求管：过期的响应早早关掉它，会让仍在加载的那一页看起来已经加载完了。
+ if (request === latestRequest) loading.value = false
}
}
@@ -190,7 +212,8 @@
<el-form-item label="联系电话">
<el-input v-model="filters.contactMobile" clearable placeholder="请输入商家联系电话" />
</el-form-item>
- <el-form-item label="申请时间">
+ <!-- 同一个日期区间在两个 tab 里筛的是不同东西：进件/银行卡按申请时间，结算记录按结算日期。 -->
+ <el-form-item :label="kind === 'settlements' ? '结算日期' : '申请时间'">
<el-date-picker
v-model="filters.dateRange"
type="daterange"
--
Gitblit v1.7.1