现有如下需求：
今天是7月8日，今天之前日期不可选
当先设置结束时间为7月20日，开始时间只能选择今天到20号之间的日期（图一）
当先设置开始时间为7月20日，结束时间只能选择20日以后的时间（图二）

完整代码如下

<template>
  <div class='box'> 
    <el-form :model="Form" ref="Form" :rules="rules">
      <el-form-item label="开始结束日期" required :label-width="'150px'">
        <el-col :span="5">
          <el-form-item prop="startTime">
            <el-date-picker
              @focus="clickStartTime"
              type="date"
              placeholder="选择日期"
              :picker-options="startTimeOptions"
              v-model="Form.startTime"
              format="yyyy 年 MM 月 dd 日 "
              value-format="yyyy-MM-dd HH:mm:ss"
              style="width: 100%;"></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col class="line" :span="2" style="text-align: center;line-height: 40px;">-</el-col>
        <el-col :span="5">
          <el-form-item prop="endTime">
            <el-date-picker
              @focus="clickEndTime"
              type="date"
              placeholder="选择日期"
              v-model="Form.endTime"
              :picker-options="endTimeOptions"
              format="yyyy 年 MM 月 dd 日"
              value-format="yyyy-MM-dd HH:mm:ss"
              style="width: 100%;">
            </el-date-picker>
          </el-form-item>
        </el-col>
      </el-form-item>
    </el-form>
    <div slot="footer" class="footer" style="textAlign:center">
        <el-button type="primary">取 消</el-button>
        <el-button type="primary" @click="submitForm()">确 定</el-button>
      </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        Form:{
          startTime:'',
          endTime:''
        },
        startTimeOptions:{}, 
        endTimeOptions:{},
        rules:{
          startTime: [
            { required: true, message: '请选择开始时间', trigger: 'blur' }
          ],
          endTime: [
            { required: true, message: '请选择结束时间', trigger: 'blur' }
          ],
        }
      }
    },
    methods:{
      clickStartTime() {
        this.startTimeOptions.disabledDate = time => {
          if (this.Form.endTime) {
            if (time.getTime() > new Date(this.Form.endTime).getTime()) {
              return true
            }
            if (time.getTime() < Date.now() - 8.64e7) {
              return true
            }
          } else {
            if (time.getTime() < Date.now() - 8.64e7) {
              return true
            }
          }
        }
      },
      clickEndTime(){
        this.endTimeOptions.disabledDate = time => {
          if (this.Form.startTime) {
            return (
              time.getTime() > Date.now || time.getTime() < new Date(this.Form.startTime).getTime()
            )
          } else {
            return time.getTime() < Date.now()
          }
        }
      },
      submitForm(){
        this.$refs.Form.validate(async valid => {
            console.log(valid)
        })
      }
    }
  };
</script>
<style scope lang="scss">
  .box{
    padding-top:100px;
    height: 100px;
  }
</style>