93 lines
2.3 KiB
Vue
93 lines
2.3 KiB
Vue
|
<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>
|
||
|
|
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>
|
||
|
|
<div v-for="day in week.days" :key="day.id">
|
||
|
|
<Day v-bind:day="day" />
|
||
|
|
</div>
|
||
|
|
</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(), 0, 1)
|
||
|
|
} else {
|
||
|
|
this.date = new Date(this.date.getFullYear(), this.date.getMonth() + 2, 0, 1)
|
||
|
|
}
|
||
|
|
this.createMonth(this.date)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
...mapGetters({
|
||
|
|
month: 'sm/month'
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped></style>
|