src/components/vorstand/FreeDrinkList.vue

@@ -4,8 +4,8 @@
       <v-btn link :to="{ name: 'freeDrinkListMain' }">
         <span>Übersicht</span>
       </v-btn>
-      <v-btn>
-        <span>Liste 1</span>
+      <v-btn link :to="{name: 'freeDrinkListJob'}">
+        <span>Dienstgetränke</span>
       </v-btn>
       <v-btn>
         <span>Liste 2</span>
@@ -18,6 +18,23 @@
         <v-icon>mdi-cogs</v-icon>
       </v-btn>
     </v-bottom-navigation>
+    <v-toolbar v-if="$route.name != 'freeDrinkListConfig'" flat dense>
+      <v-spacer/>
+      <v-toolbar-items>
+        <v-btn icon @click="change_month(-1)">
+          <v-icon>mdi-chevron-left</v-icon>
+        </v-btn>
+        <v-item>
+          <v-list-item-title>
+            {{month[date.getMonth()]}} {{date.getFullYear()}}
+          </v-list-item-title>
+        </v-item>
+        <v-btn icon @click="change_month(1)">
+          <v-icon>mdi-chevron-right</v-icon>
+        </v-btn>
+      </v-toolbar-items>
+      <v-spacer/>
+    </v-toolbar>
     <div>
       <router-view />
     </div>
@@ -30,24 +47,77 @@ export default {
   name: 'FreeDrinkList',
   data() {
     return {
-      bottom_nav: true
+      bottom_nav: true,
+      date: new Date(),
+      month: [
+          'Januar',
+          'Februar',
+          'März',
+          'April',
+          'Mai',
+          'Juni',
+          'Juli',
+          'August',
+          'September',
+          'Oktober',
+          'November',
+          'Dezember'
+      ]
     }
   },
   created() {
     this.get_free_drink_list_reasons()
     this.get_free_drink_list_config()
-    this.get_free_drink_list_history()
+    this.get_free_drink_list_history_from_to({
+      from_date: {
+        year: this.from_date.getFullYear(),
+        month: this.from_date.getMonth() + 1,
+        day: 1
+      },
+      to_date: {
+        year: this.to_date.getFullYear(),
+        month: this.to_date.getMonth() + 1,
+        day: 1
+      }
+    })
     this.get_free_drink_types()
     this.getPriceList()
   },
   methods: {
     ...mapActions('freeDrinkList', [
       'get_free_drink_list_config',
-      'get_free_drink_list_history',
+      'get_free_drink_list_history_from_to',
       'get_free_drink_list_reasons',
       'get_free_drink_types'
     ]),
-    ...mapActions('priceList', ['getPriceList'])
+    ...mapActions('priceList', ['getPriceList']),
+    change_month(payload) {
+      this.date = new Date(this.date.getFullYear(), this.date.getMonth() + payload, 1)
+    }
+  },
+  computed: {
+    to_date() {
+      return new Date(this.date.getFullYear(), this.date.getMonth()+1,1)
+    },
+    from_date() {
+      return new Date(this.date.getFullYear(), this.date.getMonth(), 1)
+    }
+  },
+  watch: {
+    date() {
+      this.get_free_drink_list_history_from_to({
+        from_date: {
+          year: this.from_date.getFullYear(),
+          month: this.from_date.getMonth() + 1,
+          day: 1
+        },
+        to_date: {
+          year: this.to_date.getFullYear(),
+          month: this.to_date.getMonth() + 1,
+          day: 1
+        }
+      })
+    }
   }
 }
 </script>

src/components/vorstand/FreeDrinkList/FreeDrinkListJob.vue

@@ -0,0 +1,108 @@
+<template>
+  <div>
+    <v-row justify="space-around">
+      <v-card>
+        <v-card-title class="text-center">
+          Anzahl Freigetränke
+        </v-card-title>
+        <v-card-text class="text-h2 text-center">
+          {{free_drink_list_history_job_without_canceled.length}}
+        </v-card-text>
+      </v-card>
+      <v-card>
+        <v-card-title class="text-center">
+          Summe Freigetränke
+        </v-card-title>
+        <v-card-text class="text-h2 text-center">
+          {{ (sum/100).toFixed(2)}} €
+        </v-card-text>
+      </v-card>
+    </v-row>
+    <v-data-table :headers="header" :items="table"/>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+
+export default {
+name: "FreeDrinkListJob",
+data() {
+  return {
+    header: [
+      {
+        text: 'Datum',
+        value: 'date'
+      },
+      {
+        text: 'Label Freigetränk',
+        value: 'label'
+      },
+      {
+        text: 'Freigetränk',
+        value: 'name'
+      },
+      {
+        text: 'Anzahl',
+        value: 'count'
+      },
+      {
+        text: 'Preis pro Getränk',
+        value: 'pricepro'
+      },
+      {
+        text: 'Preis gesamt',
+        value: 'sum'
+      }
+    ]
+  }
+},
+computed: {
+  ...mapGetters('freeDrinkList', ['free_drink_list_history_job_without_canceled', 'free_drink_list_config']),
+  sum() {
+    let sum = 0
+    this.free_drink_list_history_job_without_canceled.forEach(item => {
+      if (item.canceled) {
+        sum += item.free_drink_config.price
+      }
+    })
+    return sum
+  },
+  table() {
+    if (this.free_drink_list_history_job_without_canceled.length == 0) {
+      return []
+    }
+    let retVal = []
+    const date_month = this.free_drink_list_history_job_without_canceled[0].timestamp
+    let days = new Date(date_month.getFullYear(), date_month.getMonth() + 1, 0).getDate()
+    for (let day = 1; day <= days; day++) {
+      let from = new Date(date_month.getFullYear(), date_month.getMonth(), day)
+      let to = new Date(date_month.getFullYear(), date_month.getMonth(), day + 1)
+      let history_of_date = this.free_drink_list_history_job_without_canceled.filter(item => {
+        return item.timestamp >= from && item.timestamp <= to && !item.canceled
+      })
+      this.free_drink_list_config.forEach(drink_config => {
+        let history_of_config = history_of_date.filter(item => {
+          return item.free_drink_config_id == drink_config.id
+        })
+        if (history_of_config.length > 0) {
+          retVal.push({
+            date: `${from.getDate()}.${from.getMonth() + 1}.${from.getFullYear()}`,
+            label: drink_config.label,
+            name: drink_config.drink.name,
+            count: history_of_config.length,
+            pricepro: (drink_config.price / 100).toFixed(2),
+            sum: (drink_config.price / 100 * history_of_config.length).toFixed(2)
+          })
+        }
+      })
+    }
+    return retVal
+  }
+}
+}
+</script>
+
+<style scoped>
+
+</style>

src/components/vorstand/FreeDrinkList/FreeDrinkListMain.vue

@@ -1,12 +1,163 @@
 <template>
 <div>
-  Übersicht
+  <v-row justify="space-around">
+    <v-card>
+      <v-card-title class="text-center">
+        Anzahl Freigetränke
+      </v-card-title>
+      <v-card-text class="text-h2 text-center">
+        {{free_drink_list_history_without_canceled.length}}
+      </v-card-text>
+      <v-card-title class="text-center">
+        Summe Freigetränke
+      </v-card-title>
+      <v-card-text class="text-h2 text-center">
+        {{ (sum/100).toFixed(2)}} €
+      </v-card-text>
+    </v-card>
+    <v-card>
+      <v-card-title class="text-center">
+        Anzahl Dienstgetränke
+      </v-card-title>
+      <v-card-text class="text-h2 text-center">
+        {{ free_drink_list_history_job_without_canceled.length }}
+      </v-card-text>
+      <v-card-title class="text-center">
+        Summe Dienstgetränke
+      </v-card-title>
+      <v-card-text class="text-h2 text-center">
+        {{(sumJob/100).toFixed(2)}} €
+      </v-card-text>
+    </v-card>
+    <v-card>
+      <v-card-title class="text-center">
+        Anzahl AG-Getränke
+      </v-card-title>
+      <v-card-text class="text-h2 text-center">
+        {{ free_drink_list_history_workgroup_without_canceled.length }}
+      </v-card-text>
+      <v-card-title class="text-center">
+        Summe AG-Getränke
+      </v-card-title>
+      <v-card-text class="text-h2 text-center">
+        {{(sumWorkgroup/100).toFixed(2)}} €
+      </v-card-text>
+    </v-card>
+    <v-card>
+      <v-card-title class="text-center">
+        Anzahl Bandgetränke
+      </v-card-title>
+      <v-card-text class="text-h2 text-center">
+        {{ free_drink_list_history_band_without_canceled.length }}
+      </v-card-text>
+      <v-card-title class="text-center">
+        Summe Bandgetränke
+      </v-card-title>
+      <v-card-text class="text-h2 text-center">
+        {{(sumBand/100).toFixed(2)}} €
+      </v-card-text>
+    </v-card>
+  </v-row>
+  <v-data-table :headers="header" :items="table"/>
 </div>
 </template>
 
 <script>
+import {mapGetters} from 'vuex'
 export default {
-  name: "FreeDrinkListMain"
+  name: "FreeDrinkListMain",
+  data() {
+    return {
+      header: [
+        {
+          text: 'Datum',
+          value: 'date'
+        },
+        {
+          text: 'Label Freigetränk',
+          value: 'label'
+        },
+        {
+          text: 'Freigetränk',
+          value: 'name'
+        },
+        {
+          text: 'Anzahl',
+          value: 'count'
+        },
+        {
+          text: 'Preis pro Getränk',
+          value: 'pricepro'
+        },
+        {
+          text: 'Preis gesamt',
+          value: 'sum'
+        }
+      ]
+    }
+  },
+  computed: {
+    ...mapGetters('freeDrinkList', ['free_drink_list_history_without_canceled', 'free_drink_list_config', 'free_drink_list_history_job_without_canceled', 'free_drink_list_history_band_without_canceled', 'free_drink_list_history_workgroup_without_canceled']),
+    sum() {
+      let sum = 0
+      this.free_drink_list_history_without_canceled.forEach(item => {
+          sum += item.free_drink_config.price
+      })
+      return sum
+    },
+    sumJob() {
+      let sum = 0
+      this.free_drink_list_history_job_without_canceled.forEach(item => {
+        sum += item.free_drink_config.price
+      })
+      return sum
+    },
+    sumWorkgroup() {
+      let sum = 0
+      this.free_drink_list_history_workgroup_without_canceled.forEach(item => {
+        sum += item.free_drink_config.price
+      })
+      return sum
+    },
+    sumBand() {
+      let sum = 0
+      this.free_drink_list_history_band_without_canceled.forEach(item => {
+        sum += item.free_drink_config.price
+      })
+      return sum
+    },
+    table() {
+      if (this.free_drink_list_history_without_canceled.length == 0) {
+        return []
+      }
+      let retVal = []
+      const date_month = this.free_drink_list_history_without_canceled[0].timestamp
+      let days = new Date(date_month.getFullYear(), date_month.getMonth() + 1, 0).getDate()
+      for (let day = 1; day <= days; day++) {
+        let from = new Date(date_month.getFullYear(), date_month.getMonth(), day)
+        let to = new Date(date_month.getFullYear(), date_month.getMonth(), day + 1)
+        let history_of_date = this.free_drink_list_history_without_canceled.filter(item => {
+          return item.timestamp >= from && item.timestamp <= to && !item.canceled
+        })
+        this.free_drink_list_config.forEach(drink_config => {
+          let history_of_config = history_of_date.filter(item => {
+            return item.free_drink_config_id == drink_config.id
+          })
+          if (history_of_config.length > 0) {
+            retVal.push({
+              date: `${from.getDate()}.${from.getMonth() + 1}.${from.getFullYear()}`,
+              label: drink_config.label,
+              name: drink_config.drink.name,
+              count: history_of_config.length,
+              pricepro: (drink_config.price/100).toFixed(2),
+              sum:  (drink_config.price/100*history_of_config.length).toFixed(2)
+            })
+          }
+        })
+      }
+      return retVal
+    }
+  }
 }
 </script>
 

src/plugins/routes.js

@@ -30,6 +30,7 @@ const url = {
   resetPassword: main + 'passwordReset',
   freeDrinkListConfig: main + 'freeDrinkListConfig',
   freeDrinkListHistory: main + 'freeDrinkListHistory',
+  freeDrinkListHistoryFromTo: main + 'freeDrinkListHistoryFromTo',
   deleteDrinkListHistory: main + 'deleteDrinkListHistory',
   freeDrinkListReasons: main + 'freeDrinkListReasons',
   freeDrinkTypes: main + 'freeDrinkTypes',

src/router/index.js

@@ -31,6 +31,7 @@ import ResetPassword from '@/components/ResetPassword'
 import FreeDrinkList from '@/components/vorstand/FreeDrinkList'
 import FreeDrinkListMain from '@/components/vorstand/FreeDrinkList/FreeDrinkListMain'
 import FreeDrinkListConfig from '@/components/vorstand/FreeDrinkList/FreeDrinkListConfig'
+import FreeDrinkListJob from '@/components/vorstand/FreeDrinkList/FreeDrinkListJob'
 
 Vue.use(VueRouter)
 
@@ -100,6 +101,11 @@ const routes = [
                 path: 'config',
                 name: 'freeDrinkListConfig',
                 component: FreeDrinkListConfig
+              },
+              {
+                path: 'freeDrinkListJob',
+                name: 'freeDrinkListJob',
+                component: FreeDrinkListJob
               }
             ]
           }

src/store/modules/freeDrinkList.js

@@ -109,6 +109,24 @@ const actions = {
       commit('set_free_drink_list_history_loading', false)
     }
   },
+  async get_free_drink_list_history_from_to({ commit, dispatch, rootState },  data) {
+    try {
+      commit('set_free_drink_list_history_loading', true)
+      const response = await axios.post(url.freeDrinkListHistoryFromTo, {...data},{
+        headers: { Token: rootState.login.user.accessToken },
+        timeout
+      })
+      commit('set_free_drink_list_history', response.data)
+    } catch (e) {
+      if (e.message == 'Network Error') {
+        dispatch('connectionError/addError', null, { root: true })
+      }
+      if (e.response)
+        if (e.response.status === 401) dispatch('logout', null, { root: true })
+    } finally {
+      commit('set_free_drink_list_history_loading', false)
+    }
+  },
   async set_free_drink_list_history({ commit, dispatch, rootState }, data) {
     try {
       commit('set_free_drink_list_history_loading', true)
@@ -280,6 +298,11 @@ const getters = {
   free_drink_list_history(state) {
     return state.free_drink_list_history
   },
+  free_drink_list_history_without_canceled(state) {
+    return state.free_drink_list_history.filter(item => {
+      return !item.canceled
+    })
+  },
   free_drink_list_history_band(state) {
     return state.free_drink_list_history.filter(item => {
       return item.free_drink_type.id == 3
@@ -290,6 +313,11 @@ const getters = {
       return item.free_drink_type.id == 3 && !item.canceled
     })
   },
+  free_drink_list_history_job_without_canceled(state) {
+    return state.free_drink_list_history.filter(item => {
+      return item.free_drink_type.id == 1 && !item.canceled
+    })
+  },
   free_drink_list_history_job_credit(state) {
     let jobDrinks = state.free_drink_list_history.filter(item => {
       return item.free_drink_type.id == 1 && !item.canceled