<template>
    <div class="dialog-input-text">
      <el-row>
      <el-col :span="2"><el-input  onkeyup="this.value=this.value.replace(/[^\d.]/g,'');" v-model="minYear"/></el-col>
      <el-col :span="2"><span style="margin-left:30%">{{$t('common.year')}}</span></el-col>
      <el-col :span="2"><el-input style="width: 100%; margin-left:10%" onkeyup="this.value=this.value.replace(/[^\d.]/g,'');" v-model="minMonth"/></el-col>
      <el-col :span="2"><span style="margin-left:40%">{{$t('common.month')}}</span></el-col>
      <el-col :span="2"><span style="margin-left:40%">-</span></el-col>
      <!--<el-col span="1"><span style="margin-left:3%"></span></el-col>-->
      <el-col :span="2"><el-input style="width: 100%; margin-left:20%" onkeyup="this.value=this.value.replace(/[^\d.]/g,'');" v-model="maxYear"/></el-col>
      <el-col :span="2"><span style="margin-left:50%">{{$t('common.year')}}</span></el-col>
      <el-col :span="2"><el-input style="width: 100%; margin-left:20%" onkeyup="this.value=this.value.replace(/[^\d.]/g,'');" v-model="maxMonth"/></el-col>
      <el-col :span="2"><span style="margin-left:50%">{{$t('common.month')}}</span></el-col>
      </el-row>
    </div>
</template>

<script>
export default {
  props: {
    valueFormat: {
      type: String,
      default: function () {
        return ''
      }
    },
    editable: {
      type: Boolean,
      default: function () {
        return true
      }
    },
    // v-model绑定的数据
    value: {
      type: [Array, String, Object],
      default: function () {
        return null
      }
    },
    align: {
      type: String,
      default: function () {
        return 'right'
      }
    },
    type: {
      type: String,
      default: function () {
        return ''
      }
    },
    unlink: {
      type: Boolean,
      default: function () {
        return false
      }
    },
    // 是否禁用修改
    disabled: {
      type: Boolean,
      default: function () {
        return false
      }
    },
    // 是否可清除
    clearable: {
      type: Boolean,
      default: function () {
        return true
      }
    },
    // 默认提示语
    placeholder: {
      type: String
    },
    xhr: {
      type: Function,
      default: function () {
        return null
      }
    },
    pickerOptions: {
      type: Object,
      default: function () {
        return null
      }
    }
  },
  data () {
    return {
      // minYear: this.value[0],
      // minMonth: this.value[1],
      // minDay: this.value[2],
      // maxYear: this.value[3],
      // maxMonth: this.value[4],
      // maxDay: this.value[5]
    }
  },
  watch: {
    minYear: function (newValue) {
      if (Number(this.minYear) > 99) {
        this.minYear = '99'
      }
    },
    maxYear: function (newValue) {
      if (Number(this.maxYear) > 99) {
        this.maxYear = '99'
      }
    },
    minMonth: function (newValue) {
      if (Number(this.minMonth) > 11) {
        this.minMonth = '11'
      }
    },
    maxMonth: function (newValue) {
      if (Number(this.maxMonth) > 11) {
        this.maxMonth = '11'
      }
    },
    minDay: function (newValue) {
      if (Number(this.minDay) > 29) {
        this.minDay = '29'
      }
    },
    maxDay: function (newValue) {
      if (Number(this.maxDay) > 29) {
        this.maxDay = '29'
      }
    }
  },
  methods: {
  },
  computed: {
    minYear: {
      get: function () { return this.value[0] },
      set: function (val) {
        let v = Object.assign({}, this.value)
        v[0] = val
        this.$emit('select', v)
      }
    },
    minMonth: {
      get: function () { return this.value[1] },
      set: function (val) {
        let v = Object.assign({}, this.value)
        v[1] = val
        this.$emit('select', v)
      }
    },
    minDay: {
      get: function () { return this.value[2] },
      set: function (val) {
        let v = Object.assign({}, this.value)
        v[2] = val
        this.$emit('select', v)
      }
    },
    maxYear: {
      get: function () { return this.value[3] },
      set: function (val) {
        let v = Object.assign({}, this.value)
        v[3] = val
        this.$emit('select', v)
      }
    },
    maxMonth: {
      get: function () { return this.value[4] },
      set: function (val) {
        let v = Object.assign({}, this.value)
        v[4] = val
        this.$emit('select', v)
      }
    },
    maxDay: {
      get: function () { return this.value[5] },
      set: function (val) {
        let v = Object.assign({}, this.value)
        v[5] = val
        this.$emit('select', v)
      }
    }
  }
}

</script>
<style scoped lang="scss">
  @import '~@/styles/tracemgr/factoringCommissioner/taskTable/supplierSealNotice/taskDialog.scss';
</style>
