123

src/api/index.js

@@ -7,3 +7,4 @@ export const fetchData = query => {
         params: query
     });
 };
+

src/page/nicad.vue

@@ -22,7 +22,13 @@
             :disabled="item.disabled"
         />
       </el-select>
-      <el-upload class="upload-demo" drag action="/api/uploadFile" multiple>
+      <el-upload class="upload-demo"
+                 drag
+                 action="/api/upload/renameFiles"
+                 multiple
+                 :data="fileData"
+                 :on-success="uploadSuccess"
+                        >
         <i class="el-icon-upload"></i>
         <div class="el-upload__text">
           将文件拖到此处，或
@@ -40,7 +46,7 @@
 </template>
 
 <script>
-import {ref} from "vue";
+import {reactive, ref} from "vue";
 import VueCropper from "vue-cropperjs";
 import "cropperjs/dist/cropper.css";
 import { ElMessage } from 'element-plus'
@@ -80,12 +86,38 @@ export default {
       // 先检测是否选择语言类型
       if (value.value != '') {
         //检测是否上传成功代码
+        if (uploadStatus.value == true) {
+          // 已经上传成功代码 可以执行检测
+        }
       }else {
         // 未选择类型 弹窗提示
         ElMessage.warning("请选择语言类型")
       }
     }
 
+    const fileData = reactive({
+      type: 'nicad'
+    })
+
+    //上传状态成功之后调用方法
+    function uploadSuccess(response){
+      if (response.status == 0) {
+        ElMessage.success("上传成功")
+        uploadStatus.value = true
+        fileName.value = response.fileName
+
+      }else {
+        ElMessage.error("上传失败")
+      }
+    }
+
+
+
+
+    // 文件上传结果
+    const uploadStatus = ref(false)
+    // 服务器中文件名称
+    const fileName = ref('')
     return {
 
       //语言选择框选定数据
@@ -93,7 +125,12 @@ export default {
       //待选数据
       options,
       // 检测方法
-      nicadCheck
+      nicadCheck,
+
+      fileData,
+      uploadSuccess,
+      uploadStatus,
+      fileName
     };
   },
 };