materio-d8/web/themes/custom/materiotheme/vuejs/components/Content/GlobCoolLightBox.vue

<template lang="html">
      <CoolLightBox
      :items="coolLightBoxItems"
      :index="coolLightBoxIndex"
      srcName="url"
      :loop="true"
      :fullscreen="true"
      @close="setcoolLightBoxIndex(null)">
    </CoolLightBox>
</template>

<script>
import { mapState, mapActions } from 'vuex'

// import MA from 'vuejs/api/ma-axios'
import router from 'vuejs/route'

import CoolLightBox from 'vue-cool-lightbox'
import 'vue-cool-lightbox/dist/vue-cool-lightbox.min.css'

export default {
  router,
  // props:[],
  data() {
    return {
      // isOpened: false
    }
  },
  computed: {
    ...mapState({
      coolLightBoxItems: state => state.Common.coolLightBoxItems,
      coolLightBoxIndex: state => state.Common.coolLightBoxIndex,
    })
  },
  beforeMount() {

  },
  methods: {
    ...mapActions({
      setcoolLightBoxIndex: 'Common/setcoolLightBoxIndex'
    }),
  },
  components: {
    CoolLightBox
  }
}
</script>

<style lang="scss" scoped>

</style>