- <template>
- <el-upload
- v-loading.fullscreen.lock="loading"
- element-loading-text="加载中..."
- element-loading-background="rgba(0, 0, 0, 0.6)"
- class="upload"
- accept=".xls, .xlsx"
- :action="props.action"
- :data="props.data"
- :headers="uploadHeader"
- :before-upload="beforeUpload"
- :on-success="onSuccess"
- :on-error="onError"
- :disabled="props.disabled"
- >
- <slot></slot>
- </el-upload>
- </template>
-
- <script setup>
- import { getToken } from "@/utils/auth"
-
- const props = defineProps({
- action: {
- type: String,
- default: '/prod-api/system/upload'
- },
- data: {
- type: Object,
- default: () => {}
- },
- disabled: {
- type: Boolean,
- default: false
- }
- })
-
- const emit = defineEmits(['success'])
-
- const uploadHeader = ref({
- Authorization: "Bearer " + getToken(),
- });
-
- const loading = ref(false)
-
- const beforeUpload = (rawFile) => {
- console.log(rawFile)
- loading.value = true
- return true
- }
-
- const onSuccess = (response, uploadFile, uploadFiles) => {
- loading.value = false
- const data = response.data
- emit('success', data)
- }
-
- const onError = (error, uploadFile, uploadFiles) => {
- console.log(error, uploadFile, uploadFiles)
- loading.value = false
- }
- </script>
-
- <style lang="scss" scoped>
- .upload {
- display: inline-block;
- ::v-deep(.el-upload-list) {
- display: none;
- }
- }
-
- </style>