ads_web/src/views/demo/index.vue

<template>
  <!-- <fs-page>
    <fs-crud ref="crudRef" v-bind="crudBinding" />
  </fs-page> -->
  <el-upload
    v-model:file-list="fileList"
    action="#"
    method="post"
    :data="{profileId: 'xxxx'}"
    multiple
    :on-progress="onProgress"
    :auto-upload="true"
    :on-success="onSuccess"
    :http-request="submit"
    >
    <el-button type="primary">Click to upload</el-button>
  </el-upload>
  <el-button @click="submit">上传</el-button>
</template>

<script lang="ts" setup>
import { ref, onMounted } from 'vue'
import { useFs } from '@fast-crud/fast-crud'
import { createCrudOptions } from './crud'

import { request } from '/@/utils/service'

import type { UploadProps, UploadUserFile, UploadFile, UploadFiles, UploadProgressEvent } from 'element-plus'

const fileList = ref<UploadUserFile[]>([])
const onProgress = (evt: UploadProgressEvent, uploadFile: UploadFile, uploadFiles: UploadFiles) => {
  console.log(evt)
  console.log(uploadFile)
}
const onSuccess = (response: any, uploadFile: UploadFile, uploadFiles: UploadFiles) => {
  console.log(response)
  console.log(uploadFile)
  console.log(uploadFiles)
}

const submit = () => {
  const formData = new FormData();
  formData.append('file', fileList.value[0].raw)
  formData.append('profileId', 'xxxx')
  return request({
    url: 'http://127.0.0.1:8003/api/amazon/assets/upload/',
    headers: {
      'Content-Type': 'multipart/form-data'
    },
    method: 'post',
    data: formData
  })
}

const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions })

onMounted(async () => {
  crudExpose.doRefresh()
})
</script>

<style scoped></style>