<template>
  <div>
    <div class="has-text-right mb-2">
      <span class="tag is-rounded is-danger is-clickable" @click="remove()">Xóa ngày</span>
    </div>
    <b-field>
        <b-datepicker
        inline
        v-model="date"
        :unselectable-days-of-week="[0, 6]"
        @input="changeDate()">
        </b-datepicker>
    </b-field>
  </div>
</template>
<script>
export default {
  props: ['trandate'],
  data() {
    return {
      date: undefined
    }
  },
  created() {
    this.date = new Date(this.trandate)
  },
  methods: {
    changeDate() {
      this.$emit('modalevent', {name: 'changedate', data: this.date})
      this.$emit('close')
    },
    remove() {
      this.date = null
      this.changeDate()
    }
  } 
}
</script>