| | |
| | | prefix-icon="Search" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="客户合同号"> |
| | | <el-input |
| | | v-model="searchForm.customerContractNo" |
| | | placeholder="请输入" |
| | | @change="handleQuery" |
| | | clearable |
| | | prefix-icon="Search" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="项目名称"> |
| | | <el-input |
| | | v-model="searchForm.projectName" |
| | | placeholder="请输入" |
| | | @change="handleQuery" |
| | | clearable |
| | | prefix-icon="Search" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-checkbox |
| | | v-model="searchForm.status" |
| | |
| | | size="small" |
| | | @click="changeEditType(scope.row)" |
| | | v-if="!scope.row.editType" |
| | | :disabled="scope.row.registrant !== userStore.nickName" |
| | | >编辑</el-button |
| | | > |
| | | <el-button |
| | |
| | | size="small" |
| | | @click="saveReceiptPayment(scope.row)" |
| | | v-if="scope.row.editType" |
| | | :disabled="scope.row.registrant !== userStore.nickName" |
| | | >保存</el-button |
| | | > |
| | | <el-button |
| | |
| | | type="primary" |
| | | size="small" |
| | | @click="delReceiptRecord(scope.row)" |
| | | :disabled="scope.row.registrant !== userStore.nickName" |
| | | >删除</el-button |
| | | > |
| | | </template> |
| | |
| | | width="240" |
| | | /> |
| | | <el-table-column |
| | | label="客户合同号" |
| | | prop="customerContractNo" |
| | | show-overflow-tooltip |
| | | width="240" |
| | | |
| | | /> |
| | | <el-table-column |
| | | label="客户名称" |
| | | prop="customerName" |
| | | show-overflow-tooltip |
| | | width="240" |
| | | /> |
| | | <el-table-column |
| | | label="项目名称" |
| | | prop="projectName" |
| | | show-overflow-tooltip |
| | | width="340" |
| | | /> |
| | | <el-table-column |
| | | label="回款状态" |
| | |
| | | width="100" |
| | | /> |
| | | <el-table-column |
| | | label="发票号" |
| | | prop="invoiceNo" |
| | | label="规格型号" |
| | | prop="specificationModel" |
| | | show-overflow-tooltip |
| | | width="200" |
| | | /> |
| | | <el-table-column |
| | | label="发票金额(元)" |
| | | prop="invoiceTotal" |
| | | show-overflow-tooltip |
| | | :formatter="formattedNumber" |
| | | width="200" |
| | | /> |
| | | <el-table-column label="税率(%)" prop="taxRate" show-overflow-tooltip /> |
| | | <el-table-column |
| | | label="回款金额(元)" |
| | | prop="receiptPaymentAmountTotal" |
| | | label="已回款金额(元)" |
| | | prop="invoiceTotal" |
| | | show-overflow-tooltip |
| | | :formatter="formattedNumber" |
| | | width="200" |
| | | /> |
| | | <el-table-column |
| | | label="待回款金额(元)" |
| | | prop="noReceiptAmount" |
| | | prop="pendingInvoiceTotal" |
| | | show-overflow-tooltip |
| | | width="200" |
| | | > |
| | | <template #default="{ row, column }"> |
| | | <el-text type="danger"> |
| | | {{ formattedNumber(row, column, row.noReceiptAmount) }} |
| | | {{ formattedNumber(row, column, row.pendingInvoiceTotal) }} |
| | | </el-text> |
| | | </template> |
| | | </el-table-column> |
| | |
| | | @pagination="paginationChange" |
| | | /> |
| | | </div> |
| | | <el-dialog |
| | | <FormDialog |
| | | v-model="dialogFormVisible" |
| | | title="新增回款页面" |
| | | width="70%" |
| | | :width="'90%'" |
| | | @close="closeDia" |
| | | @confirm="submitForm" |
| | | @cancel="closeDia" |
| | | > |
| | | <el-form |
| | | :model="form" |
| | | label-width="140px" |
| | | label-position="top" |
| | | :rules="rules" |
| | | ref="formRef" |
| | | <el-table |
| | | v-if="forms.length" |
| | | :data="forms" |
| | | border |
| | | style="width: 100%" |
| | | size="small" |
| | | > |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="销售合同号:" prop="salesContractNo"> |
| | | <el-input |
| | | v-model="form.salesContractNo" |
| | | placeholder="自动填充" |
| | | disabled |
| | | <el-table-column type="index" label="序号" width="50" align="center"/> |
| | | <el-table-column label="销售合同号" prop="salesContractNo" show-overflow-tooltip /> |
| | | <el-table-column label="客户名称" prop="customerName" show-overflow-tooltip /> |
| | | <el-table-column |
| | | label="产品大类" |
| | | prop="productCategory" |
| | | show-overflow-tooltip |
| | | width="100" |
| | | /> |
| | | <el-table-column |
| | | label="规格型号" |
| | | prop="specificationModel" |
| | | show-overflow-tooltip |
| | | width="200" |
| | | /> |
| | | <el-table-column label="税率(%)" width="110"> |
| | | <template #default="{ row }"> |
| | | <el-input v-model="row.taxRate" disabled /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="待回款金额(元)" |
| | | prop="pendingInvoiceTotal" |
| | | show-overflow-tooltip |
| | | width="170" |
| | | > |
| | | <template #default="{ row, column }"> |
| | | <el-text type="danger"> |
| | | {{ formattedNumber(row, column, row.pendingInvoiceTotal) }} |
| | | </el-text> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="本次回款金额(元)" width="180"> |
| | | <template #default="{ row }"> |
| | | <el-input-number |
| | | v-model="row.receiptPaymentAmount" |
| | | :step="0.01" |
| | | :min="0" |
| | | :max="Number(row.pendingInvoiceTotal || 0)" |
| | | :precision="2" |
| | | style="width: 100%" |
| | | placeholder="请输入" |
| | | /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="回款形式" width="160"> |
| | | <template #default="{ row }"> |
| | | <el-select v-model="row.receiptPaymentType" placeholder="请选择" clearable> |
| | | <el-option |
| | | v-for="opt in receipt_payment_type" |
| | | :key="opt.value" |
| | | :label="opt.label" |
| | | :value="opt.value" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="客户名称:" prop="customerName"> |
| | | <el-input |
| | | v-model="form.customerName" |
| | | placeholder="自动填充" |
| | | disabled |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="发票号:" prop="invoiceNo"> |
| | | <el-input |
| | | v-model="form.invoiceNo" |
| | | placeholder="自动填充" |
| | | disabled |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="发票金额(元):" prop="invoiceTotal"> |
| | | <el-input |
| | | type="number" |
| | | v-model="form.invoiceTotal" |
| | | placeholder="自动填充" |
| | | :step="0.01" |
| | | disabled |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="税率:" prop="taxRate"> |
| | | <el-input |
| | | type="number" |
| | | v-model="form.taxRate" |
| | | placeholder="自动填充" |
| | | :step="0.01" |
| | | disabled |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="本次回款金额:" prop="receiptPaymentAmount"> |
| | | <el-input-number :step="0.01" :min="0" style="width: 100%" |
| | | :precision="2" |
| | | v-model="form.receiptPaymentAmount" |
| | | placeholder="请输入" |
| | | clearable |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="回款形式:" prop="receiptPaymentType"> |
| | | <el-select |
| | | v-model="form.receiptPaymentType" |
| | | placeholder="请选择" |
| | | clearable |
| | | > |
| | | <el-option |
| | | v-for="item in receipt_payment_type" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="回款日期:" prop="receiptPaymentDate"> |
| | | <el-date-picker |
| | | style="width: 100%" |
| | | v-model="form.receiptPaymentDate" |
| | | value-format="YYYY-MM-DD" |
| | | format="YYYY-MM-DD" |
| | | type="date" |
| | | placeholder="请选择" |
| | | clearable |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="登记人:" prop="registrant"> |
| | | <el-input |
| | | v-model="form.registrant" |
| | | placeholder="请输入" |
| | | clearable |
| | | disabled |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <div class="dialog-footer"> |
| | | <el-button type="primary" @click="submitForm">确认</el-button> |
| | | <el-button @click="closeDia">取消</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | </el-select> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="回款日期" width="170"> |
| | | <template #default="{ row }"> |
| | | <el-date-picker |
| | | v-model="row.receiptPaymentDate" |
| | | value-format="YYYY-MM-DD" |
| | | format="YYYY-MM-DD" |
| | | type="date" |
| | | placeholder="请选择" |
| | | style="width: 100%" |
| | | /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="登记人" width="140"> |
| | | <template #default="{ row }"> |
| | | <el-input v-model="row.registrant" /> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <div v-else class="empty-tip">请选择需要回款的记录</div> |
| | | </FormDialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import pagination from "@/components/PIMTable/Pagination.vue"; |
| | | import { onMounted, ref } from "vue"; |
| | | import FormDialog from '@/components/Dialog/FormDialog.vue'; |
| | | import { onMounted, ref, reactive, getCurrentInstance } from "vue"; |
| | | import { |
| | | receiptPaymentSaveOrUpdate, |
| | | bindInvoiceNoRegPage, |
| | | invoiceInfo, |
| | | receiptPaymentHistoryListNoPage, |
| | | receiptPaymentDel, |
| | | } from "../../../api/salesManagement/receiptPayment.js"; |
| | |
| | | const tableData = ref([]); |
| | | const selectedRows = ref([]); |
| | | const tableLoading = ref(false); |
| | | const forms = ref([]); |
| | | const page = reactive({ |
| | | current: 1, |
| | | size: 100, |
| | |
| | | searchText: "", |
| | | status: true, |
| | | customerName: "", |
| | | customerContractNo: "", |
| | | projectName: "", |
| | | }, |
| | | form: { |
| | | salesContractNo: "", |
| | | customerName: "", |
| | | invoiceNo: "", |
| | | invoiceTotal: "", |
| | | taxRate: "", |
| | | receiptPaymentAmount: "", |
| | | receiptPaymentType: "", |
| | | registrant: "", |
| | | receiptPaymentDate: "", |
| | | }, |
| | | rules: { |
| | | salesContractNo: [{ required: true, message: "请选择", trigger: "change" }], |
| | | customerName: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | invoiceNo: [{ required: true, message: "请选择", trigger: "change" }], |
| | | invoiceTotal: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | taxRate: [{ required: true, message: "请选择", trigger: "change" }], |
| | | receiptPaymentAmount: [ |
| | | { required: true, message: "请选择", trigger: "change" }, |
| | | ], |
| | | receiptPaymentType: [ |
| | | { required: true, message: "请选择", trigger: "change" }, |
| | | ], |
| | | registrant: [{ required: true, message: "请选择", trigger: "change" }], |
| | | receiptPaymentDate: [ |
| | | { required: true, message: "请选择", trigger: "change" }, |
| | | ], |
| | | specificationModel: "", |
| | | }, |
| | | }); |
| | | const { form, rules } = toRefs(data); |
| | | const { form: searchForm, resetForm } = useFormData(data.searchForm); |
| | | const { form: searchForm } = useFormData(data.searchForm); |
| | | const { receipt_payment_type } = proxy.useDict("receipt_payment_type"); |
| | | |
| | | const formattedNumber = (row, column, cellValue) => { |
| | | return parseFloat(cellValue).toFixed(2); |
| | | const val = Number(cellValue ?? 0); |
| | | return Number.isFinite(val) ? val.toFixed(2) : "0.00"; |
| | | }; |
| | | |
| | | const getStatusTagType = (statusName = '') => { |
| | |
| | | // 表格选择数据 |
| | | const handleSelectionChange = (selection) => { |
| | | console.log("selection", selection); |
| | | selectedRows.value = selection.filter( |
| | | (item) => item.customerContractNo !== null |
| | | ); |
| | | selectedRows.value = selection; |
| | | }; |
| | | // 主表合计方法 |
| | | const summarizeMainTable = (param) => { |
| | | return proxy.summarizeTable( |
| | | param, |
| | | ["invoiceTotal", "receiptPaymentAmountTotal", "noReceiptAmount"], |
| | | ["receiptPaymentAmountTotal", "noReceiptAmount"], |
| | | { |
| | | ticketsNum: { noDecimal: true }, // 不保留小数 |
| | | futureTickets: { noDecimal: true }, // 不保留小数 |
| | |
| | | }; |
| | | // 打开弹框 |
| | | const openForm = () => { |
| | | form.value = {}; |
| | | if (selectedRows.value.length !== 1) { |
| | | proxy.$modal.msgError("请选择一条数据"); |
| | | if (selectedRows.value.length === 0) { |
| | | proxy.$modal.msgError("请选择至少一条数据"); |
| | | return; |
| | | } |
| | | if (selectedRows.value[0].noReceiptAmount == 0) { |
| | | proxy.$modal.msgWarning("无需再回款"); |
| | | const validRows = selectedRows.value.filter((item) => item.noReceiptAmount !== 0); |
| | | if (validRows.length === 0) { |
| | | proxy.$modal.msgWarning("所选记录均无需回款"); |
| | | return; |
| | | } |
| | | invoiceInfo({ id: selectedRows.value[0].id }).then((res) => { |
| | | form.value = { ...res.data }; |
| | | form.value.invoiceLedgerId = form.value.id; |
| | | form.value.id = ""; |
| | | form.value.registrant = userStore.nickName; |
| | | }); |
| | | forms.value = validRows.map((row) => ({ |
| | | salesContractNo: row.salesContractNo || "", |
| | | customerName: row.customerName || "", |
| | | productCategory: row.productCategory || "", |
| | | specificationModel: row.specificationModel || "", |
| | | pendingInvoiceTotal: Number(row.pendingInvoiceTotal || 0), |
| | | taxRate: row.taxRate ?? "", |
| | | receiptPaymentAmount: "", |
| | | receiptPaymentType: "", |
| | | registrant: userStore.nickName, |
| | | receiptPaymentDate: "", |
| | | invoiceLedgerId: row.id, |
| | | salesLedgerId: row.salesLedgerId, |
| | | salesLedgerProductId: row.id, |
| | | })); |
| | | dialogFormVisible.value = true; |
| | | }; |
| | | // 提交表单 |
| | | const submitForm = () => { |
| | | proxy.$refs["formRef"].validate((valid) => { |
| | | if (valid) { |
| | | receiptPaymentSaveOrUpdate(form.value).then((res) => { |
| | | proxy.$modal.msgSuccess("提交成功"); |
| | | closeDia(); |
| | | getList(); |
| | | }); |
| | | if (forms.value.length === 0) { |
| | | proxy.$modal.msgError("请选择回款记录"); |
| | | return; |
| | | } |
| | | for (let i = 0; i < forms.value.length; i++) { |
| | | const item = forms.value[i]; |
| | | const pendingAmount = Number(item.pendingInvoiceTotal || 0); |
| | | const currentAmount = Number(item.receiptPaymentAmount); |
| | | if (!item.receiptPaymentAmount && item.receiptPaymentAmount !== 0) { |
| | | proxy.$modal.msgError(`第 ${i + 1} 条:请填写回款金额`); |
| | | return; |
| | | } |
| | | if (currentAmount > pendingAmount) { |
| | | proxy.$modal.msgError( |
| | | `第 ${i + 1} 条:回款金额不能超过待回款金额(待回款:${pendingAmount.toFixed( |
| | | 2 |
| | | )})` |
| | | ); |
| | | return; |
| | | } |
| | | if (!item.receiptPaymentType) { |
| | | proxy.$modal.msgError(`第 ${i + 1} 条:请选择回款形式`); |
| | | return; |
| | | } |
| | | if (!item.receiptPaymentDate) { |
| | | proxy.$modal.msgError(`第 ${i + 1} 条:请选择回款日期`); |
| | | return; |
| | | } |
| | | } |
| | | receiptPaymentSaveOrUpdate(forms.value).then(() => { |
| | | proxy.$modal.msgSuccess("提交成功"); |
| | | closeDia(); |
| | | getList(); |
| | | }); |
| | | }; |
| | | // 关闭弹框 |
| | | const closeDia = () => { |
| | | proxy.resetForm("formRef"); |
| | | forms.value = []; |
| | | dialogFormVisible.value = false; |
| | | }; |
| | | |
| | |
| | | justify-content: space-between; |
| | | margin-bottom: 10px; |
| | | } |
| | | .empty-tip { |
| | | text-align: center; |
| | | padding: 20px 0; |
| | | color: #909399; |
| | | } |
| | | </style> |