<template lang="html">
  <div
    :id="id"
    :class="{opened: isopened}"
  >
    <FlagCollection v-if='openedCollid' :collection='flagcolls[openedCollid]'/>
  </div>
</template>

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

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

import FlagCollection from 'vuejs/components/User/FlagCollection'

export default {
  router,
  props:['id'],
  data() {
    return {
      // isOpened: false
    }
  },
  computed: {
    ...mapState({
      flagcolls: state => state.User.flagcolls,
      openedCollid: state => state.User.openedCollid
    }),
    isopened () {
      return this.openedCollid
    }
  },
  beforeMount() {

  },
  methods: {

  },
  components: {
    FlagCollection
  }
}
</script>

<style lang="scss" scoped>

</style>