需求背景
项目中使用elementui日期选择器中的周选择器,默认为周一到周日,而非周日到周六
代码
日期选择器中:添加
:picker-options=“{ firstDayOfWeek: 1 }”
<hos-date-picker
v-model="form.model.time"
:picker-options="{ firstDayOfWeek: 1 }"
type="week"
format="yyyy 第 WW 周"
@change="weekChange"
placeholder="选择周"
>
</hos-date-picker>
在JS代码中添加
weekChange(val) {
this.form.model.timeRange = []
// 时间选择器按周
this.timeRange[0] = getMonday('s', 0, val)
this.timeRange[1] = getMonday('e', 0, val)
this.form.model.timeRange = this.timeRange
},
/*
方法:得到本周、上周、下周的起始、结束日期
参数:type为字符串类型,有两种选择,"s"代表开始,"e"代表结束,
dates为数字类型,不传或0代表本周,-1代表上
currentTime:当前时间Mon Apr 01 2024 00:00:00 GMT+0800 (GMT+08:00)
使用方法: console.log('本周结束日期',getDateFn.getMonday('e'));
console.log('上周开始日期',getDateFn.getMonday('s',-1))
*/
export function getMonday(type, dates,currentTime){
var now = currentTime || new Date();
console.log('now:',now);
var nowTime = now.getTime();
var day = now.getDay();
var longTime = 24 * 60 * 60 * 1000;
var n = longTime * 7 * (dates || 0);
if (type == "s") {
var dd = nowTime - (day-1) * longTime + n;
};
if (type == "e") {
var dd = nowTime + (7 - day) * longTime + n;
};
dd = new Date(dd);
var y = dd.getFullYear();
var m = dd.getMonth() + 1;
var d = dd.getDate();
m = m < 10 ? "0" + m: m;
d = d < 10 ? "0" + d: d;
var day = y + "-" + m + "-" + d;
return day;
}