el-data-picker 结束日期不能小于开始日期

<template>
    <el-form :model="project">
        <el-form-item>
            <el-col :span="11">
                <el-date-picker
                  size="mini"
                  v-model="project.planDateSta"
                  value-format="yyyy-MM-dd"
                  type="data"
                  placeholder="开始日期"
                  autocomplete="off"
                  style="width: 100%"
                  // data中调用
                  :picker-options="pickerOptionsStart"
                ></el-date-picker>
            </el-col>
            <el-col style="text-align: center" :span="2">-</el-col>
            <el-col :span="11">
                <el-date-picker
                  size="mini"
                  v-model="project.planDateEnd"
                  value-format="yyyy-MM-dd"
                  type="data"
                  align="right"
                  placeholder="结束日期"
                  autocomplete="off"
                  style="width: 100%"
                  :picker-options="pickerOptionsEnd"
                ></el-date-picker>
            </el-col>
        </el-form-item>
    </el-form>
</template>
<script>
export default {
    data() {
        return {
            // 开始日期 :picker-options 中引用
            pickerOptionsStart: {
                disabledDate: time => {
                    // 获取结束日期的 v-model 值并赋值给新定义的对象
                    let endDateVal = this.project.planDateEnd;
                    if (endDateVal) {
                        // 比较 距 1970 年 1 月 1 日之间的毫秒数:
                        return time.getTime() > new Date(endDateVal).getTime();
                    }
                }
            },
            // 结束日期 :picker-options 中引用
            pickerOptionsEnd: {
                disabledDate: time => {
                    // 获取开始日期的 v-model 值并赋值给新定义的对象
                    let beginDateVal = this.project.planDateSta;
                    if (beginDateVal) {
                        // 比较 距 1970 年 1 月 1 日之间的毫秒数:
                        return time.getTime() < new Date(beginDateVal).getTime() - 1 * 24 * 60 * 60 * 1000
                    }
                }
            }
        }
    }
}
</script>

 

posted on 2019-07-08 19:42  ㅤㅤㅤㅤㅤㅤ  阅读(1452)  评论(0编辑  收藏  举报

导航