项目实践--广告排期系统

最新推荐文章于 2024-01-19 19:56:35 发布

GP0071

最新推荐文章于 2024-01-19 19:56:35 发布

阅读量7.2k

点赞数

分类专栏：项目实践文章标签：广告排期

本文为博主原创文章，未经博主允许不得转载。个人博客：http://www.gaopeng0071.cn/

本文链接：https://blog.csdn.net/gaopeng0071/article/details/24420187

版权

项目实践专栏收录该内容

1 篇文章 0 订阅

订阅专栏

在对各种媒体广告进行投放时，投放系统中必备的就是一个广告的排期系统。

如CNZZ广告管家

我也参考此种展示方式开发了一套广告排期系统，如图

我的广告排期，与其他网上成型的有些不同，网站上的都对广告位进行一个排期表的展示，而我的排期系统，是针对广告的投放维度（如：时间、地域、频道、平台等），相对于广告位、时间的排期，我的排期要都以表格的形式展示，很难实现，因为是个多维度的表格，再一个就是维度很多，这样排列组合后的数据也很多，展示给客户他也会疯掉的。所以做成了上图所示，将多个维度做成以查询条件的形式，来进行查询，为了不局限于单一的维度，我这里可以有一个维度信息不录，比如：不录频道，那么就会自动排列北京、时间段1:00 ~6:00，所有频道，在5月份的一个排期情况。

在设计此功能，我将排期表展示与业务逻辑处理，分成了2部分，实现松耦合、高内聚的一个设计原理。这样在其他业务想使用排期时，只需要进行相关业务的代码编写，而不用改动排期相关的程序。

部分代码如下：

JSP页面，排期表的展示，详见55 - 57行，页面在后台进行的组装，前台直接获取展示。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<script language="javascript" type="text/javascript" src="<%=path %>/haier/AdPaiQi/paiQi.js"></script>
</head>
<body>
	<form name="fm" method="post">
		<input type="hidden" id="month" value="${advInfoVo.sel_month }" />
		<input type="hidden" id="year" value="${advInfoVo.sel_year }" />
		<table>
		<tr>
			<td>地域</td>
			<td>
				<!-- 省份 -->
				<div id="div1">
				  <s:select id="select1" name="advInfoVo.provice"
				  	style="width:100px" headerKey="" headerValue="请选择省"
				  	list="proviceList" listKey="proid" listValue="proname" οnchange="change_checkBox(this)" />
				</div>  
				<!-- 城市 -->
				<div id="div2">	
				  <s:select id="select2" name="advInfoVo.areaId"
				  	style="width:160px" headerKey="" headerValue="请选择市"
				  	list="createCityList" listKey="cid" listValue="cname" />
				</div>  
			</td>
		</tr>
		<tr>
			<td>频道</td>
			<td>
				<s:select name="advInfoVo.channelId" 
				  	style="width:300px" headerKey="" headerValue="请选择频道"
				  	list="advChannelMap" listKey="key" listValue="value" />
			</td>
		</tr>
		<tr>
			<td>时间段</td>
			<td>
				<s:select style="width:300px" 
			  	name="advInfoVo.timeFlag" list="advTimeMap" 
			  	listKey="key" listValue="value" headerKey="" headerValue="请选择时间段" />
			</td>
		</tr>
		<div id ="div_date"></div>
		</table>
		
		<table>
		<td>
		  <button type="button" οnclick="findPaiQi();">查询</button>
	  	</td>
		</table>
		
		<table>
		<%if(request.getAttribute("paiQiStr") == null) {}else{%>
			<%=request.getAttribute("paiQiStr") %>
		<%} %>
		</table>
		
	</form>
</body>

<style type="text/css">
.yangshi1{border:1px solid;cursor:hand;height:18px;width:18px;background-color:#C0FF3E;}
.yangshi2{border:1px solid;cursor:hand;height:18px;width:200px;}
.yangshi3{border:1px solid;cursor:hand;height:18px;width:18px;background-color:#FF0000;}
.yangshi4{border:1px solid;cursor:hand;height:18px;width:18px;}
</style>
<script type="text/javascript">
var d = new Date();
var year = d.getFullYear();
var month = d.getMonth()+1;
var day = d.getDate();
//年月日之间的分隔符
var splitStr="-";
//日期选择
var weekDays = new Array("日","一", "二", "三", "四", "五", "六"); 
var months = new Array("一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"); 
var lastDay = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31); 
cal(year, month);
initDate();
//构建日历框
function cal(thisYear, thisMonth) {
    var calendarDocument = "";
    calendarDocument += '<tr>';
    calendarDocument += '<td colspan="31" align="center">';
    //构建年份下拉框[1900-2099]年
    calendarDocument += "<select id ='sel_year' name='advInfoVo.sel_year' onChange='changeYM()'>";
    for (var i = 1900; i <= 2099; i++) {
        calendarDocument += "<option value=" + i + ">" + i + "</option>";
    }
    calendarDocument += "</select>";
    calendarDocument += "年";
    //构建月份下拉框
    calendarDocument += "<select id ='sel_month' name='advInfoVo.sel_month' onChange='changeYM()'>";
    for (var i = 1; i <= 12; i++) {
        calendarDocument += "<option value=" + i + ">" + i + "</option>";
    }
    calendarDocument += "</select>";
    calendarDocument += "月";
    calendarDocument += '</td>';
    calendarDocument += '</tr>';
    
    //将构建好的控件字符串追加给div
    document.getElementById('div_date').innerHTML = calendarDocument;
    //默认选择当前年
    document.getElementById('sel_year').value = thisYear;
    //默认选择当前月
    document.getElementById('sel_month').value = thisMonth;
}
//年月下拉框
function changeYM() {
    fullYear = document.getElementById('sel_year').value;
    fullMonth = document.getElementById('sel_month').value;
    cal(fullYear, fullMonth);
}

function findPaiQi(){
	fm.action = "findPaiQi.action";
	fm.submit();
}
function initDate(){
	if(document.getElementById("month").value != '' || document.getElementById("year").value != ''){
		document.getElementById('sel_month').value = document.getElementById("month").value;
		document.getElementById('sel_year').value = document.getElementById("year").value;
	}
}
</script>
</html>

java代码，其中包含调用业务逻辑、及排期生成方法。

	/**
	 * 获取广告排期
	 * 
	 * @return
	 */
	public String findPaiQi() throws Exception {

		ActionContext context = ActionContext.getContext();
		HttpServletResponse response = (HttpServletResponse) context
				.get(ServletActionContext.HTTP_RESPONSE);
		HttpServletRequest request = (HttpServletRequest) context
				.get(ServletActionContext.HTTP_REQUEST);

		int num = DateUtil.getDaysOfMonth(advInfoVo.getSel_year()
				+ advInfoVo.getSel_month());
		Map paiQiMap = new HashMap();
		// 查询广告信息 begin
		advInfoVo = getDateRange(advInfoVo);
		PageVo pageVo = adService.getAD(advInfoVo, null);
		List advInfoList = pageVo.getAdvInfoVoList();
		// 查询广告信息 end
		Map weiduOfMap = getLiveEpgWeiDu(advInfoList, advInfoVo.getAreaId(),
				advInfoVo.getChannelId(), advInfoVo.getTimeFlag(), num,
				advInfoVo);

		paiQiStr = paiQi(weiduOfMap, num);

		request.setAttribute("paiQiStr", paiQiStr);
		generateConditions();
		return SUCCESS;
	}

排期表生成方法，paiQi方法需要接受2个参数一个MAP（key：维度的组合，value：1个月所有天的投放情况），days表示这个月有多少天。

	/**
	 * 生成排期方法 不建议此方法中融合业务逻辑，仅做排期表生成处理。
	 * 
	 * @param paiQiMap
	 * @param days
	 * @return
	 * @throws Exception
	 */
	private String paiQi(Map<String, List> paiQiMap, int days) throws Exception {
		StringBuffer sb = new StringBuffer();
		// 构建排期表
		sb.append("<tr>");
		sb.append("<td class=\"yangshi2\" align=\"center\">日期</td>");
		for (int i = 1; i <= days; i++) {
			sb.append("<td class=\"yangshi4\" align=\"center\">" + i + "</td>");
		}
		sb.append("</tr>");

		String key = "";
		List valueList;
		boolean todayPaiQiBoolean;
		for (Map.Entry<String, List> entry : paiQiMap.entrySet()) {
			sb.append("<tr>");
			key = entry.getKey();
			valueList = entry.getValue();
			sb.append("<td class=\"yangshi2\">" + key + "</td>");
			int size = valueList.size();
			for (int i = 0; i < size; i++) {
				todayPaiQiBoolean = (Boolean) valueList.get(i);
				if (todayPaiQiBoolean) {
					sb.append("<td class=\"yangshi3\" align=\"center\"></td>");
				} else {
					sb.append("<td class=\"yangshi1\" align=\"center\"></td>");
				}

			}
			sb.append("</tr>");
		}
		return sb.toString();
	}

附上一张差不多的成品图

GP0071

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
2
评论
项目实践--广告排期系统

在对各种媒体广告进行投放时，投放系统中必备的就是一个广告的排期系统。如CNZZ广告管家我也参考此种展示方式开发了一套广告排期系统，如图我的广告排期，与其他网上成型的有些不同，网站上的都对广告位进行一个排期表的展示，而我的排期系统，是针对广告的投放维度（如：时间、地域、频道、平台等），相对于广告位、时间的排期，我的排期要都以表格的形式展示，很难实现，因为是个多维度
复制链接

扫一扫