summaryrefslogtreecommitdiffstats
path: root/webapp/src/components/GroupModuleGroupList.vue
diff options
context:
space:
mode:
Diffstat (limited to 'webapp/src/components/GroupModuleGroupList.vue')
-rw-r--r--webapp/src/components/GroupModuleGroupList.vue75
1 files changed, 75 insertions, 0 deletions
diff --git a/webapp/src/components/GroupModuleGroupList.vue b/webapp/src/components/GroupModuleGroupList.vue
new file mode 100644
index 0000000..b6bcd9c
--- /dev/null
+++ b/webapp/src/components/GroupModuleGroupList.vue
@@ -0,0 +1,75 @@
+<i18n>
+{
+ "en": {
+ },
+ "de": {
+ }
+}
+</i18n>
+
+<template>
+ <div>
+ <v-data-table
+ class="group-table"
+ :headers="headers"
+ :items="groups"
+ item-key="id"
+ hide-actions
+ select-all
+ v-model="selected"
+ >
+ <template slot="items" slot-scope="props">
+ <tr @click="$emit('open-group', props.item)">
+ <td>
+ <v-checkbox
+ color="primary"
+ v-model="props.selected"
+ hide-details
+ @click.native.stop
+ ></v-checkbox>
+ </td>
+ <td>{{ props.item.id }}</td>
+ <td>{{ props.item.name }}</td>
+ <td>
+ <v-layout>
+ <v-btn icon @click.stop="$emit('edit-group', props.item.id)"><v-icon color="primary">edit</v-icon></v-btn>
+ <v-btn class="next-arrow" icon @click.stop="$emit('open-group', props.item)"><v-icon>keyboard_arrow_right</v-icon></v-btn>
+ </v-layout>
+ </td>
+ </tr>
+ </template>
+ </v-data-table>
+ </div>
+</template>
+
+<script>
+import GroupModuleGroupView from '@/components/GroupModuleGroupView'
+
+export default {
+ name: 'GroupModuleGroupList',
+ components: {
+ GroupModuleGroupView
+ },
+ props: ['groups'],
+ data () {
+ return {
+ headers: [
+ { text: 'ID', value: 'id' },
+ { text: 'Name', value: 'name', width: '10000px' },
+ { sortable: false }
+ ],
+ selected: []
+ }
+ },
+ methods: {
+ }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped>
+.next-arrow {
+ margin-left: 20px;
+ margin-right: -10px;
+}
+</style>