import Panel from 'element-ui-for-gov/packages/date-picker/src/panel/date';

export default {
  name: 'DatePanel',
  components: {Panel},
  model: {
    prop: 'value',
    event: 'pick'
  },
  props: {
    firstDayOfWeek: {type: Number, default: 7},
    value: {type: Date, default: () => new Date()},
    hideHeader: {type: Boolean, default: false}
  },
  watch: {
    value(val) {
      this.$refs.panel.value = val;
    }
  },
  mounted() {
    this.$refs.panel.transition = false;
    this.$refs.panel.visible = true;
    this.$refs.panel.firstDayOfWeek = this.firstDayOfWeek;
    this.$refs.panel.value = this.value;
    this.$refs.panel.hideHeader = this.hideHeader;
  },
  methods: {
    onPick(date) {
      this.$emit('pick', date);
    }
  },
  render() {
    return (<Panel ref="panel" {...{on: {pick: this.onPick}}} scopedSlots={this.$scopedSlots} />);
  }
};
