From a1ce4c3b8e48d95a590346a3fe1b45fdd3ca650f Mon Sep 17 00:00:00 2001 From: gaoluyang <2820782392@qq.com> Date: 星期四, 15 五月 2025 17:43:20 +0800 Subject: [PATCH] 付款登记-前端开发联调 --- src/views/procurementManagement/paymentEntry/index.vue | 346 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 346 insertions(+), 0 deletions(-) diff --git a/src/views/procurementManagement/paymentEntry/index.vue b/src/views/procurementManagement/paymentEntry/index.vue new file mode 100644 index 0000000..4022021 --- /dev/null +++ b/src/views/procurementManagement/paymentEntry/index.vue @@ -0,0 +1,346 @@ +<template> + <div class="app-container"> + <div class="search_form"> + <div> + <span class="search_title">渚涘簲鍟嗗悕绉�/鍚堝悓鍙凤細</span> + <el-input + v-model="searchForm.supplierNameOrContractNo" + style="width: 240px" + placeholder="杈撳叆渚涘簲鍟嗗悕绉�/鍚堝悓鍙锋悳绱�" + @change="handleQuery" + clearable + :prefix-icon="Search" + /> + <el-button type="primary" @click="handleQuery" style="margin-left: 10px">鎼滅储</el-button> + </div> + <div> + <el-button type="primary" @click="openForm('add')">鏂板浠樻</el-button> + <el-button type="danger" plain @click="handleDelete">鍒犻櫎</el-button> + </div> + </div> + <div class="table_list"> + <PIMTable :column="tableColumn" :tableData="tableData" :page="page" :handleSelectionChange="handleSelectionChange" + :tableLoading="tableLoading" @pagination="pagination" :total="total"></PIMTable> + </div> + <el-dialog v-model="dialogFormVisible" :title="operationType === 'add' ? '鏂板渚涘簲鍟嗕俊鎭�' : '缂栬緫渚涘簲鍟嗕俊鎭�'" width="60%" @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="purchaseLedgerId"> + <el-select v-model="form.purchaseLedgerId" placeholder="璇烽�夋嫨" clearable @change="setInfo" :disabled="operationType === 'edit'"> + <el-option v-for="item in purchaseLedgerList" :key="item.id" :label="item.purchaseContractNumber" :value="item.id"/> + </el-select> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="閿�鍞悎鍚屽彿锛�" prop="salesContractNo"> + <el-input v-model="form.salesContractNo" placeholder="鑷姩濉厖" clearable disabled/> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="30"> + <el-col :span="12"> + <el-form-item label="渚涘簲鍟嗗悕绉帮細" prop="supplierName"> + <el-input v-model="form.supplierName" placeholder="鑷姩濉厖" clearable disabled/> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="鍙戠エ鍙凤細" prop="invoiceNumber"> + <el-input v-model="form.invoiceNumber" placeholder="鑷姩濉厖" clearable disabled/> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="30"> + <el-col :span="12"> + <el-form-item label="鍙戠エ閲戦(鍏�)锛�" prop="invoiceAmount"> + <el-input type="number" :step="0.01" v-model="form.invoiceAmount" placeholder="鑷姩濉厖" clearable disabled/> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="绋庣巼(%)锛�" prop="taxRate"> + <el-input type="number" :step="0.01" v-model="form.taxRate" placeholder="鑷姩濉厖" clearable disabled/> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="30"> + <el-col :span="12"> + <el-form-item label="鏈浠樻閲戦锛�" prop="currentPaymentAmount"> + <el-input type="number" :step="0.01" v-model="form.currentPaymentAmount" placeholder="璇疯緭鍏�" clearable/> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="浠樻褰㈠紡锛�" prop="paymentMethod"> + <el-select v-model="form.paymentMethod" placeholder="璇烽�夋嫨" clearable> + <el-option label="鐢垫眹" value="鐢垫眹"/> + <el-option label="鎵垮厬" value="鎵垮厬"/> + </el-select> + </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-col :span="12"> + <el-form-item label="浠樻鏃ユ湡锛�" prop="paymentDate"> + <el-date-picker + disabled + style="width: 100%" + v-model="form.paymentDate" + value-format="YYYY-MM-DD" + format="YYYY-MM-DD" + type="date" + placeholder="璇烽�夋嫨" + clearable + /> + </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> + </div> +</template> + +<script setup> +import { ref } from 'vue' +import {Search} from "@element-plus/icons-vue"; +import {ElMessageBox } from "element-plus"; +import {getInfo} from "@/api/login.js"; +import useUserStore from "@/store/modules/user.js"; +import { + byPurchaseId, + getPurchaseNo, + paymentRegistrationAdd, paymentRegistrationDel, + paymentRegistrationEdit, + registrationInfo, + registrationList +} from "@/api/procurementManagement/paymentEntry.js"; +const { proxy } = getCurrentInstance() + +const tableColumn = ref([ + { + label: '閲囪喘鍚堝悓鍙�', + prop: 'purchaseContractNumber', + }, + { + label: '閿�鍞悎鍚屽彿', + prop: 'salesContractNo', + }, + { + label: '渚涘簲鍟嗗悕绉�', + prop: 'supplierName', + }, + { + label: '鍙戠エ鍙�', + prop: 'invoiceNumber' + }, + { + label: '鍙戠エ閲戦(鍏�)', + prop: 'invoiceAmount' + }, + { + label: '绋庣巼(%)', + prop: 'taxRate' + }, + { + label: '寰呬粯娆鹃噾棰�(鍏�)', + prop: 'unPaymentAmount' + }, + { + dataType: "action", + label: "鎿嶄綔", + align: 'center', + operation: [ + { + name: "缂栬緫", + type: "text", + clickFun: (row) => { + openForm('edit', row); + }, + }, + ], + }, +]) +const tableData = ref([]) +const selectedRows = ref([]) +const tableLoading = ref(false) +const purchaseLedgerList = ref([]) +const userStore = useUserStore() +const page = reactive({ + current: 1, + size: 10, +}) +const total = ref(0) + +// 鐢ㄦ埛淇℃伅琛ㄥ崟寮规鏁版嵁 +const operationType = ref('') +const dialogFormVisible = ref(false) +const data = reactive({ + searchForm: { + supplierNameOrContractNo: '', + }, + form: { + purchaseLedgerId: '', + salesContractNo: '', + supplierName: '', + invoiceNumber: '', + invoiceAmount: '', + taxRate: '', + currentPaymentAmount: '', + paymentMethod: '', + registrant: '', + registrantId: '', + paymentDate: '', + }, + rules: { + purchaseLedgerId: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }], + currentPaymentAmount: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }], + paymentMethod: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }], + } +}) +const { searchForm, form, rules } = toRefs(data) + +// 鏌ヨ鍒楄〃 +/** 鎼滅储鎸夐挳鎿嶄綔 */ +const handleQuery = () => { + page.current = 1 + getList() +} +const pagination = ({ current, limit }) => { + page.current = current; + page.size = limit; + getList() +} +const getList = () => { + tableLoading.value = true + registrationList({...searchForm.value, ...page}).then(res => { + tableLoading.value = false + tableData.value = res.rows + total.value = res.total + }) +} +// 琛ㄦ牸閫夋嫨鏁版嵁 +const handleSelectionChange = (selection) => { + selectedRows.value = selection +} +// 鎵撳紑寮规 +const openForm = (type, row) => { + operationType.value = type + form.value = {} + // 鏌ヨ閲囪喘鍚堝悓鍙� + getPurchaseNo().then(res => { + purchaseLedgerList.value = res + }) + form.value.registrantId = userStore.id + form.value.registrant = userStore.name + form.value.paymentDate = getCurrentDate(); + if (type === 'edit') { + registrationInfo(row.id).then(res => { + form.value = {...res.data} + }) + } + dialogFormVisible.value = true +} +// 閫夋嫨閲囪喘鍚堝悓鍙疯祴鍊� +const setInfo = (value) => { + if (value) { + byPurchaseId(value).then(res => { + form.value.salesContractNo = res.data.salesContractNo + form.value.supplierName = res.data.supplierName + form.value.invoiceNumber = res.data.invoiceNumber + form.value.invoiceAmount = res.data.invoiceAmount + form.value.taxRate = res.data.taxRate + form.value.supplierId = res.data.supplierId + }) + } else { + form.value.salesContractNo = '' + form.value.supplierName = '' + form.value.invoiceNumber = '' + form.value.invoiceAmount = '' + form.value.taxRate = '' + form.value.supplierId = '' + } +} +// 鎻愪氦琛ㄥ崟 +const submitForm = () => { + proxy.$refs["formRef"].validate(valid => { + if (valid) { + if (operationType.value === "edit") { + submitEdit() + } else { + submitAdd() + } + } + }) +} +// 鎻愪氦鏂板 +const submitAdd = () => { + paymentRegistrationAdd(form.value).then(res => { + proxy.$modal.msgSuccess("鎻愪氦鎴愬姛") + closeDia() + getList() + }) +} +// 鎻愪氦淇敼 +const submitEdit = () => { + paymentRegistrationEdit(form.value).then(res => { + proxy.$modal.msgSuccess("鎻愪氦鎴愬姛") + closeDia() + getList() + }) +} +// 鍏抽棴寮规 +const closeDia = () => { + proxy.resetForm("formRef") + dialogFormVisible.value = false +} +// 鍒犻櫎 +const handleDelete = () => { + let ids = [] + if (selectedRows.value.length > 0) { + ids = selectedRows.value.map(item => item.id); + } else { + proxy.$modal.msgWarning('璇烽�夋嫨鏁版嵁') + return + } + ElMessageBox.confirm( + '閫変腑鐨勫唴瀹瑰皢琚垹闄わ紝鏄惁纭鍒犻櫎锛�', + '鍒犻櫎鎻愮ず', { + confirmButtonText: '纭', + cancelButtonText: '鍙栨秷', + type: 'warning', + } + ).then(() => { + tableLoading.value = true + paymentRegistrationDel(ids).then(res => { + proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛") + getList() + }).finally(() => { + tableLoading.value = false + }) + }).catch(() => { + 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> + +<style scoped lang="scss"> + +</style> -- Gitblit v1.9.3