diff --git a/resources/vue/components/courseware/CoursewareStructuralElement.vue b/resources/vue/components/courseware/CoursewareStructuralElement.vue index 3bd6122919c4e5425f5524d3d419a35fdae128b3..ae0f9a1993f74fc30ae7d02b67c0ceb8c985a5fa 100644 --- a/resources/vue/components/courseware/CoursewareStructuralElement.vue +++ b/resources/vue/components/courseware/CoursewareStructuralElement.vue @@ -293,18 +293,18 @@ <courseware-tab :name="textEdit.image" :index="2"> <form class="default" @submit.prevent=""> <img - v-if="image" + v-if="showPreviewImage" :src="image" class="cw-structural-element-image-preview" :alt="$gettext('Vorschaubild')" /> - <label v-if="image"> + <label v-if="showPreviewImage"> <button class="button" @click="deleteImage" v-translate>Bild löschen</button> </label> <div v-if="uploadFileError" class="messagebox messagebox_error"> {{ uploadFileError }} </div> - <label v-if="!image"> + <label v-if="!showPreviewImage"> <translate>Bild hochladen</translate> <input ref="upload_image" type="file" accept="image/*" @change="checkUploadFile" /> </label> @@ -731,6 +731,7 @@ export default { passsword: '', 'expire-date': '' }, + deletingPreviewImage: false, }; }, @@ -854,6 +855,10 @@ export default { return this.structuralElement.relationships?.image?.meta?.['download-url'] ?? null; }, + showPreviewImage() { + return this.image !== null && this.deletingPreviewImage === false; + }, + structuralElementLoaded() { return this.structuralElement !== null && this.structuralElement !== {}; }, @@ -1341,6 +1346,7 @@ export default { initCurrent() { this.currentElement = _.cloneDeep(this.structuralElement); this.uploadFileError = ''; + this.deletingPreviewImage = false; }, async menuAction(action) { switch (action) { @@ -1452,8 +1458,9 @@ export default { } }, deleteImage() { - this.deleteImageForStructuralElement(this.currentElement); - this.initCurrent(); + if (!this.deletingPreviewImage) { + this.deletingPreviewImage = true; + } }, async storeCurrentElement() { await this.loadStructuralElement(this.currentElement.id); @@ -1484,6 +1491,9 @@ export default { console.error(error); this.uploadFileError = this.$gettext('Fehler beim Hochladen der Datei.'); }); + await this.loadStructuralElement(this.currentElement.id); + } else if (this.deletingPreviewImage) { + await this.deleteImageForStructuralElement(this.currentElement); } this.showElementEditDialog(false);