修改

src/views/wallet/wallet-recharge-apply/preview-excel.vue

@@ -3,17 +3,17 @@
 		<div class="layout-padding-auto layout-padding-view">
 			<el-row>
 				<div class="mb8" style="width: 100%">
-					<right-toolbar
-						class="ml10 mr20"
-						style="float: right"
-						:search="false"
-						@queryTable="getList"
-						:export="true"
-						@exportExcel="exportExcel"
-					/>
+					<right-toolbar class="ml10 mr20" style="float: right" :search="false" @queryTable="getList" />
 				</div>
 			</el-row>
-			<el-table :data="data.list" v-loading="state.loading" border :header-cell-style="tableStyle.headerCellStyle">
+			<el-table
+				:data="data.list"
+				v-loading="state.loading"
+				border
+				:header-cell-style="tableStyle.headerCellStyle"
+				show-summary
+				:summary-method="getSummaries"
+			>
 				<el-table-column type="index" label="#" align="center" width="60" />
 				<el-table-column prop="username" label="用户" align="center" />
 				<el-table-column prop="userAvatar" label="头像" align="center">
@@ -22,13 +22,13 @@
 					</template>
 				</el-table-column>
 				<el-table-column prop="userMobile" label="手机号" align="center" />
-				<el-table-column prop="username" label="操作金额" align="center">
+				<el-table-column prop="currentImport_price" label="操作金额" align="center">
 					<template #default="{ row }">
 						<div class="color-success">{{ displayPrice(row.currentImport_price) }}</div>
 					</template>
 				</el-table-column>
 				<slot v-if="data.tableList && data.tableList.length">
-					<el-table-column v-for="(v, i) in data.tableList" :key="i" align="center">
+					<el-table-column :prop="v" v-for="(v, i) in data.tableList" :key="i" align="center">
 						<template #header>
 							<div>
 								{{ data.tableListStr[i] }}
@@ -63,11 +63,19 @@
 </template>
 
 <script setup lang="ts" name="preview-excel">
+import { computed } from "vue"
 import { BasicTableProps, useTable } from "/@/hooks/table"
 import { useDict } from "/@/hooks/dict"
 import { displayPrice } from "/@/utils/formatMoney"
 import * as walletRechargeApplyApi from "/@/api/wallet/wallet-recharge-apply"
-import { downBlobFile } from "/@/utils/other"
+import type { VNode } from "vue"
+import type { TableColumnCtx } from "element-plus"
+import { h } from "vue"
+
+interface SummaryMethodProps<T = any> {
+	columns: TableColumnCtx<T>[]
+	data: T[]
+}
 
 const { query } = useRoute()
 
@@ -111,11 +119,6 @@ const currentChangeHandle = (e: any) => {
 	getList()
 }
 
-// 导出excel
-const exportExcel = () => {
-	downBlobFile("/wallet/wallet-recharge-apply/export-excel", Object.assign(state.queryForm), "walletManage.xlsx")
-}
-
 /** 查询列表 */
 const getList = async () => {
 	state.loading = true
@@ -128,10 +131,64 @@ const getList = async () => {
 		data.list = pageData.page.records
 		data.total = pageData.page.total
 		data.tableList = pageData.tableList
+		console.log(pageData.tableList)
 		data.tableListStr = pageData.tableListStr
 		state.pagination.total = pageData.page.total
 	} finally {
 		state.loading = false
 	}
 }
+
+// 表格行尾合计
+const getSummaries = (param: SummaryMethodProps) => {
+	const { columns, data: data1 } = param
+	const sums: (string | VNode | number)[] = []
+	columns.forEach((column, index) => {
+		if (index === 0) {
+			sums[index] = "合计"
+			return
+		}
+		if (column.property === "currentImport_price") {
+			const values = data1.map((item) => Number(item[column.property]))
+			if (!values.every((value) => Number.isNaN(value))) {
+				sums[index] = h("span", { style: { color: "#67C260" } }, [
+					displayPrice(
+						values.reduce((prev, curr) => {
+							const value = Number(curr)
+							if (!Number.isNaN(value)) {
+								return prev + curr
+							} else {
+								return prev
+							}
+						}, 0),
+					),
+				])
+			} else {
+				sums[index] = "NaN"
+			}
+		} else if (column.property === data.tableList[0]) {
+			sums[index] = displayPrice(
+				data.list.reduce((prev: any, curr: any) => {
+					return prev + curr[data.tableList[0] + "_price"]
+				}, 0),
+			)
+		} else if (column.property === data.tableList[1]) {
+			sums[index] = displayPrice(
+				data.list.reduce((prev: any, curr: any) => {
+					return prev + curr[data.tableList[1] + "_price"]
+				}, 0),
+			)
+		} else if (column.property === data.tableList[2]) {
+			sums[index] = displayPrice(
+				data.list.reduce((prev: any, curr: any) => {
+					return prev + curr[data.tableList[2] + "_price"]
+				}, 0),
+			)
+		} else {
+			sums[index] = ""
+		}
+	})
+
+	return sums
+}
 </script>