Removing the selected image and clearing the dropdzone on dialog close.

Towards #741

Signed-off-by: Abijeet <abijeetpatro@gmail.com>
This commit is contained in:
Abijeet 2018-03-18 23:38:37 +05:30
parent 83d830fd7d
commit 3a5c20c17e
3 changed files with 15 additions and 6 deletions

View File

@ -12,7 +12,7 @@ const props = ['placeholder', 'uploadUrl', 'uploadedTo'];
function mounted() {
let container = this.$el;
let _this = this;
new DropZone(container, {
this._dz = new DropZone(container, {
addRemoveLinks: true,
dictRemoveFile: trans('components.image_upload_remove'),
url: function() {
@ -51,12 +51,19 @@ function mounted() {
}
function data() {
return {}
return {};
}
const methods = {
onClose: function () {
this._dz.removeAllFiles(true);
}
};
module.exports = {
template,
props,
mounted,
data,
methods
};

View File

@ -43,6 +43,8 @@ const methods = {
hide() {
this.showing = false;
this.selectedImage = false;
this.$refs.dropzone.onClose();
this.$el.children[0].components.overlay.hide();
},
@ -175,4 +177,4 @@ module.exports = {
data,
computed,
components: {dropzone},
};
};

View File

@ -1,10 +1,10 @@
<div id="image-manager" image-type="{{ $imageType }}" uploaded-to="{{ $uploaded_to or 0 }}">
<div overlay v-cloak>
<div overlay v-cloak @click="hide()">
<div class="popup-body" @click.stop="">
<div class="popup-header primary-background">
<div class="popup-title">{{ trans('components.image_select') }}</div>
<button class="overlay-close neg corner-button button">x</button>
<button class="overlay-close neg corner-button button" @click="hide()">x</button>
</div>
<div class="flex-fill image-manager-body">
@ -79,7 +79,7 @@
</div>
<dropzone placeholder="{{ trans('components.image_dropzone') }}" :upload-url="uploadUrl" :uploaded-to="uploadedTo" @success="uploadSuccess"></dropzone>
<dropzone ref="dropzone" placeholder="{{ trans('components.image_dropzone') }}" :upload-url="uploadUrl" :uploaded-to="uploadedTo" @success="uploadSuccess"></dropzone>
</div>
</div>