From 3ef6a3a2bac778e2a224d6e437305b9f71d3799c Mon Sep 17 00:00:00 2001
From: 曹睿 <360930172@qq.com>
Date: 星期一, 07 七月 2025 15:30:23 +0800
Subject: [PATCH] feat: 【来票台账】添加附件上传
---
src/views/procurementManagement/procurementInvoiceLedger/index.vue | 37 ++++++--
src/views/procurementManagement/procurementInvoiceLedger/Modal/UploadModal.vue | 30 +++++-
src/api/procurementManagement/procurementInvoiceLedger.js | 8 ++
src/views/procurementManagement/invoiceEntry/components/Modal.vue | 109 +++++++++++++++++++++++----
4 files changed, 149 insertions(+), 35 deletions(-)
diff --git a/src/api/procurementManagement/procurementInvoiceLedger.js b/src/api/procurementManagement/procurementInvoiceLedger.js
index b828c4a..bedb52a 100644
--- a/src/api/procurementManagement/procurementInvoiceLedger.js
+++ b/src/api/procurementManagement/procurementInvoiceLedger.js
@@ -66,3 +66,11 @@
params: query,
});
}
+
+export function productUploadFile(data) {
+ return request({
+ url: "/file/uploadFile",
+ method: "post",
+ data: data,
+ });
+}
diff --git a/src/views/procurementManagement/invoiceEntry/components/Modal.vue b/src/views/procurementManagement/invoiceEntry/components/Modal.vue
index 3296bb3..4c19cfd 100644
--- a/src/views/procurementManagement/invoiceEntry/components/Modal.vue
+++ b/src/views/procurementManagement/invoiceEntry/components/Modal.vue
@@ -1,6 +1,12 @@
<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-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">
@@ -9,61 +15,130 @@
</el-col>
<el-col :span="12">
<el-form-item label="閿�鍞悎鍚屽彿锛�" prop="salesContractNo">
- <el-input v-model="form.salesContractNo" placeholder="鑷姩濉厖" clearable disabled />
+ <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-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-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-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 />
+ <el-input
+ type="number"
+ :step="0.01"
+ :min="0"
+ v-model="form.invoiceAmount"
+ placeholder="鑷姩濉厖"
+ clearable
+ />
</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-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-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" />
+ <FileUpload
+ :showTip="false"
+ accept="*"
+ :autoUpload="true"
+ :action="action"
+ :headers="{
+ Authorization: 'Bearer ' + getToken(),
+ }"
+ :limit="10"
+ @success="uploadSuccess"
+ @remove="removeFile"
+ />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="褰曞叆鏃ユ湡锛�" prop="enterDate">
- <el-date-picker style="width: 100%" v-model="form.enterDate" type="date" clearable />
+ <el-date-picker
+ style="width: 100%"
+ v-model="form.enterDate"
+ type="date"
+ clearable
+ />
</el-form-item>
</el-col>
</el-row>
<el-form-item label="浜у搧淇℃伅锛�"> </el-form-item>
- <PIMTable rowKey="id" :column="columns" :tableData="form.productData" height="auto">
+ <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)" />
+ <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)" />
+ <el-input-number
+ v-model="row.ticketsAmount"
+ placeholder="璇烽�夋嫨"
+ :min="0"
+ :step="0.1"
+ clearable
+ style="width: 100%"
+ @change="invoiceAmountBlur(row)"
+ />
</template>
</PIMTable>
</el-form>
diff --git a/src/views/procurementManagement/procurementInvoiceLedger/Modal/UploadModal.vue b/src/views/procurementManagement/procurementInvoiceLedger/Modal/UploadModal.vue
index ba06618..594ba6c 100644
--- a/src/views/procurementManagement/procurementInvoiceLedger/Modal/UploadModal.vue
+++ b/src/views/procurementManagement/procurementInvoiceLedger/Modal/UploadModal.vue
@@ -2,12 +2,15 @@
<el-dialog v-model="upload.open" :title="upload.title" :width="500">
<FileUpload
ref="fileUploadRef"
- accept=".xlsx, .xls"
+ accept=".xlsx, .xls, .pdf"
:headers="upload.headers"
- :action="upload.url + '?updateSupport=' + upload.updateSupport"
+ :autoUpload="true"
+ :action="upload.url"
:disabled="upload.isUploading"
:showTip="false"
+ :limit="10"
@success="handleFileSuccess"
+ @remove="removeFile"
/>
<template #footer>
<div class="dialog-footer">
@@ -23,11 +26,17 @@
import { getToken } from "@/utils/auth.js";
import { FileUpload } from "@/components/Upload";
import { ElMessage } from "element-plus";
+import { ref } from "vue";
+import useFormData from "@/hooks/useFormData";
defineOptions({
name: "鏉ョエ鍙拌处闄勪欢琛ュ厖",
});
+const { form, resetForm } = useFormData({
+ id: undefined,
+ tempFileIds: [],
+});
const emits = defineEmits(["uploadSuccess"]);
const fileUploadRef = ref();
const upload = reactive({
@@ -40,29 +49,36 @@
// 璁剧疆涓婁紶鐨勮姹傚ご閮�
headers: { Authorization: "Bearer " + getToken() },
// 涓婁紶鐨勫湴鍧�
- url: import.meta.env.VITE_APP_BASE_API + "/system/supplier/import",
+ url: import.meta.env.VITE_APP_BASE_API + "/file/upload",
});
// 鐐瑰嚮瀵煎叆
-const handleImport = () => {
+const handleImport = (id) => {
+ form.id = id;
upload.open = true;
upload.title = "鏉ョエ鍙拌处闄勪欢琛ュ厖";
};
const submitFileForm = () => {
- fileUploadRef.value.uploadApi();
+ upload.open = false;
+ resetForm();
+ emits("uploadSuccess", form);
};
const handleFileSuccess = (response) => {
const { code, msg } = response;
+ form.tempFileIds.push(response.data.tempId);
if (code == 200) {
ElMessage({ message: "瀵煎叆鎴愬姛", type: "success" });
- upload.open = false;
- emits("uploadSuccess");
} else {
ElMessage({ message: msg, type: "error" });
}
};
+const removeFile = (file) => {
+ const { tempId } = file.response.data;
+ form.tempFileIds = form.tempFileIds.filter((item) => item !== tempId);
+};
+
defineExpose({
handleImport,
});
diff --git a/src/views/procurementManagement/procurementInvoiceLedger/index.vue b/src/views/procurementManagement/procurementInvoiceLedger/index.vue
index 4149e50..bbbce7c 100644
--- a/src/views/procurementManagement/procurementInvoiceLedger/index.vue
+++ b/src/views/procurementManagement/procurementInvoiceLedger/index.vue
@@ -59,14 +59,15 @@
@pagination="changePage"
>
<template #commonFilesRef="{ row }">
- <el-dropdown
- v-if="row.commonFiles.length !== 0"
- @command="(command) => handleCommand(command, row)"
- >
+ <el-dropdown @command="(command) => handleCommand(command, row)">
<el-button link :icon="Files" type="danger"> 闄勪欢 </el-button>
<template #dropdown>
<el-dropdown-menu>
- <el-dropdown-item :icon="Download" command="download">
+ <el-dropdown-item
+ v-if="row.commonFiles.length !== 0"
+ :icon="Download"
+ command="download"
+ >
涓嬭浇
</el-dropdown-item>
<el-dropdown-item :icon="Upload" command="upload">
@@ -75,11 +76,10 @@
</el-dropdown-menu>
</template>
</el-dropdown>
- <el-text v-else type="danger">鏆傛棤闄勪欢</el-text>
</template>
</PIMTable>
</div>
- <Modal ref="modalRef"></Modal>
+ <Modal ref="modalRef" @uploadSuccess="uploadSuccess"></Modal>
</div>
</template>
@@ -87,7 +87,10 @@
import { ref, getCurrentInstance } from "vue";
import { usePaginationApi } from "@/hooks/usePaginationApi";
import { Files, Download, Search, Upload } from "@element-plus/icons-vue";
-import { productRecordPage } from "@/api/procurementManagement/procurementInvoiceLedger.js";
+import {
+ productRecordPage,
+ productUploadFile,
+} from "@/api/procurementManagement/procurementInvoiceLedger.js";
import { onMounted } from "vue";
import { ElMessageBox } from "element-plus";
import Modal from "./Modal/UploadModal.vue";
@@ -260,13 +263,25 @@
break;
case "upload":
console.log(row.commonFiles);
- openModal();
+ openModal(row.ticketRegistrationId);
break;
}
};
-const openModal = () => {
- modalRef.value.handleImport();
+const openModal = (id) => {
+ modalRef.value.handleImport(id);
+};
+
+// 涓婁紶鎴愬姛鍚庡仛浠�涔�
+const uploadSuccess = async (data) => {
+ const { code } = await productUploadFile({
+ ticketRegistrationId: data.id,
+ tempFileIds: data.tempFileIds,
+ });
+ if (code === 200) {
+ proxy.$modal.msgSuccess("鎻愪氦鎴愬姛");
+ getTableData();
+ }
};
onMounted(() => {
--
Gitblit v1.9.3