<template> <article class="card linkedmaterialcard"> <header @click.prevent="openModalCard" > <h1>{{ item.title }}</h1> <h4>{{ item.short_description }}</h4> <span v-if="isloggedin" class="ref">{{ item.reference }}</span> </header> <nav class="tools"> </nav> <section class="images" v-switcher> <figure v-for="(img, index) in item.images" :key="img.url" class="lazy" v-lazy="index" > <img :data-src="img.style_linkedmaterialcard.url" :title="img.title" /> <img class="blank" :src="blanksrc" @click.prevent="openModalCard" /> </figure> </section> </article> </template> <script> import { mapState, mapActions } from 'vuex' import cardMixins from 'vuejs/components/cardMixins' import ModalCard from 'vuejs/components/Content/ModalCard' export default { name: "LinkedMaterialCard", props: ['item'], mixins: [cardMixins], // components: { // ModalCard // }, data() { return { blanksrc:`${drupalSettings.path.themePath}/assets/img/blank.gif`, loadingItem: false } }, computed: { ...mapState({ isloggedin: state => state.User.isloggedin }) }, methods: { itemIsLoading(id) { return this.loadingItem }, openModalCard (e) { console.log('openModalCard', this.isLoggedin) if (this.isloggedin) { this.$modal.show( ModalCard, { item: this.item, // not really an event // more a callback function passed as prop to the component addNoteId:(id) => { // no needs to refresh the entire item via searchresults // plus if we are in article, there is not searchresults // this.refreshItem({id: this.item.id}) // instead create the note id directly this.item.note = {id: id} } }, { name: `modal-${this.item.id}`, draggable: false, classes: "vm--modale-card", // this does not work // adaptative: true, // maxWidth: 850, // maxHeight: 610, width: '95%', height: '95%' } ) } else { this.$modal.show( MemberWarning, {}, { // name: `modal-${this.item.id}`, draggable: false, // classes: "vm--modale-card", // this does not work // adaptative: true, // maxWidth: 850, // maxHeight: 610, width: '400px', height: '250px' } ) } } } } </script> <style lang="scss" scoped> </style>