DropzoneFileUpload.vue component is adjusted
This commit is contained in:
parent
a0dcfa90b5
commit
6f8ebf91e8
@ -81,6 +81,7 @@
|
|||||||
Dropzone.autoDiscover = false
|
Dropzone.autoDiscover = false
|
||||||
let preview = this.isPreviewSingle ? this.$refs.previewSingle : this.$refs.previewMultiple;
|
let preview = this.isPreviewSingle ? this.$refs.previewSingle : this.$refs.previewMultiple;
|
||||||
let self = this
|
let self = this
|
||||||
|
|
||||||
let finalOptions = {
|
let finalOptions = {
|
||||||
...this.options,
|
...this.options,
|
||||||
url: this.url,
|
url: this.url,
|
||||||
@ -88,29 +89,41 @@
|
|||||||
thumbnailHeight: null,
|
thumbnailHeight: null,
|
||||||
previewsContainer: preview,
|
previewsContainer: preview,
|
||||||
previewTemplate: preview.innerHTML,
|
previewTemplate: preview.innerHTML,
|
||||||
maxFiles: (!this.multiple) ? 1 : null,
|
|
||||||
init: function () {
|
init: function () {
|
||||||
this.on("addedfile", function (file) {
|
this.on("addedfile", function (file) {
|
||||||
self.currentFile = file;
|
self.files.push(file)
|
||||||
|
|
||||||
|
if (self.options.maxFiles == 1) {
|
||||||
|
self.$emit('change', file)
|
||||||
|
} else {
|
||||||
|
self.$emit('change', this.files)
|
||||||
|
}
|
||||||
|
}),
|
||||||
|
this.on("maxfilesexceeded", function(file) {
|
||||||
|
this.removeAllFiles('notCancel')
|
||||||
|
this.addFile(file)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.dropzone = new Dropzone(this.$el, finalOptions)
|
this.dropzone = new Dropzone(this.$el, finalOptions)
|
||||||
preview.innerHTML = ''
|
preview.innerHTML = ''
|
||||||
let evtList = ['drop', 'dragstart', 'dragend', 'dragenter', 'dragover', 'addedfile', 'removedfile', 'thumbnail', 'error', 'processing', 'uploadprogress', 'sending', 'success', 'complete', 'canceled', 'maxfilesreached', 'maxfilesexceeded', 'processingmultiple', 'sendingmultiple', 'successmultiple', 'completemultiple', 'canceledmultiple', 'totaluploadprogress', 'reset', 'queuecomplete']
|
let evtList = ['drop', 'dragstart', 'dragend', 'dragenter', 'dragover', 'addedfile', 'removedfile', 'thumbnail', 'error', 'processing', 'uploadprogress', 'sending', 'success', 'complete', 'canceled', 'maxfilesreached', 'maxfilesexceeded', 'processingmultiple', 'sendingmultiple', 'successmultiple', 'completemultiple', 'canceledmultiple', 'totaluploadprogress', 'reset', 'queuecomplete']
|
||||||
|
|
||||||
evtList.forEach(evt => {
|
evtList.forEach(evt => {
|
||||||
this.dropzone.on(evt, (data) => {
|
this.dropzone.on(evt, (data) => {
|
||||||
this.$emit(evt, data);
|
this.$emit(evt, data);
|
||||||
|
|
||||||
if (evt === 'addedfile') {
|
if (evt === 'removedfile') {
|
||||||
this.files.push(data)
|
|
||||||
this.$emit('change', this.files);
|
|
||||||
} else if (evt === 'removedfile') {
|
|
||||||
let index = this.files.findIndex(f => f.upload.uuid === data.upload.uuid)
|
let index = this.files.findIndex(f => f.upload.uuid === data.upload.uuid)
|
||||||
|
|
||||||
if (index !== -1) {
|
if (index !== -1) {
|
||||||
this.files.splice(index, 1);
|
this.files.splice(index, 1);
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$emit('change', this.files);
|
this.$emit('change', this.files);
|
||||||
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
Loading…
x
Reference in New Issue
Block a user