frontend use Lightbox to enlarge mail attachments

This commit is contained in:
j3d1 2024-01-15 20:52:11 +01:00
parent 027cf4fca4
commit 7e3a151ead
3 changed files with 25 additions and 9 deletions

View file

@ -12,7 +12,7 @@
<button type="button" class="btn btn-success" @click="saveEditingItem()">Save Changes</button>
</template>
</Modal>
<Lightbox v-if="lightboxItem" :file="lightboxItem.file" @close="closeLightboxModal()"/>
<Lightbox v-if="lightboxHash" :hash="lightboxHash" @close="closeLightboxModal()"/>
<div class="row" v-if="layout === 'table'">
<div class="col-xl-8 offset-xl-2">
<Table
@ -84,7 +84,7 @@ import AuthenticatedImage from "@/components/AuthenticatedImage.vue";
export default {
name: 'Items',
data: () => ({
lightboxItem: null,
lightboxHash: null,
editingItem: null,
}),
components: {AuthenticatedImage, Lightbox, Table, Cards, Modal, EditItem},
@ -92,10 +92,10 @@ export default {
methods: {
...mapActions(['deleteItem', 'markItemReturned']),
openLightboxModalWith(item) {
this.lightboxItem = {...item};
this.lightboxHash = item.file;
},
closeLightboxModal() { // Closes the editing modal and discards the edited copy of the item.
this.lightboxItem = null;
this.lightboxHash = null;
},
openEditingModalWith(item) { // Opens the editing modal with a copy of the selected item.
this.editingItem = item;