feat: provide components for uploading files

spx-gui/package.json

@@ -22,6 +22,7 @@
  "nanoid": "^5.0.5",
  "pinia": "^2.1.7",
  "pinia-plugin-persistedstate": "^3.2.1",
+ "qiniu-js": "^3.4.2",
  "vicons": "^0.0.1",
  "vue": "^3.3.11",
  "vue-i18n": "^9.9.0",

spx-gui/src/axios/index.ts

@@ -10,7 +10,7 @@ import { createDiscreteApi } from 'naive-ui'
 import axios, { type AxiosResponse } from 'axios'
 import { useUserStore } from '@/store'
 
-const baseURL = 'http://116.62.66.126:8080'
+const baseURL = import.meta.env.VITE_API_BASE;
 
 const service = axios.create({
  baseURL: baseURL,

spx-gui/src/util/utils.ts

@@ -0,0 +1,38 @@
+import * as qiniu from 'qiniu-js'
+import { service } from '@/axios'
+
+async function getUploadToken() {
+ try {
+ const response = await service.get('/project/upload-token')
+ return response.data.data
+ } catch (error) {
+ console.error(error)
+ return null
+ }
+}
+
+async function uploadFile(file: File) {
+ const token = await getUploadToken()
+ if (!token) {
+ throw new Error('Unable to get upload token')
+ }
+ return new Promise((resolve, reject) => {
+
+ const observable = qiniu.upload(file, null, token)
+ observable.subscribe({
+ next(res) {
+ console.log('upload progress: ', res.total.percent)
+ },
+ error(err) {
+ console.error('Upload failed:', err)
+ reject(err)
+ },
+ complete(res) {
+ const url = import.meta.env.VITE_KODO_ADDRESS + '/' + `${res.key}`
+ resolve(url)
+ }
+ })
+ })
+}
+
+export { uploadFile }