feat:余额排序

src/api/wallet/wallet-manage.ts

@@ -52,6 +52,7 @@ export function qbTotal(data: any, signal?: AbortSignal) {
 	})
 }
 
+/** 查询月末钱包余额；排序参数随分页参数传入 URL，由后端完成全量排序后分页。 */
 export function fetchListJoinQb(query: any) {
 	return request({
 		url: "/wallet/wallet-manage/page-join-qb",
@@ -59,6 +60,8 @@ export function fetchListJoinQb(query: any) {
 		params: {
 			current: query.current,
 			size: query.size,
+			ascs: query.ascs || undefined,
+			descs: query.descs || undefined,
 		},
 		data: query,
 	})

src/views/wallet/wallet-qb/index.vue

@@ -38,7 +38,7 @@
 					</el-row>
 					<el-table :data="state.dataList" v-loading="state.loading" border :summary-method="getSummaries"
 						show-summary :cell-style="tableStyle.cellStyle" :header-cell-style="tableStyle.headerCellStyle"
-						@selection-change="selectionChangHandle" @sort-change="sortChangeHandle">
+						@selection-change="selectionChangHandle" @sort-change="handleBalanceSortChange">
 						<el-table-column type="index" label="#" width="60" />
 						<el-table-column prop="username" width="120" label="用户" />
 						<el-table-column prop="userAvatar" width="80" label="头像">
@@ -59,7 +59,7 @@
 							</template>
 						</el-table-column>
 						<el-table-column prop="cardNumber" width="150" label="饭卡卡号" />
-						<el-table-column prop="balance" align="center" width="100" label="余额">
+						<el-table-column prop="balance" align="center" width="100" label="余额" sortable="custom">
 							<template #default="{ row }">
 								<div class="color-primary">{{ displayPrice(row.balance) }}</div>
 							</template>
@@ -78,7 +78,7 @@
 						</el-table-column>
 					</el-table>
 					<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle"
-						v-bind="state.pagination" />
+						v-bind="state.pagination" :disabled="Boolean(state.loading)" />
 				</template>
 			</DraggableDepTree>
 		</div>
@@ -150,7 +150,15 @@ const state: BasicTableProps = reactive<BasicTableProps>({
 })
 
 //  table hook
-const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, tableStyle } = useTable(state)
+const { getDataList, currentChangeHandle, sizeChangeHandle, tableStyle } = useTable(state)
+
+/** 按所选月份的全部筛选结果排序；切换或取消排序时回到首页，翻页继续沿用当前方向。 */
+const handleBalanceSortChange = ({ prop, order }: { prop?: string; order: "ascending" | "descending" | null }) => {
+	// 每次替换单列排序条件，避免重复点击累积字段；月末余额由后端先排序再分页。
+	state.ascs = prop === "balance" && order === "ascending" ? ["balance"] : []
+	state.descs = prop === "balance" && order === "descending" ? ["balance"] : []
+	return getDataList()
+}
 
 // 清空搜索条件
 const resetQuery = () => {