elementui+ <el-date-picker type=“datetime“/>时间组件的当前时间的180天之内的禁止选择处理

2023-12-18 21:08:54

需求1如下:当前时间+180天不可选择,180天之后可以选择,之前的时间都禁止选择

页面代码如下:

? <el-date-picker

? ? ? ? ? ? v-model="temp.expire_time"

? ? ? ? ? ? :picker-options="pickerOption"

? ? ? ? ? ? type="datetime"

? ? ? ? ? ? placeholder="选择日期时间"

? ? ? ? ? ? format="yyyy-MM-dd ?HH:mm:ss "

? ? ? ? ? ? value-format="yyyy-MM-dd HH:mm:ss"

? ? ? ? ? />

pickerOption: {

? ? ?? // 限制只能选择180天以后的时间

? ? ? ? disabledDate: (time) => {

? ? ? ? ? return (time.getTime() < Date.now() + 8.64e7 * 180)

? ? ? ? }

? ? ? },

需求2如下:默认选择当前时间的180天的时间,所有时间都可以选择

页面代码同需求1一样,不同的是处理默认选择的时间

methods: {

? ? // 获取当前时间的180天后的时间值

? ? getThreeTime() {

? ? ? var data = new Date()

? ? ? var Da = new Date(data.getTime() + 24 * 60 * 60 * 1000 * 180)

? ? ? var y = Da.getFullYear()

? ? ? var m = Da.getMonth() + 1

? ? ? var d = Da.getDate()

? ? ? var H = Da.getHours()

? ? ? var mm = Da.getMinutes()

? ? ? var ss = Da.getSeconds()

? ? ? m = m < 10 ? '0' + m : m

? ? ? d = d < 10 ? '0' + d : d

? ? ? H = H < 10 ? '0' + H : H

? ? ? return y + '-' + m + '-' + d + ' ' + H + ':' + mm + ':' + ss

? ? },

}

?// 授权有效期默认值是180天

编辑的函数中处理如下

? ? ? if (row.expire_time === null) {

? ? ? ? // 授权有效期默认值选择是180天之后的

? ? ? ? this.$set(this.temp, 'expire_time', this.getThreeTime());

? ? ? } else {

? ? ? ? this.$set(this.temp, 'expire_time', row.expire_time);

? ? ? }

以上就是关于年月日时分秒的时间组件的两种需求处理,今天就分享到这里啦!

文章来源:https://blog.csdn.net/qq_41920758/article/details/135056258
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。