element日期时间选择器设置时间段禁用时分秒的方法
<!-- eslint-disable no-undef -->
<template>
<div>
<el-date-picker class="picker" @change="handle_changeEnd" v-model="endTime" value-format="yyyy-MM-dd HH:mm:ss"
type="datetime" popper-class="date_picker" :picker-options="{
disabledDate(time) {
let curDate = (new Date()).getTime();
let three = 7 * 24 * 3600 * 1000;
let threeMonths = curDate + three;
return time.getTime() < Date.now() - 8.46e7 || time.getTime() > threeMonths; //如果没有后面的-8.64e6就是不可以选择今天的
}, selectableRange: startTimeRange
}" placeholder="选择日期时间"></el-date-picker>
<el-button @click="getEndTime">获取时间</el-button>
</div>
</template>
<script>// @ts-nocheck
import { reactive, toRefs, watch } from 'vue'
import moment from 'moment'
export default {
setup() {
const state = reactive({
beginTime: moment().format("YYYY-MM-DD HH:mm:ss"), // 案发开始时间
endTime: moment()
.add(2, "h")
.format("YYYY-MM-DD HH:mm:ss"),
startTimeRange: ""
})
const sm = {
getEndTime() {
console.log(state.beginTime, state.endTime, '32****')
},
handle_changeEnd(val) {
console.log(val, '214');
}
}
watch(() => state.endTime, (newValue) => {
if (newValue) {
let nowDate = moment().format('YYYY-MM-DD HH:mm:ss');
let dt = nowDate.split(" ");
let st = '';
if (newValue.split(" ")[0] == dt[0]) {
// 是今天,选择 的时间开始为此刻的时分秒
st = dt[1];
} else {
// 明天及以后从0时开始
st = '00:00:00';
}
state.startTimeRange = st + ' - 23:59:59';
//例如：如果今天此刻时间为10:41:40 则选择时间范围为： 10:41:40 - 23:59:59
//否则为：00:00:00- 23:59:59
}
})
return {
...toRefs(state),
...sm
}
}
}
</script>
<style lang="scss" scoped>
</style>
