修复上传bug

package.json

@@ -1,6 +1,6 @@
 {
   "name": "fs-admin",
-  "version": "1.7.8",
+  "version": "1.8.0",
   "scripts": {
     "dev": "vite --host",
     "build": "run-p type-check build-only",

src/components/core/form/BasicForm.vue

@@ -18,11 +18,11 @@ const formData = computed(() => {
         props.formData[item.name] = props.formData[item.name]
           .split(',')
           .filter((item: string) => item)
-          .map((item: string) => ({ url: config.oss ? config.ossHost + item : item }))
+          .map((item: string) => ({ url: item }))
       } else if (item.type === 'file-upload' && typeof props.formData[item.name] === 'string') {
         try {
           props.formData[item.name] = JSON.parse(props.formData[item.name] || '[]').map((item: any) => ({
-            url: config.oss ? config.ossHost + item.url : item.url,
+            url: item.url,
             name: item.name
           }))
         } catch (error) {
@@ -39,11 +39,15 @@ const formData = computed(() => {
         if (!item.notFormItem || !notFormItem.includes(item.type)) {
           // 将上传的值改成数组
           if (['upload', 'image-upload'].includes(item.type) && !Array.isArray(item.value)) {
-            item.value = item.value?.split(',').filter((item: string) => item) || []
+            item.value =
+              item.value
+                ?.split(',')
+                .filter((item: string) => item)
+                .map((item: string) => ({ url: item })) || []
           } else if (item.type === 'file-upload' && typeof item.value === 'string') {
             try {
               item.value = JSON.parse(item.value || '[]').map((item: any) => ({
-                url: config.oss ? config.ossHost + item.url : item.url,
+                url: item.url,
                 name: item.name
               }))
             } catch (error) {

src/components/core/form/ProForm.vue

@@ -46,7 +46,6 @@ const submit = async () => {
             data[item.name] = data[item.name].join(',')
           }
         } else if (item.type === 'file-upload') {
-          console.log(item.extra)
           data[item.name] = JSON.stringify(item.extra)
         }
       })

src/components/form/ElFileUpload.vue

@@ -43,25 +43,23 @@ const beforeUpload: UploadProps['beforeUpload'] = rawFile => {
 }
 
 // 上传成功
-const handleUploadSuccess: UploadProps['onSuccess'] = (response, uploadFile: UploadFile) => {
+const uploadList = ref([...props.modelValue])
+const handleUploadSuccess: UploadProps['onSuccess'] = (response, uploadFile: UploadFile, uploadFiles: UploadFile[]) => {
   if (response.success || response.code === 200) {
     // 附加oss路径
-    modelValue.value.forEach((item: any) => {
-      if (item.uid === uploadFile.uid) {
-        item.extra = {
-          url: props.oss ? response.url : config.uploadSuccessCb(response),
-          name: uploadFile.name
-        }
-      }
-    })
+    uploadList.value = uploadFiles
   } else {
     ElMessage.error(response.msg)
   }
 }
 
 // 接口需要的属性
-props.item.extra = computed(() => modelValue.value.map((item: any) => item.extra))
-
+props.item.extra = computed(() =>
+  uploadList.value.map((item: any) => ({
+    name: item.name,
+    url: item.response?.url || item.url
+  }))
+)
 // 动态属性
 const attrs: any = props.oss ? { 'http-request': ossUpload } : {}
 if (!props.item.props?.onSuccess) {

src/components/form/ElImageUpload.vue

@@ -27,19 +27,29 @@ const props = withDefaults(defineProps<Props>(), {
 })
 const emits = defineEmits(['update:modelValue'])
 
+const baseApi = import.meta.env.VITE_BASE_API
 const modelValue = computed({
   get: () => props.modelValue,
   set: value => emits('update:modelValue', value)
 })
 
 const user = useUserStore()
-const baseApi = import.meta.env.VITE_BASE_API
 const headers = reactive({
   [ACCESS_TOKEN]: user.token
 })
 
 const limit = Number(props.limit) || 1
 
+// 生成图片地址
+const prefix = props.oss ? config.ossHost : baseApi
+const genImageUrl = (url: string) => {
+  if (url.startsWith('blob:') || isAbsolutePath(url)) {
+    return url
+  } else {
+    return prefix + url
+  }
+}
+
 const uploadRef = ref()
 // 在上传之前对文件进行验证
 const fileSize = Number(props.fileSize) || 10
@@ -52,14 +62,12 @@ const beforeUpload: UploadProps['beforeUpload'] = rawFile => {
 }
 
 // 图片上传成功
-const handleUploadSuccess: UploadProps['onSuccess'] = (response, uploadFile: UploadFile) => {
+const uploadList = ref([...props.modelValue])
+const handleUploadSuccess: UploadProps['onSuccess'] = (response, uploadFile: UploadFile, uploadFiles: UploadFile[]) => {
+  console.log('uploadFiles', uploadFiles)
   if (response.success || response.code === 200) {
     // 附加oss路径
-    modelValue.value.forEach((item: any) => {
-      if (item.uid === uploadFile.uid) {
-        item.extra = props.oss ? response.url : config.uploadSuccessCb(response)
-      }
-    })
+    uploadList.value = uploadFiles
   } else {
     ElMessage.error(response.msg)
   }
@@ -71,7 +79,7 @@ const handleRemove = (file: UploadFile) => {
 // 图片预览
 const showViewer = ref(false)
 const previewIndex = ref(0)
-const previewList = computed(() => modelValue.value.map((item: any) => item.url))
+const previewList = computed(() => modelValue.value.map((item: any) => genImageUrl(item.url)))
 const handlePreview = (file: UploadFile) => {
   previewIndex.value = modelValue.value.findIndex((item: any) => item.url === file.url)
   showViewer.value = true
@@ -81,7 +89,7 @@ const closeViewer = () => {
 }
 
 // 接口需要的属性
-props.item.extra = computed(() => modelValue.value.map((item: any) => item.extra))
+props.item.extra = computed(() => uploadList.value.map((item: any) => item.response?.url || item.url))
 
 // 动态属性
 const attrs: any = props.oss ? { 'http-request': ossUpload } : {}
@@ -105,7 +113,7 @@ if (!props.item.props?.onSuccess) {
   >
     <el-icon class="avatar-uploader-icon" :style="{ fontSize: iconSize }"><Plus /></el-icon>
     <template #file="{ file }">
-      <el-image class="el-upload-list__item-thumbnail" :src="file.url" fit="cover" />
+      <el-image class="el-upload-list__item-thumbnail" :src="genImageUrl(file.url)" fit="cover" />
       <span class="el-upload-list__item-actions">
         <span class="el-upload-list__item-preview" @click="handlePreview(file)">
           <el-icon><zoom-in /></el-icon>

src/stores/user.ts

@@ -8,7 +8,7 @@ export const useUserStore = defineStore({
     flag: false,
     token:
       localStorage.getItem('token') ||
-      'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhdWQiOiI1NjQ0MzBmMDNhYWU0NmExODE2YmU1YmI4NDExY2RmNiIsImV4cCI6MTcwMDUzMDE0MiwiaWF0IjoxNzAwNDQzNzQyfQ.zPp2URyuC6Wv0CquFKz8Pwq5eyittxRSFcUQx0g0Pdo'
+      'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhdWQiOiI1NjQ0MzBmMDNhYWU0NmExODE2YmU1YmI4NDExY2RmNiIsImV4cCI6MTcwMDYxNzM5MywiaWF0IjoxNzAwNTMwOTkzfQ.aTrrVZj9G-WOw4841YSbISrBoz19SkTlpqfYgpVv6vI'
   }),
   actions: {
     async getUserInfo() {

src/views/form/Basic.vue

@@ -249,7 +249,7 @@ const formConfig = reactive<BasicForm>({
     },
     {
       label: '文件',
-      value: [],
+      value: 'erp/prod/temp/1700475908958.png,erp/prod/temp/1700475908960.png',
       name: 'picture',
       type: 'image-upload',
       props: {
@@ -259,7 +259,7 @@ const formConfig = reactive<BasicForm>({
     },
     {
       label: '文件',
-      value: '',
+      value: '[{"name":"1.png","url":"erp/prod/temp/1700531770130.png"}]',
       name: 'file',
       type: 'file-upload',
       slots: [

src/views/system/User.vue

@@ -20,33 +20,6 @@ const CRUD: ICRUD = {
     return saveUser(data)
   },
   getList(data: any) {
-    return Promise.resolve({
-      list: [
-        {
-          id: 1,
-          name: 'admin',
-          loginName: 'admin',
-          roleList: [
-            {
-              id: 1,
-              name: '管理员'
-            }
-          ],
-          file: ''
-        },
-        {
-          id: 2,
-          name: 'test',
-          loginName: 'test',
-          roleList: [
-            {
-              id: 1,
-              name: '管理员'
-            }
-          ]
-        }
-      ]
-    })
     return getUserList(data)
   },
   delete(data: any) {
@@ -71,18 +44,6 @@ const duplicate = (rule: any, value: any, callback: any) => {
 }
 const formConfig = reactive<BasicForm>({
   formItems: [
-    {
-      label: '文件',
-      value: '',
-      name: 'file',
-      type: 'file-upload',
-      slots: [
-        {
-          name: 'default',
-          alias: 'file'
-        }
-      ]
-    },
     {
       label: '用户名',
       value: '',