<el-date-picker v-model="chartsTime" type="datetimerange" :clearable='clearableState' value-format="yyyy-MM-dd HH:mm:ss" range-separator="至" @change="changeTime" start-placeholder="開始日期" end-placeholder="結束日期" :picker-options="pickerOptions" >
// 前后需要的天數-1 const space = 7 // 所選的第一個日期 let _minDate = '' import { nowTime, yesterday } from "@/utils/time"; import dayjs from 'dayjs' export default { data() { return { chartsTime: [yesterday(), nowTime()], clearableState:false, pickerOptions: { // 設置禁用狀態 disabledDate: (time) => { // 當選中第一個時間時 if (_minDate) { // 最小時間 const min = dayjs(_minDate).subtract(space, 'day') // 最大時間 const max = dayjs(_minDate).add(space, 'day') return ( // 控制可以選擇的時間范圍 dayjs(time).isBefore(min) || dayjs(max).isBefore(time) ) } else { return false } }, // 選中日期后會執行的回調 onPick({ minDate }) { _minDate = minDate }, },
import dayjs from 'dayjs'