DatePicker 日期选择器 快捷方法，今天，昨天，本周，上周，本月 ，上月，本季度，上季度，本年和上年脚本
需求就是日期选择需要快捷方法，并且需要这些选项
今天，昨天，本周，本月，上月，本季度，上季度，本年，上年，最近7天，最近30天。
网上找了几个，然后综合了一下，基本满足了需求功能要求，
上代码
<el-form-item label="时间段" prop="platformName">
<el-date-picker
v-model="queryParams.dateRange"
type="daterange"
align="right"
unlink-panels
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
:picker-options="pickerOptions"
>
</el-date-picker>
</el-form-item>
快捷脚本
pickerOptions: { shortcuts: [ { text: "今天", onClick(picker) { const end = new Date(); const start = new Date(); start.setTime(start.getTime() - 3600 * 1000 * 24 * 0); picker.$emit("pick", [start, end]); }, }, { text: "昨天", onClick(picker) { const end = new Date(); const start = new Date(); start.setTime(start.getTime() - 3600 * 1000 * 24 * 1); picker.$emit("pick", [start, end]); }, }, { text: "最近7天", onClick(picker) { const end = new Date(); const start = new Date(); start.setTime(start.getTime() - 3600 * 1000 * 24 * 7); picker.$emit("pick", [start, end]); }, }, { text: "最近30天", onClick(picker) { const end = new Date(); const start = new Date(); start.setTime(start.getTime() - 3600 * 1000 * 24 * 30); picker.$emit("pick", [start, end]); }, }, { text: "本周", onClick(picker) { const end = new Date(); const start = new Date(); const nows = start.getDay()||7 //注意周日算第一天，如果周日查询本周的话，天数是0，所有如 果是0，默认设置为7 start.setTime(start.getTime() - 3600 * 1000 * 24 * ((nows - 1))); //start.setTime(start.getTime() - 3600 * 1000 * 24 * 7); picker.$emit("pick", [start, end]); }, }, { text: "上周", onClick(picker) { const dataValue = new Date(); const year = dataValue.getFullYear(); const month = dataValue.getMonth() + 1; const day = dataValue.getDate(); var thisWeekStart; //本周周一的时间 if (dataValue.getDay() == 0) { //周天的情况； thisWeekStart = new Date(year + "/" + month + "/" + day).getTime() - (dataValue.getDay() + 6) * 86400000; } else { thisWeekStart = new Date(year + "/" + month + "/" + day).getTime() - (dataValue.getDay() - 1) * 86400000; } const prevWeekStart = thisWeekStart - 7 * 86400000; //上周周一的时间 const prevWeekEnd = thisWeekStart - 1 * 86400000; //上周周日的时间 const start = new Date(prevWeekStart); //开始时间 const end = new Date(prevWeekEnd); //结束时间 picker.$emit("pick", [start, end]); }, }, { text: "本月", onClick(picker) { const end = new Date(); const start = new Date(); start.setDate(1); picker.$emit("pick", [start, end]); }, }, { text: "上月", onClick(picker) { const start = new Date(); const end = new Date(start); end.setMonth(start.getMonth()); start.setMonth(start.getMonth() - 1); end.setDate(0); start.setDate(1); picker.$emit("pick", [start, end]); //https://blog.csdn.net/holily_/article/details/105990614 }, }, { text: "本季度", onClick(picker) { var y = new Date().getFullYear(); //当前年份 var m = new Date().getMonth(); //当前月份 var q = parseInt(m / 3); //当前季度 var qs = new Date(y, (q - 0) * 3, 1); //上一季度的开始日期 // var qe = new Date(y, (q+1) * 3, 0); //上一季度的结束日期 var qe = new Date(); //动态 //var qe = new Date(y, (q+1) * 3, 0); //上一季度的结束日期 // var currentDate = new Date() // var currentYear = currentDate.getFullYear() // var currentMonth = currentDate.getMonth() // var start = '' // var end = '' // if (currentMonth == 0 || currentMonth == 1 || currentMonth == 2) { // /* 第一季度 */ // start = new Date(currentYear, 0, 1) // // end = new Date(currentYear, 2, 31) // end = new Date() // } // if (currentMonth == 3 || currentMonth == 4 || currentMonth == 5) { // /* 第二季度 */ // start = new Date(currentYear, 3, 1) // //end = new Date(currentYear, 5, 30) // end = new Date() // } // if (currentMonth == 6 || currentMonth == 7 || currentMonth == 8) { // /* 第三季度 */ // start = new Date(currentYear, 6, 1) // // end = new Date(currentYear, 8, 30) // end = new Date() // } // if ( // currentMonth == 9 || // currentMonth == 10 || // currentMonth == 11 // ) { // /* 第四季度 */ // start = new Date(currentYear, 9, 1) // // end = new Date(currentYear, 11, 31) // end = new Date() // } //end.setHours(23, 59, 59, 0) picker.$emit('pick', [qs, qe]) //https://blog.csdn.net/weixin_44683763/article/details/120481591 }, }, { text: "上季度", onClick(picker) { var y = new Date().getFullYear(); //当前年份 https://zhidao.baidu.com/question/1388556289703065980.html 最简单的方法大神就是大神，简单，而且准确 var m = new Date().getMonth(); //当前月份 var q = parseInt(m / 3); //当前季度 var qs = new Date(y, (q - 1) * 3, 1); //上一季度的开始日期 var qe = new Date(y, q * 3, 0); //上一季度的结束日期 // var currentDate = new Date() // var currentYear = currentDate.getFullYear() // // 上季度 // var currentMonth = currentDate.getMonth() - 3 // var start = '' // var end = '' // if (currentMonth == 0 || currentMonth == 1 || currentMonth == 2) { // /* 第一季度 */ // start = new Date(currentYear, 0, 1) // end = new Date(currentYear, 2, 31) // } // if (currentMonth == 3 || currentMonth == 4 || currentMonth == 5) { // /* 第二季度 */ // start = new Date(currentYear, 3, 1) // end = new Date(currentYear, 5, 30) // } // if (currentMonth == 6 || currentMonth == 7 || currentMonth == 8) { // /* 第三季度 */ // start = new Date(currentYear, 6, 1) // end = new Date(currentYear, 8, 30) // } // if ( // currentMonth == 9 || // currentMonth == 10 || // currentMonth == 11 // ) { // /* 第四季度 */ // start = new Date(currentYear, 9, 1) // end = new Date(currentYear, 11, 31) // } //end.setHours(23, 59, 59, 0) picker.$emit('pick', [qs, qe]) }, }, { text: "本年", onClick(picker) { const end = new Date(); const start = new Date().getFullYear(); const startYear = new Date(start, 0, 1); picker.$emit("pick", [startYear, end]); }, }, { text: "上年", onClick(picker) { //获取当前时间 let currentDate = new Date() //获得当前年份4位年 let currentYear = currentDate.getFullYear() - 1 //本年第一天 const start = new Date(currentYear, 0, 1) //本年最后一天 const end = new Date(currentYear, 11, 31) //end.setHours(23, 59, 59, 0) picker.$emit('pick', [start, end]) }, }, // { // text: "最近一周", // onClick(picker) { // const end = new Date(); // const start = new Date(); // start.setTime(start.getTime() - 3600 * 1000 * 24 * 7); // picker.$emit("pick", [start, end]); // }, // }, // { // text: "最近一个月", // onClick(picker) { // const end = new Date(); // const start = new Date(); // start.setTime(start.getTime() - 3600 * 1000 * 24 * 30); // picker.$emit("pick", [start, end]); // }, // }, // { // text: "最近三个月", // onClick(picker) { // const end = new Date(); // const start = new Date(); // start.setTime(start.getTime() - 3600 * 1000 * 24 * 90); // picker.$emit("pick", [start, end]); // }, // }, ], },
效果图
