summaryrefslogtreecommitdiffstats
path: root/webapp/src/components/GroupModuleHomeView.vue
diff options
context:
space:
mode:
Diffstat (limited to 'webapp/src/components/GroupModuleHomeView.vue')
-rw-r--r--webapp/src/components/GroupModuleHomeView.vue66
1 files changed, 66 insertions, 0 deletions
diff --git a/webapp/src/components/GroupModuleHomeView.vue b/webapp/src/components/GroupModuleHomeView.vue
new file mode 100644
index 0000000..94eb12f
--- /dev/null
+++ b/webapp/src/components/GroupModuleHomeView.vue
@@ -0,0 +1,66 @@
+<i18n>
+{
+ "en": {
+ "showall": "Show All",
+ "groups": "Groups",
+ "clients": "Clients"
+ },
+ "de": {
+ "showall": "Alle anzeigen",
+ "groups": "Gruppen",
+ "clients": "Clienten"
+ }
+}
+</i18n>
+
+<template>
+ <div>
+ <v-layout>
+ <v-spacer></v-spacer>
+ <div><v-switch class="show-toggle" :label="$t('showall')" hide-details color="primary" :input-value="showAll" @change="setShowAll"></v-switch></div>
+ </v-layout>
+ <v-subheader>{{ $t('groups') }}</v-subheader>
+ <group-module-group-list :tabIndex="0" :groups="home.groups" />
+ <v-subheader>{{ $t('clients') }}</v-subheader>
+ <group-module-client-list :tabIndex="0" :clients="home.clients" />
+ </div>
+</template>
+
+<script>
+import GroupModuleGroupList from '@/components/GroupModuleGroupList'
+import GroupModuleClientList from '@/components/GroupModuleClientList'
+import { mapState, mapMutations } from 'vuex'
+
+export default {
+ name: 'GroupModuleHomeView',
+ props: ['home'],
+ components: {
+ GroupModuleGroupList,
+ GroupModuleClientList
+ },
+ data () {
+ return {
+ }
+ },
+ computed: {
+ ...mapState('groups', ['showAll'])
+ },
+ watch: {
+ showAll () {
+ this.$store.dispatch('groups/loadHome')
+ }
+ },
+ methods: {
+ ...mapMutations('groups', ['setShowAll'])
+ }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped>
+.show-toggle {
+ margin-top: 20px;
+ margin-right: 20px;
+ margin-bottom: -20px;
+}
+</style>