91 lines
2.2 KiB
Vue
91 lines
2.2 KiB
Vue
|
<template>
|
||
|
|
<div>
|
||
|
|
<v-toolbar>
|
||
|
|
<v-toolbar-title>
|
||
|
|
Dienstübersicht
|
||
|
|
</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"
|
||
|
|
>{{ date.getDate() }}.{{ date.getMonth() + 1 }}.{{
|
||
|
|
date.getFullYear()
|
||
|
|
}}
|
||
|
|
bis {{ toDate.getDate() }}.{{ toDate.getMonth() + 1 }}.{{
|
||
|
|
toDate.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-progress-linear indeterminate v-if="loading" />
|
||
|
|
<div v-for="day in days" :key="days.indexOf(day)">
|
||
|
|
<Day v-bind:day="day" style="margin-top: 3px"></Day>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { mdiChevronLeft, mdiChevronRight } from '@mdi/js'
|
||
|
|
import { mapGetters, mapActions } from 'vuex'
|
||
|
|
import Day from '@/components/user/Jobs/Day'
|
||
|
|
export default {
|
||
|
|
name: 'Jobs',
|
||
|
|
components: { Day },
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
keyboard_arrow_left: mdiChevronLeft,
|
||
|
|
keyboard_arrow_right: mdiChevronRight,
|
||
|
|
date: new Date()
|
||
|
|
}
|
||
|
|
},
|
||
|
|
created() {
|
||
|
|
this.createDays(this.date)
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
...mapActions({
|
||
|
|
createDays: 'user/createDays'
|
||
|
|
}),
|
||
|
|
changeMonth(value) {
|
||
|
|
if (value === -1) {
|
||
|
|
this.date = new Date(
|
||
|
|
this.date.getFullYear(),
|
||
|
|
this.date.getMonth(),
|
||
|
|
this.date.getDate() - 1
|
||
|
|
)
|
||
|
|
} else {
|
||
|
|
this.date = new Date(
|
||
|
|
this.date.getFullYear(),
|
||
|
|
this.date.getMonth(),
|
||
|
|
this.date.getDate() + 1
|
||
|
|
)
|
||
|
|
}
|
||
|
|
this.createDays(this.date)
|
||
|
|
},
|
||
|
|
test(day) {
|
||
|
|
let index = this.days.indexOf(day)
|
||
|
|
console.log(index, index % 3)
|
||
|
|
return true
|
||
|
|
}
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
...mapGetters({
|
||
|
|
days: 'user/days',
|
||
|
|
loading: 'user/loading'
|
||
|
|
}),
|
||
|
|
toDate() {
|
||
|
|
return new Date(new Date().setDate(this.date.getDate() + 10))
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped></style>
|