物品管理导入弹框和提示

src/views/material/product/components/index-data.vue

@@ -30,9 +30,10 @@
             v-if="!isLoading"
             :show-file-list="false"
             class="upload-demo"
-            action="#"
+            action=""
             :before-upload="beforeUpload"
-            :on-success="suuccessUpload"
+            :on-success="successUpload"
+            :on-error="errorUpload"
           >
             <slot>
               <el-button size="small" type="primary">导入</el-button>
@@ -173,6 +174,27 @@
 
     <!-- 干燥区 -->
     <aridRegion ref="aridRegionRef"></aridRegion>
+
+    <!-- 导入错误弹框 -->
+    <el-dialog
+      title="导入失败"
+      :visible.sync="exportErrorDioalogVisible"
+      width="60%"
+    >
+      <el-table :data="errorData" style="width: 100%">
+        <el-table-column label="名称" prop="name"> </el-table-column>
+        <el-table-column label="型号" prop="modeType"> </el-table-column>
+        <el-table-column label="编号" prop="codeNo"> </el-table-column>
+        <el-table-column label="物料组" prop="code"> </el-table-column>
+        <el-table-column label="失败原因" prop="remark"> </el-table-column>
+      </el-table>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="exportErrorDioalogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="exportErrorDioalogVisible = false"
+          >确 定</el-button
+        >
+      </span>
+    </el-dialog>
   </div>
 </template>
 
@@ -207,6 +229,8 @@
     },
     data() {
       return {
+        errorData: [],
+        exportErrorDioalogVisible: false,
         // 表格列配置
         columns: [
           {
@@ -318,7 +342,10 @@
     },
 
     methods: {
-      suuccessUpload() {
+      successUpload(response) {
+        this.isLoading = false;
+      },
+      errorUpload(response) {
         this.isLoading = false;
       },
       // 上传备品备件
@@ -336,8 +363,14 @@
         formData.append('file', file);
         this.isLoading = true;
         return importCategorySparePart(formData).then((res) => {
+          if (res.data.length > 0) {
+            this.exportErrorDioalogVisible = true;
+            this.errorData = res.data;
+          } else {
+            this.$message.success('导入成功！');
+          }
           this.isLoading = false;
-          return res.data;
+          return false;
         });
       },
       /* 表格数据源 */