From a3aed6e0d25fcdc37860f68f28525686bf150316 Mon Sep 17 00:00:00 2001
From: gongchunyi <deslre0381@gmail.com>
Date: 星期六, 24 一月 2026 16:33:24 +0800
Subject: [PATCH] feat: BOM的导入导出功能
---
src/api/productionManagement/productBom.js | 10 +++
src/views/productionManagement/productStructure/index.vue | 168 ++++++++++++++++++++++++++++++++++++++++---------------
2 files changed, 132 insertions(+), 46 deletions(-)
diff --git a/src/api/productionManagement/productBom.js b/src/api/productionManagement/productBom.js
index 893755b..8132e9c 100644
--- a/src/api/productionManagement/productBom.js
+++ b/src/api/productionManagement/productBom.js
@@ -45,3 +45,13 @@
params: { productModelId },
});
}
+
+// 瀵煎嚭BOM
+export function exportBom(bomId) {
+ return request({
+ url: "/productBom/exportBom",
+ method: "post",
+ params: { bomId },
+ responseType: "blob",
+ });
+}
diff --git a/src/views/productionManagement/productStructure/index.vue b/src/views/productionManagement/productStructure/index.vue
index d8ce689..ce88565 100644
--- a/src/views/productionManagement/productStructure/index.vue
+++ b/src/views/productionManagement/productStructure/index.vue
@@ -1,42 +1,25 @@
<template>
<div class="app-container">
<div style="text-align: right; margin-bottom: 10px;">
+ <el-button type="info" plain icon="Upload" @click="handleImport">瀵煎叆</el-button>
+ <el-button type="warning" plain icon="Download" @click="handleExport"
+ :disabled="selectedRows.length !== 1">瀵煎嚭</el-button>
<el-button type="primary" @click="handleAdd">鏂板</el-button>
<el-button type="danger" plain @click="handleBatchDelete" :disabled="selectedRows.length === 0">鍒犻櫎</el-button>
</div>
- <PIMTable
- rowKey="id"
- :column="tableColumn"
- :tableData="tableData"
- :page="page"
- :isSelection="true"
- @selection-change="handleSelectionChange"
- :tableLoading="tableLoading"
- @pagination="pagination"
- >
- <template #detail="{row}">
- <el-button
- type="primary"
- text
- @click="showDetail(row)">{{ row.bomNo }}
+ <PIMTable rowKey="id" :column="tableColumn" :tableData="tableData" :page="page" :isSelection="true"
+ @selection-change="handleSelectionChange" :tableLoading="tableLoading" @pagination="pagination">
+ <template #detail="{ row }">
+ <el-button type="primary" text @click="showDetail(row)">{{ row.bomNo }}
</el-button>
</template>
</PIMTable>
- <StructureEdit v-if="showEdit" v-model:show-model="showEdit" :record="currentRow"/>
-
+ <StructureEdit v-if="showEdit" v-model:show-model="showEdit" :record="currentRow" />
+
<!-- 鏂板/缂栬緫寮圭獥 -->
- <el-dialog
- v-model="dialogVisible"
- :title="operationType === 'add' ? '鏂板BOM' : '缂栬緫BOM'"
- width="600px"
- @close="closeDialog"
- >
- <el-form
- ref="formRef"
- :model="form"
- :rules="rules"
- label-width="120px"
- >
+ <el-dialog v-model="dialogVisible" :title="operationType === 'add' ? '鏂板BOM' : '缂栬緫BOM'" width="600px"
+ @close="closeDialog">
+ <el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
<el-form-item label="浜у搧鍚嶇О" prop="productModelId">
<el-button type="primary" @click="showProductSelectDialog = true">
{{ form.productName || '閫夋嫨浜у搧' }}
@@ -46,13 +29,7 @@
<el-input v-model="form.version" placeholder="璇疯緭鍏ョ増鏈彿" clearable />
</el-form-item>
<el-form-item label="澶囨敞" prop="remark">
- <el-input
- v-model="form.remark"
- type="textarea"
- :rows="3"
- placeholder="璇疯緭鍏ュ娉�"
- clearable
- />
+ <el-input v-model="form.remark" type="textarea" :rows="3" placeholder="璇疯緭鍏ュ娉�" clearable />
</el-form-item>
</el-form>
<template #footer>
@@ -60,19 +37,37 @@
<el-button type="primary" @click="handleSubmit">纭畾</el-button>
</template>
</el-dialog>
-
+
<!-- 浜у搧閫夋嫨寮圭獥 -->
- <ProductSelectDialog
- v-model="showProductSelectDialog"
- @confirm="handleProductSelect"
- single
- />
+ <ProductSelectDialog v-model="showProductSelectDialog" @confirm="handleProductSelect" single />
+
+ <!-- BOM瀵煎叆瀵硅瘽妗� -->
+ <el-dialog :title="upload.title" v-model="upload.open" width="400px" append-to-body>
+ <el-upload ref="uploadRef" :limit="1" accept=".xlsx, .xls" :headers="upload.headers" :action="upload.url"
+ :disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess"
+ :auto-upload="false" drag>
+ <el-icon class="el-icon--upload"><upload-filled /></el-icon>
+ <div class="el-upload__text">灏嗘枃浠舵嫋鍒版澶勶紝鎴�<em>鐐瑰嚮涓婁紶</em></div>
+ <template #tip>
+ <div class="el-upload__tip text-center">
+ <span>浠呭厑璁稿鍏ls銆亁lsx鏍煎紡鏂囦欢銆�</span>
+ </div>
+ </template>
+ </el-upload>
+ <template #footer>
+ <div class="dialog-footer">
+ <el-button type="primary" @click="submitFileForm">纭� 瀹�</el-button>
+ <el-button @click="upload.open = false">鍙� 娑�</el-button>
+ </div>
+ </template>
+ </el-dialog>
</div>
</template>
<script setup>
import { ref, reactive, toRefs, onMounted, getCurrentInstance, defineAsyncComponent } from "vue";
-import { listPage, add, update, batchDelete } from "@/api/productionManagement/productBom.js";
+import { getToken } from "@/utils/auth";
+import { listPage, add, update, batchDelete, exportBom } from "@/api/productionManagement/productBom.js";
import { useRouter } from 'vue-router'
import { ElMessageBox } from 'element-plus'
import ProductSelectDialog from "@/views/basicData/product/ProductSelectDialog.vue";
@@ -92,7 +87,7 @@
{
label: "浜у搧鍚嶇О",
prop: "productName",
-
+
minWidth: 160
},
{
@@ -145,6 +140,20 @@
const operationType = ref('add'); // add | edit
const formRef = ref(null);
const showProductSelectDialog = ref(false);
+
+// BOM瀵煎叆鍙傛暟
+const upload = reactive({
+ // 鏄惁鏄剧ず寮瑰嚭灞傦紙BOM瀵煎叆锛�
+ open: false,
+ // 寮瑰嚭灞傛爣棰橈紙BOM瀵煎叆锛�
+ title: "",
+ // 鏄惁绂佺敤涓婁紶
+ isUploading: false,
+ // 璁剧疆涓婁紶鐨勮姹傚ご閮�
+ headers: { Authorization: "Bearer " + getToken() },
+ // 涓婁紶鐨勫湴鍧�
+ url: import.meta.env.VITE_APP_BASE_API + "/productBom/uploadBom"
+});
const page = reactive({
current: 1,
@@ -246,7 +255,7 @@
proxy.$modal.msgError('鍒犻櫎澶辫触');
});
})
- .catch(() => {});
+ .catch(() => { });
};
// 鎵归噺鍒犻櫎
@@ -271,7 +280,7 @@
proxy.$modal.msgError('鍒犻櫎澶辫触');
});
})
- .catch(() => {});
+ .catch(() => { });
};
// 浜у搧閫夋嫨
@@ -321,6 +330,73 @@
formRef.value?.resetFields();
};
+// 瀵煎叆鎸夐挳鎿嶄綔
+const handleImport = () => {
+ upload.title = "BOM瀵煎叆";
+ upload.open = true;
+};
+
+// 鏂囦欢涓婁紶涓鐞�
+const handleFileUploadProgress = (event, file, fileList) => {
+ upload.isUploading = true;
+};
+
+// 鏂囦欢涓婁紶鎴愬姛澶勭悊
+const handleFileSuccess = (response, file, fileList) => {
+ upload.open = false;
+ upload.isUploading = false;
+ proxy.$refs["uploadRef"].handleRemove(file);
+ if (response.code === 200) {
+ proxy.$modal.msgSuccess(response.msg || "瀵煎叆鎴愬姛");
+ getList();
+ } else {
+ proxy.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "瀵煎叆缁撴灉", { dangerouslyUseHTMLString: true });
+ }
+};
+
+// 鎻愪氦涓婁紶鏂囦欢
+const submitFileForm = () => {
+ proxy.$refs["uploadRef"].submit();
+};
+
+// 瀵煎嚭鎸夐挳鎿嶄綔
+const handleExport = () => {
+ if (selectedRows.value.length !== 1) {
+ proxy.$modal.msgWarning("璇烽�夋嫨涓�鏉℃暟鎹繘琛屽鍑�");
+ return;
+ }
+
+ const bomId = selectedRows.value[0].id;
+ const fileName = `BOM_${selectedRows.value[0].bomNo || bomId}.xlsx`;
+
+ exportBom(bomId).then(res => {
+ // 杩斿洖鐨勬暟鎹槸鍚︿负绌�
+ if (!res) {
+ proxy.$modal.msgError("瀵煎嚭澶辫触锛岃繑鍥炴暟鎹负绌�");
+ return;
+ }
+
+ const blob = new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
+ const downloadElement = document.createElement('a');
+ const href = window.URL.createObjectURL(blob);
+
+ downloadElement.style.display = 'none';
+ downloadElement.href = href;
+ downloadElement.download = fileName;
+
+ document.body.appendChild(downloadElement);
+ downloadElement.click();
+
+ document.body.removeChild(downloadElement);
+ window.URL.revokeObjectURL(href);
+
+ proxy.$modal.msgSuccess("瀵煎嚭鎴愬姛");
+ }).catch(err => {
+ console.error("瀵煎嚭寮傚父锛�", err);
+ proxy.$modal.msgError("绯荤粺寮傚父锛屽鍑哄け璐�");
+ });
+};
+
// 鏌ョ湅璇︽儏
const showDetail = (row) => {
router.push({
--
Gitblit v1.9.3