<el-date-picker
v-model="startEndTime"
type="daterange"
align="right"
unlink-panels
range-separator="至"
start-placeholder="开始月份"
end-placeholder="结束月份"
:picker-options="pickerOptions"
value-format="yyyy-MM-dd"
@change="handleChange"
>
</el-date-picker>
pickerOptions: {
shortcuts: [
{
text: '今天',
onClick(picker) {
picker.$emit('pick', [new Date(),new Date()]);
}
},
{
text: '昨天',
onClick(picker) {
const date = new Date();
const end = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24);
end.setTime(end.getTime() - 3600 * 1000 * 24);
picker.$emit('pick', [date,end]);
}
},
{
//本周
text: '本周',
onClick(picker) {
let now = new Date();
let day = now.getDay();
console.log('day',day);
let weeks = new Array(7, 1, 2, 3, 4, 5, 6);
let week = weeks[day];
console.log('week',week);
const start = new Date();
const end = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * (week-1));
picker.$emit('pick', [start, end]);
}
},
{
text: '本月',
onClick(picker) {
let now = new Date();
let day = now.getDate();
//const start = new Date(new Date().getMonth()+1,0);
const start = new Date();
const end = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * (day - 1));
picker.$emit('pick', [start, end]);
}
},
{
text: '本年',
onClick(picker) {
const end = new Date();
const start = new Date(new Date().getFullYear(), 0);
console.log('start',start);
picker.$emit('pick', [start, end]);
}
}
]
}
优化本周、本月
{
//本周
text: '本周',
onClick(picker) {
let now = new Date();
//getDay 从Date对象返回一周中的某一天(0~6)
let day = now.getDay();
let num;
if(day === 0) {
num = 7;
}else {
num = day;
}
const start = new Date();
const end = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * (num-1));
picker.$emit('pick', [start, end]);
}
},
{
text: '本月',
onClick(picker) {
const end = new Date();
const start = new Date();
//setDate() 方法用于设置一个月的某一天。
start.setDate(1);
picker.$emit('pick', [start, end]);
}
}