<template>
  <el-form-item :label="label" :rules="requireRule(required, label)" :prop="prop" :label-width="labelWidth">
    <el-date-picker
      v-model="formRef.model[prop]"
      :type="type"
      :value-format="format"
      :format="format"
      :default-time="defaultTime"
      :placeholder="placeholder || $t('common.pleaseSelectHasPara',[label])"
      :style="{'width':width}"
      :start-placeholder="$t('common.dateRangeStart')"
      range-separator="~"
      :end-placeholder="$t('common.dateRangeEnd')"
      :picker-options="pickerBeginOption || datePickerOptions"
      :disabled="disabled"
      @change="$emit('change')"
      :clearable="clearable">
    </el-date-picker>
  </el-form-item>
</template>

<script>
import mixin from './mixin'
import {compareDateWithAccuracy, formatDate, formatDateTime, isDate} from "../../../../utils";
/**
 * 返回格式化后的日期（范围）
 * 日期类型返回单个字符串，日期范围返回包含开始和结束日期的数组
 */
export default {
  mixins: [mixin],
  props: {
    type: {
      type: String,
      default: 'date',
    },
    labelWidth: {
      type: String
    },
    defaultTime: {
      type: String,
      default: '00:00:00',
    },
    defaultValue:{
      type: Date,
      default: null
    },
    pickerBeginOption: {
      type: Object,
      default: null
    },
    miniTime:{
      default: null
    },
    miniAble:{
      type: Boolean,
      default: true
    },
    maxAble:{
      type: Boolean,
      default: true
    },
    maxTime:{
      default: null
    },
    width: {
      type: String
    },
  },
  computed: {
    format() {
      switch (this.type) {
        case 'year':
          return 'yyyy'
        case 'date':
        case 'daterange':
          return 'yyyy-MM-dd'
        case 'month':
          return 'yyyy-MM'
        case 'datetime':
          return 'yyyy-MM-dd HH:mm'
      }
    },
    compareType(){
      switch (this.type) {
        case 'date':
          return 'd'
        case 'month':
          return 'm'
        case 'year':
          return 'y'
      }
    }
  },
  mounted() {
    if(this.defaultValue != null && this.defaultValue != '' && (this.formRef.model[this.prop] == null || this.formRef.model[this.prop] == '' || this.formRef.model[this.prop] == undefined)){
      this.formRef.model[this.prop] = formatDateTime(this.defaultValue,this.format)
    }
  },
  methods:{

  },
  data(){
    return{
      datePickerOptions: {
        disabledDate: time => {
          // console.log('miniTime',this.miniTime)
          // console.log('maxTime',this.maxTime)

          const minTime = this.miniTime ? isDate(this.miniTime) ? this.miniTime : this.$moment(this.miniTime) : null;
          const maxTime = this.maxTime ? isDate(this.maxTime) ? this.maxTime : this.$moment(this.maxTime) : null;

          // console.log('const minTime',minTime)
          // console.log('const maxTime',maxTime)

          // console.log('isDate(this.miniTime)::', isDate(minTime))
          // console.log('isDate(this.maxTime)::', isDate(maxTime))
          //只有最小时间限制
          if(this.miniTime && !this.maxTime){
            if(this.maxAble){
              return  compareDateWithAccuracy(time,minTime,this.compareType)  < 0
            }else{
              return  compareDateWithAccuracy(time,minTime,this.compareType)  <= 0
            }
          }
          //只有最大时间限制
          if (this.maxTime && !this.miniTime){
            if(this.miniAble){
              return  compareDateWithAccuracy(time,maxTime,this.compareType)  > 0
            }else{
              return  compareDateWithAccuracy(time,maxTime,this.compareType)  >= 0
            }
          }
          if (this.maxTime && this.miniTime){
            //填入时间都可使用
            if(this.miniAble && this.maxAble){
              return  compareDateWithAccuracy(time,maxTime,this.compareType)  > 0
                || compareDateWithAccuracy(time,minTime,this.compareType)  < 0
            }else if(this.miniAble && !this.maxAble){
              return  compareDateWithAccuracy(time,maxTime,this.compareType)  >= 0
                || compareDateWithAccuracy(time,minTime,this.compareType)  < 0
            }else if(!this.miniAble && this.maxAble){
              return  compareDateWithAccuracy(time,maxTime,this.compareType)  >  0
                || compareDateWithAccuracy(time,minTime,this.compareType)  <= 0
            }else if(!this.miniAble && !this.maxAble){
              return  compareDateWithAccuracy(time,maxTime,this.compareType)  >= 0
                || compareDateWithAccuracy(time,minTime,this.compareType)  <= 0
            }
          }
          return false
        }
      }
    }
  }
}
</script>
