summaryrefslogtreecommitdiffstats
path: root/webapp/src/components/GroupModuleClientList.vue
diff options
context:
space:
mode:
authorUdo Walter2019-01-16 18:54:58 +0100
committerUdo Walter2019-01-16 18:54:58 +0100
commitb8da9b16ab89bd8d781481ae6bfc5a3c63641618 (patch)
tree309ba0dcc6666a2f1c32ccdbf889ecd615be756a /webapp/src/components/GroupModuleClientList.vue
parent[webapp] small bugfixes (diff)
downloadbas-b8da9b16ab89bd8d781481ae6bfc5a3c63641618.tar.gz
bas-b8da9b16ab89bd8d781481ae6bfc5a3c63641618.tar.xz
bas-b8da9b16ab89bd8d781481ae6bfc5a3c63641618.zip
[webapp/datatable] add button to filter only selected rows
+ some scrolling bugfixes
Diffstat (limited to 'webapp/src/components/GroupModuleClientList.vue')
-rw-r--r--webapp/src/components/GroupModuleClientList.vue47
1 files changed, 13 insertions, 34 deletions
diff --git a/webapp/src/components/GroupModuleClientList.vue b/webapp/src/components/GroupModuleClientList.vue
index 35819d5..bc2e59a 100644
--- a/webapp/src/components/GroupModuleClientList.vue
+++ b/webapp/src/components/GroupModuleClientList.vue
@@ -28,27 +28,11 @@
<template>
<div>
<v-card>
- <component-search-table v-model="selected" :headers="headers" :items="clients" select-all :loading="loading">
- <template slot="items" slot-scope="row">
- <tr :style="row.color" @click="row.data.selected = !row.data.selected" @dblclick="loadClient(row.data.item)">
- <td class="narrow-td">
- <v-checkbox
- color="primary"
- v-model="row.data.selected"
- hide-details
- ></v-checkbox>
- </td>
- <td class="narrow-td">{{ row.data.item.id }}</td>
- <td>{{ row.data.item.name }}</td>
- <td>{{ row.data.item.ip }}</td>
- <td>{{ row.data.item.mac }}</td>
- <td>{{ row.data.item.uuid }}</td>
- <td class="narrow-td">
- <v-btn class="next-arrow" icon @click.stop="loadClient(row.data.item)"><v-icon>keyboard_arrow_right</v-icon></v-btn>
- </td>
- </tr>
- </template>
- </component-search-table>
+ <data-table v-model="selected" :headers="headers" :items="clients" :loading="loading" @dblclick="loadClient($event)" min-width="1000px">
+ <div slot="actions" slot-scope="row" style="text-align: right">
+ <v-btn icon @click.stop @mousedown="loadClient(row.item)" style="margin: 0"><v-icon>keyboard_arrow_right</v-icon></v-btn>
+ </div>
+ </data-table>
</v-card>
<div v-if="tabIndex === 0" class="text-xs-right">
<v-btn flat color="error" @click="deleteSelected" :disabled="selected.length === 0">
@@ -66,14 +50,14 @@
</template>
<script>
-import ComponentSearchTable from '@/components/ComponentSearchTable'
+import DataTable from '@/components/DataTable'
import { mapMutations } from 'vuex'
export default {
name: 'GroupModuleClientList',
props: ['tabIndex', 'groupId', 'clients'],
components: {
- ComponentSearchTable
+ DataTable
},
data () {
return {
@@ -83,23 +67,18 @@ export default {
computed: {
headers () {
return [
- { text: this.$t('id'), value: 'id' },
- { text: this.$t('name'), value: 'name' },
- { text: this.$t('ip'), value: 'ip' },
- { text: this.$t('mac'), value: 'mac' },
- { text: this.$t('uuid'), value: 'uuid' },
- { sortable: false }
+ { key: 'id', text: this.$t('id'), width: '50px' },
+ { key: 'name', text: this.$t('name') },
+ { key: 'ip', text: this.$t('ip'), width: '100px' },
+ { key: 'mac', text: this.$t('mac'), width: '160px' },
+ { key: 'uuid', text: this.$t('uuid'), width: '180px' },
+ { key: 'actions', width: '60px' }
]
},
loading () {
return this.$store.state.groups.tabChain[this.tabIndex].loading
}
},
- watch: {
- clients () {
- this.selected = []
- }
- },
methods: {
...mapMutations('groups', ['setActiveTab', 'setTab', 'setDialog']),
loadClient (item) {