根据所选年和所选第几周,得到所选的周的时间段

1.下拉菜单显示效果:选择年后,计算加载该年一共有多少个周。
在这里插入图片描述
选择了第几周后,显示该周的时间段。
在这里插入图片描述
前台结合Vue实现,下面是部分实现代码:

//下拉框
<div class="clearfix pd-10">
		<div style="width:25%;float: left;">
			<su-select id="year" name="year" placeholder="选择年" :data.sync="year" :select-value.sync="data.year" :data-source.sync="yearData"></su-select>
		</div>
		<div style="width:25%;float: left;">
			<su-select id="week" name="week" placeholder="选择周" :data.sync="week" :select-value.sync="data.week" :data-source.sync="weekData"></su-select>
		</div>
		<div style="width:50%;float: left;">
			<span class="pull-right fs-12 c-4a" style="font-size: 12pt;">{{data.tempYearMonth}}</span>
		</div>
</div>
//年份下拉
getFullYear:function(){
	var main = this;
	var date=new Date;
	//当前年
	var year=date.getFullYear(); 
	//上一年
	var prevYear = year - 1;
	var yearData = [
		{"value": prevYear + "","label": prevYear + "年","checked": null},
		{"value": year + "","label": year + "年","checked": null}
	];
	main.yearData = yearData;
},
data: function() {
			return {
				data:{
					year:'',
					month:'',
					tempYearMonth:'',
					counts:''
				},
				yearData:[],
				weekData:[],
				bdzTable:[],
			}
		},
		watch:{
		//监听年份下拉选择框,计算得周数
			'data.year':function(){
				var main = this;
				var param = {
					year: main.data.year,
				};
				$.ajax({
					type:"get",
					url:basePath + '/patrolinfo/getweekbyyear',
					data: param,
					success: function(data) {
						var temp = {};
						var tempweekData = [];
						for (var i = 0; i < data.weeks; i++) {
							temp = {"value": (i + 1) + "","label": "第" + (i + 1) + "周","checked": null};
							tempweekData.push(temp);
						}
						main.weekData = tempweekData;
					}
				});
			},

后台主要实现代码如下:
2.根据选中的年份,计算所选年包含多少个周

//根据年份得到所选年的周数
public Map<String, Object> getWeekByYear(Map<String, Object> param) {
	Map<String, Object> result = new HashMap<String, Object>();
	if (param.containsKey("year") && param.get("year") != null && !"".equals(param.get("year"))) {
		int year = Integer.parseInt(param.get("year").toString());
		Calendar c = new GregorianCalendar();
		c.set(year, Calendar.DECEMBER, 31, 23, 59, 59);
		Calendar d = new GregorianCalendar();
		d.setFirstDayOfWeek(Calendar.MONDAY);
		d.setMinimalDaysInFirstWeek(7);
		d.setTime(c.getTime());
		int weeks =  d.get(Calendar.WEEK_OF_YEAR);
		result.put("weeks", weeks);
	}
	return result;
}

3.获取所选周的时间段

public Map<String, Object> getYearWeekDay(Map<String, Object> param) {
	Map<String, Object> result = new HashMap<String, Object>();
	if(param.containsKey("year") && param.containsKey("week")){
		int year = Integer.parseInt(param.get("year").toString());
		int week = Integer.parseInt(param.get("week").toString());
		String yearWeekString = getStartDayOfWeek(year,week) + "-" + getEndDayOfWeek(year,week);
		result.put("yearweek", yearWeekString);
	}
	return result;
}

此处按周一为每周的开始,进行计算的。
cal.set(Calendar.DAY_OF_WEEK, Calendar.MONDAY);
(tempMonth < 10 ? “0” + tempMonth : tempMonth) 是为了将不足两位的数字补全,例如,6日显示为06日。

private String getStartDayOfWeek(int year, int week) {
	Calendar cal = Calendar.getInstance();
	cal.set(Calendar.DAY_OF_WEEK, Calendar.MONDAY);
	cal.set(Calendar.YEAR, year);
	cal.set(Calendar.WEEK_OF_YEAR, week);
	int tempMonth = cal.get(Calendar.MONTH) + 1;
	int tempDay = cal.get(Calendar.DAY_OF_MONTH);
	return cal.get(Calendar.YEAR) + "年" + (tempMonth < 10 ? "0" + tempMonth : tempMonth) + "月"
			+ (tempDay < 10 ? "0" + tempDay : tempDay) + "日";
}

private String getEndDayOfWeek(int year, int week) {
	Calendar cal = Calendar.getInstance();
	cal.set(Calendar.DAY_OF_WEEK, Calendar.MONDAY);
	cal.set(Calendar.YEAR, year);
	cal.set(Calendar.WEEK_OF_YEAR, week);
	cal.add(Calendar.DAY_OF_WEEK, 6);
	int tempMonth = cal.get(Calendar.MONTH) + 1;
	int tempDay = cal.get(Calendar.DAY_OF_MONTH);
	return cal.get(Calendar.YEAR) + "年" + (tempMonth < 10 ? "0" + tempMonth : tempMonth) + "月"
			+ (tempDay < 10 ? "0" + tempDay : tempDay) + "日";
}

猜你喜欢

转载自blog.csdn.net/jianxin1021/article/details/87920629