<template>
  <v-card v-if="day">
    <v-card-title v-if="day.date">
      {{ 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"
        :items="allUsers"
        item-text="fullName"
        prepend-inner-icon="search"
        full-width
      />
      <v-btn @click="test({ worker: user, day: day })">Hinzufügen</v-btn>
    </v-card-text>
  </v-card>
</template>

<script>
import { mapGetters, mapActions } from 'vuex'
export default {
  name: 'Day',
  props: {
    day: Object
  },
  data() {
    return {
      user: null
    }
  },
  created() {},
  methods: {
    ...mapActions({
      setWorker: 'sm/setWorker'
    }),
    test(data) {
      this.setWorker(data)
      console.log('user', this.day)
    }
  },
  computed: {
    ...mapGetters({
      allUsers: 'sm/allUsers'
    })
  }
}
</script>

<style scoped></style>
