From 26c1bdffec1f61fbc7014a4457d239c1597e3d50 Mon Sep 17 00:00:00 2001
From: spring <2396852758@qq.com>
Date: 星期四, 15 一月 2026 09:43:58 +0800
Subject: [PATCH] fix: 工序-添加导入功能
---
src/views/productionManagement/productionProcess/index.vue | 83 ++++++++++++++++
src/api/productionManagement/productionProcess.js | 18 +++
src/components/Dialog/ImportDialog.vue | 172 ++++++++++++++++++++++++++++++++++
3 files changed, 271 insertions(+), 2 deletions(-)
diff --git a/src/api/productionManagement/productionProcess.js b/src/api/productionManagement/productionProcess.js
index e3cd929..d3a453c 100644
--- a/src/api/productionManagement/productionProcess.js
+++ b/src/api/productionManagement/productionProcess.js
@@ -48,4 +48,22 @@
url: "/productProcess/list",
method: "get",
});
+}
+
+// 瀵煎叆鏁版嵁
+export function importData(data) {
+ return request({
+ url: "/productProcess/importData",
+ method: "post",
+ data: data,
+ });
+}
+
+// 涓嬭浇妯℃澘
+export function downloadTemplate() {
+ return request({
+ url: "/productProcess/downloadTemplate",
+ method: "post",
+ responseType: "blob",
+ });
}
\ No newline at end of file
diff --git a/src/components/Dialog/ImportDialog.vue b/src/components/Dialog/ImportDialog.vue
new file mode 100644
index 0000000..5b126dc
--- /dev/null
+++ b/src/components/Dialog/ImportDialog.vue
@@ -0,0 +1,172 @@
+<template>
+ <el-dialog
+ :title="title"
+ v-model="dialogVisible"
+ :width="width"
+ :append-to-body="appendToBody"
+ @close="handleClose"
+ >
+ <el-upload
+ ref="uploadRef"
+ :limit="limit"
+ :accept="accept"
+ :headers="headers"
+ :action="action"
+ :disabled="disabled"
+ :before-upload="beforeUpload"
+ :on-progress="onProgress"
+ :on-success="onSuccess"
+ :on-error="onError"
+ :on-change="onChange"
+ :auto-upload="autoUpload"
+ drag
+ >
+ <el-icon class="el-icon--upload"><UploadFilled /></el-icon>
+ <div class="el-upload__text">灏嗘枃浠舵嫋鍒版澶勶紝鎴�<em>鐐瑰嚮涓婁紶</em></div>
+ <template #tip>
+ <div class="el-upload__tip text-center">
+ <span>{{ tipText }}</span>
+ <el-link
+ v-if="showDownloadTemplate"
+ type="primary"
+ :underline="false"
+ style="font-size: 12px; vertical-align: baseline; margin-left: 5px;"
+ @click="handleDownloadTemplate"
+ >涓嬭浇妯℃澘</el-link
+ >
+ </div>
+ </template>
+ </el-upload>
+ <template #footer>
+ <div class="dialog-footer">
+ <el-button type="primary" @click="handleConfirm">纭� 瀹�</el-button>
+ <el-button @click="handleCancel">鍙� 娑�</el-button>
+ </div>
+ </template>
+ </el-dialog>
+</template>
+
+<script setup>
+import { computed, ref } from 'vue'
+import { UploadFilled } from '@element-plus/icons-vue'
+
+const props = defineProps({
+ modelValue: {
+ type: Boolean,
+ default: false
+ },
+ title: {
+ type: String,
+ default: '瀵煎叆'
+ },
+ width: {
+ type: String,
+ default: '400px'
+ },
+ appendToBody: {
+ type: Boolean,
+ default: true
+ },
+ limit: {
+ type: Number,
+ default: 1
+ },
+ accept: {
+ type: String,
+ default: '.xlsx, .xls'
+ },
+ headers: {
+ type: Object,
+ default: () => ({})
+ },
+ action: {
+ type: String,
+ required: true
+ },
+ disabled: {
+ type: Boolean,
+ default: false
+ },
+ autoUpload: {
+ type: Boolean,
+ default: false
+ },
+ tipText: {
+ type: String,
+ default: '浠呭厑璁稿鍏ls銆亁lsx鏍煎紡鏂囦欢銆�'
+ },
+ showDownloadTemplate: {
+ type: Boolean,
+ default: true
+ },
+ beforeUpload: {
+ type: Function,
+ default: null
+ },
+ onProgress: {
+ type: Function,
+ default: null
+ },
+ onSuccess: {
+ type: Function,
+ default: null
+ },
+ onError: {
+ type: Function,
+ default: null
+ },
+ onChange: {
+ type: Function,
+ default: null
+ }
+})
+
+const emit = defineEmits(['update:modelValue', 'close', 'confirm', 'cancel', 'download-template'])
+
+const dialogVisible = computed({
+ get: () => props.modelValue,
+ set: (val) => emit('update:modelValue', val)
+})
+
+const uploadRef = ref(null)
+
+const handleClose = () => {
+ emit('close')
+}
+
+const handleConfirm = () => {
+ emit('confirm')
+}
+
+const submit = () => {
+ if (uploadRef.value) {
+ uploadRef.value.submit()
+ }
+}
+
+const handleCancel = () => {
+ emit('cancel')
+ dialogVisible.value = false
+}
+
+const handleDownloadTemplate = () => {
+ emit('download-template')
+}
+
+defineExpose({
+ uploadRef,
+ submit,
+ clearFiles: () => {
+ if (uploadRef.value) {
+ uploadRef.value.clearFiles()
+ }
+ }
+})
+</script>
+
+<style scoped>
+.dialog-footer {
+ text-align: center;
+}
+</style>
+
diff --git a/src/views/productionManagement/productionProcess/index.vue b/src/views/productionManagement/productionProcess/index.vue
index cbe55a6..7ab8c9a 100644
--- a/src/views/productionManagement/productionProcess/index.vue
+++ b/src/views/productionManagement/productionProcess/index.vue
@@ -30,6 +30,7 @@
class="mb10">
<el-button type="primary"
@click="showNewModal">鏂板宸ュ簭</el-button>
+ <el-button type="info" plain @click="handleImport">瀵煎叆</el-button>
<el-button type="danger"
@click="handleDelete"
:disabled="selectedRows.length === 0"
@@ -52,14 +53,29 @@
v-model:visible="isShowEditModal"
:record="record"
@completed="getList" />
+ <ImportDialog
+ ref="importDialogRef"
+ v-model="importDialogVisible"
+ title="瀵煎叆宸ュ簭"
+ :action="importAction"
+ :headers="importHeaders"
+ :auto-upload="false"
+ :on-success="handleImportSuccess"
+ :on-error="handleImportError"
+ @confirm="handleImportConfirm"
+ @download-template="handleDownloadTemplate"
+ @close="handleImportClose"
+ />
</div>
</template>
<script setup>
- import { onMounted, ref } from "vue";
+ import { onMounted, ref, reactive, toRefs, getCurrentInstance } from "vue";
import NewProcess from "@/views/productionManagement/productionProcess/New.vue";
import EditProcess from "@/views/productionManagement/productionProcess/Edit.vue";
- import { listPage, del } from "@/api/productionManagement/productionProcess.js";
+ import ImportDialog from "@/components/Dialog/ImportDialog.vue";
+ import { listPage, del, importData, downloadTemplate } from "@/api/productionManagement/productionProcess.js";
+ import { getToken } from "@/utils/auth";
const data = reactive({
searchForm: {
@@ -113,12 +129,18 @@
const isShowNewModal = ref(false);
const isShowEditModal = ref(false);
const record = ref({});
+ const importDialogVisible = ref(false);
+ const importDialogRef = ref(null);
const page = reactive({
current: 1,
size: 100,
total: 0,
});
const { proxy } = getCurrentInstance();
+
+ // 瀵煎叆鐩稿叧閰嶇疆
+ const importAction = import.meta.env.VITE_APP_BASE_API + "/productProcess/importData";
+ const importHeaders = { Authorization: "Bearer " + getToken() };
// 鏌ヨ鍒楄〃
/** 鎼滅储鎸夐挳鎿嶄綔 */
@@ -200,6 +222,63 @@
}
}
+ // 瀵煎叆
+ const handleImport = () => {
+ importDialogVisible.value = true;
+ };
+
+ // 纭瀵煎叆
+ const handleImportConfirm = () => {
+ if (importDialogRef.value) {
+ importDialogRef.value.submit();
+ }
+ };
+
+ // 瀵煎叆鎴愬姛
+ const handleImportSuccess = (response) => {
+ if (response.code === 200) {
+ proxy.$modal.msgSuccess("瀵煎叆鎴愬姛");
+ importDialogVisible.value = false;
+ if (importDialogRef.value) {
+ importDialogRef.value.clearFiles();
+ }
+ getList();
+ } else {
+ proxy.$modal.msgError(response.msg || "瀵煎叆澶辫触");
+ }
+ };
+
+ // 瀵煎叆澶辫触
+ const handleImportError = (error) => {
+ proxy.$modal.msgError("瀵煎叆澶辫触锛�" + (error.message || "鏈煡閿欒"));
+ };
+
+ // 鍏抽棴瀵煎叆寮圭獥
+ const handleImportClose = () => {
+ if (importDialogRef.value) {
+ importDialogRef.value.clearFiles();
+ }
+ };
+
+ // 涓嬭浇妯℃澘
+ const handleDownloadTemplate = async () => {
+ try {
+ const res = await downloadTemplate();
+ const blob = new Blob([res], {
+ type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+ });
+ const url = window.URL.createObjectURL(blob);
+ const link = document.createElement("a");
+ link.href = url;
+ link.download = "宸ュ簭瀵煎叆妯℃澘.xlsx";
+ link.click();
+ window.URL.revokeObjectURL(url);
+ proxy.$modal.msgSuccess("妯℃澘涓嬭浇鎴愬姛");
+ } catch (error) {
+ proxy.$modal.msgError("妯℃澘涓嬭浇澶辫触");
+ }
+ };
+
// 瀵煎嚭
// const handleOut = () => {
// ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚鍑猴紝鏄惁纭瀵煎嚭锛�", "瀵煎嚭", {
--
Gitblit v1.9.3