基础上传功能实现

electron.vite.config.mjs

@@ -21,7 +21,8 @@ export default defineConfig({
     server: {
       proxy: {
         '/dev-api': {
-          target: 'http://27.128.240.72:7865',
+          // target: 'http://27.128.240.72:7865',
+          target: 'http://192.168.2.52:7863',
           changeOrigin: true,
           rewrite: (p) => p.replace(/^\/dev-api/, '')
         }

src/renderer/src/components/file-upload/index.vue

@@ -0,0 +1,39 @@
+<template>
+  <el-upload
+    v-bind="$attrs"
+    :action="uploadUrl"
+    name="file"
+    :headers="headers"
+    :data="uploadData"
+    :show-file-list="false"
+    class="editor-img-uploader"
+  >
+    <slot>
+      <el-button>文件上传</el-button>
+    </slot>
+  </el-upload>
+</template>
+<script>
+import { getToken } from '@/utils/auth'
+export default {
+  name: 'Prepare',
+  props: {
+    uploadData: {
+      type: Object,
+      default: null
+    }
+  },
+  data() {
+    return {
+      uploadUrl: import.meta.env.VITE_APP_BASE_API + '/smarttalk/file/upload',
+      headers: {
+        Authorization: 'Bearer ' + getToken()
+      }
+    }
+  },
+  created() {},
+  mounted() {},
+  methods: {}
+}
+</script>
+<style scoped lang="scss"></style>

src/renderer/src/views/prepare/index.vue

@@ -1,41 +1 @@
-<template>
+<template>
  <div>
    <FileUpload
      :multiple="true"
      :before-upload="handleBeforeUpload"
      :upload-data="uploadData"
    ></FileUpload>
  </div>
</template>
<script>
import FileUpload from '@/components/file-upload/index.vue'
export default {
  name: 'Prepare',
  components: { FileUpload },
  data() {
    return {
      uploadData: {
        textbookId: '123',
        levelFirstId: '123',
        levelSecondId: '123',
        fileSource: '平台',
        fileFlag: '课件'
      }
    }
  },
  created() {},
  mounted() {},
  methods: {
    handleBeforeUpload(file) {
      console.log(file)
    }
  }
}
</script>
<style scoped lang="scss"></style>
-  <div>
-    <el-upload
-      :action="uploadUrl"
-      :before-upload="handleBeforeUpload"
-      :on-success="handleUploadSuccess"
-      :on-error="handleUploadError"
-      name="file"
-      :show-file-list="false"
-      class="editor-img-uploader"
-    >
-      上传
-    </el-upload>
-  </div>
-</template>
-<script>
-export default {
-  name: 'Prepare',
-  data() {
-    return {
-      uploadUrl: import.meta.env.VITE_APP_BASE_API + '/smarttalk/file/upload'
-    }
-  },
-  created() {
-  },
-  mounted() {
-  },
-  methods: {
-    handleBeforeUpload(file) {
-      console.log(file)
-    },
-    handleUploadSuccess(res, file) {
-      console.log(res, file)
-    },
-    handleUploadError(error) {
-      console.log(error)
-    }
-  }
-}
-</script>
-<style scoped lang="scss"></style>