From a9c3543f4b4fa5a092a8dea688aedc2b2adbd576 Mon Sep 17 00:00:00 2001 From: 曹睿 <360930172@qq.com> Date: 星期二, 24 六月 2025 17:34:50 +0800 Subject: [PATCH] feat: 【来票台账】显示附件 --- src/views/procurementManagement/invoiceEntry/components/Modal.vue | 408 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 408 insertions(+), 0 deletions(-) diff --git a/src/views/procurementManagement/invoiceEntry/components/Modal.vue b/src/views/procurementManagement/invoiceEntry/components/Modal.vue new file mode 100644 index 0000000..1fd32e9 --- /dev/null +++ b/src/views/procurementManagement/invoiceEntry/components/Modal.vue @@ -0,0 +1,408 @@ +<template> + <el-dialog :title="modalOptions.title" v-model="visible" width="70%"> + <el-form + ref="formRef" + :model="form" + :rules="rules" + label-width="120px" + label-position="top" + > + <el-row :gutter="30"> + <el-col :span="12"> + <el-form-item label="閲囪喘鍚堝悓鍙凤細" prop="purchaseLedgerNo"> + <el-input v-model="form.purchaseLedgerNo" disabled /> + </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-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="projectName"> + <el-input + v-model="form.projectName" + 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 + /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="鍙戠エ閲戦(鍏�)锛�" prop="invoiceAmount"> + <el-input + type="number" + :step="0.01" + :min="0" + v-model="form.invoiceAmount" + placeholder="鑷姩濉厖" + clearable + :disabled="true" + /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="褰曞叆浜猴細" prop="issUer"> + <el-input + v-model="form.issUer" + placeholder="璇疯緭鍏�" + clearable + disabled + /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="寮�绁ㄦ棩鏈燂細" prop="entryDate"> + <el-date-picker + style="width: 100%" + v-model="form.entryDate" + type="date" + clearable + /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="涓婁紶闄勪欢"> + <FileUpload + :showTip="false" + accept="*" + :autoUpload="true" + :action="action" + :headers="{ + Authorization: 'Bearer ' + getToken(), + }" + :limit="10" + @success="uploadSuccess" + @remove="removeFile" + /> + </el-form-item> + </el-col> + </el-row> + <el-form-item label="浜у搧淇℃伅锛�" prop="entryDate"> </el-form-item> + <PIMTable + rowKey="id" + :column="columns" + :tableData="form.productData" + height="auto" + > + <template #ticketsNumRef="{ row }"> + <el-input-number + v-model="row.ticketsNum" + placeholder="璇烽�夋嫨" + :min="0" + :step="0.1" + clearable + style="width: 100%" + @change="invoiceNumBlur(row)" + /> + </template> + <template #ticketsAmountRef="{ row }"> + <el-input-number + v-model="row.ticketsAmount" + placeholder="璇烽�夋嫨" + :min="0" + :step="0.1" + clearable + style="width: 100%" + @change="invoiceAmountBlur(row)" + /> + </template> + </PIMTable> + </el-form> + <template #footer> + <el-button @click="closeModal">{{ modalOptions.cancelText }}</el-button> + <el-button type="primary" :loading="modalLoading" @click="submitForm"> + {{ modalOptions.confirmText }} + </el-button> + </template> + </el-dialog> +</template> + +<script setup> +import { ref, getCurrentInstance } from "vue"; +import { useModal } from "@/hooks/useModal"; +import useFormData from "@/hooks/useFormData"; +import FileUpload from "@/components/Upload/FileUpload.vue"; +import { + getPurchaseNoById, + getInfo, + addOrUpdateRegistration, +} from "@/api/procurementManagement/invoiceEntry.js"; +import { getPurchaseById } from "@/api/procurementManagement/procurementLedger.js"; +import { getToken } from "@/utils/auth"; +import useUserStore from "@/store/modules/user"; + +defineOptions({ + name: "鏉ョエ鐧昏妯℃�佹", +}); + +const userStore = useUserStore(); +const action = import.meta.env.VITE_APP_BASE_API + "/file/upload"; +const formRef = ref(); +const { proxy } = getCurrentInstance(); +const { form } = useFormData({ + purchaseLedgerNo: undefined, // 閲囪喘鍚堝悓鍙� + salesContractNo: undefined, // 閿�鍞悎鍚屽彿 + supplierName: undefined, // 渚涘簲鍟嗗悕绉� + projectName: undefined, // 椤圭洰鍚嶇О + invoiceNumber: undefined, // 鍙戠エ鍙� + invoiceAmount: undefined, // 鍙戠エ閲戦(鍏�) + issUerId: userStore.id, // 褰曞叆浜� + issUer: userStore.nickName, // 褰曞叆浜� + entryDate: undefined, // 寮�绁ㄦ棩鏈� + salesContractNoId: undefined, // 寮�绁ㄦ棩鏈� + productData: [], // 琛ㄦ牸 + tempFileIds: [], // 鏂囦欢 +}); + +const rules = ref({ + invoiceNumber: [ + { required: true, message: "璇疯緭鍏ュ彂绁ㄥ彿", trigger: "blur" }, + { type: "string" }, + ], + invoiceAmount: [ + { required: true, message: "璇疯緭鍏ュ彂绁ㄩ噾棰�", trigger: "blur" }, + ], +}); + +const { + id, + visible, + loading: modalLoading, + openModal, + modalOptions, + handleConfirm, + closeModal, +} = useModal({ + title: "鏉ョエ鐧昏", +}); + +const columns = [ + { + label: "浜у搧澶х被", + prop: "productCategory", + }, + { + label: "瑙勬牸鍨嬪彿", + prop: "specificationModel", + }, + { + label: "鍗曚綅", + prop: "unit", + width: 80, + }, + { + label: "鏁伴噺", + prop: "quantity", + width: 80, + }, + { + label: "绋庣巼(%)", + prop: "taxRate", + width: 80, + }, + { + label: "褰曞叆鏃ユ湡", + prop: "registerDate", + width: 120, + }, + { + label: "鍚◣鍗曚环(鍏�)", + prop: "taxInclusiveUnitPrice", + width: 150, + formatData: (val) => { + return parseFloat(val).toFixed(2) ?? 0; + }, + }, + { + label: "鍚◣鎬讳环(鍏�)", + prop: "taxInclusiveTotalPrice", + width: 150, + formatData: (val) => { + return parseFloat(val).toFixed(2) ?? 0; + }, + }, + { + label: "涓嶅惈绋庢�讳环(鍏�)", + prop: "taxExclusiveTotalPrice", + width: 150, + formatData: (val) => { + return parseFloat(val).toFixed(2) ?? 0; + }, + }, + { + label: "鏈鏉ョエ鏁�", + prop: "ticketsNum", + dataType: "slot", + slot: "ticketsNumRef", + width: 180, + align: "center", + }, + { + label: "鏈鏉ョエ閲戦(鍏�)", + prop: "ticketsAmount", + dataType: "slot", + slot: "ticketsAmountRef", + width: 180, + align: "center", + }, + { + label: "鏈潵绁ㄦ暟", + prop: "futureTickets", + }, + { + label: "鏈潵绁ㄩ噾棰�(鍏�)", + prop: "futureTicketsAmount", + }, +]; + +const getTableData = async (type, id) => { + if (type == "add") { + const { data } = await getPurchaseNoById({ id }); + form.purchaseLedgerNo = data.purchaseContractNumber; + form.invoiceAmount = data.invoiceAmount; + form.invoiceNumber = data.invoiceNumber; + form.entryDate = data.entryDate; + form.salesContractNoId = data.salesContractNoId; + + const { data: infoData } = await getInfo({ id }); + form.salesContractNo = infoData.salesContractNo; + form.projectName = infoData.projectName; + form.supplierName = infoData.supplierName; + form.productData = infoData.productData; + } else if (type == "edit") { + const data = await getPurchaseById({ id, type: 2 }); + form.purchaseLedgerNo = data.purchaseContractNumber; + form.invoiceAmount = data.invoiceAmount; + form.invoiceNumber = data.invoiceNumber; + form.salesContractNo = data.salesContractNo; + form.projectName = data.projectName; + form.supplierName = data.supplierName; + form.entryDate = data.entryDate; + form.productData = data.productData; + } +}; + +//鏈鏉ョエ鏁板け鐒︽搷浣� +const invoiceNumBlur = (row) => { + if (!row.ticketsNum || row.ticketsNum === "") { + row.ticketsNum = 0; + } + if (Number(row.ticketsNum) > Number(row.tempFutureTickets)) { + proxy.$modal.msgWarning("鏈寮�绁ㄦ暟涓嶅緱澶т簬鏈紑绁ㄦ暟"); + row.ticketsNum = 0; + return; + } + // 璁$畻鏈鏉ョエ閲戦 + row.ticketsAmount = row.ticketsNum * row.taxInclusiveUnitPrice; + // 璁$畻鏈潵绁ㄦ暟 + row.futureTickets = row.tempFutureTickets - row.ticketsNum; + // 璁$畻鏈潵绁ㄩ噾棰� + row.futureTicketsAmount = row.tempFutureTicketsAmount - row.ticketsAmount; + calculateinvoiceAmount(); +}; + +// 鏈鏉ョエ閲戦澶辩劍鎿嶄綔 +const invoiceAmountBlur = (row) => { + if (!row.ticketsAmount) { + row.ticketsAmount = 0; + } + // 璁$畻鏄惁瓒呰繃鏉ョエ鎬婚噾棰� + if (row.ticketsAmount > row.tempFutureTicketsAmount) { + proxy.$modal.msgWarning("鏈鏉ョエ閲戦涓嶅緱澶т簬鏈潵绁ㄩ噾棰�"); + row.ticketsAmount = 0; + } + // 璁$畻鏈鏉ョエ鏁� + row.ticketsNum = Number( + (row.ticketsAmount / row.taxInclusiveUnitPrice).toFixed(2) + ); + // 璁$畻鏈潵绁ㄦ暟 + row.futureTickets = row.tempFutureTickets - row.ticketsNum; + // 璁$畻鏈潵绁ㄩ噾棰� + row.futureTicketsAmount = row.tempFutureTicketsAmount - row.ticketsAmount; + calculateinvoiceAmount(); +}; + +const calculateinvoiceAmount = () => { + let invoiceAmountTotal = 0; + form.productData.forEach((item) => { + if (item.ticketsAmount) { + invoiceAmountTotal += item.ticketsAmount; + } + }); + form.invoiceAmount = invoiceAmountTotal.toFixed(2); +}; + +const open = (type, eid) => { + openModal(); + getTableData(type, eid); + id.value = eid; +}; + +const uploadSuccess = (response) => { + form.tempFileIds.push(response.data.tempId); + console.log(form); +}; + +const removeFile = (file) => { + const { tempId } = file.response.data; + form.tempFileIds = form.tempFileIds.filter((item) => item !== tempId); +}; + +const submitForm = () => { + formRef.value.validate(async (valid, fields) => { + if (valid) { + modalLoading.value = true; + const { code } = await addOrUpdateRegistration({ + purchaseLedgerId: id.value, + purchaseContractNumber: form.purchaseLedgerNo, + invoiceNumber: form.invoiceNumber, + invoiceAmount: form.invoiceAmount, + salesContractNo: form.salesContractNo, + projectName: form.projectName, + productData: form.productData, + issUerId: form.issUerId, // 褰曞叆浜� + issUer: form.issUer, // 褰曞叆浜� + salesContractNoId: form.salesContractNoId, + supplierName: form.supplierName, + tempFileIds: form.tempFileIds, + type: 4, + }); + modalLoading.value = false; + if (code == 200) { + closeModal(); + } + } + }); +}; + +defineExpose({ + open, +}); +</script> + +<style lang="scss" scoped></style> -- Gitblit v1.9.3