美文网首页
el-date-picker开始时间不能晚于结束时间

el-date-picker开始时间不能晚于结束时间

作者: Frank_Fang | 来源:发表于2023-09-19 16:02 被阅读0次

    Template

    <el-form-item :label="$t('endTime')" prop="endTime">
        <el-date-picker v-model="formData.endTime" type="datetime" default-time="12:00:00" :readonly="readonly" :picker-options="releaseOptions" :placeholder="$t('pleaseSelect')" class="w-100"></el-date-picker>
    </el-form-item>
    <el-form-item :label="$t('startTime')" prop="startTime">
        <el-date-picker v-model="formData.startTime" :disabled="!formData.endTime" type="datetime" default-time="12:00:00" :readonly="readonly" :picker-options="notificationOptions" :placeholder="$t('pleaseSelect')" class="w-100"></el-date-picker>
    </el-form-item>
    
    

    Script

    endOptions: {
      disabledDate: (time) => {
        let res = false
        if (this.formData && this.formData.startTime) {
          res = time.getTime() > new Date(this.formData.startTime)
        } else {
          res = time.getTime() < (Date.now() - 24 * 60 * 60 * 1000)
        }
        return res
      }
    },
    startOptions: {
      disabledDate: (time) => {
        let res = false
        console.log(this.formData)
        if (this.formData && this.formData.endTime) {
          res = (time.getTime() > new Date(this.formData.endTime)) || (time.getTime() < (Date.now() - 24 * 60 * 60 * 1000))
        } else {
          res = time.getTime() < (Date.now() - 24 * 60 * 60 * 1000)
        }
        return res
      }
    }
    

    相关文章

      网友评论

          本文标题:el-date-picker开始时间不能晚于结束时间

          本文链接:https://www.haomeiwen.com/subject/bbnnvdtx.html