import {
  saveScheduleEvents,
  submitSchedule
} from '@/api/calendar'
import { State } from '@/constant'

export default {
  props: {
    detail: {
      type: Object,
      default: null
    },
    hideHeader: {
      type: [Boolean, String],
      default: false
    }
  },
  data () {
    return {
      scheduleOptions: null,
      editable: false
    }
  },
  computed: {
    events () {
      return this.scheduleOptions?.events || []
    },
    isEmpty () {
      return this.events.length === 0
    },
    name () {
      return this.scheduleOptions?.name
    },
    ratio () {
      return this.scheduleOptions?.resolutionRatio
    }
  },
  created () {
    this.editable = this.detail.status === State.READY
    this.scheduleOptions = {
      ...this.detail,
      events: this.transformEvents(this.detail.events)
    }
  },
  methods: {
    transformEvents (events) {
      return events
    },
    getEvents () {
      return this.events
    },
    save () {
      return saveScheduleEvents(this.scheduleOptions, this.getEvents())
    },
    submit () {
      submitSchedule(this.scheduleOptions, this.getEvents()).then(() => {
        this.editable = false
        this.$emit('submit')
      })
    }
  }
}