From 8e47c0ef8ff53a9b821179ee184c3e8f20ba94ee Mon Sep 17 00:00:00 2001
From: shijing <sj_mzw@163.com>
Date: Fri, 20 Mar 2026 09:56:03 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E6=9D=90=E6=96=99=E7=AE=A1=E7=90=86?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E4=B8=AD=E7=82=B9=E5=87=BB=E5=AF=BC=E5=85=A5?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE=E6=8C=89=E9=92=AE=EF=BC=8C=E6=89=93=E5=BC=80?=
 =?UTF-8?q?=E4=B8=80=E4=B8=AA=E5=BC=B9=E7=AA=97=EF=BC=8C=E6=8A=8A=E6=A8=A1?=
 =?UTF-8?q?=E6=9D=BF=E4=B8=8B=E8=BD=BD=E5=92=8C=E4=B8=8A=E4=BC=A0=E6=8C=89?=
 =?UTF-8?q?=E9=92=AE=E6=94=BE=E5=9C=A8=E9=87=8C=E9=9D=A2=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/views/MaterialManage.vue | 50 ++++++++++++++++++++-------
 1 file changed, 38 insertions(+), 12 deletions(-)

diff --git a/frontend/src/views/MaterialManage.vue b/frontend/src/views/MaterialManage.vue
index 96897b6..e6a18ae 100644
--- a/frontend/src/views/MaterialManage.vue
+++ b/frontend/src/views/MaterialManage.vue
@@ -10,20 +10,11 @@
         <el-option v-for="item in filterSubcategoryOptions" :key="item.value" :label="item.name" :value="item.value" />
       </el-select>
       <el-button @click="loadMaterials">查询</el-button>
-      <el-upload
-        v-if="isAdmin"
-        :auto-upload="true"
-        :show-file-list="false"
-        :http-request="handleImportExcel"
-        accept=".xlsx"
-      >
-        <el-button :loading="importing">{{ importing ? '导入中...' : '导入数据' }}</el-button>
-      </el-upload>
+      <el-button v-if="isAdmin" :loading="importing" @click="importDialogVisible = true">
+        {{ importing ? '导入中...' : '导入数据' }}
+      </el-button>
       <el-button type="primary" @click="openCreate">新增材料</el-button>
       <div class="toolbar-spacer" />
-      <a href="http://101.42.1.64:2260/media/material_import_template.xlsx" download="材料导入模板.xlsx">
-        <el-button>模板</el-button>
-      </a>
     </div>
 
     <el-table v-loading="tableLoading" :data="materials" border :max-height="560">
@@ -206,6 +197,25 @@
         <el-button type="primary" @click="onSave">保存</el-button>
       </template>
     </el-dialog>
+
+    <el-dialog v-model="importDialogVisible" title="导入材料" width="420px">
+      <div class="import-dialog">
+        <div class="import-dialog__text">请先下载模板，按模板填写后上传 `.xlsx` 文件。</div>
+        <div class="import-dialog__actions">
+          <a :href="templateDownloadUrl" download="材料导入模板.xlsx">
+            <el-button>模板下载</el-button>
+          </a>
+          <el-upload
+            :auto-upload="true"
+            :show-file-list="false"
+            :http-request="handleImportExcel"
+            accept=".xlsx"
+          >
+            <el-button type="primary" :loading="importing">{{ importing ? '导入中...' : '上传文件' }}</el-button>
+          </el-upload>
+        </div>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
@@ -229,11 +239,14 @@ const pagination = reactive({
 })
 const factories = ref([])
 const dialogVisible = ref(false)
+const importDialogVisible = ref(false)
 const dialogTitle = ref('')
 const isEdit = ref(false)
 const currentId = ref(null)
 const uploading = ref(false)
 const importing = ref(false)
+const apiBaseUrl = (import.meta.env.VITE_API_BASE_URL || '/api').replace(/\/$/, '')
+const templateDownloadUrl = `${apiBaseUrl}/material/template/`
 
 const filters = reactive({
   name: '',
@@ -457,6 +470,7 @@ const handleImportExcel = async (options) => {
     const result = await importMaterialsExcel(options.file)
     pagination.page = 1
     await loadMaterials()
+    importDialogVisible.value = false
     ElMessage.success(`导入完成：新增 ${result.created} 条，更新 ${result.updated} 条，跳过 ${result.skipped} 条，新建工厂 ${result.created_factory || 0} 条`)
   } catch (error) {
     ElMessage.error(error.response?.data?.detail || '导入失败')
@@ -527,6 +541,18 @@ onMounted(() => {
   flex: 1 1 auto;
 }
 
+.import-dialog__text {
+  color: #606266;
+  line-height: 1.6;
+}
+
+.import-dialog__actions {
+  margin-top: 20px;
+  display: flex;
+  justify-content: flex-end;
+  gap: 12px;
+}
+
 .pagination {
   margin-top: 16px;
   display: flex;