Merge branch 'feature/dienstverwaltung' into develop

This commit is contained in:
Tim Gröger 2020-01-19 21:36:21 +01:00
commit d6896d29b2
9 changed files with 491 additions and 74 deletions

View File

@ -11,6 +11,14 @@
</v-list-item-icon> </v-list-item-icon>
<v-list-item-title>Gesamtübersicht</v-list-item-title> <v-list-item-title>Gesamtübersicht</v-list-item-title>
</v-list-item> </v-list-item>
<v-list-item link to="/main/finanzer/servicemanagement">
<v-list-item-icon>
<v-icon>work</v-icon>
</v-list-item-icon>
<v-list-item-title>
Dienstverwaltung
</v-list-item-title>
</v-list-item>
</v-list> </v-list>
<v-divider /> <v-divider />
<v-list> <v-list>

View File

@ -0,0 +1,100 @@
<template>
<div>
<v-content>
<v-toolbar>
<v-toolbar-title>
Dienstverwaltung
</v-toolbar-title>
<v-spacer />
<v-toolbar-items>
<v-btn text icon @click="changeMonth(-1)">
<v-icon>keyboard_arrow_left</v-icon>
</v-btn>
<v-list-item>
<v-list-item-title class="title"
>{{ monthArray[date.getMonth()] }}
{{ date.getFullYear() }}</v-list-item-title
>
</v-list-item>
<v-btn text icon @click="changeMonth(1)">
<v-icon>keyboard_arrow_right</v-icon>
</v-btn>
</v-toolbar-items>
<v-spacer />
</v-toolbar>
<v-card v-for="week in month" :key="month.indexOf(week)">
<v-card-title class="subtitle-1 font-weight-bold">
Woche vom {{ week.startDate.getDate() }}.{{
week.startDate.getMonth() + 1
}}.{{ week.startDate.getFullYear() }} bis
{{ week.endDate.getDate() }}.{{ week.endDate.getMonth() + 1 }}.{{
week.endDate.getFullYear()
}}
</v-card-title>
<v-card-text>
<v-row justify="start" align="start">
<div v-for="day in week.days" :key="day.id">
<v-col>
<Day v-bind:day="day"/>
</v-col>
</div>
</v-row>
</v-card-text>
</v-card>
</v-content>
</div>
</template>
<script>
import { mapGetters, mapActions } from 'vuex'
import Day from './ServiceManagementComponents/Day'
export default {
name: 'ServiceManagement',
components: { Day },
data() {
return {
id: 0,
date: new Date(),
monthArray: [
'Januar',
'Februar',
'März',
'April',
'Mai',
'Juni',
'Juli',
'August',
'September',
'Oktober',
'November',
'Dezember'
]
}
},
created() {
this.createMonth(this.date)
this.getAllUsers()
},
methods: {
...mapActions({
createMonth: 'sm/createMonth',
getAllUsers: 'sm/getAllUsers'
}),
changeMonth(value) {
if (value === -1) {
this.date = new Date(this.date.getFullYear(), this.date.getMonth() - 1)
} else {
this.date = new Date(this.date.getFullYear(), this.date.getMonth() + 1)
}
this.createMonth(this.date)
}
},
computed: {
...mapGetters({
month: 'sm/month'
})
}
}
</script>
<style scoped></style>

View File

@ -0,0 +1,121 @@
<template>
<div v-if="day">
<v-card :color="color(day)" max-width="300px" min-width="300px">
<v-card-title v-if="day.date" class="subtitle-1 font-weight-bold">
{{ day.name }} den {{ day.date.getDate() }}.{{
day.date.getMonth() + 1
}}.{{ day.date.getFullYear() }}
</v-card-title>
<v-card-text>
<v-autocomplete
chips
return-object
multiple
v-model="day.worker"
:items="allUsers"
item-text="fullName"
label="Dienste"
prepend-inner-icon="group_add"
filled
color="green"
>
<template v-slot:selection="data">
<v-chip
v-bind="data.attrs"
:input-value="data.selected"
close
@click="data.select"
@click:close="remove(data.item)"
>
{{ data.item.firstname }} {{ data.item.lastname }}
</v-chip>
</template>
<template v-slot:item="data">
<v-list-item-content>
<v-list-item-title>
{{ data.item.firstname }} {{ data.item.lastname }}
</v-list-item-title>
</v-list-item-content>
</template>
</v-autocomplete>
</v-card-text>
</v-card>
</div>
</template>
<script>
import { mapGetters, mapActions } from 'vuex'
export default {
name: 'Day',
props: {
day: Object
},
data() {
return {}
},
created() {
this.getUser({date: this.day.date.getTime()/1000})
},
methods: {
...mapActions({
addUser: 'sm/addUser',
getUser: 'sm/getUser',
deleteUser: 'sm/deleteUser'
}),
// eslint-disable-next-line no-unused-vars
remove(deletedUser) {
const obj = this.day.worker.find(a => {
return a.username === deletedUser.username
})
const index = this.day.worker.indexOf(obj)
if (index >= 0) this.day.worker.splice(index, 1)
this.deleteUser({startdatetime: this.day.date, date: this.day.date.getTime()/1000, user: deletedUser})
},
color: day => {
if (day) {
if (day.date.getDay() === 0 || day.date.getDay() === 1) {
return 'grey lighten-4'
} else {
if (day.worker.length < 2) {
return 'yellow'
} else {
return 'light-green'
}
}
} else {
return 'grey lighten-4'
}
}
},
computed: {
...mapGetters({
allUsers: 'sm/allUsers'
}),
worker() {
return this.day.worker
}
},
watch: {
worker(newValue, oldValue) {
if (oldValue !== newValue) {
let addedUser = null
for (let user in newValue) {
if (!oldValue.includes(newValue[user])) {
addedUser = newValue[user]
this.addUser({date: this.day.date.getTime()/1000, user: addedUser})
}
}
let deletedUser = null
for (let user in oldValue) {
if (!newValue.includes(oldValue[user])) {
deletedUser = oldValue[user]
this.deleteUser({startdatetime: this.day.date, date: this.day.date.getTime()/1000, user: deletedUser})
}
}
}
}
}
}
</script>
<style scoped></style>

View File

@ -1,5 +1,6 @@
//const main = 'http://192.168.5.118:5000/' //const main = 'https://192.168.5.128:5000/'
const main = 'https://localhost:5000/' const main = 'https://localhost:5000/'
//const main = 'https://groeger-clan.duckdns.org:5000/'
const url = { const url = {
login: main + 'login', login: main + 'login',
@ -17,7 +18,14 @@ const url = {
finanzerSendAllMail: main + 'finanzerSendAllMail', finanzerSendAllMail: main + 'finanzerSendAllMail',
finanzerSendOneMail: main + 'finanzerSendOneMail', finanzerSendOneMail: main + 'finanzerSendOneMail',
userMain: main + 'user/main', userMain: main + 'user/main',
userAddAmount: main + 'user/addAmount' userAddAmount: main + 'user/addAmount',
vorstand: {
sm: {
addUser: main + 'sm/addUser',
deleteUser: main + 'sm/deleteUser',
getUser: main + 'sm/getUser'
}
}
} }
export default url export default url

View File

@ -14,6 +14,7 @@ import BarNavigation from '../components/baruser/BarNavigation'
import FinanzerNavigation from '../components/finanzer/FinanzerNavigation' import FinanzerNavigation from '../components/finanzer/FinanzerNavigation'
import Overview from '../components/finanzer/Overview' import Overview from '../components/finanzer/Overview'
import User from '../components/finanzer/User' import User from '../components/finanzer/User'
import ServiceManagement from '../components/vorstand/ServiceManagement'
Vue.use(VueRouter) Vue.use(VueRouter)
@ -71,6 +72,10 @@ const routes = [
name: 'activeUser', name: 'activeUser',
props: true, props: true,
component: User component: User
},
{
path: 'servicemanagement',
component: ServiceManagement
} }
] ]
} }

View File

@ -4,6 +4,7 @@ import login from './modules/login'
import finanzerUsers from './modules/finanzerUsers' import finanzerUsers from './modules/finanzerUsers'
import barUsers from '@/store/modules/barUsers' import barUsers from '@/store/modules/barUsers'
import user from '@/store/modules/user' import user from '@/store/modules/user'
import sm from '@/store/modules/serviceManagement'
Vue.use(Vuex) Vue.use(Vuex)
@ -12,6 +13,7 @@ export default new Vuex.Store({
login, login,
finanzerUsers, finanzerUsers,
barUsers, barUsers,
user user,
sm
} }
}) })

View File

@ -0,0 +1,244 @@
import axios from 'axios'
import url from '@/plugins/routes'
const state = {
month: [],
allUsers: []
}
const mutations = {
setAllUsers: (state, users) => {
state.allUsers = []
state.allUsers = users
for (let i = 0; i < state.allUsers.length; i++) {
state.allUsers[i].fullName =
state.allUsers[i].firstname + ' ' + state.allUsers[i].lastname
}
},
createMonth: (state, date) => {
let month = []
let id = 0
const year = date.getFullYear()
const mon = date.getMonth()
let a = new Date(year, mon + 1, 0)
let days = a.getDate()
let startDate = 1
for (let intDay = 1; intDay <= days; intDay++) {
if (new Date(year, mon, intDay).getDay() === 3) {
startDate = intDay
break
}
}
let end = false
let week = { id: id, days: {} }
for (let intDay = startDate; intDay <= days + 7; intDay++) {
if (end) break
let currentDate = new Date(year, mon, intDay, 12)
switch (currentDate.getDay()) {
case 1:
mutations.setStartEndDate(week)
month.push(week)
id++
week = { id: id, days: {} }
week.days.monday = {
id: currentDate.getDay(),
date: currentDate,
name: 'Montag',
worker: []
}
break
case 2:
week.days.tuesday = {
id: currentDate.getDay(),
date: currentDate,
name: 'Dienstag',
worker: []
}
break
case 3:
if (currentDate.getMonth() === mon + 1) {
end = true
mutations.setStartEndDate(week)
month.push(week)
} else {
week.days.wednesday = {
id: currentDate.getDay(),
date: currentDate,
name: 'Mittwoch',
worker: []
}
}
break
case 4:
week.days.thursday = {
id: currentDate.getDay(),
date: currentDate,
name: 'Donnerstag',
worker: []
}
break
case 5:
week.days.friday = {
id: currentDate.getDay(),
date: currentDate,
name: 'Freitag',
worker: []
}
break
case 6:
week.days.satturday = {
id: currentDate.getDay(),
date: currentDate,
name: 'Samstag',
worker: []
}
break
case 0:
week.days.sunday = {
id: currentDate.getDay(),
date: currentDate,
name: 'Sontag',
worker: []
}
break
}
}
state.month = month
},
setStartEndDate: week => {
if (week.days.monday) {
week.startDate = week.days.monday.date
} else if (week.days.tuesday) {
week.startDate = week.days.tuesday.date
} else if (week.days.wednesday) {
week.startDate = week.days.wednesday.date
} else if (week.days.thursday) {
week.startDate = week.days.thursday.date
} else if (week.days.friday) {
week.startDate = week.days.friday.date
} else if (week.days.satturday) {
week.startDate = week.days.satturday.date
} else if (week.days.sunday) {
week.startDate = week.days.sunday.date
}
if (week.days.sunday) {
week.endDate = week.days.sunday.date
} else if (week.days.satturday) {
week.endDate = week.days.satturday.date
} else if (week.days.friday) {
week.endDate = week.days.friday.date
} else if (week.days.thursday) {
week.endDate = week.days.thursday.date
} else if (week.days.wednesday) {
week.endDate = week.days.wednesday.date
} else if (week.days.tuesday) {
week.endDate = week.days.tuesday.date
} else if (week.days.monday) {
week.endDate = week.days.monday.date
}
},
updateMonth: (state, data) => {
const date = new Date(data.startdatetime)
const user = data.user
for (let week = 0; week < state.month.length; week++) {
for (let day in state.month[week].days) {
if (state.month[week].days[day].date - date === 0) {
let worker = state.month[week].days[day].worker.find(a => {
return a.username === user.username
})
if (!worker && data.com === 'add') {
state.month[week].days[day].worker.push({
firstname: user.firstname,
lastname: user.lastname,
username: user.username,
fullName: user.firstname + ' ' + user.lastname
})
}
}
}
}
}
}
const actions = {
createMonth({ commit }, date) {
commit('createMonth', date)
},
async getAllUsers({ commit, rootState, dispatch }) {
try {
const response = await axios.post(
url.searchUser,
{ searchString: '' },
{ headers: { Token: rootState.login.user.accessToken } }
)
commit('setAllUsers', response.data)
} catch (e) {
if (e.response)
if (e.response.data === 401) dispatch('logout', null, { root: true })
}
},
// eslint-disable-next-line no-unused-vars
async addUser({ commit, rootState, dispatch }, data) {
try {
const response = await axios.post(
url.vorstand.sm.addUser,
{ ...data },
{
headers: { Token: rootState.login.user.accessToken }
}
)
console.log(response.data)
commit('updateMonth', {...response.data[0], com: 'add'})
} catch (e) {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
async getUser({ commit, rootState, dispatch }, data) {
try {
const response = await axios.post(
url.vorstand.sm.getUser,
{ ...data },
{ headers: { Token: rootState.login.user.accessToken } }
)
for (let item = 0; item < response.data.length; item++) {
commit('updateMonth', { ...response.data[item], com: 'add' })
}
} catch (e) {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
// eslint-disable-next-line no-unused-vars
async deleteUser({ commit, rootState, dispatch }, data) {
try {
// eslint-disable-next-line no-unused-vars
const response = await axios.post(
url.vorstand.sm.deleteUser,
{ ...data },
{ headers: { Token: rootState.login.user.accessToken } }
)
commit('updateMonth', {...data, com: 'delete'})
} catch (e) {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
}
}
const getters = {
month: state => {
return state.month
},
allUsers: state => {
return state.allUsers
}
}
export default {
namespaced: true,
state,
mutations,
actions,
getters
}

View File

@ -1,52 +1,10 @@
<template> <template>
<div> <div>
<v-navigation-drawer
mini-variant
expand-on-hover
app
clipped
permanent
overflow
right
>
<template v-slot:append>
<v-list>
<v-list-item>
<v-list-item-icon>
<v-icon>search</v-icon>
</v-list-item-icon>
<v-list-item-title>
<v-autocomplete
outlined
return-object
v-model="user"
style="margin-top: 3px"
placeholder="Suche Person"
:items="allUsers"
item-text="fullName"
prepend-inner-icon="search"
full-width
/>
</v-list-item-title>
</v-list-item>
<v-list-item>
<v-list-item-icon>
<v-icon>person_add</v-icon>
</v-list-item-icon>
<v-list-item-title>
<v-btn text block @click="addUser(user)">Hinzufügen</v-btn>
</v-list-item-title>
</v-list-item>
</v-list>
</template>
</v-navigation-drawer>
<router-view /> <router-view />
</div> </div>
</template> </template>
<script> <script>
// eslint-disable-next-line no-unused-vars
import { mapGetters } from 'vuex'
import { mapActions } from 'vuex' import { mapActions } from 'vuex'
export default { export default {
@ -57,23 +15,11 @@ export default {
this.getUsers() this.getUsers()
this.createYears() this.createYears()
}, },
data() {
return {
user: null
}
},
methods: mapActions({ methods: mapActions({
getAllUsers: 'finanzerUsers/getAllUsers', getAllUsers: 'finanzerUsers/getAllUsers',
setActiveUser: 'finanzerUsers/setActiveUser',
getUsers: 'finanzerUsers/getUsers', getUsers: 'finanzerUsers/getUsers',
finanzerUsers: 'finanzerUsers/addUser',
createYears: 'finanzerUsers/createYears', createYears: 'finanzerUsers/createYears',
logout: 'logout' logout: 'logout'
}),
computed: mapGetters({
users: 'finanzerUsers/users',
activeUser: 'finanzerUsers/activeUser',
allUsers: 'finanzerUsers/allUsers'
}) })
} }
</script> </script>

View File

@ -1,17 +0,0 @@
<template>
<div>
<TitleBar />
</div>
</template>
<script>
// @ is an alias to /src
import TitleBar from '@/components/TitleBar'
export default {
name: 'home',
components: {
TitleBar
}
}
</script>