vorstand can change group for jobkind

This commit is contained in:
Tim Gröger 2020-05-17 21:19:19 +02:00
parent 4af0d77584
commit 9bd854209e
3 changed files with 130 additions and 62 deletions

View File

@ -1,43 +1,62 @@
<template> <template>
<div> <div>
<v-card tile :loading="jobkindsLoading"> <v-data-table
<v-card-title> :items="jobkinds"
Dienstarten :headers="header"
<v-spacer /> :loading="jobkindsLoading || workgroupsLoading"
<v-btn fab small color="primary" @click="add()"> :search="search"
<v-icon> >
{{ plusIcon }} <template v-slot:top>
</v-icon> <v-toolbar flat color="white">
</v-btn> <v-toolbar-title>
</v-card-title> Dienstarten
<v-card-text> </v-toolbar-title>
<v-card tile v-for="jobkind in jobkinds" :key="jobkind.id"> <v-spacer />
<v-card-text class="black--text"> <v-text-field
<v-row class="ml-3 mr-3"> v-model="search"
{{ jobkind.name }} label="Suche Dienstart"
<v-spacer /> single-line
<v-btn icon @click="editJobKind(jobkind)"> hide-details
<v-icon> >
{{ editIcon }} <template v-slot:append>
</v-icon> <v-icon>{{ searchIcon }}</v-icon>
</v-btn> </template>
<v-btn icon @click="deleteJobKind(jobkind)"> </v-text-field>
<v-icon> <v-btn fab small color="primary" @click="add()">
{{ deleteIcon }} <v-icon>{{ plusIcon }}</v-icon>
</v-icon> </v-btn>
</v-btn> </v-toolbar>
</v-row> </template>
</v-card-text> <template v-slot:item.workgroup="{ item }">
</v-card> {{ item.workgroup === null ? 'Alle' : item.workgroup.name }}
</v-card-text> </template>
</v-card> <template v-slot:item.actions="{item}">
<v-icon x-small @click="editJobKind(item)">{{editIcon}}</v-icon>
<v-icon x-small @click="deleteJobKind(item)">{{deleteIcon}}</v-icon>
</template>
</v-data-table>
<v-dialog v-model="dialog"> <v-dialog v-model="dialog">
<v-card> <v-card>
<v-card-title> <v-card-title>
{{ title }} {{ title }}
</v-card-title> </v-card-title>
<v-card-text> <v-card-text>
<v-text-field outlined label="Name" v-model="editedItem.name" /> <v-row>
<v-col>
<v-text-field outlined label="Name" v-model="editedItem.name" />
</v-col>
<v-col>
<v-autocomplete
outlined
return-object
label="Arbeitsgruppe"
v-model="editedItem.workgroup"
item-text="name"
item-value="id"
:items="[...workgroups, { id: -1, name: 'Alle' }]"
/>
</v-col>
</v-row>
</v-card-text> </v-card-text>
<v-card-actions> <v-card-actions>
<v-spacer /> <v-spacer />
@ -51,22 +70,42 @@
<script> <script>
import { mapGetters, mapActions } from 'vuex' import { mapGetters, mapActions } from 'vuex'
import { mdiPencil, mdiDelete, mdiPlus } from '@mdi/js' import { mdiPencil, mdiDelete, mdiPlus, mdiMagnify } from '@mdi/js'
export default { export default {
name: 'JobKindManager', name: 'JobKindManager',
data() { data() {
return { return {
search: null,
editIcon: mdiPencil, editIcon: mdiPencil,
deleteIcon: mdiDelete, deleteIcon: mdiDelete,
plusIcon: mdiPlus, plusIcon: mdiPlus,
searchIcon: mdiMagnify,
dialog: false, dialog: false,
header: [
{ text: 'Name', value: 'name' },
{ text: 'Zugewiesene Arbeitsgruppe', value: 'workgroup' },
{
text: 'Aktionen',
value: 'actions',
filterable: false,
sortable: false
}
],
editedItem: { editedItem: {
id: -1, id: -1,
name: null name: null,
workgroup: {
id: -1,
name: null
}
}, },
defaultItem: { defaultItem: {
id: -1, id: -1,
name: null name: null,
workgroup: {
id: -1,
name: null
}
} }
} }
}, },
@ -75,7 +114,8 @@ export default {
getAllJobKinds: 'jkm/getAllJobKinds', getAllJobKinds: 'jkm/getAllJobKinds',
addingJobKind: 'jkm/addJobKind', addingJobKind: 'jkm/addJobKind',
updateJobKind: 'jkm/updateJobKind', updateJobKind: 'jkm/updateJobKind',
deletingJobKind: 'jkm/deleteJobKind' deletingJobKind: 'jkm/deleteJobKind',
getAllWorkgroups: 'wm/getAllWorkgroups'
}), }),
add() { add() {
this.dialog = true this.dialog = true
@ -83,9 +123,13 @@ export default {
editJobKind(jobkind) { editJobKind(jobkind) {
this.dialog = true this.dialog = true
this.editedItem = Object.assign({}, jobkind) this.editedItem = Object.assign({}, jobkind)
if (this.editedItem.workgroup === null) {
this.editedItem.workgroup = Object.assign({}, this.defaultItem.workgroup)
}
}, },
deleteJobKind(jobkind) { deleteJobKind(jobkind) {
confirm("Willst du diese Dienstart wirklich löschen") && this.deletingJobKind(jobkind) confirm('Willst du diese Dienstart wirklich löschen') &&
this.deletingJobKind(jobkind)
this.close() this.close()
}, },
close() { close() {
@ -95,14 +139,20 @@ export default {
}, 200) }, 200)
}, },
save() { save() {
this.editedItem.id === -1 ? this.addingJobKind(this.editedItem) : this.updateJobKind(this.editedItem) if (this.editedItem.workgroup.id === -1)
this.editedItem.workgroup = null
this.editedItem.id === -1
? this.addingJobKind(this.editedItem)
: this.updateJobKind(this.editedItem)
this.close() this.close()
} }
}, },
computed: { computed: {
...mapGetters({ ...mapGetters({
jobkinds: 'jkm/jobkinds', jobkinds: 'jkm/jobkinds',
jobkindsLoading: 'jkm/jobkindsLoading' jobkindsLoading: 'jkm/jobkindsLoading',
workgroups: 'wm/workgroups',
workgroupsLoading: 'wm/workgroupLoading'
}), }),
title() { title() {
return this.editedItem.id === -1 return this.editedItem.id === -1
@ -112,6 +162,8 @@ export default {
}, },
created() { created() {
this.getAllJobKinds() this.getAllJobKinds()
this.getAllWorkgroups()
console.log(this.jobkinds)
} }
} }
</script> </script>

View File

@ -45,15 +45,16 @@
<v-row> <v-row>
<v-col> <v-col>
<v-autocomplete <v-autocomplete
chips chips
multiple multiple
v-model="editedItem.workgroups" v-model="editedItem.workgroups"
label="AG's" label="AG's"
outlined outlined
:items="workgroups" :items="workgroups"
item-value="id" item-value="id"
item-text="name" item-text="name"
return-object></v-autocomplete> return-object
></v-autocomplete>
</v-col> </v-col>
</v-row> </v-row>
</v-container> </v-container>
@ -65,7 +66,12 @@
</v-card-actions> </v-card-actions>
</v-card> </v-card>
</v-dialog> </v-dialog>
<v-data-table :headers="header" :items="users" :search="search" :loading="usersLoading || statusLoading"> <v-data-table
:headers="header"
:items="users"
:search="search"
:loading="usersLoading || statusLoading"
>
<template v-slot:top> <template v-slot:top>
<v-toolbar flat color="white"> <v-toolbar flat color="white">
<v-toolbar-title>Mitgliederliste</v-toolbar-title> <v-toolbar-title>Mitgliederliste</v-toolbar-title>
@ -82,12 +88,12 @@
</v-text-field> </v-text-field>
</v-toolbar> </v-toolbar>
</template> </template>
<template v-slot:item.workgroups="{item}"> <template v-slot:item.workgroups="{ item }">
<div> <div>
<v-chip v-for="group in item.workgroups" :key="group.id" x-small> <v-chip v-for="group in item.workgroups" :key="group.id" x-small>
{{group.name}} {{ group.name }}
</v-chip> </v-chip>
</div> </div>
</template> </template>
<template v-slot:item.statusgroup="{ item }"> <template v-slot:item.statusgroup="{ item }">
{{ computeStatus(item.statusgroup) }} {{ computeStatus(item.statusgroup) }}
@ -138,7 +144,7 @@
</template> </template>
<script> <script>
import { mdiPencil, mdiMagnify, } from '@mdi/js' import { mdiPencil, mdiMagnify } from '@mdi/js'
import { mapActions, mapGetters } from 'vuex' import { mapActions, mapGetters } from 'vuex'
export default { export default {
name: 'UserManager', name: 'UserManager',
@ -153,7 +159,7 @@ export default {
header: [ header: [
{ text: 'Nachname', value: 'lastname' }, { text: 'Nachname', value: 'lastname' },
{ text: 'Vorname(n)', value: 'firstname' }, { text: 'Vorname(n)', value: 'firstname' },
{ text: 'AG\'s', value: 'workgroups'}, { text: "AG's", value: 'workgroups' },
{ text: 'Status', value: 'statusgroup' }, { text: 'Status', value: 'statusgroup' },
{ text: 'Stimmrecht', value: 'voting' }, { text: 'Stimmrecht', value: 'voting' },
{ {
@ -196,9 +202,8 @@ export default {
mounted() { mounted() {
this.$nextTick(function() { this.$nextTick(function() {
window.addEventListener('resize', this.getWindowWidth); window.addEventListener('resize', this.getWindowWidth)
this.getWindowWidth() this.getWindowWidth()
}) })
}, },
@ -211,9 +216,9 @@ export default {
updateWorkgroups: 'usermanager/updateWorkgroups', updateWorkgroups: 'usermanager/updateWorkgroups',
getAllWorkgroups: 'wm/getAllWorkgroups' getAllWorkgroups: 'wm/getAllWorkgroups'
}), }),
getWindowWidth() { getWindowWidth() {
this.isFulllineText = document.documentElement.clientWidth <= 750; this.isFulllineText = document.documentElement.clientWidth <= 750
}, },
close() { close() {
this.editUser = false this.editUser = false
setTimeout(() => { setTimeout(() => {
@ -226,8 +231,12 @@ export default {
{}, {},
this.status.find(a => a.id == item.statusgroup) this.status.find(a => a.id == item.statusgroup)
) )
this.editedItem.voting = Object.assign({}, this.editedItem.voting = Object.assign(
item.voting ? {value: true, text: 'ja'} : {value: false, text: 'nein'}) {},
item.voting
? { value: true, text: 'ja' }
: { value: false, text: 'nein' }
)
this.clickItem(this.editedItem.statusgroup) this.clickItem(this.editedItem.statusgroup)
this.editUser = true this.editUser = true
}, },
@ -255,8 +264,14 @@ export default {
} }
}, },
save() { save() {
this.updateStatusUser({username: this.editedItem.username, status: this.editedItem.statusgroup}) this.updateStatusUser({
this.updateVoting({username: this.editedItem.username, voting: this.editedItem.voting.value}) username: this.editedItem.username,
status: this.editedItem.statusgroup
})
this.updateVoting({
username: this.editedItem.username,
voting: this.editedItem.voting.value
})
this.updateWorkgroups(this.editedItem) this.updateWorkgroups(this.editedItem)
this.close() this.close()
} }
@ -282,7 +297,7 @@ export default {
}).length }).length
}, },
allActiveUsers(){ allActiveUsers() {
return this.users.filter(a => { return this.users.filter(a => {
return a.statusgroup === 1 return a.statusgroup === 1
}).length }).length
@ -297,7 +312,7 @@ export default {
</script> </script>
<style scoped> <style scoped>
.fulllineText{ .fulllineText {
flex-basis: unset; flex-basis: unset;
} }
</style> </style>

View File

@ -18,6 +18,7 @@ const mutations = {
console.log(exists) console.log(exists)
if (exists) { if (exists) {
exists.name = jobkind.name exists.name = jobkind.name
exists.workgroup = jobkind.workgroup
} else { } else {
state.jobkinds.push(jobkind) state.jobkinds.push(jobkind)
} }