summaryrefslogtreecommitdiffstats
path: root/webapp/src/components/GroupModule.vue
diff options
context:
space:
mode:
authorUdo Walter2018-07-19 05:58:05 +0200
committerUdo Walter2018-07-19 05:58:05 +0200
commit039be437233b3443f8ab0b93d6f34929534ba670 (patch)
treeb6b20518172372a5d52693fdf7b7a1c0e60c96af /webapp/src/components/GroupModule.vue
parent[webapp/dashboard] added devMode (diff)
downloadbas-039be437233b3443f8ab0b93d6f34929534ba670.tar.gz
bas-039be437233b3443f8ab0b93d6f34929534ba670.tar.xz
bas-039be437233b3443f8ab0b93d6f34929534ba670.zip
[server/groups][webapp/groups] added first version of the groups module
Diffstat (limited to 'webapp/src/components/GroupModule.vue')
-rw-r--r--webapp/src/components/GroupModule.vue61
1 files changed, 55 insertions, 6 deletions
diff --git a/webapp/src/components/GroupModule.vue b/webapp/src/components/GroupModule.vue
index 2e5070a..09e8050 100644
--- a/webapp/src/components/GroupModule.vue
+++ b/webapp/src/components/GroupModule.vue
@@ -8,22 +8,72 @@
</i18n>
<template>
- <div><v-btn color="primary" @click="newSnackbar">{{ count }}</v-btn></div>
+ <v-container fill-height>
+ <v-layout>
+ <v-flex class="tabs-wrapper" xl10 offset-xl1 lg12>
+ <v-card>
+ <v-tabs v-model="active" 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 v-model="active" touchless>
+ <template v-for="(group, index) in groupChain">
+ <v-tab-item :key="index">
+ <group-module-group-view
+ ref="groupViews"
+ :id="group.id"
+ @open-group="openGroup($event, index)"
+ @edit-group="editDialog = true; editClient = false; editId = $event"
+ />
+ </v-tab-item>
+ </template>
+ </v-tabs-items>
+ </v-flex>
+ </v-layout>
+ <v-dialog v-model="editDialog" max-width="600px">
+ <group-module-edit :id="editId" :client="editClient" @close="editDialog = false" @reload="reloadData" />
+ </v-dialog>
+ </v-container>
</template>
<script>
+import GroupModuleGroupView from '@/components/GroupModuleGroupView'
+import GroupModuleEdit from '@/components/GroupModuleEdit'
export default {
name: 'GroupModule',
+ components: {
+ GroupModuleGroupView,
+ GroupModuleEdit
+ },
data () {
return {
- count: 0
+ groupChain: [{ id: 0 }],
+ active: 0,
+ editDialog: false,
+ editId: null,
+ editClient: false
}
},
methods: {
- newSnackbar () {
- this.$store.commit('newSnackbar', this.count)
- this.count++
+ openGroup (group, index) {
+ if (this.groupChain.length <= (index + 1) || this.groupChain[index + 1].id !== group.id) {
+ this.groupChain = this.groupChain.slice(0, index + 1)
+ this.groupChain.push(group)
+ }
+ console.log(this.groupChain)
+ this.active = index + 1
+ },
+ reloadData () {
+ this.$refs.groupViews.forEach(groupView => {
+ groupView.loadData()
+ })
}
}
}
@@ -31,5 +81,4 @@ export default {
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
-
</style>