| | |
| | | clearable |
| | | prefix-icon="Search" |
| | | /> |
| | | <span class="search_title" style="margin-left: 10px">订单号:</span> |
| | | <el-input |
| | | v-model="orderNoSearch" |
| | | style="width: 240px" |
| | | placeholder="输入订单号搜索" |
| | | @change="filterReceiptRecord" |
| | | clearable |
| | | prefix-icon="Search" |
| | | /> |
| | | <el-button type="primary" @click="handleQuery" style="margin-left: 10px" |
| | | >搜索</el-button |
| | | > |
| | |
| | | width="200" |
| | | /> |
| | | <el-table-column |
| | | label="开票金额(元)" |
| | | label="合同金额(元)" |
| | | prop="invoiceTotal" |
| | | show-overflow-tooltip |
| | | :formatter="formattedNumber" |
| | |
| | | /> |
| | | <el-table-column |
| | | label="发生日期" |
| | | prop="happenTime" |
| | | prop="receiptPaymentDate" |
| | | show-overflow-tooltip |
| | | width="110" |
| | | /> |
| | | <el-table-column |
| | | label="开票金额(元)" |
| | | prop="invoiceAmount" |
| | | label="订单号" |
| | | prop="salesContractNo" |
| | | show-overflow-tooltip |
| | | width="200" |
| | | /> |
| | | <el-table-column |
| | | label="合同金额(元)" |
| | | prop="invoiceTotal" |
| | | show-overflow-tooltip |
| | | :formatter="formattedNumber" |
| | | width="200" |
| | | /> |
| | | <el-table-column |
| | | label="回款金额(元)" |
| | | prop="receiptAmount" |
| | | prop="receiptPaymentAmount" |
| | | show-overflow-tooltip |
| | | :formatter="formattedNumber" |
| | | width="200" |
| | | /> |
| | | <el-table-column |
| | | label="应收金额(元)" |
| | | prop="unReceiptAmount" |
| | | prop="unReceiptPaymentAmount" |
| | | show-overflow-tooltip |
| | | width="200" |
| | | > |
| | | <template #default="{ row, column }"> |
| | | <el-text type="danger"> |
| | | {{ formattedNumber(row, column, row.unReceiptAmount) }} |
| | | {{ formattedNumber(row, column, row.unReceiptPaymentAmount) }} |
| | | </el-text> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <pagination |
| | | v-show="recordTotal > 0" |
| | | :total="recordTotal" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :page="recordPage.current" |
| | | :limit="recordPage.size" |
| | | @pagination="recordPaginationChange" |
| | | /> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | invoiceDate: "", |
| | | }, |
| | | }); |
| | | const orderNoSearch = ref(""); |
| | | const customerId = ref(""); |
| | | const { searchForm } = toRefs(data); |
| | | const originReceiptRecord = ref([]); |
| | |
| | | getList(); |
| | | }; |
| | | const paginationChange = (obj) => { |
| | | console.log("paginationChange", current, limit); |
| | | page.current = obj.page; |
| | | page.size = obj.limit; |
| | | getList(); |
| | |
| | | console.log("param", param); |
| | | customerInteractions(param).then((res) => { |
| | | originReceiptRecord.value = res.data; |
| | | handlePagination({ page: 1, limit: recordPage.size }); |
| | | recordTotal.value = res.data.length; |
| | | recordPage.current = 1; |
| | | filterReceiptRecord(); |
| | | }); |
| | | }; |
| | | |
| | |
| | | const handlePagination = ({ page, limit }) => { |
| | | recordPage.current = page; |
| | | recordPage.size = limit; |
| | | filterReceiptRecord(); |
| | | }; |
| | | |
| | | const start = (page - 1) * limit; |
| | | const end = start + limit; |
| | | |
| | | receiptRecord.value = originReceiptRecord.value.slice(start, end); |
| | | // 根据订单号过滤右边表格数据 |
| | | const filterReceiptRecord = () => { |
| | | let filteredData = originReceiptRecord.value; |
| | | if (orderNoSearch.value) { |
| | | filteredData = originReceiptRecord.value.filter(item => |
| | | item.salesContractNo && item.salesContractNo.includes(orderNoSearch.value) |
| | | ); |
| | | } |
| | | receiptRecord.value = filteredData; |
| | | }; |
| | | |
| | | onMounted(() => { |