finished serviceManagement

2020-01-19 21:31:48 +01:00 · 2020-01-19 21:31:48 +01:00 · af542bb2e5
parent b724f83e84
commit af542bb2e5
4 changed files with 217 additions and 114 deletions
--- a/src/components/vorstand/ServiceManagement.vue
+++ b/src/components/vorstand/ServiceManagement.vue
@ -11,7 +11,10 @@
            <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-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>
@ -20,17 +23,22 @@
        <v-spacer />
      </v-toolbar>
      <v-card v-for="week in month" :key="month.indexOf(week)">
-        <v-card-title>
+        <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()}}
+            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">
-            <Day v-bind:day="day" />
+              <v-col>
+                <Day v-bind:day="day"/>
+              </v-col>
            </div>
+          </v-row>
        </v-card-text>
      </v-card>
    </v-content>
@ -74,9 +82,9 @@ export default {
    }),
    changeMonth(value) {
      if (value === -1) {
-        this.date = new Date(this.date.getFullYear(), this.date.getMonth(), 0, 1)
+        this.date = new Date(this.date.getFullYear(), this.date.getMonth() - 1)
      } else {
-        this.date = new Date(this.date.getFullYear(), this.date.getMonth() + 2, 0, 1)
+        this.date = new Date(this.date.getFullYear(), this.date.getMonth() + 1)
      }
      this.createMonth(this.date)
    }
--- a/src/components/vorstand/ServiceManagementComponents/Day.vue
+++ b/src/components/vorstand/ServiceManagementComponents/Day.vue
@ -1,28 +1,46 @@
 <template>
-  <v-card v-if="day">
-    <v-card-title v-if="day.date">
+  <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-chip v-for="worker in day.worker" :key="day.worker.indexOf(worker)">
-        {{ worker.firstname }} {{ worker.lastname }}
-      </v-chip>
        <v-autocomplete
          chips
-        outlined
          return-object
-        v-model="user"
-        placeholder="Suche Person"
+          multiple
+          v-model="day.worker"
          :items="allUsers"
          item-text="fullName"
-        prepend-inner-icon="search"
-        full-width
-      />
-      <v-btn @click="test({ worker: user, day: day })">Hinzufügen</v-btn>
+          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>
@ -33,24 +51,69 @@ export default {
    day: Object
  },
  data() {
-    return {
-      user: null
-    }
+    return {}
+  },
+  created() {
+    this.getUser({date: this.day.date.getTime()/1000})
  },
-  created() {},
  methods: {
    ...mapActions({
-      setWorker: 'sm/setWorker'
+      addUser: 'sm/addUser',
+      getUser: 'sm/getUser',
+      deleteUser: 'sm/deleteUser'
    }),
-    test(data) {
-      this.setWorker(data)
-      console.log('user', this.day)
+    // 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>
--- a/src/plugins/routes.js
+++ b/src/plugins/routes.js
@ -18,7 +18,14 @@ const url = {
  finanzerSendAllMail: main + 'finanzerSendAllMail',
  finanzerSendOneMail: main + 'finanzerSendOneMail',
  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
--- a/src/store/modules/serviceManagement.js
+++ b/src/store/modules/serviceManagement.js
@ -20,8 +20,7 @@ const mutations = {
    let id = 0
    const year = date.getFullYear()
    const mon = date.getMonth()
-    let a = new Date(year, mon, 0, 13, 1)
-    console.log('createMonth', a)
+    let a = new Date(year, mon + 1, 0)
    let days = a.getDate()
    let startDate = 1
    for (let intDay = 1; intDay <= days; intDay++) {
@ -30,45 +29,15 @@ const mutations = {
        break
      }
    }
+    let end = false
    let week = { id: id, days: {} }
-    for (let intDay = startDate; intDay <= days; intDay++) {
-      let currentDate = new Date(year, mon, intDay, 13, 1)
-      console.log('currentDate', currentDate)
+    for (let intDay = startDate; intDay <= days + 7; intDay++) {
+      if (end) break
+      let currentDate = new Date(year, mon, intDay, 12)

      switch (currentDate.getDay()) {
        case 1:
-          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
-          }
-
+          mutations.setStartEndDate(week)
          month.push(week)
          id++
          week = { id: id, days: {} }
@ -88,12 +57,18 @@ const mutations = {
          }
          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 = {
@ -129,6 +104,9 @@ const mutations = {
          break
      }
    }
+    state.month = month
+  },
+  setStartEndDate: week => {
    if (week.days.monday) {
      week.startDate = week.days.monday.date
    } else if (week.days.tuesday) {
@ -160,20 +138,24 @@ const mutations = {
    } else if (week.days.monday) {
      week.endDate = week.days.monday.date
    }
-    month.push(week)
-    state.month = month
-    console.log(state.month)
  },
-  setWorker: (state, data) => {
-    console.log('hier ist die mutation', data)
-    for (let week in state.month) {
-      console.log('week', week)
+  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) {
-        console.log(state.month[week].days[day], data.day)
-        if (state.month[week].days[day].date - data.day.date === 0) {
-          state.month[week].days[day].worker.push(data.worker)
-          console.log('sm', state.month)
-          return
+        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
+            })
+          }
        }
      }
    }
@ -196,9 +178,52 @@ const actions = {
        if (e.response.data === 401) dispatch('logout', null, { root: true })
    }
  },
-  setWorker({ commit }, data) {
-    console.log('hier bin ich', data)
-    commit('setWorker', data)
+  // 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 = {