| | |
| | | prop="contractAmounts" |
| | | show-overflow-tooltip |
| | | :formatter="formattedNumber" /> |
| | | <el-table-column label="付款金额(元)" |
| | | prop="paymentAmount" |
| | | <el-table-column label="已入库金额(元)" |
| | | prop="shippedAmount" |
| | | show-overflow-tooltip |
| | | :formatter="formattedNumber" /> |
| | | <el-table-column label="应付金额(元)" |
| | | prop="payableAmount" |
| | | <el-table-column label="未入库金额(元)" |
| | | prop="unshippedAmount" |
| | | show-overflow-tooltip> |
| | | <template #default="{ row, column }"> |
| | | <el-text type="danger"> |
| | | {{ formattedNumber(row, column, row.payableAmount) }} |
| | | {{ formattedNumber(row, column, row.unshippedAmount) }} |
| | | </el-text> |
| | | </template> |
| | | </el-table-column> |
| | |
| | | @pagination="sonPaginationSearch"> |
| | | <template #payableAmountSlot="{ row }"> |
| | | <el-text type="danger"> |
| | | {{ parseFloat(row.payableAmount).toFixed(2) }} |
| | | {{ formatDecimal(row.unshippedAmount) }} |
| | | </el-text> |
| | | </template> |
| | | </PIMTable> |
| | |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { ref, toRefs } from "vue"; |
| | | import { ref, toRefs, reactive, getCurrentInstance } from "vue"; |
| | | import { Search } from "@element-plus/icons-vue"; |
| | | import { |
| | | paymentLedgerList, |
| | | paymentRecordList, |
| | | } from "@/api/procurementManagement/paymentLedger.js"; |
| | | import Pagination from "../../../components/PIMTable/Pagination.vue"; |
| | | import { tableAmountFormatter, formatDecimal, buildAmountSummaryFormat } from "@/utils/numberFormat"; |
| | | |
| | | const tableData = ref([]); |
| | | const tableLoading = ref(false); |
| | |
| | | label: "合同金额(元)", |
| | | prop: "contractAmount", |
| | | width: 200, |
| | | formatData: params => { |
| | | return params ? parseFloat(params).toFixed(2) : 0; |
| | | }, |
| | | formatData: params => formatDecimal(params), |
| | | }, |
| | | { |
| | | label: "付款金额(元)", |
| | | prop: "paymentAmount", |
| | | label: "已入库金额(元)", |
| | | prop: "shippedAmount", |
| | | width: 200, |
| | | formatData: params => { |
| | | return params ? parseFloat(params).toFixed(2) : 0; |
| | | }, |
| | | formatData: params => formatDecimal(params), |
| | | }, |
| | | { |
| | | label: "应付金额(元)", |
| | | label: "未入库金额(元)", |
| | | dataType: "slot", |
| | | width: 200, |
| | | prop: "payableAmount", |
| | | prop: "unshippedAmount", |
| | | slot: "payableAmountSlot", |
| | | }, |
| | | ]); |
| | |
| | | const summarizeMainTable = param => { |
| | | return proxy.summarizeTable( |
| | | param, |
| | | ["contractAmounts", "paymentAmount", "payableAmount"], |
| | | { |
| | | ticketsNum: { noDecimal: true }, // 不保留小数 |
| | | futureTickets: { noDecimal: true }, // 不保留小数 |
| | | } |
| | | ["contractAmounts", "shippedAmount", "unshippedAmount"], |
| | | buildAmountSummaryFormat( |
| | | ["contractAmounts", "shippedAmount", "unshippedAmount"], |
| | | { |
| | | ticketsNum: { noDecimal: true }, |
| | | futureTickets: { noDecimal: true }, |
| | | } |
| | | ) |
| | | ); |
| | | }; |
| | | // 子表合计方法 |
| | | const summarizeMainTable1 = param => { |
| | | let summarizeTable = proxy.summarizeTable( |
| | | param, |
| | | ["contractAmount", "invoiceAmount", "paymentAmount"], |
| | | { |
| | | ticketsNum: { noDecimal: true }, // 不保留小数 |
| | | futureTickets: { noDecimal: true }, // 不保留小数 |
| | | } |
| | | ["contractAmount", "shippedAmount", "unshippedAmount"], |
| | | buildAmountSummaryFormat( |
| | | ["contractAmount", "shippedAmount", "unshippedAmount"], |
| | | { |
| | | 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; |
| | | }; |
| | | /** 搜索按钮操作 */ |
| | |
| | | sonPage.size = pagination.limit; |
| | | getPaymenRecordtList(currentSupplierId.value); |
| | | }; |
| | | const formattedNumber = (row, column, cellValue) => { |
| | | if (column.property !== "supplierName") { |
| | | return parseFloat(cellValue).toFixed(2); |
| | | } else { |
| | | return cellValue; |
| | | } |
| | | }; |
| | | const formattedNumber = tableAmountFormatter; |
| | | getList(); |
| | | </script> |
| | | |