<template>
  <FixUniDatetimePicker :class="className" :value="selectVal" type="datetime" :start="minDate" :end="maxDate" :hide-second="hideSecond" @change="changeEvent" :border="border" :clear-icon="clearable" />
</template>

<script>
import FixUniDatetimePicker from '../fix-uni-datetime-picker/fix-uni-datetime-picker.vue'

export default {
  name: 'MlDatetimePicker',
  options: {
    virtualHost: true
  },
  components: {
    FixUniDatetimePicker
  },
  props: {
    value: String,
    border: {
      type: Boolean,
      default: false
    },
    minDate: [String, Number],
    maxDate: [String, Number],
    readonly: Boolean,
    disabled: Boolean,
    clearable: Boolean,
    hideSecond: Boolean,
    className: String
  },
  data () {
    return {
      selectVal: ''
    }
  },
  watch: {
    value (value) {
      this.selectVal = value
    }
  },
  created () {
    if (this.value) {
      this.selectVal = this.value
    }
  },
  methods: {
    changeEvent (value) {
      this.selectVal = value
      this.$emit('input', value)
      this.$emit('change', { value })
    }
  }
}
</script>
