From 8a9cd5221a7ac6d00cb259e395bda003ae42ca57 Mon Sep 17 00:00:00 2001 From: 曹睿 <360930172@qq.com> Date: 星期四, 19 六月 2025 16:30:46 +0800 Subject: [PATCH] fix: 修复部分 --- src/views/procurementManagement/paymentLedger/index.vue | 275 +++++++++++++++++++++++++++++++++++++++--------------- 1 files changed, 199 insertions(+), 76 deletions(-) diff --git a/src/views/procurementManagement/paymentLedger/index.vue b/src/views/procurementManagement/paymentLedger/index.vue index a5a4c40..69a0947 100644 --- a/src/views/procurementManagement/paymentLedger/index.vue +++ b/src/views/procurementManagement/paymentLedger/index.vue @@ -15,39 +15,91 @@ >鎼滅储</el-button > </div> - <div> - </div> + <div></div> </div> - <el-row> + <el-row :gutter="20"> <el-col :span="14"> <div class="table_list"> - <PIMTable - :column="tableColumn" - :tableData="tableData" - :page="page" - :isSelection="false" - :handleSelectionChange="handleSelectionChange" - :tableLoading="tableLoading" - @pagination="pagination" - :total="total" - :rowClick="rowClick" - :isShowSummary="isShowSummary" + <el-table + ref="multipleTable" + border + v-loading="tableLoading" + :data="tableData" + :header-cell-style="{ background: '#F0F1F5', color: '#333333' }" + height="calc(100vh - 18.5em)" :highlight-current-row="true" - ></PIMTable> + style="width: 100%" + tooltip-effect="dark" + @row-click="rowClick" + :show-summary="isShowSummary" + :summary-method="summarizeMainTable" + class="lims-table" + > + <el-table-column + align="center" + label="搴忓彿" + type="index" + width="60" + /> + <el-table-column label="渚涘簲鍟嗗悕绉�" prop="supplierName" /> + <el-table-column + label="鍙戠エ閲戦(鍏�)" + prop="invoiceAmount" + show-overflow-tooltip + :formatter="formattedNumber" + /> + <el-table-column + label="浠樻閲戦(鍏�)" + prop="paymentAmount" + show-overflow-tooltip + :formatter="formattedNumber" + /> + <el-table-column + label="搴斾粯閲戦(鍏�)" + prop="payableAmount" + show-overflow-tooltip + > + <template #default="{ row, column }"> + <el-text type="danger"> + {{ formattedNumber(row, column, row.payableAmount) }} + </el-text> + </template> + </el-table-column> + </el-table> + <pagination + v-show="total > 0" + @pagination="paginationSearch" + :total="total" + :layout="page.layout" + :page="page.current" + :limit="page.size" + /> </div> </el-col> <el-col :span="10"> <div class="table_list"> <PIMTable :column="tableColumnSon" - :tableData="tableDataSon" - :page="pageSon" + :tableData="originalTableDataSon" :isSelection="false" :tableLoading="tableLoadingSon" - @pagination="paginationSon" - :total="totalSon" :isShowSummary="isShowSummarySon" - ></PIMTable> + :summaryMethod="summarizeMainTable1" + > + <template #payableAmountSlot="{ row }"> + <el-text type="danger"> + {{ parseFloat(row.payableAmount).toFixed(2) }} + </el-text> + </template> + </PIMTable> + <pagination + v-show="sonTotal > 0" + :total="sonTotal" + @pagination="sonPaginationSearch" + :layout="page.layout" + :page="sonPage.current" + :limit="sonPage.size" + /> </div> </el-col> </el-row> @@ -57,7 +109,11 @@ <script setup> import { ref, toRefs } from "vue"; import { Search } from "@element-plus/icons-vue"; -import { paymentLedgerList } from "@/api/procurementManagement/paymentLedger.js"; +import { + paymentLedgerList, + paymentRecordList, +} from "@/api/procurementManagement/paymentLedger.js"; +import Pagination from "../../../components/PIMTable/Pagination.vue"; const tableColumn = ref([ { @@ -77,6 +133,7 @@ prop: "payableAmount", }, ]); +const tableData = ref([]); const tableLoading = ref(false); const data = reactive({ searchForm: { @@ -85,100 +142,166 @@ }); const page = reactive({ current: 1, - size: 10, + size: 100, +}); +const sonPage = reactive({ + current: 1, + size: 100, }); const total = ref(0); +const sonTotal = ref(0); const isShowSummary = ref(true); -const tableData = ref([]); const { searchForm } = toRefs(data); - - -import {getInfo} from "@/api/login.js"; +const currentSupplierId = ref(""); const rowClick = (row) => { - tableDataSon.value = Array.isArray(row.details) ? row.details : []; - console.log("111",tableDataSon.value); + currentSupplierId.value = row.supplierId; + getPaymenRecordtList(row.supplierId); }; - - // 瀛愭ā鍧� const tableColumnSon = ref([ { - label: "浠樻鏃ユ湡", - prop: "paymentDate", + label: "鍙戠敓鏃ユ湡", + prop: "happenTime", }, { - label: "寮�绁ㄦ暟", - prop: "voteCount", + label: "鍙戠エ閲戦(鍏�)", + prop: "invoiceAmount", + formatData: (params) => { + return parseFloat(params).toFixed(2); + }, }, { label: "浠樻閲戦(鍏�)", - prop: "paymentAmount", + prop: "currentPaymentAmount", + formatData: (params) => { + return parseFloat(params).toFixed(2); + }, }, { label: "搴斾粯閲戦(鍏�)", - prop: "payableAmount", + dataType: "slot", + slot: "payableAmountSlot", }, ]); const tableDataSon = ref([]); +const originalTableDataSon = ref([]); const tableLoadingSon = ref(false); -const pageSon = reactive({ - current: 1, - size: 10, -}); -const totalSon = ref(0); const isShowSummarySon = ref(true); +const detailPageNum = ref(1); +const detailPageSize = ref(10); +const { proxy } = getCurrentInstance(); - - - +// 涓昏〃鍚堣鏂规硶 +const summarizeMainTable = (param) => { + return proxy.summarizeTable( + param, + ["invoiceAmount", "paymentAmount", "payableAmount"], + { + ticketsNum: { noDecimal: true }, // 涓嶄繚鐣欏皬鏁� + futureTickets: { noDecimal: true }, // 涓嶄繚鐣欏皬鏁� + } + ); +}; +// 瀛愯〃鍚堣鏂规硶 +const summarizeMainTable1 = (param) => { + let summarizeTable = proxy.summarizeTable( + param, + ["invoiceAmount", "currentPaymentAmount"], + { + ticketsNum: { noDecimal: true }, // 涓嶄繚鐣欏皬鏁� + futureTickets: { noDecimal: true }, // 涓嶄繚鐣欏皬鏁� + } + ); + if (originalTableDataSon.value.length > 0) { + summarizeTable[summarizeTable.length - 1] = + originalTableDataSon.value[ + originalTableDataSon.value.length - 1 + ].payableAmount.toFixed(2); + } else { + summarizeTable[summarizeTable.length - 1] = 0.0; + } + return summarizeTable; +}; /** 鎼滅储鎸夐挳鎿嶄綔 */ const handleQuery = () => { page.current = 1; getList(); }; -const pagination = ({ current, limit }) => { - page.current = current; - page.size = limit; - getList(); -}; -const paginationSon = ({ current, limit }) => { - pageSon.current = current; - pageSon.size = limit; +const paginationSearch = (obj) => { + page.current = obj.page; + page.size = obj.limit; getList(); }; const getList = () => { - tableLoading.value = false; - paymentLedgerList({ ...searchForm.value, ...page }).then((res) => { - let result = res.data + tableLoading.value = true; + paymentLedgerList({ + ...searchForm.value, + ...page, + detailPageNum: detailPageNum.value, // 鏂板 + detailPageSize: detailPageSize.value, // 鏂板 + }).then((res) => { + let result = res.data; tableLoading.value = false; - tableData.value = result; - total.value = result.total; + tableData.value = result.records || []; + total.value = result.total || 0; + if (tableData.value.length > 0) { + getPaymenRecordtList(tableData.value[0].supplierId); + currentSupplierId.value = tableData.value[0].supplierId; + } }); }; -// 琛ㄦ牸閫夋嫨鏁版嵁 -const handleSelectionChange = (selection) => { - selectedRows.value = selection; + +const getPaymenRecordtList = (supplierId) => { + tableLoadingSon.value = true; + paymentRecordList(supplierId) + .then((res) => { + tableLoadingSon.value = false; + tableDataSon.value = res.data; + handlePagination({ page: 1, limit: sonPage.size }); + sonTotal.value = res.data.length; + }) + .catch((e) => { + tableLoadingSon.value = false; + }); +}; +const handlePagination = ({ page, limit }) => { + sonPage.current = page; + sonPage.size = limit; + + const start = (page - 1) * limit; + const end = start + limit; + + originalTableDataSon.value = tableDataSon.value.slice(start, end); }; +const sonPaginationSearch = (pagination) => { + // 鎺ユ敹鍒嗛〉鍣ㄥ弬鏁� { page, limit } + handlePagination(pagination); +}; +const formattedNumber = (row, column, cellValue) => { + if (column.property !== "supplierName") { + return parseFloat(cellValue).toFixed(2); + } else { + return cellValue; + } +}; getList(); </script> <style scoped lang="scss"> -/* 閫変腑鏌愯鏃剁殑鑳屾櫙鑹�*/ -/* .el-table__body tr.current-row > td { - color: #c0c0c0; - background: #F6F7FB !important; -} */ -.el-row { - .el-col-14 { - .table_list { - padding-right: 0px; - } - } - .el-col-10 { - .table_list { - padding-left: 0px; - } - } +.el-pagination { + width: 100%; + height: 55px; + display: flex; + justify-content: flex-end; + float: right; + flex-direction: row; + align-items: center; + background: #fff; + margin: -20px 0 0 0; + padding: 0 20px; +} +.pagination-container { + margin-top: 0; } </style> -- Gitblit v1.9.3