summaryrefslogblamecommitdiffstats
path: root/webapp/src/components/GroupModule.vue
blob: 6ad92798fd697903be1428c7990015771dffe580 (plain) (tree)
1
2
3
4
5
6
7
8
9
10









          



                                                        
                                                                                       
                                                             
                                                                                        






                                                                                      
                                                                              

                                                           
                                                             




                           
                


           

                                                                    
                               


                      



                         

            


                        

     


                                                      
            

                                                            
     


                                                                    





                                                                   
        
<i18n>
{
  "en": {
  },
  "de": {
  }
}
</i18n>

<template>
  <v-container fill-height>
    <v-layout>
      <v-flex class="tabs-wrapper" xl10 offset-xl1 lg12>
          <v-card>
            <v-tabs :value="activeTab" @input="updateActiveTab" slider-color="primary">
              <template v-for="(group, index) in groupChain">
                <v-icon v-if="group.id > 0" :key="2*index">keyboard_arrow_right</v-icon>
                <v-tab :key="2*index+1" ripple>
                  <v-icon v-if="group.id === 0">home</v-icon>
                  <template v-else>{{ group.name ? group.name : group.id }}</template>
                </v-tab>
              </template>
            </v-tabs>
          </v-card>
          <v-tabs-items :value="activeTab" @input="updateActiveTab" touchless>
            <template v-for="(group, index) in groupChain">
              <v-tab-item :key="index">
                <group-module-group-view :tabIndex="index" />
              </v-tab-item>
            </template>
          </v-tabs-items>
      </v-flex>
    </v-layout>
  </v-container>
</template>

<script>
import GroupModuleGroupView from '@/components/GroupModuleGroupView'
import GroupModuleEdit from '@/components/GroupModuleEdit'
import { mapState } from 'vuex'

export default {
  name: 'GroupModule',
  components: {
    GroupModuleGroupView,
    GroupModuleEdit
  },
  data () {
    return {
      editDialog: false,
      editId: null,
      editClient: false
    }
  },
  computed: {
    ...mapState('groups', ['groupChain', 'activeTab'])
  },
  methods: {
    updateActiveTab (tabIndex) {
      this.$store.commit('groups/updateActiveTab', tabIndex)
    }
  },
  created () {
    this.$store.dispatch('groups/loadGroup', { tabIndex: 0, id: 0 })
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>