Skip to content

BaseUploadPopUp

A component taking care of uploads within a pop up

Props

Prop nameDescriptionTypeValuesDefault
fileListregister files to upload
array with file-object(s) from file-input field
array-[]
currentStatusdefine current statusstringinitial, saving, success, failed'initial'
cancelButtonTextdefine button text
could be string or path to i18n json as well
string-'cancel'
uploadTextspecify informational texts for the component -
this needs to be an object with the following properties:

title string - text used in the popup header
upload string - default button text
done string - button text when upload finished
retry string - button text when an upload error occurs
quotaExceeded - string text used when user quota is exceeded

The values of this object might be plain text or a key for an i18n file
object-{
title: 'File Upload',
upload: 'Upload',
done: 'Done',
retry: 'Try Again',

quotaExceeded: 'Unfortunately you exceeded your quota, because you have '
+ 'only {space} of space left. Please remove some files to enable uploading.'
}
uploadPercentagecurrent upload progress in percent per file
array with current upload progress per file
e.g. [11, 55, 100]
array-[]
userSpacedefine current free storage space (bytes)number-10000000
rejectedFilesdefine rejected files
array with filename(s)
array-[]
uploadedFilesdefine uploaded files
array with filename(s)
array-[]
fileErrorsdefine errors for rejected files
array with objects
eg: [{ name: 'foo.txt', message: 'The file may include a virus' }]
Note: each object must contain the properties: name, message
array-[]

Events

Event namePropertiesDescription
remove-fileundefined number - index of the file entryEvent emitted when remove button on file entry is clicked
start-uploadEvent emitted when upload button is clicked
cancel-uploadEvent emitted when cancel button is clicked

Slots

NameDescriptionBindings
defaultslot for additional content after upload bars but before buttons

Demo