From 7aa0e0f68d2a3d1268a64e49ab47c0c046265e84 Mon Sep 17 00:00:00 2001 From: gaoluyang <2820782392@qq.com> Date: 星期二, 20 五月 2025 11:48:23 +0800 Subject: [PATCH] 1.采购台账-开发联调 2.表格合计方法封装 --- src/views/procurementManagement/procurementLedger/index.vue | 234 +++++++++++++++++++++++++++------------------------------ 1 files changed, 111 insertions(+), 123 deletions(-) diff --git a/src/views/procurementManagement/procurementLedger/index.vue b/src/views/procurementManagement/procurementLedger/index.vue index f54ce5e..887f786 100644 --- a/src/views/procurementManagement/procurementLedger/index.vue +++ b/src/views/procurementManagement/procurementLedger/index.vue @@ -2,14 +2,14 @@ <div class="app-container"> <div class="search_form"> <div> - <span class="search_title">瀹㈡埛鍚嶇О锛�</span> + <span class="search_title">閲囪喘鍚堝悓鍙凤細</span> <el-input - v-model="searchForm.customerName" + v-model="searchForm.purchaseContractNumber" style="width: 240px" placeholder="璇疯緭鍏�" @change="handleQuery" clearable - :prefix-icon="Search" + prefix-icon="Search" /> <el-button type="primary" @click="handleQuery" style="margin-left: 10px">鎼滅储</el-button> </div> @@ -40,20 +40,19 @@ <el-table-column label="鍗曚綅" prop="unit" /> <el-table-column label="鏁伴噺" prop="quantity" /> <el-table-column label="绋庣巼(%)" prop="taxRate" /> - <el-table-column label="鍚◣鍗曚环(鍏�)" prop="taxInclusiveUnitPrice" /> - <el-table-column label="鍚◣鎬讳环(鍏�)" prop="taxInclusiveTotalPrice" /> - <el-table-column label="涓嶅惈绋庢�讳环(鍏�)" prop="taxExclusiveTotalPrice" /> + <el-table-column label="鍚◣鍗曚环(鍏�)" prop="taxInclusiveUnitPrice" :formatter="formattedNumber" /> + <el-table-column label="鍚◣鎬讳环(鍏�)" prop="taxInclusiveTotalPrice" :formatter="formattedNumber" /> + <el-table-column label="涓嶅惈绋庢�讳环(鍏�)" prop="taxExclusiveTotalPrice" :formatter="formattedNumber" /> </el-table> </template> </el-table-column> <el-table-column align="center" label="搴忓彿" type="index" width="60" /> + <el-table-column label="閲囪喘鍚堝悓鍙�" prop="purchaseContractNumber" show-overflow-tooltip/> <el-table-column label="閿�鍞悎鍚屽彿" prop="salesContractNo" show-overflow-tooltip/> - <el-table-column label="瀹㈡埛鍚堝悓鍙�" prop="customerContractNo" show-overflow-tooltip/> - <el-table-column label="瀹㈡埛鍚嶇О" prop="customerName" show-overflow-tooltip/> - <el-table-column label="涓氬姟鍛�" prop="salesman" show-overflow-tooltip/> + <el-table-column label="渚涘簲鍟嗗悕绉�" prop="supplierName" show-overflow-tooltip/> <el-table-column label="椤圭洰鍚嶇О" prop="projectName" show-overflow-tooltip/> - <el-table-column label="鍚堝悓閲戦(鍏�)" prop="contractAmount" show-overflow-tooltip/> - <el-table-column label="褰曞叆浜�" prop="entryPerson" show-overflow-tooltip/> + <el-table-column label="鍚堝悓閲戦(鍏�)" prop="contractAmount" show-overflow-tooltip :formatter="formattedNumber"/> + <el-table-column label="褰曞叆浜�" prop="recorderName" show-overflow-tooltip/> <el-table-column label="褰曞叆鏃ユ湡" prop="entryDate" show-overflow-tooltip/> <el-table-column fixed="right" label="鎿嶄綔" min-width="60" align="center"> <template #default="scope"> @@ -64,56 +63,48 @@ <pagination v-show="total > 0" :total="total" layout="total, sizes, prev, pager, next, jumper" :page="page.current" :limit="page.size" @pagination="paginationChange" /> </div> - <el-dialog v-model="dialogFormVisible" :title="operationType === 'add' ? '鏂板閿�鍞彴璐﹂〉闈�' : '缂栬緫閿�鍞彴璐﹂〉闈�'" width="70%" @close="closeDia"> + <el-dialog v-model="dialogFormVisible" :title="operationType === 'add' ? '鏂板閲囪喘鍙拌处椤甸潰' : '缂栬緫閲囪喘鍙拌处椤甸潰'" width="70%" @close="closeDia"> <el-form :model="form" label-width="140px" label-position="top" :rules="rules" ref="formRef"> <el-row :gutter="30"> <el-col :span="12"> - <el-form-item label="閿�鍞悎鍚屽彿锛�" prop="salesContractNo"> - <el-input v-model="form.salesContractNo" placeholder="鑷姩鐢熸垚" clearable disabled/> + <el-form-item label="閲囪喘鍚堝悓鍙凤細" prop="purchaseContractNumber"> + <el-input v-model="form.purchaseContractNumber" placeholder="璇疯緭鍏�" clearable/> </el-form-item> </el-col> <el-col :span="12"> - <el-form-item label="涓氬姟鍛橈細" prop="salesman"> - <el-select v-model="form.salesman" placeholder="璇烽�夋嫨" clearable> - <el-option v-for="item in userList" :key="item.nickName" :label="item.nickName" :value="item.nickName"/> + <el-form-item label="閿�鍞悎鍚屽彿锛�" prop="salesLedgerId"> + <el-select v-model="form.salesLedgerId" placeholder="璇烽�夋嫨" clearable> + <el-option v-for="item in salesContractList" :key="item.id" :label="item.salesContractNo" :value="item.id"/> </el-select> </el-form-item> </el-col> </el-row> <el-row :gutter="30"> <el-col :span="12"> - <el-form-item label="瀹㈡埛鍚堝悓鍙凤細" prop="customerContractNo"> - <el-input v-model="form.customerContractNo" placeholder="璇疯緭鍏�" clearable/> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="瀹㈡埛鍚嶇О锛�" prop="customerId"> - <el-select v-model="form.customerId" placeholder="璇烽�夋嫨" clearable> - <el-option v-for="item in customerOption" :key="item.id" :label="item.customerName" :value="item.id"> - {{item.customerName + '鈥斺��' + item.taxpayerIdentificationNumber}} - </el-option> + <el-form-item label="渚涘簲鍟嗗悕绉帮細" prop="supplierId"> + <el-select v-model="form.supplierId" placeholder="璇烽�夋嫨" clearable> + <el-option v-for="item in supplierList" :key="item.id" :label="item.supplierName" :value="item.id"/> </el-select> </el-form-item> </el-col> - </el-row> - <el-row :gutter="30"> <el-col :span="12"> <el-form-item label="椤圭洰鍚嶇О锛�" prop="projectName"> <el-input v-model="form.projectName" placeholder="璇疯緭鍏�" clearable/> </el-form-item> </el-col> - <el-col :span="12"> - <el-form-item label="褰曞叆浜猴細" prop="entryPerson"> - <el-select v-model="form.entryPerson" placeholder="璇烽�夋嫨" clearable> - <el-option v-for="item in userList" :key="item.nickName" :label="item.nickName" :value="item.nickName"/> - </el-select> - </el-form-item> - </el-col> </el-row> <el-row :gutter="30"> <el-col :span="12"> + <el-form-item label="褰曞叆浜猴細" prop="recorderId"> + <el-select v-model="form.recorderId" placeholder="璇烽�夋嫨" clearable disabled> + <el-option v-for="item in userList" :key="item.userId" :label="item.nickName" :value="item.userId"/> + </el-select> + </el-form-item> + </el-col> + <el-col :span="12"> <el-form-item label="褰曞叆鏃ユ湡锛�" prop="entryDate"> <el-date-picker + disabled style="width: 100%" v-model="form.entryDate" value-format="YYYY-MM-DD" @@ -131,7 +122,7 @@ <el-button plain type="danger" @click="deleteProduct">鍒犻櫎</el-button> </el-form-item> </el-row> - <el-table :data="productData" border @selection-change="productSelected"> + <el-table :data="productData" border @selection-change="productSelected" show-summary :summary-method="summarizeProTable"> <el-table-column align="center" type="selection" width="55" /> <el-table-column align="center" label="搴忓彿" type="index" width="60" /> <el-table-column label="浜у搧澶х被" prop="productCategory" /> @@ -139,12 +130,12 @@ <el-table-column label="鍗曚綅" prop="unit" /> <el-table-column label="鏁伴噺" prop="quantity" /> <el-table-column label="绋庣巼(%)" prop="taxRate" /> - <el-table-column label="鍚◣鍗曚环(鍏�)" prop="taxInclusiveUnitPrice" /> - <el-table-column label="鍚◣鎬讳环(鍏�)" prop="taxInclusiveTotalPrice" /> - <el-table-column label="涓嶅惈绋庢�讳环(鍏�)" prop="taxExclusiveTotalPrice" /> + <el-table-column label="鍚◣鍗曚环(鍏�)" prop="taxInclusiveUnitPrice" :formatter="formattedNumber"/> + <el-table-column label="鍚◣鎬讳环(鍏�)" prop="taxInclusiveTotalPrice" :formatter="formattedNumber"/> + <el-table-column label="涓嶅惈绋庢�讳环(鍏�)" prop="taxExclusiveTotalPrice" :formatter="formattedNumber"/> <el-table-column fixed="right" label="鎿嶄綔" min-width="60" align="center"> <template #default="scope"> - <el-button link type="primary" size="small" @click="openProductForm('edit', scope.row);">缂栬緫</el-button> + <el-button link type="primary" size="small" @click="openProductForm('edit', scope.row, scope.$index);">缂栬緫</el-button> </template> </el-table-column> </el-table> @@ -157,7 +148,7 @@ </el-row> <el-row :gutter="30"> <el-col :span="24"> - <el-form-item label="闄勪欢鏉愭枡路锛�" prop="remark"> + <el-form-item label="闄勪欢鏉愭枡锛�" prop="remark"> <el-upload v-model:file-list="fileList" :action="upload.url" @@ -223,7 +214,7 @@ <el-row :gutter="30"> <el-col :span="12"> <el-form-item label="鍚◣鍗曚环(鍏�)锛�" prop="taxInclusiveUnitPrice"> - <el-input v-model="productForm.taxInclusiveUnitPrice" placeholder="璇疯緭鍏�" clearable/> + <el-input-number v-model="productForm.taxInclusiveUnitPrice" :precision="2" :step="0.1" clearable style="width: 100%"/> </el-form-item> </el-col> <el-col :span="12"> @@ -239,12 +230,12 @@ <el-row :gutter="30"> <el-col :span="12"> <el-form-item label="鍚◣鎬讳环(鍏�)锛�" prop="taxInclusiveTotalPrice"> - <el-input v-model="productForm.taxInclusiveTotalPrice" placeholder="璇疯緭鍏�" clearable/> + <el-input-number v-model="productForm.taxInclusiveTotalPrice" :precision="2" :step="0.1" clearable style="width: 100%"/> </el-form-item> </el-col> <el-col :span="12"> <el-form-item label="涓嶅惈绋庢�讳环(鍏�)锛�" prop="taxExclusiveTotalPrice"> - <el-input v-model="productForm.taxExclusiveTotalPrice" placeholder="璇疯緭鍏�" clearable/> + <el-input-number v-model="productForm.taxExclusiveTotalPrice" :precision="2" :step="0.1" clearable style="width: 100%"/> </el-form-item> </el-col> </el-row> @@ -277,19 +268,23 @@ import {ElMessageBox } from "element-plus"; import {userListNoPage} from "@/api/system/user.js"; import { - ledgerList, - productList, - customerList, - addOrUpdateSalesLedger, - getSalesLedgerWithProducts, delLedger, addOrUpdateSalesLedgerProduct, delProduct, delLedgerFile + getSalesLedgerWithProducts, addOrUpdateSalesLedgerProduct, delProduct, delLedgerFile } from "@/api/salesManagement/salesLedger.js"; +import { + addOrEditPurchase, + delPurchase, + getSalesNo, + purchaseList, + productList, getPurchaseById, getOptions +} from "@/api/procurementManagement/procurementLedger.js"; const { proxy } = getCurrentInstance() const tableData = ref([]) const productData = ref([]) const selectedRows = ref([]) const productSelectedRows = ref([]) const userList = ref([]) -const customerOption = ref([]) +const salesContractList = ref([]) +const supplierList = ref([]) const tableLoading = ref(false) const page = reactive({ current: 1, @@ -297,38 +292,39 @@ }) const total = ref(0) const fileList = ref([]) +import useUserStore from "@/store/modules/user" + +const userStore = useUserStore() // 鐢ㄦ埛淇℃伅琛ㄥ崟寮规鏁版嵁 const operationType = ref('') const dialogFormVisible = ref(false) const data = reactive({ searchForm: { - customerName: '', + purchaseContractNumber: '', }, form: { - salesContractNo: '', - salesman: '', - customerContractNo: '', - customerId: '', + purchaseContractNumber: '', + salesLedgerId: '', projectName: '', - entryPerson: '', + recorderId: '', entryDate: '', - maintenanceTime: '', - productData: [] + productData: [], + supplierName: '', + supplierId: '', }, rules: { - salesman: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }], - customerContractNo: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }], - customerId: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }], + purchaseContractNumber: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }], + salesLedgerId: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }], projectName: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }], - entryPerson: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }], - entryDate: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }], + supplierId: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }], } }) const { searchForm, form, rules } = toRefs(data) // 浜у搧琛ㄥ崟寮规鏁版嵁 const productFormVisible = ref(false) const productOperationType = ref('') +const productOperationIndex = ref('') const currentId = ref('') const productFormData = reactive({ productForm: { @@ -362,6 +358,9 @@ headers: { Authorization: "Bearer " + getToken() }, }) +const formattedNumber = (row, column, cellValue) => { + return parseFloat(cellValue).toFixed(2); +}; // 鏌ヨ鍒楄〃 /** 鎼滅储鎸夐挳鎿嶄綔 */ const handleQuery = () => { @@ -375,13 +374,16 @@ } const getList = () => { tableLoading.value = true - ledgerList({...searchForm.value, ...page}).then(res => { + purchaseList({...searchForm.value, ...page}).then(res => { tableLoading.value = false tableData.value = res.rows tableData.value.map(item => { item.children = [] }) total.value = res.total + expandedRowKeys.value = [] + }).catch(() => { + tableLoading.value = false }) } // 琛ㄦ牸閫夋嫨鏁版嵁 @@ -397,7 +399,7 @@ if (expandedRows.length > 0) { expandedRowKeys.value = [] try { - productList({salesLedgerId: row.id}).then(res => { + productList({salesLedgerId: row.id, type: 2}).then(res => { const index = tableData.value.findIndex(item => item.id === row.id); if (index > -1) { tableData.value[index].children = res.rows; @@ -413,67 +415,39 @@ } // 涓昏〃鍚堣鏂规硶 const summarizeMainTable = (param) => { - const { columns, data } = param; - const sums = []; - columns.forEach((column, index) => { - if (index === 0) { - sums[index] = '鍚堣'; - return; - } - const prop = column.property; - if (['contractAmount'].includes(prop)) { - const values = data.map(item => Number(item[prop])); - if (!values.every(value => isNaN(value))) { - sums[index] = values.reduce((acc, val) => (!isNaN(val) ? acc + val : acc), 0); - } else { - sums[index] = ''; - } - } else { - sums[index] = ''; - } - }) - return sums; + return proxy.summarizeTable(param, ['contractAmount']); }; // 瀛愯〃鍚堣鏂规硶 -const summarizeChildrenTable = (param) => { - const { columns, data } = param; - const sums = []; - columns.forEach((column, index) => { - if (index === 0) { - sums[index] = '鍚堣'; - return; - } - const prop = column.property; - if (['taxInclusiveUnitPrice', 'taxInclusiveTotalPrice', 'taxExclusiveTotalPrice'].includes(prop)) { - const values = data.map(item => Number(item[prop])); - if (!values.every(value => isNaN(value))) { - sums[index] = values.reduce((acc, val) => (!isNaN(val) ? acc + val : acc), 0); - } else { - sums[index] = ''; - } - } else { - sums[index] = ''; - } - }); - return sums; -} +const summarizeProTable = (param) => { + return proxy.summarizeTable(param, ['taxInclusiveUnitPrice', 'taxInclusiveTotalPrice', 'taxExclusiveTotalPrice']); +}; // 鎵撳紑寮规 const openForm = (type, row) => { operationType.value = type form.value = {} productData.value = [] + fileList.value = [] userListNoPage().then(res => { userList.value = res.data }) - customerList().then(res => { - customerOption.value = res + getSalesNo().then(res => { + salesContractList.value = res }) + getOptions().then(res => { + supplierList.value = res.data + }) + form.value.recorderId = userStore.id + form.value.entryDate = getCurrentDate(); if (type === 'edit') { currentId.value = row.id; - getSalesLedgerWithProducts({id: row.id}).then(res => { + getPurchaseById({id: row.id, type: 2}).then(res => { form.value = {...res} productData.value = form.value.productData - fileList.value = form.value.salesLedgerFiles + if(form.value.salesLedgerFiles) { + fileList.value = form.value.salesLedgerFiles + } else { + fileList.value = [] + } }) } dialogFormVisible.value = true @@ -481,7 +455,7 @@ // 涓婁紶鍓嶆牎妫� function handleBeforeUpload(file) { // 鏍℃鏂囦欢澶у皬 - if (file.size > 1024 * 1024) { + if (file.size > 1024 * 1024 * 10) { proxy.$modal.msgError('涓婁紶鏂囦欢澶у皬涓嶈兘瓒呰繃10MB!') return false } @@ -506,11 +480,10 @@ } // 绉婚櫎鏂囦欢 function handleRemove (file) { - console.log('handleRemove', file) - console.log('operationType.value', operationType.value) + console.log('handleRemove', file.id) if (operationType.value === 'edit') { let ids = [] - ids.push(file.value.id) + ids.push(file.id) delLedgerFile(ids).then(res => { proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛") }) @@ -531,7 +504,8 @@ tempFileIds = fileList.value.map(item => item.tempId) } form.value.tempFileIds = tempFileIds - addOrUpdateSalesLedger(form.value).then(res => { + form.value.type = 2 + addOrEditPurchase(form.value).then(res => { proxy.$modal.msgSuccess("鎻愪氦鎴愬姛") closeDia() getList() @@ -545,8 +519,9 @@ dialogFormVisible.value = false } // 鎵撳紑浜у搧寮规 -const openProductForm = (type, row) => { +const openProductForm = (type, row, index) => { productOperationType.value = type + productOperationIndex.value = index productForm.value = {} proxy.resetForm("productFormRef") if (type === 'edit') { @@ -561,7 +536,11 @@ if (operationType.value === "edit") { submitProductEdit() } else { - productData.value.push({...productForm.value}) + if (productOperationType.value === 'add') { + productData.value.push({...productForm.value}) + } else { + productData.value[productOperationIndex.value] = {...productForm.value} + } closeProductDia() } } @@ -569,10 +548,11 @@ } const submitProductEdit = () => { productForm.value.salesLedgerId = currentId.value + productForm.value.type = 2 addOrUpdateSalesLedgerProduct(productForm.value).then(res => { proxy.$modal.msgSuccess("鎻愪氦鎴愬姛") closeProductDia() - getSalesLedgerWithProducts({id: currentId.value}).then(res => { + getPurchaseById({id: currentId.value, type: 2}).then(res => { productData.value = res.productData }) }) @@ -606,7 +586,7 @@ delProduct(ids).then(res => { proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛") closeProductDia() - getSalesLedgerWithProducts({id: currentId.value}).then(res => { + getSalesLedgerWithProducts({id: currentId.value, type: 2}).then(res => { productData.value = res.productData }) }) @@ -631,7 +611,7 @@ type: 'warning', } ).then(() => { - proxy.download("/sales/ledger/export", {}, '閿�鍞彴璐�.xlsx') + proxy.download("/purchase/ledger/export", {}, '閲囪喘鍙拌处.xlsx') }).catch(() => { proxy.$modal.msg("宸插彇娑�") }) @@ -653,7 +633,7 @@ type: 'warning', } ).then(() => { - delLedger(ids).then(res => { + delPurchase(ids).then(res => { proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛") getList() }) @@ -661,6 +641,14 @@ proxy.$modal.msg("宸插彇娑�") }) } +// 鑾峰彇褰撳墠鏃ユ湡骞舵牸寮忓寲涓� YYYY-MM-DD +function getCurrentDate() { + const today = new Date(); + const year = today.getFullYear(); + const month = String(today.getMonth() + 1).padStart(2, '0'); // 鏈堜唤浠�0寮�濮� + const day = String(today.getDate()).padStart(2, '0'); + return `${year}-${month}-${day}`; +} getList() </script> -- Gitblit v1.9.3